@digital-ai/dot-components 1.2.1 → 1.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -17,6 +17,8 @@ export interface AppToolbarProps extends CommonProps {
17
17
  children?: ReactNode;
18
18
  /** Allow to display custom logo */
19
19
  customLogo?: ReactNode;
20
+ /** If true, the spacing and height will be shorter */
21
+ dense?: boolean;
20
22
  /** If provided will overwrite `mainMenuItems` and display within the main menu drawer */
21
23
  mainMenu?: ReactNode;
22
24
  /** If provided will display the menu items within the main menu drawer */
@@ -26,4 +28,4 @@ export interface AppToolbarProps extends CommonProps {
26
28
  /** Array of nav items to be displayed on the right side */
27
29
  navItems?: Array<IconButtonProps>;
28
30
  }
29
- export declare const DotAppToolbar: ({ appName, appLogo, appLogoSmall, ariaLabel, avatar, borderColor, children, className, customLogo, "data-testid": dataTestId, navItems, mainMenu, mainMenuItems, mainMenuWidth, }: AppToolbarProps) => JSX.Element;
31
+ export declare const DotAppToolbar: ({ appName, appLogo, appLogoSmall, ariaLabel, avatar, borderColor, children, className, customLogo, "data-testid": dataTestId, dense, navItems, mainMenu, mainMenuItems, mainMenuWidth, }: AppToolbarProps) => JSX.Element;
@@ -1,4 +1,5 @@
1
1
  /// <reference types="react" />
2
2
  export declare const rootClassName = "dot-app-toolbar";
3
+ export declare const denseClassName = "dense";
3
4
  export declare const StyledMainMenu: import("styled-components").StyledComponent<({ anchor, ariaLabel, className, children, "data-testid": dataTestId, height, ModalProps, onClose, open, PaperProps, variant, width, }: import("../drawer/Drawer").DrawerProps) => JSX.Element, any, {}, never>;
4
5
  export declare const StyledAppToolbar: import("styled-components").StyledComponent<"header", any, {}, never>;
@@ -0,0 +1,11 @@
1
+ /// <reference types="react" />
2
+ import { CommonProps } from '../CommonProps';
3
+ import { DynamicFormConfig, DynamicFormOutputData, DynamicFormState } from './models';
4
+ export interface DynamicFormProps extends CommonProps {
5
+ config: DynamicFormConfig;
6
+ disabled?: boolean;
7
+ liveValidation?: boolean;
8
+ onChange?: (formData: DynamicFormState) => void;
9
+ onSubmit?: (formData: DynamicFormOutputData) => void;
10
+ }
11
+ export declare const DotDynamicForm: ({ ariaLabel, className, "data-testid": dataTestId, config, disabled, liveValidation, onChange, onSubmit, }: DynamicFormProps) => JSX.Element;
@@ -0,0 +1,2 @@
1
+ export declare const rootClassName = "dot-dynamic-form";
2
+ export declare const StyledDynamicForm: import("styled-components").StyledComponent<"div", any, {}, never>;
@@ -0,0 +1,4 @@
1
+ import { DynamicFormControlType, DynamicFormStateItem } from './models';
2
+ export declare const DATA_CONTROLS: DynamicFormControlType[];
3
+ export declare const DATA_CONTROLS_WITHOUT_VALIDATION: DynamicFormControlType[];
4
+ export declare const INITIAL_STATE_ITEM: DynamicFormStateItem;
@@ -0,0 +1,38 @@
1
+ import { ChangeEvent } from 'react';
2
+ import { DynamicFormConfig, DynamicFormControlProps, DynamicFormOutputData, DynamicFormState, DynamicFormStateData, HiddenControl } from './models';
3
+ import { AutoCompleteValue } from '../auto-complete/AutoComplete';
4
+ import { CheckboxProps } from '../checkbox/Checkbox';
5
+ declare type AutoCompleteChangeHandler = (controlName: string) => (e: ChangeEvent<HTMLInputElement>, value: AutoCompleteValue) => void;
6
+ declare type ChangeHandler = (controlName: string) => (e: ChangeEvent<HTMLInputElement>) => void;
7
+ declare type CheckboxGroupChangeHandler = (controlName: string) => (event: ChangeEvent<HTMLInputElement>, value: CheckboxProps[]) => void;
8
+ export interface InputBaseArgs {
9
+ controlProps: DynamicFormControlProps;
10
+ disabled?: boolean;
11
+ index: number;
12
+ liveValidation: boolean;
13
+ }
14
+ export interface ControlledInputArgs extends InputBaseArgs {
15
+ controlName: string;
16
+ formData: DynamicFormStateData;
17
+ handleChange: AutoCompleteChangeHandler | ChangeHandler | CheckboxGroupChangeHandler;
18
+ }
19
+ export interface UncontrolledInputArgs extends InputBaseArgs {
20
+ formState?: DynamicFormState;
21
+ handleClick?: () => void;
22
+ }
23
+ export declare const getControlValue: <T extends unknown>(controlName: string, data: DynamicFormStateData) => T;
24
+ export declare const checkIfHiddenControl: (hidden: HiddenControl, formValues: DynamicFormOutputData) => boolean;
25
+ export declare const getInitialFormState: (config: DynamicFormConfig, liveValidation: boolean) => DynamicFormState;
26
+ export declare const getOutputFormData: (formState: DynamicFormState) => DynamicFormOutputData;
27
+ export declare const getFormDataFromInitialValues: (config: DynamicFormConfig) => DynamicFormOutputData;
28
+ export declare const buildInputTextControl: ({ controlName, controlProps, disabled, formData, handleChange, index, }: ControlledInputArgs) => JSX.Element;
29
+ export declare const buildInputSelectControl: ({ controlName, controlProps, disabled, formData, handleChange, index, }: ControlledInputArgs) => JSX.Element;
30
+ export declare const buildAutocompleteControl: ({ controlName, controlProps, disabled, formData, handleChange, index, }: ControlledInputArgs) => JSX.Element;
31
+ export declare const buildRadioGroupControl: ({ controlName, controlProps, disabled, formData, handleChange, index, }: ControlledInputArgs) => JSX.Element;
32
+ export declare const buildCheckboxControl: ({ controlName, controlProps, disabled, formData, handleChange, index, }: ControlledInputArgs) => JSX.Element;
33
+ export declare const buildCheckboxGroupControl: ({ controlName, controlProps, disabled, formData, handleChange, index, }: ControlledInputArgs) => JSX.Element;
34
+ export declare const buildSwitchControl: ({ controlName, controlProps, disabled, formData, handleChange, index, }: ControlledInputArgs) => JSX.Element;
35
+ export declare const buildButtonControl: ({ controlProps, disabled, index, }: UncontrolledInputArgs) => JSX.Element;
36
+ export declare const buildResetControl: ({ controlProps, disabled, handleClick, index, }: UncontrolledInputArgs) => JSX.Element;
37
+ export declare const buildSubmitControl: ({ controlProps, disabled, formState, index, liveValidation, }: UncontrolledInputArgs) => JSX.Element;
38
+ export {};
@@ -0,0 +1,68 @@
1
+ import { ReactNode } from 'react';
2
+ import { AutoCompleteProps } from '../auto-complete/AutoComplete';
3
+ import { ButtonProps } from '../button/Button';
4
+ import { CheckboxProps } from '../checkbox/Checkbox';
5
+ import { InputTextProps } from '../input-form-fields/InputText';
6
+ import { InputSelectProps } from '../input-form-fields/InputSelect';
7
+ import { CheckboxGroupProps } from '../checkbox/CheckboxGroup';
8
+ import { RadioGroupProps } from '../radio/RadioGroup';
9
+ import { SwitchProps } from '../switch/Switch';
10
+ export declare type DynamicFormControlType = 'dot-input-text' | 'dot-input-select' | 'dot-checkbox' | 'dot-checkbox-group' | 'dot-autocomplete' | 'dot-button' | 'dot-radio-group' | 'dot-reset' | 'dot-submit' | 'dot-switch' | 'custom-element';
11
+ export declare type DynamicFormControlProps = AutoCompleteProps | InputTextProps | InputSelectProps | CheckboxProps | CheckboxGroupProps | ButtonProps | RadioGroupProps | SwitchProps;
12
+ export interface DynamicFormOutputData {
13
+ [key: string]: unknown;
14
+ }
15
+ export declare type ConditionFunction = (formValues: DynamicFormOutputData) => boolean;
16
+ export declare type HiddenControl = boolean | ConditionFunction;
17
+ export interface DynamicFormControl {
18
+ controlName?: string;
19
+ controlType: DynamicFormControlType;
20
+ controlProps?: DynamicFormControlProps;
21
+ initialValue?: unknown;
22
+ validation?: DynamicFormValidation;
23
+ customElement?: ReactNode;
24
+ hidden?: HiddenControl;
25
+ }
26
+ export interface FieldValidation {
27
+ isValid: boolean;
28
+ errorMessage: string | null;
29
+ }
30
+ export interface DynamicFormConfig {
31
+ controls: DynamicFormControl[];
32
+ }
33
+ export interface ValidationField {
34
+ condition?: ConditionFunction;
35
+ errorMessage: string;
36
+ }
37
+ export interface IsRequired extends ValidationField {
38
+ value: boolean;
39
+ }
40
+ export interface Length extends ValidationField {
41
+ value: number;
42
+ }
43
+ export interface DynamicFormValidation {
44
+ isRequired?: IsRequired;
45
+ minLength?: Length;
46
+ maxLength?: Length;
47
+ customValidator?: (value: unknown) => FieldValidation;
48
+ }
49
+ export interface DynamicFormStateItem {
50
+ value: unknown;
51
+ isValid: boolean;
52
+ isTouched: boolean;
53
+ errorMessage: string;
54
+ hidden?: HiddenControl;
55
+ }
56
+ export interface DynamicFormState {
57
+ data: DynamicFormStateData;
58
+ isValid: boolean;
59
+ }
60
+ export interface DynamicFormStateData {
61
+ [key: string]: DynamicFormStateItem;
62
+ }
63
+ export interface FormStateUpdateArgs {
64
+ controlName: string;
65
+ newValue: unknown;
66
+ formConfig: DynamicFormConfig;
67
+ validate?: boolean;
68
+ }
@@ -0,0 +1,4 @@
1
+ import { DynamicFormConfig, DynamicFormOutputData, DynamicFormState } from './models';
2
+ export declare const sampleMiddleNameHiddenFn: (formValues: DynamicFormOutputData) => boolean;
3
+ export declare const getSampleConfig: () => DynamicFormConfig;
4
+ export declare const getSampleFormState: () => DynamicFormState;
@@ -0,0 +1,25 @@
1
+ import { DynamicFormConfig, DynamicFormOutputData, DynamicFormState, DynamicFormValidation, FieldValidation, ValidationField } from './models';
2
+ export declare const checkIfValidationApplies: (validationField: ValidationField, formValues: DynamicFormOutputData) => boolean;
3
+ export declare const checkIfEmptyValue: (value: unknown) => boolean;
4
+ export declare const checkIfString: (value: unknown) => boolean;
5
+ export declare const checkIfEmptyString: (value: string) => boolean;
6
+ export declare const checkIfArray: (value: unknown) => boolean;
7
+ export declare const checkIfEmptyArray: (value: Array<unknown>) => boolean;
8
+ export declare const checkIfStringRequiredInvalid: (value: string, validation: DynamicFormValidation, formValues: DynamicFormOutputData) => boolean;
9
+ export declare const checkIfArrayRequiredInvalid: (value: unknown[], validation: DynamicFormValidation, formValues: DynamicFormOutputData) => boolean;
10
+ export declare const checkIfMinLengthInvalid: (value: string | unknown[], validation: DynamicFormValidation, formValues: DynamicFormOutputData) => boolean;
11
+ export declare const checkIfMaxLengthInvalid: (value: string | unknown[], validation: DynamicFormValidation, formValues: DynamicFormOutputData) => boolean;
12
+ export declare const getInvalidFieldValidation: (errorMessage: string) => FieldValidation;
13
+ export declare const getRequiredFieldValidationError: (validation: DynamicFormValidation) => FieldValidation;
14
+ export declare const getMinLengthFieldValidationError: (validation: DynamicFormValidation) => FieldValidation;
15
+ export declare const getMaxLengthFieldValidationError: (validation: DynamicFormValidation) => FieldValidation;
16
+ export declare const getEmptyValueValidationError: (validation: DynamicFormValidation, formValues: DynamicFormOutputData) => FieldValidation | null;
17
+ export declare const getStringValidationError: (value: string, validation: DynamicFormValidation, formValues: DynamicFormOutputData) => FieldValidation | null;
18
+ export declare const getArrayValidationError: (array: unknown[], validation: DynamicFormValidation, formValues: DynamicFormOutputData) => FieldValidation | null;
19
+ export declare const getCustomValidationError: (value: unknown, validation: DynamicFormValidation) => {
20
+ isValid: boolean;
21
+ errorMessage: string;
22
+ };
23
+ export declare const getFieldValidation: (value: unknown, validation: DynamicFormValidation, formValues: DynamicFormOutputData) => FieldValidation;
24
+ export declare const getControlValidationFromConfig: (controlName: string, config: DynamicFormConfig) => DynamicFormValidation | undefined;
25
+ export declare const checkIfFormDataValid: (formState: DynamicFormState) => boolean;
@@ -3,19 +3,19 @@ export { DotActionToolbar } from './action-toolbar/ActionToolbar';
3
3
  export { DotAlertBanner } from './alert-banner/AlertBanner';
4
4
  export { DotAppLogo } from './app-logo/AppLogo';
5
5
  export { DotAppToolbar, AppToolbarProps } from './app-toolbar/AppToolbar';
6
- export { AutoCompleteOption, DotAutoComplete, AutoCompleteValue, parseAutoCompleteValue, } from './auto-complete/AutoComplete';
6
+ export { AutoCompleteOption, AutoCompleteProps, DotAutoComplete, AutoCompleteValue, parseAutoCompleteValue, } from './auto-complete/AutoComplete';
7
7
  export { AvatarProps, DotAvatar } from './avatar/Avatar';
8
8
  export { DotAvatarGroup } from './avatar-group/AvatarGroup';
9
9
  export { DotBadge } from './badge/Badge';
10
10
  export { BreadcrumbItem, DotBreadcrumbs } from './breadcrumbs/Breadcrumbs';
11
- export { DotButton } from './button/Button';
11
+ export { DotButton, ButtonProps } from './button/Button';
12
12
  export { DotButtonToggle } from './button-toggle/ButtonToggle';
13
13
  export { DotCard } from './card/Card';
14
14
  export { DotCardContent } from './card/CardContent';
15
15
  export { DotCardFooter } from './card/CardFooter';
16
16
  export { DotCardHeader } from './card/CardHeader';
17
17
  export { CheckboxProps, DotCheckbox } from './checkbox/Checkbox';
18
- export { DotCheckboxGroup } from './checkbox/CheckboxGroup';
18
+ export { DotCheckboxGroup, CheckboxGroupProps } from './checkbox/CheckboxGroup';
19
19
  export { DotChip } from './chip/Chip';
20
20
  export { DotConfirmationDialog } from './confirmation-dialog/ConfirmationDialog';
21
21
  export { Cell, CssCell } from './css-grid/CssCell';
@@ -26,11 +26,13 @@ export { DotDrawer } from './drawer/Drawer';
26
26
  export { DotEmptyState } from './empty-state/EmptyState';
27
27
  export { DotForm } from './form/Form';
28
28
  export { DotFormGroup } from './form-group/FormGroup';
29
+ export { DotDynamicForm, DynamicFormProps } from './dynamic-form/DynamicForm';
30
+ export { DynamicFormConfig, DynamicFormOutputData, DynamicFormState, FieldValidation, } from './dynamic-form/models';
29
31
  export { DotIcon } from './icon/Icon';
30
32
  export { DotIconButton, IconButtonProps } from './button/IconButton';
31
33
  export { DotInlineEdit } from './inline-edit/InlineEdit';
32
- export { DotInputText } from './input-form-fields/InputText';
33
- export { DotInputSelect } from './input-form-fields/InputSelect';
34
+ export { DotInputText, InputTextProps } from './input-form-fields/InputText';
35
+ export { DotInputSelect, InputSelectProps, } from './input-form-fields/InputSelect';
34
36
  export { DotLink } from './link/Link';
35
37
  export { DotList, ListItemProps } from './list/List';
36
38
  export { DotMenu, MenuItemProps } from './menu/Menu';
@@ -38,13 +40,13 @@ export { DotNavigationRail, RailItem } from './navigation-rail/NavigationRail';
38
40
  export { DotPill } from './pill/Pill';
39
41
  export { DotProgress } from './progress/Progress';
40
42
  export { DotRadioButton, RadioButtonProps } from './radio/RadioButton';
41
- export { DotRadioGroup } from './radio/RadioGroup';
43
+ export { DotRadioGroup, RadioGroupProps } from './radio/RadioGroup';
42
44
  export { BackItemProps, DotSidebar, SidebarProps } from './sidebar/Sidebar';
43
45
  export { DotSkeleton } from './skeleton/Skeleton';
44
46
  export { DotSnackbar } from './snackbar/Snackbar';
45
47
  export { DotSnackbarContainer, DotSnackbarProvider, useDotSnackbarContext, } from './snackbar/SnackbarProvider';
46
48
  export { DotSplitButton } from './split-button/SplitButton';
47
- export { DotSwitch } from './switch/Switch';
49
+ export { DotSwitch, SwitchProps } from './switch/Switch';
48
50
  export { DotTable, TableRowProps } from './table/Table';
49
51
  export { DotTooltip } from './tooltip/Tooltip';
50
52
  export { Order } from './table/TableBody';
@@ -1,6 +1,9 @@
1
1
  /// <reference types="react" />
2
2
  import { InputProps } from './InputFormFields.propTypes';
3
+ export declare const DELAY_MS = 300;
3
4
  export interface InputTextProps extends InputProps {
5
+ /** If true, the input will use debounce functionality. **/
6
+ hasDebounce?: boolean;
4
7
  /** if multiline it wil render multiple lines */
5
8
  multiline?: boolean;
6
9
  /** Placeholder text always displayed inside the input field */
@@ -14,4 +17,4 @@ export interface InputTextProps extends InputProps {
14
17
  /** value of the InputText */
15
18
  value?: string;
16
19
  }
17
- export declare const DotInputText: ({ autoFocus, className, defaultValue, "data-testid": dataTestId, disabled, error, fullWidth, helperText, endIcon, id, inputRef, label, multiline, name, onChange, placeholder, readOnly, required, rows, rowsMax, startIcon, size, type, value, warning, }: InputTextProps) => JSX.Element;
20
+ export declare const DotInputText: ({ autoFocus, className, defaultValue, "data-testid": dataTestId, disabled, error, fullWidth, hasDebounce, helperText, endIcon, id, inputRef, label, multiline, name, onChange, placeholder, readOnly, required, rows, rowsMax, startIcon, size, type, value, warning, }: InputTextProps) => JSX.Element;
@@ -12,9 +12,12 @@ export interface MenuProps extends CommonProps {
12
12
  id: string;
13
13
  /** If true, will display a loading indicator in the menu */
14
14
  loading?: boolean;
15
+ /** Maximum number of visible menu items */
15
16
  maxVisibleItems?: number;
16
17
  /** Array of items to be displayed inside the menu */
17
18
  menuItems: Array<MenuItemProps>;
19
+ /** Used to specify height of each menu item when custom component */
20
+ menuItemHeight?: number;
18
21
  /** Determines the placement of the menu */
19
22
  menuPlacement?: PopperPlacement;
20
23
  /** If true, the menu is open. */
@@ -34,4 +37,4 @@ export interface MenuItemProps {
34
37
  /** A key that can be used to determine which item was clicked */
35
38
  key?: string;
36
39
  }
37
- export declare const DotMenu: ({ anchorEl, ariaLabel, className, "data-testid": dataTestId, dense, disablePortal, id, loading, maxVisibleItems, menuItems, menuPlacement, onLeave, onSelect, open, }: MenuProps) => JSX.Element;
40
+ export declare const DotMenu: ({ anchorEl, ariaLabel, className, "data-testid": dataTestId, dense, disablePortal, id, loading, maxVisibleItems, menuItemHeight, menuItems, menuPlacement, onLeave, onSelect, open, }: MenuProps) => JSX.Element;
@@ -1,4 +1,4 @@
1
1
  /// <reference types="react" />
2
2
  export declare const rootClassName = "dot-split-button-group";
3
3
  export declare const StyledSplitButtonGroup: import("styled-components").StyledComponent<import("@material-ui/core/OverridableComponent").OverridableComponent<import("@material-ui/core").ButtonGroupTypeMap<{}, "div">>, any, {}, never>;
4
- export declare const StyledMenu: import("styled-components").StyledComponent<({ anchorEl, ariaLabel, className, "data-testid": dataTestId, dense, disablePortal, id, loading, maxVisibleItems, menuItems, menuPlacement, onLeave, onSelect, open, }: import("../menu/Menu").MenuProps) => JSX.Element, any, {}, never>;
4
+ export declare const StyledMenu: import("styled-components").StyledComponent<({ anchorEl, ariaLabel, className, "data-testid": dataTestId, dense, disablePortal, id, loading, maxVisibleItems, menuItemHeight, menuItems, menuPlacement, onLeave, onSelect, open, }: import("../menu/Menu").MenuProps) => JSX.Element, any, {}, never>;
@@ -36,11 +36,9 @@ export declare const defaultData: ({
36
36
  hometown: string;
37
37
  fans: number;
38
38
  delete: {
39
- actions: {
40
- children: JSX.Element;
41
- key: string;
42
- onclick: () => void;
43
- }[];
39
+ children: JSX.Element;
40
+ key: string;
41
+ onclick: () => void;
44
42
  }[];
45
43
  };
46
44
  } | {
@@ -50,11 +48,9 @@ export declare const defaultData: ({
50
48
  hometown: string;
51
49
  fans: number;
52
50
  delete: {
53
- actions: {
54
- children: JSX.Element;
55
- key: string;
56
- onclick: () => void;
57
- }[];
51
+ children: JSX.Element;
52
+ key: string;
53
+ onclick: () => void;
58
54
  }[];
59
55
  };
60
56
  selected?: undefined;
@@ -3,4 +3,4 @@ import { Paper } from '@material-ui/core';
3
3
  export declare const rootClassName = "dot-table";
4
4
  export declare const StyledPaper: import("styled-components").StyledComponent<typeof Paper, any, {}, never>;
5
5
  export declare const StyledTableContainer: import("styled-components").StyledComponent<import("@material-ui/core/OverridableComponent").OverridableComponent<import("@material-ui/core").TableContainerTypeMap<{}, "div">>, any, {}, never>;
6
- export declare const StyledMenu: import("styled-components").StyledComponent<({ anchorEl, ariaLabel, className, "data-testid": dataTestId, dense, disablePortal, id, loading, maxVisibleItems, menuItems, menuPlacement, onLeave, onSelect, open, }: import("../menu/Menu").MenuProps) => JSX.Element, any, {}, never>;
6
+ export declare const StyledMenu: import("styled-components").StyledComponent<({ anchorEl, ariaLabel, className, "data-testid": dataTestId, dense, disablePortal, id, loading, maxVisibleItems, menuItemHeight, menuItems, menuPlacement, onLeave, onSelect, open, }: import("../menu/Menu").MenuProps) => JSX.Element, any, {}, never>;
@@ -1,15 +1,16 @@
1
- /// <reference types="react" />
1
+ import { ReactNode } from 'react';
2
2
  import { CommonProps } from '../CommonProps';
3
3
  export declare type textAlignment = 'center' | 'inherit' | 'justify' | 'left' | 'right';
4
4
  export interface CellProps extends CommonProps {
5
5
  align?: textAlignment;
6
+ cellKey?: string;
6
7
  colspan?: number;
7
8
  id?: string;
8
9
  noWrap?: boolean;
9
10
  value?: any;
10
- onActionMenuTrigger?: (el: HTMLElement, menuItem: []) => void;
11
+ onActionMenuTrigger?: (el: HTMLElement, menuItem: Array<ReactNode>) => void;
11
12
  }
12
13
  /**
13
14
  * A wrapper component around the TableCell component from @material-ui.
14
15
  */
15
- export declare const DotBodyCell: ({ ariaLabel, align, className, colspan, "data-testid": dataTestId, noWrap, value, onActionMenuTrigger, }: CellProps) => JSX.Element;
16
+ export declare const DotBodyCell: ({ ariaLabel, align, cellKey, className, colspan, "data-testid": dataTestId, noWrap, value, onActionMenuTrigger, }: CellProps) => JSX.Element;
@@ -1,4 +1,4 @@
1
- import { MouseEvent } from 'react';
1
+ import { MouseEvent, ReactNode } from 'react';
2
2
  import { DotColumnHeader } from './TableHeader';
3
3
  import { CommonProps } from '../CommonProps';
4
4
  import { TableRowProps } from './Table';
@@ -12,9 +12,11 @@ export interface RowProps extends CommonProps {
12
12
  /** The table body row data */
13
13
  data: TableRowProps;
14
14
  /** Event callback of action button of menu */
15
- onActionMenuTrigger: (el: HTMLElement, menuItem: []) => void;
15
+ onActionMenuTrigger: (el: HTMLElement, menuItem: Array<ReactNode>) => void;
16
16
  /** Event callback */
17
17
  onClick?: (event: MouseEvent, id: string) => void;
18
+ /** uniques key of table cell */
19
+ rowKey: string;
18
20
  /** if the row is selected */
19
21
  selected?: boolean;
20
22
  }
@@ -22,5 +24,5 @@ export interface RowProps extends CommonProps {
22
24
  * A wrapper component around the TableRow component from @material-ui. This component can be used
23
25
  * for manipulating data prior to displaying the data inside the table
24
26
  */
25
- export declare const DotTableRow: ({ columns, data, onActionMenuTrigger, onClick, selected, }: RowProps) => JSX.Element;
27
+ export declare const DotTableRow: ({ columns, data, onActionMenuTrigger, onClick, rowKey, selected, }: RowProps) => JSX.Element;
26
28
  export declare const EmptyDotRow: ({ cols, message, }: EmptyRowProps) => JSX.Element;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@digital-ai/dot-components",
3
- "version": "1.2.1",
3
+ "version": "1.3.0",
4
4
  "private": false,
5
5
  "license": "SEE LICENSE IN <LICENSE.md>",
6
6
  "contributors": [