@7shifts/sous-chef 2.17.2 → 2.18.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.
Files changed (77) hide show
  1. package/dist/actions/Button/Button.d.ts +1 -0
  2. package/dist/actions/Button/constants.d.ts +1 -0
  3. package/dist/actions/Button/types.d.ts +1 -1
  4. package/dist/actions/Link/Link.d.ts +11 -0
  5. package/dist/actions/Link/constants.d.ts +8 -0
  6. package/dist/actions/Link/index.d.ts +1 -0
  7. package/dist/actions/Link/types.d.ts +2 -0
  8. package/dist/actions/index.d.ts +2 -1
  9. package/dist/controls/DateFilter/DateFilter.d.ts +12 -0
  10. package/dist/controls/DateFilter/DateFilterDisplay/DateFilterDisplay.d.ts +10 -0
  11. package/dist/controls/DateFilter/DateFilterDisplay/DateFilterText/DateFilterText.d.ts +9 -0
  12. package/dist/controls/DateFilter/DateFilterDisplay/DateFilterText/domain.d.ts +2 -0
  13. package/dist/controls/DateFilter/DateFilterDisplay/index.d.ts +1 -0
  14. package/dist/controls/DateFilter/DateFilterStepper/DateFilterStepper.d.ts +11 -0
  15. package/dist/controls/DateFilter/DateFilterStepper/domain.d.ts +2 -0
  16. package/dist/controls/DateFilter/DateFilterStepper/index.d.ts +1 -0
  17. package/dist/controls/DateFilter/constants.d.ts +9 -0
  18. package/dist/controls/DateFilter/index.d.ts +1 -0
  19. package/dist/controls/DateFilter/types.d.ts +3 -0
  20. package/dist/controls/index.d.ts +2 -1
  21. package/dist/core/DataTable/DataTable.d.ts +3 -1
  22. package/dist/core/DataTable/types.d.ts +3 -7
  23. package/dist/core/DataTableEditableCell/DataTableEditableCell.d.ts +2 -1
  24. package/dist/core/DataTableRow/DataTableRow.d.ts +1 -1
  25. package/dist/core/Flex/Flex.d.ts +2 -0
  26. package/dist/core/Inline/Inline.d.ts +1 -0
  27. package/dist/core/SousChefProvider/SousChefProvider.d.ts +6 -0
  28. package/dist/core/SousChefProvider/index.d.ts +1 -0
  29. package/dist/core/Stack/Stack.d.ts +1 -0
  30. package/dist/core/index.d.ts +2 -12
  31. package/dist/feedback/PersistentBanner/PersistentBanner.d.ts +13 -0
  32. package/dist/feedback/PersistentBanner/constants.d.ts +5 -0
  33. package/dist/feedback/PersistentBanner/index.d.ts +1 -0
  34. package/dist/feedback/PersistentBanner/types.d.ts +1 -0
  35. package/dist/feedback/Toast/Toast.d.ts +9 -0
  36. package/dist/feedback/Toast/constants.d.ts +5 -0
  37. package/dist/feedback/Toast/index.d.ts +1 -0
  38. package/dist/feedback/Toast/types.d.ts +1 -0
  39. package/dist/feedback/index.d.ts +3 -2
  40. package/dist/forms/CurrencyField/CurrencyField.d.ts +1 -1
  41. package/dist/forms/PercentageField/PercentageField.d.ts +1 -1
  42. package/dist/forms/SelectField/CustomMenu/CustomMenu.d.ts +5 -0
  43. package/dist/forms/SelectField/CustomMenu/index.d.ts +1 -0
  44. package/dist/forms/SelectField/SelectField.d.ts +2 -0
  45. package/dist/forms/SelectField/types.d.ts +1 -0
  46. package/dist/forms/SelectField/useSelectField.d.ts +1 -1
  47. package/dist/forms/TimeField/TimeField.d.ts +1 -1
  48. package/dist/forms/hooks/useSelectFieldControllers.d.ts +2 -1
  49. package/dist/icons/IconArrowDown.d.ts +11 -0
  50. package/dist/icons/IconArrowLeft.d.ts +9 -0
  51. package/dist/icons/IconArrowRight.d.ts +9 -0
  52. package/dist/icons/IconArrowUp.d.ts +9 -0
  53. package/dist/icons/IconCalendar.d.ts +9 -0
  54. package/dist/icons/IconCheck.d.ts +9 -0
  55. package/dist/icons/IconChevronDown.d.ts +9 -0
  56. package/dist/icons/IconChevronUp.d.ts +8 -0
  57. package/dist/icons/IconClose.d.ts +9 -0
  58. package/dist/icons/IconComment.d.ts +9 -0
  59. package/dist/icons/IconDelete.d.ts +9 -0
  60. package/dist/icons/IconEdit.d.ts +9 -0
  61. package/dist/icons/IconExclaim.d.ts +9 -0
  62. package/dist/icons/IconEye.d.ts +9 -0
  63. package/dist/icons/IconEyeSlash.d.ts +9 -0
  64. package/dist/icons/IconLocation.d.ts +9 -0
  65. package/dist/icons/IconMinusCircle.d.ts +9 -0
  66. package/dist/icons/IconMore.d.ts +9 -0
  67. package/dist/icons/IconRemove.d.ts +8 -0
  68. package/dist/icons/IconUser.d.ts +8 -0
  69. package/dist/icons/IconUserPlus.d.ts +9 -0
  70. package/dist/index.css +462 -241
  71. package/dist/index.d.ts +1 -0
  72. package/dist/index.js +975 -484
  73. package/dist/index.js.map +1 -1
  74. package/dist/index.modern.js +972 -486
  75. package/dist/index.modern.js.map +1 -1
  76. package/dist/lists/DataTableRow/DataTableRow.d.ts +1 -1
  77. package/package.json +3 -2
