@ntbjs/react-components 2.0.14 → 3.0.0-rc.1

package/build/inputs/CompactAutocompleteSelect/CompactAutocompleteSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"CompactAutocompleteSelect.js","sources":["../../../src/components/inputs/CompactAutocompleteSelect/CompactAutocompleteSelect.js"],"sourcesContent":["import { isEmpty } from 'lodash';\nimport { nanoid } from 'nanoid';\nimport PropTypes from 'prop-types';\nimport React, { useMemo, useState } from 'react';\nimport { Tooltip } from '../../data';\n\nimport * as S from './CompactAutocompleteSelect.styled';\n\n/**\n * Select input control with autocomplete, async and creatable support.\n *\n * This control allows users to search through a predefined set of options, asynchronously load additional options,\n * and even create new options on-the-fly. It combines the benefits of autocomplete functionality,\n * asynchronous data fetching, and creatable option support.\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 * <br /> ### Import\n *\n * ``` js\n * import { CompactAutocompleteSelect } from '@ntbjs/react-components/inputs'\n * // or\n * import CompactAutocompleteSelect from '@ntbjs/react-components/inputs/CompactAutocompleteSelect'\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 * 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 *  <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 * <br />\n */\n\nconst CompactAutocompleteSelect = React.forwardRef(function CompactAutocompleteSelect(\n  {\n    label,\n    availableOptions,\n    placeholder,\n    selectedOption,\n    loadOptions,\n    noOptionsMessageFunc,\n    createNewOptionMessageFunc,\n    onUpdateCallback,\n    loadingMessageFunc,\n    creatable,\n    readOnly,\n    edit,\n    disabled,\n    hidden,\n    type,\n    descriptionToolTip,\n    loadingIcon,\n    successIcon,\n    ...props\n  },\n  forwardedRef\n) {\n  const [uniqueId] = useState(nanoid());\n  const [selected, setSelected] = useState(selectedOption);\n  const [focused, setFocused] = useState(false);\n  const [cacheUnique, setCacheUnique] = useState(0);\n\n  const memoizedDescriptionToolTip = useMemo(() => {\n    return descriptionToolTip;\n  }, [descriptionToolTip]);\n\n  /**\n   * Adds displayname to inner components\n   */\n  const Control = props => {\n    return <S.Control className=\"select-control\" edit={edit} type={type} {...props} />;\n  };\n\n  const ValueContainer = useMemo(() => {\n    const valueContainer = props => {\n      return (\n        <>\n          <S.ValueContainer type={type} {...props} />\n        </>\n      );\n    };\n    valueContainer.displayName = 'ValueContainerWrapper';\n    return valueContainer;\n  }, [type]);\n\n  const Input = useMemo(() => {\n    const selectInput = props => {\n      return <S.Input className=\"select-input\" {...props} />;\n    };\n    selectInput.displayName = 'InputWrapper';\n    return selectInput;\n  }, []);\n\n  const Menu = useMemo(() => {\n    const menu = props => {\n      return <S.Menu className=\"select-menu\" {...props} />;\n    };\n    menu.displayName = 'MenuWrapper';\n    return menu;\n  }, []);\n\n  const Placeholder = props => {\n    return <S.Placeholder className=\"select-placeholder\" type={type} {...props} />;\n  };\n\n  const Option = props => {\n    return !props.data.link ? (\n      <S.Option className=\"menu-item\" {...props} />\n    ) : (\n      <S.Option {...props}>\n        <a href={props.data.link}>\n          {props.data.icon}\n          {props.label}\n        </a>\n      </S.Option>\n    );\n  };\n\n  const SingleValue = props => {\n    return <S.SingleValue className=\"menu-value\" {...props} />;\n  };\n\n  Option.propTypes = {\n    data: PropTypes.shape({\n      icon: PropTypes.node,\n      link: PropTypes.string\n    }),\n    label: PropTypes.string\n  };\n\n  const DropdownIndicator = props => {\n    return (\n      <S.DropdownIndicator className=\"dropdown-indicator\" {...props}>\n        <S.DropdownIndicatorIcon />\n      </S.DropdownIndicator>\n    );\n  };\n\n  const ClearIndicator = props => {\n    return (\n      <S.ClearIndicator className=\"clear-indicator\" {...props}>\n        <S.ClearIndicatorIcon />\n      </S.ClearIndicator>\n    );\n  };\n\n  const IndicatorSeparator = props => {\n    return <S.IndicatorSeparator className=\"indicator-separator\" {...props} />;\n  };\n\n  /**\n   * Adds classnames to inner components\n   */\n  const innerComponents = {\n    Control,\n    ValueContainer,\n    DropdownIndicator,\n    IndicatorSeparator,\n    ClearIndicator,\n    Option,\n    SingleValue,\n    Input,\n    Placeholder,\n    Menu\n  };\n\n  const sharedSelectProps = {\n    ref: forwardedRef,\n    options: loadOptions ? undefined : availableOptions,\n    value: selected,\n    loadOptions: loadOptions,\n    loadingMessage: loadingMessageFunc,\n    formatCreateLabel: createNewOptionMessageFunc,\n    noOptionsMessage: input => {\n      return noOptionsMessageFunc(input.inputValue);\n    },\n    onFocus: () => {\n      setFocused(true);\n    },\n    onBlur: () => {\n      setFocused(false);\n    },\n    focused: focused,\n    isDisabled: disabled || readOnly,\n    components: innerComponents,\n    isClearable: true,\n    isSearchable: true,\n    placeholder: placeholder,\n    id: uniqueId,\n    cacheUniqs: loadOptions ? [cacheUnique] : undefined,\n    onChange: (selected, actionMeta) => {\n      switch (actionMeta.action) {\n        case 'create-option':\n          if (onUpdateCallback) {\n            onUpdateCallback(actionMeta.action, selected.value);\n          }\n\n          if (loadOptions) {\n            setCacheUnique(cacheUnique + 1);\n          }\n\n          setSelected(selected);\n          break;\n\n        case 'select-option':\n          if (onUpdateCallback) {\n            onUpdateCallback(actionMeta.action, selected.value);\n          }\n\n          setSelected(selected);\n          break;\n\n        case 'remove-value':\n          if (onUpdateCallback) {\n            onUpdateCallback(actionMeta.action, selected.value);\n          }\n\n          setSelected(selected);\n          break;\n\n        case 'pop-value':\n          if (onUpdateCallback) {\n            onUpdateCallback(actionMeta.action, selected.value);\n          }\n\n          setSelected(selected);\n          break;\n\n        case 'deselect-option':\n          if (onUpdateCallback) {\n            onUpdateCallback(actionMeta.action, selected.value);\n          }\n\n          setSelected(selected);\n          break;\n\n        case 'clear':\n          setSelected(selected);\n          break;\n\n        default:\n          if (onUpdateCallback) {\n            onUpdateCallback(actionMeta.action, selected.value);\n          }\n\n          setSelected(selected);\n          break;\n      }\n    }\n  };\n\n  if (hidden) return null;\n\n  const input = () => {\n    return (\n      <S.CompactAutocompleteSelect disabled={disabled}>\n        <S.InputContainer>\n          {label && (\n            <S.Label htmlFor={uniqueId} disabled={disabled}>\n              {label}\n              <S.SuccessContainer>\n                {type === 'loading' && loadingIcon}\n                {type === 'success' && successIcon}\n              </S.SuccessContainer>\n            </S.Label>\n          )}\n          {loadOptions ? (\n            creatable ? (\n              <S.AsyncCreatableAutocompleteSelect\n                $hasLabel={!isEmpty(label)}\n                {...sharedSelectProps}\n                {...props}\n              />\n            ) : (\n              <S.AsyncAutocompleteSelect\n                $hasLabel={!isEmpty(label)}\n                {...sharedSelectProps}\n                {...props}\n              />\n            )\n          ) : creatable ? (\n            <S.AutocompletCreatableSelect\n              $hasLabel={!isEmpty(label)}\n              {...sharedSelectProps}\n              {...props}\n            />\n          ) : (\n            <S.AutocompletSelect $hasLabel={!isEmpty(label)} {...sharedSelectProps} {...props} />\n          )}\n        </S.InputContainer>\n      </S.CompactAutocompleteSelect>\n    );\n  };\n\n  return (\n    <>\n      {!memoizedDescriptionToolTip && input()}\n      {memoizedDescriptionToolTip && (\n        <div>\n          <Tooltip\n            content={memoizedDescriptionToolTip}\n            key=\"tooltipTextArea1\"\n            placement=\"bottom-end\"\n            trigger={'mouseenter'}\n            zIndex={999999}\n          >\n            {input()}\n          </Tooltip>\n        </div>\n      )}\n    </>\n  );\n});\n\nCompactAutocompleteSelect.propTypes = {\n  /**\n   * The label of the input field – leave `undefined` to hide the label\n   */\n  label: PropTypes.string,\n  /**\n   * The placeholder of the input. Text to be displayed on the input element when the component is enabled and not focused – e.g. \"Search categories...\"\n   */\n  placeholder: PropTypes.string,\n  /**\n   * `Array` of `objects` that populate the select menu. 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   * `Array` of `objects` containing the selected options.\n   */\n  selectedOption: PropTypes.object,\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   * 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   * 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   * 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   * Whether the value is read only\n   */\n  readOnly: PropTypes.bool,\n  /**\n   * Displays a grey background to show that value is editable\n   */\n  edit: PropTypes.bool,\n  /**\n   * Whether the component is hidden or visible.\n   */\n  hidden: PropTypes.bool,\n  /**\n   * There is an error present – 'error be prioritized over warnings if both are set to 'true'.\n   */\n  error: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),\n  /**\n   * There is a warning present.\n   */\n  warning: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),\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   * Whether the user have permission to create new options\n   */\n  creatable: PropTypes.bool,\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   * Define the type based on error, warning, loading and success.\n   */\n  type: PropTypes.oneOf(['', 'error', 'warning', 'instructions-warning', 'loading', 'success']),\n  /**\n   * Description ToolTip text.\n   */\n  descriptionToolTip: PropTypes.string,\n  /**\n   * Icon element – E.g: `icon={<Spinner />}`\n   */\n  loadingIcon: PropTypes.element,\n  /**\n   * Icon element – E.g: `icon={<Check />}`\n   */\n  successIcon: PropTypes.element\n};\n\nCompactAutocompleteSelect.defaultProps = {\n  noOptionsMessageFunc: inputValue => {\n    if (inputValue) {\n      return `No matches for \"${inputValue}\"`;\n    } else {\n      return 'No available options';\n    }\n  },\n  readOnly: false,\n  disabled: false,\n  creatable: true,\n  edit: false,\n  error: false,\n  warning: false,\n  hidden: false,\n  type: '',\n  descriptionToolTip: ''\n};\n\nexport default CompactAutocompleteSelect;\n"],"names":["CompactAutocompleteSelect","React","forwardRef","label","availableOptions","placeholder","selectedOption","loadOptions","noOptionsMessageFunc","createNewOptionMessageFunc","onUpdateCallback","loadingMessageFunc","creatable","readOnly","edit","disabled","hidden","type","descriptionToolTip","loadingIcon","successIcon","props","forwardedRef","uniqueId","useState","nanoid","selected","setSelected","focused","setFocused","cacheUnique","setCacheUnique","memoizedDescriptionToolTip","useMemo","Control","createElement","S","_extends","className","ValueContainer","valueContainer","Fragment","displayName","Input","selectInput","Menu","menu","Placeholder","Option","data","link","href","icon","SingleValue","propTypes","process","env","NODE_ENV","PropTypes","shape","node","string","DropdownIndicator","ClearIndicator","IndicatorSeparator","innerComponents","sharedSelectProps","ref","options","undefined","value","loadingMessage","formatCreateLabel","noOptionsMessage","input","inputValue","onFocus","onBlur","isDisabled","components","isClearable","isSearchable","id","cacheUniqs","onChange","actionMeta","action","htmlFor","$hasLabel","isEmpty","Tooltip","content","key","placement","trigger","zIndex","arrayOf","object","func","bool","error","oneOfType","warning","oneOf","element","defaultProps"],"mappings":"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"}
+{"version":3,"file":"CompactAutocompleteSelect.js","sources":["../../../src/components/inputs/CompactAutocompleteSelect/CompactAutocompleteSelect.tsx"],"sourcesContent":["import { isEmpty } from 'lodash';\nimport { nanoid } from 'nanoid';\nimport React, { useMemo, useState } from 'react';\nimport { Tooltip } from '../../data';\n\nimport * as S from './CompactAutocompleteSelect.styled';\n\nconst DEFAULT_NO_OPTIONS_MESSAGE_FUNC = inputValue => {\n  if (inputValue) {\n    return `No matches for \"${inputValue}\"`;\n  } else {\n    return 'No available options';\n  }\n};\n\nexport type CompactAutocompleteSelectOwnProps = {\n  /**\n   * The label of the input field – leave `undefined` to hide the label\n   */\n  label?: string;\n  /**\n   * The placeholder of the input. Text to be displayed on the input element when the component is enabled and not focused – e.g. \"Search categories...\"\n   */\n  placeholder?: string;\n  /**\n   * `Array` of `objects` that populate the select menu. 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?: any[];\n  /**\n   * `Array` of `objects` containing the selected options.\n   */\n  selectedOption?: any;\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?: (...args: any[]) => any;\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?: (...args: any[]) => any;\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?: (...args: any[]) => any;\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?: (...args: any[]) => any;\n  /**\n   * Whether the value is read only\n   */\n  readOnly?: boolean;\n  /**\n   * Displays a grey background to show that value is editable\n   */\n  edit?: boolean;\n  /**\n   * Whether the component is hidden or visible.\n   */\n  hidden?: boolean;\n  /**\n   * There is an error present – 'error be prioritized over warnings if both are set to 'true'.\n   */\n  error?: boolean | string;\n  /**\n   * There is a warning present.\n   */\n  warning?: boolean | string;\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?: (...args: any[]) => any;\n  /**\n   * Whether the user have permission to create new options\n   */\n  creatable?: boolean;\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?: boolean;\n  /**\n   * Define the type based on error, warning, loading and success.\n   */\n  type?: '' | 'error' | 'warning' | 'instructions-warning' | 'loading' | 'success';\n  /**\n   * Description ToolTip text.\n   */\n  descriptionToolTip?: string;\n  /**\n   * Icon element – E.g: `icon={<Spinner />}`\n   */\n  loadingIcon?: React.ReactElement<any>;\n  /**\n   * Icon element – E.g: `icon={<Check />}`\n   */\n  successIcon?: React.ReactElement<any>;\n};\n\n/*\n * NMB-3998 §C.2: `props` is spread onto `S.AsyncCreatableAutocompleteSelect`, so the published type\n * has to admit that target's props too — a closed type here is worse than `any` for the\n * 125 consumer files. Declared members win over the base (`Omit` by `keyof CompactAutocompleteSelectOwnProps`);\n * a bare `&` would INTERSECT a colliding member instead of overriding it, which narrows\n * it (measured: `rows?: number | string` & `rows?: number`) or empties it to `never`.\n *\n * BOTH ALIASES ARE `export`ed, AND THE `const` BELOW CARRIES AN EXPLICIT ANNOTATION,\n * FOR ONE REASON: declaration emit. §G.4.\n *\n * tsc prints a type alias declaration from the SOURCE TEXT when the alias is exported, and\n * EXPANDS it structurally when it is not. Unexported, this alias expanded through\n * `S.AsyncCreatableAutocompleteSelect` into react-select's `PublicBaseSelectProps` and\n * `StateManagerAdditionalProps`, which `react-select`'s `exports` map does not serve —\n * 2 x TS2883, and the emitted declaration degraded to\n * `ForwardRefExoticComponent<RefAttributes<unknown>>`, zero props. The annotation on the\n * `const` is needed for the same reason: `React.forwardRef` INFERS\n * `ForwardRefExoticComponent<PropsWithoutRef<P> & RefAttributes<any>>`, and tsc computes\n * `PropsWithoutRef<P>` eagerly, which reintroduces the expansion the exported alias just\n * avoided. Written out, it is printed as written.\n *\n * The `export`s are also a small win in their own right: a consumer can now write\n * `CompactAutocompleteSelectProps` instead of `React.ComponentProps<typeof …>`.\n */\nexport type CompactAutocompleteSelectProps = Omit<\n  React.ComponentPropsWithoutRef<typeof S.AsyncCreatableAutocompleteSelect>,\n  keyof CompactAutocompleteSelectOwnProps\n> &\n  CompactAutocompleteSelectOwnProps;\n\n/**\n * Select input control with autocomplete, async and creatable support.\n *\n * This control allows users to search through a predefined set of options, asynchronously load additional options,\n * and even create new options on-the-fly. It combines the benefits of autocomplete functionality,\n * asynchronous data fetching, and creatable option support.\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 * <br /> ### Import\n *\n * ``` js\n * import { CompactAutocompleteSelect } from '@ntbjs/react-components/inputs'\n * // or\n * import CompactAutocompleteSelect from '@ntbjs/react-components/inputs/CompactAutocompleteSelect'\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 * 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 *  <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 * <br />\n */\n\nconst CompactAutocompleteSelect: React.ForwardRefExoticComponent<\n  CompactAutocompleteSelectProps & React.RefAttributes<any>\n> = React.forwardRef<any, CompactAutocompleteSelectProps>(function CompactAutocompleteSelect(\n  {\n    label,\n    availableOptions,\n    placeholder,\n    selectedOption,\n    loadOptions,\n    noOptionsMessageFunc = DEFAULT_NO_OPTIONS_MESSAGE_FUNC,\n    createNewOptionMessageFunc,\n    onUpdateCallback,\n    loadingMessageFunc,\n    creatable = true,\n    readOnly = false,\n    edit = false,\n    disabled = false,\n    hidden = false,\n    type = '',\n    descriptionToolTip = '',\n    loadingIcon,\n    successIcon,\n    ...props\n  },\n  forwardedRef\n) {\n  const [uniqueId] = useState(nanoid());\n  const [selected, setSelected] = useState(selectedOption);\n  const [focused, setFocused] = useState(false);\n  const [cacheUnique, setCacheUnique] = useState(0);\n\n  const memoizedDescriptionToolTip = useMemo(() => {\n    return descriptionToolTip;\n  }, [descriptionToolTip]);\n\n  /**\n   * Adds displayname to inner components\n   */\n  const Control = props => {\n    return <S.Control className=\"select-control\" edit={edit} type={type} {...props} />;\n  };\n\n  const ValueContainer = useMemo(() => {\n    const valueContainer = props => {\n      return (\n        <>\n          <S.ValueContainer type={type} {...props} />\n        </>\n      );\n    };\n    valueContainer.displayName = 'ValueContainerWrapper';\n    return valueContainer;\n  }, [type]);\n\n  const Input = useMemo(() => {\n    const selectInput = props => {\n      return <S.Input className=\"select-input\" {...props} />;\n    };\n    selectInput.displayName = 'InputWrapper';\n    return selectInput;\n  }, []);\n\n  const Menu = useMemo(() => {\n    const menu = props => {\n      return <S.Menu className=\"select-menu\" {...props} />;\n    };\n    menu.displayName = 'MenuWrapper';\n    return menu;\n  }, []);\n\n  const Placeholder = props => {\n    return <S.Placeholder className=\"select-placeholder\" type={type} {...props} />;\n  };\n\n  /*\n   * HAND-WRITTEN. `Option.propTypes` was declared INSIDE the component body, and\n   * `reactPropsPlugin` iterates only `sourceFile.statements` — so this is the third\n   * component the plugin structurally cannot see, and the reason this file was one of\n   * the two still importing `prop-types` after the codemod ran.\n   *\n   * It reported no TYPE error either, which is the more interesting half: `props` was an\n   * implicit `any` and `noImplicitAny` is off in this repo, so `props.data.link` went\n   * unchecked. The deleted propTypes are the source — `icon` was `PropTypes.node`,\n   * `link` `PropTypes.string`.\n   *\n   * This is a react-select custom `Option`: react-select owns the rest of the props\n   * object and the body passes it straight to `S.Option`. So only the two members the\n   * body actually reads are declared and the rest stays open through the base, which is\n   * the same reasoning as the §C.2 widening.\n   */\n  type OptionProps = React.ComponentPropsWithoutRef<typeof S.Option> & {\n    data: {\n      icon?: React.ReactNode;\n      link?: string;\n    };\n    label?: string;\n  };\n\n  const Option = (props: OptionProps) => {\n    return !props.data.link ? (\n      <S.Option className=\"menu-item\" {...props} />\n    ) : (\n      <S.Option {...props}>\n        <a href={props.data.link}>\n          {props.data.icon}\n          {props.label}\n        </a>\n      </S.Option>\n    );\n  };\n\n  const SingleValue = props => {\n    return <S.SingleValue className=\"menu-value\" {...props} />;\n  };\n\n  const DropdownIndicator = props => {\n    return (\n      <S.DropdownIndicator className=\"dropdown-indicator\" {...props}>\n        <S.DropdownIndicatorIcon />\n      </S.DropdownIndicator>\n    );\n  };\n\n  const ClearIndicator = props => {\n    return (\n      <S.ClearIndicator className=\"clear-indicator\" {...props}>\n        <S.ClearIndicatorIcon />\n      </S.ClearIndicator>\n    );\n  };\n\n  const IndicatorSeparator = props => {\n    return <S.IndicatorSeparator className=\"indicator-separator\" {...props} />;\n  };\n\n  /**\n   * Adds classnames to inner components\n   */\n  const innerComponents = {\n    Control,\n    ValueContainer,\n    DropdownIndicator,\n    IndicatorSeparator,\n    ClearIndicator,\n    Option,\n    SingleValue,\n    Input,\n    Placeholder,\n    Menu\n  };\n\n  const sharedSelectProps = {\n    ref: forwardedRef,\n    options: loadOptions ? undefined : availableOptions,\n    value: selected,\n    loadOptions: loadOptions,\n    loadingMessage: loadingMessageFunc,\n    formatCreateLabel: createNewOptionMessageFunc,\n    noOptionsMessage: input => {\n      return noOptionsMessageFunc(input.inputValue);\n    },\n    onFocus: () => {\n      setFocused(true);\n    },\n    onBlur: () => {\n      setFocused(false);\n    },\n    focused: focused,\n    isDisabled: disabled || readOnly,\n    components: innerComponents,\n    isClearable: true,\n    isSearchable: true,\n    placeholder: placeholder,\n    id: uniqueId,\n    cacheUniqs: loadOptions ? [cacheUnique] : undefined,\n    onChange: (selected, actionMeta) => {\n      switch (actionMeta.action) {\n        case 'create-option':\n          if (onUpdateCallback) {\n            onUpdateCallback(actionMeta.action, selected.value);\n          }\n\n          if (loadOptions) {\n            setCacheUnique(cacheUnique + 1);\n          }\n\n          setSelected(selected);\n          break;\n\n        case 'select-option':\n          if (onUpdateCallback) {\n            onUpdateCallback(actionMeta.action, selected.value);\n          }\n\n          setSelected(selected);\n          break;\n\n        case 'remove-value':\n          if (onUpdateCallback) {\n            onUpdateCallback(actionMeta.action, selected.value);\n          }\n\n          setSelected(selected);\n          break;\n\n        case 'pop-value':\n          if (onUpdateCallback) {\n            onUpdateCallback(actionMeta.action, selected.value);\n          }\n\n          setSelected(selected);\n          break;\n\n        case 'deselect-option':\n          if (onUpdateCallback) {\n            onUpdateCallback(actionMeta.action, selected.value);\n          }\n\n          setSelected(selected);\n          break;\n\n        case 'clear':\n          setSelected(selected);\n          break;\n\n        default:\n          if (onUpdateCallback) {\n            onUpdateCallback(actionMeta.action, selected.value);\n          }\n\n          setSelected(selected);\n          break;\n      }\n    }\n  };\n\n  if (hidden) return null;\n\n  const input = () => {\n    return (\n      <S.CompactAutocompleteSelect disabled={disabled}>\n        <S.InputContainer>\n          {label && (\n            <S.Label htmlFor={uniqueId} disabled={disabled}>\n              {label}\n              <S.SuccessContainer>\n                {type === 'loading' && loadingIcon}\n                {type === 'success' && successIcon}\n              </S.SuccessContainer>\n            </S.Label>\n          )}\n          {loadOptions ? (\n            creatable ? (\n              <S.AsyncCreatableAutocompleteSelect\n                $hasLabel={!isEmpty(label)}\n                {...sharedSelectProps}\n                {...props}\n              />\n            ) : (\n              <S.AsyncAutocompleteSelect\n                $hasLabel={!isEmpty(label)}\n                {...sharedSelectProps}\n                {...props}\n              />\n            )\n          ) : creatable ? (\n            <S.AutocompletCreatableSelect\n              $hasLabel={!isEmpty(label)}\n              {...sharedSelectProps}\n              {...props}\n            />\n          ) : (\n            <S.AutocompletSelect $hasLabel={!isEmpty(label)} {...sharedSelectProps} {...props} />\n          )}\n        </S.InputContainer>\n      </S.CompactAutocompleteSelect>\n    );\n  };\n\n  return (\n    <>\n      {!memoizedDescriptionToolTip && input()}\n      {memoizedDescriptionToolTip && (\n        <div>\n          <Tooltip\n            content={memoizedDescriptionToolTip}\n            key=\"tooltipTextArea1\"\n            placement=\"bottom-end\"\n            trigger={'mouseenter'}\n            zIndex={999999}\n          >\n            {input()}\n          </Tooltip>\n        </div>\n      )}\n    </>\n  );\n});\n\nexport default CompactAutocompleteSelect;\n"],"names":["DEFAULT_NO_OPTIONS_MESSAGE_FUNC","inputValue","CompactAutocompleteSelect","React","forwardRef","label","availableOptions","placeholder","selectedOption","loadOptions","noOptionsMessageFunc","createNewOptionMessageFunc","onUpdateCallback","loadingMessageFunc","creatable","readOnly","edit","disabled","hidden","type","descriptionToolTip","loadingIcon","successIcon","props","forwardedRef","uniqueId","useState","nanoid","selected","setSelected","focused","setFocused","cacheUnique","setCacheUnique","memoizedDescriptionToolTip","useMemo","Control","_jsx","S","className","ValueContainer","valueContainer","_Fragment","children","displayName","Input","selectInput","Menu","menu","Placeholder","Option","data","link","_jsxs","href","icon","SingleValue","DropdownIndicator","ClearIndicator","IndicatorSeparator","innerComponents","sharedSelectProps","ref","options","undefined","value","loadingMessage","formatCreateLabel","noOptionsMessage","input","onFocus","onBlur","isDisabled","components","isClearable","isSearchable","id","cacheUniqs","onChange","actionMeta","action","htmlFor","$hasLabel","isEmpty","Tooltip","content","placement","trigger","zIndex"],"mappings":"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"}

