@laerdal/life-react-components 5.1.0 → 6.0.0-dev.1.full

package/dist/Dropdown/BasicDropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"BasicDropdown.js","names":["React","COLORS","SystemIcons","LoadingIndicator","DropdownContainer","DropdownInputFieldStyles","DropdownInputField","DropdownContent","AutofilledMessage","ErrorMessage","TooltipOverflow","Size","defaultOnMouseDownHandler","useClickOutsideRef","useFocusVisibleRef","useFocusOutsideRef","useTheme","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","BasicDropdown","forwardRef","props","ref","id","list","placeholder","messageOnNoResults","itemsType","action","actionLabel","actionVariant","actionIcon","actionLoading","actionDisabled","pinTopItem","scrollable","maxHeight","disabled","readOnly","isButton","activeValidationMessage","autofilledMessage","size","margin","minWidth","className","overflowTooltipPosition","onBlur","dataTestId","onSelect","textOverflow","rest","_objectWithoutProperties","_excluded","theme","isOpen","setIsOpen","useState","activeDescendant","setActiveDescendant","isLoading","setIsLoading","input","setInput","focused","setFocused","keyboardNavigated","setKeyboardNavigated","inputRef","useRef","styledFieldRef","dropdownRef","resetDropdown","containerRef","handleKeyDown","e","key","handleValueSelect","values","join","multiSelect","undefined","_styledFieldRef$curre","current","focus","focusVisible","useEffect","value","useImperativeHandle","customSetIsOpen","getDisplayItems","split","map","val","trim","listDisplayLabels","filter","item","includes","l","displayLabel","handleBlur","currentTarget","contains","relatedTarget","cls","concat","children","role","$isButton","$readOnly","$disabled","_objectSpread","onMouseDown","onClick","stopPropagation","_inputRef$current","blur","_inputRef$current2","tabIndex","$isPlaceholder","$showValidationMessage","onKeyDown","$minWidth","type","$ellipsis","position","withArrow","maxWidth","align","Small","color","getColor","ArrowDropUp","ArrowDropDown","onActiveDescendantChanged","customizationProps","onValueUpdate","items","ariaRolesType","outline","selectedValues","setSelectedValues","TechnicalWarning","Information","propTypes","_pt","array","isRequired","oneOf","func","string","node","bool","disableSorting"],"sources":["../../src/Dropdown/BasicDropdown.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport {COLORS} from '../styles';\r\nimport {SystemIcons} from '../icons';\r\nimport {LoadingIndicator} from '../LoadingIndicator';\r\nimport {DropdownContainer, DropdownInputFieldStyles, DropdownInputField} from './CommonStyling';\r\nimport DropdownContent, {DropdownItem} from './DropdownContent';\r\nimport {AutofilledMessage, ErrorMessage} from '../InputFields';\r\nimport TooltipOverflow from '../Tooltips/TooltipOverflow';\r\nimport {Size, Testable} from '../types';\r\nimport {defaultOnMouseDownHandler, useClickOutsideRef, useFocusVisibleRef} from '../common';\r\nimport {useFocusOutsideRef} from '../common';\r\nimport { useTheme } from 'styled-components';\r\n\r\nexport interface BasicDropdownCommonProps extends Testable, Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect' | 'placeholder' | 'tabIndex' | 'onMouseDown' | 'onClick' | 'onKeyDown'>{\r\n  /**\r\n  * Required. An array of DropdownItem objects representing the items in the dropdown.\r\n  */\r\n  list: DropdownItem[];\r\n  /**\r\n  * Optional. The type of the items in the dropdown. Can be 'normal', 'checkbox', or 'radio'.\r\n  */\r\n  itemsType?: 'normal' | 'checkbox' | 'radio';\r\n  /**\r\n  * Optional. A function to be called when the action button in the dropdown is clicked.\r\n  */\r\n  action?: () => void;\r\n  /**\r\n  * Optional. The label for the action button in the dropdown.\r\n  */\r\n  actionLabel?: string;\r\n  /**\r\n  * Optional. The variant of the action button in the dropdown. Can be 'primary', 'secondary', 'tertiary', or undefined.\r\n  */\r\n  actionVariant?: 'primary' | 'secondary' | 'tertiary' | undefined;\r\n  /**\r\n  * Optional. The icon for the action button in the dropdown.\r\n  */\r\n  actionIcon?: React.ReactNode;\r\n  /**\r\n  * Optional. A boolean indicating whether the action button in the dropdown is loading.\r\n  */\r\n  actionLoading?: boolean;\r\n  /**\r\n  * Optional. A boolean indicating whether the action button in the dropdown is disabled.\r\n  */\r\n  actionDisabled?: boolean;\r\n  /**\r\n  * Optional. A boolean indicating whether the top item in the dropdown should be pinned.\r\n  */\r\n  pinTopItem?: boolean;\r\n  /**\r\n  * Optional. A boolean indicating whether the dropdown content is scrollable.\r\n  */\r\n  scrollable?: boolean;\r\n  /**\r\n  * Optional. The maximum height of the dropdown.\r\n  */\r\n  maxHeight?: string;\r\n  /*\r\n  * Optional. Placeholder text to be shown when none of the items is selected is selected\r\n  */\r\n  placeholder?: string;\r\n  /**\r\n  * Optional. A boolean indicating whether sorting is disabled in the dropdown.\r\n  */\r\n  disableSorting?: boolean;\r\n  /**\r\n   * Optional. The message to be displayed when there are no results in the dropdown.\r\n   */\r\n  messageOnNoResults?: string;\r\n  /**\r\n  * Optional. A boolean indicating whether the dropdown is disabled.\r\n  */\r\n  disabled?: boolean;\r\n  /**\r\n   * Optional. A boolean indicating whether the dropdown is read-only.\r\n   */\r\n  readOnly?: boolean;\r\n  /**\r\n   * Optional. A boolean indicating whether the dropdown is a button.\r\n   */\r\n  isButton?: boolean;\r\n  /**\r\n   * Optional. The validation message to be displayed when the dropdown is active.\r\n   */\r\n  activeValidationMessage?: string;\r\n  /**\r\n   * Optional. The message to be displayed when the dropdown is autofilled.\r\n   */\r\n  autofilledMessage?: string;\r\n  /**\r\n   * Optional. The size of the dropdown. Can be 'Small' or 'Medium'.\r\n   */  \r\n  size?: Size.Small | Size.Medium;\r\n  /**\r\n   * Optional. The margin of the dropdown. Can be any valid CSS margin value.\r\n   */\r\n  margin?: string;\r\n  /**\r\n   * Optional. The minimum width of the dropdown.\r\n   */\r\n  minWidth?: string;\r\n  /**\r\n   * Optional. The text overflow behavior of the dropdown. Can be 'ellipsis' or 'default'.\r\n   */\r\n  textOverflow?: 'ellipsis' | 'default';\r\n    /**\r\n   * Optional. The position of the tooltip when dropdown is closed. Can be 'top' or 'bottom'.\r\n   */\r\n  overflowTooltipPosition?: 'top' | 'bottom';\r\n}\r\n\r\nexport type BasicDropdownMultiSelectProps = BasicDropdownCommonProps & {\r\n  /** Required. If this flag is set then user can select multiple items. */\r\n  multiSelect: true;\r\n  /** Required. Selected items. */\r\n  value?: string[];\r\n  /** Required. Callback handler to call when user selects one of the items. Provides all selected items after last change. */\r\n  onSelect: (value: string[]) => void;\r\n}\r\n\r\nexport type BasucDropdownSingleSelectProps = BasicDropdownCommonProps & {\r\n  /** Required. If this flag is set then user can select multiple items. */\r\n  multiSelect?: false;\r\n  /** Required. Selected item. */\r\n  value?: string;\r\n  /** Required. Callback handler to call when user selects one of the items. Provides value of selected item. */\r\n  onSelect: (value: string) => void;\r\n}\r\n\r\nexport type BasicDropdownProps = BasucDropdownSingleSelectProps | BasicDropdownMultiSelectProps;\r\n\r\nconst BasicDropdown = React.forwardRef((props: BasicDropdownProps, ref) => {\r\n  const {\r\n    id,\r\n    list,\r\n    placeholder,\r\n    messageOnNoResults,\r\n    itemsType = 'normal',\r\n    action,\r\n    actionLabel,\r\n    actionVariant,\r\n    actionIcon,\r\n    actionLoading,\r\n    actionDisabled,\r\n    pinTopItem,\r\n    scrollable = true,\r\n    maxHeight,\r\n    disabled,\r\n    readOnly,\r\n    isButton,\r\n    activeValidationMessage,\r\n    autofilledMessage,\r\n    size,\r\n    margin,\r\n    minWidth,\r\n    className,\r\n    overflowTooltipPosition,\r\n    onBlur,\r\n    dataTestId,\r\n    onSelect,\r\n    textOverflow = 'ellipsis',\r\n    ...rest\r\n  } = props;\r\n\r\n  const theme = useTheme();\r\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\r\n  const [activeDescendant, setActiveDescendant] = React.useState<string>();\r\n  const [isLoading, setIsLoading] = React.useState<boolean>(false);\r\n  const [input, setInput] = React.useState<string>('');\r\n  const [focused, setFocused] = React.useState<number | null>(null);\r\n  \r\n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\r\n\r\n  const inputRef = React.useRef<HTMLInputElement>(null);\r\n  const styledFieldRef = useFocusVisibleRef([inputRef]);\r\n  const dropdownRef = React.useRef<HTMLDivElement>(null);\r\n\r\n  const resetDropdown = () => {\r\n    setIsOpen(false);\r\n    setFocused(null);\r\n  };\r\n\r\n  const containerRef = useFocusOutsideRef(resetDropdown, [dropdownRef]);\r\n\r\n  useClickOutsideRef(resetDropdown, [], containerRef);\r\n\r\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\r\n    if (e.key === 'Enter' || e.key === ' ') {\r\n      setIsOpen(!isOpen);\r\n      setKeyboardNavigated(true);\r\n    }\r\n  };\r\n\r\n  const handleValueSelect = (values: string[]) => {\r\n    setInput(values.join(', '));\r\n\r\n    if (props.multiSelect === true) {\r\n      props.onSelect(values);\r\n    } else if (props.multiSelect === false || props.multiSelect === undefined) {\r\n      props.onSelect(values[0]);\r\n    }\r\n\r\n    //don't close dropdown on item select if have custom action or multiselect\r\n    if (actionLabel || props.multiSelect) return;\r\n\r\n    if (keyboardNavigated) {\r\n      styledFieldRef.current?.focus({focusVisible: true} as any);\r\n    }\r\n    setIsOpen(false);\r\n    setFocused(null);\r\n  };\r\n\r\n  React.useEffect(() => {\r\n    if (props.value) {\r\n      if (props.multiSelect) {\r\n        setInput(props.value.join(', '));\r\n      } else if (props.multiSelect === false || props.multiSelect === undefined) {\r\n        setInput(props.value);\r\n      }\r\n    } else {\r\n      setInput('');\r\n    }\r\n  }, [props.value, props.multiSelect]);\r\n\r\n  React.useEffect(() => {\r\n    setIsLoading(false);\r\n  }, [input]);\r\n\r\n  React.useEffect(() => {\r\n    !isOpen && setKeyboardNavigated(false);\r\n  }, [isOpen]);\r\n\r\n  React.useImperativeHandle(ref, () => inputRef.current, [inputRef]);\r\n\r\n  const customSetIsOpen = (isOpen: boolean) => {\r\n    setIsOpen(isOpen);\r\n  };\r\n\r\n  const getDisplayItems = () => {\r\n    const values = input.split(',').map((val) => val.trim());\r\n    const listDisplayLabels = list.filter((item) => values.includes(item.value)).map((l) => l.displayLabel);\r\n    return listDisplayLabels.join(', ');\r\n  };\r\n\r\n  const handleBlur = (e: React.FocusEvent<HTMLDivElement>) => {\r\n    // @ts-ignore\r\n    if (!e.currentTarget.contains(e.relatedTarget)) {\r\n      onBlur && onBlur(e);\r\n    }\r\n  };\r\n\r\n  const cls = (isOpen ? 'expanded ' : '').concat(size ? size : '').concat(isButton ? ' button ' : '').concat(className ? ` ${className}` : '');\r\n  \r\n  return (\r\n    <>\r\n      <DropdownContainer ref={containerRef}\r\n                aria-expanded={isOpen ? true : false}\r\n                aria-activedescendant={activeDescendant}\r\n                aria-controls={`${id}_dropdowncontent`}\r\n                role=\"listbox\"\r\n                aria-multiselectable={props.multiSelect}\r\n                $isButton={isButton || false}\r\n                className={size ? size : ''}\r\n                $readOnly={readOnly}\r\n                $disabled={disabled}\r\n                margin={margin}\r\n                onBlur={handleBlur}\r\n                minWidth={minWidth}>\r\n        <DropdownInputFieldStyles\r\n          ref={styledFieldRef}\r\n          className={cls}\r\n          onMouseDown={defaultOnMouseDownHandler}\r\n          onClick={(e) => {\r\n            if (!readOnly && !disabled) {\r\n              e.stopPropagation();\r\n              setIsOpen(!isOpen);\r\n              if (isOpen) {\r\n                inputRef.current?.blur();\r\n              } else {\r\n                inputRef.current?.focus();\r\n              }\r\n            }\r\n          }}\r\n          tabIndex={disabled || readOnly ? -1 : 0}\r\n          $disabled={disabled || false}\r\n          $readOnly={readOnly || false}\r\n          $isPlaceholder={!input}\r\n          $showValidationMessage={!!activeValidationMessage}\r\n          onKeyDown={handleKeyDown}\r\n          $minWidth={minWidth}\r\n          {...rest}>\r\n          <DropdownInputField\r\n            ref={inputRef}\r\n            type=\"search\"\r\n            $ellipsis={textOverflow == 'ellipsis'}\r\n            id={id}\r\n            data-testid={dataTestId}\r\n            readOnly\r\n            placeholder={placeholder}\r\n            value={getDisplayItems()}\r\n            className={size ? `${size} value` : 'value'}\r\n            tabIndex={-1}\r\n            disabled={disabled || false}\r\n          />\r\n          {!isOpen ? <TooltipOverflow position={overflowTooltipPosition} input={inputRef} withArrow={true} maxWidth=\"100%\" size={size} align='end'>\r\n            {getDisplayItems()}\r\n        </TooltipOverflow> : null}\r\n          {isLoading ? <LoadingIndicator size={Size.Small} color={COLORS.getColor('neutral_600', theme)}/> : null}\r\n          <div className={'icon dropdown-arrow'}>\r\n            {isOpen ? <SystemIcons.ArrowDropUp aria-label='Expanded' size=\"24px\" className={size ? size : ''}/> :\r\n              <SystemIcons.ArrowDropDown aria-label='Collapsed' size=\"24px\" className={size ? size : ''}/>}\r\n          </div>\r\n        </DropdownInputFieldStyles>\r\n        {!readOnly && !disabled && (\r\n          <DropdownContent\r\n            ref={dropdownRef}\r\n            containerRef={containerRef}\r\n            onActiveDescendantChanged={(id) => setActiveDescendant(id)}\r\n            customizationProps={{\r\n              itemsType: itemsType,\r\n              action: action ?? (() => {\r\n              }),\r\n              actionLabel: actionLabel,\r\n              actionVariant: actionVariant,\r\n              actionDisabled: actionDisabled,\r\n              scrollable: scrollable,\r\n              onValueUpdate: handleValueSelect,\r\n              items: list,\r\n              multiSelect: props.multiSelect,\r\n              pinTopItem: pinTopItem,\r\n              maxHeight: maxHeight,\r\n              actionIcon: actionIcon,\r\n              actionLoading: actionLoading,\r\n            }}\r\n            ariaRolesType=\"input\"\r\n            focused={focused}\r\n            setFocused={setFocused}\r\n            size={size ?? Size.Small}\r\n            filter={''}\r\n            isOpen={isOpen}\r\n            setIsOpen={customSetIsOpen}\r\n            messageOnNoResults={messageOnNoResults ?? ''}\r\n            outline={keyboardNavigated}\r\n            isButton={isButton || false}\r\n            selectedValues={props.multiSelect ? props.value || [] : [props.value || '']}\r\n            setSelectedValues={handleValueSelect}\r\n            id={`${id}_dropdowncontent`}\r\n          />\r\n        )}\r\n      </DropdownContainer>\r\n      {activeValidationMessage && (\r\n        <ErrorMessage>\r\n          <SystemIcons.TechnicalWarning color={COLORS.getColor('critical_400', theme)}/>\r\n          <span>{activeValidationMessage}</span>\r\n        </ErrorMessage>\r\n      )}\r\n      {autofilledMessage && (\r\n        <AutofilledMessage>\r\n          <SystemIcons.Information color={COLORS.getColor('neutral_600', theme)}/>\r\n          <span>{autofilledMessage}</span>\r\n        </AutofilledMessage>\r\n      )}\r\n    </>\r\n  );\r\n});\r\n\r\nexport default BasicDropdown;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"BasicDropdown.js","names":["React","COLORS","SystemIcons","LoadingIndicator","DropdownContainer","DropdownInputFieldStyles","DropdownInputField","DropdownContent","AutofilledMessage","ErrorMessage","TooltipOverflow","Size","defaultOnMouseDownHandler","useClickOutsideRef","useFocusVisibleRef","useFocusOutsideRef","useTheme","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","BasicDropdown","forwardRef","props","ref","id","list","placeholder","messageOnNoResults","itemsType","action","actionLabel","actionVariant","actionIcon","actionLoading","actionDisabled","pinTopItem","scrollable","maxHeight","disabled","readOnly","isButton","activeValidationMessage","autofilledMessage","size","margin","minWidth","className","overflowTooltipPosition","onBlur","dataTestId","onSelect","textOverflow","dropdownIcon","rest","_objectWithoutProperties","_excluded","theme","isOpen","setIsOpen","useState","activeDescendant","setActiveDescendant","isLoading","setIsLoading","input","setInput","focused","setFocused","keyboardNavigated","setKeyboardNavigated","inputRef","useRef","styledFieldRef","dropdownRef","resetDropdown","containerRef","handleKeyDown","e","key","handleValueSelect","values","join","multiSelect","undefined","current","focus","focusVisible","useEffect","value","useImperativeHandle","customSetIsOpen","getDisplayItems","split","map","val","trim","listDisplayLabels","filter","item","includes","l","displayLabel","handleBlur","currentTarget","contains","relatedTarget","cls","concat","children","role","$isButton","$readOnly","$disabled","_objectSpread","onMouseDown","onClick","stopPropagation","blur","tabIndex","$isPlaceholder","$showValidationMessage","onKeyDown","$minWidth","type","$ellipsis","position","withArrow","maxWidth","align","Small","color","getColor","ArrowDropUp","ArrowDropDown","onActiveDescendantChanged","customizationProps","onValueUpdate","items","ariaRolesType","outline","selectedValues","setSelectedValues","TechnicalWarning","Information","propTypes","_pt","array","isRequired","oneOf","func","string","node","bool","disableSorting"],"sources":["../../src/Dropdown/BasicDropdown.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport {COLORS} from '../styles';\r\nimport {SystemIcons} from '../icons';\r\nimport {LoadingIndicator} from '../LoadingIndicator';\r\nimport {DropdownContainer, DropdownInputFieldStyles, DropdownInputField} from './CommonStyling';\r\nimport DropdownContent, {DropdownItem} from './DropdownContent';\r\nimport {AutofilledMessage, ErrorMessage} from '../InputFields';\r\nimport TooltipOverflow from '../Tooltips/TooltipOverflow';\r\nimport {Size, Testable} from '../types';\r\nimport {defaultOnMouseDownHandler, useClickOutsideRef, useFocusVisibleRef} from '../common';\r\nimport {useFocusOutsideRef} from '../common';\r\nimport { useTheme } from 'styled-components';\r\n\r\nexport interface BasicDropdownCommonProps extends Testable, Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect' | 'placeholder' | 'tabIndex' | 'onMouseDown' | 'onClick' | 'onKeyDown'>{\r\n  /**\r\n  * Required. An array of DropdownItem objects representing the items in the dropdown.\r\n  */\r\n  list: DropdownItem[];\r\n  /**\r\n  * Optional. The type of the items in the dropdown. Can be 'normal', 'checkbox', or 'radio'.\r\n  */\r\n  itemsType?: 'normal' | 'checkbox' | 'radio';\r\n  /**\r\n  * Optional. A function to be called when the action button in the dropdown is clicked.\r\n  */\r\n  action?: () => void;\r\n  /**\r\n  * Optional. The label for the action button in the dropdown.\r\n  */\r\n  actionLabel?: string;\r\n  /**\r\n  * Optional. The variant of the action button in the dropdown. Can be 'primary', 'secondary', 'tertiary', or undefined.\r\n  */\r\n  actionVariant?: 'primary' | 'secondary' | 'tertiary' | undefined;\r\n  /**\r\n  * Optional. The icon for the action button in the dropdown.\r\n  */\r\n  actionIcon?: React.ReactNode;\r\n  /**\r\n  * Optional. A boolean indicating whether the action button in the dropdown is loading.\r\n  */\r\n  actionLoading?: boolean;\r\n  /**\r\n  * Optional. A boolean indicating whether the action button in the dropdown is disabled.\r\n  */\r\n  actionDisabled?: boolean;\r\n  /**\r\n  * Optional. A boolean indicating whether the top item in the dropdown should be pinned.\r\n  */\r\n  pinTopItem?: boolean;\r\n  /**\r\n  * Optional. A boolean indicating whether the dropdown content is scrollable.\r\n  */\r\n  scrollable?: boolean;\r\n  /**\r\n  * Optional. The maximum height of the dropdown.\r\n  */\r\n  maxHeight?: string;\r\n  /*\r\n  * Optional. Placeholder text to be shown when none of the items is selected is selected\r\n  */\r\n  placeholder?: string;\r\n  /**\r\n  * Optional. A boolean indicating whether sorting is disabled in the dropdown.\r\n  */\r\n  disableSorting?: boolean;\r\n  /**\r\n   * Optional. The message to be displayed when there are no results in the dropdown.\r\n   */\r\n  messageOnNoResults?: string;\r\n  /**\r\n  * Optional. A boolean indicating whether the dropdown is disabled.\r\n  */\r\n  disabled?: boolean;\r\n  /**\r\n   * Optional. A boolean indicating whether the dropdown is read-only.\r\n   */\r\n  readOnly?: boolean;\r\n  /**\r\n   * Optional. A boolean indicating whether the dropdown is a button.\r\n   */\r\n  isButton?: boolean;\r\n  /**\r\n   * Optional. The validation message to be displayed when the dropdown is active.\r\n   */\r\n  activeValidationMessage?: string;\r\n  /**\r\n   * Optional. The message to be displayed when the dropdown is autofilled.\r\n   */\r\n  autofilledMessage?: string;\r\n  /**\r\n   * Optional. The size of the dropdown. Can be 'Small' or 'Medium'.\r\n   */  \r\n  size?: Size.Small | Size.Medium;\r\n  /**\r\n   * Optional. The margin of the dropdown. Can be any valid CSS margin value.\r\n   */\r\n  margin?: string;\r\n  /**\r\n   * Optional. The minimum width of the dropdown.\r\n   */\r\n  minWidth?: string;\r\n  /**\r\n   * Optional. The text overflow behavior of the dropdown. Can be 'ellipsis' or 'default'.\r\n   */\r\n  textOverflow?: 'ellipsis' | 'default';\r\n  /**\r\n   * Optional. The position of the tooltip when dropdown is closed. Can be 'top' or 'bottom'.\r\n   */\r\n  overflowTooltipPosition?: 'top' | 'bottom';\r\n  /**\r\n   * Optional. The action icon to be shown on the rightside of the dropdown that opens dropdown content.\r\n   */\r\n  dropdownIcon?: React.ReactNode;\r\n}\r\n\r\nexport type BasicDropdownMultiSelectProps = BasicDropdownCommonProps & {\r\n  /** Required. If this flag is set then user can select multiple items. */\r\n  multiSelect: true;\r\n  /** Required. Selected items. */\r\n  value?: string[];\r\n  /** Required. Callback handler to call when user selects one of the items. Provides all selected items after last change. */\r\n  onSelect: (value: string[]) => void;\r\n}\r\n\r\nexport type BasucDropdownSingleSelectProps = BasicDropdownCommonProps & {\r\n  /** Required. If this flag is set then user can select multiple items. */\r\n  multiSelect?: false;\r\n  /** Required. Selected item. */\r\n  value?: string;\r\n  /** Required. Callback handler to call when user selects one of the items. Provides value of selected item. */\r\n  onSelect: (value: string) => void;\r\n}\r\n\r\nexport type BasicDropdownProps = BasucDropdownSingleSelectProps | BasicDropdownMultiSelectProps;\r\n\r\nconst BasicDropdown = React.forwardRef((props: BasicDropdownProps, ref) => {\r\n  const {\r\n    id,\r\n    list,\r\n    placeholder,\r\n    messageOnNoResults,\r\n    itemsType = 'normal',\r\n    action,\r\n    actionLabel,\r\n    actionVariant,\r\n    actionIcon,\r\n    actionLoading,\r\n    actionDisabled,\r\n    pinTopItem,\r\n    scrollable = true,\r\n    maxHeight,\r\n    disabled,\r\n    readOnly,\r\n    isButton,\r\n    activeValidationMessage,\r\n    autofilledMessage,\r\n    size,\r\n    margin,\r\n    minWidth,\r\n    className,\r\n    overflowTooltipPosition,\r\n    onBlur,\r\n    dataTestId,\r\n    onSelect,\r\n    textOverflow = 'ellipsis',\r\n    dropdownIcon,\r\n    ...rest\r\n  } = props;\r\n\r\n  const theme = useTheme();\r\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\r\n  const [activeDescendant, setActiveDescendant] = React.useState<string>();\r\n  const [isLoading, setIsLoading] = React.useState<boolean>(false);\r\n  const [input, setInput] = React.useState<string>('');\r\n  const [focused, setFocused] = React.useState<number | null>(null);\r\n  \r\n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\r\n\r\n  const inputRef = React.useRef<HTMLInputElement>(null);\r\n  const styledFieldRef = useFocusVisibleRef([inputRef]);\r\n  const dropdownRef = React.useRef<HTMLDivElement>(null);\r\n\r\n  const resetDropdown = () => {\r\n    setIsOpen(false);\r\n    setFocused(null);\r\n  };\r\n\r\n  const containerRef = useFocusOutsideRef(resetDropdown, [dropdownRef]);\r\n\r\n  useClickOutsideRef(resetDropdown, [], containerRef);\r\n\r\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\r\n    if (e.key === 'Enter' || e.key === ' ') {\r\n      setIsOpen(!isOpen);\r\n      setKeyboardNavigated(true);\r\n    }\r\n  };\r\n\r\n  const handleValueSelect = (values: string[]) => {\r\n    setInput(values.join(', '));\r\n\r\n    if (props.multiSelect === true) {\r\n      props.onSelect(values);\r\n    } else if (props.multiSelect === false || props.multiSelect === undefined) {\r\n      props.onSelect(values[0]);\r\n    }\r\n\r\n    //don't close dropdown on item select if have custom action or multiselect\r\n    if (actionLabel || props.multiSelect) return;\r\n\r\n    if (keyboardNavigated) {\r\n      styledFieldRef.current?.focus({focusVisible: true} as any);\r\n    }\r\n    setIsOpen(false);\r\n    setFocused(null);\r\n  };\r\n\r\n  React.useEffect(() => {\r\n    if (props.value) {\r\n      if (props.multiSelect) {\r\n        setInput(props.value.join(', '));\r\n      } else if (props.multiSelect === false || props.multiSelect === undefined) {\r\n        setInput(props.value);\r\n      }\r\n    } else {\r\n      setInput('');\r\n    }\r\n  }, [props.value, props.multiSelect]);\r\n\r\n  React.useEffect(() => {\r\n    setIsLoading(false);\r\n  }, [input]);\r\n\r\n  React.useEffect(() => {\r\n    !isOpen && setKeyboardNavigated(false);\r\n  }, [isOpen]);\r\n\r\n  React.useImperativeHandle(ref, () => inputRef.current, [inputRef]);\r\n\r\n  const customSetIsOpen = (isOpen: boolean) => {\r\n    setIsOpen(isOpen);\r\n  };\r\n\r\n  const getDisplayItems = () => {\r\n    const values = input.split(',').map((val) => val.trim());\r\n    const listDisplayLabels = list.filter((item) => values.includes(item.value)).map((l) => l.displayLabel);\r\n    return listDisplayLabels.join(', ');\r\n  };\r\n\r\n  const handleBlur = (e: React.FocusEvent<HTMLDivElement>) => {\r\n    // @ts-ignore\r\n    if (!e.currentTarget.contains(e.relatedTarget)) {\r\n      onBlur && onBlur(e);\r\n    }\r\n  };\r\n\r\n  const cls = (isOpen ? 'expanded ' : '').concat(size ? size : '').concat(isButton ? ' button ' : '').concat(className ? ` ${className}` : '');\r\n  \r\n  return (\r\n    <>\r\n      <DropdownContainer ref={containerRef}\r\n                aria-expanded={isOpen ? true : false}\r\n                aria-activedescendant={activeDescendant}\r\n                aria-controls={`${id}_dropdowncontent`}\r\n                role=\"listbox\"\r\n                aria-multiselectable={props.multiSelect}\r\n                $isButton={isButton || false}\r\n                className={size ? size : ''}\r\n                $readOnly={readOnly}\r\n                $disabled={disabled}\r\n                margin={margin}\r\n                onBlur={handleBlur}\r\n                minWidth={minWidth}>\r\n        <DropdownInputFieldStyles\r\n          ref={styledFieldRef}\r\n          className={cls}\r\n          onMouseDown={defaultOnMouseDownHandler}\r\n          onClick={(e) => {\r\n            if (!readOnly && !disabled) {\r\n              e.stopPropagation();\r\n              setIsOpen(!isOpen);\r\n              if (isOpen) {\r\n                inputRef.current?.blur();\r\n              } else {\r\n                inputRef.current?.focus();\r\n              }\r\n            }\r\n          }}\r\n          tabIndex={disabled || readOnly ? -1 : 0}\r\n          $disabled={disabled || false}\r\n          $readOnly={readOnly || false}\r\n          $isPlaceholder={!input}\r\n          $showValidationMessage={!!activeValidationMessage}\r\n          onKeyDown={handleKeyDown}\r\n          $minWidth={minWidth}\r\n          {...rest}>\r\n          <DropdownInputField\r\n            ref={inputRef}\r\n            type=\"search\"\r\n            $ellipsis={textOverflow == 'ellipsis'}\r\n            id={id}\r\n            data-testid={dataTestId}\r\n            readOnly\r\n            placeholder={placeholder}\r\n            value={getDisplayItems()}\r\n            className={size ? `${size} value` : 'value'}\r\n            tabIndex={-1}\r\n            disabled={disabled || false}\r\n          />\r\n          {!isOpen ? <TooltipOverflow position={overflowTooltipPosition} input={inputRef} withArrow={true} maxWidth=\"100%\" size={size} align='end'>\r\n            {getDisplayItems()}\r\n        </TooltipOverflow> : null}\r\n          {isLoading ? <LoadingIndicator size={Size.Small} color={COLORS.getColor('neutral_600', theme)}/> : null}\r\n          <div className={'icon dropdown-arrow'}>\r\n            {isOpen ? <SystemIcons.ArrowDropUp aria-label='Expanded' size=\"24px\" className={size ? size : ''}/> :\r\n              (dropdownIcon ?? <SystemIcons.ArrowDropDown aria-label='Collapsed' size=\"24px\" className={size ? size : ''}/>)}\r\n          </div>\r\n        </DropdownInputFieldStyles>\r\n        {!readOnly && !disabled && (\r\n          <DropdownContent\r\n            ref={dropdownRef}\r\n            containerRef={containerRef}\r\n            onActiveDescendantChanged={(id) => setActiveDescendant(id)}\r\n            customizationProps={{\r\n              itemsType: itemsType,\r\n              action: action ?? (() => {\r\n              }),\r\n              actionLabel: actionLabel,\r\n              actionVariant: actionVariant,\r\n              actionDisabled: actionDisabled,\r\n              scrollable: scrollable,\r\n              onValueUpdate: handleValueSelect,\r\n              items: list,\r\n              multiSelect: props.multiSelect,\r\n              pinTopItem: pinTopItem,\r\n              maxHeight: maxHeight,\r\n              actionIcon: actionIcon,\r\n              actionLoading: actionLoading,\r\n            }}\r\n            ariaRolesType=\"input\"\r\n            focused={focused}\r\n            setFocused={setFocused}\r\n            size={size ?? Size.Small}\r\n            filter={''}\r\n            isOpen={isOpen}\r\n            setIsOpen={customSetIsOpen}\r\n            messageOnNoResults={messageOnNoResults ?? ''}\r\n            outline={keyboardNavigated}\r\n            isButton={isButton || false}\r\n            selectedValues={props.multiSelect ? props.value || [] : [props.value || '']}\r\n            setSelectedValues={handleValueSelect}\r\n            id={`${id}_dropdowncontent`}\r\n          />\r\n        )}\r\n      </DropdownContainer>\r\n      {activeValidationMessage && (\r\n        <ErrorMessage>\r\n          <SystemIcons.TechnicalWarning color={COLORS.getColor('critical_400', theme)}/>\r\n          <span>{activeValidationMessage}</span>\r\n        </ErrorMessage>\r\n      )}\r\n      {autofilledMessage && (\r\n        <AutofilledMessage>\r\n          <SystemIcons.Information color={COLORS.getColor('neutral_600', theme)}/>\r\n          <span>{autofilledMessage}</span>\r\n        </AutofilledMessage>\r\n      )}\r\n    </>\r\n  );\r\n});\r\n\r\nexport default BasicDropdown;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/Dropdown/CommonStyling.cjs

@@ -1,31 +1,318 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.DropdownInputFieldStyles = exports.DropdownInputField = exports.DropdownContentButtonStyling = exports.DropdownContainer = exports.DropdownButtonTextWrapper = exports.DropdownButtonTextStyles = exports.DropdownButtonTextIcon = exports.DropdownButtonTextContent = exports.DropdownButtonTextArrow = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 var _common = require("../common");
 var _styles = require("../styles");
 var _typography = require("../styles/typography");
 var _zIndexes = require("../styles/z-indexes");
 var _TooltipStyles = require("../Tooltips/TooltipStyles");
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const DropdownContainer = exports.DropdownContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: inline-block;\n\n  ", "\n  ", "\n  ", "\n  .show {\n    display: block;\n  }\n\n  .value {\n    flex-grow: 1;\n  }\n\n  &:focus-within {\n    z-index: ", ";\n  }\n\n  input:hover + div {\n    color: ", ";\n  }\n\n  input:active + div {\n    color: ", ";\n  }\n\n\n"])), props => !props.$isButton && (props !== null && props !== void 0 && props.minWidth ? "width: 100%; min-width: ".concat(props.minWidth, ";") : 'width: 100%; min-width: 344px;'), props => props.$readOnly || props.$disabled ? 'cursor: not-allowed;' : '', props => props.margin ? "margin: ".concat(props.margin, ";") : 'margin-bottom: 4px;', _zIndexes.Z_INDEXES.focus, props => _styles.COLORS.getColor('primary_600', props.theme), props => _styles.COLORS.getColor('primary_800', props.theme));
-const lockedState = (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  background-color: ", ";\n  box-shadow: inset 0px 0px 0px 1px ", ";\n  color: ", ";\n  pointer-events: none;\n  cursor: not-allowed;\n\n  input {\n    color: ", " !important;\n  }\n\n  .dropdown-arrow {\n    color: ", " !important;\n  }\n"])), props => _styles.COLORS.getColor('neutral_100', props.theme), props => _styles.COLORS.getColor('neutral_300', props.theme), props => _styles.COLORS.getColor('neutral_600', props.theme), props => _styles.COLORS.getColor('neutral_600', props.theme), props => _styles.COLORS.getColor('neutral_300', props.theme));
-const disabledState = (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  background-color: ", ";\n  box-shadow: inset 0px 0px 0px 1px ", ";\n  color: ", ";\n  pointer-events: none;\n  cursor: not-allowed;\n\n  .dropdown-arrow {\n    color: ", " !important;\n  }\n\n  input {\n    color: ", " !important;\n\n    ::placeholder {\n      color: ", " !important;\n    }\n  }\n"])), props => _styles.COLORS.getColor('white', props.theme), props => _styles.COLORS.getColor('neutral_100', props.theme), props => _styles.COLORS.getColor('neutral_300', props.theme), props => _styles.COLORS.getColor('neutral_300', props.theme), props => _styles.COLORS.getColor('neutral_300', props.theme), props => _styles.COLORS.getColor('neutral_300', props.theme));
-const activeValidationMessage = (0, _styledComponents.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  box-shadow: inset 0px 0px 0px 2px ", ";\n"])), props => _styles.COLORS.getColor('critical_400', props.theme));
-const placeholderStyling = (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n"])), props => (0, _typography.ComponentMStyling)(_styles.ComponentTextStyle.Italic, _styles.COLORS.getColor('neutral_600', props.theme)));
-const DropdownInputField = exports.DropdownInputField = _styledComponents.default.input(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  border: none;\n  outline: none;\n  background-color: inherit;\n  cursor: pointer;\n  min-width: 0px;\n  color: ", " !important;\n  padding: 0;\n  flex-grow: 1;\n  display: flex;\n  justify-content: center;\n  overflow: hidden;\n  ", "\n  \n  &::placeholder {\n    color: ", ";\n    font-style: italic;\n  }\n\n  &::-webkit-search-decoration,\n  &::-webkit-search-cancel-button,\n  &::-webkit-search-results-button,\n  &::-webkit-search-results-decoration {\n    -webkit-appearance: none;\n  }\n"])), props => _styles.COLORS.getColor('black', props.theme), props => props.$ellipsis ? 'text-overflow: ellipsis;' : '', props => _styles.COLORS.getColor('neutral_600', props.theme));
-const DropdownInputFieldStyles = exports.DropdownInputFieldStyles = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n\n  padding: 12px 16px;\n  height: 48px;\n  min-width: ", ";\n  width: 100%;\n\n  background: ", ";\n  box-shadow: inset 0px 0px 0px 1px ", ";\n  box-sizing: border-box;\n  border-radius: 4px;\n  cursor: pointer;\n\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  position: relative;\n\n  input {\n    font-size: inherit;\n    line-height: inherit;\n    color: inherit;\n  }\n\n  ", "\n\n  &::placeholder {\n    ", "\n  }\n\n  ", " {\n    ", "\n    padding: 16px;\n    height: 56px;\n\n    &::placeholder {\n      ", "\n    }\n  }\n\n  &.small {\n    ", "\n    padding: 12px 16px;\n    height: 48px;\n\n    &::placeholder {\n      ", "\n    }\n  }\n\n  &.medium {\n    ", "\n    height: 56px;\n    padding: 16px;\n\n    &::placeholder {\n      ", "\n    }\n  }\n\n  .dropdown-arrow {\n    pointer-events: none;\n    width: 24px;\n    height: 24px;\n    color: ", ";\n  }\n\n  &:focus {\n    outline: 3px solid #ddd;\n  }\n\n  &:focus-within,\n  &.focus-visible-within {\n    box-shadow: inset 0px 0px 0px 2px ", ";\n  }\n\n  &:hover:not(.action-within) {\n    box-shadow: inset 0px 0px 0px 1px ", ";\n\n    input {\n      ::placeholder {\n        color: ", ";\n      }\n    }\n\n    .dropdown-arrow {\n      color: ", ";\n    }\n\n    cursor: pointer;\n  }\n\n  &:active:not(.action-within) {\n    box-shadow: inset 0px 0px 0px 1px ", ";\n\n    input {\n      ::placeholder {\n        color: ", ";\n      }\n    }\n\n    .dropdown-arrow {\n      color: ", ";\n    }\n  }\n\n  &.button {\n    ", "\n\n    box-sizing: border-box;\n    height: 32px;\n    padding: 0 8px;\n    width: initial;\n    min-width: initial;\n    border: none !important;\n    box-shadow: none;\n    border-radius: 4px;\n\n    &.expanded {\n      color: ", ";\n      background: ", ";\n    }\n  }\n\n\n  ", "\n  ", "\n  ", "\n  ", "\n\n  ", ";\n\n  &.focus-visible,\n  &.focus-visible-within {\n    z-index: ", " !important;\n    ", "\n  }\n"])), (0, _typography.ComponentSStyling)(_styles.ComponentTextStyle.Regular, 'inherit'), props => props.$minWidth ? "".concat(props.$minWidth) : '344px', props => _styles.COLORS.getColor('white', props.theme), props => _styles.COLORS.getColor('neutral_400', props.theme), (0, _TooltipStyles.TooltipTrigger)('hover'), props => (0, _typography.ComponentXXSStyling)(_styles.ComponentTextStyle.Italic, _styles.COLORS.getColor('neutral_600', props.theme)), _styles.BREAKPOINTS.MEDIUM, (0, _typography.ComponentMStyling)(_styles.ComponentTextStyle.Regular, 'inherit'), props => (0, _typography.ComponentXSStyling)(_styles.ComponentTextStyle.Italic, _styles.COLORS.getColor('neutral_600', props.theme)), (0, _typography.ComponentSStyling)(_styles.ComponentTextStyle.Regular, 'inherit'), props => (0, _typography.ComponentXXSStyling)(_styles.ComponentTextStyle.Italic, _styles.COLORS.getColor('neutral_600', props.theme)), (0, _typography.ComponentMStyling)(_styles.ComponentTextStyle.Regular, 'inherit'), props => (0, _typography.ComponentXSStyling)(_styles.ComponentTextStyle.Italic, _styles.COLORS.getColor('neutral_600', props.theme)), props => props.$isPlaceholder ? _styles.COLORS.getColor('neutral_600', props.theme) : undefined, props => _styles.COLORS.getColor('primary_800', props.theme), props => _styles.COLORS.getColor('primary_200', props.theme), props => _styles.COLORS.getColor('primary_600', props.theme), props => _styles.COLORS.getColor('primary_600', props.theme), props => _styles.COLORS.getColor('primary_300', props.theme), props => _styles.COLORS.getColor('primary_800', props.theme), props => _styles.COLORS.getColor('primary_800', props.theme), props => (0, _typography.ComponentSStyling)(_styles.ComponentTextStyle.Bold, props.$disabled ? _styles.COLORS.getColor('neutral_300', props.theme) : _styles.COLORS.getColor('neutral_600', props.theme)), props => _styles.COLORS.getColor('neutral_800', props.theme), props => _styles.COLORS.getColor('neutral_20', props.theme), props => props.$disabled ? disabledState : '', props => props.$readOnly ? lockedState : '', props => props.$showValidationMessage ? activeValidationMessage : '', props => props.$isPlaceholder ? placeholderStyling : '', _common.CommonInteractionStyling, _zIndexes.Z_INDEXES.dropdown + 1, _styles.focusStyles);
-const DropdownContentButtonStyling = exports.DropdownContentButtonStyling = (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n  min-width: 344px;\n"])));
-const DropdownButtonTextContent = exports.DropdownButtonTextContent = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  gap: 4px;\n  align-items: center;\n  box-sizing: border-box;\n  min-width: 64px;\n  min-height: 32px;\n  padding: 4px 8px;\n  border-radius: 4px;\n"])));
-const DropdownButtonTextIcon = exports.DropdownButtonTextIcon = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n  width: 24px;\n  height: 24px;\n"])));
-const DropdownButtonTextArrow = exports.DropdownButtonTextArrow = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n  width: 24px;\n  height: 24px;\n\n  svg {\n    pointer-events: none;\n  }\n"])));
-const DropdownButtonTextStyles = exports.DropdownButtonTextStyles = _styledComponents.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n  flex: 1\n"])));
-const DropdownButtonTextWrapper = exports.DropdownButtonTextWrapper = _styledComponents.default.div(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n  box-sizing: border-box;\n  min-height: 48px;\n  display: flex;\n  align-items: center;\n  width: fit-content;\n  cursor: pointer;\n\n  ", "\n\n  .expanded {\n    color: ", ";\n\n    ", " {\n      background: ", ";\n    }\n  }\n\n  &:focus {\n    ", "\n  }\n\n  &:hover:not(.disabled) {\n    ", " {\n      background-color: ", ";\n      color: ", ";\n    }\n  }\n\n  &:active:not(.disabled) {\n    ", " {\n      background-color: ", ";\n      color: ", ";\n    }\n  }\n\n  &.disabled {\n    cursor: not-allowed;\n    color: ", ";\n  }\n\n}"])), props => (0, _typography.ComponentSStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.getColor('neutral_600', props.theme)), props => _styles.COLORS.getColor('neutral_800', props.theme), DropdownButtonTextContent, props => _styles.COLORS.getColor('neutral_20', props.theme), _styles.focusStyles, DropdownButtonTextContent, props => _styles.COLORS.getColor('primary_20', props.theme), props => _styles.COLORS.getColor('primary_700', props.theme), DropdownButtonTextContent, props => _styles.COLORS.getColor('primary_100', props.theme), props => _styles.COLORS.getColor('primary_800', props.theme), props => _styles.COLORS.getColor('neutral_300', props.theme));
+const DropdownContainer = exports.DropdownContainer = _styledComponents.default.div`
+  display: inline-block;
+
+  ${props => !props.$isButton && (props?.minWidth ? `width: 100%; min-width: ${props.minWidth};` : 'width: 100%; min-width: 344px;')}
+  ${props => props.$readOnly || props.$disabled ? 'cursor: not-allowed;' : ''}
+  ${props => props.margin ? `margin: ${props.margin};` : 'margin-bottom: 4px;'}
+  .show {
+    display: block;
+  }
+
+  .value {
+    flex-grow: 1;
+  }
+
+  &:focus-within {
+    z-index: ${_zIndexes.Z_INDEXES.focus};
+  }
+
+  input:hover + div {
+    color: ${props => _styles.COLORS.getColor('primary_600', props.theme)};
+  }
+
+  input:active + div {
+    color: ${props => _styles.COLORS.getColor('primary_800', props.theme)};
+  }
+
+
+`;
+const lockedState = (0, _styledComponents.css)`
+  background-color: ${props => _styles.COLORS.getColor('neutral_100', props.theme)};
+  box-shadow: inset 0px 0px 0px 1px ${props => _styles.COLORS.getColor('neutral_300', props.theme)};
+  color: ${props => _styles.COLORS.getColor('neutral_600', props.theme)};
+  pointer-events: none;
+  cursor: not-allowed;
+
+  input {
+    color: ${props => _styles.COLORS.getColor('neutral_600', props.theme)} !important;
+  }
+
+  .dropdown-arrow {
+    color: ${props => _styles.COLORS.getColor('neutral_300', props.theme)} !important;
+  }
+`;
+const disabledState = (0, _styledComponents.css)`
+  background-color: ${props => _styles.COLORS.getColor('white', props.theme)};
+  box-shadow: inset 0px 0px 0px 1px ${props => _styles.COLORS.getColor('neutral_100', props.theme)};
+  color: ${props => _styles.COLORS.getColor('neutral_300', props.theme)};
+  pointer-events: none;
+  cursor: not-allowed;
+
+  .dropdown-arrow {
+    color: ${props => _styles.COLORS.getColor('neutral_300', props.theme)} !important;
+  }
+
+  input {
+    color: ${props => _styles.COLORS.getColor('neutral_300', props.theme)} !important;
+
+    ::placeholder {
+      color: ${props => _styles.COLORS.getColor('neutral_300', props.theme)} !important;
+    }
+  }
+`;
+const activeValidationMessage = (0, _styledComponents.css)`
+  box-shadow: inset 0px 0px 0px 2px ${props => _styles.COLORS.getColor('critical_400', props.theme)};
+`;
+const placeholderStyling = (0, _styledComponents.css)`
+  ${props => (0, _typography.ComponentMStyling)(_styles.ComponentTextStyle.Italic, _styles.COLORS.getColor('neutral_600', props.theme))}
+`;
+const DropdownInputField = exports.DropdownInputField = _styledComponents.default.input`
+  border: none;
+  outline: none;
+  background-color: inherit;
+  cursor: pointer;
+  min-width: 0px;
+  color: ${props => _styles.COLORS.getColor('black', props.theme)} !important;
+  padding: 0;
+  flex-grow: 1;
+  display: flex;
+  justify-content: center;
+  overflow: hidden;
+  ${props => props.$ellipsis ? 'text-overflow: ellipsis;' : ''}
+  
+  &::placeholder {
+    color: ${props => _styles.COLORS.getColor('neutral_600', props.theme)};
+    font-style: italic;
+  }
+
+  &::-webkit-search-decoration,
+  &::-webkit-search-cancel-button,
+  &::-webkit-search-results-button,
+  &::-webkit-search-results-decoration {
+    -webkit-appearance: none;
+  }
+`;
+const DropdownInputFieldStyles = exports.DropdownInputFieldStyles = _styledComponents.default.div`
+  ${(0, _typography.ComponentSStyling)(_styles.ComponentTextStyle.Regular, 'inherit')}
+
+  padding: 12px 16px;
+  height: 48px;
+  min-width: ${props => props.$minWidth ? `${props.$minWidth}` : '344px'};
+  width: 100%;
+
+  background: ${props => _styles.COLORS.getColor('white', props.theme)};
+  box-shadow: inset 0px 0px 0px 1px ${props => _styles.COLORS.getColor('neutral_400', props.theme)};
+  box-sizing: border-box;
+  border-radius: 4px;
+  cursor: pointer;
+
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  position: relative;
+
+  input {
+    font-size: inherit;
+    line-height: inherit;
+    color: inherit;
+  }
+
+  ${(0, _TooltipStyles.TooltipTrigger)('hover')}
+
+  &::placeholder {
+    ${props => (0, _typography.ComponentXXSStyling)(_styles.ComponentTextStyle.Italic, _styles.COLORS.getColor('neutral_600', props.theme))}
+  }
+
+  ${_styles.BREAKPOINTS.MEDIUM} {
+    ${(0, _typography.ComponentMStyling)(_styles.ComponentTextStyle.Regular, 'inherit')}
+    padding: 16px;
+    height: 56px;
+
+    &::placeholder {
+      ${props => (0, _typography.ComponentXSStyling)(_styles.ComponentTextStyle.Italic, _styles.COLORS.getColor('neutral_600', props.theme))}
+    }
+  }
+
+  &.small {
+    ${(0, _typography.ComponentSStyling)(_styles.ComponentTextStyle.Regular, 'inherit')}
+    padding: 12px 16px;
+    height: 48px;
+
+    &::placeholder {
+      ${props => (0, _typography.ComponentXXSStyling)(_styles.ComponentTextStyle.Italic, _styles.COLORS.getColor('neutral_600', props.theme))}
+    }
+  }
+
+  &.medium {
+    ${(0, _typography.ComponentMStyling)(_styles.ComponentTextStyle.Regular, 'inherit')}
+    height: 56px;
+    padding: 16px;
+
+    &::placeholder {
+      ${props => (0, _typography.ComponentXSStyling)(_styles.ComponentTextStyle.Italic, _styles.COLORS.getColor('neutral_600', props.theme))}
+    }
+  }
+
+  .dropdown-arrow {
+    pointer-events: none;
+    width: 24px;
+    height: 24px;
+    color: ${props => props.$isPlaceholder ? _styles.COLORS.getColor('neutral_600', props.theme) : undefined};
+  }
+
+  &:focus {
+    outline: 3px solid #ddd;
+  }
+
+  &:focus-within,
+  &.focus-visible-within {
+    box-shadow: inset 0px 0px 0px 2px ${props => _styles.COLORS.getColor('primary_800', props.theme)};
+  }
+
+  &:hover:not(.action-within) {
+    box-shadow: inset 0px 0px 0px 1px ${props => _styles.COLORS.getColor('primary_200', props.theme)};
+
+    input {
+      ::placeholder {
+        color: ${props => _styles.COLORS.getColor('primary_600', props.theme)};
+      }
+    }
+
+    .dropdown-arrow {
+      color: ${props => _styles.COLORS.getColor('primary_600', props.theme)};
+    }
+
+    cursor: pointer;
+  }
+
+  &:active:not(.action-within) {
+    box-shadow: inset 0px 0px 0px 1px ${props => _styles.COLORS.getColor('primary_300', props.theme)};
+
+    input {
+      ::placeholder {
+        color: ${props => _styles.COLORS.getColor('primary_800', props.theme)};
+      }
+    }
+
+    .dropdown-arrow {
+      color: ${props => _styles.COLORS.getColor('primary_800', props.theme)};
+    }
+  }
+
+  &.button {
+    ${props => (0, _typography.ComponentSStyling)(_styles.ComponentTextStyle.Bold, props.$disabled ? _styles.COLORS.getColor('neutral_300', props.theme) : _styles.COLORS.getColor('neutral_600', props.theme))}
+
+    box-sizing: border-box;
+    height: 32px;
+    padding: 0 8px;
+    width: initial;
+    min-width: initial;
+    border: none !important;
+    box-shadow: none;
+    border-radius: 4px;
+
+    &.expanded {
+      color: ${props => _styles.COLORS.getColor('neutral_800', props.theme)};
+      background: ${props => _styles.COLORS.getColor('neutral_20', props.theme)};
+    }
+  }
+
+
+  ${props => props.$disabled ? disabledState : ''}
+  ${props => props.$readOnly ? lockedState : ''}
+  ${props => props.$showValidationMessage ? activeValidationMessage : ''}
+  ${props => props.$isPlaceholder ? placeholderStyling : ''}
+
+  ${_common.CommonInteractionStyling};
+
+  &.focus-visible,
+  &.focus-visible-within {
+    z-index: ${_zIndexes.Z_INDEXES.dropdown + 1} !important;
+    ${_styles.focusStyles}
+  }
+`;
+const DropdownContentButtonStyling = exports.DropdownContentButtonStyling = (0, _styledComponents.css)`
+  min-width: 344px;
+`;
+const DropdownButtonTextContent = exports.DropdownButtonTextContent = _styledComponents.default.div`
+  display: flex;
+  gap: 4px;
+  align-items: center;
+  box-sizing: border-box;
+  min-width: 64px;
+  min-height: 32px;
+  padding: 4px 8px;
+  border-radius: 4px;
+`;
+const DropdownButtonTextIcon = exports.DropdownButtonTextIcon = _styledComponents.default.div`
+  width: 24px;
+  height: 24px;
+`;
+const DropdownButtonTextArrow = exports.DropdownButtonTextArrow = _styledComponents.default.div`
+  width: 24px;
+  height: 24px;
+
+  svg {
+    pointer-events: none;
+  }
+`;
+const DropdownButtonTextStyles = exports.DropdownButtonTextStyles = _styledComponents.default.div`
+  flex: 1
+`;
+const DropdownButtonTextWrapper = exports.DropdownButtonTextWrapper = _styledComponents.default.div`
+  box-sizing: border-box;
+  min-height: 48px;
+  display: flex;
+  align-items: center;
+  width: fit-content;
+  cursor: pointer;
+
+  ${props => (0, _typography.ComponentSStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.getColor('neutral_600', props.theme))}
+
+  .expanded {
+    color: ${props => _styles.COLORS.getColor('neutral_800', props.theme)};
+
+    ${DropdownButtonTextContent} {
+      background: ${props => _styles.COLORS.getColor('neutral_20', props.theme)};
+    }
+  }
+
+  &:focus {
+    ${_styles.focusStyles}
+  }
+
+  &:hover:not(.disabled) {
+    ${DropdownButtonTextContent} {
+      background-color: ${props => _styles.COLORS.getColor('primary_20', props.theme)};
+      color: ${props => _styles.COLORS.getColor('primary_700', props.theme)};
+    }
+  }
+
+  &:active:not(.disabled) {
+    ${DropdownButtonTextContent} {
+      background-color: ${props => _styles.COLORS.getColor('primary_100', props.theme)};
+      color: ${props => _styles.COLORS.getColor('primary_800', props.theme)};
+    }
+  }
+
+  &.disabled {
+    cursor: not-allowed;
+    color: ${props => _styles.COLORS.getColor('neutral_300', props.theme)};
+  }
+
+}`;
 //# sourceMappingURL=CommonStyling.cjs.map

package/dist/Dropdown/CommonStyling.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"CommonStyling.cjs","names":["_styledComponents","_interopRequireWildcard","require","_common","_styles","_typography","_zIndexes","_TooltipStyles","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","_templateObject9","_templateObject10","_templateObject11","_templateObject12","_templateObject13","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","DropdownContainer","exports","styled","div","_taggedTemplateLiteral2","props","$isButton","minWidth","concat","$readOnly","$disabled","margin","Z_INDEXES","focus","COLORS","getColor","theme","lockedState","css","disabledState","activeValidationMessage","placeholderStyling","ComponentMStyling","ComponentTextStyle","Italic","DropdownInputField","input","$ellipsis","DropdownInputFieldStyles","ComponentSStyling","Regular","$minWidth","TooltipTrigger","ComponentXXSStyling","BREAKPOINTS","MEDIUM","ComponentXSStyling","$isPlaceholder","undefined","Bold","$showValidationMessage","CommonInteractionStyling","dropdown","focusStyles","DropdownContentButtonStyling","DropdownButtonTextContent","DropdownButtonTextIcon","DropdownButtonTextArrow","DropdownButtonTextStyles","DropdownButtonTextWrapper"],"sources":["../../src/Dropdown/CommonStyling.tsx"],"sourcesContent":["import styled, {css} from 'styled-components';\r\nimport {CommonInteractionStyling} from '../common';\r\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\r\nimport {\r\n  ComponentMStyling,\r\n  ComponentSStyling,\r\n  ComponentXSStyling,\r\n  ComponentXXSStyling\r\n} from '../styles/typography';\r\nimport {Z_INDEXES} from '../styles/z-indexes';\r\nimport { TooltipTrigger } from '../Tooltips/TooltipStyles';\r\n\r\nexport const DropdownContainer = styled.div<{ $isButton: boolean; $readOnly?: boolean; $disabled?: boolean; margin?: string; minWidth?: string }>`\r\n  display: inline-block;\r\n\r\n  ${(props) => !props.$isButton && (props?.minWidth ? `width: 100%; min-width: ${props.minWidth};` : 'width: 100%; min-width: 344px;')}\r\n  ${(props) => (props.$readOnly || props.$disabled ? 'cursor: not-allowed;' : '')}\r\n  ${(props) => (props.margin ? `margin: ${props.margin};` : 'margin-bottom: 4px;')}\r\n  .show {\r\n    display: block;\r\n  }\r\n\r\n  .value {\r\n    flex-grow: 1;\r\n  }\r\n\r\n  &:focus-within {\r\n    z-index: ${Z_INDEXES.focus};\r\n  }\r\n\r\n  input:hover + div {\r\n    color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n  }\r\n\r\n  input:active + div {\r\n    color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n  }\r\n\r\n\r\n`;\r\n\r\nconst lockedState = css`\r\n  background-color: ${props => COLORS.getColor('neutral_100', props.theme)};\r\n  box-shadow: inset 0px 0px 0px 1px ${props => COLORS.getColor('neutral_300', props.theme)};\r\n  color: ${props => COLORS.getColor('neutral_600', props.theme)};\r\n  pointer-events: none;\r\n  cursor: not-allowed;\r\n\r\n  input {\r\n    color: ${props => COLORS.getColor('neutral_600', props.theme)} !important;\r\n  }\r\n\r\n  .dropdown-arrow {\r\n    color: ${props => COLORS.getColor('neutral_300', props.theme)} !important;\r\n  }\r\n`;\r\n\r\nconst disabledState = css`\r\n  background-color: ${props => COLORS.getColor('white', props.theme)};\r\n  box-shadow: inset 0px 0px 0px 1px ${props => COLORS.getColor('neutral_100', props.theme)};\r\n  color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n  pointer-events: none;\r\n  cursor: not-allowed;\r\n\r\n  .dropdown-arrow {\r\n    color: ${props => COLORS.getColor('neutral_300', props.theme)} !important;\r\n  }\r\n\r\n  input {\r\n    color: ${props => COLORS.getColor('neutral_300', props.theme)} !important;\r\n\r\n    ::placeholder {\r\n      color: ${props => COLORS.getColor('neutral_300', props.theme)} !important;\r\n    }\r\n  }\r\n`;\r\n\r\nconst activeValidationMessage = css`\r\n  box-shadow: inset 0px 0px 0px 2px ${props => COLORS.getColor('critical_400', props.theme)};\r\n`;\r\n\r\nconst placeholderStyling = css`\r\n  ${props => ComponentMStyling(ComponentTextStyle.Italic, COLORS.getColor('neutral_600', props.theme))}\r\n`;\r\n\r\nexport const DropdownInputField = styled.input<{$ellipsis?: boolean}>`\r\n  border: none;\r\n  outline: none;\r\n  background-color: inherit;\r\n  cursor: pointer;\r\n  min-width: 0px;\r\n  color: ${props => COLORS.getColor('black', props.theme)} !important;\r\n  padding: 0;\r\n  flex-grow: 1;\r\n  display: flex;\r\n  justify-content: center;\r\n  overflow: hidden;\r\n  ${props => props.$ellipsis ? 'text-overflow: ellipsis;' : ''}\r\n  \r\n  &::placeholder {\r\n    color: ${props => COLORS.getColor('neutral_600', props.theme)};\r\n    font-style: italic;\r\n  }\r\n\r\n  &::-webkit-search-decoration,\r\n  &::-webkit-search-cancel-button,\r\n  &::-webkit-search-results-button,\r\n  &::-webkit-search-results-decoration {\r\n    -webkit-appearance: none;\r\n  }\r\n`;\r\n\r\nexport const DropdownInputFieldStyles = styled.div<{ $disabled: boolean; $readOnly: boolean; $showValidationMessage?: boolean; $isPlaceholder?: boolean; $minWidth?: string }>`\r\n  ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\r\n\r\n  padding: 12px 16px;\r\n  height: 48px;\r\n  min-width: ${(props) => (props.$minWidth ? `${props.$minWidth}` : '344px')};\r\n  width: 100%;\r\n\r\n  background: ${props => COLORS.getColor('white', props.theme)};\r\n  box-shadow: inset 0px 0px 0px 1px ${props => COLORS.getColor('neutral_400', props.theme)};\r\n  box-sizing: border-box;\r\n  border-radius: 4px;\r\n  cursor: pointer;\r\n\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 4px;\r\n  position: relative;\r\n\r\n  input {\r\n    font-size: inherit;\r\n    line-height: inherit;\r\n    color: inherit;\r\n  }\r\n\r\n  ${TooltipTrigger('hover')}\r\n\r\n  &::placeholder {\r\n    ${props => ComponentXXSStyling(ComponentTextStyle.Italic, COLORS.getColor('neutral_600', props.theme))}\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, 'inherit')}\r\n    padding: 16px;\r\n    height: 56px;\r\n\r\n    &::placeholder {\r\n      ${props => ComponentXSStyling(ComponentTextStyle.Italic, COLORS.getColor('neutral_600', props.theme))}\r\n    }\r\n  }\r\n\r\n  &.small {\r\n    ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\r\n    padding: 12px 16px;\r\n    height: 48px;\r\n\r\n    &::placeholder {\r\n      ${props => ComponentXXSStyling(ComponentTextStyle.Italic, COLORS.getColor('neutral_600', props.theme))}\r\n    }\r\n  }\r\n\r\n  &.medium {\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, 'inherit')}\r\n    height: 56px;\r\n    padding: 16px;\r\n\r\n    &::placeholder {\r\n      ${props => ComponentXSStyling(ComponentTextStyle.Italic, COLORS.getColor('neutral_600', props.theme))}\r\n    }\r\n  }\r\n\r\n  .dropdown-arrow {\r\n    pointer-events: none;\r\n    width: 24px;\r\n    height: 24px;\r\n    color: ${(props) => props.$isPlaceholder ? COLORS.getColor('neutral_600', props.theme) : undefined};\r\n  }\r\n\r\n  &:focus {\r\n    outline: 3px solid #ddd;\r\n  }\r\n\r\n  &:focus-within,\r\n  &.focus-visible-within {\r\n    box-shadow: inset 0px 0px 0px 2px ${props => COLORS.getColor('primary_800', props.theme)};\r\n  }\r\n\r\n  &:hover:not(.action-within) {\r\n    box-shadow: inset 0px 0px 0px 1px ${props => COLORS.getColor('primary_200', props.theme)};\r\n\r\n    input {\r\n      ::placeholder {\r\n        color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n      }\r\n    }\r\n\r\n    .dropdown-arrow {\r\n      color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n    }\r\n\r\n    cursor: pointer;\r\n  }\r\n\r\n  &:active:not(.action-within) {\r\n    box-shadow: inset 0px 0px 0px 1px ${props => COLORS.getColor('primary_300', props.theme)};\r\n\r\n    input {\r\n      ::placeholder {\r\n        color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n      }\r\n    }\r\n\r\n    .dropdown-arrow {\r\n      color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    }\r\n  }\r\n\r\n  &.button {\r\n    ${(props) => ComponentSStyling(ComponentTextStyle.Bold, props.$disabled ? COLORS.getColor('neutral_300', props.theme) : COLORS.getColor('neutral_600', props.theme))}\r\n\r\n    box-sizing: border-box;\r\n    height: 32px;\r\n    padding: 0 8px;\r\n    width: initial;\r\n    min-width: initial;\r\n    border: none !important;\r\n    box-shadow: none;\r\n    border-radius: 4px;\r\n\r\n    &.expanded {\r\n      color: ${props => COLORS.getColor('neutral_800', props.theme)};\r\n      background: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n    }\r\n  }\r\n\r\n\r\n  ${(props) => (props.$disabled ? disabledState : '')}\r\n  ${(props) => (props.$readOnly ? lockedState : '')}\r\n  ${(props) => (props.$showValidationMessage ? activeValidationMessage : '')}\r\n  ${(props) => (props.$isPlaceholder ? placeholderStyling : '')}\r\n\r\n  ${CommonInteractionStyling};\r\n\r\n  &.focus-visible,\r\n  &.focus-visible-within {\r\n    z-index: ${Z_INDEXES.dropdown + 1} !important;\r\n    ${focusStyles}\r\n  }\r\n`;\r\n\r\nexport const DropdownContentButtonStyling = css`\r\n  min-width: 344px;\r\n`;\r\n\r\n\r\n\r\nexport const DropdownButtonTextContent = styled.div`\r\n  display: flex;\r\n  gap: 4px;\r\n  align-items: center;\r\n  box-sizing: border-box;\r\n  min-width: 64px;\r\n  min-height: 32px;\r\n  padding: 4px 8px;\r\n  border-radius: 4px;\r\n`;\r\n\r\nexport const DropdownButtonTextIcon = styled.div`\r\n  width: 24px;\r\n  height: 24px;\r\n`;\r\n\r\nexport const DropdownButtonTextArrow = styled.div`\r\n  width: 24px;\r\n  height: 24px;\r\n\r\n  svg {\r\n    pointer-events: none;\r\n  }\r\n`;\r\n\r\nexport const DropdownButtonTextStyles = styled.div`\r\n  flex: 1\r\n`;\r\n\r\nexport const DropdownButtonTextWrapper = styled.div`\r\n  box-sizing: border-box;\r\n  min-height: 48px;\r\n  display: flex;\r\n  align-items: center;\r\n  width: fit-content;\r\n  cursor: pointer;\r\n\r\n  ${props => ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n\r\n  .expanded {\r\n    color: ${props => COLORS.getColor('neutral_800', props.theme)};\r\n\r\n    ${DropdownButtonTextContent} {\r\n      background: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n    }\r\n  }\r\n\r\n  &:focus {\r\n    ${focusStyles}\r\n  }\r\n\r\n  &:hover:not(.disabled) {\r\n    ${DropdownButtonTextContent} {\r\n      background-color: ${props => COLORS.getColor('primary_20', props.theme)};\r\n      color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n    }\r\n  }\r\n\r\n  &:active:not(.disabled) {\r\n    ${DropdownButtonTextContent} {\r\n      background-color: ${props => COLORS.getColor('primary_100', props.theme)};\r\n      color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    }\r\n  }\r\n\r\n  &.disabled {\r\n    cursor: not-allowed;\r\n    color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n  }\r\n\r\n}`;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"CommonStyling.cjs","names":["_styledComponents","_interopRequireWildcard","require","_common","_styles","_typography","_zIndexes","_TooltipStyles","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","DropdownContainer","exports","styled","div","props","$isButton","minWidth","$readOnly","$disabled","margin","Z_INDEXES","focus","COLORS","getColor","theme","lockedState","css","disabledState","activeValidationMessage","placeholderStyling","ComponentMStyling","ComponentTextStyle","Italic","DropdownInputField","input","$ellipsis","DropdownInputFieldStyles","ComponentSStyling","Regular","$minWidth","TooltipTrigger","ComponentXXSStyling","BREAKPOINTS","MEDIUM","ComponentXSStyling","$isPlaceholder","undefined","Bold","$showValidationMessage","CommonInteractionStyling","dropdown","focusStyles","DropdownContentButtonStyling","DropdownButtonTextContent","DropdownButtonTextIcon","DropdownButtonTextArrow","DropdownButtonTextStyles","DropdownButtonTextWrapper"],"sources":["../../src/Dropdown/CommonStyling.tsx"],"sourcesContent":["import styled, {css} from 'styled-components';\r\nimport {CommonInteractionStyling} from '../common';\r\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\r\nimport {\r\n  ComponentMStyling,\r\n  ComponentSStyling,\r\n  ComponentXSStyling,\r\n  ComponentXXSStyling\r\n} from '../styles/typography';\r\nimport {Z_INDEXES} from '../styles/z-indexes';\r\nimport { TooltipTrigger } from '../Tooltips/TooltipStyles';\r\n\r\nexport const DropdownContainer = styled.div<{ $isButton: boolean; $readOnly?: boolean; $disabled?: boolean; margin?: string; minWidth?: string }>`\r\n  display: inline-block;\r\n\r\n  ${(props) => !props.$isButton && (props?.minWidth ? `width: 100%; min-width: ${props.minWidth};` : 'width: 100%; min-width: 344px;')}\r\n  ${(props) => (props.$readOnly || props.$disabled ? 'cursor: not-allowed;' : '')}\r\n  ${(props) => (props.margin ? `margin: ${props.margin};` : 'margin-bottom: 4px;')}\r\n  .show {\r\n    display: block;\r\n  }\r\n\r\n  .value {\r\n    flex-grow: 1;\r\n  }\r\n\r\n  &:focus-within {\r\n    z-index: ${Z_INDEXES.focus};\r\n  }\r\n\r\n  input:hover + div {\r\n    color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n  }\r\n\r\n  input:active + div {\r\n    color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n  }\r\n\r\n\r\n`;\r\n\r\nconst lockedState = css`\r\n  background-color: ${props => COLORS.getColor('neutral_100', props.theme)};\r\n  box-shadow: inset 0px 0px 0px 1px ${props => COLORS.getColor('neutral_300', props.theme)};\r\n  color: ${props => COLORS.getColor('neutral_600', props.theme)};\r\n  pointer-events: none;\r\n  cursor: not-allowed;\r\n\r\n  input {\r\n    color: ${props => COLORS.getColor('neutral_600', props.theme)} !important;\r\n  }\r\n\r\n  .dropdown-arrow {\r\n    color: ${props => COLORS.getColor('neutral_300', props.theme)} !important;\r\n  }\r\n`;\r\n\r\nconst disabledState = css`\r\n  background-color: ${props => COLORS.getColor('white', props.theme)};\r\n  box-shadow: inset 0px 0px 0px 1px ${props => COLORS.getColor('neutral_100', props.theme)};\r\n  color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n  pointer-events: none;\r\n  cursor: not-allowed;\r\n\r\n  .dropdown-arrow {\r\n    color: ${props => COLORS.getColor('neutral_300', props.theme)} !important;\r\n  }\r\n\r\n  input {\r\n    color: ${props => COLORS.getColor('neutral_300', props.theme)} !important;\r\n\r\n    ::placeholder {\r\n      color: ${props => COLORS.getColor('neutral_300', props.theme)} !important;\r\n    }\r\n  }\r\n`;\r\n\r\nconst activeValidationMessage = css`\r\n  box-shadow: inset 0px 0px 0px 2px ${props => COLORS.getColor('critical_400', props.theme)};\r\n`;\r\n\r\nconst placeholderStyling = css`\r\n  ${props => ComponentMStyling(ComponentTextStyle.Italic, COLORS.getColor('neutral_600', props.theme))}\r\n`;\r\n\r\nexport const DropdownInputField = styled.input<{$ellipsis?: boolean}>`\r\n  border: none;\r\n  outline: none;\r\n  background-color: inherit;\r\n  cursor: pointer;\r\n  min-width: 0px;\r\n  color: ${props => COLORS.getColor('black', props.theme)} !important;\r\n  padding: 0;\r\n  flex-grow: 1;\r\n  display: flex;\r\n  justify-content: center;\r\n  overflow: hidden;\r\n  ${props => props.$ellipsis ? 'text-overflow: ellipsis;' : ''}\r\n  \r\n  &::placeholder {\r\n    color: ${props => COLORS.getColor('neutral_600', props.theme)};\r\n    font-style: italic;\r\n  }\r\n\r\n  &::-webkit-search-decoration,\r\n  &::-webkit-search-cancel-button,\r\n  &::-webkit-search-results-button,\r\n  &::-webkit-search-results-decoration {\r\n    -webkit-appearance: none;\r\n  }\r\n`;\r\n\r\nexport const DropdownInputFieldStyles = styled.div<{ $disabled: boolean; $readOnly: boolean; $showValidationMessage?: boolean; $isPlaceholder?: boolean; $minWidth?: string }>`\r\n  ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\r\n\r\n  padding: 12px 16px;\r\n  height: 48px;\r\n  min-width: ${(props) => (props.$minWidth ? `${props.$minWidth}` : '344px')};\r\n  width: 100%;\r\n\r\n  background: ${props => COLORS.getColor('white', props.theme)};\r\n  box-shadow: inset 0px 0px 0px 1px ${props => COLORS.getColor('neutral_400', props.theme)};\r\n  box-sizing: border-box;\r\n  border-radius: 4px;\r\n  cursor: pointer;\r\n\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 4px;\r\n  position: relative;\r\n\r\n  input {\r\n    font-size: inherit;\r\n    line-height: inherit;\r\n    color: inherit;\r\n  }\r\n\r\n  ${TooltipTrigger('hover')}\r\n\r\n  &::placeholder {\r\n    ${props => ComponentXXSStyling(ComponentTextStyle.Italic, COLORS.getColor('neutral_600', props.theme))}\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, 'inherit')}\r\n    padding: 16px;\r\n    height: 56px;\r\n\r\n    &::placeholder {\r\n      ${props => ComponentXSStyling(ComponentTextStyle.Italic, COLORS.getColor('neutral_600', props.theme))}\r\n    }\r\n  }\r\n\r\n  &.small {\r\n    ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\r\n    padding: 12px 16px;\r\n    height: 48px;\r\n\r\n    &::placeholder {\r\n      ${props => ComponentXXSStyling(ComponentTextStyle.Italic, COLORS.getColor('neutral_600', props.theme))}\r\n    }\r\n  }\r\n\r\n  &.medium {\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, 'inherit')}\r\n    height: 56px;\r\n    padding: 16px;\r\n\r\n    &::placeholder {\r\n      ${props => ComponentXSStyling(ComponentTextStyle.Italic, COLORS.getColor('neutral_600', props.theme))}\r\n    }\r\n  }\r\n\r\n  .dropdown-arrow {\r\n    pointer-events: none;\r\n    width: 24px;\r\n    height: 24px;\r\n    color: ${(props) => props.$isPlaceholder ? COLORS.getColor('neutral_600', props.theme) : undefined};\r\n  }\r\n\r\n  &:focus {\r\n    outline: 3px solid #ddd;\r\n  }\r\n\r\n  &:focus-within,\r\n  &.focus-visible-within {\r\n    box-shadow: inset 0px 0px 0px 2px ${props => COLORS.getColor('primary_800', props.theme)};\r\n  }\r\n\r\n  &:hover:not(.action-within) {\r\n    box-shadow: inset 0px 0px 0px 1px ${props => COLORS.getColor('primary_200', props.theme)};\r\n\r\n    input {\r\n      ::placeholder {\r\n        color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n      }\r\n    }\r\n\r\n    .dropdown-arrow {\r\n      color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n    }\r\n\r\n    cursor: pointer;\r\n  }\r\n\r\n  &:active:not(.action-within) {\r\n    box-shadow: inset 0px 0px 0px 1px ${props => COLORS.getColor('primary_300', props.theme)};\r\n\r\n    input {\r\n      ::placeholder {\r\n        color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n      }\r\n    }\r\n\r\n    .dropdown-arrow {\r\n      color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    }\r\n  }\r\n\r\n  &.button {\r\n    ${(props) => ComponentSStyling(ComponentTextStyle.Bold, props.$disabled ? COLORS.getColor('neutral_300', props.theme) : COLORS.getColor('neutral_600', props.theme))}\r\n\r\n    box-sizing: border-box;\r\n    height: 32px;\r\n    padding: 0 8px;\r\n    width: initial;\r\n    min-width: initial;\r\n    border: none !important;\r\n    box-shadow: none;\r\n    border-radius: 4px;\r\n\r\n    &.expanded {\r\n      color: ${props => COLORS.getColor('neutral_800', props.theme)};\r\n      background: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n    }\r\n  }\r\n\r\n\r\n  ${(props) => (props.$disabled ? disabledState : '')}\r\n  ${(props) => (props.$readOnly ? lockedState : '')}\r\n  ${(props) => (props.$showValidationMessage ? activeValidationMessage : '')}\r\n  ${(props) => (props.$isPlaceholder ? placeholderStyling : '')}\r\n\r\n  ${CommonInteractionStyling};\r\n\r\n  &.focus-visible,\r\n  &.focus-visible-within {\r\n    z-index: ${Z_INDEXES.dropdown + 1} !important;\r\n    ${focusStyles}\r\n  }\r\n`;\r\n\r\nexport const DropdownContentButtonStyling = css`\r\n  min-width: 344px;\r\n`;\r\n\r\n\r\n\r\nexport const DropdownButtonTextContent = styled.div`\r\n  display: flex;\r\n  gap: 4px;\r\n  align-items: center;\r\n  box-sizing: border-box;\r\n  min-width: 64px;\r\n  min-height: 32px;\r\n  padding: 4px 8px;\r\n  border-radius: 4px;\r\n`;\r\n\r\nexport const DropdownButtonTextIcon = styled.div`\r\n  width: 24px;\r\n  height: 24px;\r\n`;\r\n\r\nexport const DropdownButtonTextArrow = styled.div`\r\n  width: 24px;\r\n  height: 24px;\r\n\r\n  svg {\r\n    pointer-events: none;\r\n  }\r\n`;\r\n\r\nexport const DropdownButtonTextStyles = styled.div`\r\n  flex: 1\r\n`;\r\n\r\nexport const DropdownButtonTextWrapper = styled.div`\r\n  box-sizing: border-box;\r\n  min-height: 48px;\r\n  display: flex;\r\n  align-items: center;\r\n  width: fit-content;\r\n  cursor: pointer;\r\n\r\n  ${props => ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n\r\n  .expanded {\r\n    color: ${props => COLORS.getColor('neutral_800', props.theme)};\r\n\r\n    ${DropdownButtonTextContent} {\r\n      background: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n    }\r\n  }\r\n\r\n  &:focus {\r\n    ${focusStyles}\r\n  }\r\n\r\n  &:hover:not(.disabled) {\r\n    ${DropdownButtonTextContent} {\r\n      background-color: ${props => COLORS.getColor('primary_20', props.theme)};\r\n      color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n    }\r\n  }\r\n\r\n  &:active:not(.disabled) {\r\n    ${DropdownButtonTextContent} {\r\n      background-color: ${props => COLORS.getColor('primary_100', props.theme)};\r\n      color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    }\r\n  }\r\n\r\n  &.disabled {\r\n    cursor: not-allowed;\r\n    color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n  }\r\n\r\n}`;\r\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,WAAA,GAAAH,OAAA;AAMA,IAAAI,SAAA,GAAAJ,OAAA;AACA,IAAAK,cAAA,GAAAL,OAAA;AAA2D,SAAAM,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAR,wBAAAQ,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAEpD,MAAMW,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAGE,yBAAM,CAACC,GAAyG;AACjJ;AACA;AACA,IAAKC,KAAK,IAAK,CAACA,KAAK,CAACC,SAAS,KAAKD,KAAK,EAAEE,QAAQ,GAAG,2BAA2BF,KAAK,CAACE,QAAQ,GAAG,GAAG,gCAAgC,CAAC;AACtI,IAAKF,KAAK,IAAMA,KAAK,CAACG,SAAS,IAAIH,KAAK,CAACI,SAAS,GAAG,sBAAsB,GAAG,EAAG;AACjF,IAAKJ,KAAK,IAAMA,KAAK,CAACK,MAAM,GAAG,WAAWL,KAAK,CAACK,MAAM,GAAG,GAAG,qBAAsB;AAClF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAeC,mBAAS,CAACC,KAAK;AAC9B;AACA;AACA;AACA,aAAaP,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AACjE;AACA;AACA;AACA,aAAaV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AACjE;AACA;AACA;AACA,CAAC;AAED,MAAMC,WAAW,GAAG,IAAAC,qBAAG;AACvB,sBAAsBZ,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AAC1E,sCAAsCV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AAC1F,WAAWV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AAC/D;AACA;AACA;AACA;AACA,aAAaV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AACjE;AACA;AACA;AACA,aAAaV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AACjE;AACA,CAAC;AAED,MAAMG,aAAa,GAAG,IAAAD,qBAAG;AACzB,sBAAsBZ,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,OAAO,EAAET,KAAK,CAACU,KAAK,CAAC;AACpE,sCAAsCV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AAC1F,WAAWV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AAC/D;AACA;AACA;AACA;AACA,aAAaV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AACjE;AACA;AACA;AACA,aAAaV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AACjE;AACA;AACA,eAAeV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AACnE;AACA;AACA,CAAC;AAED,MAAMI,uBAAuB,GAAG,IAAAF,qBAAG;AACnC,sCAAsCZ,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,cAAc,EAAET,KAAK,CAACU,KAAK,CAAC;AAC3F,CAAC;AAED,MAAMK,kBAAkB,GAAG,IAAAH,qBAAG;AAC9B,IAAIZ,KAAK,IAAI,IAAAgB,6BAAiB,EAACC,0BAAkB,CAACC,MAAM,EAAEV,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC,CAAC;AACtG,CAAC;AAEM,MAAMS,kBAAkB,GAAAtB,OAAA,CAAAsB,kBAAA,GAAGrB,yBAAM,CAACsB,KAA4B;AACrE;AACA;AACA;AACA;AACA;AACA,WAAWpB,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,OAAO,EAAET,KAAK,CAACU,KAAK,CAAC;AACzD;AACA;AACA;AACA;AACA;AACA,IAAIV,KAAK,IAAIA,KAAK,CAACqB,SAAS,GAAG,0BAA0B,GAAG,EAAE;AAC9D;AACA;AACA,aAAarB,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AACjE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAEM,MAAMY,wBAAwB,GAAAzB,OAAA,CAAAyB,wBAAA,GAAGxB,yBAAM,CAACC,GAA+H;AAC9K,IAAI,IAAAwB,6BAAiB,EAACN,0BAAkB,CAACO,OAAO,EAAE,SAAS,CAAC;AAC5D;AACA;AACA;AACA,eAAgBxB,KAAK,IAAMA,KAAK,CAACyB,SAAS,GAAG,GAAGzB,KAAK,CAACyB,SAAS,EAAE,GAAG,OAAQ;AAC5E;AACA;AACA,gBAAgBzB,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,OAAO,EAAET,KAAK,CAACU,KAAK,CAAC;AAC9D,sCAAsCV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AAC1F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAI,IAAAgB,6BAAc,EAAC,OAAO,CAAC;AAC3B;AACA;AACA,MAAM1B,KAAK,IAAI,IAAA2B,+BAAmB,EAACV,0BAAkB,CAACC,MAAM,EAAEV,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC,CAAC;AAC1G;AACA;AACA,IAAIkB,mBAAW,CAACC,MAAM;AACtB,MAAM,IAAAb,6BAAiB,EAACC,0BAAkB,CAACO,OAAO,EAAE,SAAS,CAAC;AAC9D;AACA;AACA;AACA;AACA,QAAQxB,KAAK,IAAI,IAAA8B,8BAAkB,EAACb,0BAAkB,CAACC,MAAM,EAAEV,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC,CAAC;AAC3G;AACA;AACA;AACA;AACA,MAAM,IAAAa,6BAAiB,EAACN,0BAAkB,CAACO,OAAO,EAAE,SAAS,CAAC;AAC9D;AACA;AACA;AACA;AACA,QAAQxB,KAAK,IAAI,IAAA2B,+BAAmB,EAACV,0BAAkB,CAACC,MAAM,EAAEV,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC,CAAC;AAC5G;AACA;AACA;AACA;AACA,MAAM,IAAAM,6BAAiB,EAACC,0BAAkB,CAACO,OAAO,EAAE,SAAS,CAAC;AAC9D;AACA;AACA;AACA;AACA,QAAQxB,KAAK,IAAI,IAAA8B,8BAAkB,EAACb,0BAAkB,CAACC,MAAM,EAAEV,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC,CAAC;AAC3G;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAcV,KAAK,IAAKA,KAAK,CAAC+B,cAAc,GAAGvB,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC,GAAGsB,SAAS;AACtG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wCAAwChC,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AAC5F;AACA;AACA;AACA,wCAAwCV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AAC5F;AACA;AACA;AACA,iBAAiBV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AACrE;AACA;AACA;AACA;AACA,eAAeV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AACnE;AACA;AACA;AACA;AACA;AACA;AACA,wCAAwCV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AAC5F;AACA;AACA;AACA,iBAAiBV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AACrE;AACA;AACA;AACA;AACA,eAAeV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AACnE;AACA;AACA;AACA;AACA,MAAOV,KAAK,IAAK,IAAAuB,6BAAiB,EAACN,0BAAkB,CAACgB,IAAI,EAAEjC,KAAK,CAACI,SAAS,GAAGI,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC,GAAGF,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC,CAAC;AACxK;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAeV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AACnE,oBAAoBV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,YAAY,EAAET,KAAK,CAACU,KAAK,CAAC;AACvE;AACA;AACA;AACA;AACA,IAAKV,KAAK,IAAMA,KAAK,CAACI,SAAS,GAAGS,aAAa,GAAG,EAAG;AACrD,IAAKb,KAAK,IAAMA,KAAK,CAACG,SAAS,GAAGQ,WAAW,GAAG,EAAG;AACnD,IAAKX,KAAK,IAAMA,KAAK,CAACkC,sBAAsB,GAAGpB,uBAAuB,GAAG,EAAG;AAC5E,IAAKd,KAAK,IAAMA,KAAK,CAAC+B,cAAc,GAAGhB,kBAAkB,GAAG,EAAG;AAC/D;AACA,IAAIoB,gCAAwB;AAC5B;AACA;AACA;AACA,eAAe7B,mBAAS,CAAC8B,QAAQ,GAAG,CAAC;AACrC,MAAMC,mBAAW;AACjB;AACA,CAAC;AAEM,MAAMC,4BAA4B,GAAAzC,OAAA,CAAAyC,4BAAA,GAAG,IAAA1B,qBAAG;AAC/C;AACA,CAAC;AAIM,MAAM2B,yBAAyB,GAAA1C,OAAA,CAAA0C,yBAAA,GAAGzC,yBAAM,CAACC,GAAG;AACnD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAEM,MAAMyC,sBAAsB,GAAA3C,OAAA,CAAA2C,sBAAA,GAAG1C,yBAAM,CAACC,GAAG;AAChD;AACA;AACA,CAAC;AAEM,MAAM0C,uBAAuB,GAAA5C,OAAA,CAAA4C,uBAAA,GAAG3C,yBAAM,CAACC,GAAG;AACjD;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAEM,MAAM2C,wBAAwB,GAAA7C,OAAA,CAAA6C,wBAAA,GAAG5C,yBAAM,CAACC,GAAG;AAClD;AACA,CAAC;AAEM,MAAM4C,yBAAyB,GAAA9C,OAAA,CAAA8C,yBAAA,GAAG7C,yBAAM,CAACC,GAAG;AACnD;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIC,KAAK,IAAI,IAAAuB,6BAAiB,EAACN,0BAAkB,CAACgB,IAAI,EAAEzB,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC,CAAC;AACpG;AACA;AACA,aAAaV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AACjE;AACA,MAAM6B,yBAAyB;AAC/B,oBAAoBvC,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,YAAY,EAAET,KAAK,CAACU,KAAK,CAAC;AACvE;AACA;AACA;AACA;AACA,MAAM2B,mBAAW;AACjB;AACA;AACA;AACA,MAAME,yBAAyB;AAC/B,0BAA0BvC,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,YAAY,EAAET,KAAK,CAACU,KAAK,CAAC;AAC7E,eAAeV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AACnE;AACA;AACA;AACA;AACA,MAAM6B,yBAAyB;AAC/B,0BAA0BvC,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AAC9E,eAAeV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AACnE;AACA;AACA;AACA;AACA;AACA,aAAaV,KAAK,IAAIQ,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAET,KAAK,CAACU,KAAK,CAAC;AACjE;AACA;AACA,EAAE","ignoreList":[]}