@@ -7,6 +7,7 @@ declare type Props = {
7
7
  theme?: ButtonTheme;
8
8
  disabled?: boolean;
9
9
  onClick?: React.MouseEventHandler;
10
+ onKeyDown?: React.KeyboardEventHandler;
10
11
  id?: string;
11
12
  /**
12
13
  * @deprecated use the `size='min-width-100'` instead
@@ -9,6 +9,7 @@ export declare const BUTTON_THEMES: {
9
9
  UPSELL: "upsell";
10
10
  MARKETING: "marketing";
11
11
  HOLLOW: "hollow";
12
+ HOLLOW_CONTRAST: "hollow-contrast";
12
13
  LINK_PRIMARY: "link-primary";
13
14
  LINK_DANGER: "link-danger";
14
15
  LINK_UPSELL: "link-upsell";
@@ -1,4 +1,4 @@
1
- export declare type ButtonTheme = 'default' | 'primary' | 'danger' | 'upsell' | 'marketing' | 'hollow' | 'link-primary' | 'link-danger' | 'link-upsell' | 'link-toolbar' | 'link-contrast' | 'link-icon';
1
+ export declare type ButtonTheme = 'default' | 'primary' | 'danger' | 'upsell' | 'marketing' | 'hollow' | 'hollow-contrast' | 'link-primary' | 'link-danger' | 'link-upsell' | 'link-toolbar' | 'link-contrast' | 'link-icon';
2
2
  export declare type ButtonSize = 'full-width' | 'min-width-100';
3
3
  export declare type ButtonType = 'button' | 'submit' | 'reset';
4
4
  export declare type ButtonTarget = '_blank' | '_self';
@@ -0,0 +1,11 @@
1
+ import React from 'react';
2
+ import { Target, Theme } from './types';
3
+ declare type Props = {
4
+ href: string;
5
+ target?: Target;
6
+ theme?: Theme;
7
+ onClick?: React.MouseEventHandler;
8
+ children: React.ReactNode;
9
+ };
10
+ declare const Link: ({ href, target, theme, onClick, children }: Props) => JSX.Element;
11
+ export default Link;
@@ -0,0 +1,8 @@
1
+ export declare const LINK_THEME: {
2
+ PRIMARY: "primary";
3
+ CONTRAST: "contrast";
4
+ };
5
+ export declare const LINK_TARGET: {
6
+ SELF: "_self";
7
+ BLANK: "_blank";
8
+ };
@@ -0,0 +1 @@
1
+ export { default } from './Link';
@@ -0,0 +1,2 @@
1
+ export declare type Theme = 'primary' | 'contrast';
2
+ export declare type Target = '_self' | '_blank';
@@ -1,4 +1,5 @@
1
1
  import Toggle from './Toggle';
2
2
  import Button from './Button';
3
3
  import PaginationControls from './PaginationControls';
4
- export { Toggle, Button, PaginationControls };
4
+ import Link from './Link';
5
+ export { Toggle, Button, PaginationControls, Link };
@@ -0,0 +1,12 @@
1
+ import React from 'react';
2
+ import { WeekStart } from '../../utils/date';
3
+ import { DateFilterMode } from './types';
4
+ declare type Props = {
5
+ mode?: DateFilterMode;
6
+ weekStart?: WeekStart;
7
+ value: Date;
8
+ onChange: (selected: Date) => void;
9
+ testId?: string;
10
+ };
11
+ declare const DateFilter: React.FC<Props>;
12
+ export default DateFilter;
@@ -0,0 +1,10 @@
1
+ import { WeekStart } from '../../../utils/date';
2
+ import { DateFilterMode } from '../types';
3
+ declare type Props = {
4
+ mode: DateFilterMode;
5
+ selectedDate: Date;
6
+ weekStart: WeekStart;
7
+ onClick: () => void;
8
+ };
9
+ declare const DateFilterDisplay: ({ mode, selectedDate, weekStart, onClick }: Props) => JSX.Element;
10
+ export default DateFilterDisplay;
@@ -0,0 +1,9 @@
1
+ import { DateFilterMode } from '../../types';
2
+ import { WeekStart } from '../../../../utils/date';
3
+ declare type Props = {
4
+ mode: DateFilterMode;
5
+ selectedDate: Date;
6
+ weekStart: WeekStart;
7
+ };
8
+ declare const DateFilterText: ({ mode, selectedDate, weekStart }: Props) => JSX.Element;
9
+ export default DateFilterText;
@@ -0,0 +1,2 @@
1
+ import { DateFilterMode } from "../../types";
2
+ export declare const getDateString: (date: Date, mode: DateFilterMode) => string;
@@ -0,0 +1 @@
1
+ export { default } from './DateFilterDisplay';
@@ -0,0 +1,11 @@
1
+ import React from 'react';
2
+ import { DateFilterMode, StepDirection } from '../types';
3
+ declare type Props = {
4
+ children: React.ReactNode;
5
+ mode: DateFilterMode;
6
+ stepDirection: StepDirection;
7
+ date: Date;
8
+ onChange: (selected: Date) => void;
9
+ };
10
+ declare const DateFilterStepper: ({ children, mode, stepDirection, onChange, date }: Props) => JSX.Element;
11
+ export default DateFilterStepper;
@@ -0,0 +1,2 @@
1
+ import { DateFilterMode, StepDirection } from "../types";
2
+ export declare const handleDateStepper: (date: Date, mode: DateFilterMode, stepDirection: StepDirection, onChange: (selected: Date) => void) => void;
@@ -0,0 +1 @@
1
+ export { default } from './DateFilterStepper';
@@ -0,0 +1,9 @@
1
+ export declare const DATE_FILTER_MODE: {
2
+ DAY: "day";
3
+ WEEK: "week";
4
+ MONTH: "month";
5
+ };
6
+ export declare const STEP_DIRECTION: {
7
+ FORWARD: "forward";
8
+ BACKWARD: "backward";
9
+ };
@@ -0,0 +1 @@
1
+ export { default } from './DateFilter';
@@ -0,0 +1,3 @@
1
+ import { CalendarMode } from "../../overlay/Calendar/types";
2
+ export declare type DateFilterMode = CalendarMode | 'month';
3
+ export declare type StepDirection = 'forward' | 'backward';
@@ -1,2 +1,3 @@
1
1
  import ToolbarSelect from './ToolbarSelect';
2
- export { ToolbarSelect };
2
+ import DateFilter from './DateFilter';
3
+ export { ToolbarSelect, DateFilter };
@@ -24,6 +24,8 @@ declare type Props<T> = {
24
24
  footerComponent?: React.ReactNode;
25
25
  /** Will render vertical borders between columns if true */
26
26
  hasVerticalBorders?: boolean;
27
+ /** Used to override the default data-testid */
28
+ testId?: string;
27
29
  };