package/build/inputs/CompactAutocompleteSelect/CompactAutocompleteSelect.styled.js

@@ -6,291 +6,106 @@ import CreatableSelect from 'react-select/creatable';
 import { ReactComponent as SvgClose } from '../../icons/close.svg.js';
 import { ReactComponent as SvgExpandMore } from '../../icons/expand-more.svg.js';
 
-const fadeIn = keyframes`
-  from {
-    background-color: ${props => props.theme.themeProp('rgba(48, 130, 106, 0)', 'rgba(191, 224, 213, 0)')};
-  }
-  to {
-    background-color: ${props => props.theme.themeProp('rgba(48, 130, 106, 1)', 'rgba(191, 224, 213, 1)')};
-  }
-`;
-const fadeOut = keyframes`
-  from {
-    background-color: ${props => props.theme.themeProp('rgba(48, 130, 106, 1)', 'rgba(191, 224, 213, 1)')};
-  }
-  to {
-    background-color: ${props => props.theme.themeProp('rgba(48, 130, 106, 0)', 'rgba(191, 224, 213, 0)')};
-  }
-`;
-const fadeInCheck = keyframes`
-  from {
-    opacity: 0
-  }
-  to {
-    opacity: 1
-  }
-`;
-const fadeOutCheck = keyframes`
-  from {
-    opacity: 1
-  }
-  to {
-    opacity: 0
-  }
-`;
+const fadeIn = keyframes(["from{background-color:", ";}to{background-color:", ";}"], props => props.theme.themeProp('rgba(48, 130, 106, 0)', 'rgba(191, 224, 213, 0)'), props => props.theme.themeProp('rgba(48, 130, 106, 1)', 'rgba(191, 224, 213, 1)'));
+const fadeOut = keyframes(["from{background-color:", ";}to{background-color:", ";}"], props => props.theme.themeProp('rgba(48, 130, 106, 1)', 'rgba(191, 224, 213, 1)'), props => props.theme.themeProp('rgba(48, 130, 106, 0)', 'rgba(191, 224, 213, 0)'));
+const fadeInCheck = keyframes(["from{opacity:0}to{opacity:1}"]);
 const AsyncCreatableSelectPaginate = withAsyncPaginate(CreatableSelect);
