@laerdal/life-react-components 1.2.2-dev.8 → 1.3.1-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/esm/Accordion/AccordionItem.js +70 -0
- package/dist/esm/Accordion/AccordionItem.js.map +1 -0
- package/dist/esm/Accordion/AccordionMenu.js +61 -0
- package/dist/esm/Accordion/AccordionMenu.js.map +1 -0
- package/dist/esm/Accordion/__tests__/AccordionMenu.test.js +53 -0
- package/dist/esm/Accordion/__tests__/AccordionMenu.test.js.map +1 -0
- package/dist/esm/Accordion/index.js +4 -0
- package/dist/esm/Accordion/index.js.map +1 -0
- package/dist/esm/Accordion/styles.js +75 -0
- package/dist/esm/Accordion/styles.js.map +1 -0
- package/dist/esm/Banners/Banner.js +0 -1
- package/dist/esm/Banners/Banner.js.map +1 -1
- package/dist/esm/Button/BackButton.js +4 -4
- package/dist/esm/Button/BackButton.js.map +1 -1
- package/dist/esm/Button/Iconbutton.js +5 -2
- package/dist/esm/Button/Iconbutton.js.map +1 -1
- package/dist/esm/Button/__tests__/BackButton.test.js +4 -3
- package/dist/esm/Button/__tests__/BackButton.test.js.map +1 -1
- package/dist/esm/Chips/ActionChip.js +3 -2
- package/dist/esm/Chips/ActionChip.js.map +1 -1
- package/dist/esm/Chips/ChipInput.js +2 -1
- package/dist/esm/Chips/ChipInput.js.map +1 -1
- package/dist/esm/Chips/FilterChip.js +3 -2
- package/dist/esm/Chips/FilterChip.js.map +1 -1
- package/dist/esm/Chips/InputChip.js +3 -2
- package/dist/esm/Chips/InputChip.js.map +1 -1
- package/dist/esm/Dropdown/BasicDropdown.js +19 -12
- package/dist/esm/Dropdown/BasicDropdown.js.map +1 -1
- package/dist/esm/Dropdown/ChipDropdownInput.js +3 -2
- package/dist/esm/Dropdown/ChipDropdownInput.js.map +1 -1
- package/dist/esm/Dropdown/CommonStyling.js +69 -70
- package/dist/esm/Dropdown/CommonStyling.js.map +1 -1
- package/dist/esm/Dropdown/DropdownFilter.js +3 -4
- package/dist/esm/Dropdown/DropdownFilter.js.map +1 -1
- package/dist/esm/GlobalNavigationBar/Avatar.js +2 -2
- package/dist/esm/GlobalNavigationBar/Avatar.js.map +1 -1
- package/dist/esm/GlobalNavigationBar/ExtendedMainMenu.js +2 -1
- package/dist/esm/GlobalNavigationBar/ExtendedMainMenu.js.map +1 -1
- package/dist/esm/GlobalNavigationBar/Logo.js +10 -10
- package/dist/esm/GlobalNavigationBar/Logo.js.map +1 -1
- package/dist/esm/HyperLink/HyperLink.js +20 -17
- package/dist/esm/HyperLink/HyperLink.js.map +1 -1
- package/dist/esm/InputFields/Checkbox.js +27 -16
- package/dist/esm/InputFields/Checkbox.js.map +1 -1
- package/dist/esm/InputFields/Label.js +1 -2
- package/dist/esm/InputFields/Label.js.map +1 -1
- package/dist/esm/InputFields/PasswordField.js +0 -1
- package/dist/esm/InputFields/PasswordField.js.map +1 -1
- package/dist/esm/InputFields/QuickSearch.js +2 -2
- package/dist/esm/InputFields/QuickSearch.js.map +1 -1
- package/dist/esm/InputFields/RadioButton.js +21 -14
- package/dist/esm/InputFields/RadioButton.js.map +1 -1
- package/dist/esm/InputFields/ResponsiveComponentWrapper.js +2 -2
- package/dist/esm/InputFields/ResponsiveComponentWrapper.js.map +1 -1
- package/dist/esm/InputFields/SearchBar.js +13 -14
- package/dist/esm/InputFields/SearchBar.js.map +1 -1
- package/dist/esm/InputFields/TextField.js +0 -1
- package/dist/esm/InputFields/TextField.js.map +1 -1
- package/dist/esm/InputFields/Textarea.js +1 -2
- package/dist/esm/InputFields/Textarea.js.map +1 -1
- package/dist/esm/InputFields/__tests__/QuickSearch.test.js +2 -1
- package/dist/esm/InputFields/__tests__/QuickSearch.test.js.map +1 -1
- package/dist/esm/InputFields/components/SearchBarInput.js +0 -1
- package/dist/esm/InputFields/components/SearchBarInput.js.map +1 -1
- package/dist/esm/LoadingIndicator/LoadingIndicator.js +4 -4
- package/dist/esm/LoadingIndicator/LoadingIndicator.js.map +1 -1
- package/dist/esm/Modals/ModalContainer.js +5 -0
- package/dist/esm/Modals/ModalContainer.js.map +1 -1
- package/dist/esm/Modals/ModalDialog.js +76 -26
- package/dist/esm/Modals/ModalDialog.js.map +1 -1
- package/dist/esm/Modals/ModalStyles.js +38 -21
- package/dist/esm/Modals/ModalStyles.js.map +1 -1
- package/dist/esm/Modals/ModalTypes.js +2 -0
- package/dist/esm/Modals/ModalTypes.js.map +1 -0
- package/dist/esm/NotificationDot/NotificationDot.js +9 -9
- package/dist/esm/NotificationDot/NotificationDot.js.map +1 -1
- package/dist/esm/NotificationDot/__tests__/NotificationDot.test.js +3 -2
- package/dist/esm/NotificationDot/__tests__/NotificationDot.test.js.map +1 -1
- package/dist/esm/Paginator/Paginator.js +55 -48
- package/dist/esm/Paginator/Paginator.js.map +1 -1
- package/dist/esm/Paginator/__tests__/Paginator.test.js +4 -4
- package/dist/esm/Paginator/__tests__/Paginator.test.js.map +1 -1
- package/dist/esm/Table/Table.js +1 -1
- package/dist/esm/Table/Table.js.map +1 -1
- package/dist/esm/Tabs/HorizontalTabs.js +5 -5
- package/dist/esm/Tabs/HorizontalTabs.js.map +1 -1
- package/dist/esm/Tabs/TabLink.js +2 -2
- package/dist/esm/Tabs/TabLink.js.map +1 -1
- package/dist/esm/Tabs/Tabs.js +14 -14
- package/dist/esm/Tabs/Tabs.js.map +1 -1
- package/dist/esm/Tabs/VerticalTabs.js +2 -2
- package/dist/esm/Tabs/VerticalTabs.js.map +1 -1
- package/dist/esm/Tooltips/TooltipStyles.js +3 -3
- package/dist/esm/Tooltips/TooltipStyles.js.map +1 -1
- package/dist/esm/Tooltips/TooltipTypes.js.map +1 -1
- package/dist/esm/Tooltips/TooltipWrapper.js +4 -1
- package/dist/esm/Tooltips/TooltipWrapper.js.map +1 -1
- package/dist/esm/icons/index.js +1 -1
- package/dist/esm/icons/index.js.map +1 -1
- package/dist/esm/index.js +1 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/styles/typography.js +34 -14
- package/dist/esm/styles/typography.js.map +1 -1
- package/dist/esm/types.js +1 -0
- package/dist/esm/types.js.map +1 -1
- package/dist/js/Accordion/AccordionItem.d.ts +9 -0
- package/dist/js/Accordion/AccordionItem.js +101 -0
- package/dist/js/Accordion/AccordionItem.js.map +1 -0
- package/dist/js/Accordion/AccordionMenu.d.ts +17 -0
- package/dist/js/Accordion/AccordionMenu.js +111 -0
- package/dist/js/Accordion/AccordionMenu.js.map +1 -0
- package/dist/js/Accordion/__tests__/AccordionMenu.test.js +101 -0
- package/dist/js/Accordion/__tests__/AccordionMenu.test.js.map +1 -0
- package/dist/js/Accordion/index.d.ts +3 -0
- package/dist/js/Accordion/index.js +30 -0
- package/dist/js/Accordion/index.js.map +1 -0
- package/dist/js/Accordion/styles.d.ts +11 -0
- package/dist/js/Accordion/styles.js +52 -0
- package/dist/js/Accordion/styles.js.map +1 -0
- package/dist/js/Banners/Banner.d.ts +2 -1
- package/dist/js/Banners/Banner.js +0 -1
- package/dist/js/Banners/Banner.js.map +1 -1
- package/dist/js/Button/BackButton.d.ts +2 -1
- package/dist/js/Button/BackButton.js +5 -4
- package/dist/js/Button/BackButton.js.map +1 -1
- package/dist/js/Button/Iconbutton.d.ts +1 -1
- package/dist/js/Button/Iconbutton.js +16 -9
- package/dist/js/Button/Iconbutton.js.map +1 -1
- package/dist/js/Button/__tests__/BackButton.test.js +5 -3
- package/dist/js/Button/__tests__/BackButton.test.js.map +1 -1
- package/dist/js/Chips/ActionChip.js +4 -2
- package/dist/js/Chips/ActionChip.js.map +1 -1
- package/dist/js/Chips/ChipInput.js +3 -1
- package/dist/js/Chips/ChipInput.js.map +1 -1
- package/dist/js/Chips/ChipTypes.d.ts +3 -3
- package/dist/js/Chips/FilterChip.js +4 -2
- package/dist/js/Chips/FilterChip.js.map +1 -1
- package/dist/js/Chips/InputChip.js +4 -2
- package/dist/js/Chips/InputChip.js.map +1 -1
- package/dist/js/Dropdown/BasicDropdown.d.ts +6 -2
- package/dist/js/Dropdown/BasicDropdown.js +19 -12
- package/dist/js/Dropdown/BasicDropdown.js.map +1 -1
- package/dist/js/Dropdown/ChipDropdownInput.d.ts +0 -3
- package/dist/js/Dropdown/ChipDropdownInput.js +4 -2
- package/dist/js/Dropdown/ChipDropdownInput.js.map +1 -1
- package/dist/js/Dropdown/CommonStyling.d.ts +2 -0
- package/dist/js/Dropdown/CommonStyling.js +5 -3
- package/dist/js/Dropdown/CommonStyling.js.map +1 -1
- package/dist/js/Dropdown/DropdownFilter.d.ts +2 -1
- package/dist/js/Dropdown/DropdownFilter.js +3 -4
- package/dist/js/Dropdown/DropdownFilter.js.map +1 -1
- package/dist/js/GlobalNavigationBar/Avatar.js +2 -2
- package/dist/js/GlobalNavigationBar/Avatar.js.map +1 -1
- package/dist/js/GlobalNavigationBar/ExtendedMainMenu.js +3 -1
- package/dist/js/GlobalNavigationBar/ExtendedMainMenu.js.map +1 -1
- package/dist/js/GlobalNavigationBar/Logo.js +9 -9
- package/dist/js/GlobalNavigationBar/Logo.js.map +1 -1
- package/dist/js/HyperLink/HyperLink.d.ts +2 -2
- package/dist/js/HyperLink/HyperLink.js +19 -15
- package/dist/js/HyperLink/HyperLink.js.map +1 -1
- package/dist/js/InputFields/Checkbox.js +9 -5
- package/dist/js/InputFields/Checkbox.js.map +1 -1
- package/dist/js/InputFields/Label.d.ts +2 -1
- package/dist/js/InputFields/Label.js +0 -1
- package/dist/js/InputFields/Label.js.map +1 -1
- package/dist/js/InputFields/PasswordField.d.ts +2 -1
- package/dist/js/InputFields/PasswordField.js +0 -1
- package/dist/js/InputFields/PasswordField.js.map +1 -1
- package/dist/js/InputFields/QuickSearch.d.ts +2 -1
- package/dist/js/InputFields/QuickSearch.js +3 -2
- package/dist/js/InputFields/QuickSearch.js.map +1 -1
- package/dist/js/InputFields/RadioButton.js +3 -3
- package/dist/js/InputFields/RadioButton.js.map +1 -1
- package/dist/js/InputFields/ResponsiveComponentWrapper.d.ts +2 -1
- package/dist/js/InputFields/ResponsiveComponentWrapper.js +3 -2
- package/dist/js/InputFields/ResponsiveComponentWrapper.js.map +1 -1
- package/dist/js/InputFields/SearchBar.d.ts +2 -1
- package/dist/js/InputFields/SearchBar.js +15 -16
- package/dist/js/InputFields/SearchBar.js.map +1 -1
- package/dist/js/InputFields/TextField.d.ts +2 -1
- package/dist/js/InputFields/TextField.js +0 -1
- package/dist/js/InputFields/TextField.js.map +1 -1
- package/dist/js/InputFields/Textarea.d.ts +2 -1
- package/dist/js/InputFields/Textarea.js +0 -1
- package/dist/js/InputFields/Textarea.js.map +1 -1
- package/dist/js/InputFields/__tests__/QuickSearch.test.js +3 -1
- package/dist/js/InputFields/__tests__/QuickSearch.test.js.map +1 -1
- package/dist/js/InputFields/components/SearchBarInput.d.ts +2 -1
- package/dist/js/InputFields/components/SearchBarInput.js +0 -1
- package/dist/js/InputFields/components/SearchBarInput.js.map +1 -1
- package/dist/js/LoadingIndicator/LoadingIndicator.d.ts +2 -1
- package/dist/js/LoadingIndicator/LoadingIndicator.js +5 -4
- package/dist/js/LoadingIndicator/LoadingIndicator.js.map +1 -1
- package/dist/js/Modals/ModalContainer.js +1 -1
- package/dist/js/Modals/ModalContainer.js.map +1 -1
- package/dist/js/Modals/ModalDialog.d.ts +2 -6
- package/dist/js/Modals/ModalDialog.js +77 -46
- package/dist/js/Modals/ModalDialog.js.map +1 -1
- package/dist/js/Modals/ModalStyles.d.ts +6 -0
- package/dist/js/Modals/ModalStyles.js +34 -14
- package/dist/js/Modals/ModalStyles.js.map +1 -1
- package/dist/js/Modals/ModalTypes.d.ts +18 -0
- package/dist/js/Modals/ModalTypes.js +6 -0
- package/dist/js/Modals/ModalTypes.js.map +1 -0
- package/dist/js/NotificationDot/NotificationDot.d.ts +2 -1
- package/dist/js/NotificationDot/NotificationDot.js +10 -9
- package/dist/js/NotificationDot/NotificationDot.js.map +1 -1
- package/dist/js/NotificationDot/__tests__/NotificationDot.test.js +4 -2
- package/dist/js/NotificationDot/__tests__/NotificationDot.test.js.map +1 -1
- package/dist/js/Paginator/Paginator.js +37 -38
- package/dist/js/Paginator/Paginator.js.map +1 -1
- package/dist/js/Paginator/__tests__/Paginator.test.js +6 -6
- package/dist/js/Paginator/__tests__/Paginator.test.js.map +1 -1
- package/dist/js/Table/Table.js +1 -1
- package/dist/js/Table/Table.js.map +1 -1
- package/dist/js/Tabs/HorizontalTabs.d.ts +2 -2
- package/dist/js/Tabs/HorizontalTabs.js +3 -2
- package/dist/js/Tabs/HorizontalTabs.js.map +1 -1
- package/dist/js/Tabs/TabLink.d.ts +2 -1
- package/dist/js/Tabs/TabLink.js +3 -2
- package/dist/js/Tabs/TabLink.js.map +1 -1
- package/dist/js/Tabs/Tabs.d.ts +2 -1
- package/dist/js/Tabs/Tabs.js +15 -14
- package/dist/js/Tabs/Tabs.js.map +1 -1
- package/dist/js/Tabs/VerticalTabs.d.ts +2 -1
- package/dist/js/Tabs/VerticalTabs.js +3 -2
- package/dist/js/Tabs/VerticalTabs.js.map +1 -1
- package/dist/js/Tooltips/TooltipStyles.d.ts +4 -2
- package/dist/js/Tooltips/TooltipStyles.js +8 -2
- package/dist/js/Tooltips/TooltipStyles.js.map +1 -1
- package/dist/js/Tooltips/TooltipTypes.d.ts +1 -0
- package/dist/js/Tooltips/TooltipTypes.js.map +1 -1
- package/dist/js/Tooltips/TooltipWrapper.d.ts +1 -1
- package/dist/js/Tooltips/TooltipWrapper.js +5 -1
- package/dist/js/Tooltips/TooltipWrapper.js.map +1 -1
- package/dist/js/icons/index.js +1 -1
- package/dist/js/icons/index.js.map +1 -1
- package/dist/js/index.d.ts +1 -0
- package/dist/js/index.js +13 -0
- package/dist/js/index.js.map +1 -1
- package/dist/js/styles/typography.d.ts +3 -1
- package/dist/js/styles/typography.js +35 -14
- package/dist/js/styles/typography.js.map +1 -1
- package/dist/js/types.d.ts +1 -0
- package/dist/js/types.js +1 -0
- package/dist/js/types.js.map +1 -1
- package/dist/umd/Accordion/AccordionItem.js +98 -0
- package/dist/umd/Accordion/AccordionItem.js.map +1 -0
- package/dist/umd/Accordion/AccordionMenu.js +138 -0
- package/dist/umd/Accordion/AccordionMenu.js.map +1 -0
- package/dist/umd/Accordion/__tests__/AccordionMenu.test.js +74 -0
- package/dist/umd/Accordion/__tests__/AccordionMenu.test.js.map +1 -0
- package/dist/umd/Accordion/index.js +44 -0
- package/dist/umd/Accordion/index.js.map +1 -0
- package/dist/umd/Accordion/styles.js +101 -0
- package/dist/umd/Accordion/styles.js.map +1 -0
- package/dist/umd/Banners/Banner.js +0 -1
- package/dist/umd/Banners/Banner.js.map +1 -1
- package/dist/umd/Button/BackButton.js +7 -8
- package/dist/umd/Button/BackButton.js.map +1 -1
- package/dist/umd/Button/Iconbutton.js +16 -59
- package/dist/umd/Button/Iconbutton.js.map +1 -1
- package/dist/umd/Button/__tests__/BackButton.test.js +7 -7
- package/dist/umd/Button/__tests__/BackButton.test.js.map +1 -1
- package/dist/umd/Chips/ActionChip.js +6 -6
- package/dist/umd/Chips/ActionChip.js.map +1 -1
- package/dist/umd/Chips/ChipInput.js +5 -5
- package/dist/umd/Chips/ChipInput.js.map +1 -1
- package/dist/umd/Chips/FilterChip.js +6 -6
- package/dist/umd/Chips/FilterChip.js.map +1 -1
- package/dist/umd/Chips/InputChip.js +6 -6
- package/dist/umd/Chips/InputChip.js.map +1 -1
- package/dist/umd/Dropdown/BasicDropdown.js +19 -12
- package/dist/umd/Dropdown/BasicDropdown.js.map +1 -1
- package/dist/umd/Dropdown/ChipDropdownInput.js +6 -6
- package/dist/umd/Dropdown/ChipDropdownInput.js.map +1 -1
- package/dist/umd/Dropdown/CommonStyling.js +69 -70
- package/dist/umd/Dropdown/CommonStyling.js.map +1 -1
- package/dist/umd/Dropdown/DropdownFilter.js +3 -4
- package/dist/umd/Dropdown/DropdownFilter.js.map +1 -1
- package/dist/umd/GlobalNavigationBar/Avatar.js +2 -2
- package/dist/umd/GlobalNavigationBar/Avatar.js.map +1 -1
- package/dist/umd/GlobalNavigationBar/ExtendedMainMenu.js +5 -5
- package/dist/umd/GlobalNavigationBar/ExtendedMainMenu.js.map +1 -1
- package/dist/umd/GlobalNavigationBar/Logo.js +10 -10
- package/dist/umd/GlobalNavigationBar/Logo.js.map +1 -1
- package/dist/umd/HyperLink/HyperLink.js +68 -17
- package/dist/umd/HyperLink/HyperLink.js.map +1 -1
- package/dist/umd/InputFields/Checkbox.js +27 -16
- package/dist/umd/InputFields/Checkbox.js.map +1 -1
- package/dist/umd/InputFields/Label.js +0 -1
- package/dist/umd/InputFields/Label.js.map +1 -1
- package/dist/umd/InputFields/PasswordField.js +0 -1
- package/dist/umd/InputFields/PasswordField.js.map +1 -1
- package/dist/umd/InputFields/QuickSearch.js +5 -6
- package/dist/umd/InputFields/QuickSearch.js.map +1 -1
- package/dist/umd/InputFields/RadioButton.js +21 -14
- package/dist/umd/InputFields/RadioButton.js.map +1 -1
- package/dist/umd/InputFields/ResponsiveComponentWrapper.js +5 -6
- package/dist/umd/InputFields/ResponsiveComponentWrapper.js.map +1 -1
- package/dist/umd/InputFields/SearchBar.js +13 -14
- package/dist/umd/InputFields/SearchBar.js.map +1 -1
- package/dist/umd/InputFields/TextField.js +0 -1
- package/dist/umd/InputFields/TextField.js.map +1 -1
- package/dist/umd/InputFields/Textarea.js +0 -1
- package/dist/umd/InputFields/Textarea.js.map +1 -1
- package/dist/umd/InputFields/__tests__/QuickSearch.test.js +5 -5
- package/dist/umd/InputFields/__tests__/QuickSearch.test.js.map +1 -1
- package/dist/umd/InputFields/components/SearchBarInput.js +0 -1
- package/dist/umd/InputFields/components/SearchBarInput.js.map +1 -1
- package/dist/umd/LoadingIndicator/LoadingIndicator.js +7 -8
- package/dist/umd/LoadingIndicator/LoadingIndicator.js.map +1 -1
- package/dist/umd/Modals/ModalContainer.js +5 -0
- package/dist/umd/Modals/ModalContainer.js.map +1 -1
- package/dist/umd/Modals/ModalDialog.js +77 -29
- package/dist/umd/Modals/ModalDialog.js.map +1 -1
- package/dist/umd/Modals/ModalStyles.js +39 -22
- package/dist/umd/Modals/ModalStyles.js.map +1 -1
- package/dist/umd/Modals/ModalTypes.js +20 -0
- package/dist/umd/Modals/ModalTypes.js.map +1 -0
- package/dist/umd/NotificationDot/NotificationDot.js +12 -13
- package/dist/umd/NotificationDot/NotificationDot.js.map +1 -1
- package/dist/umd/NotificationDot/__tests__/NotificationDot.test.js +6 -6
- package/dist/umd/NotificationDot/__tests__/NotificationDot.test.js.map +1 -1
- package/dist/umd/Paginator/Paginator.js +56 -51
- package/dist/umd/Paginator/Paginator.js.map +1 -1
- package/dist/umd/Paginator/__tests__/Paginator.test.js +4 -4
- package/dist/umd/Paginator/__tests__/Paginator.test.js.map +1 -1
- package/dist/umd/Table/Table.js +1 -1
- package/dist/umd/Table/Table.js.map +1 -1
- package/dist/umd/Tabs/HorizontalTabs.js +8 -9
- package/dist/umd/Tabs/HorizontalTabs.js.map +1 -1
- package/dist/umd/Tabs/TabLink.js +5 -6
- package/dist/umd/Tabs/TabLink.js.map +1 -1
- package/dist/umd/Tabs/Tabs.js +17 -18
- package/dist/umd/Tabs/Tabs.js.map +1 -1
- package/dist/umd/Tabs/VerticalTabs.js +5 -6
- package/dist/umd/Tabs/VerticalTabs.js.map +1 -1
- package/dist/umd/Tooltips/TooltipStyles.js +5 -3
- package/dist/umd/Tooltips/TooltipStyles.js.map +1 -1
- package/dist/umd/Tooltips/TooltipTypes.js.map +1 -1
- package/dist/umd/Tooltips/TooltipWrapper.js +4 -1
- package/dist/umd/Tooltips/TooltipWrapper.js.map +1 -1
- package/dist/umd/icons/index.js +1 -1
- package/dist/umd/icons/index.js.map +1 -1
- package/dist/umd/index.js +13 -4
- package/dist/umd/index.js.map +1 -1
- package/dist/umd/styles/typography.js +37 -18
- package/dist/umd/styles/typography.js.map +1 -1
- package/dist/umd/types.js +1 -0
- package/dist/umd/types.js.map +1 -1
- package/package.json +10 -19
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/Dropdown/ChipDropdownInput.tsx"],"names":["Wrapper","styled","div","StyledChipInputContainer","COLORS","neutral_400","primary_100","critical_400","warning_400","primary_600","primary_800","primary_700","white","neutral_500","neutral_700","ChipInput","input","ComponentMStyling","ComponentTextStyle","black","StyledDropdownButton","Loading","label","secondaryLabel","value","list","onInputChange","disableSorting","messageOnNoResults","isButton","autofilledMessage","suggestion","excludeIcon","loading","maxSelectedItems","ChipDropdownInput","React","chipInput","styledFieldRef","setChips","newList","e","setGivenList","addChip","newChip","onValueChange","setValue","onAddChip","event","givenList","onRemoveChip","chips","newChips","onEditChip","options","option","o","setCurrentSearchResult","handleValueUpdate","values","setRestartFilter","handleKeyPress","matches","currentSearchResult","c","setDropdownIsOpen","handleClickOutside","document","dropdownItems","x","displayLabel","noteLabel","l","variants","index","placeholder","neutral_600","action","pinTopItem","itemsType","scrollable","actionLabel","multiSelect","onValueUpdate","items","inputId","validationMessage","validationType","critical_500"],"mappings":";;;;;;;;;;;;;;;;;;;;;MAGA,K;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAHA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAMA;AACA;AACA;;AAGA;AACA;AACA;AAOA,QAAMA,OAAO,GAAGC,2BAAOC,GAAI;AAC3B;AACA;AACA;AACA;AAJA,CAAA;AAOA,QAAMC,wBAAwB,GAAGF,gCAAM,8BAANA,CAA2B;AAC5D;AACA;AACA;AACA;AACA,gCAAgCG,eAAOC,WAAY;AACnD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwBD,eAAOE,WAAY;AAC3C;AACA;AACA;AACA,gDAAgDF,eAAOG,YAAa;AACpE,6CAA6CH,eAAOG,YAAa;AACjE,wCAAwCH,eAAOG,YAAa;AAC5D;AACA;AACA,gDAAgDH,eAAOI,WAAY;AACnE,6CAA6CJ,eAAOI,WAAY;AAChE,wCAAwCJ,eAAOI,WAAY;AAC3D;AACA;AACA;AACA,0CAA0CJ,eAAOK,WAAY;AAC7D,uCAAuCL,eAAOK,WAAY;AAC1D,kCAAkCL,eAAOK,WAAY;AACrD;AACA;AACA;AACA,0CAA0CL,eAAOM,WAAY;AAC7D,uCAAuCN,eAAOM,WAAY;AAC1D,kCAAkCN,eAAOM,WAAY;AACrD;AACA;AACA,0CAA0CN,eAAOO,WAAY;AAC7D,uCAAuCP,eAAOO,WAAY;AAC1D,kCAAkCP,eAAOO,WAAY;AACrD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,kBAAkBP,eAAOQ,KAAM;AAC/B;AACA;AACA;AACA;AACA,kBAAkBR,eAAOS,WAAY;AACrC;AACA;AACA;AACA;AACA;AACA,kBAAkBT,eAAOU,WAAY;AACrC;AACA;AArEA,CAAA;AAwEA,QAAMC,SAAS,GAAGd,2BAAOe,KAAM;AAC/B;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIC,mCAAkBC,+BAAD,OAAjBD,EAA8Cb,eAA7B,KAAjBa,CAA4D;AAChE,WAAWb,eAAOe,KAAM;AACxB;AAVA,CAAA;AAaA,QAAMC,oBAAoB,GAAGnB,gCAAM,6BAANA,CAAuB;AACpD;AACA;AACA;AACA;AACA;AACA;AANA,CAAA;AASA,QAAMoB,OAAO,GAAGpB,2BAAOC,GAAI;AAC3B;AACA;AACA;AACA;AACA;AALA,CAAA;;AA2BA,QAAMiC,iBAAkE,GAAG,CAAC;AAAA,IAAA,IAAA;AAAA,IAAA,aAAA;AAAA,IAAA,cAAA;AAAA,IAAA,kBAAA;AAAA,IAAA,MAAA;AAAA,IAAA,OAAA;AAAA,IAAA,QAAA;AAAA,IAAA,WAAA;AAAA,IAAA,cAAA;AAAA,IAAA,iBAAA;AAAA,IAAA,aAAA;AAAA,IAAA,UAAA;AAAA,IAAA,WAAA;AAAA,IAAA,OAAA;AAe1ED,IAAAA;AAf0E,GAAD,KAgB7C;AAC5B;AACA,UAAM,CAAA,SAAA,EAAA,YAAA,IAA4BE,KAAK,CAALA,QAAAA,CAAlC,EAAkCA,CAAlC;AACA,UAAM,CAAA,KAAA,EAAA,QAAA,IAAoBA,KAAK,CAALA,QAAAA,CAA1B,EAA0BA,CAA1B;AACA,UAAM,CAAA,KAAA,EAAA,QAAA,IAAoBA,KAAK,CAALA,QAAAA,CAA1B,EAA0BA,CAA1B;AACA,UAAM,CAAA,cAAA,EAAA,iBAAA,IAAsCA,KAAK,CAALA,QAAAA,CAA5C,KAA4CA,CAA5C;AACA,UAAM,CAAA,mBAAA,EAAA,sBAAA,IAAgDA,KAAK,CAA3D,QAAsDA,EAAtD;AACA,UAAM,CAAA,aAAA,EAAA,gBAAA,IAAoCA,KAAK,CAALA,QAAAA,CAA1C,KAA0CA,CAA1C;AACA,UAAM,CAAA,OAAA,EAAA,UAAA,IAAwBA,KAAK,CAALA,QAAAA,CARF,IAQEA,CAA9B,CAR4B,CAU5B;;AACA,UAAMC,SAAS,GAAGD,KAAK,CAAvB,MAAkBA,EAAlB;AACA,UAAME,cAAc,GAAGF,KAAK,CAALA,MAAAA,CAAvB,IAAuBA,CAAvB;AAEA;AACF;AACA;;AACEA,IAAAA,KAAK,CAALA,SAAAA,CAAgB,MAAM;AACpB;AACAG,MAAAA,QAAQ,CAARA,MAAQ,CAARA;AAFFH,KAAAA,EAGG,CAHHA,MAGG,CAHHA;AAKA;AACF;AACA;;AACEA,IAAAA,KAAK,CAALA,SAAAA,CAAgB,MAAM;AACpB,UAAI,OAAOX,IAAI,CAAX,CAAW,CAAX,KAAJ,QAAA,EAAiC;AAC/B,cAAMe,OAAe,GAAIf,IAAD,CAAA,GAACA,CAAuBgB,CAAD,KAAgB;AAAEnB,UAAAA,KAAK,EAAP,CAAA;AAAYE,UAAAA,KAAK,EAAEiB;AAAnB,SAAhB,CAAtBhB,CAAzB;AACAiB,QAAAA,YAAY,CAAZA,OAAY,CAAZA;AAFF,OAAA,MAGO;AACLA,QAAAA,YAAY,CAAZA,IAAY,CAAZA;AACD;AANHN,KAAAA,EAOG,CAPHA,IAOG,CAPHA;;AASA,UAAMO,OAAO,GAAIC,OAAD,IAAqB;AACnC;AACAL,MAAAA,QAAQ,CAAC,CAAC,GAAD,KAAA,EAATA,OAAS,CAAD,CAARA;AACAM,MAAAA,aAAa,CAAC,CAAC,GAAD,KAAA,EAHqB,OAGrB,CAAD,CAAbA,CAHmC,CAKnC;;AACAR,MAAAA,SAAS,CAATA,OAAAA,CAAAA,KAAAA,GAAAA,EAAAA;AACAS,MAAAA,QAAQ,CAARA,EAAQ,CAARA;AAPF,KAAA;AAUA;AACF;AACA;AACA;;;AACE,UAAMC,SAAS,GAAIC,KAAD,IAAwD;AACxE;AACA,UAAI,CAACA,KAAK,CAALA,OAAAA,KAAAA,EAAAA,IAAwBA,KAAK,CAALA,OAAAA,KAAxBA,EAAAA,IAAgDA,KAAK,CAALA,OAAAA,KAAjD,GAAA,KAAJ,KAAA,EAAsF;AACpF,YAAI,CAACC,SAAS,CAATA,IAAAA,CAAgBR,CAAD,IAAOA,CAAC,CAADA,KAAAA,KAA3B,KAAKQ,CAAL,EAA+C;AAC7CH,UAAAA,QAAQ,CAARA,EAAQ,CAARA;AACA;AAHkF,SAAA,CAKpF;;;AACAE,QAAAA,KAAK,CAALA,cAAAA;AAEAL,QAAAA,OAAO,CAAPA,KAAO,CAAPA;AACD;;AACD,UAAIK,KAAK,CAALA,OAAAA,KAAAA,CAAAA,IAAuBxB,KAAK,KAAhC,EAAA,EAAyC;AACvC0B,QAAAA,YAAY,CAACC,KAAK,CAALA,MAAAA,GAAbD,CAAY,CAAZA;AACD;AAdH,KAAA;AAiBA;AACF;AACA;AACA;AACA;;;AACE,UAAMA,YAAY,GAAG,CAAA,KAAA,EAAA,YAAA,KAAgD;AACnE;AACA,YAAME,QAAQ,GAAG,CAAC,GAFiD,KAElD,CAAjB,CAFmE,CAInE;AACA;;AACA,UAAA,YAAA,EAAkB;AAChBA,QAAAA,QAAQ,CAARA,MAAAA,CAAAA,KAAAA,EAAAA,CAAAA,EAAAA,YAAAA;AADF,OAAA,MAEO;AACLA,QAAAA,QAAQ,CAARA,MAAAA,CAAAA,KAAAA,EAAAA,CAAAA;AATiE,OAAA,CAYnE;;;AACAb,MAAAA,QAAQ,CAAC,CAAC,GAAVA,QAAS,CAAD,CAARA;AACAM,MAAAA,aAAa,CAAC,CAAC,GAAfA,QAAc,CAAD,CAAbA;AAdF,KAAA;AAiBA;AACF;AACA;AACA;AACA;;;AACE,UAAMQ,UAAU,GAAG,CAAA,IAAA,EAAA,KAAA,KAAuC;AACxD;AACA,UAAIhB,SAAS,CAATA,OAAAA,CAAAA,KAAAA,KAAJ,EAAA,EAAoC;AAClC;AACAa,QAAAA,YAAY,CAAA,KAAA,EAAQb,SAAS,CAATA,OAAAA,CAApBa,KAAY,CAAZA;AAFF,OAAA,MAGO;AACL;AACAA,QAAAA,YAAY,CAAZA,KAAY,CAAZA;AAPsD,OAAA,CAUxD;;;AACAb,MAAAA,SAAS,CAATA,OAAAA,CAAAA,KAAAA,GAAAA,IAAAA;AACAS,MAAAA,QAAQ,CAARA,IAAQ,CAARA;AAZF,KAAA;;AAeAV,IAAAA,KAAK,CAALA,SAAAA,CAAgB,MAAM;AACpB,UAAIkB,OAAO,GAAG,CAAC,GAAf,SAAc,CAAd;;AACA,UAAI,CAAA,aAAA,IAAkB9B,KAAK,KAA3B,EAAA,EAAoC;AAClC8B,QAAAA,OAAO,GAAGA,OAAO,CAAPA,MAAAA,CAAgBC,MAAD,IAAYA,MAAM,CAANA,KAAAA,CAAAA,WAAAA,GAAAA,OAAAA,CAAmC/B,KAAK,CAAxC+B,WAAmC/B,EAAnC+B,MAA4D,CAAjGD,CAAUA,CAAVA;AACD;;AACD,UAAI,CAAJ,cAAA,EAAqB;AACnBA,QAAAA,OAAO,GAAGA,OAAO,CAAjBA,IAAUA,EAAVA;AACD;;AACDA,MAAAA,OAAO,GAAGA,OAAO,CAAPA,MAAAA,CAAgBE,CAAD,IAAO,CAACL,KAAK,CAALA,QAAAA,CAAeK,CAAC,CAAjDF,KAAiCH,CAAvBG,CAAVA;AACAG,MAAAA,sBAAsB,CAAtBA,OAAsB,CAAtBA;AATFrB,KAAAA,EAUG,CAAA,KAAA,EAAA,SAAA,EAVHA,KAUG,CAVHA;;AAYA,UAAMsB,iBAAiB,GAAIC,MAAD,IAAsB;AAC9CC,MAAAA,gBAAgB,CAAhBA,IAAgB,CAAhBA;AACAjB,MAAAA,OAAO,CAACgB,MAAM,CAAdhB,CAAc,CAAP,CAAPA;AACAN,MAAAA,SAAS,EAATA,OAAAA,EAAAA,KAAAA;AAHF,KAAA;;AAMA,UAAMwB,cAAc,GAAIpB,CAAD,IAAY;AACjC,UAAIH,cAAc,EAAdA,OAAAA,IAA2BA,cAAc,CAAdA,OAAAA,CAAAA,QAAAA,CAAgCG,CAAC,CAAhE,MAA+BH,CAA/B,EAA0E;AACxE,YAAIG,CAAC,CAADA,OAAAA,KAAJ,EAAA,EAAsB;AACpB,gBAAMqB,OAAO,GAAGC,mBAAmB,EAAnBA,MAAAA,CAA6BC,CAAD,IAAOA,CAAC,CAADA,KAAAA,CAAAA,WAAAA,OAA0BxC,KAAK,CAAlF,WAA6EA,EAA7DuC,CAAhB;;AACA,cAAID,OAAO,EAAPA,MAAAA,KAAoB;AAAE;AAA1B,YAA2C;AACzCnB,YAAAA,OAAO,CAACmB,OAAO,CAAPA,CAAO,CAAPA,CADiC,KAClC,CAAPnB,CADyC,CAEzC;AAFF,WAAA,MAGO,IAAIF,CAAC,CAADA,MAAAA,CAAAA,KAAAA,KAAmBV,UAAU,EAAjC,KAAA,EAA0C;AAC/CY,YAAAA,OAAO,CAACF,CAAC,CAADA,MAAAA,CAARE,KAAO,CAAPA;AACD;;AAEDsB,UAAAA,iBAAiB,CAAC,CAAlBA,cAAiB,CAAjBA;;AACA,cAAIH,OAAO,EAAPA,MAAAA,KAAJ,CAAA,EAA2B;AACzBhB,YAAAA,QAAQ,CAARA,EAAQ,CAARA;AACD;AAZH,SAAA,MAaO,IAAIL,CAAC,CAADA,OAAAA,KAAJ,EAAA,EAAsB;AAC3BwB,UAAAA,iBAAiB,CAAC,CAAlBA,cAAiB,CAAjBA;AACD;AACF;AAlBH,KAAA;;AAqBA,UAAMC,kBAAkB,GAAIzB,CAAD,IAAY;AACrC,UAAIH,cAAc,EAAdA,OAAAA,IAA2B,CAACA,cAAc,CAAdA,OAAAA,CAAAA,QAAAA,CAAgCG,CAAC,CAAjE,MAAgCH,CAAhC,EAA2E;AACzE,YAAA,cAAA,EAAoB;AAClB2B,UAAAA,iBAAiB,CAAjBA,KAAiB,CAAjBA;;AACA,cAAI,CAAChB,SAAS,CAATA,IAAAA,CAAgBR,CAAD,IAAOA,CAAC,CAADA,KAAAA,KAA3B,KAAKQ,CAAL,EAA+C;AAC7CH,YAAAA,QAAQ,CAARA,EAAQ,CAARA;AACD;AACF;AACF;AARH,KAAA;;AAWAV,IAAAA,KAAK,CAALA,SAAAA,CAAgB,MAAM;AACpB+B,MAAAA,QAAQ,CAARA,gBAAAA,CAAAA,UAAAA,EAAAA,cAAAA;AACAA,MAAAA,QAAQ,CAARA,gBAAAA,CAAAA,OAAAA,EAAAA,kBAAAA;AACA,aAAO,MAAM;AACXA,QAAAA,QAAQ,CAARA,mBAAAA,CAAAA,UAAAA,EAAAA,cAAAA;AACAA,QAAAA,QAAQ,CAARA,mBAAAA,CAAAA,OAAAA,EAAAA,kBAAAA;AAFF,OAAA;AAHF/B,KAAAA;AASA;AACF;AACA;;AAEE,QAAIgC,aAA6B,GAAjC,EAAA;AACA,QAAA,mBAAA,EACE,aAAa,GAAG,mBAAmB,CAAnB,GAAA,CAAwBC,CAAC,KAAK;AAAE7C,MAAAA,KAAK,EAAE6C,CAAC,CAAV,KAAA;AAAkBC,MAAAA,YAAY,EAAED,CAAC,CAAjC,KAAA;AAAyCE,MAAAA,SAAS,EAAEF,CAAC,CAAC9C;AAAtD,KAAL,CAAzB,CAAhB;AAEF,QAAGQ,UAAU,IAAI,CAACoB,KAAK,CAALA,QAAAA,CAAepB,UAAU,CAA3C,KAAkBoB,CAAlB,EACE,aAAa,GAAG,CAAC;AAAE3B,MAAAA,KAAK,EAAEO,UAAU,CAAnB,KAAA;AAA2BuC,MAAAA,YAAY,EAAEvC,UAAU,CAAnD,KAAA;AAA2DwC,MAAAA,SAAS,EAAExC,UAAU,CAAhF,cAAA;AAAiGA,MAAAA,UAAU,EAAE;AAA7G,KAAD,EAAsH,GAAtI,aAAgB,CAAhB;AAEF,WAAA,aACE,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,IAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,wBAAA,EAAA;AACE,MAAA,EAAE,EADJ,OAAA;AAEE,MAAA,OAAO,EAAGU,CAAD,IAAY;AACnBA,QAAAA,CAAC,CAADA,eAAAA;AACAwB,QAAAA,iBAAiB,CAAjBA,IAAiB,CAAjBA;AACA5B,QAAAA,SAAS,CAATA,OAAAA,CAAAA,KAAAA;AALJ,OAAA;AAOE,MAAA,SAAS,EAPX,cAAA;AAQE,MAAA,GAAG,EAAEC;AARP,KAAA,EAAA,aASE,KAAA,CAAA,aAAA,CAAA,mBAAA,EAAA;AAAQ,MAAA,IAAI,EAAZ,MAAA;AAAoB,MAAA,SAAS,EAAC;AAA9B,KAAA,CATF,EAUG,KAAK,EAAL,GAAA,CAAW,CAAA,IAAA,EAAA,KAAA,KAAA,aACV,KAAA,CAAA,aAAA,CAAA,gBAAA,EAAA;AACE,MAAA,IAAI,EAAEW,SAAS,CAATA,IAAAA,CAAgBuB,CAAD,IAAaA,CAAC,CAADA,KAAAA,KAA5BvB,IAAAA,IAAAA,MAAAA,GADR,SAAA;AAEE,MAAA,IAAI,EAFN,QAAA;AAGE,MAAA,OAAO,EAAEwB,QAAQ,IAAIA,QAAQ,EAApBA,MAAAA,IAAgCA,QAAQ,CAAxCA,KAAwC,CAAxCA,GAAkDA,QAAQ,CAA1DA,KAA0D,CAA1DA,GAHX,QAAA;AAIE,MAAA,IAAI,EAJN,IAAA;AAKE,MAAA,QAAQ,EAAE,MAAMvB,YAAY,CAL9B,KAK8B,CAL9B;AAME,MAAA,OAAO,EAAE,MAAMG,UAAU,CAAA,IAAA,EAN3B,KAM2B,CAN3B;AAOE,MAAA,GAAG,EAAG,QAAOqB,KAAM;AAPrB,KAAA,CADD,CAVH,EAAA,aAqBE,KAAA,CAAA,aAAA,CAAA,SAAA,EAAA;AACE,MAAA,IAAI,EADN,MAAA;AAEE,MAAA,QAAQ,EAAG1B,KAAD,IAAgD;AACxDF,QAAAA,QAAQ,CAACE,KAAK,CAALA,MAAAA,CAATF,KAAQ,CAARA;AACAc,QAAAA,gBAAgB,CAAhBA,KAAgB,CAAhBA;AACAK,QAAAA,iBAAiB,CAAjBA,IAAiB,CAAjBA;;AACA,YAAA,aAAA,EAAmB;AACjBvC,UAAAA,aAAa,CAACsB,KAAK,CAALA,MAAAA,CAAAA,KAAAA,IAAdtB,EAAa,CAAbA;AACD;AARL,OAAA;AAUE,MAAA,SAAS,EAAGsB,KAAD,IAAkD;AAC3DD,QAAAA,SAAS,CAATA,KAAS,CAATA;AAXJ,OAAA;AAaE,MAAA,WAAW,EAAE4B,WAAW,IAAIxB,KAAK,EAALA,MAAAA,KAAfwB,CAAAA,GAAAA,WAAAA,GAbf,EAAA;AAcE,MAAA,OAAO,EAAGlC,CAAD,IAAY;AACnBA,QAAAA,CAAC,CAADA,eAAAA;AACAwB,QAAAA,iBAAiB,CAAjBA,IAAiB,CAAjBA;AAhBJ,OAAA;AAkBE,MAAA,OAAO,EAAE,MAAM;AACbA,QAAAA,iBAAiB,CAAjBA,IAAiB,CAAjBA;AAnBJ,OAAA;AAqBE,MAAA,GAAG,EAAE5B;AArBP,KAAA,CArBF,EA4CGJ,OAAO,GAAA,aACN,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,IAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,kCAAA,EAAA;AAAkB,MAAA,IAAI,EAAtB,OAAA;AAA+B,MAAA,KAAK,EAAE7B,eAAOwE;AAA7C,KAAA,CADF,CADM,GA7CZ,IACE,CADF,EAmDG,CAAC,CAAA,gBAAA,IAAsB1C,gBAAgB,IAAIiB,KAAK,CAALA,MAAAA,GAA3C,gBAAA,KAAA,aACC,KAAA,CAAA,aAAA,CAAA,yBAAA,EAAA;AACE,MAAA,kBAAkB,EAAE;AAClB0B,QAAAA,MAAM,EAAE,MAAM,CADI,CAAA;AAElBC,QAAAA,UAAU,EAFQ,IAAA;AAIlBC,QAAAA,SAAS,EAJS,QAAA;AAKlBC,QAAAA,UAAU,EALQ,IAAA;AAMlBC,QAAAA,WAAW,EANO,EAAA;AAOlBC,QAAAA,WAAW,EAPO,KAAA;AAQlBC,QAAAA,aAAa,EARK,iBAAA;AASlBC,QAAAA,KAAK,EAAEhB;AATW,OADtB;AAYE,MAAA,OAAO,EAZT,OAAA;AAaE,MAAA,UAAU,EAbZ,UAAA;AAcE,MAAA,kBAAkB,EAdpB,KAAA;AAeE,MAAA,cAAc,EAfhB,EAAA;AAgBE,MAAA,kBAAkB,EAAExC,kBAAkB,IAhBxC,EAAA;AAiBE,MAAA,iBAAiB,EAAE,MAAM,CAjB3B,CAAA;AAkBE,MAAA,MAAM,EAlBR,cAAA;AAmBE,MAAA,SAAS,EAnBX,iBAAA;AAoBE,MAAA,MAAM,EApBR,EAAA;AAqBE,MAAA,QAAQ,EArBV,KAAA;AAsBE,MAAA,EAAE,EAAG,GAAEyD,OAAQ;AAtBjB,KAAA,CApDJ,EA8EGC,iBAAiB,IAAIC,cAAc,KAAnCD,SAAAA,GAAAA,aACC,KAAA,CAAA,aAAA,CAAA,uBAAA,EAAA,IAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,6BAAA,EAAA;AAAkB,MAAA,IAAI,EAAtB,MAAA;AAA8B,MAAA,KAAK,EAAElF,eAAOoF;AAA5C,KAAA,CADF,EAAA,aAEE,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,IAAA,EAHHF,iBAGG,CAFF,CADDA,GAMCC,cAAc,KAAdA,OAAAA,IAAAA,aACE,KAAA,CAAA,aAAA,CAAA,qBAAA,EAAA,IAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,6BAAA,EAAA;AAAkB,MAAA,IAAI,EAAtB,MAAA;AAA8B,MAAA,KAAK,EAAEnF,eAAOG;AAA5C,KAAA,CADF,EAAA,aAEE,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,IAAA,EAxFV,iBAwFU,CAFF,CArFN,CADF;AAjMF,GAAA;;;AAZEkB,IAAAA,I;AANAH,MAAAA,K;AACAC,MAAAA,c;AACAC,MAAAA,K;;AAKAE,IAAAA,a;AACAC,IAAAA,c;AACAC,IAAAA,kB;AACAC,IAAAA,Q;AACAC,IAAAA,iB;AACAC,IAAAA,U;AAZAT,MAAAA,K;AACAC,MAAAA,c;AACAC,MAAAA,K;;AAWAQ,IAAAA,W;AACAC,IAAAA,O;AACAC,IAAAA,gB;;oBAoSF,iB","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\n\n/**\n * Import custom components.\n */\nimport { InputChip } from '../Chips/index';\nimport { Search, TechnicalWarning, User } from '../icons/systemicons/SystemIcons';\nimport { WarningMessage, ErrorMessage } from '../InputFields/styling';\nimport { COLORS } from '../styles';\n\n/**\n * Import custom styles.\n */\nimport { ChipInputContainer } from '../Chips/ChipStyles';\n\n/**\n * Import custom types.\n */\nimport { ChipInputProps } from '../Chips/ChipTypes';\nimport { DropdownButton } from './CommonStyling';\nimport DropdownContent, { DropdownItem } from './DropdownContent';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { ComponentMStyling, ComponentXXSStyling, ComponentTextStyle } from '../styles/typography';\n\nconst Wrapper = styled.div`\n position: relative;\n display: inline-block;\n width: 100%;\n min-width: 344px;\n`;\n\nconst StyledChipInputContainer = styled(ChipInputContainer)`\n padding: 2px 2px 2px 48px !important;\n min-height: 56px;\n max-height: 176px;\n overflow-y: auto;\n box-shadow: 0px 0px 0px 1px ${COLORS.neutral_400};\n\n .medium {\n margin-right: 8px !important;\n }\n .SearchIcon {\n position: absolute;\n left: 18px;\n top: 18px;\n }\n\n &:active {\n background-color: ${COLORS.primary_100};\n }\n\n &.invalid {\n -webkit-box-shadow: inset 0px 0px 0px 2px ${COLORS.critical_400};\n -moz-box-shadow: inset 0px 0px 0px 2px ${COLORS.critical_400};\n box-shadow: inset 0px 0px 0px 2px ${COLORS.critical_400};\n }\n &.alreadyInOrganization {\n -webkit-box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n -moz-box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n }\n\n &.empty:hover {\n -webkit-box-shadow: 0px 0px 0px 2px ${COLORS.primary_600};\n -moz-box-shadow: 0px 0px 0px 2px ${COLORS.primary_600};\n box-shadow: 0px 0px 0px 2px ${COLORS.primary_600};\n }\n\n &.inputHasFocus {\n -webkit-box-shadow: 0px 0px 0px 2px ${COLORS.primary_800};\n -moz-box-shadow: 0px 0px 0px 2px ${COLORS.primary_800};\n box-shadow: 0px 0px 0px 2px ${COLORS.primary_800};\n }\n &:hover {\n -webkit-box-shadow: 0px 0px 0px 2px ${COLORS.primary_700};\n -moz-box-shadow: 0px 0px 0px 2px ${COLORS.primary_700};\n box-shadow: 0px 0px 0px 2px ${COLORS.primary_700};\n }\n\n /* width */\n ::-webkit-scrollbar {\n width: 4px;\n cursor: pointer;\n }\n\n /* Track */\n ::-webkit-scrollbar-track {\n background: ${COLORS.white};\n }\n\n /* Handle */\n ::-webkit-scrollbar-thumb {\n background: ${COLORS.neutral_500};\n border-radius: 8px;\n }\n\n /* Handle on hover */\n ::-webkit-scrollbar-thumb:hover {\n background: ${COLORS.neutral_700};\n cursor: pointer;\n }\n`;\n\nconst ChipInput = styled.input`\n height: 40px;\n width: auto;\n display: inline-flex;\n border: none;\n outline: none;\n margin: 4px;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n color: ${COLORS.black} !important;\n background-color: inherit;\n`;\n\nconst StyledDropdownButton = styled(DropdownButton)`\n display: flex;\n width: 98%;\n margin-left: 3px;\n svg {\n margin: auto 0 auto 0;\n }\n`;\n\nconst Loading = styled.div`\n margin: auto 16px auto auto !important;\n height: 20px;\n div {\n height: 20px;\n }\n`;\n\ninterface List {\n label: string;\n secondaryLabel?: string;\n value: string;\n}\n\ninterface ChipDropdownInputProps extends ChipInputProps {\n list: List[] | string[];\n onInputChange?: (input: string) => void;\n disableSorting?: boolean;\n messageOnNoResults?: string;\n isButton?: boolean;\n autofilledMessage?: string;\n suggestion?: List;\n excludeIcon?: boolean;\n loading?: boolean;\n maxSelectedItems?: number;\n}\n\nconst ChipDropdownInput: React.FunctionComponent<ChipDropdownInputProps> = ({\n list,\n onInputChange,\n disableSorting,\n messageOnNoResults,\n values,\n inputId,\n variants,\n placeholder,\n validationType,\n validationMessage,\n onValueChange,\n suggestion,\n excludeIcon,\n loading,\n maxSelectedItems,\n}: ChipDropdownInputProps) => {\n // Initiate states\n const [givenList, setGivenList] = React.useState<List[]>([]);\n const [chips, setChips] = React.useState<string[]>([]);\n const [value, setValue] = React.useState<string>('');\n const [dropdownIsOpen, setDropdownIsOpen] = React.useState<boolean>(false);\n const [currentSearchResult, setCurrentSearchResult] = React.useState<List[]>();\n const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n const [focused, setFocused] = React.useState<number | null>(null);\n\n // Initiate refs\n const chipInput = React.useRef<any>();\n const styledFieldRef = React.useRef<HTMLDivElement>(null);\n\n /**\n * Sets initial values for the chips.\n */\n React.useEffect(() => {\n // Let's add initial chip values\n setChips(values);\n }, [values]);\n\n /**\n * Convert string[] to List[] if necessary\n */\n React.useEffect(() => {\n if (typeof list[0] === 'string') {\n const newList: List[] = (list as string[]).map((e: string) => ({ label: e, value: e }));\n setGivenList(newList);\n } else {\n setGivenList(list as List[]);\n }\n }, [list]);\n\n const addChip = (newChip: string) => {\n // Let's add the chip\n setChips([...chips, newChip]);\n onValueChange([...chips, newChip]);\n\n // Let's clear the old value\n chipInput.current.value = '';\n setValue('');\n };\n\n /**\n * Adds a chip to the chip list.\n * @param event - Event handler from the key down event.\n */\n const onAddChip = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n // Let's trigger only on enter, comma and space key press\n if ((event.keyCode === 13 || event.keyCode === 32 || event.keyCode === 188) && value) {\n if (!givenList.find((e) => e.value === value)) {\n setValue('');\n return;\n }\n // Let's prevent default action - adding new key to the value\n event.preventDefault();\n\n addChip(value);\n }\n if (event.keyCode === 8 && value === '') {\n onRemoveChip(chips.length - 1);\n }\n };\n\n /**\n * Removes a specific chip from the chip list.\n * @param index - Index of the chip that needs to be removed.\n * @param elementToAdd - Element which needs to be added in the deleted element place.\n */\n const onRemoveChip = (index: number, elementToAdd?: string): void => {\n // Let's copy the chips\n const newChips = [...chips];\n\n // Let's delete the chip\n // If necessary, let's replace it with a different chip\n if (elementToAdd) {\n newChips.splice(index, 1, elementToAdd);\n } else {\n newChips.splice(index, 1);\n }\n\n // Let's update the chip list\n setChips([...newChips]);\n onValueChange([...newChips]);\n };\n\n /**\n * Changes a status of the chip to edit.\n * @param text - Text of the chip that is being edited.\n * @param index - Index of the chip in the array.\n */\n const onEditChip = (text: string, index: number): void => {\n // Let's check if we have to add value as a chip (in case we have entered something in the input field)\n if (chipInput.current.value !== '') {\n // Let's replace the chip\n onRemoveChip(index, chipInput.current.value);\n } else {\n // Let's just remove the chip\n onRemoveChip(index);\n }\n\n // Let's update the text value of input field\n chipInput.current.value = text;\n setValue(text);\n };\n\n React.useEffect(() => {\n var options = [...givenList];\n if (!restartFilter && value !== '') {\n options = options.filter((option) => option.label.toUpperCase().indexOf(value.toUpperCase()) !== -1);\n }\n if (!disableSorting) {\n options = options.sort();\n }\n options = options.filter((o) => !chips.includes(o.value));\n setCurrentSearchResult(options);\n }, [value, givenList, chips]);\n\n const handleValueUpdate = (values: string[]) => {\n setRestartFilter(true);\n addChip(values[0]);\n chipInput?.current?.focus();\n }\n\n const handleKeyPress = (e: any) => {\n if (styledFieldRef?.current && styledFieldRef.current.contains(e.target)) {\n if (e.keyCode === 13) {\n const matches = currentSearchResult?.filter((c) => c.value.toLowerCase() === value.toLowerCase());\n if (matches?.length === 1 /*&& onSelect*/) {\n addChip(matches[0].value);\n //onSelect(chips);\n } else if (e.target.value === suggestion?.label) {\n addChip(e.target.value);\n }\n\n setDropdownIsOpen(!dropdownIsOpen);\n if (matches?.length === 0) {\n setValue('');\n }\n } else if (e.keyCode === 40) {\n setDropdownIsOpen(!dropdownIsOpen);\n }\n }\n };\n\n const handleClickOutside = (e: any) => {\n if (styledFieldRef?.current && !styledFieldRef.current.contains(e.target)) {\n if (dropdownIsOpen) {\n setDropdownIsOpen(false);\n if (!givenList.find((e) => e.value === value)) {\n setValue('');\n }\n }\n }\n };\n\n React.useEffect(() => {\n document.addEventListener('keypress', handleKeyPress);\n document.addEventListener('click', handleClickOutside);\n return () => {\n document.removeEventListener('keypress', handleKeyPress);\n document.removeEventListener('click', handleClickOutside);\n };\n });\n\n /**\n * Return Chip Input component.\n */\n\n let dropdownItems: DropdownItem[] = [];\n if(currentSearchResult)\n dropdownItems = currentSearchResult.map(x => ({ value: x.value, displayLabel: x.label, noteLabel: x.secondaryLabel }));\n \n if(suggestion && !chips.includes(suggestion.value))\n dropdownItems = [{ value: suggestion.value, displayLabel: suggestion.label, noteLabel: suggestion.secondaryLabel, suggestion: true }, ...dropdownItems];\n\n return (\n <Wrapper>\n <StyledChipInputContainer\n id={inputId}\n onClick={(e: any) => {\n e.stopPropagation();\n setDropdownIsOpen(true);\n chipInput.current.focus();\n }}\n className={validationType}\n ref={styledFieldRef}>\n <Search size=\"24px\" className=\"SearchIcon\" />\n {chips?.map((chip: string, index: number) => (\n <InputChip\n icon={givenList.find((l: List) => l.value === chip) ? 'User' : undefined}\n size=\"medium\"\n variant={variants && variants?.length && variants[index] ? variants[index] : 'normal'}\n text={chip}\n onRemove={() => onRemoveChip(index)}\n onClick={() => onEditChip(chip, index)}\n key={`chip_${index}`}></InputChip>\n ))}\n\n <ChipInput\n type=\"text\"\n onChange={(event: React.ChangeEvent<HTMLInputElement>) => {\n setValue(event.target.value);\n setRestartFilter(false);\n setDropdownIsOpen(true);\n if (onInputChange) {\n onInputChange(event.target.value || '');\n }\n }}\n onKeyDown={(event: React.KeyboardEvent<HTMLInputElement>) => {\n onAddChip(event);\n }}\n placeholder={placeholder && chips?.length === 0 ? placeholder : ''}\n onClick={(e: any) => {\n e.stopPropagation();\n setDropdownIsOpen(true);\n }}\n onFocus={() => {\n setDropdownIsOpen(true);\n }}\n ref={chipInput}\n />\n {loading ? (\n <Loading>\n <LoadingIndicator size=\"small\" color={COLORS.neutral_600} />\n </Loading>\n ) : null}\n </StyledChipInputContainer>\n {(!maxSelectedItems || (maxSelectedItems && chips.length < maxSelectedItems)) && (\n <DropdownContent \n customizationProps={{\n action: () => {},\n pinTopItem: true,\n \n itemsType: 'normal',\n scrollable: true,\n actionLabel: '',\n multiSelect: false,\n onValueUpdate: handleValueUpdate,\n items: dropdownItems\n }}\n focused={focused}\n setFocused={setFocused}\n hideOnClickOutside={false}\n selectedValues={[]}\n messageOnNoResults={messageOnNoResults ?? ''}\n setSelectedValues={() => {}}\n isOpen={dropdownIsOpen}\n setIsOpen={setDropdownIsOpen}\n filter={''}\n isButton={false} \n id={`${inputId}_dropdowncontent`} />\n )}\n\n {/* If there is an error, let's render the error */}\n {validationMessage && validationType === 'warning' ? (\n <WarningMessage>\n <TechnicalWarning size=\"20px\" color={COLORS.critical_500} />\n <span>{validationMessage}</span>\n </WarningMessage>\n ) : (\n validationType === 'error' && (\n <ErrorMessage>\n <TechnicalWarning size=\"20px\" color={COLORS.critical_400} />\n <span>{validationMessage}</span>\n </ErrorMessage>\n )\n )}\n </Wrapper>\n );\n};\n\nexport default ChipDropdownInput;\n"],"file":"ChipDropdownInput.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/Dropdown/ChipDropdownInput.tsx"],"names":["Wrapper","styled","div","StyledChipInputContainer","COLORS","neutral_400","primary_100","critical_400","warning_400","primary_600","primary_800","primary_700","white","neutral_500","neutral_700","ChipInput","input","ComponentMStyling","ComponentTextStyle","black","StyledDropdownButton","Loading","label","secondaryLabel","value","list","onInputChange","disableSorting","messageOnNoResults","isButton","autofilledMessage","suggestion","excludeIcon","loading","maxSelectedItems","ChipDropdownInput","React","chipInput","styledFieldRef","setChips","newList","e","setGivenList","addChip","newChip","onValueChange","setValue","onAddChip","event","givenList","onRemoveChip","chips","newChips","onEditChip","options","option","o","setCurrentSearchResult","handleValueUpdate","values","setRestartFilter","handleKeyPress","matches","currentSearchResult","c","setDropdownIsOpen","handleClickOutside","document","dropdownItems","x","displayLabel","noteLabel","l","Size","variants","index","placeholder","neutral_600","action","pinTopItem","itemsType","scrollable","actionLabel","multiSelect","onValueUpdate","items","inputId","validationMessage","validationType","critical_500"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\n\n/**\n * Import custom components.\n */\nimport { InputChip } from '../Chips/index';\nimport { Search, TechnicalWarning, User } from '../icons/systemicons/SystemIcons';\nimport { WarningMessage, ErrorMessage } from '../InputFields/styling';\nimport { COLORS } from '../styles';\n\n/**\n * Import custom styles.\n */\nimport { ChipInputContainer } from '../Chips/ChipStyles';\n\n/**\n * Import custom types.\n */\nimport { Size } from '../types';\nimport { ChipInputProps } from '../Chips/ChipTypes';\nimport { DropdownButton } from './CommonStyling';\nimport DropdownContent, { DropdownItem } from './DropdownContent';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { ComponentMStyling, ComponentXXSStyling, ComponentTextStyle } from '../styles/typography';\n\nconst Wrapper = styled.div`\n position: relative;\n display: inline-block;\n width: 100%;\n min-width: 344px;\n`;\n\nconst StyledChipInputContainer = styled(ChipInputContainer)`\n padding: 2px 2px 2px 48px !important;\n min-height: 56px;\n max-height: 176px;\n overflow-y: auto;\n box-shadow: 0px 0px 0px 1px ${COLORS.neutral_400};\n\n .medium {\n margin-right: 8px !important;\n }\n .SearchIcon {\n position: absolute;\n left: 18px;\n top: 18px;\n }\n\n &:active {\n background-color: ${COLORS.primary_100};\n }\n\n &.invalid {\n -webkit-box-shadow: inset 0px 0px 0px 2px ${COLORS.critical_400};\n -moz-box-shadow: inset 0px 0px 0px 2px ${COLORS.critical_400};\n box-shadow: inset 0px 0px 0px 2px ${COLORS.critical_400};\n }\n &.alreadyInOrganization {\n -webkit-box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n -moz-box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n }\n\n &.empty:hover {\n -webkit-box-shadow: 0px 0px 0px 2px ${COLORS.primary_600};\n -moz-box-shadow: 0px 0px 0px 2px ${COLORS.primary_600};\n box-shadow: 0px 0px 0px 2px ${COLORS.primary_600};\n }\n\n &.inputHasFocus {\n -webkit-box-shadow: 0px 0px 0px 2px ${COLORS.primary_800};\n -moz-box-shadow: 0px 0px 0px 2px ${COLORS.primary_800};\n box-shadow: 0px 0px 0px 2px ${COLORS.primary_800};\n }\n &:hover {\n -webkit-box-shadow: 0px 0px 0px 2px ${COLORS.primary_700};\n -moz-box-shadow: 0px 0px 0px 2px ${COLORS.primary_700};\n box-shadow: 0px 0px 0px 2px ${COLORS.primary_700};\n }\n\n /* width */\n ::-webkit-scrollbar {\n width: 4px;\n cursor: pointer;\n }\n\n /* Track */\n ::-webkit-scrollbar-track {\n background: ${COLORS.white};\n }\n\n /* Handle */\n ::-webkit-scrollbar-thumb {\n background: ${COLORS.neutral_500};\n border-radius: 8px;\n }\n\n /* Handle on hover */\n ::-webkit-scrollbar-thumb:hover {\n background: ${COLORS.neutral_700};\n cursor: pointer;\n }\n`;\n\nconst ChipInput = styled.input`\n height: 40px;\n width: auto;\n display: inline-flex;\n border: none;\n outline: none;\n margin: 4px;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n color: ${COLORS.black} !important;\n background-color: inherit;\n`;\n\nconst StyledDropdownButton = styled(DropdownButton)`\n display: flex;\n width: 98%;\n margin-left: 3px;\n svg {\n margin: auto 0 auto 0;\n }\n`;\n\nconst Loading = styled.div`\n margin: auto 16px auto auto !important;\n height: 20px;\n div {\n height: 20px;\n }\n`;\n\ninterface List {\n label: string;\n secondaryLabel?: string;\n value: string;\n}\n\ninterface ChipDropdownInputProps extends ChipInputProps {\n list: List[] | string[];\n onInputChange?: (input: string) => void;\n disableSorting?: boolean;\n messageOnNoResults?: string;\n isButton?: boolean;\n autofilledMessage?: string;\n suggestion?: List;\n excludeIcon?: boolean;\n loading?: boolean;\n maxSelectedItems?: number;\n}\n\nconst ChipDropdownInput: React.FunctionComponent<ChipDropdownInputProps> = ({\n list,\n onInputChange,\n disableSorting,\n messageOnNoResults,\n values,\n inputId,\n variants,\n placeholder,\n validationType,\n validationMessage,\n onValueChange,\n suggestion,\n excludeIcon,\n loading,\n maxSelectedItems,\n}: ChipDropdownInputProps) => {\n // Initiate states\n const [givenList, setGivenList] = React.useState<List[]>([]);\n const [chips, setChips] = React.useState<string[]>([]);\n const [value, setValue] = React.useState<string>('');\n const [dropdownIsOpen, setDropdownIsOpen] = React.useState<boolean>(false);\n const [currentSearchResult, setCurrentSearchResult] = React.useState<List[]>();\n const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n const [focused, setFocused] = React.useState<number | null>(null);\n\n // Initiate refs\n const chipInput = React.useRef<any>();\n const styledFieldRef = React.useRef<HTMLDivElement>(null);\n\n /**\n * Sets initial values for the chips.\n */\n React.useEffect(() => {\n // Let's add initial chip values\n setChips(values);\n }, [values]);\n\n /**\n * Convert string[] to List[] if necessary\n */\n React.useEffect(() => {\n if (typeof list[0] === 'string') {\n const newList: List[] = (list as string[]).map((e: string) => ({ label: e, value: e }));\n setGivenList(newList);\n } else {\n setGivenList(list as List[]);\n }\n }, [list]);\n\n const addChip = (newChip: string) => {\n // Let's add the chip\n setChips([...chips, newChip]);\n onValueChange([...chips, newChip]);\n\n // Let's clear the old value\n chipInput.current.value = '';\n setValue('');\n };\n\n /**\n * Adds a chip to the chip list.\n * @param event - Event handler from the key down event.\n */\n const onAddChip = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n // Let's trigger only on enter, comma and space key press\n if ((event.keyCode === 13 || event.keyCode === 32 || event.keyCode === 188) && value) {\n if (!givenList.find((e) => e.value === value)) {\n setValue('');\n return;\n }\n // Let's prevent default action - adding new key to the value\n event.preventDefault();\n\n addChip(value);\n }\n if (event.keyCode === 8 && value === '') {\n onRemoveChip(chips.length - 1);\n }\n };\n\n /**\n * Removes a specific chip from the chip list.\n * @param index - Index of the chip that needs to be removed.\n * @param elementToAdd - Element which needs to be added in the deleted element place.\n */\n const onRemoveChip = (index: number, elementToAdd?: string): void => {\n // Let's copy the chips\n const newChips = [...chips];\n\n // Let's delete the chip\n // If necessary, let's replace it with a different chip\n if (elementToAdd) {\n newChips.splice(index, 1, elementToAdd);\n } else {\n newChips.splice(index, 1);\n }\n\n // Let's update the chip list\n setChips([...newChips]);\n onValueChange([...newChips]);\n };\n\n /**\n * Changes a status of the chip to edit.\n * @param text - Text of the chip that is being edited.\n * @param index - Index of the chip in the array.\n */\n const onEditChip = (text: string, index: number): void => {\n // Let's check if we have to add value as a chip (in case we have entered something in the input field)\n if (chipInput.current.value !== '') {\n // Let's replace the chip\n onRemoveChip(index, chipInput.current.value);\n } else {\n // Let's just remove the chip\n onRemoveChip(index);\n }\n\n // Let's update the text value of input field\n chipInput.current.value = text;\n setValue(text);\n };\n\n React.useEffect(() => {\n var options = [...givenList];\n if (!restartFilter && value !== '') {\n options = options.filter((option) => option.label.toUpperCase().indexOf(value.toUpperCase()) !== -1);\n }\n if (!disableSorting) {\n options = options.sort();\n }\n options = options.filter((o) => !chips.includes(o.value));\n setCurrentSearchResult(options);\n }, [value, givenList, chips]);\n\n const handleValueUpdate = (values: string[]) => {\n setRestartFilter(true);\n addChip(values[0]);\n chipInput?.current?.focus();\n }\n\n const handleKeyPress = (e: any) => {\n if (styledFieldRef?.current && styledFieldRef.current.contains(e.target)) {\n if (e.keyCode === 13) {\n const matches = currentSearchResult?.filter((c) => c.value.toLowerCase() === value.toLowerCase());\n if (matches?.length === 1 /*&& onSelect*/) {\n addChip(matches[0].value);\n //onSelect(chips);\n } else if (e.target.value === suggestion?.label) {\n addChip(e.target.value);\n }\n\n setDropdownIsOpen(!dropdownIsOpen);\n if (matches?.length === 0) {\n setValue('');\n }\n } else if (e.keyCode === 40) {\n setDropdownIsOpen(!dropdownIsOpen);\n }\n }\n };\n\n const handleClickOutside = (e: any) => {\n if (styledFieldRef?.current && !styledFieldRef.current.contains(e.target)) {\n if (dropdownIsOpen) {\n setDropdownIsOpen(false);\n if (!givenList.find((e) => e.value === value)) {\n setValue('');\n }\n }\n }\n };\n\n React.useEffect(() => {\n document.addEventListener('keypress', handleKeyPress);\n document.addEventListener('click', handleClickOutside);\n return () => {\n document.removeEventListener('keypress', handleKeyPress);\n document.removeEventListener('click', handleClickOutside);\n };\n });\n\n /**\n * Return Chip Input component.\n */\n\n let dropdownItems: DropdownItem[] = [];\n if(currentSearchResult)\n dropdownItems = currentSearchResult.map(x => ({ value: x.value, displayLabel: x.label, noteLabel: x.secondaryLabel }));\n \n if(suggestion && !chips.includes(suggestion.value))\n dropdownItems = [{ value: suggestion.value, displayLabel: suggestion.label, noteLabel: suggestion.secondaryLabel, suggestion: true }, ...dropdownItems];\n\n return (\n <Wrapper>\n <StyledChipInputContainer\n id={inputId}\n onClick={(e: any) => {\n e.stopPropagation();\n setDropdownIsOpen(true);\n chipInput.current.focus();\n }}\n className={validationType}\n ref={styledFieldRef}>\n <Search size=\"24px\" className=\"SearchIcon\" />\n {chips?.map((chip: string, index: number) => (\n <InputChip\n icon={givenList.find((l: List) => l.value === chip) ? 'User' : undefined}\n size={Size.Medium}\n variant={variants && variants?.length && variants[index] ? variants[index] : 'normal'}\n text={chip}\n onRemove={() => onRemoveChip(index)}\n onClick={() => onEditChip(chip, index)}\n key={`chip_${index}`}></InputChip>\n ))}\n\n <ChipInput\n type=\"text\"\n onChange={(event: React.ChangeEvent<HTMLInputElement>) => {\n setValue(event.target.value);\n setRestartFilter(false);\n setDropdownIsOpen(true);\n if (onInputChange) {\n onInputChange(event.target.value || '');\n }\n }}\n onKeyDown={(event: React.KeyboardEvent<HTMLInputElement>) => {\n onAddChip(event);\n }}\n placeholder={placeholder && chips?.length === 0 ? placeholder : ''}\n onClick={(e: any) => {\n e.stopPropagation();\n setDropdownIsOpen(true);\n }}\n onFocus={() => {\n setDropdownIsOpen(true);\n }}\n ref={chipInput}\n />\n {loading ? (\n <Loading>\n <LoadingIndicator size={Size.Small} color={COLORS.neutral_600} />\n </Loading>\n ) : null}\n </StyledChipInputContainer>\n {(!maxSelectedItems || (maxSelectedItems && chips.length < maxSelectedItems)) && (\n <DropdownContent \n customizationProps={{\n action: () => {},\n pinTopItem: true,\n \n itemsType: 'normal',\n scrollable: true,\n actionLabel: '',\n multiSelect: false,\n onValueUpdate: handleValueUpdate,\n items: dropdownItems\n }}\n focused={focused}\n setFocused={setFocused}\n hideOnClickOutside={false}\n selectedValues={[]}\n messageOnNoResults={messageOnNoResults ?? ''}\n setSelectedValues={() => {}}\n isOpen={dropdownIsOpen}\n setIsOpen={setDropdownIsOpen}\n filter={''}\n isButton={false} \n id={`${inputId}_dropdowncontent`} />\n )}\n\n {/* If there is an error, let's render the error */}\n {validationMessage && validationType === 'warning' ? (\n <WarningMessage>\n <TechnicalWarning size=\"20px\" color={COLORS.critical_500} />\n <span>{validationMessage}</span>\n </WarningMessage>\n ) : (\n validationType === 'error' && (\n <ErrorMessage>\n <TechnicalWarning size=\"20px\" color={COLORS.critical_400} />\n <span>{validationMessage}</span>\n </ErrorMessage>\n )\n )}\n </Wrapper>\n );\n};\n\nexport default ChipDropdownInput;\n"],"file":"ChipDropdownInput.js"}
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
const Dropdown = exports.Dropdown = _styledComponents2.default.div`
|
|
30
30
|
position: relative;
|
|
31
31
|
display: inline-block;
|
|
32
|
-
${props => !props.isButton && 'width: 100%; min-width: 344px;'}
|
|
32
|
+
${props => !props.isButton && (props?.minWidth ? `width: 100%; min-width: ${props.minWidth};` : 'width: 100%; min-width: 344px;')}
|
|
33
33
|
${props => props.locked || props.disabled ? 'cursor: not-allowed;' : ''}
|
|
34
34
|
${props => props.margin ? `margin: ${props.margin};` : ''}
|
|
35
35
|
|
|
@@ -116,7 +116,7 @@
|
|
|
116
116
|
|
|
117
117
|
padding: 12px 16px;
|
|
118
118
|
height: 48px;
|
|
119
|
-
min-width: 344px;
|
|
119
|
+
min-width: ${props => props.minWidth ? `${props.minWidth}` : '344px'};
|
|
120
120
|
width: 100%;
|
|
121
121
|
|
|
122
122
|
background: ${_styles.COLORS.white};
|
|
@@ -128,8 +128,8 @@
|
|
|
128
128
|
display: flex;
|
|
129
129
|
align-items: center;
|
|
130
130
|
gap: 4px;
|
|
131
|
-
|
|
132
|
-
input{
|
|
131
|
+
|
|
132
|
+
input {
|
|
133
133
|
font-size: inherit;
|
|
134
134
|
line-height: inherit;
|
|
135
135
|
color: inherit;
|
|
@@ -276,96 +276,95 @@
|
|
|
276
276
|
|
|
277
277
|
const DropdownButtonCSS = exports.DropdownButtonCSS = size => {
|
|
278
278
|
return _styledComponents.css`
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
${size == _types.Size.Medium && (0, _typography.ComponentMStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_600)}
|
|
279
|
+
${size == _types.Size.Small && (0, _typography.ComponentSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_600)}
|
|
280
|
+
${size == _types.Size.Medium && (0, _typography.ComponentMStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_600)}
|
|
282
281
|
${size == _types.Size.Large && (0, _typography.ComponentLStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_600)}
|
|
283
282
|
|
|
284
283
|
position: relative;
|
|
285
|
-
|
|
286
|
-
display: flex;
|
|
287
|
-
flex-direction: row;
|
|
288
|
-
align-items: center;
|
|
289
|
-
min-height: ${size == _types.Size.Large ? '64px' : size == _types.Size.Medium ? '56px' : '48px'};
|
|
290
|
-
background-color: ${_styles.COLORS.white};
|
|
291
|
-
border: none;
|
|
292
|
-
cursor: pointer;
|
|
293
|
-
background: transparent;
|
|
294
|
-
width: 100%;
|
|
295
|
-
text-align: left;
|
|
296
|
-
|
|
297
|
-
span {
|
|
298
|
-
margin: auto 0 auto 16px;
|
|
299
|
-
line-height: 48px;
|
|
300
|
-
}
|
|
301
|
-
|
|
302
|
-
div.item-content {
|
|
303
|
-
margin: auto 0 auto 16px;
|
|
284
|
+
text-decoration: none;
|
|
304
285
|
display: flex;
|
|
286
|
+
flex-direction: row;
|
|
305
287
|
align-items: center;
|
|
288
|
+
min-height: ${size == _types.Size.Large ? '64px' : size == _types.Size.Medium ? '56px' : '48px'};
|
|
289
|
+
background-color: ${_styles.COLORS.white};
|
|
290
|
+
border: none;
|
|
291
|
+
cursor: pointer;
|
|
292
|
+
background: transparent;
|
|
293
|
+
width: 100%;
|
|
294
|
+
text-align: left;
|
|
306
295
|
|
|
307
|
-
|
|
308
|
-
|
|
296
|
+
span {
|
|
297
|
+
margin: auto 0 auto 16px;
|
|
298
|
+
line-height: 48px;
|
|
309
299
|
}
|
|
310
300
|
|
|
311
|
-
div.item-
|
|
312
|
-
margin
|
|
313
|
-
}
|
|
314
|
-
div.item-icon-old {
|
|
315
|
-
flex: 1 0 40px;
|
|
301
|
+
div.item-content {
|
|
302
|
+
margin: auto 0 auto 16px;
|
|
316
303
|
display: flex;
|
|
317
|
-
|
|
304
|
+
align-items: center;
|
|
305
|
+
|
|
306
|
+
div.item-label {
|
|
307
|
+
flex: 1 0 calc(100% - 40px);
|
|
308
|
+
}
|
|
309
|
+
|
|
310
|
+
div.item-icon {
|
|
311
|
+
margin-right: 6px;
|
|
312
|
+
}
|
|
313
|
+
div.item-icon-old {
|
|
314
|
+
flex: 1 0 40px;
|
|
315
|
+
display: flex;
|
|
316
|
+
justify-content: flex-end;
|
|
317
|
+
}
|
|
318
318
|
}
|
|
319
|
-
}
|
|
320
319
|
|
|
321
|
-
|
|
320
|
+
${_common.CommonInteractionStyling};
|
|
322
321
|
|
|
323
|
-
|
|
324
|
-
|
|
322
|
+
&.active {
|
|
323
|
+
background: ${_styles.COLORS.neutral_20};
|
|
325
324
|
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
325
|
+
&::after {
|
|
326
|
+
position: absolute;
|
|
327
|
+
content: ' ';
|
|
328
|
+
width: 4px;
|
|
329
|
+
top: 0;
|
|
330
|
+
bottom: 0;
|
|
331
|
+
left: 2px;
|
|
332
|
+
background-color: ${_styles.COLORS.primary_500};
|
|
334
333
|
|
|
335
|
-
|
|
334
|
+
border-radius: 2px;
|
|
335
|
+
}
|
|
336
336
|
}
|
|
337
|
-
}
|
|
338
337
|
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
338
|
+
&:disabled {
|
|
339
|
+
background-color: transparent;
|
|
340
|
+
cursor: not-allowed;
|
|
341
|
+
color: ${_styles.COLORS.neutral_200};
|
|
342
|
+
}
|
|
344
343
|
|
|
345
|
-
|
|
346
|
-
|
|
344
|
+
&.active:hover {
|
|
345
|
+
background-color: ${_styles.COLORS.primary_20};
|
|
347
346
|
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
347
|
+
svg {
|
|
348
|
+
color: ${_styles.COLORS.primary_600};
|
|
349
|
+
}
|
|
351
350
|
|
|
352
|
-
|
|
353
|
-
|
|
351
|
+
&::after {
|
|
352
|
+
background-color: ${_styles.COLORS.primary_500};
|
|
353
|
+
}
|
|
354
354
|
}
|
|
355
|
-
}
|
|
356
355
|
|
|
357
|
-
|
|
358
|
-
|
|
356
|
+
&.active:active {
|
|
357
|
+
background-color: ${_styles.COLORS.primary_100};
|
|
359
358
|
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
359
|
+
svg {
|
|
360
|
+
color: ${_styles.COLORS.primary_800};
|
|
361
|
+
}
|
|
363
362
|
|
|
364
|
-
|
|
365
|
-
|
|
363
|
+
&::after {
|
|
364
|
+
background-color: ${_styles.COLORS.primary_500};
|
|
365
|
+
}
|
|
366
366
|
}
|
|
367
|
-
|
|
368
|
-
`;
|
|
367
|
+
`;
|
|
369
368
|
};
|
|
370
369
|
|
|
371
370
|
const ButtonDropdownWrapper = exports.ButtonDropdownWrapper = _styledComponents2.default.div`
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/Dropdown/CommonStyling.tsx"],"names":["Dropdown","styled","div","props","margin","COLORS","primary_600","primary_800","lockedState","css","neutral_100","neutral_300","neutral_600","disabledState","white","activeValidationMessage","warning_400","placeholderStyling","ComponentMStyling","ComponentTextStyle","InputField","input","black","ComponentSStyling","BREAKPOINTS","MEDIUM","StyledField","neutral_400","ComponentXXSStyling","ComponentXSStyling","primary_200","primary_300","neutral_800","neutral_20","CommonInteractionStyling","ButtonDropdownContentStyling","DropdownContentStyling","Z_INDEXES","dropdown","neutral_200","DropdownButton","button","DropdownButtonCSS","size","Size","ComponentLStyling","primary_500","primary_20","primary_100","ButtonDropdownWrapper","primary_700"],"mappings":"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","sourcesContent":["import styled, {css} from 'styled-components';\nimport {CommonInteractionStyling} from '../common';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle} from '../styles';\nimport {ComponentMStyling, ComponentLStyling, ComponentSStyling, ComponentXSStyling, ComponentXXSStyling} from '../styles/typography';\nimport { Size } from '../types';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nexport const Dropdown = styled.div<{ isButton: boolean; locked?: boolean; disabled?: boolean; margin?: string }>`\n position: relative;\n display: inline-block;\n ${(props) => !props.isButton && 'width: 100%; min-width: 344px;'}\n ${(props) => (props.locked || props.disabled ? 'cursor: not-allowed;' : '')}\n ${(props) => (props.margin ? `margin: ${props.margin};` : '')}\n\n .show {\n display: block;\n }\n\n .value {\n flex-grow: 1;\n }\n\n input:hover + div {\n color: ${COLORS.primary_600};\n }\n\n input:active + div {\n color: ${COLORS.primary_800};\n }\n`;\n\nconst lockedState = css`\n background-color: ${COLORS.neutral_100};\n box-shadow: inset 0px 0px 0px 1px ${COLORS.neutral_300};\n color: ${COLORS.neutral_600};\n pointer-events: none;\n cursor: not-allowed;\n input {\n color: ${COLORS.neutral_600} !important;\n }\n`;\n\nconst disabledState = css`\n background-color: ${COLORS.white};\n box-shadow: inset 0px 0px 0px 1px ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n pointer-events: none;\n cursor: not-allowed;\n svg {\n color: ${COLORS.neutral_300} !important;\n }\n input {\n color: ${COLORS.neutral_300} !important;\n ::placeholder {\n color: ${COLORS.neutral_300} !important;\n }\n }\n`;\n\nconst activeValidationMessage = css`\n -webkit-box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n -moz-box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n`;\n\nconst placeholderStyling = css`\n ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n`;\n\nexport const InputField = styled.input`\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n border: none;\n outline: none;\n background-color: inherit;\n cursor: pointer;\n color: ${COLORS.black} !important;\n padding: 0;\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 ::placeholder {\n ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n\n ${BREAKPOINTS.MEDIUM} {\n ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n &.small {\n ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n &.medium {\n ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n`;\n\nexport const StyledField = styled.div<{ disabled: boolean; locked: boolean; showValidationMessage?: boolean; isPlaceholder?: boolean; fontSize?: string }>`\n ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\n\n padding: 12px 16px;\n height: 48px;\n min-width: 344px;\n width: 100%;\n\n background: ${COLORS.white};\n box-shadow: inset 0px 0px 0px 1px ${COLORS.neutral_400};\n box-sizing: border-box;\n border-radius: 4px;\n cursor: pointer;\n\n display: flex;\n align-items: center;\n gap: 4px;\n \n input{\n font-size: inherit;\n line-height: inherit;\n color: inherit;\n }\n\n &::placeholder {\n ${ComponentXXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n\n ${BREAKPOINTS.MEDIUM} {\n ${ComponentMStyling(ComponentTextStyle.Regular, 'inherit')}\n padding: 16px;\n height: 56px;\n &::placeholder {\n ${ComponentXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n\n &.small {\n ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\n padding: 12px 16px;\n height: 48px;\n &::placeholder {\n ${ComponentXXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n &.medium {\n ${ComponentMStyling(ComponentTextStyle.Regular, 'inherit')}\n height: 56px;\n padding: 16px;\n &::placeholder {\n ${ComponentXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n\n &:focus {\n outline: 3px solid #ddd;\n }\n &:focus-within {\n -webkit-box-shadow: inset 0px 0px 0px 2px ${COLORS.primary_800};\n -moz-box-shadow: inset 0px 0px 0px 2px ${COLORS.primary_800};\n box-shadow: inset 0px 0px 0px 2px ${COLORS.primary_800};\n }\n &:hover {\n box-shadow: inset 0px 0px 0px 1px ${COLORS.primary_200};\n input {\n ::placeholder {\n color: ${COLORS.primary_600};\n }\n }\n cursor: pointer;\n }\n &:active {\n box-shadow: inset 0px 0px 0px 1px ${COLORS.primary_300};\n input {\n ::placeholder {\n color: ${COLORS.primary_800};\n }\n }\n }\n\n &.button {\n ${(props) => ComponentSStyling(ComponentTextStyle.Bold, props.disabled ? COLORS.neutral_300 : COLORS.neutral_600)}\n\n box-sizing: border-box;\n height: 32px;\n padding: 0 8px;\n width: initial;\n min-width: initial;\n border: none !important;\n box-shadow: none;\n border-radius: 4px;\n\n &.expanded {\n color: ${COLORS.neutral_800};\n background: ${COLORS.neutral_20};\n }\n }\n\n ${(props) => (props.disabled ? disabledState : '')}\n ${(props) => (props.locked ? lockedState : '')}\n ${(props) => (props.showValidationMessage ? activeValidationMessage : '')}\n ${(props) => (props.isPlaceholder ? placeholderStyling : '')}\n\n ${CommonInteractionStyling};\n`;\n\nexport const ButtonDropdownContentStyling = css`\n min-width: 344px;\n right: 0;\n`;\n\nexport const DropdownContentStyling = styled.div<{ isButton: boolean }>`\n display: none;\n position: absolute;\n background-color: ${COLORS.white};\n width: 100%;\n z-index: ${Z_INDEXES.dropdown};\n margin-top: ${(props) => (props.isButton ? '-4px' : '2px')};\n\n &.show {\n display: block;\n }\n\n &.up {\n top: auto;\n bottom: 100%;\n }\n\n ${(props) => (props.isButton ? ButtonDropdownContentStyling : '')};\n\n border: 1px solid ${COLORS.neutral_100};\n box-sizing: border-box;\n box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15);\n border-radius: 4px;\n padding: 4px 0;\n\n max-height: 240px;\n overflow-y: auto;\n\n /* width */\n ::-webkit-scrollbar {\n width: 4px;\n cursor: pointer;\n }\n\n /* Track */\n ::-webkit-scrollbar-track {\n background: ${COLORS.white};\n }\n\n /* Handle */\n ::-webkit-scrollbar-thumb {\n background: ${COLORS.neutral_200};\n border-radius: 8px;\n }\n\n /* Handle on hover */\n ::-webkit-scrollbar-thumb:hover {\n background: ${COLORS.neutral_400};\n }\n`;\n\nexport const DropdownButton = styled.button<{size? : Size}>`\n ${props => DropdownButtonCSS(props.size)}\n`;\n\nexport const DropdownButtonCSS = (size? : Size) => {\n return css`\n\n ${size == Size.Small && ComponentSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n ${size == Size.Medium && ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n ${size == Size.Large && ComponentLStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n position: relative;\n text-decoration: none;\n display: flex;\n flex-direction: row;\n align-items: center;\n min-height: ${size == Size.Large ? '64px' : size == Size.Medium ? '56px' : '48px'};\n background-color: ${COLORS.white};\n border: none;\n cursor: pointer;\n background: transparent;\n width: 100%;\n text-align: left;\n\n span {\n margin: auto 0 auto 16px;\n line-height: 48px;\n }\n\n div.item-content {\n margin: auto 0 auto 16px;\n display: flex;\n align-items: center;\n\n div.item-label {\n flex: 1 0 calc(100% - 40px);\n }\n\n div.item-icon {\n margin-right: 6px;\n }\n div.item-icon-old {\n flex: 1 0 40px;\n display: flex;\n justify-content: flex-end;\n }\n }\n\n ${CommonInteractionStyling};\n\n &.active {\n background: ${COLORS.neutral_20};\n\n &::after {\n position: absolute;\n content: ' ';\n width: 4px;\n top: 0;\n bottom: 0;\n left: 2px;\n background-color: ${COLORS.primary_500};\n\n border-radius: 2px;\n }\n }\n\n &:disabled {\n background-color: transparent;\n cursor: not-allowed;\n color: ${COLORS.neutral_200}\n }\n\n &.active:hover {\n background-color: ${COLORS.primary_20};\n\n svg {\n color: ${COLORS.primary_600};\n }\n\n &::after {\n background-color: ${COLORS.primary_500};\n }\n }\n\n &.active:active {\n background-color: ${COLORS.primary_100};\n\n svg {\n color: ${COLORS.primary_800};\n }\n\n &::after {\n background-color: ${COLORS.primary_500};\n }\n }\n`;\n};\n\nexport const ButtonDropdownWrapper = styled.div<{ locked?: boolean; disabled?: boolean }>`\n box-sizing: border-box;\n min-height: 48px;\n display: flex;\n align-items: center;\n width: fit-content;\n\n .button {\n min-width: 64px;\n }\n\n .value {\n flex-grow: 1;\n display: flex;\n justify-content: center;\n }\n\n .dropdown-arrow {\n width: 24px;\n height: 24px;\n }\n\n ${(props) => (props.locked || props.disabled ? 'cursor: not-allowed;' : 'cursor: pointer;')}\n ${(props) => (props.disabled ? 'pointer-events: none;' : '')}\n \n &:hover .button,\n & > .button:hover {\n background-color: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n }\n\n &:focus .button,\n & > .button:focus {\n box-shadow: 0 4px 12px rgba(46, 127, 161, 0.25), 0 0 8px #2e7fa1;\n outline: none;\n }\n\n &:active .button,\n & > .button:active {\n box-shadow: none;\n background-color: ${COLORS.primary_100};\n color: ${COLORS.primary_800};\n }\n\n}`;\n"],"file":"CommonStyling.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/Dropdown/CommonStyling.tsx"],"names":["Dropdown","styled","div","props","minWidth","margin","COLORS","primary_600","primary_800","lockedState","css","neutral_100","neutral_300","neutral_600","disabledState","white","activeValidationMessage","warning_400","placeholderStyling","ComponentMStyling","ComponentTextStyle","InputField","input","black","ComponentSStyling","BREAKPOINTS","MEDIUM","StyledField","neutral_400","ComponentXXSStyling","ComponentXSStyling","primary_200","primary_300","neutral_800","neutral_20","CommonInteractionStyling","ButtonDropdownContentStyling","DropdownContentStyling","Z_INDEXES","dropdown","neutral_200","DropdownButton","button","DropdownButtonCSS","size","Size","ComponentLStyling","primary_500","primary_20","primary_100","ButtonDropdownWrapper","primary_700"],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { CommonInteractionStyling } from '../common';\nimport { BREAKPOINTS, COLORS, ComponentTextStyle } from '../styles';\nimport { ComponentMStyling, ComponentLStyling, ComponentSStyling, ComponentXSStyling, ComponentXXSStyling } from '../styles/typography';\nimport { Size } from '../types';\nimport { Z_INDEXES } from '../styles/z-indexes';\n\nexport const Dropdown = styled.div<{ isButton: boolean; locked?: boolean; disabled?: boolean; margin?: string; minWidth?: string }>`\n position: relative;\n display: inline-block;\n ${(props) => !props.isButton && (props?.minWidth ? `width: 100%; min-width: ${props.minWidth};` : 'width: 100%; min-width: 344px;')}\n ${(props) => (props.locked || props.disabled ? 'cursor: not-allowed;' : '')}\n ${(props) => (props.margin ? `margin: ${props.margin};` : '')}\n\n .show {\n display: block;\n }\n\n .value {\n flex-grow: 1;\n }\n\n input:hover + div {\n color: ${COLORS.primary_600};\n }\n\n input:active + div {\n color: ${COLORS.primary_800};\n }\n`;\n\nconst lockedState = css`\n background-color: ${COLORS.neutral_100};\n box-shadow: inset 0px 0px 0px 1px ${COLORS.neutral_300};\n color: ${COLORS.neutral_600};\n pointer-events: none;\n cursor: not-allowed;\n input {\n color: ${COLORS.neutral_600} !important;\n }\n`;\n\nconst disabledState = css`\n background-color: ${COLORS.white};\n box-shadow: inset 0px 0px 0px 1px ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n pointer-events: none;\n cursor: not-allowed;\n svg {\n color: ${COLORS.neutral_300} !important;\n }\n input {\n color: ${COLORS.neutral_300} !important;\n ::placeholder {\n color: ${COLORS.neutral_300} !important;\n }\n }\n`;\n\nconst activeValidationMessage = css`\n -webkit-box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n -moz-box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n`;\n\nconst placeholderStyling = css`\n ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n`;\n\nexport const InputField = styled.input`\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n border: none;\n outline: none;\n background-color: inherit;\n cursor: pointer;\n color: ${COLORS.black} !important;\n padding: 0;\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 ::placeholder {\n ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n\n ${BREAKPOINTS.MEDIUM} {\n ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n &.small {\n ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n &.medium {\n ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n`;\n\nexport const StyledField = styled.div<{ disabled: boolean; locked: boolean; showValidationMessage?: boolean; isPlaceholder?: boolean; fontSize?: string; minWidth?: string }>`\n ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\n\n padding: 12px 16px;\n height: 48px;\n min-width: ${(props) => (props.minWidth ? `${props.minWidth}` : '344px')};\n width: 100%;\n\n background: ${COLORS.white};\n box-shadow: inset 0px 0px 0px 1px ${COLORS.neutral_400};\n box-sizing: border-box;\n border-radius: 4px;\n cursor: pointer;\n\n display: flex;\n align-items: center;\n gap: 4px;\n\n input {\n font-size: inherit;\n line-height: inherit;\n color: inherit;\n }\n\n &::placeholder {\n ${ComponentXXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n\n ${BREAKPOINTS.MEDIUM} {\n ${ComponentMStyling(ComponentTextStyle.Regular, 'inherit')}\n padding: 16px;\n height: 56px;\n &::placeholder {\n ${ComponentXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n\n &.small {\n ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\n padding: 12px 16px;\n height: 48px;\n &::placeholder {\n ${ComponentXXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n &.medium {\n ${ComponentMStyling(ComponentTextStyle.Regular, 'inherit')}\n height: 56px;\n padding: 16px;\n &::placeholder {\n ${ComponentXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n\n &:focus {\n outline: 3px solid #ddd;\n }\n &:focus-within {\n -webkit-box-shadow: inset 0px 0px 0px 2px ${COLORS.primary_800};\n -moz-box-shadow: inset 0px 0px 0px 2px ${COLORS.primary_800};\n box-shadow: inset 0px 0px 0px 2px ${COLORS.primary_800};\n }\n &:hover {\n box-shadow: inset 0px 0px 0px 1px ${COLORS.primary_200};\n input {\n ::placeholder {\n color: ${COLORS.primary_600};\n }\n }\n cursor: pointer;\n }\n &:active {\n box-shadow: inset 0px 0px 0px 1px ${COLORS.primary_300};\n input {\n ::placeholder {\n color: ${COLORS.primary_800};\n }\n }\n }\n\n &.button {\n ${(props) => ComponentSStyling(ComponentTextStyle.Bold, props.disabled ? COLORS.neutral_300 : COLORS.neutral_600)}\n\n box-sizing: border-box;\n height: 32px;\n padding: 0 8px;\n width: initial;\n min-width: initial;\n border: none !important;\n box-shadow: none;\n border-radius: 4px;\n\n &.expanded {\n color: ${COLORS.neutral_800};\n background: ${COLORS.neutral_20};\n }\n }\n\n ${(props) => (props.disabled ? disabledState : '')}\n ${(props) => (props.locked ? lockedState : '')}\n ${(props) => (props.showValidationMessage ? activeValidationMessage : '')}\n ${(props) => (props.isPlaceholder ? placeholderStyling : '')}\n\n ${CommonInteractionStyling};\n`;\n\nexport const ButtonDropdownContentStyling = css`\n min-width: 344px;\n right: 0;\n`;\n\nexport const DropdownContentStyling = styled.div<{ isButton: boolean }>`\n display: none;\n position: absolute;\n background-color: ${COLORS.white};\n width: 100%;\n z-index: ${Z_INDEXES.dropdown};\n margin-top: ${(props) => (props.isButton ? '-4px' : '2px')};\n\n &.show {\n display: block;\n }\n\n &.up {\n top: auto;\n bottom: 100%;\n }\n\n ${(props) => (props.isButton ? ButtonDropdownContentStyling : '')};\n\n border: 1px solid ${COLORS.neutral_100};\n box-sizing: border-box;\n box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15);\n border-radius: 4px;\n padding: 4px 0;\n\n max-height: 240px;\n overflow-y: auto;\n\n /* width */\n ::-webkit-scrollbar {\n width: 4px;\n cursor: pointer;\n }\n\n /* Track */\n ::-webkit-scrollbar-track {\n background: ${COLORS.white};\n }\n\n /* Handle */\n ::-webkit-scrollbar-thumb {\n background: ${COLORS.neutral_200};\n border-radius: 8px;\n }\n\n /* Handle on hover */\n ::-webkit-scrollbar-thumb:hover {\n background: ${COLORS.neutral_400};\n }\n`;\n\nexport const DropdownButton = styled.button<{ size?: Size }>`\n ${(props) => DropdownButtonCSS(props.size)}\n`;\n\nexport const DropdownButtonCSS = (size?: Size) => {\n return css`\n ${size == Size.Small && ComponentSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n ${size == Size.Medium && ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n ${size == Size.Large && ComponentLStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n position: relative;\n text-decoration: none;\n display: flex;\n flex-direction: row;\n align-items: center;\n min-height: ${size == Size.Large ? '64px' : size == Size.Medium ? '56px' : '48px'};\n background-color: ${COLORS.white};\n border: none;\n cursor: pointer;\n background: transparent;\n width: 100%;\n text-align: left;\n\n span {\n margin: auto 0 auto 16px;\n line-height: 48px;\n }\n\n div.item-content {\n margin: auto 0 auto 16px;\n display: flex;\n align-items: center;\n\n div.item-label {\n flex: 1 0 calc(100% - 40px);\n }\n\n div.item-icon {\n margin-right: 6px;\n }\n div.item-icon-old {\n flex: 1 0 40px;\n display: flex;\n justify-content: flex-end;\n }\n }\n\n ${CommonInteractionStyling};\n\n &.active {\n background: ${COLORS.neutral_20};\n\n &::after {\n position: absolute;\n content: ' ';\n width: 4px;\n top: 0;\n bottom: 0;\n left: 2px;\n background-color: ${COLORS.primary_500};\n\n border-radius: 2px;\n }\n }\n\n &:disabled {\n background-color: transparent;\n cursor: not-allowed;\n color: ${COLORS.neutral_200};\n }\n\n &.active:hover {\n background-color: ${COLORS.primary_20};\n\n svg {\n color: ${COLORS.primary_600};\n }\n\n &::after {\n background-color: ${COLORS.primary_500};\n }\n }\n\n &.active:active {\n background-color: ${COLORS.primary_100};\n\n svg {\n color: ${COLORS.primary_800};\n }\n\n &::after {\n background-color: ${COLORS.primary_500};\n }\n }\n `;\n};\n\nexport const ButtonDropdownWrapper = styled.div<{ locked?: boolean; disabled?: boolean }>`\n box-sizing: border-box;\n min-height: 48px;\n display: flex;\n align-items: center;\n width: fit-content;\n\n .button {\n min-width: 64px;\n }\n\n .value {\n flex-grow: 1;\n display: flex;\n justify-content: center;\n }\n\n .dropdown-arrow {\n width: 24px;\n height: 24px;\n }\n\n ${(props) => (props.locked || props.disabled ? 'cursor: not-allowed;' : 'cursor: pointer;')}\n ${(props) => (props.disabled ? 'pointer-events: none;' : '')}\n \n &:hover .button,\n & > .button:hover {\n background-color: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n }\n\n &:focus .button,\n & > .button:focus {\n box-shadow: 0 4px 12px rgba(46, 127, 161, 0.25), 0 0 8px #2e7fa1;\n outline: none;\n }\n\n &:active .button,\n & > .button:active {\n box-shadow: none;\n background-color: ${COLORS.primary_100};\n color: ${COLORS.primary_800};\n }\n\n}`;\n"],"file":"CommonStyling.js"}
|
|
@@ -208,7 +208,7 @@
|
|
|
208
208
|
tabIndex: disabled || locked ? -1 : 0,
|
|
209
209
|
disabled: disabled || false
|
|
210
210
|
}), isLoading ? /*#__PURE__*/React.createElement(_LoadingIndicator.LoadingIndicator, {
|
|
211
|
-
size:
|
|
211
|
+
size: _types.Size.Small,
|
|
212
212
|
color: _styles.COLORS.neutral_600
|
|
213
213
|
}) : null, /*#__PURE__*/React.createElement("div", {
|
|
214
214
|
onClick: () => setIsOpen(!isOpen),
|
|
@@ -241,7 +241,7 @@
|
|
|
241
241
|
}, icon, /*#__PURE__*/React.createElement("div", {
|
|
242
242
|
className: 'value'
|
|
243
243
|
}, initalValue && keepInitialValue ? initalValue : input || placeholderSearch), isLoading ? /*#__PURE__*/React.createElement(_LoadingIndicator.LoadingIndicator, {
|
|
244
|
-
size:
|
|
244
|
+
size: _types.Size.Small,
|
|
245
245
|
color: _styles.COLORS.neutral_600
|
|
246
246
|
}) : null, /*#__PURE__*/React.createElement("div", {
|
|
247
247
|
onClick: () => setIsOpen(!isOpen),
|
|
@@ -266,7 +266,7 @@
|
|
|
266
266
|
selectedValues: selectedValues,
|
|
267
267
|
setSelectedValues: setSelectedValues,
|
|
268
268
|
hideOnClickOutside: true,
|
|
269
|
-
size: size
|
|
269
|
+
size: size ?? _types.Size.Small,
|
|
270
270
|
focused: focused,
|
|
271
271
|
setFocused: setFocused,
|
|
272
272
|
customizationProps: {
|
|
@@ -320,7 +320,6 @@
|
|
|
320
320
|
isButton: _propTypes2.default.bool,
|
|
321
321
|
activeValidationMessage: _propTypes2.default.string,
|
|
322
322
|
autofilledMessage: _propTypes2.default.string,
|
|
323
|
-
size: _propTypes2.default.oneOf(['small', 'medium']),
|
|
324
323
|
scrollable: _propTypes2.default.bool,
|
|
325
324
|
buttonFontSize: _propTypes2.default.string,
|
|
326
325
|
keepInitialValue: _propTypes2.default.bool,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/Dropdown/DropdownFilter.tsx"],"names":["label","customContent","id","list","placeholder","onSelect","onInputChange","initalValue","required","disableSorting","messageOnNoResults","disabled","locked","isButton","activeValidationMessage","autofilledMessage","size","scrollable","buttonFontSize","keepInitialValue","icon","margin","DropdownFilter","React","styledFieldRef","inputRef","handleKeyPress","e","matches","c","input","setInput","setFocused","setIsOpen","setRestartFilter","x","setPlaceholderSearch","document","setIsLoading","selectedValues","setSelectedValues","renderStandardDropdown","isOpen","Math","isLoading","COLORS","neutral_600","renderButtonDropdown","Size","itemsType","multiSelect","action","onValueUpdate","values","val","items","value","warning_400"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { BREAKPOINTS, COLORS } from '../styles';\nimport { ArrowDropDown, ArrowDropUp, Information, TechnicalWarning } from '../icons/systemicons/SystemIcons';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { DropdownButton, StyledField, Dropdown, ButtonDropdownWrapper, InputField } from './CommonStyling';\nimport DropdownContent from './DropdownContent';\nimport { Size } from '../types'\nimport { AutofilledMessage, WarningMessage } from '../InputFields/styling';\nimport { ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles/typography';\n\ninterface DropdownFilterItem {\n label: string;\n customContent?: React.ReactNode;\n}\n\ninterface DropdownFilterProps {\n id: string;\n list: DropdownFilterItem[];\n placeholder?: string;\n onSelect?: (value: string) => void;\n onInputChange?: (input: string) => void;\n initalValue?: string;\n required?: boolean;\n disableSorting?: boolean;\n messageOnNoResults?: string;\n disabled?: boolean;\n locked?: boolean;\n isButton?: boolean;\n activeValidationMessage?: string;\n autofilledMessage?: string;\n size?: 'small' | 'medium';\n scrollable?: boolean;\n buttonFontSize?: string;\n keepInitialValue?: boolean;\n icon?: React.ReactNode;\n margin?: string;\n}\n\nconst DropdownFilter = ({\n id,\n list,\n placeholder,\n onSelect,\n onInputChange,\n initalValue,\n required,\n disableSorting,\n messageOnNoResults,\n disabled,\n locked,\n scrollable,\n isButton,\n activeValidationMessage,\n autofilledMessage,\n size,\n buttonFontSize,\n keepInitialValue,\n icon,\n margin = '4px 0',\n}: DropdownFilterProps) => {\n const [isOpen, setIsOpen] = React.useState<boolean>(false);\n const [isLoading, setIsLoading] = React.useState<Boolean>(false);\n const [input, setInput] = React.useState<string>(initalValue ?? '');\n const [placeholderSearch, setPlaceholderSearch] = React.useState<string>(placeholder || '');\n const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n const [focused, setFocused] = React.useState<number | null>(null);\n\n const styledFieldRef = React.useRef<HTMLDivElement>(null);\n const inputRef = React.useRef<HTMLInputElement>(null);\n\n const handleKeyPress = (e: any) => {\n if (styledFieldRef?.current && styledFieldRef.current.contains(e.target)) {\n if (e.keyCode === 13 && !locked) {\n const matches = list?.filter((c) => c.label.toLowerCase() === input.toLowerCase());\n if (matches.length === 1 && onSelect) {\n onSelect(matches[0].label);\n setInput(matches[0].label);\n }\n if(!isOpen)\n setFocused(0);\n setIsOpen(!isOpen);\n if (matches.length === 0) {\n setInput('');\n }\n } else if (e.keyCode === 40) {\n if(!isOpen)\n setFocused(0);\n setIsOpen(!isOpen);\n }\n }\n };\n\n React.useEffect(() => {\n if (initalValue || initalValue === '') {\n setInput(initalValue);\n setRestartFilter(true);\n }\n }, [initalValue]);\n\n React.useEffect(() => {\n if (!isOpen && !list.some(x => x.label == input)) {\n setInput('');\n setPlaceholderSearch(placeholder || '');\n }\n }, [isOpen]);\n\n React.useEffect(() => {\n document.addEventListener('keypress', handleKeyPress);\n return () => {\n document.removeEventListener('keypress', handleKeyPress);\n };\n });\n\n React.useEffect(() => {\n setIsLoading(false);\n if (selectedValues.length > 0 && !list.some(x => x.label == input))\n setSelectedValues([]);\n\n if(list.some(x => x.label == input))\n {\n setSelectedValues([input]);\n onSelect && onSelect(input);\n }\n }, [input]);\n\n\n const renderStandardDropdown = () => {\n return (\n <StyledField\n ref={styledFieldRef}\n className={(isOpen ? 'expanded ' : '').concat(size ? size : '')}\n onClick={(e: any) => {\n e.stopPropagation();\n setIsOpen(!isOpen);\n inputRef.current?.focus();\n }}\n tabIndex={disabled || locked ? -1 : 0}\n disabled={disabled || false}\n locked={locked || false}\n showValidationMessage={!!activeValidationMessage}\n fontSize={buttonFontSize}\n data-testid={`otherdiv_${id}`}>\n <InputField\n ref={inputRef}\n autoComplete={'off-' + Math.floor(Math.random() * 999999999999)}\n type=\"search\"\n placeholder={placeholderSearch}\n value={input}\n className={size ? `${size} value` : 'value'}\n onChange={(e: any) => {\n if (!locked && !disabled) {\n setRestartFilter(false);\n setIsLoading(true);\n setIsOpen(true);\n setInput(e.target.value);\n if (onInputChange) {\n onInputChange(e.target.value || '');\n }\n }\n }}\n onClick={(e: any) => {\n if (!locked && !disabled) {\n e.stopPropagation();\n setIsOpen(!isOpen);\n }\n }}\n onFocus={() => setPlaceholderSearch('')}\n onBlur={() => setPlaceholderSearch(placeholder || '')}\n required={required}\n tabIndex={disabled || locked ? -1 : 0}\n disabled={disabled || false}\n />\n\n {isLoading ? <LoadingIndicator size=\"small\" color={COLORS.neutral_600} /> : null}\n\n <div onClick={() => setIsOpen(!isOpen)} className={'dropdown-arrow'}>\n {isOpen && !locked && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''} /> : <ArrowDropDown size=\"24px\" className={size ? size : ''} />}\n </div>\n </StyledField>\n );\n };\n\n const renderButtonDropdown = () => (\n <ButtonDropdownWrapper\n onClick={(e: any) => {\n e.stopPropagation();\n setIsOpen(!isOpen);\n inputRef.current?.focus();\n }}\n disabled={disabled}\n locked={locked}>\n <StyledField\n ref={styledFieldRef}\n className={(isOpen ? 'expanded ' : '').concat(size ? size + ' ' : '').concat(isButton ? 'button' : '')}\n tabIndex={disabled || locked ? -1 : 0}\n disabled={disabled || false}\n locked={locked || false}\n showValidationMessage={!!activeValidationMessage}\n fontSize={buttonFontSize}>\n {icon}\n <div className={'value'}>{initalValue && keepInitialValue ? initalValue : input || placeholderSearch}</div>\n {isLoading ? <LoadingIndicator size=\"small\" color={COLORS.neutral_600} /> : null}\n <div onClick={() => setIsOpen(!isOpen)} className={'dropdown-arrow'}>\n {isOpen && !locked && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''} /> : <ArrowDropDown size=\"24px\" className={size ? size : ''} />}\n </div>\n </StyledField>\n </ButtonDropdownWrapper>\n );\n\n return (\n <>\n <Dropdown isButton={isButton || false} disabled={disabled} locked={locked} className={size ? size : ''} margin={margin}>\n {!isButton && renderStandardDropdown()}\n {!!isButton && renderButtonDropdown()}\n {!locked && !disabled && (\n <DropdownContent\n isOpen={isOpen}\n messageOnNoResults={messageOnNoResults ?? ''}\n selectedValues={selectedValues}\n setSelectedValues={setSelectedValues}\n hideOnClickOutside={true}\n size={size == 'medium' ? Size.Medium : Size.Small}\n focused={focused}\n setFocused={setFocused}\n customizationProps={{\n itemsType: 'normal',\n scrollable: scrollable,\n multiSelect: false,\n action: () => {},\n onValueUpdate: (values: string[]) => {\n const val = values[0] ?? '';\n setRestartFilter(true);\n setInput(val);\n },\n items: list.map(x => ({ value: x.label, customContent: x.customContent }))\n }}\n filter={!restartFilter ? input : ''}\n setIsOpen={setIsOpen}\n alignLeft={false}\n isButton={isButton || false}\n id={`${id}_dropdowncontent`} />\n )}\n </Dropdown>\n {activeValidationMessage && (\n <WarningMessage className={size || ''}>\n <TechnicalWarning size=\"20px\" color={COLORS.warning_400} />\n <span>{activeValidationMessage}</span>\n </WarningMessage>\n )}\n {autofilledMessage && (\n <AutofilledMessage className={size || ''}>\n <Information size=\"20px\" color={COLORS.neutral_600} />\n <span>{autofilledMessage}</span>\n </AutofilledMessage>\n )}\n </>\n );\n};\n\nexport default DropdownFilter;\n"],"file":"DropdownFilter.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/Dropdown/DropdownFilter.tsx"],"names":["label","customContent","id","list","placeholder","onSelect","onInputChange","initalValue","required","disableSorting","messageOnNoResults","disabled","locked","isButton","activeValidationMessage","autofilledMessage","scrollable","buttonFontSize","keepInitialValue","icon","margin","DropdownFilter","React","styledFieldRef","inputRef","handleKeyPress","e","matches","c","input","setInput","setFocused","setIsOpen","setRestartFilter","x","setPlaceholderSearch","document","setIsLoading","selectedValues","setSelectedValues","renderStandardDropdown","isOpen","size","Math","isLoading","Size","COLORS","neutral_600","renderButtonDropdown","itemsType","multiSelect","action","onValueUpdate","values","val","items","value","warning_400"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { BREAKPOINTS, COLORS } from '../styles';\nimport { ArrowDropDown, ArrowDropUp, Information, TechnicalWarning } from '../icons/systemicons/SystemIcons';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { DropdownButton, StyledField, Dropdown, ButtonDropdownWrapper, InputField } from './CommonStyling';\nimport DropdownContent from './DropdownContent';\nimport { Size } from '../types'\nimport { AutofilledMessage, WarningMessage } from '../InputFields/styling';\nimport { ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles/typography';\n\ninterface DropdownFilterItem {\n label: string;\n customContent?: React.ReactNode;\n}\n\ninterface DropdownFilterProps {\n id: string;\n list: DropdownFilterItem[];\n placeholder?: string;\n onSelect?: (value: string) => void;\n onInputChange?: (input: string) => void;\n initalValue?: string;\n required?: boolean;\n disableSorting?: boolean;\n messageOnNoResults?: string;\n disabled?: boolean;\n locked?: boolean;\n isButton?: boolean;\n activeValidationMessage?: string;\n autofilledMessage?: string;\n size?: Size.Small | Size.Medium;\n scrollable?: boolean;\n buttonFontSize?: string;\n keepInitialValue?: boolean;\n icon?: React.ReactNode;\n margin?: string;\n}\n\nconst DropdownFilter = ({\n id,\n list,\n placeholder,\n onSelect,\n onInputChange,\n initalValue,\n required,\n disableSorting,\n messageOnNoResults,\n disabled,\n locked,\n scrollable,\n isButton,\n activeValidationMessage,\n autofilledMessage,\n size,\n buttonFontSize,\n keepInitialValue,\n icon,\n margin = '4px 0',\n}: DropdownFilterProps) => {\n const [isOpen, setIsOpen] = React.useState<boolean>(false);\n const [isLoading, setIsLoading] = React.useState<Boolean>(false);\n const [input, setInput] = React.useState<string>(initalValue ?? '');\n const [placeholderSearch, setPlaceholderSearch] = React.useState<string>(placeholder || '');\n const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n const [focused, setFocused] = React.useState<number | null>(null);\n\n const styledFieldRef = React.useRef<HTMLDivElement>(null);\n const inputRef = React.useRef<HTMLInputElement>(null);\n\n const handleKeyPress = (e: any) => {\n if (styledFieldRef?.current && styledFieldRef.current.contains(e.target)) {\n if (e.keyCode === 13 && !locked) {\n const matches = list?.filter((c) => c.label.toLowerCase() === input.toLowerCase());\n if (matches.length === 1 && onSelect) {\n onSelect(matches[0].label);\n setInput(matches[0].label);\n }\n if(!isOpen)\n setFocused(0);\n setIsOpen(!isOpen);\n if (matches.length === 0) {\n setInput('');\n }\n } else if (e.keyCode === 40) {\n if(!isOpen)\n setFocused(0);\n setIsOpen(!isOpen);\n }\n }\n };\n\n React.useEffect(() => {\n if (initalValue || initalValue === '') {\n setInput(initalValue);\n setRestartFilter(true);\n }\n }, [initalValue]);\n\n React.useEffect(() => {\n if (!isOpen && !list.some(x => x.label == input)) {\n setInput('');\n setPlaceholderSearch(placeholder || '');\n }\n }, [isOpen]);\n\n React.useEffect(() => {\n document.addEventListener('keypress', handleKeyPress);\n return () => {\n document.removeEventListener('keypress', handleKeyPress);\n };\n });\n\n React.useEffect(() => {\n setIsLoading(false);\n if (selectedValues.length > 0 && !list.some(x => x.label == input))\n setSelectedValues([]);\n\n if(list.some(x => x.label == input))\n {\n setSelectedValues([input]);\n onSelect && onSelect(input);\n }\n }, [input]);\n\n\n const renderStandardDropdown = () => {\n return (\n <StyledField\n ref={styledFieldRef}\n className={(isOpen ? 'expanded ' : '').concat(size ? size : '')}\n onClick={(e: any) => {\n e.stopPropagation();\n setIsOpen(!isOpen);\n inputRef.current?.focus();\n }}\n tabIndex={disabled || locked ? -1 : 0}\n disabled={disabled || false}\n locked={locked || false}\n showValidationMessage={!!activeValidationMessage}\n fontSize={buttonFontSize}\n data-testid={`otherdiv_${id}`}>\n <InputField\n ref={inputRef}\n autoComplete={'off-' + Math.floor(Math.random() * 999999999999)}\n type=\"search\"\n placeholder={placeholderSearch}\n value={input}\n className={size ? `${size} value` : 'value'}\n onChange={(e: any) => {\n if (!locked && !disabled) {\n setRestartFilter(false);\n setIsLoading(true);\n setIsOpen(true);\n setInput(e.target.value);\n if (onInputChange) {\n onInputChange(e.target.value || '');\n }\n }\n }}\n onClick={(e: any) => {\n if (!locked && !disabled) {\n e.stopPropagation();\n setIsOpen(!isOpen);\n }\n }}\n onFocus={() => setPlaceholderSearch('')}\n onBlur={() => setPlaceholderSearch(placeholder || '')}\n required={required}\n tabIndex={disabled || locked ? -1 : 0}\n disabled={disabled || false}\n />\n\n {isLoading ? <LoadingIndicator size={Size.Small} color={COLORS.neutral_600} /> : null}\n\n <div onClick={() => setIsOpen(!isOpen)} className={'dropdown-arrow'}>\n {isOpen && !locked && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''} /> : <ArrowDropDown size=\"24px\" className={size ? size : ''} />}\n </div>\n </StyledField>\n );\n };\n\n const renderButtonDropdown = () => (\n <ButtonDropdownWrapper\n onClick={(e: any) => {\n e.stopPropagation();\n setIsOpen(!isOpen);\n inputRef.current?.focus();\n }}\n disabled={disabled}\n locked={locked}>\n <StyledField\n ref={styledFieldRef}\n className={(isOpen ? 'expanded ' : '').concat(size ? size + ' ' : '').concat(isButton ? 'button' : '')}\n tabIndex={disabled || locked ? -1 : 0}\n disabled={disabled || false}\n locked={locked || false}\n showValidationMessage={!!activeValidationMessage}\n fontSize={buttonFontSize}>\n {icon}\n <div className={'value'}>{initalValue && keepInitialValue ? initalValue : input || placeholderSearch}</div>\n {isLoading ? <LoadingIndicator size={Size.Small} color={COLORS.neutral_600} /> : null}\n <div onClick={() => setIsOpen(!isOpen)} className={'dropdown-arrow'}>\n {isOpen && !locked && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''} /> : <ArrowDropDown size=\"24px\" className={size ? size : ''} />}\n </div>\n </StyledField>\n </ButtonDropdownWrapper>\n );\n\n return (\n <>\n <Dropdown isButton={isButton || false} disabled={disabled} locked={locked} className={size ? size : ''} margin={margin}>\n {!isButton && renderStandardDropdown()}\n {!!isButton && renderButtonDropdown()}\n {!locked && !disabled && (\n <DropdownContent\n isOpen={isOpen}\n messageOnNoResults={messageOnNoResults ?? ''}\n selectedValues={selectedValues}\n setSelectedValues={setSelectedValues}\n hideOnClickOutside={true}\n size={size ?? Size.Small}\n focused={focused}\n setFocused={setFocused}\n customizationProps={{\n itemsType: 'normal',\n scrollable: scrollable,\n multiSelect: false,\n action: () => {},\n onValueUpdate: (values: string[]) => {\n const val = values[0] ?? '';\n setRestartFilter(true);\n setInput(val);\n },\n items: list.map(x => ({ value: x.label, customContent: x.customContent }))\n }}\n filter={!restartFilter ? input : ''}\n setIsOpen={setIsOpen}\n alignLeft={false}\n isButton={isButton || false}\n id={`${id}_dropdowncontent`} />\n )}\n </Dropdown>\n {activeValidationMessage && (\n <WarningMessage className={size || ''}>\n <TechnicalWarning size=\"20px\" color={COLORS.warning_400} />\n <span>{activeValidationMessage}</span>\n </WarningMessage>\n )}\n {autofilledMessage && (\n <AutofilledMessage className={size || ''}>\n <Information size=\"20px\" color={COLORS.neutral_600} />\n <span>{autofilledMessage}</span>\n </AutofilledMessage>\n )}\n </>\n );\n};\n\nexport default DropdownFilter;\n"],"file":"DropdownFilter.js"}
|
|
@@ -110,7 +110,7 @@
|
|
|
110
110
|
}
|
|
111
111
|
`;
|
|
112
112
|
const AvatarImage = _styledComponents2.default.div`
|
|
113
|
-
background-color: ${props => props
|
|
113
|
+
background-color: ${props => props.$color};
|
|
114
114
|
display: flex;
|
|
115
115
|
align-items: center;
|
|
116
116
|
justify-content: center;
|
|
@@ -156,7 +156,7 @@
|
|
|
156
156
|
onMouseDown: e => e.preventDefault()
|
|
157
157
|
}, /*#__PURE__*/React.createElement(AvatarImage, {
|
|
158
158
|
size: size,
|
|
159
|
-
color: color,
|
|
159
|
+
$color: color,
|
|
160
160
|
useInteractionStyling: useInteractionStyling
|
|
161
161
|
}, /*#__PURE__*/React.createElement(AvatarLetter, {
|
|
162
162
|
"data-hj-suppress": true,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/Avatar.tsx"],"names":["LinkStyling","css","COLORS","primary_500","primary","ImageStyling","primary_700","primary_800","AvatarLink","styled","div","props","AvatarImage","color","AvatarLetter","AvatarContainer","BREAKPOINTS","MEDIUM","firstName","lastName","size","profileMenuLink","useInteractionStyling","Avatar","e"],"mappings":";;;;;;;;;;;;;;;;;;;;;;MAAA,K;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,QAAMA,WAAW,GAAGC,qBAAI;AACxB;AACA,kBAAkBC,eAAOC,WAAY;AACrC;AACA;AACA;AACA,8BAA8BD,eAAOE,OAAQ;AAC7C;AAPA,CAAA;AAUA,QAAMC,YAAY,GAAGJ,qBAAI;AACzB;AACA,wBAAwBC,eAAOI,WAAY;AAC3C;AACA;AACA;AACA,kBAAkBJ,eAAOK,WAAY;AACrC;AAPA,CAAA;AAUA,QAAMC,UAAU,GAAGC,2BAAOC,GAAsD;AAChF;AACA;AACA,
|
|
1
|
+
{"version":3,"sources":["../../../src/GlobalNavigationBar/Avatar.tsx"],"names":["LinkStyling","css","COLORS","primary_500","primary","ImageStyling","primary_700","primary_800","AvatarLink","styled","div","props","AvatarImage","$color","AvatarLetter","AvatarContainer","BREAKPOINTS","MEDIUM","firstName","lastName","size","color","profileMenuLink","useInteractionStyling","Avatar","e"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\nimport { COLORS, BREAKPOINTS } from '../styles';\n\nconst LinkStyling = css`\n &:focus {\n background: ${COLORS.primary_500};\n outline: none;\n }\n &:focus-within {\n box-shadow: 0px 0px 8px ${COLORS.primary}, 0px 4px 12px rgba(46, 127, 161, 0.25);\n }\n`;\n\nconst ImageStyling = css`\n &:hover {\n background-color: ${COLORS.primary_700};\n }\n\n &:active {\n background: ${COLORS.primary_800};\n }\n`;\n\nconst AvatarLink = styled.div<{ size: number; useInteractionStyling: boolean }>`\n text-decoration: none;\n\n ${(props) => (props.useInteractionStyling ? LinkStyling : '')};\n &:focus {\n outline: none;\n }\n &:focus-within {\n border-radius: ${(props) => (props.useInteractionStyling ? `${props.size ? props.size : 48}px` : '')};\n }\n`;\n\nconst AvatarImage = styled.div<{ size: number; $color: string; useInteractionStyling: boolean }>`\n background-color: ${(props) => props.$color};\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: ${(props) => (props.size ? props.size : 48)}px;\n height: ${(props) => (props.size ? props.size : 48)}px;\n width: ${(props) => (props.size ? props.size : 48)}px;\n cursor: pointer;\n\n ${(props) => (props.useInteractionStyling ? ImageStyling : '')};\n`;\n\nconst AvatarLetter = styled.div<{ size: number }>`\n font-size: ${(props) => props.size / 2 - 2}px;\n color: white;\n font-weight: bold;\n text-transform: uppercase;\n display: inline-block;\n line-height: ${(props) => (props.size ? props.size : 48)}px;\n`;\n\nexport const AvatarContainer = styled.div<{ hideOnLowWidth?: boolean; inMobileMenu?: boolean; hidePadding?: boolean }>`\n flex-direction: column;\n align-self: center;\n margin-right: ${(props) => (props.inMobileMenu ? '6px' : '8px')};\n margin-left: ${(props) => (props.inMobileMenu ? '0' : 'auto')};\n display: ${(props) => (props.hideOnLowWidth ? 'none' : 'flex')};\n\n ${BREAKPOINTS.MEDIUM} {\n display: flex;\n ${(props) => (!props.hidePadding ? 'padding: 6px;' : '')};\n }\n`;\n\ninterface AvatarProps {\n firstName: string;\n lastName: string;\n size: number;\n color: string;\n profileMenuLink: string;\n useInteractionStyling?: boolean;\n}\n\nconst Avatar = ({ firstName, lastName, size, color, useInteractionStyling = true }: AvatarProps) => {\n return (\n <AvatarLink size={size} tabIndex={0} useInteractionStyling={useInteractionStyling} onMouseDown={(e: any) => e.preventDefault()}>\n <AvatarImage size={size} $color={color} useInteractionStyling={useInteractionStyling}>\n <AvatarLetter data-hj-suppress size={size}>\n {firstName[0]}\n {lastName[0]}\n </AvatarLetter>\n </AvatarImage>\n </AvatarLink>\n );\n};\n\nexport default Avatar;\n"],"file":"Avatar.js"}
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
(function (global, factory) {
|
|
2
2
|
if (typeof define === "function" && define.amd) {
|
|
3
|
-
define(["exports", "prop-types", "react", "styled-components", "../styles", "../Tabs", "../styles/z-indexes"], factory);
|
|
3
|
+
define(["exports", "prop-types", "react", "styled-components", "../styles", "../Tabs", "..", "../styles/z-indexes"], factory);
|
|
4
4
|
} else if (typeof exports !== "undefined") {
|
|
5
|
-
factory(exports, require("prop-types"), require("react"), require("styled-components"), require("../styles"), require("../Tabs"), require("../styles/z-indexes"));
|
|
5
|
+
factory(exports, require("prop-types"), require("react"), require("styled-components"), require("../styles"), require("../Tabs"), require(".."), require("../styles/z-indexes"));
|
|
6
6
|
} else {
|
|
7
7
|
var mod = {
|
|
8
8
|
exports: {}
|
|
9
9
|
};
|
|
10
|
-
factory(mod.exports, global.propTypes, global.react, global.styledComponents, global.styles, global.Tabs, global.zIndexes);
|
|
10
|
+
factory(mod.exports, global.propTypes, global.react, global.styledComponents, global.styles, global.Tabs, global._, global.zIndexes);
|
|
11
11
|
global.undefined = mod.exports;
|
|
12
12
|
}
|
|
13
|
-
})(this, function (exports, _propTypes, _react, _styledComponents, _styles, _Tabs, _zIndexes) {
|
|
13
|
+
})(this, function (exports, _propTypes, _react, _styledComponents, _styles, _Tabs, _, _zIndexes) {
|
|
14
14
|
"use strict";
|
|
15
15
|
|
|
16
16
|
Object.defineProperty(exports, "__esModule", {
|
|
@@ -179,7 +179,7 @@
|
|
|
179
179
|
}, /*#__PURE__*/React.createElement(MenuSection, null, /*#__PURE__*/React.createElement(MenuSectionList, null, /*#__PURE__*/React.createElement(_Tabs.VerticalTabs, {
|
|
180
180
|
key: "ExtendedMenu",
|
|
181
181
|
entries: entries,
|
|
182
|
-
size:
|
|
182
|
+
size: _.Size.Medium
|
|
183
183
|
}))));
|
|
184
184
|
};
|
|
185
185
|
|