28
- declare const DataTable: <T extends unknown>({ items, columns, itemComponent, maxHeight, hasPrevious, hasNext, onPreviousClick, onNextClick, onSort, isLoading, showActionMenu, footerComponent, hasVerticalBorders }: Props<T>) => JSX.Element;
30
+ declare const DataTable: <T extends unknown>({ items, columns, itemComponent, maxHeight, hasPrevious, hasNext, onPreviousClick, onNextClick, onSort, isLoading, showActionMenu, footerComponent, hasVerticalBorders, testId }: Props<T>) => JSX.Element;
29
31
  export default DataTable;
@@ -1,5 +1,6 @@
1
1
  import React from 'react';
2
2
  import Button from '../../actions/Button/Button';
3
+ import { MenuAction } from '../../overlay/Menu/types';
3
4
  export declare type Column = {
4
5
  name: string;
5
6
  label?: React.ReactNode;
@@ -22,17 +23,12 @@ export declare type CustomComponent<T> = {
22
23
  columnSizes?: number[];
23
24
  columns?: Column[];
24
25
  };
25
- declare type BaseAction = {
26
- action?: string;
27
- label: React.ReactNode;
28
- onAction: (e: React.MouseEvent | React.KeyboardEvent) => void;
29
- };
30
26
  declare type KebabAction = {
31
27
  showInKebab?: true;
32
- } & BaseAction;
28
+ } & MenuAction;
33
29
  declare type ButtonAction = {
34
30
  buttonProps?: Pick<React.ComponentPropsWithoutRef<typeof Button>, 'theme' | 'disabled' | 'loading' | 'title'>;
35
31
  showInKebab: false;
36
- } & BaseAction;
32
+ } & MenuAction;
37
33
  export declare type Action = KebabAction | ButtonAction;
