@7shifts/sous-chef 2.3.5 → 2.5.0

package/dist/controls/ToolbarSelect/index.d.ts

@@ -0,0 +1 @@
+export { default } from './ToolbarSelect';

package/dist/controls/index.d.ts

@@ -0,0 +1,2 @@
+import ToolbarSelect from './ToolbarSelect';
+export { ToolbarSelect };

package/dist/forms/SelectField/SelectField.d.ts

@@ -4,27 +4,28 @@ declare type NoOptionsMessageFunction = (input: {
     inputValue: string;
 }) => string | null;
 declare type Props<T> = {
-    name: string;
-    /** If not provided it will generate a random id so the label links properly with the text input */
+    asToolbarFilter?: boolean;
+    caption?: React.ReactNode;
+    disabled?: boolean;
+    error?: string;
+    /** If not provided it will generate a random id so the l¡abel links properly with the text input */
     id?: string;
-    value?: SelectOption<T>;
-    options: SelectOptions<T>;
+    isClearable?: boolean;
+    label?: React.ReactNode;
+    /** 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. */
+    menuShouldScrollIntoView?: boolean;
+    name: string;
+    noOptionsMessage?: string | NoOptionsMessageFunction;
     onChange?: (e: SelectOption<T>) => void;
     onBlur?: (e: SelectOption<T>) => void;
-    CustomOption?: React.ElementType;
-    SelectedOptionPrefix?: React.ElementType;
-    label?: React.ReactNode;
-    caption?: React.ReactNode;
-    error?: string;
+    options: SelectOptions<T>;
     placeholder?: string;
-    noOptionsMessage?: string | NoOptionsMessageFunction;
-    disabled?: boolean;
     /** Use a prefix for things like currency symbols (“$”, “¥”, “£”) or icons. */
     prefix?: React.ReactNode;
-    asToolbarFilter?: boolean;
-    /** 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. */
-    menuShouldScrollIntoView?: boolean;
+    value?: SelectOption<T>;
+    CustomOption?: React.ElementType;
+    SelectedOptionPrefix?: React.ElementType;
 };
 /** Component to make possible choose from a predefined options. */
-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;
+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;
 export default SelectField;

package/dist/icons/components/IconBirthdayCake.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { IconSize } from '../types';
+declare type Props = {
+    size?: IconSize;
+    color?: string;
+} & React.SVGProps<SVGSVGElement>;
+declare const IconBirthdayCake: {
+    (props: Props): JSX.Element;
+    displayName: string;
+};
+export default IconBirthdayCake;

package/dist/icons/components/IconCalendarStar.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { IconSize } from '../types';
+declare type Props = {
+    size?: IconSize;
+    color?: string;
+} & React.SVGProps<SVGSVGElement>;
+declare const IconCalendarStar: {
+    (props: Props): JSX.Element;
+    displayName: string;
+};
+export default IconCalendarStar;

package/dist/icons/components/IconStarSolid.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { IconSize } from '../types';
+declare type Props = {
+    size?: IconSize;
+    color?: string;
+} & React.SVGProps<SVGSVGElement>;
+declare const IconStarSolid: {
+    (props: Props): JSX.Element;
+    displayName: string;
+};
+export default IconStarSolid;

package/dist/icons/components/index.d.ts

@@ -12,6 +12,7 @@ export { default as IconBan } from './IconBan';
 export { default as IconBarsH } from './IconBarsH';
 export { default as IconBarsV } from './IconBarsV';
 export { default as IconBell } from './IconBell';
+export { default as IconBirthdayCake } from './IconBirthdayCake';
 export { default as IconBold } from './IconBold';
 export { default as IconBolt } from './IconBolt';
 export { default as IconBook } from './IconBook';
@@ -22,6 +23,7 @@ export { default as IconCalendarAlt } from './IconCalendarAlt';
 export { default as IconCalendarCheck } from './IconCalendarCheck';
 export { default as IconCalendarDay } from './IconCalendarDay';
 export { default as IconCalendarExclamation } from './IconCalendarExclamation';
