@7shifts/sous-chef 2.3.6 → 2.5.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.
@@ -4,27 +4,28 @@ declare type NoOptionsMessageFunction = (input: {
4
4
  inputValue: string;
5
5
  }) => string | null;
6
6
  declare type Props<T> = {
7
- name: string;
8
- /** If not provided it will generate a random id so the label links properly with the text input */
7
+ asToolbarFilter?: boolean;
8
+ caption?: React.ReactNode;
9
+ disabled?: boolean;
10
+ error?: string;
11
+ /** If not provided it will generate a random id so the l¡abel links properly with the text input */
9
12
  id?: string;
10
- value?: SelectOption<T>;
11
- options: SelectOptions<T>;
13
+ isClearable?: boolean;
14
+ label?: React.ReactNode;
15
+ /** When the user opens the menu, if this prop is `true`, it will scroll the page into to the menu view (if its content falls under a scroll). It is recommended to disable this behaviour when using the `SelectField` inside a modal. */
16
+ menuShouldScrollIntoView?: boolean;
17
+ name: string;
18
+ noOptionsMessage?: string | NoOptionsMessageFunction;
12
19
  onChange?: (e: SelectOption<T>) => void;
13
20
  onBlur?: (e: SelectOption<T>) => void;
14
- CustomOption?: React.ElementType;
15
- SelectedOptionPrefix?: React.ElementType;
16
- label?: React.ReactNode;
17
- caption?: React.ReactNode;
18
- error?: string;
21
+ options: SelectOptions<T>;
19
22
  placeholder?: string;
20
- noOptionsMessage?: string | NoOptionsMessageFunction;
21
- disabled?: boolean;
22
23
  /** Use a prefix for things like currency symbols (“$”, “¥”, “£”) or icons. */
23
24
  prefix?: React.ReactNode;
24
- asToolbarFilter?: boolean;
25
- /** When the user opens the menu, if this prop is `true`, it will scroll the page into to the menu view (if its content falls under a scroll). It is recomended to disable this behaviour when using the `SelectField` inside a modal. */
26
- menuShouldScrollIntoView?: boolean;
25
+ value?: SelectOption<T>;
26
+ CustomOption?: React.ElementType;
27
+ SelectedOptionPrefix?: React.ElementType;
27
28
  };
28
29
  /** Component to make possible choose from a predefined options. */
29
- declare const SelectField: <T extends unknown>({ name, id: inputId, value, options, onChange, onBlur, CustomOption: UserCustomOption, SelectedOptionPrefix, label, caption, error, placeholder, noOptionsMessage, disabled, prefix, asToolbarFilter, menuShouldScrollIntoView }: Props<T>) => JSX.Element;
30
+ declare const SelectField: <T extends unknown>({ asToolbarFilter, caption, disabled, error, id: inputId, isClearable, label, menuShouldScrollIntoView, name, noOptionsMessage, options, onBlur, onChange, placeholder, prefix, value, CustomOption: UserCustomOption, SelectedOptionPrefix }: Props<T>) => JSX.Element;
30
31
  export default SelectField;
@@ -0,0 +1,11 @@
1
+ import React from 'react';
2
+ import { IconSize } from '../types';
3
+ declare type Props = {
4
+ size?: IconSize;
5
+ color?: string;
6
+ } & React.SVGProps<SVGSVGElement>;
7
+ declare const IconBirthdayCake: {
8
+ (props: Props): JSX.Element;
9
+ displayName: string;
10
+ };
11
+ export default IconBirthdayCake;
@@ -0,0 +1,11 @@
1
+ import React from 'react';
2
+ import { IconSize } from '../types';
3
+ declare type Props = {
4
+ size?: IconSize;
5
+ color?: string;
6
+ } & React.SVGProps<SVGSVGElement>;
7
+ declare const IconCalendarStar: {
8
+ (props: Props): JSX.Element;
9
+ displayName: string;
10
+ };
11
+ export default IconCalendarStar;
@@ -12,6 +12,7 @@ export { default as IconBan } from './IconBan';
12
12
  export { default as IconBarsH } from './IconBarsH';