38
34
  export {};
@@ -16,6 +16,7 @@ declare type Props = {
16
16
  suffix?: React.ReactNode;
17
17
  defaultValue?: string;
18
18
  type?: 'text' | 'currency';
19
+ testId?: string;
19
20
  };
20
- declare const DataTableEditableCell: ({ name, columnIndex, rowIndex, id: inputId, value, onChange, onBlur, placeholder, disabled, error, prefix, suffix, defaultValue, type }: Props) => JSX.Element;
21
+ declare const DataTableEditableCell: ({ name, columnIndex, rowIndex, id: inputId, value, onChange, onBlur, placeholder, disabled, error, prefix, suffix, defaultValue, type, testId }: Props) => JSX.Element;
21
22
  export default DataTableEditableCell;
@@ -7,5 +7,5 @@ declare type Props = {
7
7
  actions?: Action[];
8
8
  hasDefaultPadding?: boolean;
9
9
  } & Omit<React.HTMLProps<HTMLDivElement>, 'css'>;
10
- declare const DataTableRow: React.ForwardRefExoticComponent<Pick<Props, "children" | "type" | "default" | "disabled" | "onClick" | "id" | "title" | "href" | "target" | "cite" | "data" | "form" | "label" | "slot" | "span" | "style" | "summary" | "pattern" | "key" | "contextMenu" | "list" | "className" | "start" | "wrap" | "dir" | "checked" | "onChange" | "name" | "value" | "onBlur" | "placeholder" | "prefix" | "color" | "content" | "height" | "translate" | "width" | "hidden" | "size" | "open" | "multiple" | "aria-label" | "aria-labelledby" | "autoFocus" | "onFocus" | "onKeyDown" | "tabIndex" | "defaultValue" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "async" | "autoComplete" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "defer" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "high" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "muted" | "nonce" | "noValidate" | "optimum" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "step" | "useMap" | "wmode" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "draggable" | "lang" | "spellCheck" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "isSelected" | "actions" | "hasDefaultPadding"> & React.RefAttributes<HTMLDivElement>>;
10
+ declare const DataTableRow: React.ForwardRefExoticComponent<Pick<Props, "children" | "type" | "default" | "disabled" | "onClick" | "id" | "title" | "href" | "target" | "size" | "cite" | "data" | "form" | "label" | "slot" | "span" | "style" | "summary" | "pattern" | "key" | "color" | "className" | "height" | "lang" | "max" | "media" | "method" | "min" | "name" | "width" | "role" | "tabIndex" | "crossOrigin" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "contextMenu" | "list" | "start" | "wrap" | "dir" | "checked" | "value" | "placeholder" | "prefix" | "content" | "translate" | "hidden" | "open" | "multiple" | "autoFocus" | "defaultValue" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "async" | "autoComplete" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "dateTime" | "defer" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "high" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "maxLength" | "mediaGroup" | "minLength" | "muted" | "nonce" | "noValidate" | "optimum" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "step" | "useMap" | "wmode" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "draggable" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "isSelected" | "actions" | "hasDefaultPadding"> & React.RefAttributes<HTMLDivElement>>;
11
11
  export default DataTableRow;
