@7shifts/sous-chef 3.73.0-beta.0 → 3.73.0-beta.1
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.
- package/dist/forms/TimeField/constants.d.ts +4 -0
- package/dist/forms/TimeField/domain.d.ts +1 -1
- package/dist/index.css +54 -40
- package/dist/index.css.map +1 -1
- package/dist/index.js +67 -38
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +71 -41
- package/dist/index.modern.js.map +1 -1
- package/dist/lists/DataTable/DataTableCoverShadow/DataTableCoverShadow.d.ts +3 -3
- package/dist/lists/DataTable/DataTableEmptyState/DataTableEmptyState.d.ts +3 -2
- package/dist/lists/hooks/useDataTableScrollState.d.ts +0 -2
- package/dist/src/actions/Button/Button.d.ts +30 -0
- package/dist/src/actions/Button/types.d.ts +4 -0
- package/dist/src/actions/Link/types.d.ts +2 -0
- package/dist/src/controls/DateFilter/types.d.ts +3 -0
- package/dist/src/empty_states/EmptyStateContainer/types.d.ts +31 -0
- package/dist/src/feedback/InlineBanner/ButtonCTA/index.d.ts +1 -0
- package/dist/src/feedback/InlineBanner/types.d.ts +1 -0
- package/dist/src/feedback/PersistentBanner/types.d.ts +1 -0
- package/dist/src/feedback/Skeleton/types.d.ts +1 -0
- package/dist/src/feedback/Toast/types.d.ts +1 -0
- package/dist/src/forms/AsyncSelectField/types.d.ts +5 -0
- package/dist/src/forms/DateRangeField/DateRangeCalendar/index.d.ts +1 -0
- package/dist/src/forms/Form/types.d.ts +3 -0
- package/dist/src/forms/PasswordField/types.d.ts +5 -0
- package/dist/src/forms/PhoneField/CountrySelector/index.d.ts +1 -0
- package/dist/src/forms/PhoneField/types.d.ts +2 -0
- package/dist/src/forms/PillSelectField/types.d.ts +4 -0
- package/dist/src/forms/SelectField/domain.d.ts +5 -0
- package/dist/src/forms/SelectField/types.d.ts +30 -0
- package/dist/src/forms/TimeField/TimeFieldInput/index.d.ts +1 -0
- package/dist/src/forms/TimeRangeField/types.d.ts +10 -0
- package/dist/src/foundation/tokens/color/color-codes.d.ts +64 -0
- package/dist/src/foundation/tokens/color/color-types.d.ts +1 -0
- package/dist/src/foundation/tokens/zindex/z-index-types.d.ts +1 -0
- package/dist/src/foundation/tokens/zindex/z-index-values.d.ts +9 -0
- package/dist/src/foundation/types.d.ts +25 -0
- package/dist/src/i18n/types.d.ts +3 -0
- package/dist/src/icons/icon-typescript-template.d.ts +9 -0
- package/dist/src/icons/types.d.ts +1 -0
- package/dist/src/layout/Flex/types.d.ts +8 -0
- package/dist/src/layout/Page/types.d.ts +6 -0
- package/dist/src/lists/Accordion/types.d.ts +6 -0
- package/dist/src/lists/ActionList/type.d.ts +10 -0
- package/dist/src/lists/ActionListItem/type.d.ts +1 -0
- package/dist/src/lists/DataTable/DataTableHeader/types.d.ts +4 -0
- package/dist/src/lists/DataTable/types.d.ts +50 -0
- package/dist/src/media/Chip/types.d.ts +1 -0
- package/dist/src/media/Pill/types.d.ts +1 -0
- package/dist/src/overlay/Calendar/types.d.ts +2 -0
- package/dist/src/overlay/Dropdown/types.d.ts +2 -0
- package/dist/src/overlay/DropdownPane/index.d.ts +1 -0
- package/dist/src/overlay/KebabMenu/types.d.ts +7 -0
- package/dist/src/overlay/Tooltip/types.d.ts +6 -0
- package/dist/src/overlay/hooks/useListKeyboardNavigation/index.d.ts +2 -0
- package/dist/src/overlay/hooks/useListKeyboardNavigation/types.d.ts +6 -0
- package/dist/src/tests/utils/mockIntersectionObserver.d.ts +9 -0
- package/dist/src/typography/KeyboardKey/index.d.ts +1 -0
- package/dist/src/typography/Text/types.d.ts +3 -0
- package/dist/src/utils/storybookArgTypes.d.ts +89 -0
- package/dist/src/utils/types.d.ts +2 -0
- package/package.json +1 -1
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
type Props = {
|
|
3
|
-
showShadowOnLeft: boolean;
|
|
4
|
-
showShadowOnRight: boolean;
|
|
5
3
|
isShowingColumns: boolean;
|
|
4
|
+
showShadow: boolean;
|
|
5
|
+
direction: 'left' | 'right';
|
|
6
6
|
};
|
|
7
|
-
declare const DataTableCoverShadow: ({
|
|
7
|
+
declare const DataTableCoverShadow: ({ isShowingColumns, direction, showShadow }: Props) => React.JSX.Element;
|
|
8
8
|
export default DataTableCoverShadow;
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { DataTableColumn, DataTableEmptyState as DataTableEmptyStateType } from '../types';
|
|
2
|
+
import { DataTableColumn, DataTableEmptyState as DataTableEmptyStateType, StickyColumns } from '../types';
|
|
3
3
|
type Props = {
|
|
4
4
|
columns?: DataTableColumn[];
|
|
5
5
|
customEmptyState?: DataTableEmptyStateType;
|
|
6
|
+
stickyColumns?: StickyColumns;
|
|
6
7
|
};
|
|
7
|
-
declare const DataTableEmptyState: ({ columns, customEmptyState }: Props) => React.JSX.Element;
|
|
8
|
+
declare const DataTableEmptyState: ({ columns, customEmptyState, stickyColumns }: Props) => React.JSX.Element;
|
|
8
9
|
export default DataTableEmptyState;
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ButtonTheme, ButtonSize, ButtonType, ButtonTarget } from './types';
|
|
3
|
+
import type { PositionStyles, DataProps } from '../../foundation/types';
|
|
4
|
+
declare const Button: React.ForwardRefExoticComponent<{
|
|
5
|
+
children: React.ReactNode;
|
|
6
|
+
type?: ButtonType | undefined;
|
|
7
|
+
/** It controls the button theme */
|
|
8
|
+
theme?: ButtonTheme | undefined;
|
|
9
|
+
disabled?: boolean | undefined;
|
|
10
|
+
onClick?: React.MouseEventHandler<Element> | undefined;
|
|
11
|
+
onMouseEnter?: React.MouseEventHandler<Element> | undefined;
|
|
12
|
+
onMouseLeave?: React.MouseEventHandler<Element> | undefined;
|
|
13
|
+
onBlur?: React.FocusEventHandler<Element> | undefined;
|
|
14
|
+
onFocus?: React.FocusEventHandler<Element> | undefined;
|
|
15
|
+
onKeyDown?: React.KeyboardEventHandler<Element> | undefined;
|
|
16
|
+
id?: string | undefined;
|
|
17
|
+
loading?: boolean | undefined;
|
|
18
|
+
/** This will show a black tooltip when the user hover the button */
|
|
19
|
+
title?: string | React.ReactNode;
|
|
20
|
+
href?: string | undefined;
|
|
21
|
+
target?: ButtonTarget | undefined;
|
|
22
|
+
testId?: string | undefined;
|
|
23
|
+
/**
|
|
24
|
+
* This prop controls how the button grows having the following options:<br/>
|
|
25
|
+
* *full-width*: Will grow to fill the size of the container it is placed within.
|
|
26
|
+
* *min-width-100*: It will have a `min-width: 100` style. It is used for CTA buttons in forms and modals.
|
|
27
|
+
*/
|
|
28
|
+
size?: ButtonSize | undefined;
|
|
29
|
+
} & PositionStyles & DataProps & React.RefAttributes<HTMLButtonElement | HTMLAnchorElement>>;
|
|
30
|
+
export default Button;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export type ButtonTheme = 'default' | 'primary' | 'danger' | 'upsell' | 'marketing' | 'hollow' | 'hollow-contrast' | 'link-primary' | 'link-danger' | 'link-upsell' | 'link-toolbar' | 'link-contrast' | 'link-icon';
|
|
2
|
+
export type ButtonSize = 'full-width' | 'min-width-100';
|
|
3
|
+
export type ButtonType = 'button' | 'submit' | 'reset';
|
|
4
|
+
export type ButtonTarget = '_blank' | '_self';
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
export type EmptyStateSize = 'small' | 'medium' | 'large';
|
|
3
|
+
export type EmptyStateProps = {
|
|
4
|
+
/** The name of the highlighted feature or add-on */
|
|
5
|
+
header?: ReactNode;
|
|
6
|
+
/** Sets the title element */
|
|
7
|
+
title: ReactNode;
|
|
8
|
+
/** Sets the body text */
|
|
9
|
+
children?: ReactNode;
|
|
10
|
+
/** Path to the image/gif to display */
|
|
11
|
+
mediaUrl?: string;
|
|
12
|
+
/** Caption that appears below the CTAs */
|
|
13
|
+
actions?: {
|
|
14
|
+
primary?: React.ReactElement;
|
|
15
|
+
secondary?: React.ReactElement;
|
|
16
|
+
};
|
|
17
|
+
/** Controls the size and appearance of the component */
|
|
18
|
+
size?: EmptyStateSize;
|
|
19
|
+
/** Caption that appears below the cta options */
|
|
20
|
+
caption?: ReactNode;
|
|
21
|
+
isPaywall?: Boolean;
|
|
22
|
+
/** This is used for setting a data-testid on the component*/
|
|
23
|
+
testId?: string;
|
|
24
|
+
};
|
|
25
|
+
export type EmptyStateAsCard = {
|
|
26
|
+
as?: 'card';
|
|
27
|
+
onClose?: () => void;
|
|
28
|
+
} & EmptyStateProps;
|
|
29
|
+
export type EmptyStateAsBanner = {
|
|
30
|
+
as?: 'banner';
|
|
31
|
+
} & EmptyStateProps;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './ButtonCTA';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type InlineBannerTheme = 'info' | 'warning' | 'success' | 'danger' | 'upsell';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type Theme = 'danger' | 'info' | 'upsell';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type SkeletonComponent = 'avatar' | 'avatar--small' | 'avatar--medium' | 'avatar--large' | 'avatar--xlarge' | 'button' | 'pill';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type Theme = 'default' | 'danger';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './DateRangeCalendar';
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { FormikState, FormikHelpers, FormikHandlers } from 'formik';
|
|
2
|
+
/** The FormValues are `any` here as in Sous Chef we don't care about the shape of the form. We just need to link form fields with the formik state */
|
|
3
|
+
export type FormikType = FormikState<any> & FormikHelpers<any> & FormikHandlers;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './CountrySelector';
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import { ControlProps } from 'react-select';
|
|
3
|
+
export type GroupOption<T> = {
|
|
4
|
+
label: string;
|
|
5
|
+
options: SelectOption<T>[];
|
|
6
|
+
};
|
|
7
|
+
export type SelectOption<T> = {
|
|
8
|
+
isDisabled?: boolean;
|
|
9
|
+
value: T;
|
|
10
|
+
label: string;
|
|
11
|
+
};
|
|
12
|
+
export type SelectOptions<T> = Array<SelectOption<T> | GroupOption<T>>;
|
|
13
|
+
export type CustomOptionProps<T> = {
|
|
14
|
+
value: T;
|
|
15
|
+
label: string;
|
|
16
|
+
isSelected: boolean;
|
|
17
|
+
isDisabled: boolean;
|
|
18
|
+
isFocused: boolean;
|
|
19
|
+
};
|
|
20
|
+
export interface SelectedOptionPrefixProps<T> extends ControlProps<T, false> {
|
|
21
|
+
selectedOption: SelectOption<T>;
|
|
22
|
+
}
|
|
23
|
+
export type CustomComponentsExtraProps = {
|
|
24
|
+
testId?: string;
|
|
25
|
+
UserCustomOption?: React.ElementType;
|
|
26
|
+
SelectedOptionPrefix?: React.ElementType;
|
|
27
|
+
creatableButton?: ReactNode;
|
|
28
|
+
onMenuInputFocus: (isFocused: boolean) => void;
|
|
29
|
+
onCreate?: (option: string) => void;
|
|
30
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './TimeFieldInput';
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { StartTime, TimeInterval } from '../../utils/date';
|
|
2
|
+
export type TimeRangeInputProps = {
|
|
3
|
+
interval: TimeInterval;
|
|
4
|
+
startTime?: StartTime;
|
|
5
|
+
onChange: (value: string) => void;
|
|
6
|
+
placeholder?: string;
|
|
7
|
+
testId?: string;
|
|
8
|
+
disabled?: boolean;
|
|
9
|
+
value: string;
|
|
10
|
+
};
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
export declare const COLOR_CODES: {
|
|
2
|
+
readonly white: " #fff";
|
|
3
|
+
readonly black: " #000";
|
|
4
|
+
readonly 'tangerine-100': " #fef1ed";
|
|
5
|
+
readonly 'tangerine-200': " #fdd5c8";
|
|
6
|
+
readonly 'tangerine-300': " #fcab91";
|
|
7
|
+
readonly 'tangerine-400': " #ff6808";
|
|
8
|
+
readonly 'tangerine-500': " #cf5406";
|
|
9
|
+
readonly 'tangerine-600': " #95400a";
|
|
10
|
+
readonly 'eggplant-100': " #f8f3ff";
|
|
11
|
+
readonly 'eggplant-200': " #ebdcff";
|
|
12
|
+
readonly 'eggplant-300': " #d9bff4";
|
|
13
|
+
readonly 'eggplant-400': " #c293f1";
|
|
14
|
+
readonly 'eggplant-500': " #846db3";
|
|
15
|
+
readonly 'eggplant-600': " #453e75";
|
|
16
|
+
readonly 'mint-100': " #ecfaf8";
|
|
17
|
+
readonly 'mint-200': " #c6f1eb";
|
|
18
|
+
readonly 'mint-300': " #8de4d7";
|
|
19
|
+
readonly 'mint-400': " #3abda9";
|
|
20
|
+
readonly 'mint-500': " #35ac9a";
|
|
21
|
+
readonly 'mint-600': " #277e71";
|
|
22
|
+
readonly 'radish-100': " #fcf0f0";
|
|
23
|
+
readonly 'radish-200': " #f7d1d1";
|
|
24
|
+
readonly 'radish-300': " #f0a3a3";
|
|
25
|
+
readonly 'radish-400': " #e76767";
|
|
26
|
+
readonly 'radish-500': " #d33434";
|
|
27
|
+
readonly 'radish-600': " #981b1e";
|
|
28
|
+
readonly 'blueberry-100': " #f6fdff";
|
|
29
|
+
readonly 'blueberry-200': " #ceecf5";
|
|
30
|
+
readonly 'blueberry-300': " #9cd9eb";
|
|
31
|
+
readonly 'blueberry-400': " #5bc0de";
|
|
32
|
+
readonly 'blueberry-500': " #51acc7";
|
|
33
|
+
readonly 'blueberry-600': " #367385";
|
|
34
|
+
readonly 'banana-100': " #fff9ed";
|
|
35
|
+
readonly 'banana-200': " #ffeec9";
|
|
36
|
+
readonly 'banana-300': " #ffdd92";
|
|
37
|
+
readonly 'banana-400': " #ffc74a";
|
|
38
|
+
readonly 'banana-500': " #e5b242";
|
|
39
|
+
readonly 'banana-600': " #99772c";
|
|
40
|
+
readonly 'grey-100': " #f3f3f3";
|
|
41
|
+
readonly 'grey-200': " #d5d5d5";
|
|
42
|
+
readonly 'grey-300': " #949494";
|
|
43
|
+
readonly 'grey-400': " #767676";
|
|
44
|
+
readonly 'grey-500': " #464646";
|
|
45
|
+
readonly 'grey-600': " #323232";
|
|
46
|
+
readonly 'oat-100': " #f1f0ec";
|
|
47
|
+
readonly 'oat-200': " #e2ded6";
|
|
48
|
+
readonly 'oat-300': " #c7c0b2";
|
|
49
|
+
readonly 'oat-400': " #6e6d6c";
|
|
50
|
+
readonly 'oat-500': " #4c4b49";
|
|
51
|
+
readonly 'oat-600': " #383430";
|
|
52
|
+
readonly 'lime-100': " #efffe0";
|
|
53
|
+
readonly 'lime-200': " #c6ff94";
|
|
54
|
+
readonly 'lime-300': " #81ffac";
|
|
55
|
+
readonly 'lime-400': " #00feb2";
|
|
56
|
+
readonly 'lime-500': " #3fb994";
|
|
57
|
+
readonly 'lime-600': " #244f47";
|
|
58
|
+
readonly 'blackberry-100': " #ecf0ff";
|
|
59
|
+
readonly 'blackberry-200': " #d6e0ff";
|
|
60
|
+
readonly 'blackberry-300': " #a0bbff";
|
|
61
|
+
readonly 'blackberry-400': " #4570ff";
|
|
62
|
+
readonly 'blackberry-500': " #1c5cbb";
|
|
63
|
+
readonly 'blackberry-600': " #193f78";
|
|
64
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type Color = 'white' | 'black' | 'tangerine-100' | 'tangerine-200' | 'tangerine-300' | 'tangerine-400' | 'tangerine-500' | 'tangerine-600' | 'eggplant-100' | 'eggplant-200' | 'eggplant-300' | 'eggplant-400' | 'eggplant-500' | 'eggplant-600' | 'mint-100' | 'mint-200' | 'mint-300' | 'mint-400' | 'mint-500' | 'mint-600' | 'radish-100' | 'radish-200' | 'radish-300' | 'radish-400' | 'radish-500' | 'radish-600' | 'blueberry-100' | 'blueberry-200' | 'blueberry-300' | 'blueberry-400' | 'blueberry-500' | 'blueberry-600' | 'banana-100' | 'banana-200' | 'banana-300' | 'banana-400' | 'banana-500' | 'banana-600' | 'grey-100' | 'grey-200' | 'grey-300' | 'grey-400' | 'grey-500' | 'grey-600' | 'oat-100' | 'oat-200' | 'oat-300' | 'oat-400' | 'oat-500' | 'oat-600' | 'lime-100' | 'lime-200' | 'lime-300' | 'lime-400' | 'lime-500' | 'lime-600' | 'blackberry-100' | 'blackberry-200' | 'blackberry-300' | 'blackberry-400' | 'blackberry-500' | 'blackberry-600';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type ZIndex = 'base' | 'nav' | 'modal' | 'dropdown' | 'dropdown-level-2' | 'tooltip' | 'portal';
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
export type PositionStyles = {
|
|
2
|
+
/** Shortcut for `margin`. */
|
|
3
|
+
m?: string | number;
|
|
4
|
+
/** Defines the margin around of the element. */
|
|
5
|
+
margin?: string | number;
|
|
6
|
+
/** Shortcut for `marginTop`. */
|
|
7
|
+
mt?: string | number;
|
|
8
|
+
/** Defines the margin on the top of the element. */
|
|
9
|
+
marginTop?: string | number;
|
|
10
|
+
/** Shortcut for `marginRight`. */
|
|
11
|
+
mr?: string | number;
|
|
12
|
+
/** Defines the margin on the right side of the element. */
|
|
13
|
+
marginRight?: string | number;
|
|
14
|
+
/** Shortcut for `marginBottom`. */
|
|
15
|
+
mb?: string | number;
|
|
16
|
+
/** Defines the margin on the bottom of the element. */
|
|
17
|
+
marginBottom?: string | number;
|
|
18
|
+
/** Shortcut for `marginLeft`. */
|
|
19
|
+
ml?: string | number;
|
|
20
|
+
/** Defines the margin on the left side of the element. */
|
|
21
|
+
marginLeft?: string | number;
|
|
22
|
+
};
|
|
23
|
+
export type DataProps = {
|
|
24
|
+
[key in `data${string}`]: string;
|
|
25
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type IconSize = 'small' | 'medium' | 'default' | 'large' | 'extra-large' | 'flexible';
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export type AlignItems = 'flex-start' | 'flex-end' | 'center' | 'stretch';
|
|
2
|
+
export type FlexWrap = 'nowrap' | 'wrap' | 'wrap-reverse';
|
|
3
|
+
export type JustifyContent = 'start' | 'end' | 'center' | 'space-between';
|
|
4
|
+
export type Space = 0 | 4 | 8 | 12 | 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 52 | 56 | 60;
|
|
5
|
+
export type SpaceConfig = {
|
|
6
|
+
row: Space;
|
|
7
|
+
column: Space;
|
|
8
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type ActionListItemTheme = 'info' | 'warning' | 'success' | 'danger' | 'upsell';
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import Button from '../../actions/Button/Button';
|
|
3
|
+
import { MenuAction } from '../../overlay/KebabMenu/types';
|
|
4
|
+
export type DataTableColumn = {
|
|
5
|
+
name: string;
|
|
6
|
+
label?: React.ReactNode;
|
|
7
|
+
size?: number;
|
|
8
|
+
isSortable?: boolean;
|
|
9
|
+
currentSort?: DataTableSortDirection;
|
|
10
|
+
isRightAligned?: boolean;
|
|
11
|
+
hidden?: boolean;
|
|
12
|
+
reverseSortOrder?: boolean;
|
|
13
|
+
};
|
|
14
|
+
export type DataTableSortDirection = 'asc' | 'desc' | null;
|
|
15
|
+
export type DataTableSort = {
|
|
16
|
+
columnName: string;
|
|
17
|
+
direction: DataTableSortDirection;
|
|
18
|
+
};
|
|
19
|
+
export type DataTableItem<T> = (T & {
|
|
20
|
+
actions?: DataTableAction[];
|
|
21
|
+
key?: string | number | null;
|
|
22
|
+
});
|
|
23
|
+
export type DataTableCustomComponent<T> = {
|
|
24
|
+
item: DataTableItem<T>;
|
|
25
|
+
index: number;
|
|
26
|
+
columnSizes?: number[];
|
|
27
|
+
columns?: DataTableColumn[];
|
|
28
|
+
testId?: string;
|
|
29
|
+
};
|
|
30
|
+
type KebabAction = {
|
|
31
|
+
showInKebab?: true;
|
|
32
|
+
} & MenuAction;
|
|
33
|
+
type ButtonAction = {
|
|
34
|
+
buttonProps?: Pick<React.ComponentPropsWithoutRef<typeof Button>, 'theme' | 'disabled' | 'loading' | 'title'>;
|
|
35
|
+
showInKebab: false;
|
|
36
|
+
} & MenuAction;
|
|
37
|
+
export type DataTableAction = KebabAction | ButtonAction;
|
|
38
|
+
export type DataTableState = 'CONTENT' | 'SKELETON_LOADING' | 'BACKGROUND_LOADING' | 'EMPTY';
|
|
39
|
+
export type StickyColumns = 'left' | 'right' | 'both';
|
|
40
|
+
export type ScrollState = 'NO_SCROLL' | 'SCROLLABLE_CONTENT_ON_BOTH_SIDES' | 'SCROLLABLE_CONTENT_ON_LEFT' | 'SCROLLABLE_CONTENT_ON_RIGHT';
|
|
41
|
+
export type DataTableEmptyState = {
|
|
42
|
+
title: string;
|
|
43
|
+
caption: string;
|
|
44
|
+
image?: string;
|
|
45
|
+
actions?: {
|
|
46
|
+
primary?: React.ReactElement;
|
|
47
|
+
secondary?: React.ReactElement;
|
|
48
|
+
};
|
|
49
|
+
};
|
|
50
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type Theme = 'marketing' | 'success' | 'upsell' | 'warning' | 'info' | 'danger';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type PillTheme = 'info' | 'success' | 'danger' | 'warning' | 'upsell' | 'default';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './DropdownPane';
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
export declare class MockIntersectionObserver {
|
|
2
|
+
static entries: Array<Element>;
|
|
3
|
+
static options?: IntersectionObserverInit;
|
|
4
|
+
static callback: IntersectionObserverCallback;
|
|
5
|
+
constructor(callback: IntersectionObserverCallback, options?: IntersectionObserverInit);
|
|
6
|
+
observe(target: Element): void;
|
|
7
|
+
unobserve(target: Element): void;
|
|
8
|
+
static run(isIntersecting: boolean): void;
|
|
9
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './KeyboardKey';
|
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
export declare const POSITION_ARG_TYPES: {
|
|
2
|
+
margin: {
|
|
3
|
+
name: string;
|
|
4
|
+
description: string;
|
|
5
|
+
control: {
|
|
6
|
+
type: string;
|
|
7
|
+
};
|
|
8
|
+
table: {
|
|
9
|
+
category: string;
|
|
10
|
+
};
|
|
11
|
+
};
|
|
12
|
+
marginTop: {
|
|
13
|
+
name: string;
|
|
14
|
+
description: string;
|
|
15
|
+
control: {
|
|
16
|
+
type: string;
|
|
17
|
+
};
|
|
18
|
+
table: {
|
|
19
|
+
category: string;
|
|
20
|
+
};
|
|
21
|
+
};
|
|
22
|
+
marginRight: {
|
|
23
|
+
name: string;
|
|
24
|
+
description: string;
|
|
25
|
+
control: {
|
|
26
|
+
type: string;
|
|
27
|
+
};
|
|
28
|
+
table: {
|
|
29
|
+
category: string;
|
|
30
|
+
};
|
|
31
|
+
};
|
|
32
|
+
marginBottom: {
|
|
33
|
+
name: string;
|
|
34
|
+
description: string;
|
|
35
|
+
control: {
|
|
36
|
+
type: string;
|
|
37
|
+
};
|
|
38
|
+
table: {
|
|
39
|
+
category: string;
|
|
40
|
+
};
|
|
41
|
+
};
|
|
42
|
+
marginLeft: {
|
|
43
|
+
name: string;
|
|
44
|
+
description: string;
|
|
45
|
+
control: {
|
|
46
|
+
type: string;
|
|
47
|
+
};
|
|
48
|
+
table: {
|
|
49
|
+
category: string;
|
|
50
|
+
};
|
|
51
|
+
};
|
|
52
|
+
m: {
|
|
53
|
+
table: {
|
|
54
|
+
disable: boolean;
|
|
55
|
+
};
|
|
56
|
+
};
|
|
57
|
+
mt: {
|
|
58
|
+
table: {
|
|
59
|
+
disable: boolean;
|
|
60
|
+
};
|
|
61
|
+
};
|
|
62
|
+
mr: {
|
|
63
|
+
table: {
|
|
64
|
+
disable: boolean;
|
|
65
|
+
};
|
|
66
|
+
};
|
|
67
|
+
mb: {
|
|
68
|
+
table: {
|
|
69
|
+
disable: boolean;
|
|
70
|
+
};
|
|
71
|
+
};
|
|
72
|
+
ml: {
|
|
73
|
+
table: {
|
|
74
|
+
disable: boolean;
|
|
75
|
+
};
|
|
76
|
+
};
|
|
77
|
+
};
|
|
78
|
+
export declare const DATA_ARG_TYPES: {
|
|
79
|
+
data: {
|
|
80
|
+
name: string;
|
|
81
|
+
description: string;
|
|
82
|
+
control: {
|
|
83
|
+
type: string;
|
|
84
|
+
};
|
|
85
|
+
table: {
|
|
86
|
+
category: string;
|
|
87
|
+
};
|
|
88
|
+
};
|
|
89
|
+
};
|