13
13
  export { default as IconBarsV } from './IconBarsV';
14
14
  export { default as IconBell } from './IconBell';
15
+ export { default as IconBirthdayCake } from './IconBirthdayCake';
15
16
  export { default as IconBold } from './IconBold';
16
17
  export { default as IconBolt } from './IconBolt';
17
18
  export { default as IconBook } from './IconBook';
@@ -22,6 +23,7 @@ export { default as IconCalendarAlt } from './IconCalendarAlt';
22
23
  export { default as IconCalendarCheck } from './IconCalendarCheck';
23
24
  export { default as IconCalendarDay } from './IconCalendarDay';
24
25
  export { default as IconCalendarExclamation } from './IconCalendarExclamation';
26
+ export { default as IconCalendarStar } from './IconCalendarStar';
25
27
  export { default as IconCalendarTomorrow } from './IconCalendarTomorrow';
26
28
  export { default as IconCalendar } from './IconCalendar';
27
29
  export { default as IconCameraSlash } from './IconCameraSlash';
package/dist/index.css CHANGED
@@ -215,7 +215,7 @@ Please ask a designer if you have questions about which colours to use.
215
215
  }
216
216
  ._1iXKZ {
217
217
  background: #fff;
218
- color: #464646;
218
+ color: #555;
219
219
  }
220
220
  ._2K2Xx {
221
221
  font-weight: 600;
@@ -247,7 +247,7 @@ Please ask a designer if you have questions about which colours to use.
247
247
  }
248
248
  ._2LAWl {
249
249
  border-top-color: #fff;
250
- color: #464646;
250
+ color: #555;
251
251
  }