-const sharedStyle = css`
-  font-family: ${props => props.theme.primaryFontFamily};
-  font-size: 0.875rem;
-  line-height: 1rem;
-  width: 100%;
-  display: block;
-  box-shadow: 'none';
-  flex-basis: ${props => props.$hasLabel ? '66.66%' : '100%'};
-`;
+const sharedStyle = css(["font-family:", ";font-size:0.875rem;line-height:1rem;width:100%;display:block;box-shadow:'none';flex-basis:", ";"], props => props.theme.primaryFontFamily, props => props.$hasLabel ? '66.66%' : '100%');
 const shouldForwardProp = prop => {
   return prop !== 'theme' && !prop.startsWith('$');
 };
 const CompactAutocompleteSelect = styled.div.withConfig({
   shouldForwardProp
-}).attrs(applyDefaultTheme)`
-  display: flex;
-  align-items: center;
-  height: 24px;
-  font-family: ${props => props.theme.primaryFontFamily};
-  ${props => props.disabled && css`
-      opacity: 0.5;
-      cursor: not-allowed;
-    `}
-`;
+}).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__CompactAutocompleteSelect",
+  componentId: "sc-l3zyze-0"
+})(["display:flex;align-items:center;height:24px;font-family:", ";", ""], props => props.theme.primaryFontFamily, props => props.disabled && css(["opacity:0.5;cursor:not-allowed;"]));
 const Label = styled.label.withConfig({
   shouldForwardProp
-}).attrs(applyDefaultTheme)`
-  ${props => props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('gray-700'))};
-  flex-basis: 33.33%;
-  font-size: 0.875rem;
-  line-height: 1rem;
-  height: 19px;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding-top: 2px;
-  ${props => props.disabled && css`
-      cursor: not-allowed;
-    `}
-`;
+}).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__Label",
+  componentId: "sc-l3zyze-1"
+})(["", ";flex-basis:33.33%;font-size:0.875rem;line-height:1rem;height:19px;display:flex;justify-content:space-between;align-items:center;padding-top:2px;", ""], props => props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('gray-700')), props => props.disabled && css(["cursor:not-allowed;"]));
 const InputContainer = styled.div.withConfig({
   shouldForwardProp
-}).attrs(applyDefaultTheme)`
-  display: flex;
-  width: 100%;
-  height: 19px;
-`;
+}).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__InputContainer",
+  componentId: "sc-l3zyze-2"
+})(["display:flex;width:100%;height:19px;"]);
 const SuccessContainer = styled.div.withConfig({
   shouldForwardProp
-}).attrs(applyDefaultTheme)`
-  opacity: 1;
-  pointer-events: none;
-  display: flex;
-  opacity: ${props => props.fadeIn ? 0 : 1};
-  animation: ${props => props.fadeIn ? fadeOutCheck : fadeInCheck} 0.5s ease-in-out;
-  transition: opacity 0.5s ease-in-out;
-  margin-right: 5px;
-  ${props => props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-500'))}
-  > svg {
-    width: 13px;
-  }
-`;
-const AsyncCreatableAutocompleteSelect = styled(AsyncCreatableSelectPaginate).attrs(applyDefaultTheme)`
-  ${sharedStyle}
-  ${props => props.disabled && css`
-      opacity: 0.5;
-      cursor: not-allowed;
-    `}
-    &&:hover:not(:focus) {
-    ${props => props.disabled && css`
-        background: none !important;
-        cursor: not-allowed;
-      `}
-  }
-`;
-const AsyncAutocompleteSelect = styled(AsyncPaginate).attrs(applyDefaultTheme)`
-  ${sharedStyle}
-  ${props => props.disabled && css`
-      opacity: 0.5;
-    `}
-    &&:hover:not(:focus) {
-    ${props => props.disabled && css`
-        background: none !important;
-        cursor: not-allowed;
-      `}
-  }
-`;
-const AutocompletSelect = styled(Select).attrs(applyDefaultTheme)`
-  ${sharedStyle}
-  ${props => props.disabled && css`
-      opacity: 0.5;
-    `}
-    &&:hover:not(:focus) {
-    ${props => props.disabled && css`
-        background: none !important;
-        cursor: not-allowed;
-      `}
-  }
-`;
-const AutocompletCreatableSelect = styled(CreatableSelect).attrs(applyDefaultTheme)`
-  ${sharedStyle}
-  ${props => props.disabled && css`
-      opacity: 0.5;
-    `}
-`;
-const Control = styled(components.Control).attrs(applyDefaultTheme)`
-  && {
-    ${props => props.edit && props.theme.themeProp('background', 'rgba(39,39,42, 0.7)', 'rgba(244,244,245, 0.3)')};
-    ${props => props.edit && props.theme.themeProp('border-color', 'rgba(39,39,42, 0.7)', 'rgba(228,228,231, 0.3)')};
-
-    height: 22px;
-    min-height: 22px;
-    box-shadow: none;
-    box-sizing: border-box;
-    padding: 1px 3px 0 8.7px;
-    cursor: pointer;
-    border: 1px solid transparent;
-    background-color: transparent;
-    ${props => props.type && css`
-        animation: ${props => props.type === 'success' ? fadeIn : fadeOut} 0.5s ease-in-out;
-      `}
-
-    ${props => props.type === 'warning' && !props.isFocused && props.theme.themeProp('background-color', '#634e01', '#FFFDE8')};
-
-    ${props => props.type === 'instructions-warning' && !props.isFocused && props.theme.themeProp('background-color', '#634e01', '#FFF36C')};
-
-    ${props => props.type === 'instructions-warning' && props.isFocused && props.theme.themeProp('background-color', '#634e01', '#FFF36C')};
-
-    ${props => props.type === 'error' && !props.isFocused && props.theme.themeProp('background-color', '#7f1b1b', '#FBEAE6')};
-
-    ${props => props.isFocused && !props.type === 'instructions-warning' && props.theme.themeProp('border-color', props.theme.getColor('gray-600'), props.theme.getColor('gray-600'))}
-    ${props => props.type === 'warning' && props.isFocused && props.theme.themeProp('border-color', '#F4E21E', '#F4E21E')}
-        ${props => props.type === 'error' && props.isFocused && props.theme.themeProp('border-color', props.theme.getColor('red-500'), props.theme.getColor('red-500'))}
-  }
-
-  & .dropdown-indicator {
-    display: none;
-  }
-
-  &:hover .dropdown-indicator {
-    display: flex;
-  }
-
-  &&:hover {
-    border-color: transparent;
-    ${props => !props.isFocused && props.theme.themeProp('background-color', props.theme.getColor('gray-700'), props.theme.getColor('gray-100'))};
-
-    ${props => props.type === 'warning' && !props.isFocused && props.theme.themeProp('background', '#806403', '#FFFEBF')};
-
-    ${props => props.type === 'instructions-warning' && !props.isFocused && props.theme.themeProp('background', '#806403', '#F4E21E')};
-
-    ${props => props.type === 'error' && !props.isFocused && props.theme.themeProp('background', '#901d1d', '#f7d5d0')};
-  }
-`;
-const Option = styled(components.Option).attrs(applyDefaultTheme)`
-  && {
-    min-height: 22px;
-    height: 22px;
-    display: flex;
-    align-items: center;
-    padding: 6px;
-    cursor: pointer;
-    padding: 1px 13px;
-    ${props => props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'))}
-    ${props => props.isFocused && css`
-        ${props.theme.themeProp('background-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-200'))}
-      `}
-    ${props => props.isSelected && css`
-        ${props.theme.themeProp('background-color', 'transparent', 'transparent')}
-
-        ${props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'))}
-      `}
-      ${props => props.isFocused && props.isSelected && css`
-        ${props.theme.themeProp('background-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-200'))}
-      `}
-  }
-  svg {
-    width: 15px;
-    margin: 0 9px 0 0;
-  }
-  a {
-    display: flex;
-    text-decoration: none;
-    color: inherit;
-  }
-`;
-const Placeholder = styled(components.Placeholder).attrs(applyDefaultTheme)`
-  && {
-    ${props => (props.type === 'error' || props.type === 'warning') && css`
-        ${props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'))}
-      `}
-    ${props => (props.type === 'error' || props.type === 'warning') && props.theme.themeProp('opacity', '0.6', '0.6')};
-  }
-`;
-const SingleValue = styled(components.SingleValue).attrs(applyDefaultTheme)`
-  && {
-    ${props => props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'))};
-  }
-`;
-const Input = styled(components.Input).attrs(applyDefaultTheme)`
-  && {
-    margin: 0;
-    padding: 0;
-    padding-left: 2px;
-    ${props => props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'))}
-  }
-`;
-const Menu = styled(components.Menu).attrs(applyDefaultTheme)`
-  && {
-    ${props => props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('white'))};
-  }
-`;
-const ValueContainer = styled(components.ValueContainer).attrs(applyDefaultTheme)`
-  && {
-    padding: 0;
-  }
-`;
-const ClearIndicator = styled(components.ClearIndicator).attrs(applyDefaultTheme)`
-  && {
-    display: ${props => props.isFocused ? 'flex' : 'none'};
-    padding: 0;
-    cursor: pointer;
-    ${props => props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'))};
-  }
-`;
-const DropdownIndicator = styled(components.DropdownIndicator).attrs(applyDefaultTheme)`
-  && {
-    display: ${props => props.isFocused ? 'flex' : 'none'};
-    padding: 0;
-    width: 18px;
-    margin-left: 2px;
-    cursor: pointer;
-    margin-top: 1px;
-    ${props => props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'))};
-  }
-`;
-const DropdownIndicatorIcon = styled(SvgExpandMore).attrs(applyDefaultTheme)`
-  width: 12px;
-`;
-const ClearIndicatorIcon = styled(SvgClose).attrs(applyDefaultTheme)`
-  width: 8px;
-  margin-right: 4px;
-  ${props => props.theme.themeProp('stroke', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'))};
-  stroke-width: 2px;
-`;
-const IndicatorSeparator = styled(components.IndicatorSeparator).attrs(applyDefaultTheme)`
-  && {
-    display: ${props => props.isFocused ? 'flex' : 'none'};
-    margin: 4px;
-    ${props => props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'))};
-  }
-`;
+}).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__SuccessContainer",
+  componentId: "sc-l3zyze-3"
+})(["opacity:1;pointer-events:none;display:flex;animation:", " 0.5s ease-in-out;transition:opacity 0.5s ease-in-out;margin-right:5px;", " > svg{width:13px;}"], fadeInCheck, props => props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-500')));
+const AsyncCreatableAutocompleteSelect = styled(AsyncCreatableSelectPaginate).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__AsyncCreatableAutocompleteSelect",
+  componentId: "sc-l3zyze-4"
+})(["", " ", " &&:hover:not(:focus){", "}"], sharedStyle, props => props.disabled && css(["opacity:0.5;cursor:not-allowed;"]), props => props.disabled && css(["background:none !important;cursor:not-allowed;"]));
+const AsyncAutocompleteSelect = styled(AsyncPaginate).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__AsyncAutocompleteSelect",
+  componentId: "sc-l3zyze-5"
+})(["", " ", " &&:hover:not(:focus){", "}"], sharedStyle, props => props.disabled && css(["opacity:0.5;"]), props => props.disabled && css(["background:none !important;cursor:not-allowed;"]));
+const AutocompletSelect = styled(Select).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__AutocompletSelect",
+  componentId: "sc-l3zyze-6"
+})(["", " ", " &&:hover:not(:focus){", "}"], sharedStyle, props => props.disabled && css(["opacity:0.5;"]), props => props.disabled && css(["background:none !important;cursor:not-allowed;"]));
+const AutocompletCreatableSelect = styled(CreatableSelect).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__AutocompletCreatableSelect",
+  componentId: "sc-l3zyze-7"
+})(["", " ", ""], sharedStyle, props => props.disabled && css(["opacity:0.5;"]));
+const Control = styled(components.Control).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__Control",
+  componentId: "sc-l3zyze-8"
+})(["&&{", ";", ";height:22px;min-height:22px;box-shadow:none;box-sizing:border-box;padding:1px 3px 0 8.7px;cursor:pointer;border:1px solid transparent;background-color:transparent;", " ", ";", ";", ";", ";", " ", " ", "}& .dropdown-indicator{display:none;}&:hover .dropdown-indicator{display:flex;}&&:hover{border-color:transparent;", ";", ";", ";", ";}"], props => props.edit && props.theme.themeProp('background', 'rgba(39,39,42, 0.7)', 'rgba(244,244,245, 0.3)'), props => props.edit && props.theme.themeProp('border-color', 'rgba(39,39,42, 0.7)', 'rgba(228,228,231, 0.3)'), props => props.type && css(["animation:", " 0.5s ease-in-out;"], props => props.type === 'success' ? fadeIn : fadeOut), props => props.type === 'warning' && !props.isFocused && props.theme.themeProp('background-color', '#634e01', '#FFFDE8'), props => props.type === 'instructions-warning' && !props.isFocused && props.theme.themeProp('background-color', '#634e01', '#FFF36C'), props => props.type === 'instructions-warning' && props.isFocused && props.theme.themeProp('background-color', '#634e01', '#FFF36C'), props => props.type === 'error' && !props.isFocused && props.theme.themeProp('background-color', '#7f1b1b', '#FBEAE6'), props => props.isFocused && !props.type === 'instructions-warning' && props.theme.themeProp('border-color', props.theme.getColor('gray-600'), props.theme.getColor('gray-600')), props => props.type === 'warning' && props.isFocused && props.theme.themeProp('border-color', '#F4E21E', '#F4E21E'), props => props.type === 'error' && props.isFocused && props.theme.themeProp('border-color', props.theme.getColor('red-500'), props.theme.getColor('red-500')), props => !props.isFocused && props.theme.themeProp('background-color', props.theme.getColor('gray-700'), props.theme.getColor('gray-100')), props => props.type === 'warning' && !props.isFocused && props.theme.themeProp('background', '#806403', '#FFFEBF'), props => props.type === 'instructions-warning' && !props.isFocused && props.theme.themeProp('background', '#806403', '#F4E21E'), props => props.type === 'error' && !props.isFocused && props.theme.themeProp('background', '#901d1d', '#f7d5d0'));
+const Option = styled(components.Option).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__Option",
+  componentId: "sc-l3zyze-9"
+})(["&&{min-height:22px;height:22px;display:flex;align-items:center;padding:6px;cursor:pointer;padding:1px 13px;", " ", " ", " ", "}svg{width:15px;margin:0 9px 0 0;}a{display:flex;text-decoration:none;color:inherit;}"], props => props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700')), props => props.isFocused && css(["", ""], props.theme.themeProp('background-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-200'))), props => props.isSelected && css(["", " ", ""], props.theme.themeProp('background-color', 'transparent', 'transparent'), props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'))), props => props.isFocused && props.isSelected && css(["", ""], props.theme.themeProp('background-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-200'))));
+const Placeholder = styled(components.Placeholder).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__Placeholder",
+  componentId: "sc-l3zyze-10"
+})(["&&{", " ", ";}"], props => (props.type === 'error' || props.type === 'warning') && css(["", ""], props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'))), props => (props.type === 'error' || props.type === 'warning') && props.theme.themeProp('opacity', '0.6', '0.6'));
+const SingleValue = styled(components.SingleValue).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__SingleValue",
+  componentId: "sc-l3zyze-11"
+})(["&&{", ";}"], props => props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700')));
+const Input = styled(components.Input).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__Input",
+  componentId: "sc-l3zyze-12"
+})(["&&{margin:0;padding:0;padding-left:2px;", "}"], props => props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700')));
+const Menu = styled(components.Menu).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__Menu",
+  componentId: "sc-l3zyze-13"
+})(["&&{", ";}"], props => props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('white')));
+const ValueContainer = styled(components.ValueContainer).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__ValueContainer",
+  componentId: "sc-l3zyze-14"
+})(["&&{padding:0;}"]);
+const ClearIndicator = styled(components.ClearIndicator).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__ClearIndicator",
+  componentId: "sc-l3zyze-15"
+})(["&&{display:", ";padding:0;cursor:pointer;", ";}"], props => props.isFocused ? 'flex' : 'none', props => props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500')));
+const DropdownIndicator = styled(components.DropdownIndicator).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__DropdownIndicator",
+  componentId: "sc-l3zyze-16"
+})(["&&{display:", ";padding:0;width:18px;margin-left:2px;cursor:pointer;margin-top:1px;", ";}"], props => props.isFocused ? 'flex' : 'none', props => props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500')));
+const DropdownIndicatorIcon = styled(SvgExpandMore).withConfig({
+  shouldForwardProp
+}).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__DropdownIndicatorIcon",
+  componentId: "sc-l3zyze-17"
+})(["width:12px;"]);
+const ClearIndicatorIcon = styled(SvgClose).withConfig({
+  shouldForwardProp
+}).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__ClearIndicatorIcon",
+  componentId: "sc-l3zyze-18"
+})(["width:8px;margin-right:4px;", ";stroke-width:2px;"], props => props.theme.themeProp('stroke', props.theme.getColor('gray-400'), props.theme.getColor('gray-500')));
+const IndicatorSeparator = styled(components.IndicatorSeparator).attrs(applyDefaultTheme).withConfig({
+  displayName: "CompactAutocompleteSelectstyled__IndicatorSeparator",
+  componentId: "sc-l3zyze-19"
+})(["&&{display:", ";margin:4px;", ";}"], props => props.isFocused ? 'flex' : 'none', props => props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500')));
 
 export { AsyncAutocompleteSelect, AsyncCreatableAutocompleteSelect, AutocompletCreatableSelect, AutocompletSelect, ClearIndicator, ClearIndicatorIcon, CompactAutocompleteSelect, Control, DropdownIndicator, DropdownIndicatorIcon, IndicatorSeparator, Input, InputContainer, Label, Menu, Option, Placeholder, SingleValue, SuccessContainer, ValueContainer };
 //# sourceMappingURL=CompactAutocompleteSelect.styled.js.map