@laerdal/life-react-components 1.4.1-dev.9.full → 1.5.1-dev.2
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/AccordionItem.cjs +77 -0
- package/dist/Accordion/AccordionItem.cjs.map +1 -0
- package/dist/Accordion/AccordionItem.d.ts +2 -0
- package/dist/Accordion/AccordionItem.js +8 -7
- package/dist/Accordion/AccordionItem.js.map +1 -1
- package/dist/Accordion/AccordionMenu.cjs +105 -0
- package/dist/Accordion/AccordionMenu.cjs.map +1 -0
- package/dist/Accordion/AccordionMenu.d.ts +2 -0
- package/dist/Accordion/AccordionMenu.js +8 -2
- package/dist/Accordion/AccordionMenu.js.map +1 -1
- package/dist/Accordion/ContentAccordion.cjs +172 -0
- package/dist/Accordion/ContentAccordion.cjs.map +1 -0
- package/dist/Accordion/ContentAccordion.js +2 -3
- package/dist/Accordion/ContentAccordion.js.map +1 -1
- package/dist/Accordion/index.cjs +38 -0
- package/dist/Accordion/index.cjs.map +1 -0
- package/dist/Accordion/styles.cjs +45 -0
- package/dist/Accordion/styles.cjs.map +1 -0
- package/dist/Accordion/styles.d.ts +5 -5
- package/dist/Accordion/styles.js +9 -10
- package/dist/Accordion/styles.js.map +1 -1
- package/dist/AuthPage/AuthPage.cjs +80 -0
- package/dist/AuthPage/AuthPage.cjs.map +1 -0
- package/dist/AuthPage/Information.cjs +42 -0
- package/dist/AuthPage/Information.cjs.map +1 -0
- package/dist/AuthPage/ScreenSetsContainer.cjs +25 -0
- package/dist/AuthPage/ScreenSetsContainer.cjs.map +1 -0
- package/dist/AuthPage/_AuthPageSection.cjs +22 -0
- package/dist/AuthPage/_AuthPageSection.cjs.map +1 -0
- package/dist/AuthPage/index.cjs +64 -0
- package/dist/AuthPage/index.cjs.map +1 -0
- package/dist/AuthPage/screenSetsErrorMessages.cjs +13 -0
- package/dist/AuthPage/screenSetsErrorMessages.cjs.map +1 -0
- package/dist/Banners/Banner.cjs +190 -0
- package/dist/Banners/Banner.cjs.map +1 -0
- package/dist/Banners/Banner.d.ts +1 -0
- package/dist/Banners/Banner.js +84 -189
- package/dist/Banners/Banner.js.map +1 -1
- package/dist/Banners/OverviewBanner.cjs +55 -0
- package/dist/Banners/OverviewBanner.cjs.map +1 -0
- package/dist/Banners/index.cjs +24 -0
- package/dist/Banners/index.cjs.map +1 -0
- package/dist/Banners/styles.cjs +73 -0
- package/dist/Banners/styles.cjs.map +1 -0
- package/dist/Banners/styles.js +44 -7
- package/dist/Banners/styles.js.map +1 -1
- package/dist/Breadcrumb/Breadcrumb.cjs +169 -0
- package/dist/Breadcrumb/Breadcrumb.cjs.map +1 -0
- package/dist/Breadcrumb/BreadcrumbItem.cjs +6 -0
- package/dist/Breadcrumb/BreadcrumbItem.cjs.map +1 -0
- package/dist/Breadcrumb/index.cjs +16 -0
- package/dist/Breadcrumb/index.cjs.map +1 -0
- package/dist/Button/BackButton.cjs +75 -0
- package/dist/Button/BackButton.cjs.map +1 -0
- package/dist/Button/Button.cjs +266 -0
- package/dist/Button/Button.cjs.map +1 -0
- package/dist/Button/Button.js +27 -101
- package/dist/Button/Button.js.map +1 -1
- package/dist/Button/DualFunctionButton.cjs +162 -0
- package/dist/Button/DualFunctionButton.cjs.map +1 -0
- package/dist/Button/Iconbutton.cjs +195 -0
- package/dist/Button/Iconbutton.cjs.map +1 -0
- package/dist/Button/Iconbutton.d.ts +13 -0
- package/dist/Button/Iconbutton.js +2 -2
- package/dist/Button/Iconbutton.js.map +1 -1
- package/dist/Button/index.cjs +40 -0
- package/dist/Button/index.cjs.map +1 -0
- package/dist/Chips/ActionChip.cjs +81 -0
- package/dist/Chips/ActionChip.cjs.map +1 -0
- package/dist/Chips/ChipInput.cjs +199 -0
- package/dist/Chips/ChipInput.cjs.map +1 -0
- package/dist/Chips/ChipStyles.cjs +43 -0
- package/dist/Chips/ChipStyles.cjs.map +1 -0
- package/dist/Chips/ChipTypes.cjs +6 -0
- package/dist/Chips/ChipTypes.cjs.map +1 -0
- package/dist/Chips/ChoiceChips.cjs +94 -0
- package/dist/Chips/ChoiceChips.cjs.map +1 -0
- package/dist/Chips/FilterChip.cjs +81 -0
- package/dist/Chips/FilterChip.cjs.map +1 -0
- package/dist/Chips/InputChip.cjs +109 -0
- package/dist/Chips/InputChip.cjs.map +1 -0
- package/dist/Chips/index.cjs +48 -0
- package/dist/Chips/index.cjs.map +1 -0
- package/dist/Dropdown/BasicDropdown.cjs +300 -0
- package/dist/Dropdown/BasicDropdown.cjs.map +1 -0
- package/dist/Dropdown/BasicDropdown.js.map +1 -1
- package/dist/Dropdown/ChipDropdownInput.cjs +431 -0
- package/dist/Dropdown/ChipDropdownInput.cjs.map +1 -0
- package/dist/Dropdown/ChipDropdownInput.js +2 -4
- package/dist/Dropdown/ChipDropdownInput.js.map +1 -1
- package/dist/Dropdown/CommonStyling.cjs +81 -0
- package/dist/Dropdown/CommonStyling.cjs.map +1 -0
- package/dist/Dropdown/CommonStyling.d.ts +0 -5
- package/dist/Dropdown/CommonStyling.js +3 -10
- package/dist/Dropdown/CommonStyling.js.map +1 -1
- package/dist/Dropdown/DropdownButton.cjs +161 -0
- package/dist/Dropdown/DropdownButton.cjs.map +1 -0
- package/dist/Dropdown/DropdownButtonTypes.cjs +6 -0
- package/dist/Dropdown/DropdownButtonTypes.cjs.map +1 -0
- package/dist/Dropdown/DropdownContent.cjs +566 -0
- package/dist/Dropdown/DropdownContent.cjs.map +1 -0
- package/dist/Dropdown/DropdownContent.js +19 -54
- package/dist/Dropdown/DropdownContent.js.map +1 -1
- package/dist/Dropdown/DropdownFilter.cjs +357 -0
- package/dist/Dropdown/DropdownFilter.cjs.map +1 -0
- package/dist/Dropdown/DropdownFilter.js.map +1 -1
- package/dist/Dropdown/index.cjs +40 -0
- package/dist/Dropdown/index.cjs.map +1 -0
- package/dist/Dropdown/index.d.ts +1 -0
- package/dist/Dropdown/index.js.map +1 -1
- package/dist/Footer/Components/FooterBottomLinks.cjs +69 -0
- package/dist/Footer/Components/FooterBottomLinks.cjs.map +1 -0
- package/dist/Footer/Components/FooterDropdownLinks.cjs +91 -0
- package/dist/Footer/Components/FooterDropdownLinks.cjs.map +1 -0
- package/dist/Footer/Components/FooterNavSection.cjs +90 -0
- package/dist/Footer/Components/FooterNavSection.cjs.map +1 -0
- package/dist/Footer/Components/FooterNewsletterAndSocialSection.cjs +129 -0
- package/dist/Footer/Components/FooterNewsletterAndSocialSection.cjs.map +1 -0
- package/dist/Footer/Components/FooterTop.cjs +91 -0
- package/dist/Footer/Components/FooterTop.cjs.map +1 -0
- package/dist/Footer/Footer.cjs +41 -0
- package/dist/Footer/Footer.cjs.map +1 -0
- package/dist/Footer/SiteFooter.cjs +89 -0
- package/dist/Footer/SiteFooter.cjs.map +1 -0
- package/dist/Footer/index.cjs +24 -0
- package/dist/Footer/index.cjs.map +1 -0
- package/dist/GlobalNavigationBar/Actions.cjs +185 -0
- package/dist/GlobalNavigationBar/Actions.cjs.map +1 -0
- package/dist/GlobalNavigationBar/Avatar.cjs +106 -0
- package/dist/GlobalNavigationBar/Avatar.cjs.map +1 -0
- package/dist/GlobalNavigationBar/ExtendedMainMenu.cjs +100 -0
- package/dist/GlobalNavigationBar/ExtendedMainMenu.cjs.map +1 -0
- package/dist/GlobalNavigationBar/GlobalNavigationBar.cjs +303 -0
- package/dist/GlobalNavigationBar/GlobalNavigationBar.cjs.map +1 -0
- package/dist/GlobalNavigationBar/Logo.cjs +102 -0
- package/dist/GlobalNavigationBar/Logo.cjs.map +1 -0
- package/dist/GlobalNavigationBar/MainMenu.cjs +169 -0
- package/dist/GlobalNavigationBar/MainMenu.cjs.map +1 -0
- package/dist/GlobalNavigationBar/RightSideNav.cjs +89 -0
- package/dist/GlobalNavigationBar/RightSideNav.cjs.map +1 -0
- package/dist/GlobalNavigationBar/UserMenu/MenuLink.cjs +108 -0
- package/dist/GlobalNavigationBar/UserMenu/MenuLink.cjs.map +1 -0
- package/dist/GlobalNavigationBar/UserMenu/MobileUserMenu.cjs +176 -0
- package/dist/GlobalNavigationBar/UserMenu/MobileUserMenu.cjs.map +1 -0
- package/dist/GlobalNavigationBar/UserMenu/UserMenu.cjs +168 -0
- package/dist/GlobalNavigationBar/UserMenu/UserMenu.cjs.map +1 -0
- package/dist/GlobalNavigationBar/index.cjs +36 -0
- package/dist/GlobalNavigationBar/index.cjs.map +1 -0
- package/dist/GlobalNavigationBar/mobile/CommonStyles.cjs +71 -0
- package/dist/GlobalNavigationBar/mobile/CommonStyles.cjs.map +1 -0
- package/dist/GlobalNavigationBar/mobile/ExitMenuButton.cjs +49 -0
- package/dist/GlobalNavigationBar/mobile/ExitMenuButton.cjs.map +1 -0
- package/dist/GlobalNavigationBar/mobile/MobileActionMenu.cjs +91 -0
- package/dist/GlobalNavigationBar/mobile/MobileActionMenu.cjs.map +1 -0
- package/dist/GlobalNavigationBar/mobile/MobileMenu.cjs +290 -0
- package/dist/GlobalNavigationBar/mobile/MobileMenu.cjs.map +1 -0
- package/dist/HyperLink/HyperLink.cjs +72 -0
- package/dist/HyperLink/HyperLink.cjs.map +1 -0
- package/dist/HyperLink/index.cjs +30 -0
- package/dist/HyperLink/index.cjs.map +1 -0
- package/dist/HyperLink/styling.cjs +22 -0
- package/dist/HyperLink/styling.cjs.map +1 -0
- package/dist/InputFields/Checkbox.cjs +127 -0
- package/dist/InputFields/Checkbox.cjs.map +1 -0
- package/dist/InputFields/Checkbox.d.ts +6 -0
- package/dist/InputFields/Checkbox.js +3 -4
- package/dist/InputFields/Checkbox.js.map +1 -1
- package/dist/InputFields/DatepickerField.cjs +252 -0
- package/dist/InputFields/DatepickerField.cjs.map +1 -0
- package/dist/InputFields/DatepickerFieldHeader.cjs +107 -0
- package/dist/InputFields/DatepickerFieldHeader.cjs.map +1 -0
- package/dist/InputFields/Label.cjs +104 -0
- package/dist/InputFields/Label.cjs.map +1 -0
- package/dist/InputFields/PasswordField.cjs +150 -0
- package/dist/InputFields/PasswordField.cjs.map +1 -0
- package/dist/InputFields/QuickSearch.cjs +201 -0
- package/dist/InputFields/QuickSearch.cjs.map +1 -0
- package/dist/InputFields/RadioButton.cjs +114 -0
- package/dist/InputFields/RadioButton.cjs.map +1 -0
- package/dist/InputFields/RadioButton.js +2 -3
- package/dist/InputFields/RadioButton.js.map +1 -1
- package/dist/InputFields/ResponsiveComponentWrapper.cjs +72 -0
- package/dist/InputFields/ResponsiveComponentWrapper.cjs.map +1 -0
- package/dist/InputFields/SearchBar.cjs +146 -0
- package/dist/InputFields/SearchBar.cjs.map +1 -0
- package/dist/InputFields/TextField.cjs +126 -0
- package/dist/InputFields/TextField.cjs.map +1 -0
- package/dist/InputFields/Textarea.cjs +96 -0
- package/dist/InputFields/Textarea.cjs.map +1 -0
- package/dist/InputFields/components/SearchBarInput.cjs +99 -0
- package/dist/InputFields/components/SearchBarInput.cjs.map +1 -0
- package/dist/InputFields/components/SearchField.cjs +71 -0
- package/dist/InputFields/components/SearchField.cjs.map +1 -0
- package/dist/InputFields/index.cjs +80 -0
- package/dist/InputFields/index.cjs.map +1 -0
- package/dist/InputFields/styling.cjs +76 -0
- package/dist/InputFields/styling.cjs.map +1 -0
- package/dist/Layouts/index.cjs +56 -0
- package/dist/Layouts/index.cjs.map +1 -0
- package/dist/List/ListRow.cjs +143 -0
- package/dist/List/ListRow.cjs.map +1 -0
- package/dist/List/index.cjs +16 -0
- package/dist/List/index.cjs.map +1 -0
- package/dist/LoadingIndicator/LoadingIndicator.cjs +71 -0
- package/dist/LoadingIndicator/LoadingIndicator.cjs.map +1 -0
- package/dist/LoadingIndicator/index.cjs +16 -0
- package/dist/LoadingIndicator/index.cjs.map +1 -0
- package/dist/LoadingPage/GlobalLoadingPage.cjs +66 -0
- package/dist/LoadingPage/GlobalLoadingPage.cjs.map +1 -0
- package/dist/LoadingPage/index.cjs +16 -0
- package/dist/LoadingPage/index.cjs.map +1 -0
- package/dist/MenuItem/MenuItem.cjs +104 -0
- package/dist/MenuItem/MenuItem.cjs.map +1 -0
- package/dist/MenuItem/MenuItem.d.ts +21 -0
- package/dist/MenuItem/MenuItem.js +64 -0
- package/dist/MenuItem/MenuItem.js.map +1 -0
- package/dist/MiniProductCard/MiniProductCard.cjs +80 -0
- package/dist/MiniProductCard/MiniProductCard.cjs.map +1 -0
- package/dist/MiniProductCard/index.cjs +16 -0
- package/dist/MiniProductCard/index.cjs.map +1 -0
- package/dist/Modals/Modal.cjs +92 -0
- package/dist/Modals/Modal.cjs.map +1 -0
- package/dist/Modals/ModalContainer.cjs +176 -0
- package/dist/Modals/ModalContainer.cjs.map +1 -0
- package/dist/Modals/ModalContainer.js +1 -1
- package/dist/Modals/ModalContainer.js.map +1 -1
- package/dist/Modals/ModalDialog.cjs +363 -0
- package/dist/Modals/ModalDialog.cjs.map +1 -0
- package/dist/Modals/ModalDialog.d.ts +1 -0
- package/dist/Modals/ModalDialog.js +16 -2
- package/dist/Modals/ModalDialog.js.map +1 -1
- package/dist/Modals/ModalNote.cjs +93 -0
- package/dist/Modals/ModalNote.cjs.map +1 -0
- package/dist/Modals/ModalStyles.cjs +154 -0
- package/dist/Modals/ModalStyles.cjs.map +1 -0
- package/dist/Modals/ModalStyles.js +1 -1
- package/dist/Modals/ModalStyles.js.map +1 -1
- package/dist/Modals/ModalTypes.cjs +6 -0
- package/dist/Modals/ModalTypes.cjs.map +1 -0
- package/dist/Modals/index.cjs +70 -0
- package/dist/Modals/index.cjs.map +1 -0
- package/dist/Modals/index.d.ts +1 -0
- package/dist/Modals/index.js.map +1 -1
- package/dist/NavItem/NavItem.cjs +26 -0
- package/dist/NavItem/NavItem.cjs.map +1 -0
- package/dist/NavItem/index.cjs +16 -0
- package/dist/NavItem/index.cjs.map +1 -0
- package/dist/NotificationDot/NotificationDot.cjs +74 -0
- package/dist/NotificationDot/NotificationDot.cjs.map +1 -0
- package/dist/NotificationDot/index.cjs +16 -0
- package/dist/NotificationDot/index.cjs.map +1 -0
- package/dist/Paginator/Paginator.cjs +191 -0
- package/dist/Paginator/Paginator.cjs.map +1 -0
- package/dist/Paginator/index.cjs +16 -0
- package/dist/Paginator/index.cjs.map +1 -0
- package/dist/QuizButton/QuizButton.cjs +148 -0
- package/dist/QuizButton/QuizButton.cjs.map +1 -0
- package/dist/QuizButton/QuizButton.js +8 -10
- package/dist/QuizButton/QuizButton.js.map +1 -1
- package/dist/QuizButton/index.cjs +16 -0
- package/dist/QuizButton/index.cjs.map +1 -0
- package/dist/Services/functions.cjs +19 -0
- package/dist/Services/functions.cjs.map +1 -0
- package/dist/SkipToContent/SkipToContent.cjs +46 -0
- package/dist/SkipToContent/SkipToContent.cjs.map +1 -0
- package/dist/SkipToContent/index.cjs +16 -0
- package/dist/SkipToContent/index.cjs.map +1 -0
- package/dist/Switcher/MobileSwitcherMenu.cjs +120 -0
- package/dist/Switcher/MobileSwitcherMenu.cjs.map +1 -0
- package/dist/Switcher/SwitcherMenuItem.cjs +62 -0
- package/dist/Switcher/SwitcherMenuItem.cjs.map +1 -0
- package/dist/Switcher/index.cjs +24 -0
- package/dist/Switcher/index.cjs.map +1 -0
- package/dist/Table/Table.cjs +463 -0
- package/dist/Table/Table.cjs.map +1 -0
- package/dist/Table/Table.js +1 -1
- package/dist/Table/Table.js.map +1 -1
- package/dist/Table/TableBody.cjs +192 -0
- package/dist/Table/TableBody.cjs.map +1 -0
- package/dist/Table/TableBody.js +26 -21
- package/dist/Table/TableBody.js.map +1 -1
- package/dist/Table/TableFooter.cjs +120 -0
- package/dist/Table/TableFooter.cjs.map +1 -0
- package/dist/Table/TableFooter.js +6 -6
- package/dist/Table/TableFooter.js.map +1 -1
- package/dist/Table/TableHeaders.cjs +102 -0
- package/dist/Table/TableHeaders.cjs.map +1 -0
- package/dist/Table/TableHeaders.js +5 -4
- package/dist/Table/TableHeaders.js.map +1 -1
- package/dist/Table/TableStyles.cjs +106 -0
- package/dist/Table/TableStyles.cjs.map +1 -0
- package/dist/Table/TableStyles.js +8 -7
- package/dist/Table/TableStyles.js.map +1 -1
- package/dist/Table/TableTypes.cjs +6 -0
- package/dist/Table/TableTypes.cjs.map +1 -0
- package/dist/Table/TableTypes.d.ts +2 -0
- package/dist/Table/index.cjs +16 -0
- package/dist/Table/index.cjs.map +1 -0
- package/dist/Table/index.d.ts +1 -0
- package/dist/Table/index.js.map +1 -1
- package/dist/Tabs/HorizontalTabs.cjs +98 -0
- package/dist/Tabs/HorizontalTabs.cjs.map +1 -0
- package/dist/Tabs/HorizontalTabs.d.ts +1 -1
- package/dist/Tabs/HorizontalTabs.js.map +1 -1
- package/dist/Tabs/TabLink.cjs +128 -0
- package/dist/Tabs/TabLink.cjs.map +1 -0
- package/dist/Tabs/Tabs.cjs +121 -0
- package/dist/Tabs/Tabs.cjs.map +1 -0
- package/dist/Tabs/VerticalTabs.cjs +68 -0
- package/dist/Tabs/VerticalTabs.cjs.map +1 -0
- package/dist/Tabs/index.cjs +24 -0
- package/dist/Tabs/index.cjs.map +1 -0
- package/dist/Tabs/index.d.ts +2 -0
- package/dist/Tabs/index.js.map +1 -1
- package/dist/Toasters/Toast.cjs +289 -0
- package/dist/Toasters/Toast.cjs.map +1 -0
- package/dist/Toasters/ToastContext.cjs +179 -0
- package/dist/Toasters/ToastContext.cjs.map +1 -0
- package/dist/Toasters/index.cjs +36 -0
- package/dist/Toasters/index.cjs.map +1 -0
- package/dist/Toggles/ToggleSwitch.cjs +73 -0
- package/dist/Toggles/ToggleSwitch.cjs.map +1 -0
- package/dist/Toggles/TogglerStyles.cjs +39 -0
- package/dist/Toggles/TogglerStyles.cjs.map +1 -0
- package/dist/Toggles/TogglerTypes.cjs +6 -0
- package/dist/Toggles/TogglerTypes.cjs.map +1 -0
- package/dist/Toggles/index.cjs +16 -0
- package/dist/Toggles/index.cjs.map +1 -0
- package/dist/Tooltips/TooltipStyles.cjs +96 -0
- package/dist/Tooltips/TooltipStyles.cjs.map +1 -0
- package/dist/Tooltips/TooltipTypes.cjs +11 -0
- package/dist/Tooltips/TooltipTypes.cjs.map +1 -0
- package/dist/Tooltips/TooltipWrapper.cjs +51 -0
- package/dist/Tooltips/TooltipWrapper.cjs.map +1 -0
- package/dist/Tooltips/index.cjs +36 -0
- package/dist/Tooltips/index.cjs.map +1 -0
- package/dist/Tooltips/index.d.ts +2 -2
- package/dist/Tooltips/index.js +2 -2
- package/dist/Tooltips/index.js.map +1 -1
- package/dist/assets/index.cjs +173 -0
- package/dist/assets/index.cjs.map +1 -0
- package/dist/common/EventHandlers.cjs +20 -0
- package/dist/common/EventHandlers.cjs.map +1 -0
- package/dist/common/FocusVisible.cjs +77 -0
- package/dist/common/FocusVisible.cjs.map +1 -0
- package/dist/common/InputStyling.cjs +20 -0
- package/dist/common/InputStyling.cjs.map +1 -0
- package/dist/common/index.cjs +30 -0
- package/dist/common/index.cjs.map +1 -0
- package/dist/common/index.d.ts +1 -0
- package/dist/common/index.js +1 -0
- package/dist/common/index.js.map +1 -1
- package/dist/hooks/useClickOutside.cjs +35 -0
- package/dist/hooks/useClickOutside.cjs.map +1 -0
- package/dist/icons/contenticons/ContentIcons.cjs +4530 -0
- package/dist/icons/contenticons/ContentIcons.cjs.map +1 -0
- package/dist/icons/index.cjs +147 -0
- package/dist/icons/index.cjs.map +1 -0
- package/dist/icons/systemicons/SystemIcons.cjs +4134 -0
- package/dist/icons/systemicons/SystemIcons.cjs.map +1 -0
- package/dist/index.cjs +422 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -1
- package/dist/styles/breakpoints.cjs +16 -0
- package/dist/styles/breakpoints.cjs.map +1 -0
- package/dist/styles/colors.cjs +108 -0
- package/dist/styles/colors.cjs.map +1 -0
- package/dist/styles/global.cjs +15 -0
- package/dist/styles/global.cjs.map +1 -0
- package/dist/styles/index.cjs +288 -0
- package/dist/styles/index.cjs.map +1 -0
- package/dist/styles/index.d.ts +1 -0
- package/dist/styles/index.js +1 -0
- package/dist/styles/index.js.map +1 -1
- package/dist/styles/shadowstyles.cjs +14 -0
- package/dist/styles/shadowstyles.cjs.map +1 -0
- package/dist/styles/typography.cjs +640 -0
- package/dist/styles/typography.cjs.map +1 -0
- package/dist/styles/z-indexes.cjs +22 -0
- package/dist/styles/z-indexes.cjs.map +1 -0
- package/dist/types.cjs +59 -0
- package/dist/types.cjs.map +1 -0
- package/package.json +13 -5
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
+
|
|
7
|
+
Object.defineProperty(exports, "__esModule", {
|
|
8
|
+
value: true
|
|
9
|
+
});
|
|
10
|
+
exports.default = void 0;
|
|
11
|
+
|
|
12
|
+
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
13
|
+
|
|
14
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
15
|
+
|
|
16
|
+
var React = _interopRequireWildcard(require("react"));
|
|
17
|
+
|
|
18
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
19
|
+
|
|
20
|
+
var _styles = require("../styles");
|
|
21
|
+
|
|
22
|
+
var _Layouts = require("../Layouts");
|
|
23
|
+
|
|
24
|
+
var _typography = require("../styles/typography");
|
|
25
|
+
|
|
26
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
27
|
+
|
|
28
|
+
var _templateObject, _templateObject2;
|
|
29
|
+
|
|
30
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
31
|
+
|
|
32
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
33
|
+
|
|
34
|
+
var BannersWrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n background-color: ", ";\n"])), _styles.COLORS.primary_20);
|
|
35
|
+
|
|
36
|
+
var BannerContent = (0, _styledComponents.default)(_Layouts.PageWidth)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n background-color: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n\n ", " {\n flex-direction: row;\n padding: 48px 12px;\n }\n\n & > *:first-child {\n padding-top: 12px;\n width: 320px;\n height: 180px;\n ", " {\n padding-top: 0;\n margin-right: 20px;\n width: 384px;\n height: 216px;\n }\n }\n & h2 {\n ", "\n margin: 16px 0 24px 0;\n }\n & p {\n margin: 0;\n padding: 0 0 28px 0;\n max-width: 310px;\n }\n & div {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n margin-bottom: 18px;\n ", " {\n margin-left: 20px;\n align-items: start;\n justify-content: start;\n width: 384px;\n }\n }\n"])), _styles.COLORS.primary_20, _styles.BREAKPOINTS.MEDIUM, _styles.BREAKPOINTS.MEDIUM, (0, _typography.HeadlineXSStyling)(_styles.COLORS.black), _styles.BREAKPOINTS.MEDIUM);
|
|
37
|
+
|
|
38
|
+
var OverviewBanner = function OverviewBanner(_ref) {
|
|
39
|
+
var children = _ref.children,
|
|
40
|
+
testId = _ref.testId;
|
|
41
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(BannersWrapper, {
|
|
42
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(BannerContent, {
|
|
43
|
+
"data-testid": testId,
|
|
44
|
+
children: children
|
|
45
|
+
})
|
|
46
|
+
});
|
|
47
|
+
};
|
|
48
|
+
|
|
49
|
+
OverviewBanner.propTypes = {
|
|
50
|
+
children: _propTypes.default.any.isRequired,
|
|
51
|
+
testId: _propTypes.default.string
|
|
52
|
+
};
|
|
53
|
+
var _default = OverviewBanner;
|
|
54
|
+
exports.default = _default;
|
|
55
|
+
//# sourceMappingURL=OverviewBanner.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Banners/OverviewBanner.tsx"],"names":["BannersWrapper","styled","div","COLORS","primary_20","BannerContent","PageWidth","BREAKPOINTS","MEDIUM","black","OverviewBanner","children","testId"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,IAAMA,cAAc,GAAGC,0BAAOC,GAAV,iHACEC,eAAOC,UADT,CAApB;;AAIA,IAAMC,aAAa,GAAG,+BAAOC,kBAAP,CAAH,w3BACGH,eAAOC,UADV,EAOfG,oBAAYC,MAPG,EAgBbD,oBAAYC,MAhBC,EAwBb,mCAAkBL,eAAOM,KAAzB,CAxBa,EAsCbF,oBAAYC,MAtCC,CAAnB;;AAiDA,IAAME,cAAc,GAAG,SAAjBA,cAAiB,OAAiC;AAAA,MAA9BC,QAA8B,QAA9BA,QAA8B;AAAA,MAApBC,MAAoB,QAApBA,MAAoB;AACtD,sBACE,qBAAC,cAAD;AAAA,2BACE,qBAAC,aAAD;AAAe,qBAAaA,MAA5B;AAAA,gBAAqCD;AAArC;AADF,IADF;AAKD,CAND;;;AAFeA,EAAAA,Q;AAAeC,EAAAA,M;;eAUfF,c","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {BREAKPOINTS, COLORS} from '../styles';\nimport {PageWidth} from '../Layouts';\nimport {HeadlineXSStyling} from '../styles/typography';\n\nconst BannersWrapper = styled.div`\n background-color: ${COLORS.primary_20};\n`;\n\nconst BannerContent = styled(PageWidth)`\n background-color: ${COLORS.primary_20};\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n\n ${BREAKPOINTS.MEDIUM} {\n flex-direction: row;\n padding: 48px 12px;\n }\n\n & > *:first-child {\n padding-top: 12px;\n width: 320px;\n height: 180px;\n ${BREAKPOINTS.MEDIUM} {\n padding-top: 0;\n margin-right: 20px;\n width: 384px;\n height: 216px;\n }\n }\n & h2 {\n ${HeadlineXSStyling(COLORS.black)}\n margin: 16px 0 24px 0;\n }\n & p {\n margin: 0;\n padding: 0 0 28px 0;\n max-width: 310px;\n }\n & div {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n margin-bottom: 18px;\n ${BREAKPOINTS.MEDIUM} {\n margin-left: 20px;\n align-items: start;\n justify-content: start;\n width: 384px;\n }\n }\n`;\n\ntype Props = { children: any; testId?: string };\n\nconst OverviewBanner = ({ children, testId }: Props) => {\n return (\n <BannersWrapper>\n <BannerContent data-testid={testId}>{children}</BannerContent>\n </BannersWrapper>\n );\n};\n\nexport default OverviewBanner;\n"],"file":"OverviewBanner.cjs"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
Object.defineProperty(exports, "Banner", {
|
|
9
|
+
enumerable: true,
|
|
10
|
+
get: function get() {
|
|
11
|
+
return _Banner.default;
|
|
12
|
+
}
|
|
13
|
+
});
|
|
14
|
+
Object.defineProperty(exports, "OverviewBanner", {
|
|
15
|
+
enumerable: true,
|
|
16
|
+
get: function get() {
|
|
17
|
+
return _OverviewBanner.default;
|
|
18
|
+
}
|
|
19
|
+
});
|
|
20
|
+
|
|
21
|
+
var _Banner = _interopRequireDefault(require("./Banner"));
|
|
22
|
+
|
|
23
|
+
var _OverviewBanner = _interopRequireDefault(require("./OverviewBanner"));
|
|
24
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Banners/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;;AACA","sourcesContent":["import Banner from './Banner';\nimport OverviewBanner from './OverviewBanner';\n\n// eslint-disable-next-line import/prefer-default-export\nexport { Banner, OverviewBanner };\n"],"file":"index.cjs"}
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.getButtonStyle = void 0;
|
|
9
|
+
|
|
10
|
+
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
11
|
+
|
|
12
|
+
var _styledComponents = require("styled-components");
|
|
13
|
+
|
|
14
|
+
var _Iconbutton = require("../Button/Iconbutton");
|
|
15
|
+
|
|
16
|
+
var _styles = require("../styles");
|
|
17
|
+
|
|
18
|
+
var _templateObject;
|
|
19
|
+
|
|
20
|
+
var getButtonStyle = function getButtonStyle(type) {
|
|
21
|
+
var style = {
|
|
22
|
+
svgFill: _styles.COLORS.primary_500,
|
|
23
|
+
hoverBgColor: _styles.COLORS.primary_200,
|
|
24
|
+
hoverSvgFill: _styles.COLORS.primary_700,
|
|
25
|
+
activeBgColor: _styles.COLORS.primary_300,
|
|
26
|
+
activeSvgFill: _styles.COLORS.primary_800,
|
|
27
|
+
focusBgColor: _styles.COLORS.primary_200,
|
|
28
|
+
focusSvgFill: _styles.COLORS.primary_700
|
|
29
|
+
};
|
|
30
|
+
|
|
31
|
+
switch (type) {
|
|
32
|
+
case 'warning':
|
|
33
|
+
style = {
|
|
34
|
+
svgFill: _styles.COLORS.warning_500,
|
|
35
|
+
hoverBgColor: _styles.COLORS.warning_200,
|
|
36
|
+
hoverSvgFill: _styles.COLORS.warning_700,
|
|
37
|
+
activeBgColor: _styles.COLORS.warning_300,
|
|
38
|
+
activeSvgFill: _styles.COLORS.warning_800,
|
|
39
|
+
focusBgColor: _styles.COLORS.warning_200,
|
|
40
|
+
focusSvgFill: _styles.COLORS.warning_700
|
|
41
|
+
};
|
|
42
|
+
break;
|
|
43
|
+
|
|
44
|
+
case 'critical':
|
|
45
|
+
style = {
|
|
46
|
+
svgFill: _styles.COLORS.critical_600,
|
|
47
|
+
hoverBgColor: _styles.COLORS.critical_200,
|
|
48
|
+
hoverSvgFill: _styles.COLORS.critical_700,
|
|
49
|
+
activeBgColor: _styles.COLORS.critical_300,
|
|
50
|
+
activeSvgFill: _styles.COLORS.critical_800,
|
|
51
|
+
focusBgColor: _styles.COLORS.critical_200,
|
|
52
|
+
focusSvgFill: _styles.COLORS.critical_700
|
|
53
|
+
};
|
|
54
|
+
break;
|
|
55
|
+
|
|
56
|
+
case 'positive':
|
|
57
|
+
style = {
|
|
58
|
+
svgFill: _styles.COLORS.correct_500,
|
|
59
|
+
hoverBgColor: _styles.COLORS.correct_200,
|
|
60
|
+
hoverSvgFill: _styles.COLORS.correct_700,
|
|
61
|
+
activeBgColor: _styles.COLORS.correct_300,
|
|
62
|
+
activeSvgFill: _styles.COLORS.correct_800,
|
|
63
|
+
focusBgColor: _styles.COLORS.correct_200,
|
|
64
|
+
focusSvgFill: _styles.COLORS.correct_700
|
|
65
|
+
};
|
|
66
|
+
break;
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
return (0, _styledComponents.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n ", " {\n div {\n background-color: transparent;\n }\n div svg path,\n div svg {\n fill: ", ";\n }\n &:hover:not(:disabled) {\n div {\n background-color: ", ";\n }\n div svg path,\n div svg {\n fill: ", ";\n }\n }\n &:focus:not(:disabled) {\n div {\n background-color: ", ";\n }\n div svg path,\n div svg {\n fill: ", ";\n }\n }\n &:active:not(:disabled) {\n div {\n background: ", ";\n }\n div svg path,\n div svg {\n fill: ", ";\n }\n }\n }"])), _Iconbutton.StyledSecondaryIconButton, style.svgFill, style.hoverBgColor, style.hoverSvgFill, style.focusBgColor, style.focusSvgFill, style.activeBgColor, style.activeSvgFill);
|
|
70
|
+
};
|
|
71
|
+
|
|
72
|
+
exports.getButtonStyle = getButtonStyle;
|
|
73
|
+
//# sourceMappingURL=styles.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Banners/styles.tsx"],"names":["getButtonStyle","type","style","svgFill","COLORS","primary_500","hoverBgColor","primary_200","hoverSvgFill","primary_700","activeBgColor","primary_300","activeSvgFill","primary_800","focusBgColor","focusSvgFill","warning_500","warning_200","warning_700","warning_300","warning_800","critical_600","critical_200","critical_700","critical_300","critical_800","correct_500","correct_200","correct_700","correct_300","correct_800","css","StyledSecondaryIconButton"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;;;AAEO,IAAMA,cAAc,GAAG,SAAjBA,cAAiB,CAACC,IAAD,EAAkB;AAC9C,MAAIC,KAAK,GAAG;AACVC,IAAAA,OAAO,EAAEC,eAAOC,WADN;AAEVC,IAAAA,YAAY,EAAEF,eAAOG,WAFX;AAGVC,IAAAA,YAAY,EAAEJ,eAAOK,WAHX;AAIVC,IAAAA,aAAa,EAAEN,eAAOO,WAJZ;AAKVC,IAAAA,aAAa,EAAER,eAAOS,WALZ;AAMVC,IAAAA,YAAY,EAAEV,eAAOG,WANX;AAOVQ,IAAAA,YAAY,EAAEX,eAAOK;AAPX,GAAZ;;AAUA,UAAOR,IAAP;AAEE,SAAK,SAAL;AACEC,MAAAA,KAAK,GAAG;AACNC,QAAAA,OAAO,EAAEC,eAAOY,WADV;AAENV,QAAAA,YAAY,EAAEF,eAAOa,WAFf;AAGNT,QAAAA,YAAY,EAAEJ,eAAOc,WAHf;AAINR,QAAAA,aAAa,EAAEN,eAAOe,WAJhB;AAKNP,QAAAA,aAAa,EAAER,eAAOgB,WALhB;AAMNN,QAAAA,YAAY,EAAEV,eAAOa,WANf;AAONF,QAAAA,YAAY,EAAEX,eAAOc;AAPf,OAAR;AASA;;AAEF,SAAK,UAAL;AACEhB,MAAAA,KAAK,GAAG;AACNC,QAAAA,OAAO,EAAEC,eAAOiB,YADV;AAENf,QAAAA,YAAY,EAAEF,eAAOkB,YAFf;AAGNd,QAAAA,YAAY,EAAEJ,eAAOmB,YAHf;AAINb,QAAAA,aAAa,EAAEN,eAAOoB,YAJhB;AAKNZ,QAAAA,aAAa,EAAER,eAAOqB,YALhB;AAMNX,QAAAA,YAAY,EAAEV,eAAOkB,YANf;AAONP,QAAAA,YAAY,EAAEX,eAAOmB;AAPf,OAAR;AASA;;AAEF,SAAK,UAAL;AACErB,MAAAA,KAAK,GAAG;AACNC,QAAAA,OAAO,EAAEC,eAAOsB,WADV;AAENpB,QAAAA,YAAY,EAAEF,eAAOuB,WAFf;AAGNnB,QAAAA,YAAY,EAAEJ,eAAOwB,WAHf;AAINlB,QAAAA,aAAa,EAAEN,eAAOyB,WAJhB;AAKNjB,QAAAA,aAAa,EAAER,eAAO0B,WALhB;AAMNhB,QAAAA,YAAY,EAAEV,eAAOuB,WANf;AAONZ,QAAAA,YAAY,EAAEX,eAAOwB;AAPf,OAAR;AASA;AApCJ;;AAuCA,aAAOG,qBAAP,qrBACIC,qCADJ,EAOY9B,KAAK,CAACC,OAPlB,EAW0BD,KAAK,CAACI,YAXhC,EAecJ,KAAK,CAACM,YAfpB,EAoB0BN,KAAK,CAACY,YApBhC,EAwBcZ,KAAK,CAACa,YAxBpB,EA6BoBb,KAAK,CAACQ,aA7B1B,EAiCcR,KAAK,CAACU,aAjCpB;AAqCD,CAvFM","sourcesContent":["import { css } from 'styled-components';\nimport { StyledSecondaryIconButton } from '../Button/Iconbutton';\nimport { COLORS } from '../styles';\n\nexport const getButtonStyle = (type: string) => {\n let style = {\n svgFill: COLORS.primary_500,\n hoverBgColor: COLORS.primary_200,\n hoverSvgFill: COLORS.primary_700,\n activeBgColor: COLORS.primary_300,\n activeSvgFill: COLORS.primary_800,\n focusBgColor: COLORS.primary_200,\n focusSvgFill: COLORS.primary_700\n };\n\n switch(type)\n {\n case 'warning':\n style = {\n svgFill: COLORS.warning_500,\n hoverBgColor: COLORS.warning_200,\n hoverSvgFill: COLORS.warning_700,\n activeBgColor: COLORS.warning_300,\n activeSvgFill: COLORS.warning_800,\n focusBgColor: COLORS.warning_200,\n focusSvgFill: COLORS.warning_700\n };\n break;\n \n case 'critical':\n style = {\n svgFill: COLORS.critical_600,\n hoverBgColor: COLORS.critical_200,\n hoverSvgFill: COLORS.critical_700,\n activeBgColor: COLORS.critical_300,\n activeSvgFill: COLORS.critical_800,\n focusBgColor: COLORS.critical_200,\n focusSvgFill: COLORS.critical_700\n };\n break;\n\n case 'positive':\n style = {\n svgFill: COLORS.correct_500,\n hoverBgColor: COLORS.correct_200,\n hoverSvgFill: COLORS.correct_700,\n activeBgColor: COLORS.correct_300,\n activeSvgFill: COLORS.correct_800,\n focusBgColor: COLORS.correct_200,\n focusSvgFill: COLORS.correct_700\n };\n break;\n }\n\n return css`\n ${StyledSecondaryIconButton} {\n div {\n background-color: transparent;\n }\n div svg path,\n div svg {\n fill: ${style.svgFill};\n }\n &:hover:not(:disabled) {\n div {\n background-color: ${style.hoverBgColor};\n }\n div svg path,\n div svg {\n fill: ${style.hoverSvgFill};\n }\n }\n &:focus:not(:disabled) {\n div {\n background-color: ${style.focusBgColor};\n }\n div svg path,\n div svg {\n fill: ${style.focusSvgFill};\n }\n }\n &:active:not(:disabled) {\n div {\n background: ${style.activeBgColor};\n }\n div svg path,\n div svg {\n fill: ${style.activeSvgFill};\n }\n }\n }`;\n};\n"],"file":"styles.cjs"}
|
package/dist/Banners/styles.js
CHANGED
|
@@ -1,22 +1,59 @@
|
|
|
1
1
|
import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
|
|
2
2
|
|
|
3
|
-
var _templateObject
|
|
3
|
+
var _templateObject;
|
|
4
4
|
|
|
5
5
|
import { css } from 'styled-components';
|
|
6
|
+
import { StyledSecondaryIconButton } from '../Button/Iconbutton';
|
|
6
7
|
import { COLORS } from '../styles';
|
|
7
8
|
export var getButtonStyle = function getButtonStyle(type) {
|
|
9
|
+
var style = {
|
|
10
|
+
svgFill: COLORS.primary_500,
|
|
11
|
+
hoverBgColor: COLORS.primary_200,
|
|
12
|
+
hoverSvgFill: COLORS.primary_700,
|
|
13
|
+
activeBgColor: COLORS.primary_300,
|
|
14
|
+
activeSvgFill: COLORS.primary_800,
|
|
15
|
+
focusBgColor: COLORS.primary_200,
|
|
16
|
+
focusSvgFill: COLORS.primary_700
|
|
17
|
+
};
|
|
18
|
+
|
|
8
19
|
switch (type) {
|
|
9
20
|
case 'warning':
|
|
10
|
-
|
|
21
|
+
style = {
|
|
22
|
+
svgFill: COLORS.warning_500,
|
|
23
|
+
hoverBgColor: COLORS.warning_200,
|
|
24
|
+
hoverSvgFill: COLORS.warning_700,
|
|
25
|
+
activeBgColor: COLORS.warning_300,
|
|
26
|
+
activeSvgFill: COLORS.warning_800,
|
|
27
|
+
focusBgColor: COLORS.warning_200,
|
|
28
|
+
focusSvgFill: COLORS.warning_700
|
|
29
|
+
};
|
|
30
|
+
break;
|
|
11
31
|
|
|
12
32
|
case 'critical':
|
|
13
|
-
|
|
33
|
+
style = {
|
|
34
|
+
svgFill: COLORS.critical_600,
|
|
35
|
+
hoverBgColor: COLORS.critical_200,
|
|
36
|
+
hoverSvgFill: COLORS.critical_700,
|
|
37
|
+
activeBgColor: COLORS.critical_300,
|
|
38
|
+
activeSvgFill: COLORS.critical_800,
|
|
39
|
+
focusBgColor: COLORS.critical_200,
|
|
40
|
+
focusSvgFill: COLORS.critical_700
|
|
41
|
+
};
|
|
42
|
+
break;
|
|
14
43
|
|
|
15
44
|
case 'positive':
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
45
|
+
style = {
|
|
46
|
+
svgFill: COLORS.correct_500,
|
|
47
|
+
hoverBgColor: COLORS.correct_200,
|
|
48
|
+
hoverSvgFill: COLORS.correct_700,
|
|
49
|
+
activeBgColor: COLORS.correct_300,
|
|
50
|
+
activeSvgFill: COLORS.correct_800,
|
|
51
|
+
focusBgColor: COLORS.correct_200,
|
|
52
|
+
focusSvgFill: COLORS.correct_700
|
|
53
|
+
};
|
|
54
|
+
break;
|
|
20
55
|
}
|
|
56
|
+
|
|
57
|
+
return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n ", " {\n div {\n background-color: transparent;\n }\n div svg path,\n div svg {\n fill: ", ";\n }\n &:hover:not(:disabled) {\n div {\n background-color: ", ";\n }\n div svg path,\n div svg {\n fill: ", ";\n }\n }\n &:focus:not(:disabled) {\n div {\n background-color: ", ";\n }\n div svg path,\n div svg {\n fill: ", ";\n }\n }\n &:active:not(:disabled) {\n div {\n background: ", ";\n }\n div svg path,\n div svg {\n fill: ", ";\n }\n }\n }"])), StyledSecondaryIconButton, style.svgFill, style.hoverBgColor, style.hoverSvgFill, style.focusBgColor, style.focusSvgFill, style.activeBgColor, style.activeSvgFill);
|
|
21
58
|
};
|
|
22
59
|
//# sourceMappingURL=styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Banners/styles.tsx"],"names":["css","COLORS","getButtonStyle","type","
|
|
1
|
+
{"version":3,"sources":["../../src/Banners/styles.tsx"],"names":["css","StyledSecondaryIconButton","COLORS","getButtonStyle","type","style","svgFill","primary_500","hoverBgColor","primary_200","hoverSvgFill","primary_700","activeBgColor","primary_300","activeSvgFill","primary_800","focusBgColor","focusSvgFill","warning_500","warning_200","warning_700","warning_300","warning_800","critical_600","critical_200","critical_700","critical_300","critical_800","correct_500","correct_200","correct_700","correct_300","correct_800"],"mappings":";;;;AAAA,SAASA,GAAT,QAAoB,mBAApB;AACA,SAASC,yBAAT,QAA0C,sBAA1C;AACA,SAASC,MAAT,QAAuB,WAAvB;AAEA,OAAO,IAAMC,cAAc,GAAG,SAAjBA,cAAiB,CAACC,IAAD,EAAkB;AAC9C,MAAIC,KAAK,GAAG;AACVC,IAAAA,OAAO,EAAEJ,MAAM,CAACK,WADN;AAEVC,IAAAA,YAAY,EAAEN,MAAM,CAACO,WAFX;AAGVC,IAAAA,YAAY,EAAER,MAAM,CAACS,WAHX;AAIVC,IAAAA,aAAa,EAAEV,MAAM,CAACW,WAJZ;AAKVC,IAAAA,aAAa,EAAEZ,MAAM,CAACa,WALZ;AAMVC,IAAAA,YAAY,EAAEd,MAAM,CAACO,WANX;AAOVQ,IAAAA,YAAY,EAAEf,MAAM,CAACS;AAPX,GAAZ;;AAUA,UAAOP,IAAP;AAEE,SAAK,SAAL;AACEC,MAAAA,KAAK,GAAG;AACNC,QAAAA,OAAO,EAAEJ,MAAM,CAACgB,WADV;AAENV,QAAAA,YAAY,EAAEN,MAAM,CAACiB,WAFf;AAGNT,QAAAA,YAAY,EAAER,MAAM,CAACkB,WAHf;AAINR,QAAAA,aAAa,EAAEV,MAAM,CAACmB,WAJhB;AAKNP,QAAAA,aAAa,EAAEZ,MAAM,CAACoB,WALhB;AAMNN,QAAAA,YAAY,EAAEd,MAAM,CAACiB,WANf;AAONF,QAAAA,YAAY,EAAEf,MAAM,CAACkB;AAPf,OAAR;AASA;;AAEF,SAAK,UAAL;AACEf,MAAAA,KAAK,GAAG;AACNC,QAAAA,OAAO,EAAEJ,MAAM,CAACqB,YADV;AAENf,QAAAA,YAAY,EAAEN,MAAM,CAACsB,YAFf;AAGNd,QAAAA,YAAY,EAAER,MAAM,CAACuB,YAHf;AAINb,QAAAA,aAAa,EAAEV,MAAM,CAACwB,YAJhB;AAKNZ,QAAAA,aAAa,EAAEZ,MAAM,CAACyB,YALhB;AAMNX,QAAAA,YAAY,EAAEd,MAAM,CAACsB,YANf;AAONP,QAAAA,YAAY,EAAEf,MAAM,CAACuB;AAPf,OAAR;AASA;;AAEF,SAAK,UAAL;AACEpB,MAAAA,KAAK,GAAG;AACNC,QAAAA,OAAO,EAAEJ,MAAM,CAAC0B,WADV;AAENpB,QAAAA,YAAY,EAAEN,MAAM,CAAC2B,WAFf;AAGNnB,QAAAA,YAAY,EAAER,MAAM,CAAC4B,WAHf;AAINlB,QAAAA,aAAa,EAAEV,MAAM,CAAC6B,WAJhB;AAKNjB,QAAAA,aAAa,EAAEZ,MAAM,CAAC8B,WALhB;AAMNhB,QAAAA,YAAY,EAAEd,MAAM,CAAC2B,WANf;AAONZ,QAAAA,YAAY,EAAEf,MAAM,CAAC4B;AAPf,OAAR;AASA;AApCJ;;AAuCA,SAAO9B,GAAP,sqBACIC,yBADJ,EAOYI,KAAK,CAACC,OAPlB,EAW0BD,KAAK,CAACG,YAXhC,EAecH,KAAK,CAACK,YAfpB,EAoB0BL,KAAK,CAACW,YApBhC,EAwBcX,KAAK,CAACY,YAxBpB,EA6BoBZ,KAAK,CAACO,aA7B1B,EAiCcP,KAAK,CAACS,aAjCpB;AAqCD,CAvFM","sourcesContent":["import { css } from 'styled-components';\nimport { StyledSecondaryIconButton } from '../Button/Iconbutton';\nimport { COLORS } from '../styles';\n\nexport const getButtonStyle = (type: string) => {\n let style = {\n svgFill: COLORS.primary_500,\n hoverBgColor: COLORS.primary_200,\n hoverSvgFill: COLORS.primary_700,\n activeBgColor: COLORS.primary_300,\n activeSvgFill: COLORS.primary_800,\n focusBgColor: COLORS.primary_200,\n focusSvgFill: COLORS.primary_700\n };\n\n switch(type)\n {\n case 'warning':\n style = {\n svgFill: COLORS.warning_500,\n hoverBgColor: COLORS.warning_200,\n hoverSvgFill: COLORS.warning_700,\n activeBgColor: COLORS.warning_300,\n activeSvgFill: COLORS.warning_800,\n focusBgColor: COLORS.warning_200,\n focusSvgFill: COLORS.warning_700\n };\n break;\n \n case 'critical':\n style = {\n svgFill: COLORS.critical_600,\n hoverBgColor: COLORS.critical_200,\n hoverSvgFill: COLORS.critical_700,\n activeBgColor: COLORS.critical_300,\n activeSvgFill: COLORS.critical_800,\n focusBgColor: COLORS.critical_200,\n focusSvgFill: COLORS.critical_700\n };\n break;\n\n case 'positive':\n style = {\n svgFill: COLORS.correct_500,\n hoverBgColor: COLORS.correct_200,\n hoverSvgFill: COLORS.correct_700,\n activeBgColor: COLORS.correct_300,\n activeSvgFill: COLORS.correct_800,\n focusBgColor: COLORS.correct_200,\n focusSvgFill: COLORS.correct_700\n };\n break;\n }\n\n return css`\n ${StyledSecondaryIconButton} {\n div {\n background-color: transparent;\n }\n div svg path,\n div svg {\n fill: ${style.svgFill};\n }\n &:hover:not(:disabled) {\n div {\n background-color: ${style.hoverBgColor};\n }\n div svg path,\n div svg {\n fill: ${style.hoverSvgFill};\n }\n }\n &:focus:not(:disabled) {\n div {\n background-color: ${style.focusBgColor};\n }\n div svg path,\n div svg {\n fill: ${style.focusSvgFill};\n }\n }\n &:active:not(:disabled) {\n div {\n background: ${style.activeBgColor};\n }\n div svg path,\n div svg {\n fill: ${style.activeSvgFill};\n }\n }\n }`;\n};\n"],"file":"styles.js"}
|
|
@@ -0,0 +1,169 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
+
|
|
7
|
+
Object.defineProperty(exports, "__esModule", {
|
|
8
|
+
value: true
|
|
9
|
+
});
|
|
10
|
+
exports.default = void 0;
|
|
11
|
+
|
|
12
|
+
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
13
|
+
|
|
14
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
15
|
+
|
|
16
|
+
var React = _interopRequireWildcard(require("react"));
|
|
17
|
+
|
|
18
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
19
|
+
|
|
20
|
+
var _styles = require("../styles");
|
|
21
|
+
|
|
22
|
+
var _ = require("..");
|
|
23
|
+
|
|
24
|
+
var _reactRouter = require("react-router");
|
|
25
|
+
|
|
26
|
+
var _typography = require("../styles/typography");
|
|
27
|
+
|
|
28
|
+
var _DropdownButton = _interopRequireDefault(require("../Dropdown/DropdownButton"));
|
|
29
|
+
|
|
30
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
31
|
+
|
|
32
|
+
var _templateObject, _templateObject2;
|
|
33
|
+
|
|
34
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
35
|
+
|
|
36
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
37
|
+
|
|
38
|
+
var marginRight = function marginRight(size) {
|
|
39
|
+
return size == _.Size.Small || size == _.Size.Medium ? 'margin-right: 8px;' : 'margin-right: 4px;';
|
|
40
|
+
};
|
|
41
|
+
|
|
42
|
+
var BreadcrumbContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display:flex;\n align-items: center;\n min-height: 48px;\n \n a {\n text-decoration: none;\n ", "\n ", "\n }\n\n .chevronicon {\n ", "\n }\n\n a:hover {\n color: ", ";\n }\n a:active {\n color: ", ";\n }\n"])), function (props) {
|
|
43
|
+
return FontStyles(props.size, _.ComponentTextStyle.Regular, _styles.COLORS.neutral_600);
|
|
44
|
+
}, function (props) {
|
|
45
|
+
return marginRight(props.size);
|
|
46
|
+
}, function (props) {
|
|
47
|
+
return marginRight(props.size);
|
|
48
|
+
}, _styles.COLORS.primary_700, _styles.COLORS.primary_800);
|
|
49
|
+
|
|
50
|
+
var FontStyles = function FontStyles(size, textStyle, color) {
|
|
51
|
+
switch (size) {
|
|
52
|
+
case _.Size.XSmall:
|
|
53
|
+
return (0, _typography.ComponentXXSStyling)(textStyle, color);
|
|
54
|
+
|
|
55
|
+
case _.Size.Medium:
|
|
56
|
+
return (0, _typography.ComponentMStyling)(textStyle, color);
|
|
57
|
+
|
|
58
|
+
case _.Size.Small:
|
|
59
|
+
default:
|
|
60
|
+
return (0, _typography.ComponentSStyling)(textStyle, color);
|
|
61
|
+
}
|
|
62
|
+
};
|
|
63
|
+
|
|
64
|
+
var LastBreadcrumbItem = _styledComponents.default.label(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n ", "\n ", "\n"])), function (props) {
|
|
65
|
+
return FontStyles(props.size, _.ComponentTextStyle.Bold, _styles.COLORS.neutral_800);
|
|
66
|
+
}, function (props) {
|
|
67
|
+
return marginRight(props.size);
|
|
68
|
+
});
|
|
69
|
+
|
|
70
|
+
var Breadcrumb = function Breadcrumb(_ref) {
|
|
71
|
+
var items = _ref.items,
|
|
72
|
+
_ref$size = _ref.size,
|
|
73
|
+
size = _ref$size === void 0 ? _.Size.Small : _ref$size,
|
|
74
|
+
_ref$homeIcon = _ref.homeIcon,
|
|
75
|
+
homeIcon = _ref$homeIcon === void 0 ? true : _ref$homeIcon,
|
|
76
|
+
_ref$homeLabel = _ref.homeLabel,
|
|
77
|
+
homeLabel = _ref$homeLabel === void 0 ? 'Home' : _ref$homeLabel,
|
|
78
|
+
_ref$homeUrl = _ref.homeUrl,
|
|
79
|
+
homeUrl = _ref$homeUrl === void 0 ? '/' : _ref$homeUrl;
|
|
80
|
+
var history = (0, _reactRouter.useHistory)();
|
|
81
|
+
var dropdownItems = items ? items.slice(0, items.length - 2).map(function (x) {
|
|
82
|
+
return {
|
|
83
|
+
value: x.url,
|
|
84
|
+
displayLabel: x.label
|
|
85
|
+
};
|
|
86
|
+
}) : [];
|
|
87
|
+
|
|
88
|
+
var navigate = function navigate(links) {
|
|
89
|
+
history.push(links[0]);
|
|
90
|
+
};
|
|
91
|
+
|
|
92
|
+
var chevronSize = size == _.Size.Medium ? "24px" : size == _.Size.Small ? "20px" : "16px";
|
|
93
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(BreadcrumbContainer, {
|
|
94
|
+
size: size,
|
|
95
|
+
children: [homeIcon ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
|
|
96
|
+
variant: "secondary",
|
|
97
|
+
shape: "circular",
|
|
98
|
+
action: function action() {
|
|
99
|
+
return history.push(homeUrl);
|
|
100
|
+
},
|
|
101
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.SystemIcons.Home, {
|
|
102
|
+
size: chevronSize
|
|
103
|
+
})
|
|
104
|
+
}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_.HyperLink, {
|
|
105
|
+
id: "homelink",
|
|
106
|
+
variant: "default",
|
|
107
|
+
href: homeUrl,
|
|
108
|
+
children: homeLabel
|
|
109
|
+
}), !!items && items.length > 2 && (items.length > 3 ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
110
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.SystemIcons.ChevronRight, {
|
|
111
|
+
className: "chevronicon",
|
|
112
|
+
color: _styles.COLORS.neutral_500,
|
|
113
|
+
size: chevronSize
|
|
114
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_DropdownButton.default, {
|
|
115
|
+
alignLeft: true,
|
|
116
|
+
items: dropdownItems,
|
|
117
|
+
size: size,
|
|
118
|
+
icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.SystemIcons.MoreHorizontal, {
|
|
119
|
+
color: _styles.COLORS.neutral_600,
|
|
120
|
+
size: "20px"
|
|
121
|
+
}),
|
|
122
|
+
onClick: navigate
|
|
123
|
+
})]
|
|
124
|
+
}) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
125
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.SystemIcons.ChevronRight, {
|
|
126
|
+
className: "chevronicon",
|
|
127
|
+
color: _styles.COLORS.neutral_500,
|
|
128
|
+
size: chevronSize
|
|
129
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.HyperLink, {
|
|
130
|
+
id: "link-item-" + (items.length - 3),
|
|
131
|
+
target: "_self",
|
|
132
|
+
variant: "default",
|
|
133
|
+
href: items[items.length - 3].url,
|
|
134
|
+
children: items[items.length - 3].label
|
|
135
|
+
})]
|
|
136
|
+
})), !!items && items.length > 1 && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
137
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.SystemIcons.ChevronRight, {
|
|
138
|
+
className: "chevronicon",
|
|
139
|
+
color: _styles.COLORS.neutral_500,
|
|
140
|
+
size: chevronSize
|
|
141
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.HyperLink, {
|
|
142
|
+
id: "link-item-" + (items.length - 2),
|
|
143
|
+
target: "_self",
|
|
144
|
+
variant: "default",
|
|
145
|
+
href: items[items.length - 2].url,
|
|
146
|
+
children: items[items.length - 2].label
|
|
147
|
+
})]
|
|
148
|
+
}), !!items && items.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
149
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.SystemIcons.ChevronRight, {
|
|
150
|
+
className: "chevronicon",
|
|
151
|
+
color: _styles.COLORS.neutral_500,
|
|
152
|
+
size: chevronSize
|
|
153
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(LastBreadcrumbItem, {
|
|
154
|
+
size: size,
|
|
155
|
+
children: items[items.length - 1].label
|
|
156
|
+
})]
|
|
157
|
+
})]
|
|
158
|
+
});
|
|
159
|
+
};
|
|
160
|
+
|
|
161
|
+
Breadcrumb.propTypes = {
|
|
162
|
+
homeIcon: _propTypes.default.bool,
|
|
163
|
+
homeLabel: _propTypes.default.string,
|
|
164
|
+
homeUrl: _propTypes.default.string,
|
|
165
|
+
items: _propTypes.default.array
|
|
166
|
+
};
|
|
167
|
+
var _default = Breadcrumb;
|
|
168
|
+
exports.default = _default;
|
|
169
|
+
//# sourceMappingURL=Breadcrumb.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Breadcrumb/Breadcrumb.tsx"],"names":["marginRight","size","Size","Small","Medium","BreadcrumbContainer","styled","div","props","FontStyles","ComponentTextStyle","Regular","COLORS","neutral_600","primary_700","primary_800","textStyle","color","XSmall","LastBreadcrumbItem","label","Bold","neutral_800","Breadcrumb","items","homeIcon","homeLabel","homeUrl","history","dropdownItems","slice","length","map","x","value","url","displayLabel","navigate","links","push","chevronSize","neutral_500"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport {COLORS} from '../styles';\nimport {ComponentTextStyle, Size, SystemIcons} from '..';\nimport {useHistory} from 'react-router';\nimport { HyperLink, IconButton } from '..';\nimport {BreadcrumbItem} from '@laerdal/life-react-components/src/Breadcrumb/BreadcrumbItem';\nimport {ComponentMStyling, ComponentSStyling, ComponentXXSStyling} from '../styles/typography';\nimport DropdownButton from '../Dropdown/DropdownButton';\nimport { DropdownItem } from '../Dropdown/DropdownContent';\n\ntype BreadcrumbProps = {\n homeIcon?: boolean;\n homeLabel?: string;\n homeUrl?: string;\n items?: BreadcrumbItem[];\n size?: Size;\n};\n\nconst marginRight = (size: Size | undefined) => {\n return size == Size.Small || size == Size.Medium ? 'margin-right: 8px;' : 'margin-right: 4px;'\n}\n\nconst BreadcrumbContainer = styled.div<{size: Size | undefined}>`\n display:flex;\n align-items: center;\n min-height: 48px;\n \n a {\n text-decoration: none;\n ${(props) => FontStyles(props.size, ComponentTextStyle.Regular, COLORS.neutral_600)}\n ${(props) => marginRight(props.size) }\n }\n\n .chevronicon {\n ${(props) => marginRight(props.size) }\n }\n\n a:hover {\n color: ${COLORS.primary_700};\n }\n a:active {\n color: ${COLORS.primary_800};\n }\n`;\n\nconst FontStyles = (size: Size | undefined, textStyle: ComponentTextStyle, color: string) => {\n switch (size) {\n case Size.XSmall:\n return ComponentXXSStyling(textStyle, color);\n case Size.Medium:\n return ComponentMStyling(textStyle, color);\n case Size.Small:\n default:\n return ComponentSStyling(textStyle, color);\n }\n}\n\nconst LastBreadcrumbItem = styled.label<{size: Size}>`\n ${(props) => FontStyles(props.size, ComponentTextStyle.Bold, COLORS.neutral_800)}\n ${(props) => marginRight(props.size) }\n`;\n\nconst Breadcrumb: React.FunctionComponent<BreadcrumbProps> = ({ \n items, \n size = Size.Small, \n homeIcon = true, \n homeLabel = 'Home', \n homeUrl = '/' }) => {\n\n const history = useHistory();\n const dropdownItems: DropdownItem[] = items ? items.slice(0, items.length - 2).map(x => ({ value: x.url, displayLabel: x.label })) : [];\n const navigate = (links: string[]) => { \n history.push(links[0]);\n };\n\n const chevronSize = size == Size.Medium ? \"24px\" : size == Size.Small ? \"20px\" : \"16px\";\n\n return (\n <BreadcrumbContainer size={size}>\n\n {homeIcon ? \n <IconButton variant=\"secondary\" shape=\"circular\" action={() => history.push(homeUrl)}>\n <SystemIcons.Home size={chevronSize} />\n </IconButton> : \n <HyperLink id={\"homelink\"} variant=\"default\" href={homeUrl}>\n {homeLabel}\n </HyperLink>}\n\n { !!items && items.length > 2 &&\n (items.length > 3 ?\n <>\n <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n <DropdownButton \n alignLeft={true}\n items={dropdownItems} \n size={size}\n icon={<SystemIcons.MoreHorizontal color={COLORS.neutral_600} size=\"20px\" />}\n onClick={navigate} />\n </> :\n <>\n <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n <HyperLink id={\"link-item-\" + (items.length - 3)} target=\"_self\" variant=\"default\" href={items[items.length - 3].url}>\n {items[items.length - 3].label}\n </HyperLink> \n </>)\n }\n\n { !!items && items.length > 1 && \n <>\n <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n <HyperLink id={\"link-item-\" + (items.length - 2)} target=\"_self\" variant=\"default\" href={items[items.length - 2].url}>\n {items[items.length - 2].label}\n </HyperLink>\n </>\n }\n\n { !!items && items.length > 0 && \n <>\n <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n <LastBreadcrumbItem size={size}>\n {items[items.length - 1].label}\n </LastBreadcrumbItem>\n </>\n }\n\n </BreadcrumbContainer>);\n};\n\nexport default Breadcrumb;\n"],"file":"Breadcrumb.cjs"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[],"file":"BreadcrumbItem.cjs"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
Object.defineProperty(exports, "Breadcrumb", {
|
|
9
|
+
enumerable: true,
|
|
10
|
+
get: function get() {
|
|
11
|
+
return _Breadcrumb.default;
|
|
12
|
+
}
|
|
13
|
+
});
|
|
14
|
+
|
|
15
|
+
var _Breadcrumb = _interopRequireDefault(require("./Breadcrumb"));
|
|
16
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Breadcrumb/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;AAAA","sourcesContent":["export { default as Breadcrumb } from './Breadcrumb';\n"],"file":"index.cjs"}
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
+
|
|
7
|
+
Object.defineProperty(exports, "__esModule", {
|
|
8
|
+
value: true
|
|
9
|
+
});
|
|
10
|
+
exports.default = void 0;
|
|
11
|
+
|
|
12
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
13
|
+
|
|
14
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
15
|
+
|
|
16
|
+
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
17
|
+
|
|
18
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
19
|
+
|
|
20
|
+
var React = _interopRequireWildcard(require("react"));
|
|
21
|
+
|
|
22
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
23
|
+
|
|
24
|
+
var _styles = require("../styles");
|
|
25
|
+
|
|
26
|
+
var _types = require("../types");
|
|
27
|
+
|
|
28
|
+
var _SystemIcons = require("../icons/systemicons/SystemIcons");
|
|
29
|
+
|
|
30
|
+
var _typography = require("../styles/typography");
|
|
31
|
+
|
|
32
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
33
|
+
|
|
34
|
+
var _excluded = ["children", "size"];
|
|
35
|
+
|
|
36
|
+
var _templateObject;
|
|
37
|
+
|
|
38
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
39
|
+
|
|
40
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
41
|
+
|
|
42
|
+
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; }
|
|
43
|
+
|
|
44
|
+
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; }
|
|
45
|
+
|
|
46
|
+
var Button = _styledComponents.default.button(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n box-sizing: border-box;\n min-height: 48px;\n padding: 0;\n margin: 0;\n outline:none;\n max-width: max-content;\n display: flex;\n align-items: center;\n border: none;\n background-color: transparent;\n cursor: pointer;\n\n ", ";\n font-feature-settings: 'liga' off;\n\n & > .button-content {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n max-width: max-content;\n padding: 4px 4px 4px 0;\n border-radius: 4px;\n cursor: inherit;\n min-width: 64px;\n\n }\n\n & > .button-content > span {\n display: flex;\n cursor: inherit;\n }\n & > .button-content > label {\n display: flex;\n cursor: inherit;\n flex-grow: 1;\n justify-content: center;\n }\n\n &:hover > .button-content,\n &.hover-state > .button-content {\n background-color: ", ";\n color: ", ";\n }\n &:focus > .button-content,\n &.focus-state > .button-content {\n box-shadow: 0 4px 12px rgba(46, 127, 161, 0.25), 0 0 8px #2e7fa1;\n }\n &:active > .button-content,\n &.active-state > .button-content {\n background-color: ", ";\n color: ", ";\n box-shadow: unset;\n }\n &:disabled {\n cursor: not-allowed;\n }\n &:disabled > .button-content {\n color: ", " !important;\n background-color: transparent !important;\n }\n"])), function (props) {
|
|
47
|
+
return props.size === _types.Size.XSmall ? (0, _typography.ComponentXSStyling)(_typography.ComponentTextStyle.Bold, _styles.COLORS.neutral_600) : (0, _typography.ComponentSStyling)(_typography.ComponentTextStyle.Bold, _styles.COLORS.neutral_600);
|
|
48
|
+
}, _styles.COLORS.primary_20, _styles.COLORS.primary_700, _styles.COLORS.primary_100, _styles.COLORS.primary_800, _styles.COLORS.neutral_300);
|
|
49
|
+
|
|
50
|
+
var BackButton = function BackButton(_ref) {
|
|
51
|
+
var children = _ref.children,
|
|
52
|
+
_ref$size = _ref.size,
|
|
53
|
+
size = _ref$size === void 0 ? _types.Size.Small : _ref$size,
|
|
54
|
+
props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
55
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Button, _objectSpread(_objectSpread({}, props), {}, {
|
|
56
|
+
size: size,
|
|
57
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
58
|
+
className: 'button-content',
|
|
59
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
60
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_SystemIcons.ArrowLineLeft, {
|
|
61
|
+
size: size === _types.Size.XSmall ? '20' : '24'
|
|
62
|
+
})
|
|
63
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("label", {
|
|
64
|
+
children: children
|
|
65
|
+
})]
|
|
66
|
+
})
|
|
67
|
+
}));
|
|
68
|
+
};
|
|
69
|
+
|
|
70
|
+
BackButton.propTypes = {
|
|
71
|
+
disabled: _propTypes.default.bool
|
|
72
|
+
};
|
|
73
|
+
var _default = BackButton;
|
|
74
|
+
exports.default = _default;
|
|
75
|
+
//# sourceMappingURL=BackButton.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Button/BackButton.tsx"],"names":["Button","styled","button","props","size","Size","XSmall","ComponentTextStyle","Bold","COLORS","neutral_600","primary_20","primary_700","primary_100","primary_800","neutral_300","BackButton","children","Small","disabled"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;AAEA,IAAMA,MAAM,GAAGC,0BAAOC,MAAV,y4CAaR,UAACC,KAAD;AAAA,SAAYA,KAAK,CAACC,IAAN,KAAeC,YAAKC,MAApB,GAA6B,oCAAmBC,+BAAmBC,IAAtC,EAA4CC,eAAOC,WAAnD,CAA7B,GAA+F,mCAAkBH,+BAAmBC,IAArC,EAA2CC,eAAOC,WAAlD,CAA3G;AAAA,CAbQ,EA0CYD,eAAOE,UA1CnB,EA2CCF,eAAOG,WA3CR,EAmDYH,eAAOI,WAnDnB,EAoDCJ,eAAOK,WApDR,EA2DCL,eAAOM,WA3DR,CAAZ;;AAoEA,IAAMC,UAAoD,GAAG,SAAvDA,UAAuD,OAA+C;AAAA,MAA5CC,QAA4C,QAA5CA,QAA4C;AAAA,uBAAlCb,IAAkC;AAAA,MAAlCA,IAAkC,0BAA3BC,YAAKa,KAAsB;AAAA,MAAZf,KAAY;AAC1G,sBACE,qBAAC,MAAD,kCAAYA,KAAZ;AAAmB,IAAA,IAAI,EAAEC,IAAzB;AAAA,2BACE;AAAK,MAAA,SAAS,EAAE,gBAAhB;AAAA,8BACE;AAAA,+BACE,qBAAC,0BAAD;AAAe,UAAA,IAAI,EAAEA,IAAI,KAAKC,YAAKC,MAAd,GAAuB,IAAvB,GAA8B;AAAnD;AADF,QADF,eAIE;AAAA,kBAAQW;AAAR,QAJF;AAAA;AADF,KADF;AAUD,CAXD;;;AAFEE,EAAAA,Q;;eAeaH,U","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { COLORS } from '../styles';\nimport { Size } from '../types';\nimport { ArrowLineLeft } from '../icons/systemicons/SystemIcons';\nimport { ComponentTextStyle, ComponentSStyling, ComponentXSStyling } from '../styles/typography';\n\nconst Button = styled.button<BackButtonProps>`\n box-sizing: border-box;\n min-height: 48px;\n padding: 0;\n margin: 0;\n outline:none;\n max-width: max-content;\n display: flex;\n align-items: center;\n border: none;\n background-color: transparent;\n cursor: pointer;\n\n ${(props) => (props.size === Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600) : ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600))};\n font-feature-settings: 'liga' off;\n\n & > .button-content {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n max-width: max-content;\n padding: 4px 4px 4px 0;\n border-radius: 4px;\n cursor: inherit;\n min-width: 64px;\n\n }\n\n & > .button-content > span {\n display: flex;\n cursor: inherit;\n }\n & > .button-content > label {\n display: flex;\n cursor: inherit;\n flex-grow: 1;\n justify-content: center;\n }\n\n &:hover > .button-content,\n &.hover-state > .button-content {\n background-color: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n }\n &:focus > .button-content,\n &.focus-state > .button-content {\n box-shadow: 0 4px 12px rgba(46, 127, 161, 0.25), 0 0 8px #2e7fa1;\n }\n &:active > .button-content,\n &.active-state > .button-content {\n background-color: ${COLORS.primary_100};\n color: ${COLORS.primary_800};\n box-shadow: unset;\n }\n &:disabled {\n cursor: not-allowed;\n }\n &:disabled > .button-content {\n color: ${COLORS.neutral_300} !important;\n background-color: transparent !important;\n }\n`;\n\ninterface BackButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n size: Size.Small | Size.XSmall;\n disabled?: boolean;\n}\nconst BackButton: React.FunctionComponent<BackButtonProps> = ({ children, size = Size.Small, ...props }) => {\n return (\n <Button {...props} size={size}>\n <div className={'button-content'}>\n <span>\n <ArrowLineLeft size={size === Size.XSmall ? '20' : '24'} />\n </span>\n <label>{children}</label>\n </div>\n </Button>\n );\n};\n\nexport default BackButton;\n"],"file":"BackButton.cjs"}
|