From d1268ea55a90b8683075df88f929ef0844d3e66e Mon Sep 17 00:00:00 2001 From: Rory Hunter Date: Wed, 24 Oct 2018 21:05:36 +0100 Subject: [PATCH] Add TypeScript definitions for `EuiConfirmModal` (#1260) * TS defs for `EuiConfirmModal` and `EuiFieldPassword` Plus numerous definition fixes * Remove AnyProps as it's unused * Update src/components/table/index.d.ts --- CHANGELOG.md | 5 +-- src/components/common.d.ts | 2 -- src/components/flex/index.d.ts | 6 ++-- src/components/form/field_password/index.d.ts | 1 + src/components/icon/index.d.ts | 3 +- src/components/modal/index.d.ts | 35 ++++++++++++++++++- src/components/table/index.d.ts | 5 ++- 7 files changed, 45 insertions(+), 12 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index fb1f1b4bf05..ad0982434df 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,13 +1,14 @@ ## [`master`](https://github.com/elastic/eui/tree/master) -No public interface changes since `4.6.0`. +**Bug fixes** - Added TypeScript definitions for `EuiFieldPassword`. ([#1255](https://github.com/elastic/eui/pull/1255)) +- Added TypeScript definitions for `EuiConfirmModal`, remove `AnyProps`, and several definition fixes ([#1260](https://github.com/elastic/eui/pull/1260)) ## [`4.6.0`](https://github.com/elastic/eui/tree/v4.6.0) - Increased default font size of tabs in K6 theme ([#1244](https://github.com/elastic/eui/pull/1244)) - + **Bug fixes** - Fixed select warning on falsy value in EuiSelect ([#1254](https://github.com/elastic/eui/pull/1254)) diff --git a/src/components/common.d.ts b/src/components/common.d.ts index 98126b664f4..20491a3b09f 100644 --- a/src/components/common.d.ts +++ b/src/components/common.d.ts @@ -1,6 +1,4 @@ declare module '@elastic/eui' { - export type AnyProps = { [key: string]: string }; - export interface CommonProps { className?: string; 'aria-label'?: string; diff --git a/src/components/flex/index.d.ts b/src/components/flex/index.d.ts index cf79402b939..fc88b1e7ea7 100644 --- a/src/components/flex/index.d.ts +++ b/src/components/flex/index.d.ts @@ -10,10 +10,10 @@ declare module '@elastic/eui' { */ export type FlexGridGutterSize = 'none' | 's' | 'm' | 'l' | 'xl'; - export type FlexGridColumns = 0 | 2 | 3 | 4; + export type FlexGridColumns = 0 | 1 | 2 | 3 | 4; export interface EuiFlexGridProps { - columns: FlexGridColumns; + columns?: FlexGridColumns; gutterSize?: FlexGridGutterSize; } @@ -46,7 +46,7 @@ declare module '@elastic/eui' { | 'spaceBetween' | 'spaceAround' | 'spaceEvenly'; - + export interface EuiFlexGroupProps { alignItems?: FlexGroupAlignItems; children?: React.ReactNode; diff --git a/src/components/form/field_password/index.d.ts b/src/components/form/field_password/index.d.ts index 2dcaa48d07b..e8113b8d2a9 100644 --- a/src/components/form/field_password/index.d.ts +++ b/src/components/form/field_password/index.d.ts @@ -14,6 +14,7 @@ declare module '@elastic/eui' { inputRef?: Ref; fullWidth?: boolean; isLoading?: boolean; + compressed?: boolean; } export const EuiFieldPassword: SFC< diff --git a/src/components/icon/index.d.ts b/src/components/icon/index.d.ts index 2f06a36b670..25e7e427996 100644 --- a/src/components/icon/index.d.ts +++ b/src/components/icon/index.d.ts @@ -246,7 +246,8 @@ declare module '@elastic/eui' { | 'subdued' | 'success' | 'text' - | 'warning'; + | 'warning' + | string; export interface EuiIconProps { type?: IconType; diff --git a/src/components/modal/index.d.ts b/src/components/modal/index.d.ts index 50c905554ae..290350a98a5 100644 --- a/src/components/modal/index.d.ts +++ b/src/components/modal/index.d.ts @@ -1,6 +1,7 @@ /// +/// -import { SFC, HTMLAttributes } from 'react'; +import { ReactNode, SFC, HTMLAttributes } from 'react'; declare module '@elastic/eui' { @@ -57,5 +58,37 @@ declare module '@elastic/eui' { CommonProps & HTMLAttributes >; + /** + * Confirm modal type defs + * + * @see './confirm_modal.js' + */ + + // index.js re-exports values from confirm_modal.js with these names. + export const EUI_MODAL_CONFIRM_BUTTON: 'confirm'; + export const EUI_MODAL_CANCEL_BUTTON: 'cancel'; + + export interface EuiConfirmModalProps { + buttonColor?: ButtonColor; + cancelButtonText?: ReactNode; + confirmButtonText?: ReactNode; + defaultFocusedButton?: 'confirm' | 'cancel'; + title?: ReactNode; + onCancel?: () => void; + onConfirm?: () => void; + /** + * Sets the max-width of the modal, + * set to `true` to use the default size, + * set to `false` to not restrict the width, + * set to a number for a custom width in px, + * set to a string for a custom width in custom measurement. + */ + maxWidth?: boolean | number | string; + } + + // `title` from the React defs conflicts with our definition above + export const EuiConfirmModal: SFC< + CommonProps & Omit, 'title'> & EuiConfirmModalProps + >; } diff --git a/src/components/table/index.d.ts b/src/components/table/index.d.ts index fd8f2c96ac8..b22b9cccae5 100644 --- a/src/components/table/index.d.ts +++ b/src/components/table/index.d.ts @@ -22,6 +22,7 @@ declare module '@elastic/eui' { export interface EuiTableProps { compressed?: boolean; + responsive?: boolean; } export const EuiTable: SFC< @@ -121,9 +122,7 @@ declare module '@elastic/eui' { } export const EuiTableRow: SFC< - CommonProps & - AnyProps & // at least according to the contract of table_row.js - EuiTableRowProps + CommonProps & EuiTableRowProps & HTMLAttributes >; /**