+export { default as IconCalendarStar } from './IconCalendarStar';
 export { default as IconCalendarTomorrow } from './IconCalendarTomorrow';
 export { default as IconCalendar } from './IconCalendar';
 export { default as IconCameraSlash } from './IconCameraSlash';
@@ -94,6 +96,7 @@ export { default as IconSignOut } from './IconSignOut';
 export { default as IconSitemap } from './IconSitemap';
 export { default as IconSlidersH } from './IconSlidersH';
 export { default as IconSort } from './IconSort';
+export { default as IconStarSolid } from './IconStarSolid';
 export { default as IconStar } from './IconStar';
 export { default as IconStickyNoteLines } from './IconStickyNoteLines';
 export { default as IconStopwatch } from './IconStopwatch';

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 export * from './core';
+export * from './controls';
 export * from './forms';
 export * from './feedback';
 export * from './actions';

package/dist/index.js

@@ -974,6 +974,21 @@ var IconBell = function IconBell(props) {
 
 IconBell.displayName = 'IconBell';
 
+var IconBirthdayCake = function IconBirthdayCake(props) {
+  return React__default.createElement("svg", Object.assign({
+    viewBox: "0 0 20 20",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    "data-testid": "icon-birthday-cake",
+    style: getIconStyles(props)
+  }, props), React__default.createElement("path", {
+    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",
+    fill: "currentColor"
+  }));
+};
+
+IconBirthdayCake.displayName = 'IconBirthdayCake';
+
 var IconBold = function IconBold(props) {
   return React__default.createElement("svg", Object.assign({
     viewBox: "0 0 20 20",
@@ -1149,6 +1164,21 @@ var IconCalendarExclamation = function IconCalendarExclamation(props) {
 
 IconCalendarExclamation.displayName = 'IconCalendarExclamation';
 
+var IconCalendarStar = function IconCalendarStar(props) {
+  return React__default.createElement("svg", Object.assign({
+    viewBox: "0 0 20 20",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    "data-testid": "icon-calendar-star",
+    style: getIconStyles(props)
+  }, props), React__default.createElement("path", {
+    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",
+    fill: "currentColor"
+  }));
+};
+
+IconCalendarStar.displayName = 'IconCalendarStar';
+
 var IconCalendarTomorrow = function IconCalendarTomorrow(props) {
   return React__default.createElement("svg", Object.assign({
     viewBox: "0 0 20 20",
@@ -2493,6 +2523,21 @@ var IconSort = function IconSort(props) {
 
 IconSort.displayName = 'IconSort';
 
+var IconStarSolid = function IconStarSolid(props) {
+  return React__default.createElement("svg", Object.assign({
+    viewBox: "0 0 20 20",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    "data-testid": "icon-star-solid",
+    style: getIconStyles(props)
+  }, props), React__default.createElement("path", {
+    d: "M8.944 1.591 6.602 6.34l-5.239.763C.423 7.24.047 8.398.73 9.06l3.79 3.694-.897 5.217c-.16.943.832 1.65 1.664 1.209l4.687-2.464 4.686 2.463c.832.438 1.826-.265 1.664-1.208l-.896-5.217 3.79-3.694c.681-.663.305-1.821-.635-1.958l-5.239-.763-2.341-4.748c-.42-.846-1.635-.857-2.058 0Z",
+    fill: "currentColor"
+  }));
+};
+
+IconStarSolid.displayName = 'IconStarSolid';
+
 var IconStar = function IconStar(props) {
   return React__default.createElement("svg", Object.assign({
     viewBox: "0 0 20 20",
@@ -3397,7 +3442,7 @@ var DataTable = function DataTable(_ref) {
       numberOfRows: numberOfRows,
       hasVerticalBorders: hasVerticalBorders
     }
-  }, React__default.createElement("div", null, columns && React__default.createElement(DataTableHeader, {
+  }, columns && React__default.createElement(DataTableHeader, {
     columns: columns,
     onSort: onSort,
     showActionMenu: showActionMenu
@@ -3425,7 +3470,7 @@ var DataTable = function DataTable(_ref) {
     hasNext: hasNext && !isLoading,
     onPreviousClick: onPreviousClick,
     onNextClick: onNextClick
-  }))));
+  })));
 };
 
 var DefaultItemComponent$1 = function DefaultItemComponent(_ref2) {
@@ -3754,6 +3799,187 @@ var DataTableEditableCell = function DataTableEditableCell(_ref) {
   }))));
 };
 
+var useSelectFieldControllers = function useSelectFieldControllers(_ref) {
+  var name = _ref.name,
+      inputId = _ref.id,
+      value = _ref.value,
+      _onChange = _ref.onChange,
+      _onBlur = _ref.onBlur,
+      error = _ref.error;
+
+  var _useFormContext = useFormContext(),
+      formik = _useFormContext.formik;
+
+  var id = useFieldId({
+    name: name,
+    id: inputId
+  });
+  var controllers = {
+    id: id,
+    error: error,
+    value: value,
+    onChange: function onChange(option) {
+      return _onChange && _onChange(option);
+    },
+    onBlur: function onBlur(option) {
+      return _onBlur && _onBlur(option);
+    }
+  };
+  var formikState = getFormikState(name, formik);
+
+  if (formik && formikState) {
+    controllers = _extends({}, controllers, {
+      error: error ? controllers.error : formikState.error,
+      value: value ? controllers.value : formikState.value,
+      onChange: function onChange(option) {
+        if (_onChange) {
+          _onChange(option);
+        }
+
+        formik.setFieldValue(name, option);
+      },
+      onBlur: function onBlur(option) {
+        if (_onBlur) {
+          _onBlur(option);
+        }
+
+        formik.setFieldTouched(name);
+      }
+    });
+  }
+
+  return controllers;
+};
+
+var getSelectStyles = function getSelectStyles(_ref) {
+  var _ref$wrapToNextLine = _ref.wrapToNextLine,
+      wrapToNextLine = _ref$wrapToNextLine === void 0 ? false : _ref$wrapToNextLine;
+  return {
+    valueContainer: function valueContainer(base) {
+      return Object.assign({}, base, {
+        flexWrap: wrapToNextLine ? 'wrap' : 'nowrap'
+      });
+    },
+    container: function container(base, state) {
+      return Object.assign({}, base, {
+        flex: '1',
+        fontFamily: FONT_FAMILY,
+        minWidth: '64px',
+        background: state.isDisabled ? GREY100 : WHITE,
+        ':hover': {
+          backgroundColor: GREY100
+        },
+        position: 'initial'
+      });
+    },
+    control: function control(base, state) {
+      return Object.assign({}, base, {
+        color: state.isDisabled ? GREY400 : GREY500,
+        boxShadow: 'none',
+        fontSize: '14px',
+        cursor: 'pointer',
+        background: 'none',
+        outline: '1px solid',
+        outlineColor: GREY300,
+        borderRadius: '4px',
+        border: 'none'
+      });
+    },
+    indicatorSeparator: function indicatorSeparator() {
+      return {
+        display: 'none'
+      };
+    },
+    placeholder: function placeholder(base, state) {
+      return _extends({}, base, {
+        color: state.isDisabled ? GREY300 : GREY400,
+        marginRight: 0,
+        position: 'static',
+        transform: 'initial',
+        overflow: 'hidden',
+        textOverflow: 'ellipsis',
+        whiteSpace: 'nowrap'
+      });
+    },
+    singleValue: function singleValue(base, state) {
+      return Object.assign({}, base, {
+        color: state.isDisabled ? GREY400 : null,
+        marginRight: 0,
+        position: 'static',
+        transform: 'initial',
+        overflow: 'hidden',
+        textOverflow: 'ellipsis',
+        whiteSpace: 'nowrap'
+      });
+    },
+    dropdownIndicator: function dropdownIndicator(base) {
+      return Object.assign({}, base, {
+        color: GREY400,
+        padding: '8px'
+      });
+    },
+    option: function option(base, state) {
+      return Object.assign({}, base, {
+        backgroundColor: state.isDisabled ? null : state.isSelected ? EGGPLANT200 : state.isFocused ? GREY100 : WHITE,
+        color: state.isDisabled ? GREY400 : GREY500,
+        cursor: state.isDisabled ? 'default' : 'pointer',
+        fontFamily: FONT_FAMILY,
+        fontSize: '14px'
+      });
+    },
+    group: function group(base) {
+      return Object.assign({}, base, {
+        fontFamily: FONT_FAMILY
+      });
+    },
+    menu: function menu(base) {
+      return _extends({}, base, {
+        zIndex: Z_INDEX_LAYERS.MENU,
+        minWidth: '164px'
+      });
+    },
+    menuPortal: function menuPortal(base) {
+      return _extends({}, base, {
+        zIndex: Z_INDEX_LAYERS.MENU
+      });
+    }
+  };
+};
+
+var ToolbarSelect = function ToolbarSelect(_ref) {
+  var name = _ref.name,
+      value = _ref.value,
+      options = _ref.options,
+      onChange = _ref.onChange,
+      onBlur = _ref.onBlur,
+      placeholder = _ref.placeholder,
+      disabled = _ref.disabled,
+      prefix = _ref.prefix;
+  var controllers = useSelectFieldControllers({
+    name: name,
+    value: value,
+    onChange: onChange,
+    onBlur: onBlur
+  });
+  return React__default.createElement(AffixContainer, {
+    prefix: prefix
+  }, React__default.createElement(Select__default, {
+    inputId: controllers.id,
+    options: options,
+    isDisabled: disabled,
+    value: controllers.value,
+    placeholder: placeholder,
+    styles: getSelectStyles({}),
+    menuPortalTarget: document.body,
+    onChange: controllers.onChange,
+    onBlur: controllers.onBlur,
+    components: {
+      Option: Select.components.Option,
+      Control: Select.components.Control
+    }
+  }));
+};
+
 var styles$h = {"form--standard-size":"_3CaV0"};
 
 var Form = function Form(_ref) {
@@ -4513,7 +4739,7 @@ var PasswordField = function PasswordField(_ref) {
   }))));
 };
 
-var getSelectStyles = function getSelectStyles(_ref) {
+var getSelectStyles$1 = function getSelectStyles(_ref) {
   var isInvalid = _ref.isInvalid,
       _ref$asToolbarFilter = _ref.asToolbarFilter,
       asToolbarFilter = _ref$asToolbarFilter === void 0 ? false : _ref$asToolbarFilter,
@@ -4687,7 +4913,7 @@ var MultiSelectField = function MultiSelectField(_ref) {
     value: controllers.value,
     placeholder: placeholder,
     noOptionsMessage: typeof noOptionsMessage === 'function' ? noOptionsMessage : defaultNoOptionsMessage,
-    styles: getSelectStyles({
+    styles: getSelectStyles$1({
       isInvalid: hasError,
       wrapToNextLine: true
     }),
@@ -4719,58 +4945,6 @@ var MultiSelectField = function MultiSelectField(_ref) {
   }));
 };
 
-var useSelectFieldControllers = function useSelectFieldControllers(_ref) {
-  var name = _ref.name,
-      inputId = _ref.id,
-      value = _ref.value,
-      _onChange = _ref.onChange,
-      _onBlur = _ref.onBlur,
-      error = _ref.error;
-
-  var _useFormContext = useFormContext(),
-      formik = _useFormContext.formik;
-
-  var id = useFieldId({
-    name: name,
-    id: inputId
-  });
-  var controllers = {
-    id: id,
-    error: error,
-    value: value,
-    onChange: function onChange(option) {
-      return _onChange && _onChange(option);
-    },
-    onBlur: function onBlur(option) {
-      return _onBlur && _onBlur(option);
-    }
-  };
-  var formikState = getFormikState(name, formik);
-
-  if (formik && formikState) {
-    controllers = _extends({}, controllers, {
-      error: error ? controllers.error : formikState.error,
-      value: value ? controllers.value : formikState.value,
-      onChange: function onChange(option) {
-        if (_onChange) {
-          _onChange(option);
-        }
-
-        formik.setFieldValue(name, option);
-      },
-      onBlur: function onBlur(option) {
-        if (_onBlur) {
-          _onBlur(option);
-        }
-
-        formik.setFieldTouched(name);
-      }
-    });
-  }
-
-  return controllers;
-};
-
 var styles$q = {"custom-control":"_1cDCR"};
 
 var _excluded$4 = ["children", "CustomPrefixComponent"];
@@ -4808,40 +4982,42 @@ function CustomOption$1(_ref) {
 }
 
 var SelectField = function SelectField(_ref) {
-  var name = _ref.name,
+  var _ref$asToolbarFilter = _ref.asToolbarFilter,
+      asToolbarFilter = _ref$asToolbarFilter === void 0 ? false : _ref$asToolbarFilter,
+      caption = _ref.caption,
+      disabled = _ref.disabled,
+      error = _ref.error,
       inputId = _ref.id,
-      value = _ref.value,
+      _ref$isClearable = _ref.isClearable,
+      isClearable = _ref$isClearable === void 0 ? false : _ref$isClearable,
+      label = _ref.label,
+      _ref$menuShouldScroll = _ref.menuShouldScrollIntoView,
+      menuShouldScrollIntoView = _ref$menuShouldScroll === void 0 ? true : _ref$menuShouldScroll,
+      name = _ref.name,
+      noOptionsMessage = _ref.noOptionsMessage,
       options = _ref.options,
-      onChange = _ref.onChange,
       onBlur = _ref.onBlur,
-      UserCustomOption = _ref.CustomOption,
-      SelectedOptionPrefix = _ref.SelectedOptionPrefix,
-      label = _ref.label,
-      caption = _ref.caption,
-      error = _ref.error,
+      onChange = _ref.onChange,
       placeholder = _ref.placeholder,
-      noOptionsMessage = _ref.noOptionsMessage,
-      disabled = _ref.disabled,
       prefix = _ref.prefix,
-      _ref$asToolbarFilter = _ref.asToolbarFilter,
-      asToolbarFilter = _ref$asToolbarFilter === void 0 ? false : _ref$asToolbarFilter,
-      _ref$menuShouldScroll = _ref.menuShouldScrollIntoView,
-      menuShouldScrollIntoView = _ref$menuShouldScroll === void 0 ? true : _ref$menuShouldScroll;
+      value = _ref.value,
+      UserCustomOption = _ref.CustomOption,
+      SelectedOptionPrefix = _ref.SelectedOptionPrefix;
   var controllers = useSelectFieldControllers({
-    name: name,
+    error: error,
     id: inputId,
-    value: value,
+    name: name,
     onChange: onChange,
     onBlur: onBlur,
-    error: error
+    value: value
   });
   var hasError = !!controllers.error;
   var fieldProps = {
-    name: name,
+    caption: caption,
+    error: controllers.error,
     id: controllers.id,
     label: label,
-    caption: caption,
-    error: controllers.error
+    name: name
   };
   var defaultNoOptionsMessage = noOptionsMessage && typeof noOptionsMessage === 'string' ? function () {
     return noOptionsMessage;
@@ -4849,19 +5025,16 @@ var SelectField = function SelectField(_ref) {
   return React__default.createElement(Field, Object.assign({}, fieldProps), React__default.createElement(AffixContainer, {
     prefix: prefix
   }, React__default.createElement(Select__default, {
-    inputId: controllers.id,
-    options: options,
-    isDisabled: disabled,
-    value: controllers.value,
-    placeholder: placeholder,
-    noOptionsMessage: typeof noOptionsMessage === 'function' ? noOptionsMessage : defaultNoOptionsMessage,
-    styles: getSelectStyles({
-      isInvalid: hasError,
-      asToolbarFilter: asToolbarFilter
-    }),
-    menuPortalTarget: document.body,
-    onChange: controllers.onChange,
-    onBlur: controllers.onBlur,
+    closeMenuOnScroll: function closeMenuOnScroll(e) {
+      if (menuShouldScrollIntoView || !e.target) {
+        return false;
+      }
+
+      var target = e.target;
+      var firstOption = target.children[0];
+      var isScrollingTheMenu = firstOption && typeof firstOption.id === 'string' && firstOption.id.includes('react-select');
+      return !isScrollingTheMenu;
+    },
     components: {
       Option: UserCustomOption ? function (props) {
         return React__default.createElement(CustomOption$1, Object.assign({
@@ -4874,19 +5047,23 @@ var SelectField = function SelectField(_ref) {
         }, props));
       } : Select.components.Control
     },
-    menuShouldScrollIntoView: menuShouldScrollIntoView,
+    inputId: controllers.id,
+    isClearable: isClearable,
+    isDisabled: disabled,
+    menuPortalTarget: document.body,
     menuPlacement: menuShouldScrollIntoView ? 'bottom' : 'auto',
     menuPosition: menuShouldScrollIntoView ? 'absolute' : 'fixed',
-    closeMenuOnScroll: function closeMenuOnScroll(e) {
-      if (menuShouldScrollIntoView || !e.target) {
-        return false;
-      }
-
-      var target = e.target;
-      var firstOption = target.children[0];
-      var isScrollingTheMenu = firstOption && typeof firstOption.id === 'string' && firstOption.id.includes('react-select');
-      return !isScrollingTheMenu;
-    }
+    noOptionsMessage: typeof noOptionsMessage === 'function' ? noOptionsMessage : defaultNoOptionsMessage,
+    menuShouldScrollIntoView: menuShouldScrollIntoView,
+    onBlur: controllers.onBlur,
+    onChange: controllers.onChange,
+    options: options,
+    placeholder: placeholder,
+    styles: getSelectStyles$1({
+      isInvalid: hasError,
+      asToolbarFilter: asToolbarFilter
+    }),
+    value: controllers.value
   })));
 };
 
@@ -5843,6 +6020,7 @@ exports.IconBan = IconBan;
 exports.IconBarsH = IconBarsH;
 exports.IconBarsV = IconBarsV;
 exports.IconBell = IconBell;
+exports.IconBirthdayCake = IconBirthdayCake;
 exports.IconBold = IconBold;
 exports.IconBolt = IconBolt;
 exports.IconBook = IconBook;
@@ -5854,6 +6032,7 @@ exports.IconCalendarAlt = IconCalendarAlt;
 exports.IconCalendarCheck = IconCalendarCheck;
 exports.IconCalendarDay = IconCalendarDay;
 exports.IconCalendarExclamation = IconCalendarExclamation;
+exports.IconCalendarStar = IconCalendarStar;
 exports.IconCalendarTomorrow = IconCalendarTomorrow;
 exports.IconCamera = IconCamera;
 exports.IconCameraSlash = IconCameraSlash;
@@ -5927,6 +6106,7 @@ exports.IconSitemap = IconSitemap;
 exports.IconSlidersH = IconSlidersH;
 exports.IconSort = IconSort;
 exports.IconStar = IconStar;
+exports.IconStarSolid = IconStarSolid;
 exports.IconStickyNoteLines = IconStickyNoteLines;
 exports.IconStopwatch = IconStopwatch;
 exports.IconStrikethrough = IconStrikethrough;
@@ -5974,6 +6154,7 @@ exports.TextAreaField = TextAreaField;
 exports.TextField = TextField;
 exports.TimeField = TimeField;
 exports.Toggle = Toggle;
+exports.ToolbarSelect = ToolbarSelect;
 exports.Tooltip = Tooltip$1;
 exports.WeekField = WeekField;
 //# sourceMappingURL=index.js.map