diff --git a/CHANGELOG.md b/CHANGELOG.md index b9c77a58db3..13997eb103d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -6,6 +6,7 @@ - Close `EuiComboBox` `singleSelection` options list when option is choosen ([#645](https://github.com/elastic/eui/pull/645)) - Wrap `EuiHorizontalStep` text instead of truncating it ([#653](https://github.com/elastic/eui/pull/653)) - Fixed a bug where `EuiSideNavItem` wouldn't pass an `onClick` handler down to `` tags if they also had an `href`. ([#664](https://github.com/elastic/eui/pull/664)) +- Updated existing and added additional TypeScript definitions ([#666](https://github.com/elastic/eui/pull/666)) **Breaking changes** diff --git a/src/components/form/field_text/index.d.ts b/src/components/form/field_text/index.d.ts new file mode 100644 index 00000000000..9310374bd3d --- /dev/null +++ b/src/components/form/field_text/index.d.ts @@ -0,0 +1,28 @@ +/// + +import { SFC, InputHTMLAttributes } from 'react'; + +declare module '@elastic/eui' { + + /** + * text field type defs + * + * @see './field_text.js' + */ + export interface EuiFieldTextProps { + name?: string; + id?: string; + placeholder?: string; + value?: string; + defaultValue?: string; + icon?: string; + isInvalid?: boolean; + inputRef?: (ref: HTMLInputElement) => void; + fullWidth?: boolean; + isLoading?: boolean; + } + + export const EuiFieldText: SFC< + CommonProps & InputHTMLAttributes & EuiFieldTextProps + >; +} diff --git a/src/components/form/index.d.ts b/src/components/form/index.d.ts index 1c2d5c4b02e..5e67b76d2ba 100644 --- a/src/components/form/index.d.ts +++ b/src/components/form/index.d.ts @@ -1,5 +1,7 @@ /// +/// /// /// /// /// +/// diff --git a/src/components/form/text_area/index.d.ts b/src/components/form/text_area/index.d.ts new file mode 100644 index 00000000000..3e036332981 --- /dev/null +++ b/src/components/form/text_area/index.d.ts @@ -0,0 +1,26 @@ +/// + +import { SFC, TextareaHTMLAttributes } from 'react'; + +declare module '@elastic/eui' { + + /** + * @see './text_area.js' + */ + export interface EuiTextAreaProps { + id?: string; + name?: string; + placeholder?: string; + rows?: number; + isInvalid?: boolean; + fullWidth?: boolean; + onChange?: (event: any) => void; + value?: string; + defaultValue?: string; + inputRef?: (input: any) => void; + } + + export const EuiTextArea: SFC< + CommonProps & TextareaHTMLAttributes & EuiTextAreaProps + >; +} diff --git a/src/components/horizontal_rule/index.d.ts b/src/components/horizontal_rule/index.d.ts new file mode 100644 index 00000000000..59b58457eb5 --- /dev/null +++ b/src/components/horizontal_rule/index.d.ts @@ -0,0 +1,27 @@ +/// + +import { SFC, ReactNode, HTMLAttributes } from 'react'; + +declare module '@elastic/eui' { + + /** + * EuiHorizontalRule type defs + * + * @see './horizontal_rule.js' + */ + + export type EuiHorizontalRuleSize = 'full' | 'half' | 'quarter'; + + export type EuiHorizontalRuleMargin = 'none' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl'; + + export interface EuiHorizontalRuleProps { + children?: ReactNode; + size?: EuiHorizontalRuleSize; + margin?: EuiHorizontalRuleMargin; + } + + export const EuiHorizontalRule: SFC< + CommonProps & HTMLAttributes & EuiHorizontalRuleProps + >; + +} diff --git a/src/components/icon/index.d.ts b/src/components/icon/index.d.ts index b3645673c06..5330ac8ea21 100644 --- a/src/components/icon/index.d.ts +++ b/src/components/icon/index.d.ts @@ -3,12 +3,12 @@ import { SFC, SVGAttributes } from 'react'; declare module '@elastic/eui' { + /** * icon type defs * * @see './icon.js' */ - export type IconType = | 'addDataApp' | 'advancedSettingsApp' @@ -37,8 +37,13 @@ declare module '@elastic/eui' { | 'controlsVertical' | 'copy' | 'copyClipboard' + | 'createAdvancedJob' + | 'createMultiMetricJob' + | 'createPopulationJob' + | 'createSingleMetricJob' | 'cross' | 'dashboardApp' + | 'dataVisualizer' | 'devToolsApp' | 'discoverApp' | 'document' @@ -46,25 +51,36 @@ declare module '@elastic/eui' { | 'empty' | 'exit' | 'expand' + | 'exportAction' + | 'eyeClosed' + | 'eye' | 'faceHappy' | 'faceNeutral' | 'faceSad' | 'fullScreen' | 'gear' + | 'grab' | 'graphApp' | 'grid' | 'grokApp' + | 'heatmap' | 'help' | 'iInCircle' + | 'importAction' | 'indexClose' | 'indexEdit' | 'indexFlush' | 'indexMapping' | 'indexOpen' - | 'indexSettings' | 'indexPatternApp' - | 'inputOutput' + | 'indexSettings' | 'invert' + | 'inputOutput' + | 'kqlField' + | 'kqlOperand' + | 'kqlValue' + | 'kqlFunction' + | 'kqlSelector' | 'link' | 'list' | 'listAdd' @@ -73,17 +89,27 @@ declare module '@elastic/eui' { | 'logoApache' | 'logoBeats' | 'logoCloud' + | 'logoDocker' | 'logoElastic' | 'logoElasticSearch' | 'logoElasticStack' | 'logoGmail' + | 'logoGithub' | 'logoKibana' + | 'logoKubernetes' | 'logoLogstash' | 'logoMySQL' | 'logoNginx' + | 'logoRedis' + | 'logoSketch' | 'logoSlack' | 'logoWebhook' | 'logoXpack' + | 'logstashFilter' + | 'logstashIf' + | 'logstashInput' + | 'logstashOutput' + | 'logstashQueue' | 'machineLearningApp' | 'managementApp' | 'mapMarker' @@ -129,6 +155,7 @@ declare module '@elastic/eui' { | 'upgradeAssistantApp' | 'user' | 'usersRolesApp' + | 'vector' | 'visualizeApp' | 'watchesApp' | 'wrench'; @@ -153,7 +180,5 @@ declare module '@elastic/eui' { size?: IconSize; } - export const EuiIcon: SFC< - CommonProps & SVGAttributes & EuiIconProps - >; + export const EuiIcon: SFC & EuiIconProps>; } diff --git a/src/components/index.d.ts b/src/components/index.d.ts index d4d01305a17..f6eb23b62b7 100644 --- a/src/components/index.d.ts +++ b/src/components/index.d.ts @@ -16,3 +16,7 @@ /// /// /// +/// +/// +/// +/// diff --git a/src/components/loading/index.d.ts b/src/components/loading/index.d.ts index 5ae707dfee0..432ea3b7426 100644 --- a/src/components/loading/index.d.ts +++ b/src/components/loading/index.d.ts @@ -27,4 +27,16 @@ declare module '@elastic/eui' { }; export const EuiLoadingChart: SFC; + + + /** + * @see './loading_kibana.js' + */ + export interface EuiLoadingKibanaProps { + size: 'm' | 'l' | 'xl'; + } + + export const EuiLoadingKibana: SFC< + CommonProps & HTMLAttributes & EuiLoadingKibanaProps + >; } diff --git a/src/components/modal/index.d.ts b/src/components/modal/index.d.ts new file mode 100644 index 00000000000..7a12d6d1f61 --- /dev/null +++ b/src/components/modal/index.d.ts @@ -0,0 +1,77 @@ +/// + +import { SFC, ReactNode, HTMLAttributes } from 'react'; + +declare module '@elastic/eui' { + + import { HTMLAttributes } from 'react'; + + /** + * Modal type defs + * + * @see './modal.js' + */ + export interface EuiModalProps { + className?: string; + children?: ReactNode; + onClose: () => void; + } + + export const EuiModal: SFC< + CommonProps & HTMLAttributes & EuiModalProps + >; + + + /** + * @see './modal_body.js' + */ + export interface EuiModalBodyProps { + className?: string; + children?: ReactNode; + } + + export const EuiModalBody: SFC< + CommonProps & HTMLAttributes & EuiModalBodyProps + >; + + + /** + * @see './modal_footer.js' + */ + export interface EuiModalFooterProps { + className?: string; + children?: ReactNode; + } + + export const EuiModalFooter: SFC< + CommonProps & HTMLAttributes & EuiModalFooterProps + >; + + + /** + * @see './modal_header.js' + */ + export interface EuiModalHeaderProps { + className?: string; + children?: ReactNode; + } + + export const EuiModalHeader: SFC< + CommonProps & HTMLAttributes & EuiModalHeaderProps + >; + + + /** + * @see './modal_header_title.js' + */ + export interface EuiModalHeaderTitleProps { + className?: string; + children?: ReactNode; + } + + export const EuiModalHeaderTitle: SFC< + CommonProps & HTMLAttributes & EuiModalHeaderTitleProps + >; + + +} diff --git a/src/components/overlay_mask/index.d.ts b/src/components/overlay_mask/index.d.ts new file mode 100644 index 00000000000..3885f80b792 --- /dev/null +++ b/src/components/overlay_mask/index.d.ts @@ -0,0 +1,22 @@ +/// + +import { SFC, ReactNode, HTMLAttributes } from 'react'; + +declare module '@elastic/eui' { + + /** + * EuiOverlayMask type defs + * + * @see './overlay_mask.js' + */ + export interface EuiOverlayMaskProps { + className?: string, + children?: ReactNode, + onClick?: () => void; + } + + export const EuiOverlayMask: SFC< + CommonProps & HTMLAttributes & EuiOverlayMaskProps + >; + +} diff --git a/src/components/page/index.d.ts b/src/components/page/index.d.ts new file mode 100644 index 00000000000..6df8ec4f302 --- /dev/null +++ b/src/components/page/index.d.ts @@ -0,0 +1,130 @@ +/// + +import { SFC, ReactNode, HTMLAttributes } from 'react'; + +declare module '@elastic/eui' { + + /** + * @see './page.js' + */ + + export interface EuiPageProps { + children?: ReactNode; + } + + export const EuiPage: SFC< + CommonProps & HTMLAttributes & EuiPageProps + >; + + + /** + * @see ./page_header/page_header.js + */ + + export interface EuiPageHeaderProps { + children?: ReactNode; + } + + export const EuiPageHeader: SFC< + CommonProps & HTMLAttributes & EuiPageHeaderProps + >; + + + /** + * @see ./page_header/page_header_section.js + */ + + export interface EuiPageHeaderSectionProps { + children?: ReactNode; + } + + export const EuiPageHeaderSection: SFC< + CommonProps & HTMLAttributes & EuiPageHeaderSectionProps + >; + + + /** + * @see ./page_body/page_body.js + */ + + export namespace EuiPageBody { + export interface Props { + children?: ReactNode; + } + } + export const EuiPageBody: SFC< + CommonProps & HTMLAttributes & EuiPageBody.Props + >; + + + /** + * @see ./page_content/page_content.js + */ + + export type EuiPageContentPaddingSize = 'none' | 's' | 'm' | 'l'; + export type EuiPageContentVerticalPosition = 'center'; + export type EuiPageContentHorizontalPosition = 'center'; + + export interface EuiPageContentProps { + children?: ReactNode; + panelPaddingSize?: EuiPageContentPaddingSize; + verticalPosition?: EuiPageContentVerticalPosition; + horizontalPosition?: EuiPageContentHorizontalPosition; + } + + export const EuiPageContent: SFC< + CommonProps & EuiPanelProps & EuiPageContentProps + >; + + + /** + * @see ./page_content/page_content_body.js + */ + + export interface EuiPageContentBodyProps { + children?: ReactNode; + } + + export const EuiPageContentBody: SFC< + CommonProps & HTMLAttributes & EuiPageContentBodyProps + >; + + + /** + * @see ./page_content/page_content_header.js + */ + + export interface EuiPageContentHeaderProps { + children?: ReactNode; + } + + export const EuiPageContentHeader: SFC< + CommonProps & HTMLAttributes & EuiPageContentHeaderProps + >; + + + /** + * @see ./page_content/page_content_header_section.js + */ + + export interface EuiPageContentHeaderSectionProps { + children?: ReactNode; + } + + export const EuiPageContentHeaderSection: SFC< + CommonProps & HTMLAttributes & EuiPageContentHeaderSectionProps + >; + + /** + * @see ./page_side_bar/page_side_bar.js + */ + + export interface EuiPageSideBarProps { + children?: ReactNode; + } + + export const EuiPageSideBar: SFC< + CommonProps & HTMLAttributes & EuiPageSideBarProps + >; + +}