@ntbjs/react-components 2.0.2-rc.3 → 2.0.2-rc.5

package/build/inputs/MultiSelect/MultiSelect.js

@@ -3,272 +3,164 @@ import React__default, { useState, useEffect, useMemo } from 'react';
 import PropTypes from 'prop-types';
 import { nanoid } from 'nanoid';
 import { components } from 'react-select';
-import { useTheme } from 'styled-components';
-import { MultiSelectWrapper, AsyncCreatableMultiSelect, AsyncMultiSelect, CreatableMultiSelect, MultiSelect as MultiSelect$1, ShowMoreWrapper, ShowMoreOverlay, ShowMoreText, ErrorMessage, Control as Control$1, Label, ValueContainer as ValueContainer$1, MultiValueWrapper, MultiValueRemoveIcon, InputWrapper, OptionContent, DropdownOptionDeleteIcon } from './MultiSelect.styled.js';
+import { MultiSelectWrapper, Label, InnerWrapper, AsyncCreatableMultiSelect, AsyncMultiSelect, CreatableMultiSelect, MultiSelect as MultiSelect$1, ShowMoreWrapper, ShowMoreOverlay, ShowMoreText, ErrorMessage, MultiValue, InputWrapper, DropdownMenu, SelectedOption, DropdownOptionDeleteIcon, Option } from './MultiSelect.styled.js';
+import { ReactComponent as SvgClose } from '../../icons/close.svg.js';
 