@@ -11,6 +11,8 @@ declare type Props = {
11
11
  direction?: 'row' | 'column';
12
12
  flexItems?: boolean;
13
13
  flexWrap?: FlexWrap;
14
+ testId?: string;
15
+ extraClass?: string;
14
16
  };
15
17
  /**
16
18
  * Flex is a internal component used by Stack and Inline. DON'T use this component outside of Sous Chef
@@ -12,6 +12,7 @@ declare type Props = {
12
12
  justifyContent?: JustifyContent;
13
13
  inlineFlex?: boolean;
14
14
  flexWrap?: FlexWrap;
15
+ testId?: string;
15
16
  };
16
17
  /**
17
18
  * Layout component to easily line elements up in a row.
@@ -0,0 +1,6 @@
1
+ import React from 'react';
2
+ declare type Props = {
3
+ children: React.ReactNode;
4
+ };
5
+ declare const SousChefProvider: ({ children }: Props) => JSX.Element;
6
+ export default SousChefProvider;
@@ -0,0 +1 @@
1
+ export { default } from './SousChefProvider';
@@ -11,6 +11,7 @@ declare type Props = {
11
11
  /** One of: `start`, `end`, `center`, `space-between` */
12
12
  justifyContent?: JustifyContent;
13
13
  flexItems?: boolean;
14
+ testId?: string;
14
15
  };