252
252
  /*********************************
253
253
  For new colours, see _colors.scss.
@@ -823,7 +823,7 @@ Please ask a designer if you have questions about which colours to use.
823
823
  font-weight: 600;
824
824
  font-family: "Proxima Nova", sans-serif;
825
825
  color: #555;
826
- padding: 19px 17px 8px 17px;
826
+ padding: 20px 17px 8px 17px;
827
827
  }
828
828
 
829
829
  ._27x4v {
package/dist/index.js CHANGED
@@ -974,6 +974,21 @@ var IconBell = function IconBell(props) {
974
974
 
975
975
  IconBell.displayName = 'IconBell';
976
976
 
977
+ var IconBirthdayCake = function IconBirthdayCake(props) {
978
+ return React__default.createElement("svg", Object.assign({
979
+ viewBox: "0 0 20 20",
980
+ fill: "none",
981
+ xmlns: "http://www.w3.org/2000/svg",
982
+ "data-testid": "icon-birthday-cake",
983
+ style: getIconStyles(props)
984
+ }, props), React__default.createElement("path", {
985
+ d: "M5 3.75c-.693 0-1.25-.557-1.25-1.25C3.75 1.29 5 1.602 5 0c.469 0 1.25 1.152 1.25 2.188C6.25 3.223 5.693 3.75 5 3.75Zm5 0c-.693 0-1.25-.557-1.25-1.25C8.75 1.29 10 1.602 10 0c.469 0 1.25 1.152 1.25 2.188 0 1.035-.557 1.562-1.25 1.562Zm5 0c-.693 0-1.25-.557-1.25-1.25C13.75 1.29 15 1.602 15 0c.469 0 1.25 1.152 1.25 2.188 0 1.035-.557 1.562-1.25 1.562ZM16.875 10h-1.25V4.375h-1.25V10h-3.75V4.375h-1.25V10h-3.75V4.375h-1.25V10h-1.25c-1.035 0-1.875.84-1.875 1.875V20h17.5v-8.125c0-1.035-.84-1.875-1.875-1.875Zm.625 8.75h-15v-2.814c.634-.37.935-.936 1.67-.936 1.092 0 1.22 1.25 2.92 1.25C8.763 16.25 8.934 15 10 15c1.1 0 1.219 1.25 2.92 1.25 1.694 0 1.827-1.25 2.92-1.25.722 0 1.025.565 1.66.936v2.814Zm0-4.39c-.376-.307-.829-.61-1.66-.61-1.697 0-1.83 1.25-2.92 1.25-1.082 0-1.229-1.25-2.92-1.25-1.674 0-1.844 1.25-2.91 1.25-1.1 0-1.219-1.25-2.92-1.25-.838 0-1.293.304-1.67.612v-2.487c0-.345.28-.625.625-.625h13.75c.345 0 .625.28.625.625v2.485Z",
986
+ fill: "currentColor"
987
+ }));
988
+ };
989
+
990
+ IconBirthdayCake.displayName = 'IconBirthdayCake';
991
+
977
992
  var IconBold = function IconBold(props) {
978
993
  return React__default.createElement("svg", Object.assign({
979
994
  viewBox: "0 0 20 20",
@@ -1149,6 +1164,21 @@ var IconCalendarExclamation = function IconCalendarExclamation(props) {
1149
1164
 
1150
1165
  IconCalendarExclamation.displayName = 'IconCalendarExclamation';
1151
1166
 
1167
+ var IconCalendarStar = function IconCalendarStar(props) {
1168
+ return React__default.createElement("svg", Object.assign({
1169
+ viewBox: "0 0 20 20",
1170
+ fill: "none",
1171
+ xmlns: "http://www.w3.org/2000/svg",
1172
+ "data-testid": "icon-calendar-star",
1173
+ style: getIconStyles(props)
1174
+ }, props), React__default.createElement("path", {
1175
+ d: "m6.952 14.406-.325 1.808c-.074.414.103.824.461 1.07a1.186 1.186 0 0 0 1.211.082l1.71-.851 1.71.85a1.2 1.2 0 0 0 1.215-.081c.358-.246.536-.656.461-1.07l-.325-1.808 1.38-1.276c.317-.293.428-.723.292-1.12a1.127 1.127 0 0 0-.93-.743l-1.912-.265-.853-1.644a1.166 1.166 0 0 0-1.038-.613c-.44 0-.836.235-1.03.61l-.853 1.643-1.911.266a1.127 1.127 0 0 0-.931.741c-.136.398-.025.828.292 1.12l1.376 1.281Zm2.044-2.268 1.013-1.948 1.014 1.948 2.265.312-1.64 1.52.388 2.139-2.027-1.008-2.027 1.011.387-2.139-1.64-1.519 2.267-.316Zm8.263-9.64h-1.977V.313a.322.322 0 0 0-.33-.312h-.659c-.18 0-.33.14-.33.312V2.5H6.055V.312A.322.322 0 0 0 5.724 0h-.658c-.182 0-.33.14-.33.312V2.5H2.759C1.667 2.499.78 3.338.78 4.373v13.742c0 1.035.886 1.874 1.978 1.874h14.5c1.092 0 1.978-.84 1.978-1.874V4.373c0-1.035-.886-1.874-1.977-1.874Zm.66 15.617c0 .344-.297.625-.66.625H2.76c-.363 0-.66-.281-.66-.625V7.496h15.82v10.62Zm0-11.868H2.099V4.373c0-.344.297-.625.66-.625h14.5c.363 0 .66.281.66.625v1.874Z",
1176
+ fill: "currentColor"
1177
+ }));
1178
+ };
1179
+
1180
+ IconCalendarStar.displayName = 'IconCalendarStar';
1181
+
1152
1182
  var IconCalendarTomorrow = function IconCalendarTomorrow(props) {
1153
1183
  return React__default.createElement("svg", Object.assign({
1154
1184
  viewBox: "0 0 20 20",
@@ -3412,7 +3442,7 @@ var DataTable = function DataTable(_ref) {
3412
3442
  numberOfRows: numberOfRows,
3413
3443
  hasVerticalBorders: hasVerticalBorders
3414
3444
  }
3415
- }, React__default.createElement("div", null, columns && React__default.createElement(DataTableHeader, {
3445
+ }, columns && React__default.createElement(DataTableHeader, {
3416
3446
  columns: columns,
3417
3447
  onSort: onSort,
3418
3448
  showActionMenu: showActionMenu
@@ -3440,7 +3470,7 @@ var DataTable = function DataTable(_ref) {
3440
3470
  hasNext: hasNext && !isLoading,
3441
3471
  onPreviousClick: onPreviousClick,
3442
3472
  onNextClick: onNextClick
3443
- }))));
3473
+ })));
3444
3474
  };
3445
3475
 
3446
3476
  var DefaultItemComponent$1 = function DefaultItemComponent(_ref2) {
@@ -4952,40 +4982,42 @@ function CustomOption$1(_ref) {
4952
4982
  }
4953
4983
 
4954
4984
  var SelectField = function SelectField(_ref) {
4955
- var name = _ref.name,
4985
+ var _ref$asToolbarFilter = _ref.asToolbarFilter,
4986
+ asToolbarFilter = _ref$asToolbarFilter === void 0 ? false : _ref$asToolbarFilter,
4987
+ caption = _ref.caption,
4988
+ disabled = _ref.disabled,
4989
+ error = _ref.error,
4956
4990
  inputId = _ref.id,
4957
- value = _ref.value,
4991
+ _ref$isClearable = _ref.isClearable,
4992
+ isClearable = _ref$isClearable === void 0 ? false : _ref$isClearable,
4993
+ label = _ref.label,
4994
+ _ref$menuShouldScroll = _ref.menuShouldScrollIntoView,
4995
+ menuShouldScrollIntoView = _ref$menuShouldScroll === void 0 ? true : _ref$menuShouldScroll,
4996
+ name = _ref.name,
4997
+ noOptionsMessage = _ref.noOptionsMessage,
4958
4998
  options = _ref.options,
4959
- onChange = _ref.onChange,
4960
4999
  onBlur = _ref.onBlur,
4961
- UserCustomOption = _ref.CustomOption,
4962
- SelectedOptionPrefix = _ref.SelectedOptionPrefix,
4963
- label = _ref.label,
4964
- caption = _ref.caption,
4965
- error = _ref.error,
5000
+ onChange = _ref.onChange,
4966
5001
  placeholder = _ref.placeholder,
4967
- noOptionsMessage = _ref.noOptionsMessage,
4968
- disabled = _ref.disabled,
4969
5002
  prefix = _ref.prefix,
4970
- _ref$asToolbarFilter = _ref.asToolbarFilter,
4971
- asToolbarFilter = _ref$asToolbarFilter === void 0 ? false : _ref$asToolbarFilter,
4972
- _ref$menuShouldScroll = _ref.menuShouldScrollIntoView,
4973
- menuShouldScrollIntoView = _ref$menuShouldScroll === void 0 ? true : _ref$menuShouldScroll;
5003
+ value = _ref.value,
5004
+ UserCustomOption = _ref.CustomOption,
5005
+ SelectedOptionPrefix = _ref.SelectedOptionPrefix;
4974
5006
  var controllers = useSelectFieldControllers({
4975
- name: name,
5007
+ error: error,
4976
5008
  id: inputId,
4977
- value: value,
5009
+ name: name,
4978
5010
  onChange: onChange,
4979
5011
  onBlur: onBlur,
4980
- error: error
5012
+ value: value
4981
5013
  });
4982
5014
  var hasError = !!controllers.error;
4983
5015
  var fieldProps = {
4984
- name: name,
5016
+ caption: caption,
5017
+ error: controllers.error,
4985
5018
  id: controllers.id,
4986
5019
  label: label,
4987
- caption: caption,
4988
- error: controllers.error
5020
+ name: name
4989
5021
  };
4990
5022
  var defaultNoOptionsMessage = noOptionsMessage && typeof noOptionsMessage === 'string' ? function () {
4991
5023
  return noOptionsMessage;
@@ -4993,19 +5025,16 @@ var SelectField = function SelectField(_ref) {
4993
5025
  return React__default.createElement(Field, Object.assign({}, fieldProps), React__default.createElement(AffixContainer, {
4994
5026
  prefix: prefix
4995
5027
  }, React__default.createElement(Select__default, {
4996
- inputId: controllers.id,
4997
- options: options,
4998
- isDisabled: disabled,
4999
- value: controllers.value,
5000
- placeholder: placeholder,
5001
- noOptionsMessage: typeof noOptionsMessage === 'function' ? noOptionsMessage : defaultNoOptionsMessage,
5002
- styles: getSelectStyles$1({
5003
- isInvalid: hasError,
5004
- asToolbarFilter: asToolbarFilter
5005
- }),
5006
- menuPortalTarget: document.body,
5007
- onChange: controllers.onChange,
5008
- onBlur: controllers.onBlur,
5028
+ closeMenuOnScroll: function closeMenuOnScroll(e) {
5029
+ if (menuShouldScrollIntoView || !e.target) {
5030
+ return false;
5031
+ }
5032
+
5033
+ var target = e.target;
5034
+ var firstOption = target.children[0];
5035
+ var isScrollingTheMenu = firstOption && typeof firstOption.id === 'string' && firstOption.id.includes('react-select');
5036
+ return !isScrollingTheMenu;
5037
+ },
5009
5038
  components: {
5010
5039
  Option: UserCustomOption ? function (props) {
5011
5040
  return React__default.createElement(CustomOption$1, Object.assign({
@@ -5018,19 +5047,23 @@ var SelectField = function SelectField(_ref) {
5018
5047
  }, props));
5019
5048
  } : Select.components.Control
5020
5049
  },
5021
- menuShouldScrollIntoView: menuShouldScrollIntoView,
5050
+ inputId: controllers.id,
5051
+ isClearable: isClearable,
5052
+ isDisabled: disabled,
5053
+ menuPortalTarget: document.body,
5022
5054
  menuPlacement: menuShouldScrollIntoView ? 'bottom' : 'auto',
5023
5055
  menuPosition: menuShouldScrollIntoView ? 'absolute' : 'fixed',
5024
- closeMenuOnScroll: function closeMenuOnScroll(e) {
5025
- if (menuShouldScrollIntoView || !e.target) {
5026
- return false;
5027
- }
5028
-
5029
- var target = e.target;
5030
- var firstOption = target.children[0];
5031
- var isScrollingTheMenu = firstOption && typeof firstOption.id === 'string' && firstOption.id.includes('react-select');
5032
- return !isScrollingTheMenu;
5033
- }
5056
+ noOptionsMessage: typeof noOptionsMessage === 'function' ? noOptionsMessage : defaultNoOptionsMessage,
5057
+ menuShouldScrollIntoView: menuShouldScrollIntoView,
5058
+ onBlur: controllers.onBlur,
5059
+ onChange: controllers.onChange,
5060
+ options: options,
5061
+ placeholder: placeholder,
5062
+ styles: getSelectStyles$1({
5063
+ isInvalid: hasError,
5064
+ asToolbarFilter: asToolbarFilter
5065
+ }),
5066
+ value: controllers.value
5034
5067
  })));
5035
5068
  };
5036
5069
 
@@ -5987,6 +6020,7 @@ exports.IconBan = IconBan;
5987
6020
  exports.IconBarsH = IconBarsH;
5988
6021
  exports.IconBarsV = IconBarsV;
5989
6022
  exports.IconBell = IconBell;
6023
+ exports.IconBirthdayCake = IconBirthdayCake;
5990
6024
  exports.IconBold = IconBold;
5991
6025
  exports.IconBolt = IconBolt;
5992
6026
  exports.IconBook = IconBook;
@@ -5998,6 +6032,7 @@ exports.IconCalendarAlt = IconCalendarAlt;
5998
6032
  exports.IconCalendarCheck = IconCalendarCheck;
5999
6033
  exports.IconCalendarDay = IconCalendarDay;
6000
6034
  exports.IconCalendarExclamation = IconCalendarExclamation;
6035
+ exports.IconCalendarStar = IconCalendarStar;
6001
6036
  exports.IconCalendarTomorrow = IconCalendarTomorrow;
6002
6037
  exports.IconCamera = IconCamera;
6003
6038
  exports.IconCameraSlash = IconCameraSlash;