-const Control = props => {
-  return React__default.createElement(Control$1, {
-    $readOnly: props.selectProps.readOnly
-  }, React__default.createElement(components.Control, props));
-};
-Control.propTypes = process.env.NODE_ENV !== "production" ? {
-  selectProps: PropTypes.shape({
-    readOnly: PropTypes.bool
-  }).isRequired
-} : {};
-const ValueContainer = props => {
-  const {
-    children,
-    selectProps
-  } = props;
-  return React__default.createElement(components.ValueContainer, props, selectProps.label && React__default.createElement(Label, {
-    htmlFor: selectProps.uniqueId
-  }, selectProps.label), React__default.createElement(ValueContainer$1, {
-    $showMore: selectProps.displayShowMore,
-    $error: selectProps.error,
-    $warning: selectProps.warning
-  }, children));
-};
-ValueContainer.propTypes = process.env.NODE_ENV !== "production" ? {
-  children: PropTypes.node,
-  selectProps: PropTypes.shape({
-    label: PropTypes.string,
-    uniqueId: PropTypes.string,
-    displayShowMore: PropTypes.bool,
-    error: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
-    warning: PropTypes.oneOfType([PropTypes.bool, PropTypes.string])
-  }).isRequired
-} : {};
-const MultiValue = props => {
-  const {
-    selectProps,
-    data
-  } = props;
-  const handleMouseDown = e => {
-    const isRemoveClick = e.target.closest('[role="button"]') || e.target.closest('svg');
-    if (isRemoveClick) {
-      return;
-    }
-    if (selectProps.onMultiValueClick && data) {
-      e.stopPropagation();
-      selectProps.onMultiValueClick(data);
-    }
-  };
-  return React__default.createElement(MultiValueWrapper, {
-    onMouseDown: handleMouseDown
-  }, React__default.createElement(components.MultiValue, props));
-};
-MultiValue.propTypes = process.env.NODE_ENV !== "production" ? {
-  data: PropTypes.object.isRequired,
-  selectProps: PropTypes.shape({
-    onMultiValueClick: PropTypes.func
-  }).isRequired
-} : {};
-const MultiValueRemove = props => {
-  if (props.selectProps.readOnly || props.selectProps.disabled) return null;
-  return React__default.createElement(components.MultiValueRemove, props, React__default.createElement(MultiValueRemoveIcon, null));
-};
-MultiValueRemove.propTypes = process.env.NODE_ENV !== "production" ? {
-  selectProps: PropTypes.shape({
-    readOnly: PropTypes.bool,
-    disabled: PropTypes.bool
-  }).isRequired
-} : {};
-const Input = props => React__default.createElement(InputWrapper, {
-  $focused: props.selectProps.focused,
-  $editText: props.selectProps.editText
-}, React__default.createElement(components.Input, _extends({}, props, {
-  isDisabled: props.selectProps.readOnly || props.selectProps.disabled
-})));
-Input.propTypes = process.env.NODE_ENV !== "production" ? {
-  selectProps: PropTypes.shape({
-    focused: PropTypes.bool,
-    editText: PropTypes.string,
-    readOnly: PropTypes.bool,
-    disabled: PropTypes.bool
-  }).isRequired
-} : {};
-const Option = props => {
-  const {
-    isSelected,
-    label,
-    isFocused
-  } = props;
-  return React__default.createElement(components.Option, props, React__default.createElement(OptionContent, {
-    $isFocused: isFocused
-  }, label, isSelected && React__default.createElement(DropdownOptionDeleteIcon, null)));
-};
-Option.propTypes = process.env.NODE_ENV !== "production" ? {
-  isSelected: PropTypes.bool,
-  label: PropTypes.string,
-  isFocused: PropTypes.bool
-} : {};
 const MultiSelect = React__default.forwardRef(function MultiSelect({
   label,
-  selectedOptions,
+  selectedOptions = [],
   availableOptions,
   loadOptions,
   loadingMessageFunc,
   onUpdateCallback,
   editText,
-  createNewOptionMessageFunc,
-  onMultiValueClick,
-  showMore,
-  showMoreText,
-  displayTotalOnShowMore,
   creatable,
   readOnly,
   hidden,
   disabled,
   error,
   warning,
-  noOptionsMessageFunc = val => val ? `No matches for "${val}"` : 'No options',
+  onMultiValueClick,
+  showMore,
+  showMoreText = 'Show more',
+  displayTotalOnShowMore = true,
+  noOptionsMessageFunc,
   ...props
 }, forwardedRef) {
   const [uniqueId] = useState(nanoid());
-  const [selected, setSelected] = useState(selectedOptions || []);
+  const [selected, setSelected] = useState(selectedOptions);
   const [focused, setFocused] = useState(false);
   const [displayShowMore, setDisplayShowMore] = useState(error || warning ? false : showMore);
-  const [cacheUnique, setCacheUnique] = useState(0);
-  const theme = useTheme();
   useEffect(() => {
-    setSelected(selectedOptions || []);
+    setSelected(selectedOptions);
   }, [selectedOptions]);
-  const isDark = theme?.isDark || document.body.classList.contains('dark-theme');
-  const getC = key => theme.getColor(key);
-  const getP = (dark, light) => {
-    const themeFn = theme.themeProp(dark, light);
-    return typeof themeFn === 'function' ? themeFn({
-      theme
-    }) : themeFn;
+  const getNoOptionsMessage = inputValue => {
+    if (typeof noOptionsMessageFunc === 'function') {
+      return noOptionsMessageFunc(inputValue);
+    }
+    return inputValue ? `No matches for "${inputValue}"` : 'No available options';
+  };
+  const innerComponents = {
+    DropdownIndicator: null,
+    MultiValue: ({
+      data,
+      ...props
+    }) => {
+      return React__default.createElement("div", {
+        className: "multi-value-wrapper",
+        onMouseDown: e => {
+          e.stopPropagation();
+          if (onMultiValueClick && data && !(e.target.role === 'button' || e.target instanceof SVGElement)) {
+            onMultiValueClick(data);
+          }
+        }
+      }, React__default.createElement(MultiValue, _extends({
+        data: data,
+        isDisabled: disabled,
+        isReadOnly: readOnly
+      }, props)));
+    },
+    MultiValueRemove: props => {
+      if (readOnly || disabled) return null;
+      return React__default.createElement(components.MultiValueRemove, props, React__default.createElement(SvgClose, null));
+    },
+    Input: inputProps => React__default.createElement(InputWrapper, {
+      $focused: focused,
+      $editText: !readOnly && !disabled ? editText : '',
+      isDisabled: readOnly || disabled
+    }, React__default.createElement(components.Input, inputProps)),
+    Menu: menuProps => React__default.createElement(DropdownMenu, menuProps),
+    Option: optProps => optProps.isSelected ? React__default.createElement(SelectedOption, optProps, React__default.createElement("span", null, optProps.label), React__default.createElement(DropdownOptionDeleteIcon, null)) : React__default.createElement(Option, optProps)
   };
   const selectStyles = useMemo(() => ({
     control: base => ({
       ...base,
+      alignItems: 'flex-start',
+      background: 'transparent',
       border: 'none',
       boxShadow: 'none',
-      background: 'transparent',
       minHeight: 'unset'
     }),
     valueContainer: base => ({
       ...base,
       padding: 0,
-      overflow: 'visible'
+      gap: '8px',
+      maxHeight: displayShowMore && !(error || warning) ? '130px' : '100%'
     }),
-    multiValue: base => ({
-      ...base,
-      margin: 0,
-      borderRadius: '3px',
-      backgroundColor: isDark ? getC('gray-600') : getC('gray-800')
-    }),
-    multiValueLabel: (base, {
-      selectProps
-    }) => ({
+    menu: base => ({
       ...base,
-      color: getC('gray-100'),
-      fontSize: '12px',
-      paddingLeft: '8px',
-      paddingTop: '8px',
-      paddingBottom: '8px',
-      paddingRight: selectProps.readOnly ? '8px' : '4px'
+      backgroundColor: 'transparent',
+      boxShadow: 'none'
     }),
-    multiValueRemove: base => ({
+    menuList: base => ({
       ...base,
-      color: 'white',
-      padding: '0 8px',
-      cursor: 'pointer',
-      '&:hover': {
-        backgroundColor: getC('red-500'),
-        color: 'white',
-        borderRadius: '0 3px 3px 0'
-      }
+      backgroundColor: 'transparent'
     }),
-    option: (base, state) => ({
+    option: base => ({
       ...base,
-      padding: 0,
-      cursor: 'pointer',
-      backgroundColor: state.isFocused ? getC('gray-100') : 'transparent',
-      '&:active': {
-        backgroundColor: getC('gray-100')
-      }
+      backgroundColor: 'transparent',
+      color: 'inherit'
     }),
-    menu: base => ({
+    multiValue: base => ({
       ...base,
-      zIndex: 9999,
-      backgroundColor: getP(getC('gray-600'), getC('white')),
-      marginTop: '4px'
+      margin: 0,
+      border: 'none',
+      background: 'none'
     }),
-    input: base => ({
+    multiValueLabel: base => ({
       ...base,
-      margin: 0,
       padding: 0
     }),
-    placeholder: base => ({
+    multiValueRemove: base => ({
       ...base,
-      display: 'none'
+      padding: 0,
+      cursor: 'pointer'
     })
-  }), [theme, isDark]);
-  const sharedSelectProps = {
+  }), [error, warning, displayShowMore]);
+  const sharedProps = {
+    ...props,
     ref: forwardedRef,
+    classNamePrefix: 'multi-select',
     value: selected,
     options: loadOptions ? undefined : availableOptions,
     loadOptions,
+    loadingMessage: loadingMessageFunc,
+    styles: selectStyles,
+    components: innerComponents,
     isMulti: true,
     isClearable: false,
     placeholder: null,
-    label,
-    uniqueId,
-    displayShowMore,
-    error,
-    warning,
-    readOnly,
-    disabled,
-    focused,
-    editText,
-    onMultiValueClick,
-    key: cacheUnique,
-    loadingMessage: loadingMessageFunc,
-    formatCreateLabel: createNewOptionMessageFunc,
-    components: {
-      DropdownIndicator: null,
-      Control,
-      MultiValue,
-      MultiValueRemove,
-      ValueContainer,
-      Input,
-      Option
-    },
-    styles: selectStyles,
-    theme: rsTheme => ({
-      ...rsTheme,
-      spacing: {
-        ...rsTheme.spacing,
-        baseUnit: 4
-      }
-    }),
-    noOptionsMessage: input => noOptionsMessageFunc(input.inputValue),
+    isDisabled: disabled,
+    readOnly: readOnly,
+    closeMenuOnSelect: false,
+    hideSelectedOptions: false,
+    openMenuOnClick: !disabled && !readOnly,
+    openMenuOnFocus: !disabled && !readOnly,
     onFocus: () => setFocused(true),
     onBlur: () => setFocused(false),
+    noOptionsMessage: ({
+      inputValue
+    }) => getNoOptionsMessage(inputValue),
     onChange: (newValue, actionMeta) => {
-      if (actionMeta.action === 'create-option' && loadOptions) {
-        setCacheUnique(c => c + 1);
-      }
-      const nextValue = newValue || [];
-      setSelected(nextValue);
       if (onUpdateCallback) {
         onUpdateCallback(actionMeta.action, actionMeta.option || actionMeta.removedValue);
       }
+      setSelected(newValue);
     }
   };
   if (hidden) return null;
-  return React__default.createElement(MultiSelectWrapper, null, loadOptions ? creatable ? React__default.createElement(AsyncCreatableMultiSelect, _extends({}, sharedSelectProps, props)) : React__default.createElement(AsyncMultiSelect, _extends({}, sharedSelectProps, props)) : creatable ? React__default.createElement(CreatableMultiSelect, _extends({}, sharedSelectProps, props)) : React__default.createElement(MultiSelect$1, _extends({}, sharedSelectProps, props)), displayShowMore && !(error || warning) && React__default.createElement(ShowMoreWrapper, {
+  return React__default.createElement(MultiSelectWrapper, null, label && React__default.createElement(Label, {
+    htmlFor: uniqueId
+  }, label), React__default.createElement(InnerWrapper, {
+    $error: error,
+    $warning: warning
+  }, loadOptions ? creatable ? React__default.createElement(AsyncCreatableMultiSelect, sharedProps) : React__default.createElement(AsyncMultiSelect, sharedProps) : creatable ? React__default.createElement(CreatableMultiSelect, sharedProps) : React__default.createElement(MultiSelect$1, sharedProps)), displayShowMore && !(error || warning) && React__default.createElement(ShowMoreWrapper, {
     onClick: () => setDisplayShowMore(false)
-  }, React__default.createElement(ShowMoreOverlay, null), React__default.createElement(ShowMoreText, null, showMoreText, " ", displayTotalOnShowMore && `(${selected?.length || 0})`)), (error || warning) && React__default.createElement(ErrorMessage, {
-    $error: !!error,
-    $warning: !!warning
-  }, typeof error === 'string' ? error : warning));
+  }, React__default.createElement(ShowMoreOverlay, null), React__default.createElement(ShowMoreText, null, showMoreText, " ", displayTotalOnShowMore && `(${selected.length})`)), (typeof error === 'string' || typeof warning === 'string') && React__default.createElement(ErrorMessage, {
+    $error: error,
+    $warning: warning
+  }, error ? error : warning));
 });
-MultiSelect.displayName = 'MultiSelect';
 MultiSelect.propTypes = process.env.NODE_ENV !== "production" ? {
   label: PropTypes.string,
   availableOptions: PropTypes.arrayOf(PropTypes.object),

package/build/inputs/MultiSelect/MultiSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"MultiSelect.js","sources":["../../../src/components/inputs/MultiSelect/MultiSelect.js"],"sourcesContent":["import React, { useState, useEffect, useMemo } from 'react';\nimport PropTypes from 'prop-types';\nimport { nanoid } from 'nanoid';\nimport { components } from 'react-select';\nimport { useTheme } from 'styled-components';\nimport * as S from './MultiSelect.styled';\n\n/**\n * HELPER COMPONENTS\n */\nconst Control = props => {\n  return (\n    <S.Control $readOnly={props.selectProps.readOnly}>\n      <components.Control {...props} />\n    </S.Control>\n  );\n};\n\nControl.propTypes = {\n  selectProps: PropTypes.shape({\n    readOnly: PropTypes.bool\n  }).isRequired\n};\n\nconst ValueContainer = props => {\n  const { children, selectProps } = props;\n  return (\n    <components.ValueContainer {...props}>\n      {selectProps.label && <S.Label htmlFor={selectProps.uniqueId}>{selectProps.label}</S.Label>}\n      <S.ValueContainer\n        $showMore={selectProps.displayShowMore}\n        $error={selectProps.error}\n        $warning={selectProps.warning}\n      >\n        {children}\n      </S.ValueContainer>\n    </components.ValueContainer>\n  );\n};\n\nValueContainer.propTypes = {\n  children: PropTypes.node,\n  selectProps: PropTypes.shape({\n    label: PropTypes.string,\n    uniqueId: PropTypes.string,\n    displayShowMore: PropTypes.bool,\n    error: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),\n    warning: PropTypes.oneOfType([PropTypes.bool, PropTypes.string])\n  }).isRequired\n};\n\nconst MultiValue = props => {\n  const { selectProps, data } = props;\n\n  const handleMouseDown = e => {\n    const isRemoveClick = e.target.closest('[role=\"button\"]') || e.target.closest('svg');\n\n    if (isRemoveClick) {\n      return;\n    }\n\n    if (selectProps.onMultiValueClick && data) {\n      e.stopPropagation();\n      selectProps.onMultiValueClick(data);\n    }\n  };\n\n  return (\n    <S.MultiValueWrapper onMouseDown={handleMouseDown}>\n      <components.MultiValue {...props} />\n    </S.MultiValueWrapper>\n  );\n};\n\nMultiValue.propTypes = {\n  data: PropTypes.object.isRequired,\n  selectProps: PropTypes.shape({\n    onMultiValueClick: PropTypes.func\n  }).isRequired\n};\n\nconst MultiValueRemove = props => {\n  if (props.selectProps.readOnly || props.selectProps.disabled) return null;\n  return (\n    <components.MultiValueRemove {...props}>\n      <S.MultiValueRemoveIcon />\n    </components.MultiValueRemove>\n  );\n};\n\nMultiValueRemove.propTypes = {\n  selectProps: PropTypes.shape({\n    readOnly: PropTypes.bool,\n    disabled: PropTypes.bool\n  }).isRequired\n};\n\nconst Input = props => (\n  <S.InputWrapper $focused={props.selectProps.focused} $editText={props.selectProps.editText}>\n    <components.Input\n      {...props}\n      isDisabled={props.selectProps.readOnly || props.selectProps.disabled}\n    />\n  </S.InputWrapper>\n);\n\nInput.propTypes = {\n  selectProps: PropTypes.shape({\n    focused: PropTypes.bool,\n    editText: PropTypes.string,\n    readOnly: PropTypes.bool,\n    disabled: PropTypes.bool\n  }).isRequired\n};\n\nconst Option = props => {\n  const { isSelected, label, isFocused } = props;\n  return (\n    <components.Option {...props}>\n      <S.OptionContent $isFocused={isFocused}>\n        {label}\n        {isSelected && <S.DropdownOptionDeleteIcon />}\n      </S.OptionContent>\n    </components.Option>\n  );\n};\n\nOption.propTypes = {\n  isSelected: PropTypes.bool,\n  label: PropTypes.string,\n  isFocused: PropTypes.bool\n};\n\n/**\n * Multi-select with autocomplete and support for asynchronous fetching/filtering of\n * available options with pagination, update handling with callback,\n * and the ability for the end-user to create new options.\n */\n\nconst MultiSelect = React.forwardRef(function MultiSelect(\n  {\n    label,\n    selectedOptions,\n    availableOptions,\n    loadOptions,\n    loadingMessageFunc,\n    onUpdateCallback,\n    editText,\n    createNewOptionMessageFunc,\n    onMultiValueClick,\n    showMore,\n    showMoreText,\n    displayTotalOnShowMore,\n    creatable,\n    readOnly,\n    hidden,\n    disabled,\n    error,\n    warning,\n    noOptionsMessageFunc = val => (val ? `No matches for \"${val}\"` : 'No options'),\n    ...props\n  },\n  forwardedRef\n) {\n  const [uniqueId] = useState(nanoid());\n  const [selected, setSelected] = useState(selectedOptions || []);\n  const [focused, setFocused] = useState(false);\n  const [displayShowMore, setDisplayShowMore] = useState(error || warning ? false : showMore);\n  const [cacheUnique, setCacheUnique] = useState(0);\n\n  const theme = useTheme();\n\n  useEffect(() => {\n    setSelected(selectedOptions || []);\n  }, [selectedOptions]);\n\n  const isDark = theme?.isDark || document.body.classList.contains('dark-theme');\n  const getC = key => theme.getColor(key);\n  const getP = (dark, light) => {\n    const themeFn = theme.themeProp(dark, light);\n    return typeof themeFn === 'function' ? themeFn({ theme }) : themeFn;\n  };\n\n  const selectStyles = useMemo(\n    () => ({\n      control: base => ({\n        ...base,\n        border: 'none',\n        boxShadow: 'none',\n        background: 'transparent',\n        minHeight: 'unset'\n      }),\n      valueContainer: base => ({\n        ...base,\n        padding: 0,\n        overflow: 'visible'\n      }),\n      multiValue: base => ({\n        ...base,\n        margin: 0,\n        borderRadius: '3px',\n        backgroundColor: isDark ? getC('gray-600') : getC('gray-800')\n      }),\n      multiValueLabel: (base, { selectProps }) => ({\n        ...base,\n        color: getC('gray-100'),\n        fontSize: '12px',\n        paddingLeft: '8px',\n        paddingTop: '8px',\n        paddingBottom: '8px',\n        paddingRight: selectProps.readOnly ? '8px' : '4px'\n      }),\n      multiValueRemove: base => ({\n        ...base,\n        color: 'white',\n        padding: '0 8px',\n        cursor: 'pointer',\n        '&:hover': {\n          backgroundColor: getC('red-500'),\n          color: 'white',\n          borderRadius: '0 3px 3px 0'\n        }\n      }),\n      option: (base, state) => ({\n        ...base,\n        padding: 0,\n        cursor: 'pointer',\n        backgroundColor: state.isFocused ? getC('gray-100') : 'transparent',\n        '&:active': {\n          backgroundColor: getC('gray-100')\n        }\n      }),\n      menu: base => ({\n        ...base,\n        zIndex: 9999,\n        backgroundColor: getP(getC('gray-600'), getC('white')),\n        marginTop: '4px'\n      }),\n      input: base => ({ ...base, margin: 0, padding: 0 }),\n      placeholder: base => ({ ...base, display: 'none' })\n    }),\n    [theme, isDark]\n  );\n\n  const sharedSelectProps = {\n    ref: forwardedRef,\n    value: selected,\n    options: loadOptions ? undefined : availableOptions,\n    loadOptions,\n    isMulti: true,\n    isClearable: false,\n    placeholder: null,\n    label,\n    uniqueId,\n    displayShowMore,\n    error,\n    warning,\n    readOnly,\n    disabled,\n    focused,\n    editText,\n    onMultiValueClick,\n    key: cacheUnique,\n    loadingMessage: loadingMessageFunc,\n    formatCreateLabel: createNewOptionMessageFunc,\n    components: {\n      DropdownIndicator: null,\n      Control,\n      MultiValue,\n      MultiValueRemove,\n      ValueContainer,\n      Input,\n      Option\n    },\n    styles: selectStyles,\n    theme: rsTheme => ({ ...rsTheme, spacing: { ...rsTheme.spacing, baseUnit: 4 } }),\n    noOptionsMessage: input => noOptionsMessageFunc(input.inputValue),\n    onFocus: () => setFocused(true),\n    onBlur: () => setFocused(false),\n    onChange: (newValue, actionMeta) => {\n      if (actionMeta.action === 'create-option' && loadOptions) {\n        setCacheUnique(c => c + 1);\n      }\n\n      const nextValue = newValue || [];\n      setSelected(nextValue);\n\n      if (onUpdateCallback) {\n        onUpdateCallback(actionMeta.action, actionMeta.option || actionMeta.removedValue);\n      }\n    }\n  };\n\n  if (hidden) return null;\n\n  return (\n    <S.MultiSelectWrapper>\n      {loadOptions ? (\n        creatable ? (\n          <S.AsyncCreatableMultiSelect {...sharedSelectProps} {...props} />\n        ) : (\n          <S.AsyncMultiSelect {...sharedSelectProps} {...props} />\n        )\n      ) : creatable ? (\n        <S.CreatableMultiSelect {...sharedSelectProps} {...props} />\n      ) : (\n        <S.MultiSelect {...sharedSelectProps} {...props} />\n      )}\n\n      {displayShowMore && !(error || warning) && (\n        <S.ShowMoreWrapper onClick={() => setDisplayShowMore(false)}>\n          <S.ShowMoreOverlay />\n          <S.ShowMoreText>\n            {showMoreText} {displayTotalOnShowMore && `(${selected?.length || 0})`}\n          </S.ShowMoreText>\n        </S.ShowMoreWrapper>\n      )}\n\n      {(error || warning) && (\n        <S.ErrorMessage $error={!!error} $warning={!!warning}>\n          {typeof error === 'string' ? error : warning}\n        </S.ErrorMessage>\n      )}\n    </S.MultiSelectWrapper>\n  );\n});\n\nMultiSelect.displayName = 'MultiSelect';\n\nMultiSelect.propTypes = {\n  /**\n   * The label of the input field – leave `undefined` to hide the label\n   */\n  label: PropTypes.string,\n  /**\n   * `Array` of `objects` containing the default options. This is only needed\n   * when asynchronous option fetching with the `loadOptions` prop is not used.\n   *\n   * **Note:**\n   * <br />This will be overridden by the `loadOptions` prop if both props are set.\n   */\n  availableOptions: PropTypes.arrayOf(PropTypes.object),\n\n  /**\n   * `Array` of `objects` containing the selected options.\n   */\n  selectedOptions: PropTypes.arrayOf(PropTypes.object),\n\n  /**\n   * Function with a `Promise` returning filtered options.\n   *\n   * See [Asynchronous fetching/filtering with pagination](#asynchronous-fetchingfiltering-with-pagination)\n   * for details.\n   *\n   * **Note:**\n   * <br />This will override the `availableOptions` prop if both props are set.\n   */\n  loadOptions: PropTypes.func,\n\n  /**\n   * Function for custom \"Loading...\" message while waiting for the first page\n   * from `loadOptions` to resolve. Defaults to \"Loading...\" if no function is provided.\n   */\n  loadingMessageFunc: PropTypes.func,\n\n  /**\n   * Callback function for sending updates to the backend whenever the selected values are updated.\n   * See [Update handling](#update-handling) for details.\n   */\n  onUpdateCallback: PropTypes.func,\n\n  /**\n   * Text to be displayed on the input element when the component\n   * is enabled and not focused – e.g. \"Add a keyword...\"\n   */\n  editText: PropTypes.string.isRequired,\n\n  /**\n   * Whether the user can create new options.\n   */\n  creatable: PropTypes.bool,\n\n  /**\n   * Callback function for formatting the message displayed in the dropdown when there\n   * are no matching options, and the user has permission to create new options.\n   * The callback function will be given the current input value as an argument.\n   */\n  createNewOptionMessageFunc: PropTypes.func,\n\n  /**\n   * If the list of options is empty, or if the current input value doesn't match\n   * any of the available options and the user doesn't have permission to add options,\n   * this function will be called and passed the current input value as an argument.\n   */\n  noOptionsMessageFunc: PropTypes.func,\n\n  /**\n   * Optional callback function to be trigger when clicking a selected option's label – e.g. opening\n   * a search filtered on the given multi-value's `label`.\n   *\n   * The callback function will be passed the option `object` as an argument.\n   */\n  onMultiValueClick: PropTypes.func,\n\n  /**\n   * Display an overlay which the user needs to click in order to\n   * show the selected options list in its entirety and edit it.\n   */\n  showMore: PropTypes.bool,\n\n  /**\n   * Text displayed on the \"Show more\" overlay.\n   */\n  showMoreText: PropTypes.string,\n\n  /**\n   * Whether to display the total number of selected options after the show more text.\n   */\n  displayTotalOnShowMore: PropTypes.bool,\n\n  /**\n   * Whether the multi-select should be displayed in read-only mode.\n   * The user can still click the selected options to trigger their on-click effect.\n   */\n  readOnly: PropTypes.bool,\n  /**\n   * Whether the component is hidden or visible.\n   */\n  hidden: PropTypes.bool,\n\n  /**\n   * Whether the multi-select should be disabled.\n   * The user will not be able to trigger the on-click effect of the selected options.\n   */\n  disabled: PropTypes.bool,\n\n  /**\n   * Set to `true` to display a red border indicating an error.\n   * Pass in a `string` instead to also show the string underneath the input field.\n   *\n   * **Note:**\n   * <br />This overrides the \"Show more\" overlay. Errors will be prioritized over warnings.\n   */\n  error: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),\n\n  /**\n   * Set to `true` to display an orange border.\n   * Pass in a `string` instead to also show the string underneath the input field.\n   *\n   * **Note:**\n   * <br />This overrides the \"Show more\" overlay. Errors will be prioritized over warnings.\n   */\n  warning: PropTypes.oneOfType([PropTypes.bool, PropTypes.string])\n};\n\nMultiSelect.defaultProps = {\n  noOptionsMessageFunc: inputValue => {\n    if (inputValue) {\n      return `No matches for \"${inputValue}\"`;\n    } else {\n      return 'No available options';\n    }\n  },\n  showMore: false,\n  displayTotalOnShowMore: true,\n  readOnly: false,\n  disabled: false,\n  creatable: false,\n  error: false,\n  warning: false,\n  showMoreText: 'Show more',\n  hidden: false\n};\n\nexport default MultiSelect;\n"],"names":["Control","props","React","createElement","S","$readOnly","selectProps","readOnly","components","propTypes","process","env","NODE_ENV","PropTypes","shape","bool","isRequired","ValueContainer","children","label","htmlFor","uniqueId","$showMore","displayShowMore","$error","error","$warning","warning","node","string","oneOfType","MultiValue","data","handleMouseDown","e","isRemoveClick","target","closest","onMultiValueClick","stopPropagation","onMouseDown","object","func","MultiValueRemove","disabled","Input","$focused","focused","$editText","editText","_extends","isDisabled","Option","isSelected","isFocused","$isFocused","MultiSelect","forwardRef","selectedOptions","availableOptions","loadOptions","loadingMessageFunc","onUpdateCallback","createNewOptionMessageFunc","showMore","showMoreText","displayTotalOnShowMore","creatable","hidden","noOptionsMessageFunc","val","forwardedRef","useState","nanoid","selected","setSelected","setFocused","setDisplayShowMore","cacheUnique","setCacheUnique","theme","useTheme","useEffect","isDark","document","body","classList","contains","getC","key","getColor","getP","dark","light","themeFn","themeProp","selectStyles","useMemo","control","base","border","boxShadow","background","minHeight","valueContainer","padding","overflow","multiValue","margin","borderRadius","backgroundColor","multiValueLabel","color","fontSize","paddingLeft","paddingTop","paddingBottom","paddingRight","multiValueRemove","cursor","option","state","menu","zIndex","marginTop","input","placeholder","display","sharedSelectProps","ref","value","options","undefined","isMulti","isClearable","loadingMessage","formatCreateLabel","DropdownIndicator","styles","rsTheme","spacing","baseUnit","noOptionsMessage","inputValue","onFocus","onBlur","onChange","newValue","actionMeta","action","c","nextValue","removedValue","onClick","length","displayName","arrayOf","defaultProps"],"mappings":"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"}
+{"version":3,"file":"MultiSelect.js","sources":["../../../src/components/inputs/MultiSelect/MultiSelect.js"],"sourcesContent":["import React, { useState, useMemo, useEffect } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { nanoid } from 'nanoid';\nimport { components } from 'react-select';\nimport * as S from './MultiSelect.styled';\nimport { ReactComponent as CloseIcon } from '../../../icons/close.svg';\n\n/**\n * Multi-select with autocomplete and support for asynchronous fetching/filtering of\n * available options with pagination, update handling with callback,\n * and the ability for the end-user to create new options.\n *\n * The component uses [react-select](https://react-select.com/) for the main select functionality,\n * with [react-select-async-paginate](https://www.npmjs.com/package/react-select-async-paginate) for pagination.\n *\n *\n * <br />### Import\n *\n * ``` js\n * import { MultiSelect } from '@ntbjs/react-components/inputs'\n * // or\n * import MultiSelect from '@ntbjs/react-components/inputs/MultiSelect'\n * ```\n *\n * <br />## Option `object` format\n * Options are represented by an `Array` of `objects` with the following format:\n *\n * ``` js\n * {\n *   value: \"Example\",\n *   label: \"Example\"\n * }\n * ```\n *\n * The `label` is what will visible to the end-user. Whether `value` and `label`\n * should be different will depend on your use-case, but they are not required to.\n *\n *\n * <br />## Update handling\n * Changes from the end-user to the selected/available options can be handled with a callback function\n * passed through the `onUpdateCallback` prop, which is triggered any time the selected values change.\n *\n * The callback function will be passed two arguments:\n * * `action: string`\n * * `updatedOption: object`\n *\n * <br />#### `action`\n * A `string` indicating what kind of update was made.\n *\n * The possible values of `action` are:\n * * `create-option`: an option that didn't exist in the original list of available options were added\n * * `select-option`: an option was selected\n * * `deselect-option`: an option was de-selected by clicking the X in the dropdown menu\n * * `remove-value`: an option was de-selected by clicking the X on the option label/box\n * * `pop-value`: an option was de-selected with backspace\n * * `clear`: all options were de-selected by clicking the clear indicator (not currently in use)\n *\n * <br />#### `updatedOption`\n * Option `object`of the updated option:\n *\n * In addition to the default `value` and `label` keys, an `__isNew__` flag will be present if the option was\n * not part of the original list of available options, i.e. created by the user in the current \"session\".\n * This is the case regardless of whether the list is provided through `availableOptions` or\n * asynchronously through `loadOptions`.\n *\n *\n * <br />## Asynchronous fetching/filtering with pagination\n * The list of available options can be fetched and filtered asynchronously with a `Promise`\n * passed through the `loadOptions` prop.\n *\n * It will be passed two arguments:\n *\n * * `inputValue: string`: current input value/search\n * * `prevOptions: Array`: previously loaded options for the current search\n *\n * The function is triggered and the first page is fetched when the dropdown menu opens.\n * Whenever the user scrolls down to the bottom of the list, `loadOptions` will\n * be triggered again to fetch the next page.\n *\n * The `Promise` should return an `object` with the following keys:\n *\n * ``` js\n * {\n *   options: Array,\n *   hasMore: boolean\n * }\n * ```\n *\n * `options` should contain the current page of options. It will be concatenated to the previous\n * set of options automatically. The `hasMore` flag indicates whether there is another page to be fetched.\n *\n * **Example:**\n *\n * ``` js\n *\n * const availableOptions = [\n *   { value: \"Example 1\", label: \"Example 1\" },\n *   ...\n *   { value: \"Example N\", label: \"Example N\" }\n * ];\n *\n * const filterOptions = inputValue => {\n *   return availableOptions.filter(option => {\n *     return option.label.toLowerCase().includes(inputValue.toLowerCase());\n *   });\n * };\n *\n * const loadOptionsFunc = (inputValue, prevOptions) => {\n *   const currentLength = prevOptions.length;\n *   const pageLength = 10;\n *\n *   let filteredOptions;\n *\n *   if (inputValue) {\n *     filteredOptions = filterOptions(inputValue);\n *   } else {\n *     filteredOptions = availableOptions;\n *   }\n *\n *   const hasMore = filteredOptions.length > currentLength + pageLength;\n *   const slicedOptions = filteredOptions.slice(currentLength, currentLength + pageLength);\n *\n *   return {\n *     options: slicedOptions,\n *     hasMore\n *    };\n * };\n *\n * const loadOptions = (inputValue, prevOptions) => {\n *   return new Promise(resolve => {\n *     resolve(loadOptionsFunc(inputValue, prevOptions));\n *   });\n * };\n * ```\n *\n * While waiting for the `Promise` to resolve, the component will be in a loading state.\n * The loading state is showcased in the \"Primary With Fetching Timeout\" Story.\n *\n * <br />#### Without asynchronous fetching/filtering\n * If you wish to not use asynchronous fetching/filtering, leave the `loadOptions` prop undefined\n * and pass the `Array` of all available options to the `availableOptions` prop instead.\n * The component will use the built-in filtering on `label` from `react-select`, and the options\n * will not be paginated.\n *\n *\n * <br />## \"Show more\" overlay\n * The \"Show more\" overlay must be set manually with the `showMore` prop.\n *\n * By default, the total number\n * of selected options will be displayed in parenthesis after the \"Show more\" text. This can be\n * disabled with the `displayTotalOnShowMore` prop.\n *\n * **Note:**\n * <br />The component has been given a max-width in these Stories.\n * This is because the \"Show more\" overlay does not work well visually when there are\n * fewer than three rows of selected options. The component itself does not have\n * a max-width, so keep this in mind when using it.\n *\n * <br />\n */\n\nconst MultiSelect = React.forwardRef(function MultiSelect(\n  {\n    label,\n    selectedOptions = [],\n    availableOptions,\n    loadOptions,\n    loadingMessageFunc,\n    onUpdateCallback,\n    editText,\n    creatable,\n    readOnly,\n    hidden,\n    disabled,\n    error,\n    warning,\n    onMultiValueClick,\n    showMore,\n    showMoreText = 'Show more',\n    displayTotalOnShowMore = true,\n    noOptionsMessageFunc,\n    ...props\n  },\n  forwardedRef\n) {\n  const [uniqueId] = useState(nanoid());\n  const [selected, setSelected] = useState(selectedOptions);\n  const [focused, setFocused] = useState(false);\n  const [displayShowMore, setDisplayShowMore] = useState(error || warning ? false : showMore);\n\n  useEffect(() => {\n    setSelected(selectedOptions);\n  }, [selectedOptions]);\n\n  const getNoOptionsMessage = inputValue => {\n    if (typeof noOptionsMessageFunc === 'function') {\n      return noOptionsMessageFunc(inputValue);\n    }\n    return inputValue ? `No matches for \"${inputValue}\"` : 'No available options';\n  };\n\n  const innerComponents = {\n    DropdownIndicator: null,\n    /* eslint-disable react/prop-types */\n    MultiValue: ({ data, ...props }) => {\n      return (\n        <div\n          className=\"multi-value-wrapper\"\n          onMouseDown={e => {\n            e.stopPropagation();\n\n            if (\n              onMultiValueClick &&\n              data &&\n              !(e.target.role === 'button' || e.target instanceof SVGElement)\n            ) {\n              onMultiValueClick(data);\n            }\n          }}\n        >\n          <S.MultiValue data={data} isDisabled={disabled} isReadOnly={readOnly} {...props} />\n        </div>\n      );\n    },\n    /* eslint-enable react/prop-types */\n    MultiValueRemove: props => {\n      if (readOnly || disabled) return null;\n      return (\n        <components.MultiValueRemove {...props}>\n          <CloseIcon />\n        </components.MultiValueRemove>\n      );\n    },\n    Input: inputProps => (\n      <S.InputWrapper\n        $focused={focused}\n        $editText={!readOnly && !disabled ? editText : ''}\n        isDisabled={readOnly || disabled}\n      >\n        <components.Input {...inputProps} />\n      </S.InputWrapper>\n    ),\n    Menu: menuProps => <S.DropdownMenu {...menuProps} />,\n    Option: optProps =>\n      optProps.isSelected ? (\n        <S.SelectedOption {...optProps}>\n          <span>{optProps.label}</span>\n          <S.DropdownOptionDeleteIcon />\n        </S.SelectedOption>\n      ) : (\n        <S.Option {...optProps} />\n      )\n  };\n\n  const selectStyles = useMemo(\n    () => ({\n      control: base => ({\n        ...base,\n        alignItems: 'flex-start',\n        background: 'transparent',\n        border: 'none',\n        boxShadow: 'none',\n        minHeight: 'unset'\n      }),\n      valueContainer: base => ({\n        ...base,\n        padding: 0,\n        gap: '8px',\n        maxHeight: displayShowMore && !(error || warning) ? '130px' : '100%'\n      }),\n      menu: base => ({\n        ...base,\n        backgroundColor: 'transparent',\n        boxShadow: 'none'\n      }),\n      menuList: base => ({\n        ...base,\n        backgroundColor: 'transparent'\n      }),\n      option: base => ({\n        ...base,\n        backgroundColor: 'transparent',\n        color: 'inherit'\n      }),\n      multiValue: base => ({ ...base, margin: 0, border: 'none', background: 'none' }),\n      multiValueLabel: base => ({ ...base, padding: 0 }),\n      multiValueRemove: base => ({ ...base, padding: 0, cursor: 'pointer' })\n    }),\n    [error, warning, displayShowMore]\n  );\n\n  const sharedProps = {\n    ...props,\n    ref: forwardedRef,\n    classNamePrefix: 'multi-select',\n    value: selected,\n    options: loadOptions ? undefined : availableOptions,\n    loadOptions,\n    loadingMessage: loadingMessageFunc,\n    styles: selectStyles,\n    components: innerComponents,\n    isMulti: true,\n    isClearable: false,\n    placeholder: null,\n    isDisabled: disabled,\n    readOnly: readOnly,\n    closeMenuOnSelect: false,\n    hideSelectedOptions: false,\n    openMenuOnClick: !disabled && !readOnly,\n    openMenuOnFocus: !disabled && !readOnly,\n    onFocus: () => setFocused(true),\n    onBlur: () => setFocused(false),\n    noOptionsMessage: ({ inputValue }) => getNoOptionsMessage(inputValue),\n    onChange: (newValue, actionMeta) => {\n      if (onUpdateCallback) {\n        onUpdateCallback(actionMeta.action, actionMeta.option || actionMeta.removedValue);\n      }\n      setSelected(newValue);\n    }\n  };\n\n  if (hidden) return null;\n\n  return (\n    <S.MultiSelectWrapper>\n      {label && <S.Label htmlFor={uniqueId}>{label}</S.Label>}\n      <S.InnerWrapper $error={error} $warning={warning}>\n        {loadOptions ? (\n          creatable ? (\n            <S.AsyncCreatableMultiSelect {...sharedProps} />\n          ) : (\n            <S.AsyncMultiSelect {...sharedProps} />\n          )\n        ) : creatable ? (\n          <S.CreatableMultiSelect {...sharedProps} />\n        ) : (\n          <S.MultiSelect {...sharedProps} />\n        )}\n      </S.InnerWrapper>\n      {displayShowMore && !(error || warning) && (\n        <S.ShowMoreWrapper onClick={() => setDisplayShowMore(false)}>\n          <S.ShowMoreOverlay />\n          <S.ShowMoreText>\n            {showMoreText} {displayTotalOnShowMore && `(${selected.length})`}\n          </S.ShowMoreText>\n        </S.ShowMoreWrapper>\n      )}\n      {(typeof error === 'string' || typeof warning === 'string') && (\n        <S.ErrorMessage $error={error} $warning={warning}>\n          {error ? error : warning}\n        </S.ErrorMessage>\n      )}\n    </S.MultiSelectWrapper>\n  );\n});\n\nMultiSelect.propTypes = {\n  /**\n   *\n   * The label of the input field – leave `undefined` to hide the label\n   */\n  label: PropTypes.string,\n  /**\n   * `Array` of `objects` containing the default options. This is only needed\n   * when asynchronous option fetching with the `loadOptions` prop is not used.\n   *\n   * **Note:**\n   * <br />This will be overridden by the `loadOptions` prop if both props are set.\n   */\n  availableOptions: PropTypes.arrayOf(PropTypes.object),\n\n  /**\n   * `Array` of `objects` containing the selected options.\n   */\n  selectedOptions: PropTypes.arrayOf(PropTypes.object),\n\n  /**\n   * Function with a `Promise` returning filtered options.\n   *\n   * See [Asynchronous fetching/filtering with pagination](#asynchronous-fetchingfiltering-with-pagination)\n   * for details.\n   *\n   * **Note:**\n   * <br />This will override the `availableOptions` prop if both props are set.\n   */\n  loadOptions: PropTypes.func,\n\n  /**\n   * Function for custom \"Loading...\" message while waiting for the first page\n   * from `loadOptions` to resolve. Defaults to \"Loading...\" if no function is provided.\n   */\n  loadingMessageFunc: PropTypes.func,\n\n  /**\n   * Callback function for sending updates to the backend whenever the selected values are updated.\n   * See [Update handling](#update-handling) for details.\n   */\n  onUpdateCallback: PropTypes.func,\n\n  /**\n   * Text to be displayed on the input element when the component\n   * is enabled and not focused – e.g. \"Add a keyword...\"\n   */\n  editText: PropTypes.string.isRequired,\n\n  /**\n   * Whether the user can create new options.\n   */\n  creatable: PropTypes.bool,\n\n  /**\n   * Callback function for formatting the message displayed in the dropdown when there\n   * are no matching options, and the user has permission to create new options.\n   * The callback function will be given the current input value as an argument.\n   */\n  createNewOptionMessageFunc: PropTypes.func,\n\n  /**\n   * If the list of options is empty, or if the current input value doesn't match\n   * any of the available options and the user doesn't have permission to add options,\n   * this function will be called and passed the current input value as an argument.\n   */\n  noOptionsMessageFunc: PropTypes.func,\n\n  /**\n   * Optional callback function to be trigger when clicking a selected option's label – e.g. opening\n   * a search filtered on the given multi-value's `label`.\n   *\n   * The callback function will be passed the option `object` as an argument.\n   */\n  onMultiValueClick: PropTypes.func,\n\n  /**\n   * Display an overlay which the user needs to click in order to\n   * show the selected options list in its entirety and edit it.\n   */\n  showMore: PropTypes.bool,\n\n  /**\n   * Text displayed on the \"Show more\" overlay.\n   */\n  showMoreText: PropTypes.string,\n\n  /**\n   * Whether to display the total number of selected options after the show more text.\n   */\n  displayTotalOnShowMore: PropTypes.bool,\n\n  /**\n   * Whether the multi-select should be displayed in read-only mode.\n   * The user can still click the selected options to trigger their on-click effect.\n   */\n  readOnly: PropTypes.bool,\n  /**\n   * Whether the component is hidden or visible.\n   */\n  hidden: PropTypes.bool,\n\n  /**\n   * Whether the multi-select should be disabled.\n   * The user will not be able to trigger the on-click effect of the selected options.\n   */\n  disabled: PropTypes.bool,\n\n  /**\n   * Set to `true` to display a red border indicating an error.\n   * Pass in a `string` instead to also show the string underneath the input field.\n   *\n   * **Note:**\n   * <br />This overrides the \"Show more\" overlay. Errors will be prioritized over warnings.\n   */\n  error: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),\n\n  /**\n   * Set to `true` to display an orange border.\n   * Pass in a `string` instead to also show the string underneath the input field.\n   *\n   * **Note:**\n   * <br />This overrides the \"Show more\" overlay. Errors will be prioritized over warnings.\n   */\n  warning: PropTypes.oneOfType([PropTypes.bool, PropTypes.string])\n};\n\nMultiSelect.defaultProps = {\n  noOptionsMessageFunc: inputValue => {\n    if (inputValue) {\n      return `No matches for \"${inputValue}\"`;\n    } else {\n      return 'No available options';\n    }\n  },\n  showMore: false,\n  displayTotalOnShowMore: true,\n  readOnly: false,\n  disabled: false,\n  creatable: false,\n  error: false,\n  warning: false,\n  showMoreText: 'Show more',\n  hidden: false\n};\n\nexport default MultiSelect;\n"],"names":["MultiSelect","React","forwardRef","label","selectedOptions","availableOptions","loadOptions","loadingMessageFunc","onUpdateCallback","editText","creatable","readOnly","hidden","disabled","error","warning","onMultiValueClick","showMore","showMoreText","displayTotalOnShowMore","noOptionsMessageFunc","props","forwardedRef","uniqueId","useState","nanoid","selected","setSelected","focused","setFocused","displayShowMore","setDisplayShowMore","useEffect","getNoOptionsMessage","inputValue","innerComponents","DropdownIndicator","MultiValue","data","createElement","className","onMouseDown","e","stopPropagation","target","role","SVGElement","S","_extends","isDisabled","isReadOnly","MultiValueRemove","components","CloseIcon","Input","inputProps","$focused","$editText","Menu","menuProps","Option","optProps","isSelected","selectStyles","useMemo","control","base","alignItems","background","border","boxShadow","minHeight","valueContainer","padding","gap","maxHeight","menu","backgroundColor","menuList","option","color","multiValue","margin","multiValueLabel","multiValueRemove","cursor","sharedProps","ref","classNamePrefix","value","options","undefined","loadingMessage","styles","isMulti","isClearable","placeholder","closeMenuOnSelect","hideSelectedOptions","openMenuOnClick","openMenuOnFocus","onFocus","onBlur","noOptionsMessage","onChange","newValue","actionMeta","action","removedValue","htmlFor","$error","$warning","onClick","length","propTypes","process","env","NODE_ENV","PropTypes","string","arrayOf","object","func","isRequired","bool","createNewOptionMessageFunc","oneOfType","defaultProps"],"mappings":"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"}