15
16
  /**
16
17
  * Layout component to easily stack elements up in a column.
@@ -1,12 +1,2 @@
1
- import ResourceTable from './ResourceTable';
2
- import ResourceTableRow from './ResourceTableRow';
3
- import Inline from './Inline';
4
- import Stack from './Stack';
5
- import DataTable from './DataTable';
6
- import DataTableRow from './DataTableRow';
7
- import DataTableCell from './DataTable/DataTableCell/DataTableCell';
8
- import DataTableEditableCell from './DataTableEditableCell';
9
- export { ResourceTable, ResourceTableRow, Inline, Stack, DataTable, DataTableRow, DataTableCell, DataTableEditableCell };
10
- export type { AlignItems, FlexWrap, JustifyContent } from './Flex/types';
11
- export type { CustomComponent, Column, SortDirection, Sort } from './ResourceTable/types';
12
- export type { Column as DataTableColumn, CustomComponent as DataTableCustomComponent, Action } from './DataTable/types';
1
+ import SousChefProvider from './SousChefProvider';
2
+ export { SousChefProvider };
@@ -0,0 +1,13 @@
1
+ import React from 'react';
2
+ import { Theme } from './types';
3
+ declare type Props = {
4
+ theme?: Theme;
5
+ primaryButton?: React.ReactElement;
6
+ secondaryButton?: React.ReactElement;
7
+ onDismiss?: () => void;
8
+ onLoad?: () => void;
9
+ testId?: string;
10
+ children: React.ReactNode;
11
+ };
12
+ declare const PersistentBanner: ({ theme, children, primaryButton, secondaryButton, onDismiss, onLoad, testId }: Props) => JSX.Element;
13
+ export default PersistentBanner;
@@ -0,0 +1,5 @@
1
+ export declare const PERSISTENT_BANNER_THEME: {
2
+ UPSELL: "upsell";
3
+ INFO: "info";
4
+ DANGER: "danger";
5
+ };
@@ -0,0 +1 @@
1
+ export { default } from './PersistentBanner';
@@ -0,0 +1 @@
1
+ export declare type Theme = 'danger' | 'info' | 'upsell';
@@ -0,0 +1,9 @@
1
+ import { ToastOptions } from 'react-toastify';
2
+ import type { Theme } from './types';
3
+ import 'react-toastify/dist/ReactToastify.css';
4
+ export declare const toast: (text: string, theme?: Theme, options?: ToastOptions) => void;
5
+ declare type Props = {
6
+ containerId?: string;
7
+ };
8
+ export declare const ToastContainer: ({ containerId }: Props) => JSX.Element;
9
+ export {};
@@ -0,0 +1,5 @@
1
+ export declare const TOAST_THEME: {
2
+ DEFAULT: "default";
3
+ DANGER: "danger";
4
+ };
5
+ export declare const TOAST_CONTAINER_ID = "sous-chef-toast";
@@ -0,0 +1 @@
1
+ export { ToastContainer, toast } from './Toast';
@@ -0,0 +1 @@
1
+ export declare type Theme = 'default' | 'danger';
@@ -1,4 +1,5 @@
1
1
  import Spinner from './Spinner';
2
2
  import InlineBanner from './InlineBanner';
3
- export { Spinner };
4
- export { InlineBanner };
3
+ import PersistentBanner from './PersistentBanner';
4
+ import { toast } from './Toast';
5
+ export { Spinner, InlineBanner, PersistentBanner, toast };
@@ -7,5 +7,5 @@ import type { Props as TextFieldProps } from '../TextField/TextField';
7
7
  */
8
8
  declare const CurrencyField: React.ForwardRefExoticComponent<TextFieldProps & {
9
9
  currencySymbol: string;
10
- } & Pick<TextFieldProps, "disabled" | "id" | "testId" | "caption" | "label" | "name" | "onFocus" | "onBlur" | "onChange" | "onKeyDown" | "error" | "value" | "placeholder" | "autoFocus" | "defaultValue" | "autoComplete" | "maxLength"> & React.RefAttributes<HTMLInputElement>>;
10
+ } & Pick<TextFieldProps, "disabled" | "onKeyDown" | "id" | "testId" | "caption" | "label" | "name" | "onFocus" | "onBlur" | "onChange" | "error" | "value" | "placeholder" | "autoFocus" | "defaultValue" | "autoComplete" | "maxLength"> & React.RefAttributes<HTMLInputElement>>;
11
11
  export default CurrencyField;
@@ -9,5 +9,5 @@ declare const PercentageField: React.ForwardRefExoticComponent<{
9
9
  min?: number | undefined;
10
10
  precision?: number | undefined;
11
11
  stepSize?: number | undefined;
12
- } & Pick<TextFieldProps, "disabled" | "id" | "testId" | "caption" | "label" | "name" | "onFocus" | "onBlur" | "onChange" | "onKeyDown" | "error" | "value" | "placeholder" | "prefix" | "autoFocus" | "defaultValue" | "autoComplete"> & React.RefAttributes<HTMLInputElement>>;
12
+ } & Pick<TextFieldProps, "disabled" | "onKeyDown" | "id" | "testId" | "caption" | "label" | "name" | "onFocus" | "onBlur" | "onChange" | "error" | "value" | "placeholder" | "prefix" | "autoFocus" | "defaultValue" | "autoComplete"> & React.RefAttributes<HTMLInputElement>>;
13
13
  export default PercentageField;
