@laerdal/life-react-components 1.6.1-dev.1 → 1.7.0-dev.11
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/Accordion/ContentAccordion.cjs +1 -1
- package/dist/Accordion/ContentAccordion.cjs.map +1 -1
- package/dist/Accordion/ContentAccordion.js +2 -2
- package/dist/Accordion/ContentAccordion.js.map +1 -1
- package/dist/Accordion/styles.cjs +1 -1
- package/dist/Accordion/styles.cjs.map +1 -1
- package/dist/Accordion/styles.js +2 -2
- package/dist/Accordion/styles.js.map +1 -1
- package/dist/Banners/Banner.cjs +21 -5
- package/dist/Banners/Banner.cjs.map +1 -1
- package/dist/Banners/Banner.js +20 -5
- package/dist/Banners/Banner.js.map +1 -1
- package/dist/Banners/styles.cjs +1 -1
- package/dist/Banners/styles.cjs.map +1 -1
- package/dist/Banners/styles.js +1 -1
- package/dist/Banners/styles.js.map +1 -1
- package/dist/Button/BackButton.cjs +5 -2
- package/dist/Button/BackButton.cjs.map +1 -1
- package/dist/Button/BackButton.js +5 -3
- package/dist/Button/BackButton.js.map +1 -1
- package/dist/Button/Button.cjs +11 -25
- package/dist/Button/Button.cjs.map +1 -1
- package/dist/Button/Button.d.ts +2 -1
- package/dist/Button/Button.js +12 -26
- package/dist/Button/Button.js.map +1 -1
- package/dist/Button/DualFunctionButton.cjs +29 -7
- package/dist/Button/DualFunctionButton.cjs.map +1 -1
- package/dist/Button/DualFunctionButton.js +27 -6
- package/dist/Button/DualFunctionButton.js.map +1 -1
- package/dist/Button/Iconbutton.cjs +17 -27
- package/dist/Button/Iconbutton.cjs.map +1 -1
- package/dist/Button/Iconbutton.d.ts +4 -0
- package/dist/Button/Iconbutton.js +18 -28
- package/dist/Button/Iconbutton.js.map +1 -1
- package/dist/Card/Card.cjs +28 -44
- package/dist/Card/Card.cjs.map +1 -1
- package/dist/Card/Card.d.ts +3 -11
- package/dist/Card/Card.js +26 -44
- package/dist/Card/Card.js.map +1 -1
- package/dist/Card/CardBottomSection.cjs +2 -9
- package/dist/Card/CardBottomSection.cjs.map +1 -1
- package/dist/Card/CardBottomSection.d.ts +1 -2
- package/dist/Card/CardBottomSection.js +3 -10
- package/dist/Card/CardBottomSection.js.map +1 -1
- package/dist/Card/CardMiddleSection.cjs +2 -7
- package/dist/Card/CardMiddleSection.cjs.map +1 -1
- package/dist/Card/CardMiddleSection.d.ts +0 -2
- package/dist/Card/CardMiddleSection.js +3 -8
- package/dist/Card/CardMiddleSection.js.map +1 -1
- package/dist/Card/CardTopSection.cjs +11 -14
- package/dist/Card/CardTopSection.cjs.map +1 -1
- package/dist/Card/CardTopSection.d.ts +2 -4
- package/dist/Card/CardTopSection.js +12 -15
- package/dist/Card/CardTopSection.js.map +1 -1
- package/dist/Card/index.cjs +1 -13
- package/dist/Card/index.cjs.map +1 -1
- package/dist/Card/index.d.ts +0 -1
- package/dist/Card/index.js +0 -1
- package/dist/Card/index.js.map +1 -1
- package/dist/Chips/ActionChip.cjs +22 -29
- package/dist/Chips/ActionChip.cjs.map +1 -1
- package/dist/Chips/ActionChip.js +24 -31
- package/dist/Chips/ActionChip.js.map +1 -1
- package/dist/Chips/ChipStyles.cjs +8 -22
- package/dist/Chips/ChipStyles.cjs.map +1 -1
- package/dist/Chips/ChipStyles.d.ts +2 -9
- package/dist/Chips/ChipStyles.js +5 -14
- package/dist/Chips/ChipStyles.js.map +1 -1
- package/dist/Chips/ChipTypes.d.ts +13 -27
- package/dist/Chips/ChoiceChips.cjs +14 -8
- package/dist/Chips/ChoiceChips.cjs.map +1 -1
- package/dist/Chips/ChoiceChips.js +14 -9
- package/dist/Chips/ChoiceChips.js.map +1 -1
- package/dist/Chips/FilterChip.cjs +22 -29
- package/dist/Chips/FilterChip.cjs.map +1 -1
- package/dist/Chips/FilterChip.js +25 -32
- package/dist/Chips/FilterChip.js.map +1 -1
- package/dist/Chips/InputChip.cjs +46 -46
- package/dist/Chips/InputChip.cjs.map +1 -1
- package/dist/Chips/InputChip.js +48 -47
- package/dist/Chips/InputChip.js.map +1 -1
- package/dist/Chips/index.cjs +1 -1
- package/dist/Chips/index.cjs.map +1 -1
- package/dist/Chips/index.d.ts +1 -1
- package/dist/Chips/index.js +1 -1
- package/dist/Chips/index.js.map +1 -1
- package/dist/ChipsInput/ChipDropdownInput.cjs +401 -0
- package/dist/ChipsInput/ChipDropdownInput.cjs.map +1 -0
- package/dist/ChipsInput/ChipDropdownInput.d.ts +22 -0
- package/dist/ChipsInput/ChipDropdownInput.js +383 -0
- package/dist/ChipsInput/ChipDropdownInput.js.map +1 -0
- package/dist/ChipsInput/ChipInput.cjs +141 -0
- package/dist/ChipsInput/ChipInput.cjs.map +1 -0
- package/dist/{Chips → ChipsInput}/ChipInput.d.ts +1 -4
- package/dist/ChipsInput/ChipInput.js +122 -0
- package/dist/ChipsInput/ChipInput.js.map +1 -0
- package/dist/ChipsInput/ChipInputField.cjs +208 -0
- package/dist/ChipsInput/ChipInputField.cjs.map +1 -0
- package/dist/ChipsInput/ChipInputField.d.ts +24 -0
- package/dist/ChipsInput/ChipInputField.js +169 -0
- package/dist/ChipsInput/ChipInputField.js.map +1 -0
- package/dist/ChipsInput/ChipInputTypes.cjs +6 -0
- package/dist/ChipsInput/ChipInputTypes.cjs.map +1 -0
- package/dist/ChipsInput/ChipInputTypes.d.ts +22 -0
- package/dist/ChipsInput/ChipInputTypes.js +2 -0
- package/dist/ChipsInput/ChipInputTypes.js.map +1 -0
- package/dist/ChipsInput/index.cjs +19 -0
- package/dist/ChipsInput/index.cjs.map +1 -0
- package/dist/ChipsInput/index.d.ts +1 -0
- package/dist/ChipsInput/index.js +2 -0
- package/dist/ChipsInput/index.js.map +1 -0
- package/dist/Dropdown/BasicDropdown.cjs +31 -11
- package/dist/Dropdown/BasicDropdown.cjs.map +1 -1
- package/dist/Dropdown/BasicDropdown.js +33 -12
- package/dist/Dropdown/BasicDropdown.js.map +1 -1
- package/dist/Dropdown/CommonStyling.cjs +12 -10
- package/dist/Dropdown/CommonStyling.cjs.map +1 -1
- package/dist/Dropdown/CommonStyling.js +12 -11
- package/dist/Dropdown/CommonStyling.js.map +1 -1
- package/dist/Dropdown/DropdownButton.cjs +22 -15
- package/dist/Dropdown/DropdownButton.cjs.map +1 -1
- package/dist/Dropdown/DropdownButton.js +21 -15
- package/dist/Dropdown/DropdownButton.js.map +1 -1
- package/dist/Dropdown/DropdownContent.cjs +168 -133
- package/dist/Dropdown/DropdownContent.cjs.map +1 -1
- package/dist/Dropdown/DropdownContent.d.ts +2 -2
- package/dist/Dropdown/DropdownContent.js +166 -135
- package/dist/Dropdown/DropdownContent.js.map +1 -1
- package/dist/Dropdown/DropdownFilter.cjs +63 -24
- package/dist/Dropdown/DropdownFilter.cjs.map +1 -1
- package/dist/Dropdown/DropdownFilter.js +62 -25
- package/dist/Dropdown/DropdownFilter.js.map +1 -1
- package/dist/Dropdown/index.cjs +0 -8
- package/dist/Dropdown/index.cjs.map +1 -1
- package/dist/Dropdown/index.d.ts +1 -2
- package/dist/Dropdown/index.js +1 -2
- package/dist/Dropdown/index.js.map +1 -1
- package/dist/Footer/Components/FooterDropdownLinks.cjs +6 -3
- package/dist/Footer/Components/FooterDropdownLinks.cjs.map +1 -1
- package/dist/Footer/Components/FooterDropdownLinks.js +6 -4
- package/dist/Footer/Components/FooterDropdownLinks.js.map +1 -1
- package/dist/Footer/Components/FooterNewsletterAndSocialSection.cjs +5 -3
- package/dist/Footer/Components/FooterNewsletterAndSocialSection.cjs.map +1 -1
- package/dist/Footer/Components/FooterNewsletterAndSocialSection.js +5 -4
- package/dist/Footer/Components/FooterNewsletterAndSocialSection.js.map +1 -1
- package/dist/Footer/Components/FooterTop.cjs +2 -1
- package/dist/Footer/Components/FooterTop.cjs.map +1 -1
- package/dist/Footer/Components/FooterTop.js +3 -2
- package/dist/Footer/Components/FooterTop.js.map +1 -1
- package/dist/GlobalNavigationBar/Avatar.cjs +5 -7
- package/dist/GlobalNavigationBar/Avatar.cjs.map +1 -1
- package/dist/GlobalNavigationBar/Avatar.js +5 -8
- package/dist/GlobalNavigationBar/Avatar.js.map +1 -1
- package/dist/GlobalNavigationBar/Logo.cjs +9 -6
- package/dist/GlobalNavigationBar/Logo.cjs.map +1 -1
- package/dist/GlobalNavigationBar/Logo.d.ts +2 -1
- package/dist/GlobalNavigationBar/Logo.js +9 -7
- package/dist/GlobalNavigationBar/Logo.js.map +1 -1
- package/dist/GlobalNavigationBar/MainMenu.cjs +10 -13
- package/dist/GlobalNavigationBar/MainMenu.cjs.map +1 -1
- package/dist/GlobalNavigationBar/MainMenu.js +9 -13
- package/dist/GlobalNavigationBar/MainMenu.js.map +1 -1
- package/dist/GlobalNavigationBar/RightSideNav.cjs +3 -5
- package/dist/GlobalNavigationBar/RightSideNav.cjs.map +1 -1
- package/dist/GlobalNavigationBar/RightSideNav.js +2 -5
- package/dist/GlobalNavigationBar/RightSideNav.js.map +1 -1
- package/dist/GlobalNavigationBar/UserMenu/MobileUserMenu.cjs +3 -1
- package/dist/GlobalNavigationBar/UserMenu/MobileUserMenu.cjs.map +1 -1
- package/dist/GlobalNavigationBar/UserMenu/MobileUserMenu.js +2 -1
- package/dist/GlobalNavigationBar/UserMenu/MobileUserMenu.js.map +1 -1
- package/dist/GlobalNavigationBar/mobile/CommonStyles.cjs +1 -1
- package/dist/GlobalNavigationBar/mobile/CommonStyles.cjs.map +1 -1
- package/dist/GlobalNavigationBar/mobile/CommonStyles.js +2 -2
- package/dist/GlobalNavigationBar/mobile/CommonStyles.js.map +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenu.cjs +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenu.cjs.map +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenu.js +2 -2
- package/dist/GlobalNavigationBar/mobile/MobileMenu.js.map +1 -1
- package/dist/HyperLink/HyperLink.cjs +3 -1
- package/dist/HyperLink/HyperLink.cjs.map +1 -1
- package/dist/HyperLink/HyperLink.d.ts +4 -0
- package/dist/HyperLink/HyperLink.js +1 -1
- package/dist/HyperLink/HyperLink.js.map +1 -1
- package/dist/HyperLink/styling.cjs +1 -1
- package/dist/HyperLink/styling.cjs.map +1 -1
- package/dist/HyperLink/styling.js +1 -1
- package/dist/HyperLink/styling.js.map +1 -1
- package/dist/Image/ImageWithFallbacks.cjs +122 -0
- package/dist/Image/ImageWithFallbacks.cjs.map +1 -0
- package/dist/Image/ImageWithFallbacks.d.ts +21 -0
- package/dist/Image/ImageWithFallbacks.js +109 -0
- package/dist/Image/ImageWithFallbacks.js.map +1 -0
- package/dist/Image/index.cjs +16 -0
- package/dist/Image/index.cjs.map +1 -0
- package/dist/Image/index.d.ts +2 -0
- package/dist/Image/index.js +3 -0
- package/dist/Image/index.js.map +1 -0
- package/dist/InputFields/Checkbox.cjs +11 -8
- package/dist/InputFields/Checkbox.cjs.map +1 -1
- package/dist/InputFields/Checkbox.d.ts +1 -0
- package/dist/InputFields/Checkbox.js +12 -9
- package/dist/InputFields/Checkbox.js.map +1 -1
- package/dist/InputFields/DatepickerField.cjs +57 -19
- package/dist/InputFields/DatepickerField.cjs.map +1 -1
- package/dist/InputFields/DatepickerField.js +56 -19
- package/dist/InputFields/DatepickerField.js.map +1 -1
- package/dist/InputFields/QuickSearch.cjs +119 -96
- package/dist/InputFields/QuickSearch.cjs.map +1 -1
- package/dist/InputFields/QuickSearch.js +119 -96
- package/dist/InputFields/QuickSearch.js.map +1 -1
- package/dist/InputFields/RadioButton.cjs +10 -7
- package/dist/InputFields/RadioButton.cjs.map +1 -1
- package/dist/InputFields/RadioButton.d.ts +1 -0
- package/dist/InputFields/RadioButton.js +11 -8
- package/dist/InputFields/RadioButton.js.map +1 -1
- package/dist/InputFields/SearchBar.cjs +3 -3
- package/dist/InputFields/SearchBar.cjs.map +1 -1
- package/dist/InputFields/SearchBar.js +3 -3
- package/dist/InputFields/SearchBar.js.map +1 -1
- package/dist/InputFields/Textarea.cjs +1 -1
- package/dist/InputFields/Textarea.cjs.map +1 -1
- package/dist/InputFields/Textarea.js +1 -1
- package/dist/InputFields/Textarea.js.map +1 -1
- package/dist/InputFields/components/SearchBarInput.cjs +6 -8
- package/dist/InputFields/components/SearchBarInput.cjs.map +1 -1
- package/dist/InputFields/components/SearchBarInput.d.ts +0 -3
- package/dist/InputFields/components/SearchBarInput.js +4 -5
- package/dist/InputFields/components/SearchBarInput.js.map +1 -1
- package/dist/InputFields/components/SearchField.cjs +29 -19
- package/dist/InputFields/components/SearchField.cjs.map +1 -1
- package/dist/InputFields/components/SearchField.d.ts +8 -8
- package/dist/InputFields/components/SearchField.js +25 -18
- package/dist/InputFields/components/SearchField.js.map +1 -1
- package/dist/InputFields/styling.cjs +6 -8
- package/dist/InputFields/styling.cjs.map +1 -1
- package/dist/InputFields/styling.js +7 -8
- package/dist/InputFields/styling.js.map +1 -1
- package/dist/List/ListRow.cjs +5 -5
- package/dist/List/ListRow.cjs.map +1 -1
- package/dist/List/ListRow.js +8 -5
- package/dist/List/ListRow.js.map +1 -1
- package/dist/MenuItem/MenuItem.cjs +6 -2
- package/dist/MenuItem/MenuItem.cjs.map +1 -1
- package/dist/MenuItem/MenuItem.d.ts +1 -0
- package/dist/MenuItem/MenuItem.js +7 -3
- package/dist/MenuItem/MenuItem.js.map +1 -1
- package/dist/Modals/ModalContainer.cjs +79 -38
- package/dist/Modals/ModalContainer.cjs.map +1 -1
- package/dist/Modals/ModalContainer.d.ts +15 -8
- package/dist/Modals/ModalContainer.js +80 -37
- package/dist/Modals/ModalContainer.js.map +1 -1
- package/dist/Modals/ModalContent.cjs +234 -0
- package/dist/Modals/ModalContent.cjs.map +1 -0
- package/dist/Modals/ModalContent.d.ts +17 -0
- package/dist/Modals/ModalContent.js +203 -0
- package/dist/Modals/ModalContent.js.map +1 -0
- package/dist/Modals/ModalDialog.cjs +69 -42
- package/dist/Modals/ModalDialog.cjs.map +1 -1
- package/dist/Modals/ModalDialog.d.ts +6 -2
- package/dist/Modals/ModalDialog.js +71 -42
- package/dist/Modals/ModalDialog.js.map +1 -1
- package/dist/Modals/ModalStyles.cjs +14 -8
- package/dist/Modals/ModalStyles.cjs.map +1 -1
- package/dist/Modals/ModalStyles.d.ts +2 -0
- package/dist/Modals/ModalStyles.js +12 -7
- package/dist/Modals/ModalStyles.js.map +1 -1
- package/dist/Modals/ModalTypes.d.ts +5 -0
- package/dist/Modals/index.cjs +8 -0
- package/dist/Modals/index.cjs.map +1 -1
- package/dist/Modals/index.d.ts +3 -2
- package/dist/Modals/index.js +2 -1
- package/dist/Modals/index.js.map +1 -1
- package/dist/NavItem/NavItem.cjs +1 -1
- package/dist/NavItem/NavItem.cjs.map +1 -1
- package/dist/NavItem/NavItem.js +2 -2
- package/dist/NavItem/NavItem.js.map +1 -1
- package/dist/Paginator/Paginator.cjs +1 -1
- package/dist/Paginator/Paginator.cjs.map +1 -1
- package/dist/Paginator/Paginator.js +2 -2
- package/dist/Paginator/Paginator.js.map +1 -1
- package/dist/QuizButton/QuizButton.cjs +4 -8
- package/dist/QuizButton/QuizButton.cjs.map +1 -1
- package/dist/QuizButton/QuizButton.js +5 -9
- package/dist/QuizButton/QuizButton.js.map +1 -1
- package/dist/SegmentControl/SegmentControl.cjs +1 -1
- package/dist/SegmentControl/SegmentControl.cjs.map +1 -1
- package/dist/SegmentControl/SegmentControl.js +2 -2
- package/dist/SegmentControl/SegmentControl.js.map +1 -1
- package/dist/SkipToContent/SkipToContent.cjs +2 -2
- package/dist/SkipToContent/SkipToContent.cjs.map +1 -1
- package/dist/SkipToContent/SkipToContent.js +2 -2
- package/dist/SkipToContent/SkipToContent.js.map +1 -1
- package/dist/Switcher/MobileSwitcherMenu.cjs +3 -1
- package/dist/Switcher/MobileSwitcherMenu.cjs.map +1 -1
- package/dist/Switcher/MobileSwitcherMenu.js +2 -1
- package/dist/Switcher/MobileSwitcherMenu.js.map +1 -1
- package/dist/Switcher/SwitcherMenuItem.cjs +1 -1
- package/dist/Switcher/SwitcherMenuItem.cjs.map +1 -1
- package/dist/Switcher/SwitcherMenuItem.js +2 -2
- package/dist/Switcher/SwitcherMenuItem.js.map +1 -1
- package/dist/Table/TableStyles.cjs +4 -4
- package/dist/Table/TableStyles.cjs.map +1 -1
- package/dist/Table/TableStyles.js +5 -5
- package/dist/Table/TableStyles.js.map +1 -1
- package/dist/Tabs/HorizontalTabs.cjs +5 -1
- package/dist/Tabs/HorizontalTabs.cjs.map +1 -1
- package/dist/Tabs/HorizontalTabs.js +6 -3
- package/dist/Tabs/HorizontalTabs.js.map +1 -1
- package/dist/Tabs/TabLink.cjs +48 -45
- package/dist/Tabs/TabLink.cjs.map +1 -1
- package/dist/Tabs/TabLink.js +47 -46
- package/dist/Tabs/TabLink.js.map +1 -1
- package/dist/Tabs/VerticalTabs.cjs.map +1 -1
- package/dist/Tabs/VerticalTabs.js.map +1 -1
- package/dist/Toasters/Toast.cjs +2 -0
- package/dist/Toasters/Toast.cjs.map +1 -1
- package/dist/Toasters/Toast.js +2 -0
- package/dist/Toasters/Toast.js.map +1 -1
- package/dist/Toggles/ToggleSwitch.cjs +8 -6
- package/dist/Toggles/ToggleSwitch.cjs.map +1 -1
- package/dist/Toggles/ToggleSwitch.js +8 -6
- package/dist/Toggles/ToggleSwitch.js.map +1 -1
- package/dist/Toggles/TogglerStyles.cjs +2 -2
- package/dist/Toggles/TogglerStyles.cjs.map +1 -1
- package/dist/Toggles/TogglerStyles.js +3 -3
- package/dist/Toggles/TogglerStyles.js.map +1 -1
- package/dist/Tooltips/TooltipStyles.cjs +2 -2
- package/dist/Tooltips/TooltipStyles.cjs.map +1 -1
- package/dist/Tooltips/TooltipStyles.js +3 -3
- package/dist/Tooltips/TooltipStyles.js.map +1 -1
- package/dist/Tooltips/TooltipTypes.cjs.map +1 -1
- package/dist/Tooltips/TooltipTypes.d.ts +1 -0
- package/dist/Tooltips/TooltipTypes.js.map +1 -1
- package/dist/Tooltips/TooltipWrapper.cjs +2 -0
- package/dist/Tooltips/TooltipWrapper.cjs.map +1 -1
- package/dist/Tooltips/TooltipWrapper.d.ts +1 -1
- package/dist/Tooltips/TooltipWrapper.js +2 -0
- package/dist/Tooltips/TooltipWrapper.js.map +1 -1
- package/dist/common/ActionWithin.cjs +67 -0
- package/dist/common/ActionWithin.cjs.map +1 -0
- package/dist/common/ActionWithin.d.ts +2 -0
- package/dist/common/ActionWithin.js +55 -0
- package/dist/common/ActionWithin.js.map +1 -0
- package/dist/common/ClickOutside.cjs +39 -0
- package/dist/common/ClickOutside.cjs.map +1 -0
- package/dist/common/ClickOutside.d.ts +1 -0
- package/dist/common/ClickOutside.js +25 -0
- package/dist/common/ClickOutside.js.map +1 -0
- package/dist/common/FocusOutside.cjs +39 -0
- package/dist/common/FocusOutside.cjs.map +1 -0
- package/dist/common/FocusOutside.d.ts +1 -0
- package/dist/common/FocusOutside.js +25 -0
- package/dist/common/FocusOutside.js.map +1 -0
- package/dist/common/FocusVisible.cjs +67 -19
- package/dist/common/FocusVisible.cjs.map +1 -1
- package/dist/common/FocusVisible.js +66 -19
- package/dist/common/FocusVisible.js.map +1 -1
- package/dist/common/InputStyling.cjs +1 -1
- package/dist/common/InputStyling.cjs.map +1 -1
- package/dist/common/InputStyling.js +2 -2
- package/dist/common/InputStyling.js.map +1 -1
- package/dist/common/index.cjs +24 -0
- package/dist/common/index.cjs.map +1 -1
- package/dist/common/index.d.ts +3 -0
- package/dist/common/index.js +3 -0
- package/dist/common/index.js.map +1 -1
- package/dist/icons/index.cjs +1 -1
- package/dist/icons/index.cjs.map +1 -1
- package/dist/icons/index.js +1 -1
- package/dist/icons/index.js.map +1 -1
- package/dist/index.cjs +28 -0
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +2 -0
- package/dist/index.js +2 -0
- package/dist/index.js.map +1 -1
- package/dist/styles/focus-styles.cjs +22 -0
- package/dist/styles/focus-styles.cjs.map +1 -0
- package/dist/styles/focus-styles.d.ts +2 -0
- package/dist/styles/focus-styles.js +9 -0
- package/dist/styles/focus-styles.js.map +1 -0
- package/dist/styles/index.cjs +67 -1
- package/dist/styles/index.cjs.map +1 -1
- package/dist/styles/index.d.ts +3 -1
- package/dist/styles/index.js +6 -1
- package/dist/styles/index.js.map +1 -1
- package/dist/types.cjs.map +1 -1
- package/dist/types.js.map +1 -1
- package/package.json +1 -1
- package/dist/Chips/ChipInput.cjs +0 -199
- package/dist/Chips/ChipInput.cjs.map +0 -1
- package/dist/Chips/ChipInput.js +0 -182
- package/dist/Chips/ChipInput.js.map +0 -1
- package/dist/Dropdown/ChipDropdownInput.cjs +0 -431
- package/dist/Dropdown/ChipDropdownInput.cjs.map +0 -1
- package/dist/Dropdown/ChipDropdownInput.d.ts +0 -24
- package/dist/Dropdown/ChipDropdownInput.js +0 -418
- package/dist/Dropdown/ChipDropdownInput.js.map +0 -1
|
@@ -57,7 +57,7 @@ var BottomPinnedSection = _styledComponents.default.div(_templateObject2 || (_te
|
|
|
57
57
|
|
|
58
58
|
var FirstRowLayout = (0, _styledComponents.default)(_CommonStyles.RowLayout)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n margin-top: 10px;\n padding: 12px;\n"])));
|
|
59
59
|
var BottomRowLayout = (0, _styledComponents.default)(_CommonStyles.RowLayout)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n margin: 8px auto 0 0;\n width: 95%;\n height: 48px;\n ", " {\n height: 56px;\n }\n"])), _styles.BREAKPOINTS.SMALL);
|
|
60
|
-
var StyledNavItem = (0, _styledComponents.default)(_Switcher.SwitcherMenuItem)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n padding: 0 0 0 20px;\n margin: 0 2px;\n\n display: flex;\n align-items: center;\n text-align: center;\n position: relative;\n\n ", "\n text-decoration: none;\n\n svg {\n margin-right: 16px;\n }\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n left: 0;\n top: 0;\n bottom: 0;\n width: 4px;\n background-color: transparent;\n }\n\n &.active:not(.disabled) {\n font-weight: bold;\n &:after {\n background-color: ", ";\n }\n\n color: ", ";\n svg path {\n fill: ", ";\n }\n }\n\n &.disabled {\n color: ", ";\n background-color: ", ";\n }\n\n &:hover:not(.disabled) {\n color: ", ";\n background-color: ", ";\n\n svg path {\n fill: ", ";\n }\n }\n\n &:active:not(.disabled) {\n color: ", ";\n background-color: ", ";\n
|
|
60
|
+
var StyledNavItem = (0, _styledComponents.default)(_Switcher.SwitcherMenuItem)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n padding: 0 0 0 20px;\n margin: 0 2px;\n\n display: flex;\n align-items: center;\n text-align: center;\n position: relative;\n\n ", "\n text-decoration: none;\n\n svg {\n margin-right: 16px;\n }\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n left: 0;\n top: 0;\n bottom: 0;\n width: 4px;\n background-color: transparent;\n }\n\n &.active:not(.disabled) {\n font-weight: bold;\n &:after {\n background-color: ", ";\n }\n\n color: ", ";\n svg path {\n fill: ", ";\n }\n }\n\n &.disabled {\n color: ", ";\n background-color: ", ";\n }\n\n &:hover:not(.disabled) {\n color: ", ";\n background-color: ", ";\n\n svg path {\n fill: ", ";\n }\n }\n\n &:active:not(.disabled) {\n color: ", ";\n background-color: ", ";\n &:after {\n background-color: ", ";\n }\n svg path {\n fill: ", ";\n }\n }\n\n &:focus:not(.disabled) {\n ", "\n }\n"])), (0, _typography.ComponentMStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.black), _styles.COLORS.primary_500, _styles.COLORS.primary_800, _styles.COLORS.primary_800, _styles.COLORS.neutral_300, _styles.COLORS.neutral_100, _styles.COLORS.primary_600, _styles.COLORS.primary_20, _styles.COLORS.primary_600, _styles.COLORS.primary_800, _styles.COLORS.primary_100, _styles.COLORS.primary_500, _styles.COLORS.primary_800, _styles.focusStyles);
|
|
61
61
|
|
|
62
62
|
var SwitcherButton = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: auto;\n\n line-height: 48px;\n button:last-child {\n margin: 0 !important;\n }\n"])));
|
|
63
63
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"names":["SwitchButton","styled","span","ComponentTextStyle","Bold","COLORS","neutral_600","BottomPinnedSection","div","neutral_200","FirstRowLayout","RowLayout","BottomRowLayout","BREAKPOINTS","SMALL","StyledNavItem","SwitcherMenuItem","Regular","black","primary_500","primary_800","neutral_300","neutral_100","primary_600","primary_20","primary_100","SwitcherButton","MobileMenu","clickMenuAction","navigationOptions","actions","firstName","lastName","email","signout","notifications","accountSection","organizationSection","supportSection","switcherAction","accountMenuHeader","signOutLabel","organizationName","useUserMenu","showUserMenu","setShowUserMenu","React","useState","showNotificationMenu","setShowNotificationMenu","notificationMenuRef","useRef","userMenuRef","userRef","location","user","notification","fireAction","action","ref","undefined","current","blur","isPressingEnter","e","key","preventDefault","stopPropagation","useEffect","map","no","NavLink","exact","to","onClick","label","padding","margin","name","secondaryNavigationOptions","isAuthenticated"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport {BREAKPOINTS, COLORS, ComponentTextStyle} from '../../styles';\nimport {ActionOptions, NavButton, NavOption, UserMenuItem} from '../../types';\nimport Actions from '../Actions';\nimport {Close, Notification, SwitchApp} from '../../icons/systemicons/SystemIcons';\nimport MobileActionMenu from './MobileActionMenu';\nimport {MenuSection, MenuSectionList, MenuWrapper, Right, RowLayout} from './CommonStyles';\nimport {NavLink, useLocation} from 'react-router-dom';\nimport {SwitcherMenuItem} from '../../Switcher';\nimport Avatar, {AvatarContainer} from '../Avatar';\nimport MobileUserMenu from '../UserMenu/MobileUserMenu';\nimport {IconButton} from '../../Button';\nimport {LaerdalLogo} from '../../assets';\nimport {ComponentMStyling, ComponentXSStyling} from '../../styles/typography';\n\nconst SwitchButton = styled.span`\n ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n \n padding: 0;\n border: 0;\n margin: 0 auto 0 12px;\n line-height: 48px;\n`;\n\nconst BottomPinnedSection = styled.div`\n position: absolute;\n left: 0;\n width: 100%;\n bottom: 0;\n border-top: 1px solid ${COLORS.neutral_200};\n`;\n\nconst FirstRowLayout = styled(RowLayout)`\n margin-top: 10px;\n padding: 12px;\n`;\n\nconst BottomRowLayout = styled(RowLayout)`\n margin: 8px auto 0 0;\n width: 95%;\n height: 48px;\n ${BREAKPOINTS.SMALL} {\n height: 56px;\n }\n`;\n\nconst StyledNavItem = styled(SwitcherMenuItem)`\n padding: 0 0 0 20px;\n margin: 0 2px;\n\n display: flex;\n align-items: center;\n text-align: center;\n position: relative;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n text-decoration: none;\n\n svg {\n margin-right: 16px;\n }\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n left: 0;\n top: 0;\n bottom: 0;\n width: 4px;\n background-color: transparent;\n }\n\n &.active:not(.disabled) {\n font-weight: bold;\n &:after {\n background-color: ${COLORS.primary_500};\n }\n\n color: ${COLORS.primary_800};\n svg path {\n fill: ${COLORS.primary_800};\n }\n }\n\n &.disabled {\n color: ${COLORS.neutral_300};\n background-color: ${COLORS.neutral_100};\n }\n\n &:hover:not(.disabled) {\n color: ${COLORS.primary_600};\n background-color: ${COLORS.primary_20};\n\n svg path {\n fill: ${COLORS.primary_600};\n }\n }\n\n &:active:not(.disabled) {\n color: ${COLORS.primary_800};\n background-color: ${COLORS.primary_100};\n box-shadow: none;\n &:after {\n background-color: ${COLORS.primary_500};\n }\n svg path {\n fill: ${COLORS.primary_800};\n }\n }\n\n &:focus:not(.disabled) {\n box-shadow: 0px 0px 8px ${COLORS.primary_500}, 0px 4px 12px rgba(46, 127, 161, 0.25);\n outline: none;\n }\n`;\nconst SwitcherButton = styled.div`\n display: flex;\n margin-left: auto;\n\n line-height: 48px;\n button:last-child {\n margin: 0 !important;\n }\n`;\n\ntype Props = {\n name: string;\n navigationOptions?: NavOption[];\n secondaryNavigationOptions?: NavOption[];\n secondaryButton?: NavButton;\n actions?: ActionOptions;\n clickMenuAction: () => void;\n firstName: string;\n lastName: string;\n email: string;\n signout?: (e: any) => void;\n isAuthenticated?: boolean;\n notifications?: NavOption[];\n switcherAction?: () => void;\n accountSection?: UserMenuItem[];\n organizationSection?: UserMenuItem[];\n supportSection?: UserMenuItem[];\n accountMenuHeader: string;\n signOutLabel: string;\n organizationName: string;\n useUserMenu: boolean | undefined;\n showUserMenu: boolean;\n setShowUserMenu: (show: boolean) => void;\n};\n\nconst MobileMenu = ({\n clickMenuAction,\n navigationOptions,\n actions,\n firstName,\n lastName,\n email,\n signout,\n notifications,\n accountSection,\n organizationSection,\n supportSection,\n switcherAction,\n accountMenuHeader,\n signOutLabel,\n organizationName,\n useUserMenu,\n showUserMenu,\n setShowUserMenu,\n}: Props) => {\n const [showNotificationMenu, setShowNotificationMenu] = React.useState<boolean>(false);\n const notificationMenuRef = React.useRef(null);\n const userMenuRef = React.useRef(null);\n const userRef = React.useRef(null);\n\n const location = useLocation();\n\n if (actions?.user) {\n actions.user = () => setShowUserMenu(true);\n }\n if (actions?.notification) {\n actions.notification = () => setShowNotificationMenu(true);\n }\n\n const fireAction = (action: (() => void) | undefined, ref: React.MutableRefObject<HTMLButtonElement | null> | undefined = undefined) => {\n ref?.current?.blur();\n !!action && action();\n };\n\n const isPressingEnter = (e: any) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n e.stopPropagation();\n return true;\n }\n return false;\n };\n\n React.useEffect(() => {\n clickMenuAction();\n }, [location]);\n\n return (\n <>\n {actions?.notification && (\n <MenuWrapper ref={notificationMenuRef} className={showNotificationMenu ? 'open' : ''} isVisible={showNotificationMenu}>\n <MobileActionMenu\n name=\"Notifications\"\n clickMenuAction={() => setShowNotificationMenu(false)}\n navigationOptions={notifications}\n actionList={{\n notification: () => {},\n }}\n />\n </MenuWrapper>\n )}\n {actions?.user && (\n <MenuWrapper ref={userMenuRef} className={showUserMenu ? 'open' : ''} isVisible={showUserMenu}>\n <MobileUserMenu\n accountMenuHeader={accountMenuHeader}\n firstName={firstName}\n lastName={lastName}\n email={email}\n organizationName={organizationName}\n clickMenuAction={clickMenuAction}\n accountSection={accountSection}\n organizationSection={organizationSection}\n supportSection={supportSection}\n signOut={signout}\n signOutLabel={signOutLabel}\n />\n </MenuWrapper>\n )}\n <FirstRowLayout>\n {firstName && lastName && (\n <AvatarContainer\n id=\"avatarContainer\"\n ref={userRef}\n onClick={actions?.user}\n onKeyDown={(e: any) => (isPressingEnter(e) ? fireAction(actions?.user, userRef) : null)}\n inMobileMenu={true}\n hideOnLowWidth={false}>\n <Avatar size={36} firstName={firstName} lastName={lastName} color={COLORS.primary_500} profileMenuLink=\"#TODO\" />\n </AvatarContainer>\n )}\n {actions?.notification && (\n <IconButton\n variant={'secondary'}\n shape={'circular'}\n hideOnLowWidth={false}\n isInMobileMenu={true}\n action={() => fireAction(actions?.notification)}\n onKeyPress={(e: any) => (isPressingEnter(e) ? fireAction(actions?.notification) : null)}>\n <Notification size=\"24px\" />\n </IconButton>\n )}\n <Right>\n <Actions\n actions={actions}\n firstName={firstName}\n lastName={lastName}\n isInMobileMenu={true}\n hideOnLowWidth={false}\n useUserMenu={useUserMenu}\n setShowUserMenu={setShowUserMenu}\n />\n <IconButton variant=\"secondary\" shape=\"circular\" action={() => clickMenuAction()} isInMobileMenu={true}>\n <Close size=\"24px\" />\n </IconButton>\n </Right>\n </FirstRowLayout>\n <MenuSection>\n <MenuSectionList>\n {navigationOptions?.map((no) => (\n <li key={no.label}>\n <StyledNavItem\n as={NavLink}\n exact={no?.exact}\n to={no.to}\n onClick={() => {\n if (no?.onClick) {\n no?.onClick();\n }\n }}>\n {no.label}\n </StyledNavItem>\n </li>\n ))}\n </MenuSectionList>\n </MenuSection>\n\n <BottomPinnedSection>\n <MenuSection style={{ padding: '0 12px 12px 12px', margin: '0' }}>\n <MenuSectionList>\n <BottomRowLayout>\n <LaerdalLogo />\n {switcherAction && (\n <SwitcherButton>\n <SwitchButton onClick={() => switcherAction()}>Switch site</SwitchButton>{' '}\n <IconButton\n variant={'secondary'}\n shape={'circular'}\n hideOnLowWidth={false}\n isInMobileMenu={true}\n id=\"globalNavAppsButton\"\n action={() => switcherAction()}\n onKeyPress={(e: any) => (isPressingEnter(e) ? switcherAction() : null)}>\n <SwitchApp size=\"24px\" />\n </IconButton>\n </SwitcherButton>\n )}\n </BottomRowLayout>\n </MenuSectionList>\n </MenuSection>\n </BottomPinnedSection>\n </>\n );\n};\n\nexport default MobileMenu;\n"],"file":"MobileMenu.cjs"}
|
|
1
|
+
{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"names":["SwitchButton","styled","span","ComponentTextStyle","Bold","COLORS","neutral_600","BottomPinnedSection","div","neutral_200","FirstRowLayout","RowLayout","BottomRowLayout","BREAKPOINTS","SMALL","StyledNavItem","SwitcherMenuItem","Regular","black","primary_500","primary_800","neutral_300","neutral_100","primary_600","primary_20","primary_100","focusStyles","SwitcherButton","MobileMenu","clickMenuAction","navigationOptions","actions","firstName","lastName","email","signout","notifications","accountSection","organizationSection","supportSection","switcherAction","accountMenuHeader","signOutLabel","organizationName","useUserMenu","showUserMenu","setShowUserMenu","React","useState","showNotificationMenu","setShowNotificationMenu","notificationMenuRef","useRef","userMenuRef","userRef","location","user","notification","fireAction","action","ref","undefined","current","blur","isPressingEnter","e","key","preventDefault","stopPropagation","useEffect","map","no","NavLink","exact","to","onClick","label","padding","margin","name","secondaryNavigationOptions","isAuthenticated"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles} from '../../styles';\nimport {ActionOptions, NavButton, NavOption, UserMenuItem} from '../../types';\nimport Actions from '../Actions';\nimport {Close, Notification, SwitchApp} from '../../icons/systemicons/SystemIcons';\nimport MobileActionMenu from './MobileActionMenu';\nimport {MenuSection, MenuSectionList, MenuWrapper, Right, RowLayout} from './CommonStyles';\nimport {NavLink, useLocation} from 'react-router-dom';\nimport {SwitcherMenuItem} from '../../Switcher';\nimport Avatar, {AvatarContainer} from '../Avatar';\nimport MobileUserMenu from '../UserMenu/MobileUserMenu';\nimport {IconButton} from '../../Button';\nimport {LaerdalLogo} from '../../assets';\nimport {ComponentMStyling, ComponentXSStyling} from '../../styles/typography';\n\nconst SwitchButton = styled.span`\n ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n \n padding: 0;\n border: 0;\n margin: 0 auto 0 12px;\n line-height: 48px;\n`;\n\nconst BottomPinnedSection = styled.div`\n position: absolute;\n left: 0;\n width: 100%;\n bottom: 0;\n border-top: 1px solid ${COLORS.neutral_200};\n`;\n\nconst FirstRowLayout = styled(RowLayout)`\n margin-top: 10px;\n padding: 12px;\n`;\n\nconst BottomRowLayout = styled(RowLayout)`\n margin: 8px auto 0 0;\n width: 95%;\n height: 48px;\n ${BREAKPOINTS.SMALL} {\n height: 56px;\n }\n`;\n\nconst StyledNavItem = styled(SwitcherMenuItem)`\n padding: 0 0 0 20px;\n margin: 0 2px;\n\n display: flex;\n align-items: center;\n text-align: center;\n position: relative;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n text-decoration: none;\n\n svg {\n margin-right: 16px;\n }\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n left: 0;\n top: 0;\n bottom: 0;\n width: 4px;\n background-color: transparent;\n }\n\n &.active:not(.disabled) {\n font-weight: bold;\n &:after {\n background-color: ${COLORS.primary_500};\n }\n\n color: ${COLORS.primary_800};\n svg path {\n fill: ${COLORS.primary_800};\n }\n }\n\n &.disabled {\n color: ${COLORS.neutral_300};\n background-color: ${COLORS.neutral_100};\n }\n\n &:hover:not(.disabled) {\n color: ${COLORS.primary_600};\n background-color: ${COLORS.primary_20};\n\n svg path {\n fill: ${COLORS.primary_600};\n }\n }\n\n &:active:not(.disabled) {\n color: ${COLORS.primary_800};\n background-color: ${COLORS.primary_100};\n &:after {\n background-color: ${COLORS.primary_500};\n }\n svg path {\n fill: ${COLORS.primary_800};\n }\n }\n\n &:focus:not(.disabled) {\n ${focusStyles}\n }\n`;\nconst SwitcherButton = styled.div`\n display: flex;\n margin-left: auto;\n\n line-height: 48px;\n button:last-child {\n margin: 0 !important;\n }\n`;\n\ntype Props = {\n name: string;\n navigationOptions?: NavOption[];\n secondaryNavigationOptions?: NavOption[];\n secondaryButton?: NavButton;\n actions?: ActionOptions;\n clickMenuAction: () => void;\n firstName: string;\n lastName: string;\n email: string;\n signout?: (e: any) => void;\n isAuthenticated?: boolean;\n notifications?: NavOption[];\n switcherAction?: () => void;\n accountSection?: UserMenuItem[];\n organizationSection?: UserMenuItem[];\n supportSection?: UserMenuItem[];\n accountMenuHeader: string;\n signOutLabel: string;\n organizationName: string;\n useUserMenu: boolean | undefined;\n showUserMenu: boolean;\n setShowUserMenu: (show: boolean) => void;\n};\n\nconst MobileMenu = ({\n clickMenuAction,\n navigationOptions,\n actions,\n firstName,\n lastName,\n email,\n signout,\n notifications,\n accountSection,\n organizationSection,\n supportSection,\n switcherAction,\n accountMenuHeader,\n signOutLabel,\n organizationName,\n useUserMenu,\n showUserMenu,\n setShowUserMenu,\n}: Props) => {\n const [showNotificationMenu, setShowNotificationMenu] = React.useState<boolean>(false);\n const notificationMenuRef = React.useRef(null);\n const userMenuRef = React.useRef(null);\n const userRef = React.useRef(null);\n\n const location = useLocation();\n\n if (actions?.user) {\n actions.user = () => setShowUserMenu(true);\n }\n if (actions?.notification) {\n actions.notification = () => setShowNotificationMenu(true);\n }\n\n const fireAction = (action: (() => void) | undefined, ref: React.MutableRefObject<HTMLButtonElement | null> | undefined = undefined) => {\n ref?.current?.blur();\n !!action && action();\n };\n\n const isPressingEnter = (e: any) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n e.stopPropagation();\n return true;\n }\n return false;\n };\n\n React.useEffect(() => {\n clickMenuAction();\n }, [location]);\n\n return (\n <>\n {actions?.notification && (\n <MenuWrapper ref={notificationMenuRef} className={showNotificationMenu ? 'open' : ''} isVisible={showNotificationMenu}>\n <MobileActionMenu\n name=\"Notifications\"\n clickMenuAction={() => setShowNotificationMenu(false)}\n navigationOptions={notifications}\n actionList={{\n notification: () => {},\n }}\n />\n </MenuWrapper>\n )}\n {actions?.user && (\n <MenuWrapper ref={userMenuRef} className={showUserMenu ? 'open' : ''} isVisible={showUserMenu}>\n <MobileUserMenu\n accountMenuHeader={accountMenuHeader}\n firstName={firstName}\n lastName={lastName}\n email={email}\n organizationName={organizationName}\n clickMenuAction={clickMenuAction}\n accountSection={accountSection}\n organizationSection={organizationSection}\n supportSection={supportSection}\n signOut={signout}\n signOutLabel={signOutLabel}\n />\n </MenuWrapper>\n )}\n <FirstRowLayout>\n {firstName && lastName && (\n <AvatarContainer\n id=\"avatarContainer\"\n ref={userRef}\n onClick={actions?.user}\n onKeyDown={(e: any) => (isPressingEnter(e) ? fireAction(actions?.user, userRef) : null)}\n inMobileMenu={true}\n hideOnLowWidth={false}>\n <Avatar size={36} firstName={firstName} lastName={lastName} color={COLORS.primary_500} profileMenuLink=\"#TODO\" />\n </AvatarContainer>\n )}\n {actions?.notification && (\n <IconButton\n variant={'secondary'}\n shape={'circular'}\n hideOnLowWidth={false}\n isInMobileMenu={true}\n action={() => fireAction(actions?.notification)}\n onKeyPress={(e: any) => (isPressingEnter(e) ? fireAction(actions?.notification) : null)}>\n <Notification size=\"24px\" />\n </IconButton>\n )}\n <Right>\n <Actions\n actions={actions}\n firstName={firstName}\n lastName={lastName}\n isInMobileMenu={true}\n hideOnLowWidth={false}\n useUserMenu={useUserMenu}\n setShowUserMenu={setShowUserMenu}\n />\n <IconButton variant=\"secondary\" shape=\"circular\" action={() => clickMenuAction()} isInMobileMenu={true}>\n <Close size=\"24px\" />\n </IconButton>\n </Right>\n </FirstRowLayout>\n <MenuSection>\n <MenuSectionList>\n {navigationOptions?.map((no) => (\n <li key={no.label}>\n <StyledNavItem\n as={NavLink}\n exact={no?.exact}\n to={no.to}\n onClick={() => {\n if (no?.onClick) {\n no?.onClick();\n }\n }}>\n {no.label}\n </StyledNavItem>\n </li>\n ))}\n </MenuSectionList>\n </MenuSection>\n\n <BottomPinnedSection>\n <MenuSection style={{ padding: '0 12px 12px 12px', margin: '0' }}>\n <MenuSectionList>\n <BottomRowLayout>\n <LaerdalLogo />\n {switcherAction && (\n <SwitcherButton>\n <SwitchButton onClick={() => switcherAction()}>Switch site</SwitchButton>{' '}\n <IconButton\n variant={'secondary'}\n shape={'circular'}\n hideOnLowWidth={false}\n isInMobileMenu={true}\n id=\"globalNavAppsButton\"\n action={() => switcherAction()}\n onKeyPress={(e: any) => (isPressingEnter(e) ? switcherAction() : null)}>\n <SwitchApp size=\"24px\" />\n </IconButton>\n </SwitcherButton>\n )}\n </BottomRowLayout>\n </MenuSectionList>\n </MenuSection>\n </BottomPinnedSection>\n </>\n );\n};\n\nexport default MobileMenu;\n"],"file":"MobileMenu.cjs"}
|
|
@@ -6,7 +6,7 @@ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _temp
|
|
|
6
6
|
|
|
7
7
|
import * as React from 'react';
|
|
8
8
|
import styled from 'styled-components';
|
|
9
|
-
import { BREAKPOINTS, COLORS, ComponentTextStyle } from '../../styles';
|
|
9
|
+
import { BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles } from '../../styles';
|
|
10
10
|
import Actions from '../Actions';
|
|
11
11
|
import { Close, Notification, SwitchApp } from '../../icons/systemicons/SystemIcons';
|
|
12
12
|
import MobileActionMenu from './MobileActionMenu';
|
|
@@ -25,7 +25,7 @@ var SwitchButton = styled.span(_templateObject || (_templateObject = _taggedTemp
|
|
|
25
25
|
var BottomPinnedSection = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n position: absolute;\n left: 0;\n width: 100%;\n bottom: 0;\n border-top: 1px solid ", ";\n"])), COLORS.neutral_200);
|
|
26
26
|
var FirstRowLayout = styled(RowLayout)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n margin-top: 10px;\n padding: 12px;\n"])));
|
|
27
27
|
var BottomRowLayout = styled(RowLayout)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n margin: 8px auto 0 0;\n width: 95%;\n height: 48px;\n ", " {\n height: 56px;\n }\n"])), BREAKPOINTS.SMALL);
|
|
28
|
-
var StyledNavItem = styled(SwitcherMenuItem)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n padding: 0 0 0 20px;\n margin: 0 2px;\n\n display: flex;\n align-items: center;\n text-align: center;\n position: relative;\n\n ", "\n text-decoration: none;\n\n svg {\n margin-right: 16px;\n }\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n left: 0;\n top: 0;\n bottom: 0;\n width: 4px;\n background-color: transparent;\n }\n\n &.active:not(.disabled) {\n font-weight: bold;\n &:after {\n background-color: ", ";\n }\n\n color: ", ";\n svg path {\n fill: ", ";\n }\n }\n\n &.disabled {\n color: ", ";\n background-color: ", ";\n }\n\n &:hover:not(.disabled) {\n color: ", ";\n background-color: ", ";\n\n svg path {\n fill: ", ";\n }\n }\n\n &:active:not(.disabled) {\n color: ", ";\n background-color: ", ";\n
|
|
28
|
+
var StyledNavItem = styled(SwitcherMenuItem)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n padding: 0 0 0 20px;\n margin: 0 2px;\n\n display: flex;\n align-items: center;\n text-align: center;\n position: relative;\n\n ", "\n text-decoration: none;\n\n svg {\n margin-right: 16px;\n }\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n left: 0;\n top: 0;\n bottom: 0;\n width: 4px;\n background-color: transparent;\n }\n\n &.active:not(.disabled) {\n font-weight: bold;\n &:after {\n background-color: ", ";\n }\n\n color: ", ";\n svg path {\n fill: ", ";\n }\n }\n\n &.disabled {\n color: ", ";\n background-color: ", ";\n }\n\n &:hover:not(.disabled) {\n color: ", ";\n background-color: ", ";\n\n svg path {\n fill: ", ";\n }\n }\n\n &:active:not(.disabled) {\n color: ", ";\n background-color: ", ";\n &:after {\n background-color: ", ";\n }\n svg path {\n fill: ", ";\n }\n }\n\n &:focus:not(.disabled) {\n ", "\n }\n"])), ComponentMStyling(ComponentTextStyle.Regular, COLORS.black), COLORS.primary_500, COLORS.primary_800, COLORS.primary_800, COLORS.neutral_300, COLORS.neutral_100, COLORS.primary_600, COLORS.primary_20, COLORS.primary_600, COLORS.primary_800, COLORS.primary_100, COLORS.primary_500, COLORS.primary_800, focusStyles);
|
|
29
29
|
var SwitcherButton = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n display: flex;\n margin-left: auto;\n\n line-height: 48px;\n button:last-child {\n margin: 0 !important;\n }\n"])));
|
|
30
30
|
|
|
31
31
|
var MobileMenu = function MobileMenu(_ref) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"names":["React","styled","BREAKPOINTS","COLORS","ComponentTextStyle","Actions","Close","Notification","SwitchApp","MobileActionMenu","MenuSection","MenuSectionList","MenuWrapper","Right","RowLayout","NavLink","useLocation","SwitcherMenuItem","Avatar","AvatarContainer","MobileUserMenu","IconButton","LaerdalLogo","ComponentMStyling","ComponentXSStyling","SwitchButton","span","Bold","neutral_600","BottomPinnedSection","div","neutral_200","FirstRowLayout","BottomRowLayout","SMALL","StyledNavItem","Regular","black","primary_500","primary_800","neutral_300","neutral_100","primary_600","primary_20","primary_100","SwitcherButton","MobileMenu","clickMenuAction","navigationOptions","actions","firstName","lastName","email","signout","notifications","accountSection","organizationSection","supportSection","switcherAction","accountMenuHeader","signOutLabel","organizationName","useUserMenu","showUserMenu","setShowUserMenu","useState","showNotificationMenu","setShowNotificationMenu","notificationMenuRef","useRef","userMenuRef","userRef","location","user","notification","fireAction","action","ref","undefined","current","blur","isPressingEnter","e","key","preventDefault","stopPropagation","useEffect","map","no","exact","to","onClick","label","padding","margin","name","secondaryNavigationOptions","isAuthenticated"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport {BREAKPOINTS, COLORS, ComponentTextStyle} from '../../styles';\nimport {ActionOptions, NavButton, NavOption, UserMenuItem} from '../../types';\nimport Actions from '../Actions';\nimport {Close, Notification, SwitchApp} from '../../icons/systemicons/SystemIcons';\nimport MobileActionMenu from './MobileActionMenu';\nimport {MenuSection, MenuSectionList, MenuWrapper, Right, RowLayout} from './CommonStyles';\nimport {NavLink, useLocation} from 'react-router-dom';\nimport {SwitcherMenuItem} from '../../Switcher';\nimport Avatar, {AvatarContainer} from '../Avatar';\nimport MobileUserMenu from '../UserMenu/MobileUserMenu';\nimport {IconButton} from '../../Button';\nimport {LaerdalLogo} from '../../assets';\nimport {ComponentMStyling, ComponentXSStyling} from '../../styles/typography';\n\nconst SwitchButton = styled.span`\n ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n \n padding: 0;\n border: 0;\n margin: 0 auto 0 12px;\n line-height: 48px;\n`;\n\nconst BottomPinnedSection = styled.div`\n position: absolute;\n left: 0;\n width: 100%;\n bottom: 0;\n border-top: 1px solid ${COLORS.neutral_200};\n`;\n\nconst FirstRowLayout = styled(RowLayout)`\n margin-top: 10px;\n padding: 12px;\n`;\n\nconst BottomRowLayout = styled(RowLayout)`\n margin: 8px auto 0 0;\n width: 95%;\n height: 48px;\n ${BREAKPOINTS.SMALL} {\n height: 56px;\n }\n`;\n\nconst StyledNavItem = styled(SwitcherMenuItem)`\n padding: 0 0 0 20px;\n margin: 0 2px;\n\n display: flex;\n align-items: center;\n text-align: center;\n position: relative;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n text-decoration: none;\n\n svg {\n margin-right: 16px;\n }\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n left: 0;\n top: 0;\n bottom: 0;\n width: 4px;\n background-color: transparent;\n }\n\n &.active:not(.disabled) {\n font-weight: bold;\n &:after {\n background-color: ${COLORS.primary_500};\n }\n\n color: ${COLORS.primary_800};\n svg path {\n fill: ${COLORS.primary_800};\n }\n }\n\n &.disabled {\n color: ${COLORS.neutral_300};\n background-color: ${COLORS.neutral_100};\n }\n\n &:hover:not(.disabled) {\n color: ${COLORS.primary_600};\n background-color: ${COLORS.primary_20};\n\n svg path {\n fill: ${COLORS.primary_600};\n }\n }\n\n &:active:not(.disabled) {\n color: ${COLORS.primary_800};\n background-color: ${COLORS.primary_100};\n box-shadow: none;\n &:after {\n background-color: ${COLORS.primary_500};\n }\n svg path {\n fill: ${COLORS.primary_800};\n }\n }\n\n &:focus:not(.disabled) {\n box-shadow: 0px 0px 8px ${COLORS.primary_500}, 0px 4px 12px rgba(46, 127, 161, 0.25);\n outline: none;\n }\n`;\nconst SwitcherButton = styled.div`\n display: flex;\n margin-left: auto;\n\n line-height: 48px;\n button:last-child {\n margin: 0 !important;\n }\n`;\n\ntype Props = {\n name: string;\n navigationOptions?: NavOption[];\n secondaryNavigationOptions?: NavOption[];\n secondaryButton?: NavButton;\n actions?: ActionOptions;\n clickMenuAction: () => void;\n firstName: string;\n lastName: string;\n email: string;\n signout?: (e: any) => void;\n isAuthenticated?: boolean;\n notifications?: NavOption[];\n switcherAction?: () => void;\n accountSection?: UserMenuItem[];\n organizationSection?: UserMenuItem[];\n supportSection?: UserMenuItem[];\n accountMenuHeader: string;\n signOutLabel: string;\n organizationName: string;\n useUserMenu: boolean | undefined;\n showUserMenu: boolean;\n setShowUserMenu: (show: boolean) => void;\n};\n\nconst MobileMenu = ({\n clickMenuAction,\n navigationOptions,\n actions,\n firstName,\n lastName,\n email,\n signout,\n notifications,\n accountSection,\n organizationSection,\n supportSection,\n switcherAction,\n accountMenuHeader,\n signOutLabel,\n organizationName,\n useUserMenu,\n showUserMenu,\n setShowUserMenu,\n}: Props) => {\n const [showNotificationMenu, setShowNotificationMenu] = React.useState<boolean>(false);\n const notificationMenuRef = React.useRef(null);\n const userMenuRef = React.useRef(null);\n const userRef = React.useRef(null);\n\n const location = useLocation();\n\n if (actions?.user) {\n actions.user = () => setShowUserMenu(true);\n }\n if (actions?.notification) {\n actions.notification = () => setShowNotificationMenu(true);\n }\n\n const fireAction = (action: (() => void) | undefined, ref: React.MutableRefObject<HTMLButtonElement | null> | undefined = undefined) => {\n ref?.current?.blur();\n !!action && action();\n };\n\n const isPressingEnter = (e: any) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n e.stopPropagation();\n return true;\n }\n return false;\n };\n\n React.useEffect(() => {\n clickMenuAction();\n }, [location]);\n\n return (\n <>\n {actions?.notification && (\n <MenuWrapper ref={notificationMenuRef} className={showNotificationMenu ? 'open' : ''} isVisible={showNotificationMenu}>\n <MobileActionMenu\n name=\"Notifications\"\n clickMenuAction={() => setShowNotificationMenu(false)}\n navigationOptions={notifications}\n actionList={{\n notification: () => {},\n }}\n />\n </MenuWrapper>\n )}\n {actions?.user && (\n <MenuWrapper ref={userMenuRef} className={showUserMenu ? 'open' : ''} isVisible={showUserMenu}>\n <MobileUserMenu\n accountMenuHeader={accountMenuHeader}\n firstName={firstName}\n lastName={lastName}\n email={email}\n organizationName={organizationName}\n clickMenuAction={clickMenuAction}\n accountSection={accountSection}\n organizationSection={organizationSection}\n supportSection={supportSection}\n signOut={signout}\n signOutLabel={signOutLabel}\n />\n </MenuWrapper>\n )}\n <FirstRowLayout>\n {firstName && lastName && (\n <AvatarContainer\n id=\"avatarContainer\"\n ref={userRef}\n onClick={actions?.user}\n onKeyDown={(e: any) => (isPressingEnter(e) ? fireAction(actions?.user, userRef) : null)}\n inMobileMenu={true}\n hideOnLowWidth={false}>\n <Avatar size={36} firstName={firstName} lastName={lastName} color={COLORS.primary_500} profileMenuLink=\"#TODO\" />\n </AvatarContainer>\n )}\n {actions?.notification && (\n <IconButton\n variant={'secondary'}\n shape={'circular'}\n hideOnLowWidth={false}\n isInMobileMenu={true}\n action={() => fireAction(actions?.notification)}\n onKeyPress={(e: any) => (isPressingEnter(e) ? fireAction(actions?.notification) : null)}>\n <Notification size=\"24px\" />\n </IconButton>\n )}\n <Right>\n <Actions\n actions={actions}\n firstName={firstName}\n lastName={lastName}\n isInMobileMenu={true}\n hideOnLowWidth={false}\n useUserMenu={useUserMenu}\n setShowUserMenu={setShowUserMenu}\n />\n <IconButton variant=\"secondary\" shape=\"circular\" action={() => clickMenuAction()} isInMobileMenu={true}>\n <Close size=\"24px\" />\n </IconButton>\n </Right>\n </FirstRowLayout>\n <MenuSection>\n <MenuSectionList>\n {navigationOptions?.map((no) => (\n <li key={no.label}>\n <StyledNavItem\n as={NavLink}\n exact={no?.exact}\n to={no.to}\n onClick={() => {\n if (no?.onClick) {\n no?.onClick();\n }\n }}>\n {no.label}\n </StyledNavItem>\n </li>\n ))}\n </MenuSectionList>\n </MenuSection>\n\n <BottomPinnedSection>\n <MenuSection style={{ padding: '0 12px 12px 12px', margin: '0' }}>\n <MenuSectionList>\n <BottomRowLayout>\n <LaerdalLogo />\n {switcherAction && (\n <SwitcherButton>\n <SwitchButton onClick={() => switcherAction()}>Switch site</SwitchButton>{' '}\n <IconButton\n variant={'secondary'}\n shape={'circular'}\n hideOnLowWidth={false}\n isInMobileMenu={true}\n id=\"globalNavAppsButton\"\n action={() => switcherAction()}\n onKeyPress={(e: any) => (isPressingEnter(e) ? switcherAction() : null)}>\n <SwitchApp size=\"24px\" />\n </IconButton>\n </SwitcherButton>\n )}\n </BottomRowLayout>\n </MenuSectionList>\n </MenuSection>\n </BottomPinnedSection>\n </>\n );\n};\n\nexport default MobileMenu;\n"],"file":"MobileMenu.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"names":["React","styled","BREAKPOINTS","COLORS","ComponentTextStyle","focusStyles","Actions","Close","Notification","SwitchApp","MobileActionMenu","MenuSection","MenuSectionList","MenuWrapper","Right","RowLayout","NavLink","useLocation","SwitcherMenuItem","Avatar","AvatarContainer","MobileUserMenu","IconButton","LaerdalLogo","ComponentMStyling","ComponentXSStyling","SwitchButton","span","Bold","neutral_600","BottomPinnedSection","div","neutral_200","FirstRowLayout","BottomRowLayout","SMALL","StyledNavItem","Regular","black","primary_500","primary_800","neutral_300","neutral_100","primary_600","primary_20","primary_100","SwitcherButton","MobileMenu","clickMenuAction","navigationOptions","actions","firstName","lastName","email","signout","notifications","accountSection","organizationSection","supportSection","switcherAction","accountMenuHeader","signOutLabel","organizationName","useUserMenu","showUserMenu","setShowUserMenu","useState","showNotificationMenu","setShowNotificationMenu","notificationMenuRef","useRef","userMenuRef","userRef","location","user","notification","fireAction","action","ref","undefined","current","blur","isPressingEnter","e","key","preventDefault","stopPropagation","useEffect","map","no","exact","to","onClick","label","padding","margin","name","secondaryNavigationOptions","isAuthenticated"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles} from '../../styles';\nimport {ActionOptions, NavButton, NavOption, UserMenuItem} from '../../types';\nimport Actions from '../Actions';\nimport {Close, Notification, SwitchApp} from '../../icons/systemicons/SystemIcons';\nimport MobileActionMenu from './MobileActionMenu';\nimport {MenuSection, MenuSectionList, MenuWrapper, Right, RowLayout} from './CommonStyles';\nimport {NavLink, useLocation} from 'react-router-dom';\nimport {SwitcherMenuItem} from '../../Switcher';\nimport Avatar, {AvatarContainer} from '../Avatar';\nimport MobileUserMenu from '../UserMenu/MobileUserMenu';\nimport {IconButton} from '../../Button';\nimport {LaerdalLogo} from '../../assets';\nimport {ComponentMStyling, ComponentXSStyling} from '../../styles/typography';\n\nconst SwitchButton = styled.span`\n ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n \n padding: 0;\n border: 0;\n margin: 0 auto 0 12px;\n line-height: 48px;\n`;\n\nconst BottomPinnedSection = styled.div`\n position: absolute;\n left: 0;\n width: 100%;\n bottom: 0;\n border-top: 1px solid ${COLORS.neutral_200};\n`;\n\nconst FirstRowLayout = styled(RowLayout)`\n margin-top: 10px;\n padding: 12px;\n`;\n\nconst BottomRowLayout = styled(RowLayout)`\n margin: 8px auto 0 0;\n width: 95%;\n height: 48px;\n ${BREAKPOINTS.SMALL} {\n height: 56px;\n }\n`;\n\nconst StyledNavItem = styled(SwitcherMenuItem)`\n padding: 0 0 0 20px;\n margin: 0 2px;\n\n display: flex;\n align-items: center;\n text-align: center;\n position: relative;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n text-decoration: none;\n\n svg {\n margin-right: 16px;\n }\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n left: 0;\n top: 0;\n bottom: 0;\n width: 4px;\n background-color: transparent;\n }\n\n &.active:not(.disabled) {\n font-weight: bold;\n &:after {\n background-color: ${COLORS.primary_500};\n }\n\n color: ${COLORS.primary_800};\n svg path {\n fill: ${COLORS.primary_800};\n }\n }\n\n &.disabled {\n color: ${COLORS.neutral_300};\n background-color: ${COLORS.neutral_100};\n }\n\n &:hover:not(.disabled) {\n color: ${COLORS.primary_600};\n background-color: ${COLORS.primary_20};\n\n svg path {\n fill: ${COLORS.primary_600};\n }\n }\n\n &:active:not(.disabled) {\n color: ${COLORS.primary_800};\n background-color: ${COLORS.primary_100};\n &:after {\n background-color: ${COLORS.primary_500};\n }\n svg path {\n fill: ${COLORS.primary_800};\n }\n }\n\n &:focus:not(.disabled) {\n ${focusStyles}\n }\n`;\nconst SwitcherButton = styled.div`\n display: flex;\n margin-left: auto;\n\n line-height: 48px;\n button:last-child {\n margin: 0 !important;\n }\n`;\n\ntype Props = {\n name: string;\n navigationOptions?: NavOption[];\n secondaryNavigationOptions?: NavOption[];\n secondaryButton?: NavButton;\n actions?: ActionOptions;\n clickMenuAction: () => void;\n firstName: string;\n lastName: string;\n email: string;\n signout?: (e: any) => void;\n isAuthenticated?: boolean;\n notifications?: NavOption[];\n switcherAction?: () => void;\n accountSection?: UserMenuItem[];\n organizationSection?: UserMenuItem[];\n supportSection?: UserMenuItem[];\n accountMenuHeader: string;\n signOutLabel: string;\n organizationName: string;\n useUserMenu: boolean | undefined;\n showUserMenu: boolean;\n setShowUserMenu: (show: boolean) => void;\n};\n\nconst MobileMenu = ({\n clickMenuAction,\n navigationOptions,\n actions,\n firstName,\n lastName,\n email,\n signout,\n notifications,\n accountSection,\n organizationSection,\n supportSection,\n switcherAction,\n accountMenuHeader,\n signOutLabel,\n organizationName,\n useUserMenu,\n showUserMenu,\n setShowUserMenu,\n}: Props) => {\n const [showNotificationMenu, setShowNotificationMenu] = React.useState<boolean>(false);\n const notificationMenuRef = React.useRef(null);\n const userMenuRef = React.useRef(null);\n const userRef = React.useRef(null);\n\n const location = useLocation();\n\n if (actions?.user) {\n actions.user = () => setShowUserMenu(true);\n }\n if (actions?.notification) {\n actions.notification = () => setShowNotificationMenu(true);\n }\n\n const fireAction = (action: (() => void) | undefined, ref: React.MutableRefObject<HTMLButtonElement | null> | undefined = undefined) => {\n ref?.current?.blur();\n !!action && action();\n };\n\n const isPressingEnter = (e: any) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n e.stopPropagation();\n return true;\n }\n return false;\n };\n\n React.useEffect(() => {\n clickMenuAction();\n }, [location]);\n\n return (\n <>\n {actions?.notification && (\n <MenuWrapper ref={notificationMenuRef} className={showNotificationMenu ? 'open' : ''} isVisible={showNotificationMenu}>\n <MobileActionMenu\n name=\"Notifications\"\n clickMenuAction={() => setShowNotificationMenu(false)}\n navigationOptions={notifications}\n actionList={{\n notification: () => {},\n }}\n />\n </MenuWrapper>\n )}\n {actions?.user && (\n <MenuWrapper ref={userMenuRef} className={showUserMenu ? 'open' : ''} isVisible={showUserMenu}>\n <MobileUserMenu\n accountMenuHeader={accountMenuHeader}\n firstName={firstName}\n lastName={lastName}\n email={email}\n organizationName={organizationName}\n clickMenuAction={clickMenuAction}\n accountSection={accountSection}\n organizationSection={organizationSection}\n supportSection={supportSection}\n signOut={signout}\n signOutLabel={signOutLabel}\n />\n </MenuWrapper>\n )}\n <FirstRowLayout>\n {firstName && lastName && (\n <AvatarContainer\n id=\"avatarContainer\"\n ref={userRef}\n onClick={actions?.user}\n onKeyDown={(e: any) => (isPressingEnter(e) ? fireAction(actions?.user, userRef) : null)}\n inMobileMenu={true}\n hideOnLowWidth={false}>\n <Avatar size={36} firstName={firstName} lastName={lastName} color={COLORS.primary_500} profileMenuLink=\"#TODO\" />\n </AvatarContainer>\n )}\n {actions?.notification && (\n <IconButton\n variant={'secondary'}\n shape={'circular'}\n hideOnLowWidth={false}\n isInMobileMenu={true}\n action={() => fireAction(actions?.notification)}\n onKeyPress={(e: any) => (isPressingEnter(e) ? fireAction(actions?.notification) : null)}>\n <Notification size=\"24px\" />\n </IconButton>\n )}\n <Right>\n <Actions\n actions={actions}\n firstName={firstName}\n lastName={lastName}\n isInMobileMenu={true}\n hideOnLowWidth={false}\n useUserMenu={useUserMenu}\n setShowUserMenu={setShowUserMenu}\n />\n <IconButton variant=\"secondary\" shape=\"circular\" action={() => clickMenuAction()} isInMobileMenu={true}>\n <Close size=\"24px\" />\n </IconButton>\n </Right>\n </FirstRowLayout>\n <MenuSection>\n <MenuSectionList>\n {navigationOptions?.map((no) => (\n <li key={no.label}>\n <StyledNavItem\n as={NavLink}\n exact={no?.exact}\n to={no.to}\n onClick={() => {\n if (no?.onClick) {\n no?.onClick();\n }\n }}>\n {no.label}\n </StyledNavItem>\n </li>\n ))}\n </MenuSectionList>\n </MenuSection>\n\n <BottomPinnedSection>\n <MenuSection style={{ padding: '0 12px 12px 12px', margin: '0' }}>\n <MenuSectionList>\n <BottomRowLayout>\n <LaerdalLogo />\n {switcherAction && (\n <SwitcherButton>\n <SwitchButton onClick={() => switcherAction()}>Switch site</SwitchButton>{' '}\n <IconButton\n variant={'secondary'}\n shape={'circular'}\n hideOnLowWidth={false}\n isInMobileMenu={true}\n id=\"globalNavAppsButton\"\n action={() => switcherAction()}\n onKeyPress={(e: any) => (isPressingEnter(e) ? switcherAction() : null)}>\n <SwitchApp size=\"24px\" />\n </IconButton>\n </SwitcherButton>\n )}\n </BottomRowLayout>\n </MenuSectionList>\n </MenuSection>\n </BottomPinnedSection>\n </>\n );\n};\n\nexport default MobileMenu;\n"],"file":"MobileMenu.js"}
|
|
@@ -7,7 +7,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
|
|
|
7
7
|
Object.defineProperty(exports, "__esModule", {
|
|
8
8
|
value: true
|
|
9
9
|
});
|
|
10
|
-
exports.default = void 0;
|
|
10
|
+
exports.default = exports.StyledLink = void 0;
|
|
11
11
|
|
|
12
12
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
13
13
|
|
|
@@ -43,6 +43,8 @@ var StyledLink = _styledComponents.default.a(_templateObject || (_templateObject
|
|
|
43
43
|
return props.margin ? "margin: ".concat(props.margin, ";") : '';
|
|
44
44
|
});
|
|
45
45
|
|
|
46
|
+
exports.StyledLink = StyledLink;
|
|
47
|
+
|
|
46
48
|
var HyperLink = function HyperLink(_ref) {
|
|
47
49
|
var children = _ref.children,
|
|
48
50
|
_ref$target = _ref.target,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/HyperLink/HyperLink.tsx"],"names":["StyledLink","styled","a","props","variant","invertedStyle","defaultStyle","margin","HyperLink","children","target","id","href","disabled","className"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;;;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"sources":["../../src/HyperLink/HyperLink.tsx"],"names":["StyledLink","styled","a","props","variant","invertedStyle","defaultStyle","margin","HyperLink","children","target","id","href","disabled","className"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;;;;;;;;;;;;;;;AAEO,IAAMA,UAAU,GAAGC,0BAAOC,CAAV,0HAKnB,UAACC,KAAD;AAAA,SAAYA,KAAK,CAACC,OAAN,KAAkB,UAAlB,GAA+BC,sBAA/B,GAA+CC,qBAA3D;AAAA,CALmB,EAMnB,UAACH,KAAD;AAAA,SAAYA,KAAK,CAACI,MAAN,qBAA0BJ,KAAK,CAACI,MAAhC,SAA4C,EAAxD;AAAA,CANmB,CAAhB;;;;AAmBP,IAAMC,SAAkD,GAAG,SAArDA,SAAqD,OAAoF;AAAA,MAAjFC,QAAiF,QAAjFA,QAAiF;AAAA,yBAAvEC,MAAuE;AAAA,MAAvEA,MAAuE,4BAA9D,QAA8D;AAAA,0BAApDN,OAAoD;AAAA,MAApDA,OAAoD,6BAA1C,SAA0C;AAAA,MAA5BD,KAA4B;AAC7I,sBACE,qBAAC,UAAD,kCAAgBA,KAAhB;AAAuB,IAAA,OAAO,EAAEC,OAAhC;AAAyC,IAAA,MAAM,EAAEM,MAAjD;AAAyD,IAAA,GAAG,EAAC,qBAA7D;AAAA,cACGD;AADH,KADF;AAKD,CAND;;;AATEE,EAAAA,E;AACAP,EAAAA,O,4BAAS,S,EAAY,U;AACrBQ,EAAAA,I;AACAC,EAAAA,Q;AACAN,EAAAA,M;AACAE,EAAAA,Q;AACAK,EAAAA,S;;eAWaN,S","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { defaultStyle, invertedStyle } from './styling';\n\nexport const StyledLink = styled.a<{\n variant: 'default' | 'inverted';\n margin?: string;\n}>`\n cursor: pointer;\n ${(props) => (props.variant === 'inverted' ? invertedStyle : defaultStyle)}\n ${(props) => (props.margin ? `margin: ${props.margin};` : '')}\n`;\n\nexport interface HyperlinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {\n id?: string;\n variant: 'default' | 'inverted';\n href: string;\n disabled?: boolean;\n margin?: string;\n children?: any;\n className?: string;\n}\n\nconst HyperLink: React.FunctionComponent<HyperlinkProps> = ({ children, target = '_blank', variant = 'default', ...props }: HyperlinkProps) => {\n return (\n <StyledLink {...props} variant={variant} target={target} rel=\"noopener noreferrer\">\n {children}\n </StyledLink>\n );\n};\n\nexport default HyperLink;\n"],"file":"HyperLink.cjs"}
|
|
@@ -1,4 +1,8 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
+
export declare const StyledLink: import("styled-components").StyledComponent<"a", any, {
|
|
3
|
+
variant: 'default' | 'inverted';
|
|
4
|
+
margin?: string | undefined;
|
|
5
|
+
}, never>;
|
|
2
6
|
export interface HyperlinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
3
7
|
id?: string;
|
|
4
8
|
variant: 'default' | 'inverted';
|
|
@@ -14,7 +14,7 @@ import * as React from 'react';
|
|
|
14
14
|
import styled from 'styled-components';
|
|
15
15
|
import { defaultStyle, invertedStyle } from './styling';
|
|
16
16
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
17
|
-
var StyledLink = styled.a(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n cursor: pointer;\n ", "\n ", "\n"])), function (props) {
|
|
17
|
+
export var StyledLink = styled.a(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n cursor: pointer;\n ", "\n ", "\n"])), function (props) {
|
|
18
18
|
return props.variant === 'inverted' ? invertedStyle : defaultStyle;
|
|
19
19
|
}, function (props) {
|
|
20
20
|
return props.margin ? "margin: ".concat(props.margin, ";") : '';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/HyperLink/HyperLink.tsx"],"names":["React","styled","defaultStyle","invertedStyle","StyledLink","a","props","variant","margin","HyperLink","children","target","id","href","disabled","className"],"mappings":";;;;;;;;;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAASC,YAAT,EAAuBC,aAAvB,QAA4C,WAA5C;;AAEA,IAAMC,UAAU,GAAGH,MAAM,CAACI,CAAV,
|
|
1
|
+
{"version":3,"sources":["../../src/HyperLink/HyperLink.tsx"],"names":["React","styled","defaultStyle","invertedStyle","StyledLink","a","props","variant","margin","HyperLink","children","target","id","href","disabled","className"],"mappings":";;;;;;;;;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAASC,YAAT,EAAuBC,aAAvB,QAA4C,WAA5C;;AAEA,OAAO,IAAMC,UAAU,GAAGH,MAAM,CAACI,CAAV,4GAKnB,UAACC,KAAD;AAAA,SAAYA,KAAK,CAACC,OAAN,KAAkB,UAAlB,GAA+BJ,aAA/B,GAA+CD,YAA3D;AAAA,CALmB,EAMnB,UAACI,KAAD;AAAA,SAAYA,KAAK,CAACE,MAAN,qBAA0BF,KAAK,CAACE,MAAhC,SAA4C,EAAxD;AAAA,CANmB,CAAhB;;AAmBP,IAAMC,SAAkD,GAAG,SAArDA,SAAqD,OAAoF;AAAA,MAAjFC,QAAiF,QAAjFA,QAAiF;AAAA,yBAAvEC,MAAuE;AAAA,MAAvEA,MAAuE,4BAA9D,QAA8D;AAAA,0BAApDJ,OAAoD;AAAA,MAApDA,OAAoD,6BAA1C,SAA0C;AAAA,MAA5BD,KAA4B;;AAC7I,sBACE,KAAC,UAAD,kCAAgBA,KAAhB;AAAuB,IAAA,OAAO,EAAEC,OAAhC;AAAyC,IAAA,MAAM,EAAEI,MAAjD;AAAyD,IAAA,GAAG,EAAC,qBAA7D;AAAA,cACGD;AADH,KADF;AAKD,CAND;;;AATEE,EAAAA,E;AACAL,EAAAA,O,aAAS,S,EAAY,U;AACrBM,EAAAA,I;AACAC,EAAAA,Q;AACAN,EAAAA,M;AACAE,EAAAA,Q;AACAK,EAAAA,S;;AAWF,eAAeN,SAAf","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { defaultStyle, invertedStyle } from './styling';\n\nexport const StyledLink = styled.a<{\n variant: 'default' | 'inverted';\n margin?: string;\n}>`\n cursor: pointer;\n ${(props) => (props.variant === 'inverted' ? invertedStyle : defaultStyle)}\n ${(props) => (props.margin ? `margin: ${props.margin};` : '')}\n`;\n\nexport interface HyperlinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {\n id?: string;\n variant: 'default' | 'inverted';\n href: string;\n disabled?: boolean;\n margin?: string;\n children?: any;\n className?: string;\n}\n\nconst HyperLink: React.FunctionComponent<HyperlinkProps> = ({ children, target = '_blank', variant = 'default', ...props }: HyperlinkProps) => {\n return (\n <StyledLink {...props} variant={variant} target={target} rel=\"noopener noreferrer\">\n {children}\n </StyledLink>\n );\n};\n\nexport default HyperLink;\n"],"file":"HyperLink.js"}
|
|
@@ -15,7 +15,7 @@ var _ = require("..");
|
|
|
15
15
|
|
|
16
16
|
var _templateObject, _templateObject2;
|
|
17
17
|
|
|
18
|
-
var defaultStyle = (0, _styledComponents.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n outline: none;\n padding: 2px 0;\n text-decoration-thickness: 2px;\n text-decoration-style: solid;\n text-underline-offset: 2px;\n text-decoration-line: none;\n\n &:link {\n font-weight: 700;\n color: ", ";\n }\n\n &:visited {\n color: ", ";\n }\n\n &:hover,\n &.hover-state {\n color: ", ";\n text-decoration-line: underline;\n }\n\n &:focus,\n &.focus-state {\n border-radius: 2px;\n background: ", ";\n color: ", ";\n }\n\n &:active,\n &.active-state {\n border-radius: 2px;\n background: ", ";\n color: ", ";\n }\n\n\n &:focus:hover,\n &:active:hover,\n &.active-state:hover,\n &.focus-state:hover{\n text-decoration-line: none;\n color: ", ";\n opacity: 0.9;\n }\n"])), _.COLORS.
|
|
18
|
+
var defaultStyle = (0, _styledComponents.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n outline: none;\n padding: 2px 0;\n text-decoration-thickness: 2px;\n text-decoration-style: solid;\n text-underline-offset: 2px;\n text-decoration-line: none;\n\n &:link {\n font-weight: 700;\n color: ", ";\n }\n\n &:visited {\n color: ", ";\n }\n\n &:hover,\n &.hover-state {\n color: ", ";\n text-decoration-line: underline;\n }\n\n &:focus,\n &.focus-state {\n border-radius: 2px;\n background: ", ";\n color: ", ";\n }\n\n &:active,\n &.active-state {\n border-radius: 2px;\n background: ", ";\n color: ", ";\n }\n\n\n &:focus:hover,\n &:active:hover,\n &.active-state:hover,\n &.focus-state:hover{\n text-decoration-line: none;\n color: ", ";\n opacity: 0.9;\n }\n"])), _.COLORS.primary_600, _.COLORS.primary_800, _.COLORS.primary_700, _.COLORS.primary_800, _.COLORS.white, _.COLORS.primary_800, _.COLORS.white, _.COLORS.white);
|
|
19
19
|
exports.defaultStyle = defaultStyle;
|
|
20
20
|
var invertedStyle = (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n outline: none;\n padding: 2px 0;\n\n text-decoration-thickness: 2px;\n text-decoration-style: solid;\n text-underline-offset: 2px;\n text-decoration-line: underline;\n\n &:link {\n font-weight: 700;\n color: ", ";\n }\n\n &:visited {\n color: ", ";\n }\n\n &:focus,\n &.focus-state {\n border-radius: 2px;\n text-decoration-line: none;\n background: ", ";\n color: ", ";\n }\n\n &:hover,\n &.hover-state {\n text-decoration-line: none;\n }\n\n &:active,\n &.active-state {\n border-radius: 2px;\n text-decoration-line: none;\n background: ", ";\n color: ", ";\n }\n\n &:focus:hover,\n &:active:hover {\n text-decoration-line: none;\n color: ", ";\n opacity: 0.9;\n }\n"])), _.COLORS.white, _.COLORS.neutral_100, _.COLORS.white, _.COLORS.neutral_800, _.COLORS.white, _.COLORS.neutral_800, _.COLORS.neutral_800);
|
|
21
21
|
exports.invertedStyle = invertedStyle;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/HyperLink/styling.ts"],"names":["defaultStyle","css","COLORS","
|
|
1
|
+
{"version":3,"sources":["../../src/HyperLink/styling.ts"],"names":["defaultStyle","css","COLORS","primary_600","primary_800","primary_700","white","invertedStyle","neutral_100","neutral_800"],"mappings":";;;;;;;;;;;AAAA;;AACA;;;;AAEO,IAAMA,YAAY,OAAGC,qBAAH,uzBAUZC,SAAOC,WAVK,EAcZD,SAAOE,WAdK,EAmBZF,SAAOG,WAnBK,EA0BPH,SAAOE,WA1BA,EA2BZF,SAAOI,KA3BK,EAiCPJ,SAAOE,WAjCA,EAkCZF,SAAOI,KAlCK,EA2CZJ,SAAOI,KA3CK,CAAlB;;AAgDA,IAAMC,aAAa,OAAGN,qBAAH,yzBAWbC,SAAOI,KAXM,EAebJ,SAAOM,WAfM,EAsBRN,SAAOI,KAtBC,EAuBbJ,SAAOO,WAvBM,EAmCRP,SAAOI,KAnCC,EAoCbJ,SAAOO,WApCM,EA0CbP,SAAOO,WA1CM,CAAnB","sourcesContent":["import { css } from 'styled-components';\nimport { COLORS } from '..';\n\nexport const defaultStyle = css`\n outline: none;\n padding: 2px 0;\n text-decoration-thickness: 2px;\n text-decoration-style: solid;\n text-underline-offset: 2px;\n text-decoration-line: none;\n\n &:link {\n font-weight: 700;\n color: ${COLORS.primary_600};\n }\n\n &:visited {\n color: ${COLORS.primary_800};\n }\n\n &:hover,\n &.hover-state {\n color: ${COLORS.primary_700};\n text-decoration-line: underline;\n }\n\n &:focus,\n &.focus-state {\n border-radius: 2px;\n background: ${COLORS.primary_800};\n color: ${COLORS.white};\n }\n\n &:active,\n &.active-state {\n border-radius: 2px;\n background: ${COLORS.primary_800};\n color: ${COLORS.white};\n }\n\n\n &:focus:hover,\n &:active:hover,\n &.active-state:hover,\n &.focus-state:hover{\n text-decoration-line: none;\n color: ${COLORS.white};\n opacity: 0.9;\n }\n`;\n\nexport const invertedStyle = css`\n outline: none;\n padding: 2px 0;\n\n text-decoration-thickness: 2px;\n text-decoration-style: solid;\n text-underline-offset: 2px;\n text-decoration-line: underline;\n\n &:link {\n font-weight: 700;\n color: ${COLORS.white};\n }\n\n &:visited {\n color: ${COLORS.neutral_100};\n }\n\n &:focus,\n &.focus-state {\n border-radius: 2px;\n text-decoration-line: none;\n background: ${COLORS.white};\n color: ${COLORS.neutral_800};\n }\n\n &:hover,\n &.hover-state {\n text-decoration-line: none;\n }\n\n &:active,\n &.active-state {\n border-radius: 2px;\n text-decoration-line: none;\n background: ${COLORS.white};\n color: ${COLORS.neutral_800};\n }\n\n &:focus:hover,\n &:active:hover {\n text-decoration-line: none;\n color: ${COLORS.neutral_800};\n opacity: 0.9;\n }\n`;\n"],"file":"styling.cjs"}
|
|
@@ -4,6 +4,6 @@ var _templateObject, _templateObject2;
|
|
|
4
4
|
|
|
5
5
|
import { css } from 'styled-components';
|
|
6
6
|
import { COLORS } from '..';
|
|
7
|
-
export var defaultStyle = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n outline: none;\n padding: 2px 0;\n text-decoration-thickness: 2px;\n text-decoration-style: solid;\n text-underline-offset: 2px;\n text-decoration-line: none;\n\n &:link {\n font-weight: 700;\n color: ", ";\n }\n\n &:visited {\n color: ", ";\n }\n\n &:hover,\n &.hover-state {\n color: ", ";\n text-decoration-line: underline;\n }\n\n &:focus,\n &.focus-state {\n border-radius: 2px;\n background: ", ";\n color: ", ";\n }\n\n &:active,\n &.active-state {\n border-radius: 2px;\n background: ", ";\n color: ", ";\n }\n\n\n &:focus:hover,\n &:active:hover,\n &.active-state:hover,\n &.focus-state:hover{\n text-decoration-line: none;\n color: ", ";\n opacity: 0.9;\n }\n"])), COLORS.
|
|
7
|
+
export var defaultStyle = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n outline: none;\n padding: 2px 0;\n text-decoration-thickness: 2px;\n text-decoration-style: solid;\n text-underline-offset: 2px;\n text-decoration-line: none;\n\n &:link {\n font-weight: 700;\n color: ", ";\n }\n\n &:visited {\n color: ", ";\n }\n\n &:hover,\n &.hover-state {\n color: ", ";\n text-decoration-line: underline;\n }\n\n &:focus,\n &.focus-state {\n border-radius: 2px;\n background: ", ";\n color: ", ";\n }\n\n &:active,\n &.active-state {\n border-radius: 2px;\n background: ", ";\n color: ", ";\n }\n\n\n &:focus:hover,\n &:active:hover,\n &.active-state:hover,\n &.focus-state:hover{\n text-decoration-line: none;\n color: ", ";\n opacity: 0.9;\n }\n"])), COLORS.primary_600, COLORS.primary_800, COLORS.primary_700, COLORS.primary_800, COLORS.white, COLORS.primary_800, COLORS.white, COLORS.white);
|
|
8
8
|
export var invertedStyle = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n outline: none;\n padding: 2px 0;\n\n text-decoration-thickness: 2px;\n text-decoration-style: solid;\n text-underline-offset: 2px;\n text-decoration-line: underline;\n\n &:link {\n font-weight: 700;\n color: ", ";\n }\n\n &:visited {\n color: ", ";\n }\n\n &:focus,\n &.focus-state {\n border-radius: 2px;\n text-decoration-line: none;\n background: ", ";\n color: ", ";\n }\n\n &:hover,\n &.hover-state {\n text-decoration-line: none;\n }\n\n &:active,\n &.active-state {\n border-radius: 2px;\n text-decoration-line: none;\n background: ", ";\n color: ", ";\n }\n\n &:focus:hover,\n &:active:hover {\n text-decoration-line: none;\n color: ", ";\n opacity: 0.9;\n }\n"])), COLORS.white, COLORS.neutral_100, COLORS.white, COLORS.neutral_800, COLORS.white, COLORS.neutral_800, COLORS.neutral_800);
|
|
9
9
|
//# sourceMappingURL=styling.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/HyperLink/styling.ts"],"names":["css","COLORS","defaultStyle","
|
|
1
|
+
{"version":3,"sources":["../../src/HyperLink/styling.ts"],"names":["css","COLORS","defaultStyle","primary_600","primary_800","primary_700","white","invertedStyle","neutral_100","neutral_800"],"mappings":";;;;AAAA,SAASA,GAAT,QAAoB,mBAApB;AACA,SAASC,MAAT,QAAuB,IAAvB;AAEA,OAAO,IAAMC,YAAY,GAAGF,GAAH,wyBAUZC,MAAM,CAACE,WAVK,EAcZF,MAAM,CAACG,WAdK,EAmBZH,MAAM,CAACI,WAnBK,EA0BPJ,MAAM,CAACG,WA1BA,EA2BZH,MAAM,CAACK,KA3BK,EAiCPL,MAAM,CAACG,WAjCA,EAkCZH,MAAM,CAACK,KAlCK,EA2CZL,MAAM,CAACK,KA3CK,CAAlB;AAgDP,OAAO,IAAMC,aAAa,GAAGP,GAAH,0yBAWbC,MAAM,CAACK,KAXM,EAebL,MAAM,CAACO,WAfM,EAsBRP,MAAM,CAACK,KAtBC,EAuBbL,MAAM,CAACQ,WAvBM,EAmCRR,MAAM,CAACK,KAnCC,EAoCbL,MAAM,CAACQ,WApCM,EA0CbR,MAAM,CAACQ,WA1CM,CAAnB","sourcesContent":["import { css } from 'styled-components';\nimport { COLORS } from '..';\n\nexport const defaultStyle = css`\n outline: none;\n padding: 2px 0;\n text-decoration-thickness: 2px;\n text-decoration-style: solid;\n text-underline-offset: 2px;\n text-decoration-line: none;\n\n &:link {\n font-weight: 700;\n color: ${COLORS.primary_600};\n }\n\n &:visited {\n color: ${COLORS.primary_800};\n }\n\n &:hover,\n &.hover-state {\n color: ${COLORS.primary_700};\n text-decoration-line: underline;\n }\n\n &:focus,\n &.focus-state {\n border-radius: 2px;\n background: ${COLORS.primary_800};\n color: ${COLORS.white};\n }\n\n &:active,\n &.active-state {\n border-radius: 2px;\n background: ${COLORS.primary_800};\n color: ${COLORS.white};\n }\n\n\n &:focus:hover,\n &:active:hover,\n &.active-state:hover,\n &.focus-state:hover{\n text-decoration-line: none;\n color: ${COLORS.white};\n opacity: 0.9;\n }\n`;\n\nexport const invertedStyle = css`\n outline: none;\n padding: 2px 0;\n\n text-decoration-thickness: 2px;\n text-decoration-style: solid;\n text-underline-offset: 2px;\n text-decoration-line: underline;\n\n &:link {\n font-weight: 700;\n color: ${COLORS.white};\n }\n\n &:visited {\n color: ${COLORS.neutral_100};\n }\n\n &:focus,\n &.focus-state {\n border-radius: 2px;\n text-decoration-line: none;\n background: ${COLORS.white};\n color: ${COLORS.neutral_800};\n }\n\n &:hover,\n &.hover-state {\n text-decoration-line: none;\n }\n\n &:active,\n &.active-state {\n border-radius: 2px;\n text-decoration-line: none;\n background: ${COLORS.white};\n color: ${COLORS.neutral_800};\n }\n\n &:focus:hover,\n &:active:hover {\n text-decoration-line: none;\n color: ${COLORS.neutral_800};\n opacity: 0.9;\n }\n`;\n"],"file":"styling.js"}
|
|
@@ -0,0 +1,122 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.default = void 0;
|
|
9
|
+
|
|
10
|
+
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
11
|
+
|
|
12
|
+
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
13
|
+
|
|
14
|
+
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
15
|
+
|
|
16
|
+
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
|
|
17
|
+
|
|
18
|
+
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
|
|
19
|
+
|
|
20
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
21
|
+
|
|
22
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
23
|
+
|
|
24
|
+
var _ = require("..");
|
|
25
|
+
|
|
26
|
+
var _react = _interopRequireDefault(require("react"));
|
|
27
|
+
|
|
28
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
29
|
+
|
|
30
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
31
|
+
|
|
32
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
33
|
+
|
|
34
|
+
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
|
|
35
|
+
|
|
36
|
+
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
37
|
+
|
|
38
|
+
var ImageWithFallbacks = /*#__PURE__*/function (_React$Component) {
|
|
39
|
+
(0, _inherits2.default)(ImageWithFallbacks, _React$Component);
|
|
40
|
+
|
|
41
|
+
var _super = _createSuper(ImageWithFallbacks);
|
|
42
|
+
|
|
43
|
+
function ImageWithFallbacks(props) {
|
|
44
|
+
var _this;
|
|
45
|
+
|
|
46
|
+
(0, _classCallCheck2.default)(this, ImageWithFallbacks);
|
|
47
|
+
_this = _super.call(this, props);
|
|
48
|
+
_this.state = {
|
|
49
|
+
src: props.src,
|
|
50
|
+
fallbackIndex: 0,
|
|
51
|
+
fallbacks: _this.props.fallbacks.split(','),
|
|
52
|
+
loaded: false
|
|
53
|
+
};
|
|
54
|
+
return _this;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
(0, _createClass2.default)(ImageWithFallbacks, [{
|
|
58
|
+
key: "componentDidUpdate",
|
|
59
|
+
value: function componentDidUpdate(prevProps) {
|
|
60
|
+
if (prevProps.src !== this.props.src && prevProps.fallbacks !== this.props.fallbacks) {
|
|
61
|
+
this.setState({
|
|
62
|
+
src: this.props.src,
|
|
63
|
+
fallbackIndex: 0,
|
|
64
|
+
fallbacks: this.props.fallbacks.split(','),
|
|
65
|
+
loaded: false
|
|
66
|
+
});
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
}, {
|
|
70
|
+
key: "onError",
|
|
71
|
+
value: function onError() {
|
|
72
|
+
if (this.state.fallbackIndex > this.state.fallbacks.length) {
|
|
73
|
+
return;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
this.setState({
|
|
77
|
+
src: this.state.fallbacks[this.state.fallbackIndex],
|
|
78
|
+
fallbackIndex: this.state.fallbackIndex + 1,
|
|
79
|
+
fallbacks: this.state.fallbacks
|
|
80
|
+
});
|
|
81
|
+
}
|
|
82
|
+
}, {
|
|
83
|
+
key: "onLoad",
|
|
84
|
+
value: function onLoad() {
|
|
85
|
+
this.setState(_objectSpread(_objectSpread({}, this.state), {}, {
|
|
86
|
+
loaded: true
|
|
87
|
+
}));
|
|
88
|
+
}
|
|
89
|
+
}, {
|
|
90
|
+
key: "render",
|
|
91
|
+
value: function render() {
|
|
92
|
+
var _this2 = this;
|
|
93
|
+
|
|
94
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
95
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
|
|
96
|
+
src: this.state.src,
|
|
97
|
+
onError: function onError() {
|
|
98
|
+
return _this2.onError();
|
|
99
|
+
},
|
|
100
|
+
onChange: function onChange() {
|
|
101
|
+
return _this2.onLoad();
|
|
102
|
+
},
|
|
103
|
+
onLoad: function onLoad() {
|
|
104
|
+
return _this2.onLoad();
|
|
105
|
+
},
|
|
106
|
+
alt: this.props.alt
|
|
107
|
+
}), this.props.loader && !this.state.loaded && /*#__PURE__*/(0, _jsxRuntime.jsx)(_.LoadingIndicator, {})]
|
|
108
|
+
});
|
|
109
|
+
}
|
|
110
|
+
}]);
|
|
111
|
+
return ImageWithFallbacks;
|
|
112
|
+
}(_react.default.Component);
|
|
113
|
+
|
|
114
|
+
(0, _defineProperty2.default)(ImageWithFallbacks, "propTypes", {
|
|
115
|
+
fallbacks: _propTypes.default.string.isRequired,
|
|
116
|
+
src: _propTypes.default.string.isRequired,
|
|
117
|
+
alt: _propTypes.default.string.isRequired,
|
|
118
|
+
loader: _propTypes.default.bool.isRequired
|
|
119
|
+
});
|
|
120
|
+
var _default = ImageWithFallbacks;
|
|
121
|
+
exports.default = _default;
|
|
122
|
+
//# sourceMappingURL=ImageWithFallbacks.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Image/ImageWithFallbacks.tsx"],"names":["ImageWithFallbacks","props","state","src","fallbackIndex","fallbacks","split","loaded","prevProps","setState","length","onError","onLoad","alt","loader","React","Component"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;;;;;;;;;;;IAgBMA,kB;;;;;AACJ,8BAAYC,KAAZ,EAA4C;AAAA;;AAAA;AAC1C,8BAAMA,KAAN;AACA,UAAKC,KAAL,GAAa;AACXC,MAAAA,GAAG,EAAEF,KAAK,CAACE,GADA;AAEXC,MAAAA,aAAa,EAAE,CAFJ;AAGXC,MAAAA,SAAS,EAAE,MAAKJ,KAAL,CAAWI,SAAX,CAAqBC,KAArB,CAA2B,GAA3B,CAHA;AAIXC,MAAAA,MAAM,EAAE;AAJG,KAAb;AAF0C;AAQ3C;;;;WACD,4BAAmBC,SAAnB,EAAuD;AACrD,UAAIA,SAAS,CAACL,GAAV,KAAkB,KAAKF,KAAL,CAAWE,GAA7B,IAAoCK,SAAS,CAACH,SAAV,KAAwB,KAAKJ,KAAL,CAAWI,SAA3E,EAAsF;AACpF,aAAKI,QAAL,CAAc;AACZN,UAAAA,GAAG,EAAE,KAAKF,KAAL,CAAWE,GADJ;AAEZC,UAAAA,aAAa,EAAE,CAFH;AAGZC,UAAAA,SAAS,EAAE,KAAKJ,KAAL,CAAWI,SAAX,CAAqBC,KAArB,CAA2B,GAA3B,CAHC;AAIZC,UAAAA,MAAM,EAAE;AAJI,SAAd;AAMD;AACF;;;WACD,mBAAU;AACR,UAAI,KAAKL,KAAL,CAAWE,aAAX,GAA2B,KAAKF,KAAL,CAAWG,SAAX,CAAqBK,MAApD,EAA4D;AAC1D;AACD;;AACD,WAAKD,QAAL,CAAc;AACZN,QAAAA,GAAG,EAAE,KAAKD,KAAL,CAAWG,SAAX,CAAqB,KAAKH,KAAL,CAAWE,aAAhC,CADO;AAEZA,QAAAA,aAAa,EAAE,KAAKF,KAAL,CAAWE,aAAX,GAA2B,CAF9B;AAGZC,QAAAA,SAAS,EAAE,KAAKH,KAAL,CAAWG;AAHV,OAAd;AAKD;;;WACD,kBAAS;AACP,WAAKI,QAAL,iCAAmB,KAAKP,KAAxB;AAA+BK,QAAAA,MAAM,EAAE;AAAvC;AACD;;;WACD,kBAAS;AAAA;;AACP,0BACE;AAAA,gCACE;AAAK,UAAA,GAAG,EAAE,KAAKL,KAAL,CAAWC,GAArB;AAA0B,UAAA,OAAO,EAAE;AAAA,mBAAM,MAAI,CAACQ,OAAL,EAAN;AAAA,WAAnC;AAAyD,UAAA,QAAQ,EAAE;AAAA,mBAAM,MAAI,CAACC,MAAL,EAAN;AAAA,WAAnE;AAAwF,UAAA,MAAM,EAAE;AAAA,mBAAM,MAAI,CAACA,MAAL,EAAN;AAAA,WAAhG;AAAqH,UAAA,GAAG,EAAE,KAAKX,KAAL,CAAWY;AAArI,UADF,EAEG,KAAKZ,KAAL,CAAWa,MAAX,IAAqB,CAAC,KAAKZ,KAAL,CAAWK,MAAjC,iBAA2C,qBAAC,kBAAD,KAF9C;AAAA,QADF;AAMD;;;EAxC8BQ,eAAMC,S;;8BAAjChB,kB;AAbJK,EAAAA,S;AACAF,EAAAA,G;AACAU,EAAAA,G;AACAC,EAAAA,M;;eAqDad,kB","sourcesContent":["import { LoadingIndicator } from '..';\nimport React from 'react';\n\nexport interface ImageWithFallbacksProps {\n fallbacks: string;\n src: string;\n alt: string;\n loader: boolean;\n}\n\ntype ImageWithFallbacksState = {\n src: string;\n fallbackIndex: number;\n fallbacks: string[];\n loaded: boolean;\n};\n\nclass ImageWithFallbacks extends React.Component<ImageWithFallbacksProps, ImageWithFallbacksState> {\n constructor(props: ImageWithFallbacksProps) {\n super(props);\n this.state = {\n src: props.src,\n fallbackIndex: 0,\n fallbacks: this.props.fallbacks.split(','),\n loaded: false,\n };\n }\n componentDidUpdate(prevProps: ImageWithFallbacksProps) {\n if (prevProps.src !== this.props.src && prevProps.fallbacks !== this.props.fallbacks) {\n this.setState({\n src: this.props.src,\n fallbackIndex: 0,\n fallbacks: this.props.fallbacks.split(','),\n loaded: false,\n });\n }\n }\n onError() {\n if (this.state.fallbackIndex > this.state.fallbacks.length) {\n return;\n }\n this.setState({\n src: this.state.fallbacks[this.state.fallbackIndex],\n fallbackIndex: this.state.fallbackIndex + 1,\n fallbacks: this.state.fallbacks,\n });\n }\n onLoad() {\n this.setState({ ...this.state, loaded: true });\n }\n render() {\n return (\n <>\n <img src={this.state.src} onError={() => this.onError()} onChange={() => this.onLoad()} onLoad={() => this.onLoad()} alt={this.props.alt} />\n {this.props.loader && !this.state.loaded && <LoadingIndicator></LoadingIndicator>}\n </>\n );\n }\n}\n\nexport default ImageWithFallbacks;\n"],"file":"ImageWithFallbacks.cjs"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export interface ImageWithFallbacksProps {
|
|
3
|
+
fallbacks: string;
|
|
4
|
+
src: string;
|
|
5
|
+
alt: string;
|
|
6
|
+
loader: boolean;
|
|
7
|
+
}
|
|
8
|
+
declare type ImageWithFallbacksState = {
|
|
9
|
+
src: string;
|
|
10
|
+
fallbackIndex: number;
|
|
11
|
+
fallbacks: string[];
|
|
12
|
+
loaded: boolean;
|
|
13
|
+
};
|
|
14
|
+
declare class ImageWithFallbacks extends React.Component<ImageWithFallbacksProps, ImageWithFallbacksState> {
|
|
15
|
+
constructor(props: ImageWithFallbacksProps);
|
|
16
|
+
componentDidUpdate(prevProps: ImageWithFallbacksProps): void;
|
|
17
|
+
onError(): void;
|
|
18
|
+
onLoad(): void;
|
|
19
|
+
render(): JSX.Element;
|
|
20
|
+
}
|
|
21
|
+
export default ImageWithFallbacks;
|