@laerdal/life-react-components 3.5.2 → 3.6.0-dev.1.full
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Chips/ChoiceChips.cjs +1 -0
- package/dist/Chips/ChoiceChips.cjs.map +1 -1
- package/dist/Chips/ChoiceChips.js +1 -0
- package/dist/Chips/ChoiceChips.js.map +1 -1
- package/dist/ChipsInput/ChipDropdownInput.cjs +1 -1
- package/dist/ChipsInput/ChipDropdownInput.cjs.map +1 -1
- package/dist/ChipsInput/ChipDropdownInput.js +1 -1
- package/dist/ChipsInput/ChipDropdownInput.js.map +1 -1
- package/dist/Dropdown/BasicDropdown.cjs +2 -0
- package/dist/Dropdown/BasicDropdown.cjs.map +1 -1
- package/dist/Dropdown/BasicDropdown.js +2 -0
- package/dist/Dropdown/BasicDropdown.js.map +1 -1
- package/dist/Dropdown/CommonStyling.cjs +1 -1
- package/dist/Dropdown/CommonStyling.cjs.map +1 -1
- package/dist/Dropdown/CommonStyling.js +1 -1
- package/dist/Dropdown/CommonStyling.js.map +1 -1
- package/dist/Dropdown/DropdownButton.cjs +4 -0
- package/dist/Dropdown/DropdownButton.cjs.map +1 -1
- package/dist/Dropdown/DropdownButton.js +4 -0
- package/dist/Dropdown/DropdownButton.js.map +1 -1
- package/dist/Dropdown/DropdownContent.cjs +1 -1
- package/dist/Dropdown/DropdownContent.cjs.map +1 -1
- package/dist/Dropdown/DropdownContent.js +1 -1
- package/dist/Dropdown/DropdownContent.js.map +1 -1
- package/dist/Dropdown/DropdownFilter.cjs +2 -0
- package/dist/Dropdown/DropdownFilter.cjs.map +1 -1
- package/dist/Dropdown/DropdownFilter.js +2 -0
- package/dist/Dropdown/DropdownFilter.js.map +1 -1
- package/dist/Dropdown/index.cjs +0 -12
- package/dist/Dropdown/index.cjs.map +1 -1
- package/dist/Dropdown/index.d.ts +0 -1
- package/dist/Dropdown/index.js +0 -1
- package/dist/Dropdown/index.js.map +1 -1
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.cjs +0 -1
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.cjs.map +1 -1
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.js +0 -1
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.js.map +1 -1
- package/dist/GlobalNavigationBar/desktop/SubMenu.cjs +0 -1
- package/dist/GlobalNavigationBar/desktop/SubMenu.cjs.map +1 -1
- package/dist/GlobalNavigationBar/desktop/SubMenu.js +0 -1
- package/dist/GlobalNavigationBar/desktop/SubMenu.js.map +1 -1
- package/dist/InputFields/QuickSearch.cjs +1 -1
- package/dist/InputFields/QuickSearch.cjs.map +1 -1
- package/dist/InputFields/QuickSearch.js +1 -1
- package/dist/InputFields/QuickSearch.js.map +1 -1
- package/dist/List/ListRow.cjs +1 -1
- package/dist/List/ListRow.cjs.map +1 -1
- package/dist/List/ListRow.d.ts +1 -1
- package/dist/List/ListRow.js +1 -1
- package/dist/List/ListRow.js.map +1 -1
- package/dist/Table/TableBody.cjs +1 -1
- package/dist/Table/TableBody.cjs.map +1 -1
- package/dist/Table/TableBody.js +1 -1
- package/dist/Table/TableBody.js.map +1 -1
- package/dist/Table/TableFooter.cjs +2 -0
- package/dist/Table/TableFooter.cjs.map +1 -1
- package/dist/Table/TableFooter.js +2 -0
- package/dist/Table/TableFooter.js.map +1 -1
- package/dist/styles/typography.cjs +59 -35
- package/dist/styles/typography.cjs.map +1 -1
- package/dist/styles/typography.d.ts +1 -1
- package/dist/styles/typography.js +59 -35
- package/dist/styles/typography.js.map +1 -1
- package/dist/test-utils.cjs +42 -0
- package/dist/test-utils.cjs.map +1 -0
- package/dist/test-utils.d.ts +5 -0
- package/dist/test-utils.js +22 -0
- package/dist/test-utils.js.map +1 -0
- package/package.json +34 -10
|
@@ -1 +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","_props$itemsType","itemsType","action","actionLabel","actionVariant","actionIcon","actionLoading","actionDisabled","pinTopItem","_props$scrollable","scrollable","maxHeight","disabled","readOnly","isButton","activeValidationMessage","autofilledMessage","size","margin","minWidth","className","overflowTooltipPosition","onBlur","dataTestId","onSelect","_props$textOverflow","textOverflow","rest","_objectWithoutProperties","_excluded","theme","_React$useState","useState","_React$useState2","_slicedToArray","isOpen","setIsOpen","_React$useState3","_React$useState4","activeDescendant","setActiveDescendant","_React$useState5","_React$useState6","isLoading","setIsLoading","_React$useState7","_React$useState8","input","setInput","_React$useState9","_React$useState10","focused","setFocused","_React$useState11","_React$useState12","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","_objectSpread","onMouseDown","onClick","stopPropagation","_inputRef$current","blur","_inputRef$current2","tabIndex","isPlaceholder","showValidationMessage","onKeyDown","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 size=\"24px\" className={size ? size : ''}/> :\r\n <SystemIcons.ArrowDropDown 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":[]}
|
|
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","_props$itemsType","itemsType","action","actionLabel","actionVariant","actionIcon","actionLoading","actionDisabled","pinTopItem","_props$scrollable","scrollable","maxHeight","disabled","readOnly","isButton","activeValidationMessage","autofilledMessage","size","margin","minWidth","className","overflowTooltipPosition","onBlur","dataTestId","onSelect","_props$textOverflow","textOverflow","rest","_objectWithoutProperties","_excluded","theme","_React$useState","useState","_React$useState2","_slicedToArray","isOpen","setIsOpen","_React$useState3","_React$useState4","activeDescendant","setActiveDescendant","_React$useState5","_React$useState6","isLoading","setIsLoading","_React$useState7","_React$useState8","input","setInput","_React$useState9","_React$useState10","focused","setFocused","_React$useState11","_React$useState12","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","_objectSpread","onMouseDown","onClick","stopPropagation","_inputRef$current","blur","_inputRef$current2","tabIndex","isPlaceholder","showValidationMessage","onKeyDown","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":[]}
|
|
@@ -58,7 +58,7 @@ var activeValidationMessage = (0, _styledComponents.css)(_templateObject4 || (_t
|
|
|
58
58
|
var placeholderStyling = (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["\n ", "\n"])), function (props) {
|
|
59
59
|
return (0, _typography.ComponentMStyling)(_styles.ComponentTextStyle.Italic, _styles.COLORS.getColor('neutral_600', props.theme));
|
|
60
60
|
});
|
|
61
|
-
var DropdownInputField = _styledComponents["default"].input(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["\n border: none;\n outline: none;\n background-color: inherit;\n cursor: pointer;\n
|
|
61
|
+
var DropdownInputField = _styledComponents["default"].input(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["\n border: none;\n outline: none;\n background-color: inherit;\n cursor: pointer;\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"])), function (props) {
|
|
62
62
|
return _styles.COLORS.getColor('black', props.theme);
|
|
63
63
|
}, function (props) {
|
|
64
64
|
return props.ellipsis ? 'text-overflow: ellipsis;' : '';
|
|
@@ -1 +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","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","DropdownContainer","styled","div","_taggedTemplateLiteral2","props","isButton","minWidth","concat","readOnly","disabled","margin","Z_INDEXES","focus","COLORS","getColor","theme","exports","lockedState","css","disabledState","activeValidationMessage","placeholderStyling","ComponentMStyling","ComponentTextStyle","Italic","DropdownInputField","input","ellipsis","DropdownInputFieldStyles","ComponentSStyling","Regular","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":[]}
|
|
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","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","DropdownContainer","styled","div","_taggedTemplateLiteral2","props","isButton","minWidth","concat","readOnly","disabled","margin","Z_INDEXES","focus","COLORS","getColor","theme","exports","lockedState","css","disabledState","activeValidationMessage","placeholderStyling","ComponentMStyling","ComponentTextStyle","Italic","DropdownInputField","input","ellipsis","DropdownInputFieldStyles","ComponentSStyling","Regular","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 ComponentLStyling,\r\n ComponentSStyling,\r\n ComponentXSStyling,\r\n ComponentXXSStyling\r\n} from '../styles/typography';\r\nimport {Size} from '../types';\r\nimport {Z_INDEXES} from '../styles/z-indexes';\r\nimport { TooltipTrigger, Tooltip } 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 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;AAQA,IAAAI,SAAA,GAAAJ,OAAA;AACA,IAAAK,cAAA,GAAAL,OAAA;AAAoE,IAAAM,eAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,iBAAA,EAAAC,iBAAA,EAAAC,iBAAA,EAAAC,iBAAA;AAAA,SAAAC,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,yBAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAArB,wBAAAqB,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,gBAAAK,OAAA,CAAAL,CAAA,0BAAAA,CAAA,sBAAAA,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,cAAAR,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAE7D,IAAMW,iBAAiB,GAAGC,4BAAM,CAACC,GAAG,CAAAnC,eAAA,KAAAA,eAAA,OAAAoC,uBAAA,0SAGvC,UAACC,KAAK;EAAA,OAAK,CAACA,KAAK,CAACC,QAAQ,KAAKD,KAAK,aAALA,KAAK,eAALA,KAAK,CAAEE,QAAQ,8BAAAC,MAAA,CAA8BH,KAAK,CAACE,QAAQ,SAAM,gCAAgC,CAAC;AAAA,GACjI,UAACF,KAAK;EAAA,OAAMA,KAAK,CAACI,QAAQ,IAAIJ,KAAK,CAACK,QAAQ,GAAG,sBAAsB,GAAG,EAAE;AAAA,CAAC,EAC3E,UAACL,KAAK;EAAA,OAAMA,KAAK,CAACM,MAAM,cAAAH,MAAA,CAAcH,KAAK,CAACM,MAAM,SAAM,qBAAqB;AAAA,CAAC,EAUnEC,mBAAS,CAACC,KAAK,EAIjB,UAAAR,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAIpD,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,EAIhE;AAACC,OAAA,CAAAhB,iBAAA,GAAAA,iBAAA;AAEF,IAAMiB,WAAW,OAAGC,qBAAG,EAAAlD,gBAAA,KAAAA,gBAAA,OAAAmC,uBAAA,sQACD,UAAAC,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GACpC,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAC/E,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAKlD,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAIpD,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,EAEhE;AAED,IAAMI,aAAa,OAAGD,qBAAG,EAAAjD,gBAAA,KAAAA,gBAAA,OAAAkC,uBAAA,mUACH,UAAAC,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,OAAO,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAC9B,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAC/E,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAKlD,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAIpD,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAGlD,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,EAGlE;AAED,IAAMK,uBAAuB,OAAGF,qBAAG,EAAAhD,gBAAA,KAAAA,gBAAA,OAAAiC,uBAAA,kEACG,UAAAC,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,cAAc,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,EAC1F;AAED,IAAMM,kBAAkB,OAAGH,qBAAG,EAAA/C,gBAAA,KAAAA,gBAAA,OAAAgC,uBAAA,+BAC1B,UAAAC,KAAK;EAAA,OAAI,IAAAkB,6BAAiB,EAACC,0BAAkB,CAACC,MAAM,EAAEX,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC,CAAC;AAAA,EACrG;AAEM,IAAMU,kBAAkB,GAAGxB,4BAAM,CAACyB,KAAK,CAAAtD,gBAAA,KAAAA,gBAAA,OAAA+B,uBAAA,+eAKnC,UAAAC,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,OAAO,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAMrD,UAAAX,KAAK;EAAA,OAAIA,KAAK,CAACuB,QAAQ,GAAG,0BAA0B,GAAG,EAAE;AAAA,GAGhD,UAAAvB,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,EAUhE;AAACC,OAAA,CAAAS,kBAAA,GAAAA,kBAAA;AAEK,IAAMG,wBAAwB,GAAG3B,4BAAM,CAACC,GAAG,CAAA7B,gBAAA,KAAAA,gBAAA,OAAA8B,uBAAA,i6DAC9C,IAAA0B,6BAAiB,EAACN,0BAAkB,CAACO,OAAO,EAAE,SAAS,CAAC,EAI7C,UAAC1B,KAAK;EAAA,OAAMA,KAAK,CAACE,QAAQ,MAAAC,MAAA,CAAMH,KAAK,CAACE,QAAQ,IAAK,OAAO;AAAA,CAAC,EAG1D,UAAAF,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,OAAO,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GACxB,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAgBtF,IAAAgB,6BAAc,EAAC,OAAO,CAAC,EAGrB,UAAA3B,KAAK;EAAA,OAAI,IAAA4B,+BAAmB,EAACT,0BAAkB,CAACC,MAAM,EAAEX,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC,CAAC;AAAA,GAGtGkB,mBAAW,CAACC,MAAM,EAChB,IAAAZ,6BAAiB,EAACC,0BAAkB,CAACO,OAAO,EAAE,SAAS,CAAC,EAKtD,UAAA1B,KAAK;EAAA,OAAI,IAAA+B,8BAAkB,EAACZ,0BAAkB,CAACC,MAAM,EAAEX,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC,CAAC;AAAA,GAKrG,IAAAc,6BAAiB,EAACN,0BAAkB,CAACO,OAAO,EAAE,SAAS,CAAC,EAKtD,UAAA1B,KAAK;EAAA,OAAI,IAAA4B,+BAAmB,EAACT,0BAAkB,CAACC,MAAM,EAAEX,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC,CAAC;AAAA,GAKtG,IAAAO,6BAAiB,EAACC,0BAAkB,CAACO,OAAO,EAAE,SAAS,CAAC,EAKtD,UAAA1B,KAAK;EAAA,OAAI,IAAA+B,8BAAkB,EAACZ,0BAAkB,CAACC,MAAM,EAAEX,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC,CAAC;AAAA,GAQ9F,UAACX,KAAK;EAAA,OAAKA,KAAK,CAACgC,aAAa,GAAGvB,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC,GAAGsB,SAAS;AAAA,GAS7D,UAAAjC,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAIpD,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAI3E,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAKtD,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAO3B,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAI3E,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAKtD,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAK7D,UAACX,KAAK;EAAA,OAAK,IAAAyB,6BAAiB,EAACN,0BAAkB,CAACe,IAAI,EAAElC,KAAK,CAACK,QAAQ,GAAGI,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC,GAAGF,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC,CAAC;AAAA,GAYxJ,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAC/C,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,YAAY,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAKnE,UAACX,KAAK;EAAA,OAAMA,KAAK,CAACK,QAAQ,GAAGU,aAAa,GAAG,EAAE;AAAA,CAAC,EAChD,UAACf,KAAK;EAAA,OAAMA,KAAK,CAACI,QAAQ,GAAGS,WAAW,GAAG,EAAE;AAAA,CAAC,EAC9C,UAACb,KAAK;EAAA,OAAMA,KAAK,CAACmC,qBAAqB,GAAGnB,uBAAuB,GAAG,EAAE;AAAA,CAAC,EACvE,UAAChB,KAAK;EAAA,OAAMA,KAAK,CAACgC,aAAa,GAAGf,kBAAkB,GAAG,EAAE;AAAA,CAAC,EAE1DmB,gCAAwB,EAIb7B,mBAAS,CAAC8B,QAAQ,GAAG,CAAC,EAC/BC,mBAAW,CAEhB;AAAC1B,OAAA,CAAAY,wBAAA,GAAAA,wBAAA;AAEK,IAAMe,4BAA4B,OAAGzB,qBAAG,EAAA5C,gBAAA,KAAAA,gBAAA,OAAA6B,uBAAA,2CAE9C;AAACa,OAAA,CAAA2B,4BAAA,GAAAA,4BAAA;AAIK,IAAMC,yBAAyB,GAAG3C,4BAAM,CAACC,GAAG,CAAA3B,gBAAA,KAAAA,gBAAA,OAAA4B,uBAAA,6LASlD;AAACa,OAAA,CAAA4B,yBAAA,GAAAA,yBAAA;AAEK,IAAMC,sBAAsB,GAAG5C,4BAAM,CAACC,GAAG,CAAA1B,iBAAA,KAAAA,iBAAA,OAAA2B,uBAAA,uDAG/C;AAACa,OAAA,CAAA6B,sBAAA,GAAAA,sBAAA;AAEK,IAAMC,uBAAuB,GAAG7C,4BAAM,CAACC,GAAG,CAAAzB,iBAAA,KAAAA,iBAAA,OAAA0B,uBAAA,kGAOhD;AAACa,OAAA,CAAA8B,uBAAA,GAAAA,uBAAA;AAEK,IAAMC,wBAAwB,GAAG9C,4BAAM,CAACC,GAAG,CAAAxB,iBAAA,KAAAA,iBAAA,OAAAyB,uBAAA,iCAEjD;AAACa,OAAA,CAAA+B,wBAAA,GAAAA,wBAAA;AAEK,IAAMC,yBAAyB,GAAG/C,4BAAM,CAACC,GAAG,CAAAvB,iBAAA,KAAAA,iBAAA,OAAAwB,uBAAA,mjBAQ/C,UAAAC,KAAK;EAAA,OAAI,IAAAyB,6BAAiB,EAACN,0BAAkB,CAACe,IAAI,EAAEzB,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC,CAAC;AAAA,GAGvF,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAE3D6B,yBAAyB,EACX,UAAAxC,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,YAAY,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAKjE2B,mBAAW,EAIXE,yBAAyB,EACL,UAAAxC,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,YAAY,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAC9D,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAK7D6B,yBAAyB,EACL,UAAAxC,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAC/D,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,GAMtD,UAAAX,KAAK;EAAA,OAAIS,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEV,KAAK,CAACW,KAAK,CAAC;AAAA,EAG/D;AAACC,OAAA,CAAAgC,yBAAA,GAAAA,yBAAA","ignoreList":[]}
|
|
@@ -47,7 +47,7 @@ var activeValidationMessage = css(_templateObject4 || (_templateObject4 = _tagge
|
|
|
47
47
|
var placeholderStyling = css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n ", "\n"])), function (props) {
|
|
48
48
|
return ComponentMStyling(ComponentTextStyle.Italic, COLORS.getColor('neutral_600', props.theme));
|
|
49
49
|
});
|
|
50
|
-
export var DropdownInputField = styled.input(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n border: none;\n outline: none;\n background-color: inherit;\n cursor: pointer;\n
|
|
50
|
+
export var DropdownInputField = styled.input(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n border: none;\n outline: none;\n background-color: inherit;\n cursor: pointer;\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"])), function (props) {
|
|
51
51
|
return COLORS.getColor('black', props.theme);
|
|
52
52
|
}, function (props) {
|
|
53
53
|
return props.ellipsis ? 'text-overflow: ellipsis;' : '';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CommonStyling.js","names":["styled","css","CommonInteractionStyling","BREAKPOINTS","COLORS","ComponentTextStyle","focusStyles","ComponentMStyling","ComponentSStyling","ComponentXSStyling","ComponentXXSStyling","Z_INDEXES","TooltipTrigger","DropdownContainer","div","_templateObject","_taggedTemplateLiteral","props","isButton","minWidth","concat","readOnly","disabled","margin","focus","getColor","theme","lockedState","_templateObject2","disabledState","_templateObject3","activeValidationMessage","_templateObject4","placeholderStyling","_templateObject5","Italic","DropdownInputField","input","_templateObject6","ellipsis","DropdownInputFieldStyles","_templateObject7","Regular","MEDIUM","isPlaceholder","undefined","Bold","showValidationMessage","dropdown","DropdownContentButtonStyling","_templateObject8","DropdownButtonTextContent","_templateObject9","DropdownButtonTextIcon","_templateObject10","DropdownButtonTextArrow","_templateObject11","DropdownButtonTextStyles","_templateObject12","DropdownButtonTextWrapper","_templateObject13"],"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":[]}
|
|
1
|
+
{"version":3,"file":"CommonStyling.js","names":["styled","css","CommonInteractionStyling","BREAKPOINTS","COLORS","ComponentTextStyle","focusStyles","ComponentMStyling","ComponentSStyling","ComponentXSStyling","ComponentXXSStyling","Z_INDEXES","TooltipTrigger","DropdownContainer","div","_templateObject","_taggedTemplateLiteral","props","isButton","minWidth","concat","readOnly","disabled","margin","focus","getColor","theme","lockedState","_templateObject2","disabledState","_templateObject3","activeValidationMessage","_templateObject4","placeholderStyling","_templateObject5","Italic","DropdownInputField","input","_templateObject6","ellipsis","DropdownInputFieldStyles","_templateObject7","Regular","MEDIUM","isPlaceholder","undefined","Bold","showValidationMessage","dropdown","DropdownContentButtonStyling","_templateObject8","DropdownButtonTextContent","_templateObject9","DropdownButtonTextIcon","_templateObject10","DropdownButtonTextArrow","_templateObject11","DropdownButtonTextStyles","_templateObject12","DropdownButtonTextWrapper","_templateObject13"],"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 ComponentLStyling,\r\n ComponentSStyling,\r\n ComponentXSStyling,\r\n ComponentXXSStyling\r\n} from '../styles/typography';\r\nimport {Size} from '../types';\r\nimport {Z_INDEXES} from '../styles/z-indexes';\r\nimport { TooltipTrigger, Tooltip } 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 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":[]}
|
|
@@ -116,6 +116,7 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
116
116
|
role: "button",
|
|
117
117
|
tooltip: rest.tooltip,
|
|
118
118
|
id: id,
|
|
119
|
+
"aria-expanded": dropdownOpen,
|
|
119
120
|
"data-testid": dataTestId,
|
|
120
121
|
"aria-controls": "".concat(id, "_dropdowncontent"),
|
|
121
122
|
"aria-activedescendant": activeDescendant,
|
|
@@ -142,6 +143,7 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
142
143
|
role: "button",
|
|
143
144
|
id: id,
|
|
144
145
|
"data-testid": dataTestId,
|
|
146
|
+
"aria-expanded": dropdownOpen,
|
|
145
147
|
"aria-controls": "".concat(id, "_dropdowncontent"),
|
|
146
148
|
"aria-activedescendant": activeDescendant,
|
|
147
149
|
onMouseDown: _common.defaultOnMouseDownHandler,
|
|
@@ -163,8 +165,10 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
163
165
|
children: label
|
|
164
166
|
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_CommonStyling.DropdownButtonTextArrow, {
|
|
165
167
|
children: dropdownOpen ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.ArrowDropUp, {
|
|
168
|
+
"aria-label": "Expanded",
|
|
166
169
|
size: "24px"
|
|
167
170
|
}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.ArrowDropDown, {
|
|
171
|
+
"aria-label": "Collapsed",
|
|
168
172
|
size: "24px"
|
|
169
173
|
})
|
|
170
174
|
})]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownButton.cjs","names":["React","_interopRequireWildcard","require","_Button","_DropdownContent","_interopRequireDefault","_styledComponents","_common","_CommonStyling","_icons","_jsxRuntime","_excluded","_templateObject","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","DropdownButtonContainer","styled","div","_taggedTemplateLiteral2","exports","DropdownButton","forwardRef","_ref","ref","items","icon","disabled","onClick","_ref$itemsType","itemsType","action","_ref$actionLabel","actionLabel","actionVariant","actionIcon","actionLoading","size","width","alignLeft","_ref$multiSelect","multiSelect","_ref$scrollable","scrollable","_ref$pinTopItem","pinTopItem","maxHeight","className","value","id","dataTestId","rest","_objectWithoutProperties2","_React$useState","useState","_React$useState2","_slicedToArray2","dropdownOpen","setDropdownOpen","_React$useState3","_React$useState4","activeDescendant","setActiveDescendant","_React$useState5","_React$useState6","selectedValues","setSelectedValues","_React$useState7","_React$useState8","focused","setFocused","_React$useState9","_React$useState10","keyboardNavigated","setKeyboardNavigated","dropdownRef","useRef","containerRef","useFocusOutsideRef","useClickOutsideRef","useEffect","handleValueSelect","values","renderButton","type","jsx","IconButton","variant","shape","role","tooltip","concat","event","detail","children","label","keepLabel","length","filter","includes","map","_a$displayLabel","displayLabel","join","cls","DropdownButtonTextWrapper","tabIndex","onMouseDown","defaultOnMouseDownHandler","onKeyDown","key","preventDefault","stopPropagation","jsxs","DropdownButtonTextContent","DropdownButtonTextIcon","DropdownButtonTextStyles","DropdownButtonTextArrow","SystemIcons","ArrowDropUp","ArrowDropDown","ariaRolesType","customizationProps","onValueUpdate","onActiveDescendantChanged","isOpen","setIsOpen","outline","messageOnNoResults","isButton","_default"],"sources":["../../src/Dropdown/DropdownButton.tsx"],"sourcesContent":["/**\r\n * Import React libraries.\r\n */\r\nimport * as React from 'react';\r\n\r\n/**\r\n * Import custom components.\r\n */\r\nimport {IconButton} from '../Button';\r\nimport DropdownContent from './DropdownContent';\r\nimport styled from 'styled-components';\r\n\r\n/**\r\n * Import custom types.\r\n */\r\nimport {DropdownButtonProps} from './DropdownButtonTypes';\r\nimport {defaultOnMouseDownHandler, useClickOutsideRef, useFocusOutsideRef} from '../common';\r\nimport {\r\n DropdownButtonTextArrow,\r\n DropdownButtonTextContent,\r\n DropdownButtonTextIcon,\r\n DropdownButtonTextStyles,\r\n DropdownButtonTextWrapper\r\n} from './CommonStyling';\r\nimport {SystemIcons} from '../icons';\r\n\r\nexport const DropdownButtonContainer = styled.div`\r\n display: inline-block;\r\n`;\r\n\r\nconst DropdownButton = React.forwardRef( ({\r\n items,\r\n icon,\r\n disabled,\r\n onClick,\r\n itemsType = 'normal',\r\n action,\r\n actionLabel = '',\r\n actionVariant,\r\n actionIcon,\r\n actionLoading,\r\n size,\r\n width,\r\n alignLeft,\r\n multiSelect = false,\r\n scrollable = false,\r\n pinTopItem = false,\r\n maxHeight,\r\n className,\r\n value,\r\n id,\r\n dataTestId,\r\n ...rest\r\n }: DropdownButtonProps, ref: React.Ref<HTMLButtonElement>) => {\r\n // Globally used variables within the view.\r\n const [dropdownOpen, setDropdownOpen] = React.useState<boolean>(false);\r\n const [activeDescendant, setActiveDescendant] = React.useState<string>();\r\n const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\r\n const [focused, setFocused] = React.useState<number | null>(null);\r\n const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\r\n const dropdownRef = React.useRef<HTMLDivElement>(null);\r\n\r\n const containerRef = useFocusOutsideRef(() => setDropdownOpen(false), [dropdownRef]);\r\n useClickOutsideRef(() => setDropdownOpen(false), [], containerRef);\r\n\r\n React.useEffect(() => {\r\n !dropdownOpen && setKeyboardNavigated(false)\r\n }, [dropdownOpen]);\r\n\r\n React.useEffect(() => {\r\n disabled && setDropdownOpen(false)\r\n }, [disabled]);\r\n\r\n React.useEffect(() => {\r\n setSelectedValues(value || []);\r\n }, [value]);\r\n\r\n const handleValueSelect = (values: string[]) => {\r\n // Do all required actions\r\n onClick(values);\r\n };\r\n\r\n /**\r\n * Renders Icon Button dropdown menu.\r\n * @returns HTML View for the Icon button dropdown menu.\r\n */\r\n const renderButton = () => {\r\n switch (rest.type) {\r\n case 'icon':\r\n return (\r\n <IconButton ref={ref}\r\n variant=\"secondary\"\r\n shape=\"circular\"\r\n role=\"button\"\r\n tooltip={rest.tooltip}\r\n id={id}\r\n data-testid={dataTestId}\r\n aria-controls={`${id}_dropdowncontent`}\r\n aria-activedescendant={activeDescendant}\r\n \r\n action={(event: any) => {\r\n setDropdownOpen(!dropdownOpen);\r\n if (event?.detail !== 1) {\r\n setKeyboardNavigated(true);\r\n }\r\n }}\r\n disabled={disabled}>\r\n {icon}\r\n </IconButton>\r\n );\r\n case 'text':\r\n const label = rest.keepLabel || !selectedValues?.length\r\n ? rest.label\r\n : items.filter(a => selectedValues.includes(a.value)).map(a => a.displayLabel ?? a.value).join(', ');\r\n const cls = `${disabled && 'disabled'} ${dropdownOpen && 'expanded'} ${className}`;\r\n return <DropdownButtonTextWrapper tabIndex={!disabled ? 0 : -1}\r\n className={cls}\r\n role=\"button\"\r\n id={id}\r\n data-testid={dataTestId}\r\n aria-controls={`${id}_dropdowncontent`}\r\n aria-activedescendant={activeDescendant}\r\n onMouseDown={defaultOnMouseDownHandler}\r\n onKeyDown={e => {\r\n if (e.key === 'Enter' || e.key === ' ') {\r\n e.preventDefault();\r\n e.stopPropagation();\r\n setDropdownOpen(!dropdownOpen);\r\n setKeyboardNavigated(true);\r\n }\r\n }}\r\n onClick={() => !disabled && setDropdownOpen(!dropdownOpen)}>\r\n <DropdownButtonTextContent>\r\n {icon && <DropdownButtonTextIcon>{icon}</DropdownButtonTextIcon>}\r\n <DropdownButtonTextStyles>{label}</DropdownButtonTextStyles>\r\n <DropdownButtonTextArrow>\r\n {\r\n dropdownOpen\r\n ? <SystemIcons.ArrowDropUp size=\"24px\"/>\r\n : <SystemIcons.ArrowDropDown size=\"24px\"/>\r\n }\r\n </DropdownButtonTextArrow>\r\n </DropdownButtonTextContent>\r\n </DropdownButtonTextWrapper>\r\n }\r\n };\r\n\r\n return (\r\n <DropdownButtonContainer className={className} ref={containerRef}> \r\n {renderButton()}\r\n <DropdownContent\r\n ref={dropdownRef}\r\n ariaRolesType=\"menu\"\r\n containerRef={containerRef}\r\n customizationProps={{\r\n itemsType: itemsType,\r\n action: action ?? (() => {\r\n }),\r\n actionLabel: actionLabel,\r\n actionVariant: actionVariant,\r\n onValueUpdate: handleValueSelect,\r\n multiSelect: multiSelect,\r\n actionIcon: actionIcon,\r\n actionLoading: actionLoading,\r\n scrollable: scrollable,\r\n pinTopItem: pinTopItem,\r\n maxHeight: maxHeight,\r\n items: items\r\n }}\r\n onActiveDescendantChanged={(e) => setActiveDescendant(e)}\r\n focused={focused}\r\n setFocused={setFocused}\r\n size={size}\r\n width={width}\r\n alignLeft={alignLeft}\r\n isOpen={dropdownOpen}\r\n setIsOpen={setDropdownOpen}\r\n outline={keyboardNavigated}\r\n filter=\"\"\r\n selectedValues={rest.type === 'icon' && itemsType === 'normal' ? [] : selectedValues}\r\n setSelectedValues={setSelectedValues}\r\n messageOnNoResults=\"No results\"\r\n isButton={true}\r\n id={`${id}_dropdowncontent`}\r\n />\r\n </DropdownButtonContainer>\r\n );\r\n});\r\n\r\nexport default DropdownButton;\r\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"DropdownButton.cjs","names":["React","_interopRequireWildcard","require","_Button","_DropdownContent","_interopRequireDefault","_styledComponents","_common","_CommonStyling","_icons","_jsxRuntime","_excluded","_templateObject","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","DropdownButtonContainer","styled","div","_taggedTemplateLiteral2","exports","DropdownButton","forwardRef","_ref","ref","items","icon","disabled","onClick","_ref$itemsType","itemsType","action","_ref$actionLabel","actionLabel","actionVariant","actionIcon","actionLoading","size","width","alignLeft","_ref$multiSelect","multiSelect","_ref$scrollable","scrollable","_ref$pinTopItem","pinTopItem","maxHeight","className","value","id","dataTestId","rest","_objectWithoutProperties2","_React$useState","useState","_React$useState2","_slicedToArray2","dropdownOpen","setDropdownOpen","_React$useState3","_React$useState4","activeDescendant","setActiveDescendant","_React$useState5","_React$useState6","selectedValues","setSelectedValues","_React$useState7","_React$useState8","focused","setFocused","_React$useState9","_React$useState10","keyboardNavigated","setKeyboardNavigated","dropdownRef","useRef","containerRef","useFocusOutsideRef","useClickOutsideRef","useEffect","handleValueSelect","values","renderButton","type","jsx","IconButton","variant","shape","role","tooltip","concat","event","detail","children","label","keepLabel","length","filter","includes","map","_a$displayLabel","displayLabel","join","cls","DropdownButtonTextWrapper","tabIndex","onMouseDown","defaultOnMouseDownHandler","onKeyDown","key","preventDefault","stopPropagation","jsxs","DropdownButtonTextContent","DropdownButtonTextIcon","DropdownButtonTextStyles","DropdownButtonTextArrow","SystemIcons","ArrowDropUp","ArrowDropDown","ariaRolesType","customizationProps","onValueUpdate","onActiveDescendantChanged","isOpen","setIsOpen","outline","messageOnNoResults","isButton","_default"],"sources":["../../src/Dropdown/DropdownButton.tsx"],"sourcesContent":["/**\r\n * Import React libraries.\r\n */\r\nimport * as React from 'react';\r\n\r\n/**\r\n * Import custom components.\r\n */\r\nimport {IconButton} from '../Button';\r\nimport DropdownContent from './DropdownContent';\r\nimport styled from 'styled-components';\r\n\r\n/**\r\n * Import custom types.\r\n */\r\nimport {DropdownButtonProps} from './DropdownButtonTypes';\r\nimport {defaultOnMouseDownHandler, useClickOutsideRef, useFocusOutsideRef} from '../common';\r\nimport {\r\n DropdownButtonTextArrow,\r\n DropdownButtonTextContent,\r\n DropdownButtonTextIcon,\r\n DropdownButtonTextStyles,\r\n DropdownButtonTextWrapper\r\n} from './CommonStyling';\r\nimport {SystemIcons} from '../icons';\r\n\r\nexport const DropdownButtonContainer = styled.div`\r\n display: inline-block;\r\n`;\r\n\r\nconst DropdownButton = React.forwardRef( ({\r\n items,\r\n icon,\r\n disabled,\r\n onClick,\r\n itemsType = 'normal',\r\n action,\r\n actionLabel = '',\r\n actionVariant,\r\n actionIcon,\r\n actionLoading,\r\n size,\r\n width,\r\n alignLeft,\r\n multiSelect = false,\r\n scrollable = false,\r\n pinTopItem = false,\r\n maxHeight,\r\n className,\r\n value,\r\n id,\r\n dataTestId,\r\n ...rest\r\n }: DropdownButtonProps, ref: React.Ref<HTMLButtonElement>) => {\r\n // Globally used variables within the view.\r\n const [dropdownOpen, setDropdownOpen] = React.useState<boolean>(false);\r\n const [activeDescendant, setActiveDescendant] = React.useState<string>();\r\n const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\r\n const [focused, setFocused] = React.useState<number | null>(null);\r\n const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\r\n const dropdownRef = React.useRef<HTMLDivElement>(null);\r\n\r\n const containerRef = useFocusOutsideRef(() => setDropdownOpen(false), [dropdownRef]);\r\n useClickOutsideRef(() => setDropdownOpen(false), [], containerRef);\r\n\r\n React.useEffect(() => {\r\n !dropdownOpen && setKeyboardNavigated(false)\r\n }, [dropdownOpen]);\r\n\r\n React.useEffect(() => {\r\n disabled && setDropdownOpen(false)\r\n }, [disabled]);\r\n\r\n React.useEffect(() => {\r\n setSelectedValues(value || []);\r\n }, [value]);\r\n\r\n const handleValueSelect = (values: string[]) => {\r\n // Do all required actions\r\n onClick(values);\r\n };\r\n\r\n /**\r\n * Renders Icon Button dropdown menu.\r\n * @returns HTML View for the Icon button dropdown menu.\r\n */\r\n const renderButton = () => {\r\n switch (rest.type) {\r\n case 'icon':\r\n return (\r\n <IconButton ref={ref}\r\n variant=\"secondary\"\r\n shape=\"circular\"\r\n role=\"button\"\r\n tooltip={rest.tooltip}\r\n id={id}\r\n aria-expanded={dropdownOpen}\r\n data-testid={dataTestId}\r\n aria-controls={`${id}_dropdowncontent`}\r\n aria-activedescendant={activeDescendant}\r\n \r\n action={(event: any) => {\r\n setDropdownOpen(!dropdownOpen);\r\n if (event?.detail !== 1) {\r\n setKeyboardNavigated(true);\r\n }\r\n }}\r\n disabled={disabled}>\r\n {icon}\r\n </IconButton>\r\n );\r\n case 'text':\r\n const label = rest.keepLabel || !selectedValues?.length\r\n ? rest.label\r\n : items.filter(a => selectedValues.includes(a.value)).map(a => a.displayLabel ?? a.value).join(', ');\r\n const cls = `${disabled && 'disabled'} ${dropdownOpen && 'expanded'} ${className}`;\r\n return <DropdownButtonTextWrapper tabIndex={!disabled ? 0 : -1}\r\n className={cls}\r\n role=\"button\"\r\n id={id}\r\n data-testid={dataTestId}\r\n aria-expanded={dropdownOpen}\r\n aria-controls={`${id}_dropdowncontent`}\r\n aria-activedescendant={activeDescendant}\r\n onMouseDown={defaultOnMouseDownHandler}\r\n onKeyDown={e => {\r\n if (e.key === 'Enter' || e.key === ' ') {\r\n e.preventDefault();\r\n e.stopPropagation();\r\n setDropdownOpen(!dropdownOpen);\r\n setKeyboardNavigated(true);\r\n }\r\n }}\r\n onClick={() => !disabled && setDropdownOpen(!dropdownOpen)}>\r\n <DropdownButtonTextContent>\r\n {icon && <DropdownButtonTextIcon>{icon}</DropdownButtonTextIcon>}\r\n <DropdownButtonTextStyles>{label}</DropdownButtonTextStyles>\r\n <DropdownButtonTextArrow>\r\n {\r\n dropdownOpen\r\n ? <SystemIcons.ArrowDropUp aria-label='Expanded' size=\"24px\"/>\r\n : <SystemIcons.ArrowDropDown aria-label='Collapsed' size=\"24px\"/>\r\n }\r\n </DropdownButtonTextArrow>\r\n </DropdownButtonTextContent>\r\n </DropdownButtonTextWrapper>\r\n }\r\n };\r\n\r\n return (\r\n <DropdownButtonContainer className={className} ref={containerRef}> \r\n {renderButton()}\r\n <DropdownContent\r\n ref={dropdownRef}\r\n ariaRolesType=\"menu\"\r\n containerRef={containerRef}\r\n customizationProps={{\r\n itemsType: itemsType,\r\n action: action ?? (() => {\r\n }),\r\n actionLabel: actionLabel,\r\n actionVariant: actionVariant,\r\n onValueUpdate: handleValueSelect,\r\n multiSelect: multiSelect,\r\n actionIcon: actionIcon,\r\n actionLoading: actionLoading,\r\n scrollable: scrollable,\r\n pinTopItem: pinTopItem,\r\n maxHeight: maxHeight,\r\n items: items\r\n }}\r\n onActiveDescendantChanged={(e) => setActiveDescendant(e)}\r\n focused={focused}\r\n setFocused={setFocused}\r\n size={size}\r\n width={width}\r\n alignLeft={alignLeft}\r\n isOpen={dropdownOpen}\r\n setIsOpen={setDropdownOpen}\r\n outline={keyboardNavigated}\r\n filter=\"\"\r\n selectedValues={rest.type === 'icon' && itemsType === 'normal' ? [] : selectedValues}\r\n setSelectedValues={setSelectedValues}\r\n messageOnNoResults=\"No results\"\r\n isButton={true}\r\n id={`${id}_dropdowncontent`}\r\n />\r\n </DropdownButtonContainer>\r\n );\r\n});\r\n\r\nexport default DropdownButton;\r\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -109,6 +109,7 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
109
109
|
role: "button",
|
|
110
110
|
tooltip: rest.tooltip,
|
|
111
111
|
id: id,
|
|
112
|
+
"aria-expanded": dropdownOpen,
|
|
112
113
|
"data-testid": dataTestId,
|
|
113
114
|
"aria-controls": "".concat(id, "_dropdowncontent"),
|
|
114
115
|
"aria-activedescendant": activeDescendant,
|
|
@@ -135,6 +136,7 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
135
136
|
role: "button",
|
|
136
137
|
id: id,
|
|
137
138
|
"data-testid": dataTestId,
|
|
139
|
+
"aria-expanded": dropdownOpen,
|
|
138
140
|
"aria-controls": "".concat(id, "_dropdowncontent"),
|
|
139
141
|
"aria-activedescendant": activeDescendant,
|
|
140
142
|
onMouseDown: defaultOnMouseDownHandler,
|
|
@@ -156,8 +158,10 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
156
158
|
children: label
|
|
157
159
|
}), /*#__PURE__*/_jsx(DropdownButtonTextArrow, {
|
|
158
160
|
children: dropdownOpen ? /*#__PURE__*/_jsx(SystemIcons.ArrowDropUp, {
|
|
161
|
+
"aria-label": "Expanded",
|
|
159
162
|
size: "24px"
|
|
160
163
|
}) : /*#__PURE__*/_jsx(SystemIcons.ArrowDropDown, {
|
|
164
|
+
"aria-label": "Collapsed",
|
|
161
165
|
size: "24px"
|
|
162
166
|
})
|
|
163
167
|
})]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownButton.js","names":["React","IconButton","DropdownContent","styled","defaultOnMouseDownHandler","useClickOutsideRef","useFocusOutsideRef","DropdownButtonTextArrow","DropdownButtonTextContent","DropdownButtonTextIcon","DropdownButtonTextStyles","DropdownButtonTextWrapper","SystemIcons","jsx","_jsx","jsxs","_jsxs","DropdownButtonContainer","div","_templateObject","_taggedTemplateLiteral","DropdownButton","forwardRef","_ref","ref","items","icon","disabled","onClick","_ref$itemsType","itemsType","action","_ref$actionLabel","actionLabel","actionVariant","actionIcon","actionLoading","size","width","alignLeft","_ref$multiSelect","multiSelect","_ref$scrollable","scrollable","_ref$pinTopItem","pinTopItem","maxHeight","className","value","id","dataTestId","rest","_objectWithoutProperties","_excluded","_React$useState","useState","_React$useState2","_slicedToArray","dropdownOpen","setDropdownOpen","_React$useState3","_React$useState4","activeDescendant","setActiveDescendant","_React$useState5","_React$useState6","selectedValues","setSelectedValues","_React$useState7","_React$useState8","focused","setFocused","_React$useState9","_React$useState10","keyboardNavigated","setKeyboardNavigated","dropdownRef","useRef","containerRef","useEffect","handleValueSelect","values","renderButton","type","variant","shape","role","tooltip","concat","event","detail","children","label","keepLabel","length","filter","a","includes","map","_a$displayLabel","displayLabel","join","cls","tabIndex","onMouseDown","onKeyDown","e","key","preventDefault","stopPropagation","ArrowDropUp","ArrowDropDown","ariaRolesType","customizationProps","onValueUpdate","onActiveDescendantChanged","isOpen","setIsOpen","outline","messageOnNoResults","isButton"],"sources":["../../src/Dropdown/DropdownButton.tsx"],"sourcesContent":["/**\r\n * Import React libraries.\r\n */\r\nimport * as React from 'react';\r\n\r\n/**\r\n * Import custom components.\r\n */\r\nimport {IconButton} from '../Button';\r\nimport DropdownContent from './DropdownContent';\r\nimport styled from 'styled-components';\r\n\r\n/**\r\n * Import custom types.\r\n */\r\nimport {DropdownButtonProps} from './DropdownButtonTypes';\r\nimport {defaultOnMouseDownHandler, useClickOutsideRef, useFocusOutsideRef} from '../common';\r\nimport {\r\n DropdownButtonTextArrow,\r\n DropdownButtonTextContent,\r\n DropdownButtonTextIcon,\r\n DropdownButtonTextStyles,\r\n DropdownButtonTextWrapper\r\n} from './CommonStyling';\r\nimport {SystemIcons} from '../icons';\r\n\r\nexport const DropdownButtonContainer = styled.div`\r\n display: inline-block;\r\n`;\r\n\r\nconst DropdownButton = React.forwardRef( ({\r\n items,\r\n icon,\r\n disabled,\r\n onClick,\r\n itemsType = 'normal',\r\n action,\r\n actionLabel = '',\r\n actionVariant,\r\n actionIcon,\r\n actionLoading,\r\n size,\r\n width,\r\n alignLeft,\r\n multiSelect = false,\r\n scrollable = false,\r\n pinTopItem = false,\r\n maxHeight,\r\n className,\r\n value,\r\n id,\r\n dataTestId,\r\n ...rest\r\n }: DropdownButtonProps, ref: React.Ref<HTMLButtonElement>) => {\r\n // Globally used variables within the view.\r\n const [dropdownOpen, setDropdownOpen] = React.useState<boolean>(false);\r\n const [activeDescendant, setActiveDescendant] = React.useState<string>();\r\n const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\r\n const [focused, setFocused] = React.useState<number | null>(null);\r\n const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\r\n const dropdownRef = React.useRef<HTMLDivElement>(null);\r\n\r\n const containerRef = useFocusOutsideRef(() => setDropdownOpen(false), [dropdownRef]);\r\n useClickOutsideRef(() => setDropdownOpen(false), [], containerRef);\r\n\r\n React.useEffect(() => {\r\n !dropdownOpen && setKeyboardNavigated(false)\r\n }, [dropdownOpen]);\r\n\r\n React.useEffect(() => {\r\n disabled && setDropdownOpen(false)\r\n }, [disabled]);\r\n\r\n React.useEffect(() => {\r\n setSelectedValues(value || []);\r\n }, [value]);\r\n\r\n const handleValueSelect = (values: string[]) => {\r\n // Do all required actions\r\n onClick(values);\r\n };\r\n\r\n /**\r\n * Renders Icon Button dropdown menu.\r\n * @returns HTML View for the Icon button dropdown menu.\r\n */\r\n const renderButton = () => {\r\n switch (rest.type) {\r\n case 'icon':\r\n return (\r\n <IconButton ref={ref}\r\n variant=\"secondary\"\r\n shape=\"circular\"\r\n role=\"button\"\r\n tooltip={rest.tooltip}\r\n id={id}\r\n data-testid={dataTestId}\r\n aria-controls={`${id}_dropdowncontent`}\r\n aria-activedescendant={activeDescendant}\r\n \r\n action={(event: any) => {\r\n setDropdownOpen(!dropdownOpen);\r\n if (event?.detail !== 1) {\r\n setKeyboardNavigated(true);\r\n }\r\n }}\r\n disabled={disabled}>\r\n {icon}\r\n </IconButton>\r\n );\r\n case 'text':\r\n const label = rest.keepLabel || !selectedValues?.length\r\n ? rest.label\r\n : items.filter(a => selectedValues.includes(a.value)).map(a => a.displayLabel ?? a.value).join(', ');\r\n const cls = `${disabled && 'disabled'} ${dropdownOpen && 'expanded'} ${className}`;\r\n return <DropdownButtonTextWrapper tabIndex={!disabled ? 0 : -1}\r\n className={cls}\r\n role=\"button\"\r\n id={id}\r\n data-testid={dataTestId}\r\n aria-controls={`${id}_dropdowncontent`}\r\n aria-activedescendant={activeDescendant}\r\n onMouseDown={defaultOnMouseDownHandler}\r\n onKeyDown={e => {\r\n if (e.key === 'Enter' || e.key === ' ') {\r\n e.preventDefault();\r\n e.stopPropagation();\r\n setDropdownOpen(!dropdownOpen);\r\n setKeyboardNavigated(true);\r\n }\r\n }}\r\n onClick={() => !disabled && setDropdownOpen(!dropdownOpen)}>\r\n <DropdownButtonTextContent>\r\n {icon && <DropdownButtonTextIcon>{icon}</DropdownButtonTextIcon>}\r\n <DropdownButtonTextStyles>{label}</DropdownButtonTextStyles>\r\n <DropdownButtonTextArrow>\r\n {\r\n dropdownOpen\r\n ? <SystemIcons.ArrowDropUp size=\"24px\"/>\r\n : <SystemIcons.ArrowDropDown size=\"24px\"/>\r\n }\r\n </DropdownButtonTextArrow>\r\n </DropdownButtonTextContent>\r\n </DropdownButtonTextWrapper>\r\n }\r\n };\r\n\r\n return (\r\n <DropdownButtonContainer className={className} ref={containerRef}> \r\n {renderButton()}\r\n <DropdownContent\r\n ref={dropdownRef}\r\n ariaRolesType=\"menu\"\r\n containerRef={containerRef}\r\n customizationProps={{\r\n itemsType: itemsType,\r\n action: action ?? (() => {\r\n }),\r\n actionLabel: actionLabel,\r\n actionVariant: actionVariant,\r\n onValueUpdate: handleValueSelect,\r\n multiSelect: multiSelect,\r\n actionIcon: actionIcon,\r\n actionLoading: actionLoading,\r\n scrollable: scrollable,\r\n pinTopItem: pinTopItem,\r\n maxHeight: maxHeight,\r\n items: items\r\n }}\r\n onActiveDescendantChanged={(e) => setActiveDescendant(e)}\r\n focused={focused}\r\n setFocused={setFocused}\r\n size={size}\r\n width={width}\r\n alignLeft={alignLeft}\r\n isOpen={dropdownOpen}\r\n setIsOpen={setDropdownOpen}\r\n outline={keyboardNavigated}\r\n filter=\"\"\r\n selectedValues={rest.type === 'icon' && itemsType === 'normal' ? [] : selectedValues}\r\n setSelectedValues={setSelectedValues}\r\n messageOnNoResults=\"No results\"\r\n isButton={true}\r\n id={`${id}_dropdowncontent`}\r\n />\r\n </DropdownButtonContainer>\r\n );\r\n});\r\n\r\nexport default DropdownButton;\r\n"],"mappings":";;;;;AAAA;AACA;AACA;AACA,OAAO,KAAKA,KAAK,MAAM,OAAO;;AAE9B;AACA;AACA;AACA,SAAQC,UAAU,QAAO,WAAW;AACpC,OAAOC,eAAe,MAAM,mBAAmB;AAC/C,OAAOC,MAAM,MAAM,mBAAmB;;AAEtC;AACA;AACA;;AAEA,SAAQC,yBAAyB,EAAEC,kBAAkB,EAAEC,kBAAkB,QAAO,WAAW;AAC3F,SACEC,uBAAuB,EACvBC,yBAAyB,EACzBC,sBAAsB,EACtBC,wBAAwB,EACxBC,yBAAyB,QACpB,iBAAiB;AACxB,SAAQC,WAAW,QAAO,UAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAErC,OAAO,IAAMC,uBAAuB,GAAGd,MAAM,CAACe,GAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,oCAEhD;AAED,IAAMC,cAAc,gBAAGrB,KAAK,CAACsB,UAAU,CAAE,UAAAC,IAAA,EAuBOC,GAAiC,EAAK;EAAA,IAtB5DC,KAAK,GAAAF,IAAA,CAALE,KAAK;IACLC,IAAI,GAAAH,IAAA,CAAJG,IAAI;IACJC,QAAQ,GAAAJ,IAAA,CAARI,QAAQ;IACRC,OAAO,GAAAL,IAAA,CAAPK,OAAO;IAAAC,cAAA,GAAAN,IAAA,CACPO,SAAS;IAATA,SAAS,GAAAD,cAAA,cAAG,QAAQ,GAAAA,cAAA;IACpBE,MAAM,GAAAR,IAAA,CAANQ,MAAM;IAAAC,gBAAA,GAAAT,IAAA,CACNU,WAAW;IAAXA,WAAW,GAAAD,gBAAA,cAAG,EAAE,GAAAA,gBAAA;IAChBE,aAAa,GAAAX,IAAA,CAAbW,aAAa;IACbC,UAAU,GAAAZ,IAAA,CAAVY,UAAU;IACVC,aAAa,GAAAb,IAAA,CAAba,aAAa;IACbC,IAAI,GAAAd,IAAA,CAAJc,IAAI;IACJC,KAAK,GAAAf,IAAA,CAALe,KAAK;IACLC,SAAS,GAAAhB,IAAA,CAATgB,SAAS;IAAAC,gBAAA,GAAAjB,IAAA,CACTkB,WAAW;IAAXA,WAAW,GAAAD,gBAAA,cAAG,KAAK,GAAAA,gBAAA;IAAAE,eAAA,GAAAnB,IAAA,CACnBoB,UAAU;IAAVA,UAAU,GAAAD,eAAA,cAAG,KAAK,GAAAA,eAAA;IAAAE,eAAA,GAAArB,IAAA,CAClBsB,UAAU;IAAVA,UAAU,GAAAD,eAAA,cAAG,KAAK,GAAAA,eAAA;IAClBE,SAAS,GAAAvB,IAAA,CAATuB,SAAS;IACTC,SAAS,GAAAxB,IAAA,CAATwB,SAAS;IACTC,KAAK,GAAAzB,IAAA,CAALyB,KAAK;IACLC,EAAE,GAAA1B,IAAA,CAAF0B,EAAE;IACFC,UAAU,GAAA3B,IAAA,CAAV2B,UAAU;IACPC,IAAI,GAAAC,wBAAA,CAAA7B,IAAA,EAAA8B,SAAA;EAE/B;EACA,IAAAC,eAAA,GAAwCtD,KAAK,CAACuD,QAAQ,CAAU,KAAK,CAAC;IAAAC,gBAAA,GAAAC,cAAA,CAAAH,eAAA;IAA/DI,YAAY,GAAAF,gBAAA;IAAEG,eAAe,GAAAH,gBAAA;EACpC,IAAAI,gBAAA,GAAgD5D,KAAK,CAACuD,QAAQ,CAAS,CAAC;IAAAM,gBAAA,GAAAJ,cAAA,CAAAG,gBAAA;IAAjEE,gBAAgB,GAAAD,gBAAA;IAAEE,mBAAmB,GAAAF,gBAAA;EAC5C,IAAAG,gBAAA,GAA4ChE,KAAK,CAACuD,QAAQ,CAAW,EAAE,CAAC;IAAAU,gBAAA,GAAAR,cAAA,CAAAO,gBAAA;IAAjEE,cAAc,GAAAD,gBAAA;IAAEE,iBAAiB,GAAAF,gBAAA;EACxC,IAAAG,gBAAA,GAA8BpE,KAAK,CAACuD,QAAQ,CAAgB,IAAI,CAAC;IAAAc,gBAAA,GAAAZ,cAAA,CAAAW,gBAAA;IAA1DE,OAAO,GAAAD,gBAAA;IAAEE,UAAU,GAAAF,gBAAA;EAC1B,IAAAG,gBAAA,GAAkDxE,KAAK,CAACuD,QAAQ,CAAU,KAAK,CAAC;IAAAkB,iBAAA,GAAAhB,cAAA,CAAAe,gBAAA;IAAzEE,iBAAiB,GAAAD,iBAAA;IAAEE,oBAAoB,GAAAF,iBAAA;EAC9C,IAAMG,WAAW,GAAG5E,KAAK,CAAC6E,MAAM,CAAiB,IAAI,CAAC;EAEtD,IAAMC,YAAY,GAAGxE,kBAAkB,CAAC;IAAA,OAAMqD,eAAe,CAAC,KAAK,CAAC;EAAA,GAAE,CAACiB,WAAW,CAAC,CAAC;EACpFvE,kBAAkB,CAAC;IAAA,OAAMsD,eAAe,CAAC,KAAK,CAAC;EAAA,GAAE,EAAE,EAAEmB,YAAY,CAAC;EAElE9E,KAAK,CAAC+E,SAAS,CAAC,YAAM;IACpB,CAACrB,YAAY,IAAIiB,oBAAoB,CAAC,KAAK,CAAC;EAC9C,CAAC,EAAE,CAACjB,YAAY,CAAC,CAAC;EAElB1D,KAAK,CAAC+E,SAAS,CAAC,YAAM;IACpBpD,QAAQ,IAAIgC,eAAe,CAAC,KAAK,CAAC;EACpC,CAAC,EAAE,CAAChC,QAAQ,CAAC,CAAC;EAEd3B,KAAK,CAAC+E,SAAS,CAAC,YAAM;IACpBZ,iBAAiB,CAACnB,KAAK,IAAI,EAAE,CAAC;EAChC,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAEX,IAAMgC,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAIC,MAAgB,EAAK;IAC9C;IACArD,OAAO,CAACqD,MAAM,CAAC;EACjB,CAAC;;EAED;AACF;AACA;AACA;EACE,IAAMC,YAAY,GAAG,SAAfA,YAAYA,CAAA,EAAS;IACzB,QAAQ/B,IAAI,CAACgC,IAAI;MACf,KAAK,MAAM;QACT,oBACErE,IAAA,CAACb,UAAU;UAACuB,GAAG,EAAEA,GAAI;UACT4D,OAAO,EAAC,WAAW;UACnBC,KAAK,EAAC,UAAU;UAChBC,IAAI,EAAC,QAAQ;UACbC,OAAO,EAAEpC,IAAI,CAACoC,OAAQ;UACtBtC,EAAE,EAAEA,EAAG;UACP,eAAaC,UAAW;UACxB,oBAAAsC,MAAA,CAAkBvC,EAAE,qBAAmB;UACvC,yBAAuBa,gBAAiB;UAExC/B,MAAM,EAAE,SAAAA,OAAC0D,KAAU,EAAK;YACtB9B,eAAe,CAAC,CAACD,YAAY,CAAC;YAC9B,IAAI,CAAA+B,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEC,MAAM,MAAK,CAAC,EAAE;cACvBf,oBAAoB,CAAC,IAAI,CAAC;YAC5B;UACF,CAAE;UACFhD,QAAQ,EAAEA,QAAS;UAAAgE,QAAA,EAC5BjE;QAAI,CACK,CAAC;MAEjB,KAAK,MAAM;QACT,IAAMkE,KAAK,GAAGzC,IAAI,CAAC0C,SAAS,IAAI,EAAC3B,cAAc,aAAdA,cAAc,eAAdA,cAAc,CAAE4B,MAAM,IACnD3C,IAAI,CAACyC,KAAK,GACVnE,KAAK,CAACsE,MAAM,CAAC,UAAAC,CAAC;UAAA,OAAI9B,cAAc,CAAC+B,QAAQ,CAACD,CAAC,CAAChD,KAAK,CAAC;QAAA,EAAC,CAACkD,GAAG,CAAC,UAAAF,CAAC;UAAA,IAAAG,eAAA;UAAA,QAAAA,eAAA,GAAIH,CAAC,CAACI,YAAY,cAAAD,eAAA,cAAAA,eAAA,GAAIH,CAAC,CAAChD,KAAK;QAAA,EAAC,CAACqD,IAAI,CAAC,IAAI,CAAC;QACtG,IAAMC,GAAG,MAAAd,MAAA,CAAM7D,QAAQ,IAAI,UAAU,OAAA6D,MAAA,CAAI9B,YAAY,IAAI,UAAU,OAAA8B,MAAA,CAAIzC,SAAS,CAAE;QAClF,oBAAOjC,IAAA,CAACH,yBAAyB;UAAC4F,QAAQ,EAAE,CAAC5E,QAAQ,GAAG,CAAC,GAAG,CAAC,CAAE;UAC7BoB,SAAS,EAAEuD,GAAI;UACfhB,IAAI,EAAC,QAAQ;UACbrC,EAAE,EAAEA,EAAG;UACP,eAAaC,UAAW;UACxB,oBAAAsC,MAAA,CAAkBvC,EAAE,qBAAmB;UACvC,yBAAuBa,gBAAiB;UACxC0C,WAAW,EAAEpG,yBAA0B;UACvCqG,SAAS,EAAE,SAAAA,UAAAC,CAAC,EAAI;YACd,IAAIA,CAAC,CAACC,GAAG,KAAK,OAAO,IAAID,CAAC,CAACC,GAAG,KAAK,GAAG,EAAE;cACtCD,CAAC,CAACE,cAAc,CAAC,CAAC;cAClBF,CAAC,CAACG,eAAe,CAAC,CAAC;cACnBlD,eAAe,CAAC,CAACD,YAAY,CAAC;cAC9BiB,oBAAoB,CAAC,IAAI,CAAC;YAC5B;UACF,CAAE;UACF/C,OAAO,EAAE,SAAAA,QAAA;YAAA,OAAM,CAACD,QAAQ,IAAIgC,eAAe,CAAC,CAACD,YAAY,CAAC;UAAA,CAAC;UAAAiC,QAAA,eAC3F3E,KAAA,CAACR,yBAAyB;YAAAmF,QAAA,GACvBjE,IAAI,iBAAIZ,IAAA,CAACL,sBAAsB;cAAAkF,QAAA,EAAEjE;YAAI,CAAyB,CAAC,eAChEZ,IAAA,CAACJ,wBAAwB;cAAAiF,QAAA,EAAEC;YAAK,CAA2B,CAAC,eAC5D9E,IAAA,CAACP,uBAAuB;cAAAoF,QAAA,EAEpBjC,YAAY,gBACR5C,IAAA,CAACF,WAAW,CAACkG,WAAW;gBAACzE,IAAI,EAAC;cAAM,CAAC,CAAC,gBACtCvB,IAAA,CAACF,WAAW,CAACmG,aAAa;gBAAC1E,IAAI,EAAC;cAAM,CAAC;YAAC,CAEvB,CAAC;UAAA,CACD;QAAC,CACH,CAAC;IAChC;EACF,CAAC;EAED,oBACErB,KAAA,CAACC,uBAAuB;IAAC8B,SAAS,EAAEA,SAAU;IAACvB,GAAG,EAAEsD,YAAa;IAAAa,QAAA,GAC9DT,YAAY,CAAC,CAAC,eACfpE,IAAA,CAACZ,eAAe;MACdsB,GAAG,EAAEoD,WAAY;MACjBoC,aAAa,EAAC,MAAM;MACpBlC,YAAY,EAAEA,YAAa;MAC3BmC,kBAAkB,EAAE;QAClBnF,SAAS,EAAEA,SAAS;QACpBC,MAAM,EAAEA,MAAM,aAANA,MAAM,cAANA,MAAM,GAAK,YAAM,CACzB,CAAE;QACFE,WAAW,EAAEA,WAAW;QACxBC,aAAa,EAAEA,aAAa;QAC5BgF,aAAa,EAAElC,iBAAiB;QAChCvC,WAAW,EAAEA,WAAW;QACxBN,UAAU,EAAEA,UAAU;QACtBC,aAAa,EAAEA,aAAa;QAC5BO,UAAU,EAAEA,UAAU;QACtBE,UAAU,EAAEA,UAAU;QACtBC,SAAS,EAAEA,SAAS;QACpBrB,KAAK,EAAEA;MACT,CAAE;MACF0F,yBAAyB,EAAE,SAAAA,0BAACT,CAAC;QAAA,OAAK3C,mBAAmB,CAAC2C,CAAC,CAAC;MAAA,CAAC;MACzDpC,OAAO,EAAEA,OAAQ;MACjBC,UAAU,EAAEA,UAAW;MACvBlC,IAAI,EAAEA,IAAK;MACXC,KAAK,EAAEA,KAAM;MACbC,SAAS,EAAEA,SAAU;MACrB6E,MAAM,EAAE1D,YAAa;MACrB2D,SAAS,EAAE1D,eAAgB;MAC3B2D,OAAO,EAAE5C,iBAAkB;MAC3BqB,MAAM,EAAC,EAAE;MACT7B,cAAc,EAAEf,IAAI,CAACgC,IAAI,KAAK,MAAM,IAAIrD,SAAS,KAAK,QAAQ,GAAG,EAAE,GAAGoC,cAAe;MACrFC,iBAAiB,EAAEA,iBAAkB;MACrCoD,kBAAkB,EAAC,YAAY;MAC/BC,QAAQ,EAAE,IAAK;MACfvE,EAAE,KAAAuC,MAAA,CAAKvC,EAAE;IAAmB,CAC7B,CAAC;EAAA,CACqB,CAAC;AAE9B,CAAC,CAAC;AAEF,eAAe5B,cAAc","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"DropdownButton.js","names":["React","IconButton","DropdownContent","styled","defaultOnMouseDownHandler","useClickOutsideRef","useFocusOutsideRef","DropdownButtonTextArrow","DropdownButtonTextContent","DropdownButtonTextIcon","DropdownButtonTextStyles","DropdownButtonTextWrapper","SystemIcons","jsx","_jsx","jsxs","_jsxs","DropdownButtonContainer","div","_templateObject","_taggedTemplateLiteral","DropdownButton","forwardRef","_ref","ref","items","icon","disabled","onClick","_ref$itemsType","itemsType","action","_ref$actionLabel","actionLabel","actionVariant","actionIcon","actionLoading","size","width","alignLeft","_ref$multiSelect","multiSelect","_ref$scrollable","scrollable","_ref$pinTopItem","pinTopItem","maxHeight","className","value","id","dataTestId","rest","_objectWithoutProperties","_excluded","_React$useState","useState","_React$useState2","_slicedToArray","dropdownOpen","setDropdownOpen","_React$useState3","_React$useState4","activeDescendant","setActiveDescendant","_React$useState5","_React$useState6","selectedValues","setSelectedValues","_React$useState7","_React$useState8","focused","setFocused","_React$useState9","_React$useState10","keyboardNavigated","setKeyboardNavigated","dropdownRef","useRef","containerRef","useEffect","handleValueSelect","values","renderButton","type","variant","shape","role","tooltip","concat","event","detail","children","label","keepLabel","length","filter","a","includes","map","_a$displayLabel","displayLabel","join","cls","tabIndex","onMouseDown","onKeyDown","e","key","preventDefault","stopPropagation","ArrowDropUp","ArrowDropDown","ariaRolesType","customizationProps","onValueUpdate","onActiveDescendantChanged","isOpen","setIsOpen","outline","messageOnNoResults","isButton"],"sources":["../../src/Dropdown/DropdownButton.tsx"],"sourcesContent":["/**\r\n * Import React libraries.\r\n */\r\nimport * as React from 'react';\r\n\r\n/**\r\n * Import custom components.\r\n */\r\nimport {IconButton} from '../Button';\r\nimport DropdownContent from './DropdownContent';\r\nimport styled from 'styled-components';\r\n\r\n/**\r\n * Import custom types.\r\n */\r\nimport {DropdownButtonProps} from './DropdownButtonTypes';\r\nimport {defaultOnMouseDownHandler, useClickOutsideRef, useFocusOutsideRef} from '../common';\r\nimport {\r\n DropdownButtonTextArrow,\r\n DropdownButtonTextContent,\r\n DropdownButtonTextIcon,\r\n DropdownButtonTextStyles,\r\n DropdownButtonTextWrapper\r\n} from './CommonStyling';\r\nimport {SystemIcons} from '../icons';\r\n\r\nexport const DropdownButtonContainer = styled.div`\r\n display: inline-block;\r\n`;\r\n\r\nconst DropdownButton = React.forwardRef( ({\r\n items,\r\n icon,\r\n disabled,\r\n onClick,\r\n itemsType = 'normal',\r\n action,\r\n actionLabel = '',\r\n actionVariant,\r\n actionIcon,\r\n actionLoading,\r\n size,\r\n width,\r\n alignLeft,\r\n multiSelect = false,\r\n scrollable = false,\r\n pinTopItem = false,\r\n maxHeight,\r\n className,\r\n value,\r\n id,\r\n dataTestId,\r\n ...rest\r\n }: DropdownButtonProps, ref: React.Ref<HTMLButtonElement>) => {\r\n // Globally used variables within the view.\r\n const [dropdownOpen, setDropdownOpen] = React.useState<boolean>(false);\r\n const [activeDescendant, setActiveDescendant] = React.useState<string>();\r\n const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\r\n const [focused, setFocused] = React.useState<number | null>(null);\r\n const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\r\n const dropdownRef = React.useRef<HTMLDivElement>(null);\r\n\r\n const containerRef = useFocusOutsideRef(() => setDropdownOpen(false), [dropdownRef]);\r\n useClickOutsideRef(() => setDropdownOpen(false), [], containerRef);\r\n\r\n React.useEffect(() => {\r\n !dropdownOpen && setKeyboardNavigated(false)\r\n }, [dropdownOpen]);\r\n\r\n React.useEffect(() => {\r\n disabled && setDropdownOpen(false)\r\n }, [disabled]);\r\n\r\n React.useEffect(() => {\r\n setSelectedValues(value || []);\r\n }, [value]);\r\n\r\n const handleValueSelect = (values: string[]) => {\r\n // Do all required actions\r\n onClick(values);\r\n };\r\n\r\n /**\r\n * Renders Icon Button dropdown menu.\r\n * @returns HTML View for the Icon button dropdown menu.\r\n */\r\n const renderButton = () => {\r\n switch (rest.type) {\r\n case 'icon':\r\n return (\r\n <IconButton ref={ref}\r\n variant=\"secondary\"\r\n shape=\"circular\"\r\n role=\"button\"\r\n tooltip={rest.tooltip}\r\n id={id}\r\n aria-expanded={dropdownOpen}\r\n data-testid={dataTestId}\r\n aria-controls={`${id}_dropdowncontent`}\r\n aria-activedescendant={activeDescendant}\r\n \r\n action={(event: any) => {\r\n setDropdownOpen(!dropdownOpen);\r\n if (event?.detail !== 1) {\r\n setKeyboardNavigated(true);\r\n }\r\n }}\r\n disabled={disabled}>\r\n {icon}\r\n </IconButton>\r\n );\r\n case 'text':\r\n const label = rest.keepLabel || !selectedValues?.length\r\n ? rest.label\r\n : items.filter(a => selectedValues.includes(a.value)).map(a => a.displayLabel ?? a.value).join(', ');\r\n const cls = `${disabled && 'disabled'} ${dropdownOpen && 'expanded'} ${className}`;\r\n return <DropdownButtonTextWrapper tabIndex={!disabled ? 0 : -1}\r\n className={cls}\r\n role=\"button\"\r\n id={id}\r\n data-testid={dataTestId}\r\n aria-expanded={dropdownOpen}\r\n aria-controls={`${id}_dropdowncontent`}\r\n aria-activedescendant={activeDescendant}\r\n onMouseDown={defaultOnMouseDownHandler}\r\n onKeyDown={e => {\r\n if (e.key === 'Enter' || e.key === ' ') {\r\n e.preventDefault();\r\n e.stopPropagation();\r\n setDropdownOpen(!dropdownOpen);\r\n setKeyboardNavigated(true);\r\n }\r\n }}\r\n onClick={() => !disabled && setDropdownOpen(!dropdownOpen)}>\r\n <DropdownButtonTextContent>\r\n {icon && <DropdownButtonTextIcon>{icon}</DropdownButtonTextIcon>}\r\n <DropdownButtonTextStyles>{label}</DropdownButtonTextStyles>\r\n <DropdownButtonTextArrow>\r\n {\r\n dropdownOpen\r\n ? <SystemIcons.ArrowDropUp aria-label='Expanded' size=\"24px\"/>\r\n : <SystemIcons.ArrowDropDown aria-label='Collapsed' size=\"24px\"/>\r\n }\r\n </DropdownButtonTextArrow>\r\n </DropdownButtonTextContent>\r\n </DropdownButtonTextWrapper>\r\n }\r\n };\r\n\r\n return (\r\n <DropdownButtonContainer className={className} ref={containerRef}> \r\n {renderButton()}\r\n <DropdownContent\r\n ref={dropdownRef}\r\n ariaRolesType=\"menu\"\r\n containerRef={containerRef}\r\n customizationProps={{\r\n itemsType: itemsType,\r\n action: action ?? (() => {\r\n }),\r\n actionLabel: actionLabel,\r\n actionVariant: actionVariant,\r\n onValueUpdate: handleValueSelect,\r\n multiSelect: multiSelect,\r\n actionIcon: actionIcon,\r\n actionLoading: actionLoading,\r\n scrollable: scrollable,\r\n pinTopItem: pinTopItem,\r\n maxHeight: maxHeight,\r\n items: items\r\n }}\r\n onActiveDescendantChanged={(e) => setActiveDescendant(e)}\r\n focused={focused}\r\n setFocused={setFocused}\r\n size={size}\r\n width={width}\r\n alignLeft={alignLeft}\r\n isOpen={dropdownOpen}\r\n setIsOpen={setDropdownOpen}\r\n outline={keyboardNavigated}\r\n filter=\"\"\r\n selectedValues={rest.type === 'icon' && itemsType === 'normal' ? [] : selectedValues}\r\n setSelectedValues={setSelectedValues}\r\n messageOnNoResults=\"No results\"\r\n isButton={true}\r\n id={`${id}_dropdowncontent`}\r\n />\r\n </DropdownButtonContainer>\r\n );\r\n});\r\n\r\nexport default DropdownButton;\r\n"],"mappings":"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","ignoreList":[]}
|