@@ -0,0 +1,5 @@
1
+ import { ComponentProps } from 'react';
2
+ import { components } from 'react-select';
3
+ declare type Props = ComponentProps<typeof components.Menu>;
4
+ declare function CustomMenu({ children, ...props }: Props): JSX.Element;
5
+ export default CustomMenu;
@@ -0,0 +1 @@
1
+ export { default } from './CustomMenu';
@@ -28,6 +28,8 @@ export declare type Props<T> = {
28
28
  SelectedOptionPrefix?: React.ElementType;
29
29
  /** This is used for setting the data-testid */
30
30
  testId?: string;
31
+ creatableButton?: React.ReactNode;
32
+ onCreate?: (option: string) => void;
31
33
  };
32
34
  /** Component to make possible choose from a predefined options. */
33
35
  declare const SelectField: <T extends unknown>(props: Props<T>) => JSX.Element;
@@ -14,6 +14,7 @@ export declare type CustomOptionProps<T> = {
14
14
  label: string;
15
15
  isSelected: boolean;
16
16
  isDisabled: boolean;
17
+ isFocused: boolean;
17
18
  };
18
19
  export interface SelectedOptionPrefixProps<T> extends ControlProps<T, false> {
19
20
  selectedOption: SelectOption<T>;
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import type { Props } from './SelectField';
3
- export declare const useSelectField: <T extends unknown>({ asToolbarFilter, caption, disabled, error, id, isClearable, label, menuShouldScrollIntoView, name, noOptionsMessage, options, onBlur, onChange, placeholder, value, defaultValue, CustomOption: UserCustomOption, SelectedOptionPrefix, testId }: Props<T>) => {
3
+ export declare const useSelectField: <T extends unknown>({ asToolbarFilter, caption, disabled, error, id, isClearable, label, menuShouldScrollIntoView, name, noOptionsMessage, options, onBlur, onChange, placeholder, value, defaultValue, CustomOption: UserCustomOption, SelectedOptionPrefix, testId, creatableButton, onCreate }: Props<T>) => {
4
4
  selectProps: Pick<import("react-select").Props<import("react-select").OptionTypeBase, boolean, import("react-select").GroupTypeBase<any>>, import("react").ReactText> & import("react-select/src/stateManager").Props<import("react-select").OptionTypeBase, boolean, import("react-select").GroupTypeBase<any>> & import("react-select").Props<import("react-select").OptionTypeBase, boolean, import("react-select").GroupTypeBase<any>>;
5
5
  fieldProps: {
6
6
  caption: import("react").ReactNode;
@@ -5,5 +5,5 @@ import type { Props as TextFieldProps } from '../TextField/TextField';
5
5
  *
6
6
  * At the end, it is just a string formatted nicely. **You are in charge of validating the value and parsing it back to a value that you can use on your application**.
7
7
  */
8
- declare const TimeField: React.ForwardRefExoticComponent<Pick<TextFieldProps, "disabled" | "id" | "testId" | "caption" | "label" | "name" | "onFocus" | "onBlur" | "onChange" | "onKeyDown" | "error" | "value" | "placeholder" | "autoFocus" | "defaultValue" | "autoComplete" | "maxLength"> & React.RefAttributes<HTMLInputElement>>;
8
+ declare const TimeField: React.ForwardRefExoticComponent<Pick<TextFieldProps, "disabled" | "onKeyDown" | "id" | "testId" | "caption" | "label" | "name" | "onFocus" | "onBlur" | "onChange" | "error" | "value" | "placeholder" | "autoFocus" | "defaultValue" | "autoComplete" | "maxLength"> & React.RefAttributes<HTMLInputElement>>;
9
9
  export default TimeField;
@@ -14,6 +14,7 @@ declare type Props<T> = {
14
14
  onChange?: (e: SelectOption<T>) => void;
15
15
  onBlur?: (e: SelectOption<T>) => void;
16
16
  error?: React.ReactNode;
17
+ onMenuInputFocus?: (isFocused: boolean) => void;
17
18
  };
18
- export declare const useSelectFieldControllers: <T>({ name, id: inputId, value, onChange, onBlur, error }: Props<T>) => FieldControls<T>;
19
+ export declare const useSelectFieldControllers: <T>({ name, id: inputId, value, onChange, onBlur, error, onMenuInputFocus }: Props<T>) => FieldControls<T>;
19
20
  export {};
@@ -0,0 +1,11 @@
1
+ import React from 'react';
2
+ import { Color } from '../foundation/colors';
3
+ import { IconSize } from './types';
4
+ declare type Props = {
5
+ size?: IconSize;
6
+ color?: Color;
7
+ rotate?: number;
8
+ dataTestId?: string;
9
+ };
10
+ declare const IconArrowDown: React.FC<Props>;
11
+ export default IconArrowDown;
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ import { Color } from '../foundation/colors';
3
+ import { IconSize } from './types';
4
+ declare type Props = {
5
+ size?: IconSize;
6
+ color?: Color;
7
+ };
8
+ declare const IconArrowLeft: React.FC<Props>;
9
+ export default IconArrowLeft;
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ import { Color } from '../foundation/colors';
3
+ import { IconSize } from './types';
4
+ declare type Props = {
5
+ size?: IconSize;
6
+ color?: Color;
7
+ };
8
+ declare const IconArrowRight: React.FC<Props>;
9
+ export default IconArrowRight;
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ import { Color } from '../foundation/colors';
3
+ import { IconSize } from './types';
4
+ declare type Props = {
5
+ size?: IconSize;
6
+ color?: Color;
7
+ };
8
+ declare const IconArrowUp: React.FC<Props>;
9
+ export default IconArrowUp;
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ import { Color } from '../foundation/colors';
3
+ import { IconSize } from './types';
4
+ declare type Props = {
5
+ size?: IconSize;
6
+ color?: Color;
7
+ };
8
+ declare const IconCalendar: React.FC<Props>;
9
+ export default IconCalendar;
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ import { Color } from '../foundation/colors';
3
+ import { IconSize } from './types';
4
+ declare type Props = {
5
+ size?: IconSize;
6
+ color?: Color;
7
+ };
8
+ declare const IconCheck: React.FC<Props>;
9
+ export default IconCheck;
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ declare type Props = {
3
+ size?: 'small' | 'medium';
4
+ color?: string;
5
+ rotate?: number;
6
+ dataTestId?: string;
7
+ };
8
+ declare const IconChevronDown: React.FC<Props>;
9
+ export default IconChevronDown;
@@ -0,0 +1,8 @@
1
+ import React from 'react';
2
+ import { Color } from '../foundation/colors';
3
+ declare type Props = {
4
+ size?: 'small' | 'medium';
5
+ color?: Color;
6
+ };
7
+ declare const IconChevronUp: React.FC<Props>;
8
+ export default IconChevronUp;
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ import { Color } from '../foundation/colors';
3
+ import { IconSize } from './types';
4
+ declare type Props = {
5
+ size?: IconSize;
6
+ color?: Color;
7
+ };
8
+ declare const IconClose: React.FC<Props>;
9
+ export default IconClose;
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ import { Color } from '../foundation/colors';
3
+ import { IconSize } from './types';
4
+ declare type Props = {
5
+ size?: IconSize;
6
+ color?: Color;
7
+ };
8
+ declare const IconComment: React.FC<Props>;
9
+ export default IconComment;
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ import { Color } from '../foundation/colors';
3
+ import { IconSize } from './types';
4
+ declare type Props = {
5
+ size?: IconSize;
6
+ color?: Color;
7
+ };
8
+ declare const IconDelete: React.FC<Props>;
9
+ export default IconDelete;
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ import { Color } from '../foundation/colors';
3
+ import { IconSize } from './types';
4
+ declare type Props = {
5
+ size?: IconSize;
6
+ color?: Color;
7
+ };
8
+ declare const IconEdit: React.FC<Props>;
9
+ export default IconEdit;
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ import { Color } from '../foundation/colors';
3
+ import { IconSize } from './types';
4
+ declare type Props = {
5
+ size?: IconSize;
6
+ color?: Color;
7
+ };
8
+ declare const IconExclaim: React.FC<Props>;
9
+ export default IconExclaim;