@otto-de/b2b-core-components 1.30.0 → 1.31.1
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/b2b-core-components/b2b-core-components.esm.js +1 -1
- package/dist/b2b-core-components/p-00666ca7.entry.js +1 -0
- package/dist/b2b-core-components/p-0a63f5f8.entry.js +1 -0
- package/dist/b2b-core-components/{p-9cfba835.entry.js → p-0bf05f33.entry.js} +1 -1
- package/dist/b2b-core-components/{p-68e07419.entry.js → p-0edac105.entry.js} +1 -1
- package/dist/b2b-core-components/p-0ffc90ee.entry.js +1 -0
- package/dist/b2b-core-components/p-168c8684.entry.js +1 -0
- package/dist/b2b-core-components/p-19392020.js +1 -0
- package/dist/b2b-core-components/p-1a908833.entry.js +1 -0
- package/dist/b2b-core-components/{p-a37d6cea.entry.js → p-1dff8b34.entry.js} +1 -1
- package/dist/b2b-core-components/p-2d5df8f7.entry.js +1 -0
- package/dist/b2b-core-components/p-2dc0c5c0.entry.js +1 -0
- package/dist/b2b-core-components/p-318eb15e.entry.js +1 -0
- package/dist/b2b-core-components/p-33c01bb2.entry.js +1 -0
- package/dist/b2b-core-components/p-375cefbd.entry.js +1 -0
- package/dist/b2b-core-components/p-383d0a10.entry.js +1 -0
- package/dist/b2b-core-components/{p-08577a40.entry.js → p-400fa973.entry.js} +1 -1
- package/dist/b2b-core-components/p-413729d1.entry.js +1 -0
- package/dist/b2b-core-components/p-4528e98c.entry.js +1 -0
- package/dist/b2b-core-components/p-49bafb74.entry.js +1 -0
- package/dist/b2b-core-components/{p-745ad406.entry.js → p-4bc0ec9a.entry.js} +1 -1
- package/dist/b2b-core-components/p-564c62d0.entry.js +1 -0
- package/dist/b2b-core-components/{p-6040dca2.entry.js → p-6025d667.entry.js} +1 -1
- package/dist/b2b-core-components/p-61b2a6ad.js +1 -0
- package/dist/b2b-core-components/{p-54d478b6.entry.js → p-661d0249.entry.js} +1 -1
- package/dist/b2b-core-components/p-6dd7fd7b.entry.js +1 -0
- package/dist/b2b-core-components/p-6ff5114b.entry.js +1 -0
- package/dist/b2b-core-components/p-742a18f1.entry.js +1 -0
- package/dist/b2b-core-components/{p-23acc468.entry.js → p-781611fb.entry.js} +1 -1
- package/dist/b2b-core-components/{p-0847e62e.entry.js → p-7bb6f06e.entry.js} +1 -1
- package/dist/b2b-core-components/p-7dd8f3cb.entry.js +1 -0
- package/dist/b2b-core-components/p-815d7a53.entry.js +1 -0
- package/dist/b2b-core-components/{p-5063e5b7.entry.js → p-850c8e01.entry.js} +1 -1
- package/dist/b2b-core-components/{p-e8b1fee4.entry.js → p-86ff8e6c.entry.js} +1 -1
- package/dist/b2b-core-components/{p-552f43c1.entry.js → p-9819f622.entry.js} +1 -1
- package/dist/b2b-core-components/{p-ccf78e23.entry.js → p-9dde1af0.entry.js} +1 -1
- package/dist/b2b-core-components/{p-24c94653.entry.js → p-9f88b476.entry.js} +1 -1
- package/dist/b2b-core-components/p-a155219a.entry.js +1 -0
- package/dist/b2b-core-components/p-a96c8ba0.entry.js +1 -0
- package/dist/b2b-core-components/p-b33059ab.entry.js +1 -0
- package/dist/b2b-core-components/p-b5fdf7df.entry.js +1 -0
- package/dist/b2b-core-components/p-b6a753e8.js +2 -0
- package/dist/b2b-core-components/p-bba0b41b.entry.js +1 -0
- package/dist/b2b-core-components/p-be93498d.entry.js +1 -0
- package/dist/b2b-core-components/p-bfbe4aff.entry.js +1 -0
- package/dist/b2b-core-components/p-c597637e.entry.js +1 -0
- package/dist/b2b-core-components/{p-eb01bb4f.entry.js → p-c67bcebc.entry.js} +1 -1
- package/dist/b2b-core-components/p-cb4cc427.entry.js +1 -0
- package/dist/b2b-core-components/{p-a63dfd99.entry.js → p-d1c8105b.entry.js} +1 -1
- package/dist/b2b-core-components/{p-2f9efe3f.entry.js → p-d26ec403.entry.js} +1 -1
- package/dist/b2b-core-components/p-d3204d75.entry.js +1 -0
- package/dist/b2b-core-components/p-d6457a1d.entry.js +1 -0
- package/dist/b2b-core-components/p-db205434.entry.js +1 -0
- package/dist/b2b-core-components/p-e1255160.js +1 -0
- package/dist/b2b-core-components/p-e520c7cf.entry.js +1 -0
- package/dist/b2b-core-components/p-f2fdce36.entry.js +1 -0
- package/dist/b2b-core-components/p-f5786cad.entry.js +1 -0
- package/dist/b2b-core-components/{p-58fb3508.entry.js → p-f5e9dbf4.entry.js} +1 -1
- package/dist/b2b-core-components/p-f9e278da.entry.js +1 -0
- package/dist/b2b-core-components/p-fa85955c.entry.js +1 -0
- package/dist/b2b-core-components/{p-eb78706f.entry.js → p-fae54521.entry.js} +1 -1
- package/dist/cjs/app-globals-3a1e7e63.js +5 -0
- package/dist/cjs/b2b-alert.cjs.entry.js +13 -15
- package/dist/cjs/b2b-anchor.cjs.entry.js +8 -10
- package/dist/cjs/b2b-background-box.cjs.entry.js +7 -10
- package/dist/cjs/b2b-breadcrumb-item.cjs.entry.js +10 -8
- package/dist/cjs/b2b-breadcrumb.cjs.entry.js +10 -9
- package/dist/cjs/b2b-button_2.cjs.entry.js +20 -25
- package/dist/cjs/b2b-card.cjs.entry.js +8 -8
- package/dist/cjs/b2b-checkbox-group.cjs.entry.js +15 -13
- package/dist/cjs/b2b-checkbox.cjs.entry.js +22 -19
- package/dist/cjs/b2b-chip-component_2.cjs.entry.js +24 -20
- package/dist/cjs/b2b-core-components.cjs.js +14 -13
- package/dist/cjs/b2b-date-picker-days_5.cjs.entry.js +50 -40
- package/dist/cjs/b2b-date-picker.cjs.entry.js +37 -36
- package/dist/cjs/b2b-dropdown.cjs.entry.js +26 -24
- package/dist/cjs/b2b-flyout-menu-option.cjs.entry.js +10 -8
- package/dist/cjs/b2b-flyout-menu.cjs.entry.js +9 -7
- package/dist/cjs/b2b-grid-col.cjs.entry.js +6 -4
- package/dist/cjs/b2b-grid-row.cjs.entry.js +5 -7
- package/dist/cjs/b2b-grid.cjs.entry.js +6 -4
- package/dist/cjs/b2b-headline.cjs.entry.js +5 -5
- package/dist/cjs/b2b-icon-100.cjs.entry.js +12 -12
- package/dist/cjs/b2b-icon-50.cjs.entry.js +10 -9
- package/dist/cjs/b2b-icon.cjs.entry.js +12 -12
- package/dist/cjs/b2b-input-group_2.cjs.entry.js +24 -24
- package/dist/cjs/b2b-input-label.cjs.entry.js +7 -6
- package/dist/cjs/b2b-input_2.cjs.entry.js +33 -33
- package/dist/cjs/b2b-label.cjs.entry.js +7 -5
- package/dist/cjs/b2b-modal.cjs.entry.js +16 -18
- package/dist/cjs/b2b-multiselect-dropdown.cjs.entry.js +27 -24
- package/dist/cjs/b2b-pagination.cjs.entry.js +12 -13
- package/dist/cjs/b2b-paragraph.cjs.entry.js +7 -10
- package/dist/cjs/b2b-progress-bar.cjs.entry.js +12 -9
- package/dist/cjs/b2b-radio-button.cjs.entry.js +19 -15
- package/dist/cjs/b2b-radio-group.cjs.entry.js +17 -13
- package/dist/cjs/b2b-required-separator.cjs.entry.js +6 -4
- package/dist/cjs/b2b-rounded-icon.cjs.entry.js +10 -12
- package/dist/cjs/b2b-scrollable-container.cjs.entry.js +6 -3
- package/dist/cjs/b2b-search.cjs.entry.js +10 -9
- package/dist/cjs/b2b-separator.cjs.entry.js +6 -4
- package/dist/cjs/b2b-shimmer.cjs.entry.js +9 -3
- package/dist/cjs/b2b-snackbar.cjs.entry.js +19 -18
- package/dist/cjs/b2b-tab-group.cjs.entry.js +6 -6
- package/dist/cjs/b2b-tab-panel.cjs.entry.js +6 -3
- package/dist/cjs/b2b-tab.cjs.entry.js +8 -8
- package/dist/cjs/b2b-table-cell_2.cjs.entry.js +30 -37
- package/dist/cjs/b2b-table-row.cjs.entry.js +19 -17
- package/dist/cjs/b2b-table-rowgroup.cjs.entry.js +16 -23
- package/dist/cjs/b2b-table.cjs.entry.js +10 -13
- package/dist/cjs/b2b-textarea.cjs.entry.js +23 -17
- package/dist/cjs/b2b-toggle-button.cjs.entry.js +14 -10
- package/dist/cjs/b2b-toggle-chip.cjs.entry.js +14 -10
- package/dist/cjs/b2b-toggle-group.cjs.entry.js +11 -7
- package/dist/cjs/b2b-toggle-switch.cjs.entry.js +15 -13
- package/dist/cjs/b2b-tooltip.cjs.entry.js +12 -11
- package/dist/cjs/b2b-wizard-icon.cjs.entry.js +9 -8
- package/dist/cjs/b2b-wizard-step.cjs.entry.js +8 -9
- package/dist/cjs/b2b-wizard.cjs.entry.js +10 -12
- package/dist/cjs/index-668808fd.js +2516 -0
- package/dist/cjs/loader.cjs.js +6 -3
- package/dist/cjs/{request-Dwsj-gbA.js → request-801c6ba1.js} +0 -2
- package/dist/cjs/{utils--ZrBSHVe.js → utils-499e9db5.js} +9 -2
- package/dist/collection/collection-manifest.json +2 -2
- package/dist/collection/components/alert/alert.e2e.js +67 -0
- package/dist/collection/components/alert/alert.js +12 -27
- package/dist/collection/components/anchor/anchor.js +9 -26
- package/dist/collection/components/anchor/anchor.spec.js +68 -0
- package/dist/collection/components/background-box/background-box.e2e.js +63 -0
- package/dist/collection/components/background-box/background-box.js +8 -26
- package/dist/collection/components/background-box/background-box.spec.js +64 -0
- package/dist/collection/components/breadcrumb/breadcrumb-item.js +7 -14
- package/dist/collection/components/breadcrumb/breadcrumb.e2e.js +50 -0
- package/dist/collection/components/breadcrumb/breadcrumb.js +6 -12
- package/dist/collection/components/button/button.e2e.js +80 -0
- package/dist/collection/components/button/button.js +23 -52
- package/dist/collection/components/card/card.e2e.js +110 -0
- package/dist/collection/components/card/card.js +5 -14
- package/dist/collection/components/card/card.spec.js +32 -0
- package/dist/collection/components/checkbox/checkbox.e2e.js +38 -0
- package/dist/collection/components/checkbox/checkbox.js +26 -50
- package/dist/collection/components/checkbox/checkbox.spec.js +45 -0
- package/dist/collection/components/checkbox-group/checkbox-group.e2e.js +83 -0
- package/dist/collection/components/checkbox-group/checkbox-group.js +16 -31
- package/dist/collection/components/checkbox-group/checkbox-group.spec.js +38 -0
- package/dist/collection/components/chip/chip.e2e.js +99 -0
- package/dist/collection/components/chip/chip.js +17 -30
- package/dist/collection/components/date-picker/date-picker-days-header.js +3 -6
- package/dist/collection/components/date-picker/date-picker-days.js +20 -44
- package/dist/collection/components/date-picker/date-picker-header.e2e.js +38 -0
- package/dist/collection/components/date-picker/date-picker-header.js +10 -15
- package/dist/collection/components/date-picker/date-picker-months.e2e.js +39 -0
- package/dist/collection/components/date-picker/date-picker-months.js +5 -9
- package/dist/collection/components/date-picker/date-picker-years.e2e.js +39 -0
- package/dist/collection/components/date-picker/date-picker-years.js +4 -5
- package/dist/collection/components/date-picker/date-picker.e2e.js +137 -0
- package/dist/collection/components/date-picker/date-picker.js +44 -76
- package/dist/collection/components/dropdown/dropdown.e2e.js +89 -0
- package/dist/collection/components/dropdown/dropdown.js +27 -46
- package/dist/collection/components/dropdown/dropdown.spec.js +52 -0
- package/dist/collection/components/flyout-menu/flyout-menu-option.js +7 -14
- package/dist/collection/components/flyout-menu/flyout-menu.e2e.js +97 -0
- package/dist/collection/components/flyout-menu/flyout-menu.js +5 -8
- package/dist/collection/components/grid/column.js +5 -9
- package/dist/collection/components/grid/grid.e2e.js +17 -0
- package/dist/collection/components/grid/grid.js +2 -5
- package/dist/collection/components/grid/row.js +6 -18
- package/dist/collection/components/headline/headline.e2e.js +13 -0
- package/dist/collection/components/headline/headline.js +3 -12
- package/dist/collection/components/headline/headline.spec.js +67 -0
- package/dist/collection/components/icon/icon.js +11 -24
- package/dist/collection/components/icon/icon.spec.js +21 -0
- package/dist/collection/components/icon-100/icon-100.e2e.js +40 -0
- package/dist/collection/components/icon-100/icon-100.js +11 -24
- package/dist/collection/components/icon-50/icon-50.e2e.js +32 -0
- package/dist/collection/components/icon-50/icon-50.js +8 -18
- package/dist/collection/components/input/input.e2e.js +84 -0
- package/dist/collection/components/input/input.js +33 -64
- package/dist/collection/components/input/input.spec.js +45 -0
- package/dist/collection/components/input-group/input-group.e2e.js +77 -0
- package/dist/collection/components/input-group/input-group.js +9 -17
- package/dist/collection/components/input-group/input-group.spec.js +56 -0
- package/dist/collection/components/input-label/input-label.e2e.js +10 -0
- package/dist/collection/components/input-label/input-label.js +4 -10
- package/dist/collection/components/input-list/input-list-option.js +3 -4
- package/dist/collection/components/input-list/input-list.e2e.js +242 -0
- package/dist/collection/components/input-list/input-list.js +17 -36
- package/dist/collection/components/label/label.e2e.js +17 -0
- package/dist/collection/components/label/label.js +3 -6
- package/dist/collection/components/label/label.spec.js +58 -0
- package/dist/collection/components/modal/modal.e2e.js +115 -0
- package/dist/collection/components/modal/modal.js +14 -29
- package/dist/collection/components/multiselect-dropdown/multiselect-dropdown.e2e.js +74 -0
- package/dist/collection/components/multiselect-dropdown/multiselect-dropdown.js +33 -57
- package/dist/collection/components/multiselect-dropdown/multiselect-option/multiselect-option.js +8 -15
- package/dist/collection/components/pagination/pagination.e2e.js +257 -0
- package/dist/collection/components/pagination/pagination.js +10 -22
- package/dist/collection/components/pagination/pagination.spec.js +103 -0
- package/dist/collection/components/paragraph/paragraph.e2e.js +13 -0
- package/dist/collection/components/paragraph/paragraph.js +8 -26
- package/dist/collection/components/progress-bar/progress-bar.e2e.js +43 -0
- package/dist/collection/components/progress-bar/progress-bar.js +11 -19
- package/dist/collection/components/radio/radio.e2e.js +45 -0
- package/dist/collection/components/radio/radio.js +20 -37
- package/dist/collection/components/radio/radio.spec.js +38 -0
- package/dist/collection/components/radio-group/radio-group.e2e.js +86 -0
- package/dist/collection/components/radio-group/radio-group.js +19 -34
- package/dist/collection/components/radio-group/radio-group.spec.js +31 -0
- package/dist/collection/components/required-separator/required-separator.e2e.js +17 -0
- package/dist/collection/components/required-separator/required-separator.js +2 -5
- package/dist/collection/components/rounded-icon/rounded-icon.js +8 -19
- package/dist/collection/components/scrollable-container/scrollable-container.js +1 -1
- package/dist/collection/components/search/search.e2e.js +98 -0
- package/dist/collection/components/search/search.js +9 -19
- package/dist/collection/components/separator/separator.e2e.js +22 -0
- package/dist/collection/components/separator/separator.js +2 -5
- package/dist/collection/components/shimmer/shimmer.e2e.js +18 -0
- package/dist/collection/components/shimmer/shimmer.js +9 -10
- package/dist/collection/components/shimmer/shimmer.spec.js +35 -0
- package/dist/collection/components/snackbar/snackbar.e2e.js +61 -0
- package/dist/collection/components/snackbar/snackbar.js +20 -38
- package/dist/collection/components/spinner/spinner.e2e.js +12 -0
- package/dist/collection/components/spinner/spinner.js +3 -9
- package/dist/collection/components/spinner/spinner.spec.js +41 -0
- package/dist/collection/components/tab/tab.e2e.js +35 -0
- package/dist/collection/components/tab/tab.js +5 -14
- package/dist/collection/components/tab/tab.spec.js +31 -0
- package/dist/collection/components/tab-group/tab-group.e2e.js +99 -0
- package/dist/collection/components/tab-group/tab-group.js +3 -7
- package/dist/collection/components/tab-panel/tab-panel.e2e.js +12 -0
- package/dist/collection/components/tab-panel/tab-panel.js +1 -1
- package/dist/collection/components/tab-panel/tab-panel.spec.js +10 -0
- package/dist/collection/components/table/table-cell/table-cell.js +17 -40
- package/dist/collection/components/table/table-header/table-header.js +19 -37
- package/dist/collection/components/table/table-row/table-row.js +18 -33
- package/dist/collection/components/table/table-rowgroup/table-rowgroup.js +15 -37
- package/dist/collection/components/table/table.e2e.js +405 -0
- package/dist/collection/components/table/table.js +4 -12
- package/dist/collection/components/textarea/textarea.e2e.js +91 -0
- package/dist/collection/components/textarea/textarea.js +30 -52
- package/dist/collection/components/toggle-button/toggle-button.e2e.js +44 -0
- package/dist/collection/components/toggle-button/toggle-button.js +13 -22
- package/dist/collection/components/toggle-chip/toggle-chip.e2e.js +47 -0
- package/dist/collection/components/toggle-chip/toggle-chip.js +13 -22
- package/dist/collection/components/toggle-group/toggle-group.e2e.js +65 -0
- package/dist/collection/components/toggle-group/toggle-group.js +7 -10
- package/dist/collection/components/toggle-switch/toggle-switch.e2e.js +50 -0
- package/dist/collection/components/toggle-switch/toggle-switch.js +14 -25
- package/dist/collection/components/tooltip/tooltip.e2e.js +64 -0
- package/dist/collection/components/tooltip/tooltip.js +11 -21
- package/dist/collection/components/wizard/wizard-step.js +5 -15
- package/dist/collection/components/wizard/wizard.e2e.js +149 -0
- package/dist/collection/components/wizard/wizard.js +7 -18
- package/dist/collection/components/wizard-icon/wizard-icon.js +6 -14
- package/dist/collection/docs/config/replace-prop-controls.spec.js +32 -0
- package/dist/collection/utils/utils.spec.js +15 -0
- package/dist/components/b2b-alert.js +13 -17
- package/dist/components/b2b-anchor.js +7 -11
- package/dist/components/b2b-background-box.js +6 -11
- package/dist/components/b2b-breadcrumb-item.js +9 -9
- package/dist/components/b2b-breadcrumb.js +9 -10
- package/dist/components/b2b-button.js +1 -1
- package/dist/components/b2b-card.js +7 -9
- package/dist/components/b2b-checkbox-group.js +15 -15
- package/dist/components/b2b-checkbox.js +1 -1
- package/dist/components/b2b-chip-component.js +1 -1
- package/dist/components/b2b-date-picker-days-header.js +1 -1
- package/dist/components/b2b-date-picker-days.js +1 -1
- package/dist/components/b2b-date-picker-header.js +1 -1
- package/dist/components/b2b-date-picker-months.js +1 -1
- package/dist/components/b2b-date-picker-years.js +1 -1
- package/dist/components/b2b-date-picker.js +43 -44
- package/dist/components/b2b-dropdown.js +26 -26
- package/dist/components/b2b-flyout-menu-option.js +9 -9
- package/dist/components/b2b-flyout-menu.js +8 -8
- package/dist/components/b2b-grid-col.js +5 -5
- package/dist/components/b2b-grid-row.js +4 -8
- package/dist/components/b2b-grid.js +5 -5
- package/dist/components/b2b-headline.js +1 -1
- package/dist/components/b2b-icon-100.js +1 -1
- package/dist/components/b2b-icon-50.js +13 -11
- package/dist/components/b2b-icon.js +16 -15
- package/dist/components/b2b-input-group.js +1 -1
- package/dist/components/b2b-input-label.js +1 -1
- package/dist/components/b2b-input-list-option.js +1 -1
- package/dist/components/b2b-input-list.js +1 -1
- package/dist/components/b2b-input.js +1 -1
- package/dist/components/b2b-label.js +6 -6
- package/dist/components/b2b-modal.js +17 -21
- package/dist/components/b2b-multiselect-dropdown.js +31 -30
- package/dist/components/b2b-multiselect-option.js +1 -1
- package/dist/components/b2b-pagination.js +13 -16
- package/dist/components/b2b-paragraph.js +6 -11
- package/dist/components/b2b-progress-bar.js +11 -10
- package/dist/components/b2b-radio-button.js +19 -17
- package/dist/components/b2b-radio-group.js +17 -15
- package/dist/components/b2b-required-separator.js +6 -6
- package/dist/components/b2b-rounded-icon.js +1 -1
- package/dist/components/b2b-scrollable-container.js +5 -4
- package/dist/components/b2b-search.js +18 -19
- package/dist/components/b2b-separator.js +1 -1
- package/dist/components/b2b-shimmer.js +8 -4
- package/dist/components/b2b-snackbar.js +19 -20
- package/dist/components/b2b-spinner.js +1 -1
- package/dist/components/b2b-tab-group.js +6 -8
- package/dist/components/b2b-tab-panel.js +5 -4
- package/dist/components/b2b-tab.js +7 -9
- package/dist/components/b2b-table-cell.js +1 -1
- package/dist/components/b2b-table-header.js +1 -1
- package/dist/components/b2b-table-row.js +23 -23
- package/dist/components/b2b-table-rowgroup.js +15 -24
- package/dist/components/b2b-table.js +9 -14
- package/dist/components/b2b-textarea.js +23 -19
- package/dist/components/b2b-toggle-button.js +13 -11
- package/dist/components/b2b-toggle-chip.js +13 -11
- package/dist/components/b2b-toggle-group.js +10 -8
- package/dist/components/b2b-toggle-switch.js +14 -14
- package/dist/components/b2b-tooltip.js +11 -12
- package/dist/components/b2b-wizard-icon.js +1 -1
- package/dist/components/b2b-wizard-step.js +10 -13
- package/dist/components/b2b-wizard.js +9 -13
- package/dist/components/{p-CE7t2D9r.js → button.js} +17 -23
- package/dist/components/{p-CLYM9t6v.js → checkbox.js} +22 -21
- package/dist/components/{p-ClL49BcQ.js → chip.js} +15 -13
- package/dist/components/{p-FI-HbnMh.js → date-picker-days-header.js} +7 -7
- package/dist/components/{p-0Vy4494O.js → date-picker-days.js} +24 -21
- package/dist/components/{p-C_U38W4s.js → date-picker-header.js} +17 -15
- package/dist/components/{p-1ZoTG5p9.js → date-picker-months.js} +9 -8
- package/dist/components/{p-dMZsx2Fh.js → date-picker-years.js} +8 -6
- package/dist/components/{p-Bo-B8kdb.js → headline.js} +4 -6
- package/dist/components/{p-B9RvgUY3.js → icon-100.js} +15 -14
- package/dist/components/index.js +1 -1929
- package/dist/components/{p-TB2jJFV6.js → input-group.js} +9 -8
- package/dist/components/{p-Zg4AtKjq.js → input-label.js} +6 -7
- package/dist/components/{p-QTGqu3he.js → input-list-option.js} +7 -5
- package/dist/components/{p-BacBJzW_.js → input-list.js} +21 -24
- package/dist/components/{p-CuUquHzL.js → input.js} +28 -32
- package/dist/components/{p-B7bjXySI.js → multiselect-option.js} +12 -12
- package/dist/{esm/request-B8W50WyB.js → components/request.js} +5 -2
- package/dist/components/{p-i758rnm2.js → rounded-icon.js} +9 -13
- package/dist/components/{p-DO7N8IC0.js → separator.js} +5 -5
- package/dist/components/{p-3cu_Madt.js → spinner.js} +5 -6
- package/dist/components/{p-9OQH2pET.js → table-cell.js} +15 -23
- package/dist/components/{p-BVLpVPNb.js → table-header.js} +17 -18
- package/dist/{esm/utils-BA6KE1BD.js → components/utils.js} +10 -3
- package/dist/components/{p-N6d2-6pL.js → wizard-icon.js} +10 -11
- package/dist/custom-elements.json +0 -24
- package/dist/esm/app-globals-0f993ce5.js +3 -0
- package/dist/esm/b2b-alert.entry.js +11 -15
- package/dist/esm/b2b-anchor.entry.js +6 -10
- package/dist/esm/b2b-background-box.entry.js +5 -10
- package/dist/esm/b2b-breadcrumb-item.entry.js +8 -8
- package/dist/esm/b2b-breadcrumb.entry.js +8 -9
- package/dist/esm/b2b-button_2.entry.js +18 -25
- package/dist/esm/b2b-card.entry.js +6 -8
- package/dist/esm/b2b-checkbox-group.entry.js +13 -13
- package/dist/esm/b2b-checkbox.entry.js +20 -19
- package/dist/esm/b2b-chip-component_2.entry.js +22 -20
- package/dist/esm/b2b-core-components.js +12 -12
- package/dist/esm/b2b-date-picker-days_5.entry.js +48 -40
- package/dist/esm/b2b-date-picker.entry.js +35 -36
- package/dist/esm/b2b-dropdown.entry.js +24 -24
- package/dist/esm/b2b-flyout-menu-option.entry.js +8 -8
- package/dist/esm/b2b-flyout-menu.entry.js +7 -7
- package/dist/esm/b2b-grid-col.entry.js +4 -4
- package/dist/esm/b2b-grid-row.entry.js +3 -7
- package/dist/esm/b2b-grid.entry.js +4 -4
- package/dist/esm/b2b-headline.entry.js +3 -5
- package/dist/esm/b2b-icon-100.entry.js +10 -12
- package/dist/esm/b2b-icon-50.entry.js +8 -9
- package/dist/esm/b2b-icon.entry.js +10 -12
- package/dist/esm/b2b-input-group_2.entry.js +22 -24
- package/dist/esm/b2b-input-label.entry.js +5 -6
- package/dist/esm/b2b-input_2.entry.js +31 -33
- package/dist/esm/b2b-label.entry.js +5 -5
- package/dist/esm/b2b-modal.entry.js +14 -18
- package/dist/esm/b2b-multiselect-dropdown.entry.js +25 -24
- package/dist/esm/b2b-pagination.entry.js +10 -13
- package/dist/esm/b2b-paragraph.entry.js +5 -10
- package/dist/esm/b2b-progress-bar.entry.js +10 -9
- package/dist/esm/b2b-radio-button.entry.js +17 -15
- package/dist/esm/b2b-radio-group.entry.js +15 -13
- package/dist/esm/b2b-required-separator.entry.js +4 -4
- package/dist/esm/b2b-rounded-icon.entry.js +8 -12
- package/dist/esm/b2b-scrollable-container.entry.js +4 -3
- package/dist/esm/b2b-search.entry.js +8 -9
- package/dist/esm/b2b-separator.entry.js +4 -4
- package/dist/esm/b2b-shimmer.entry.js +7 -3
- package/dist/esm/b2b-snackbar.entry.js +17 -18
- package/dist/esm/b2b-tab-group.entry.js +4 -6
- package/dist/esm/b2b-tab-panel.entry.js +4 -3
- package/dist/esm/b2b-tab.entry.js +6 -8
- package/dist/esm/b2b-table-cell_2.entry.js +28 -37
- package/dist/esm/b2b-table-row.entry.js +17 -17
- package/dist/esm/b2b-table-rowgroup.entry.js +14 -23
- package/dist/esm/b2b-table.entry.js +8 -13
- package/dist/esm/b2b-textarea.entry.js +21 -17
- package/dist/esm/b2b-toggle-button.entry.js +12 -10
- package/dist/esm/b2b-toggle-chip.entry.js +12 -10
- package/dist/esm/b2b-toggle-group.entry.js +9 -7
- package/dist/esm/b2b-toggle-switch.entry.js +13 -13
- package/dist/esm/b2b-tooltip.entry.js +10 -11
- package/dist/esm/b2b-wizard-icon.entry.js +7 -8
- package/dist/esm/b2b-wizard-step.entry.js +6 -9
- package/dist/esm/b2b-wizard.entry.js +8 -12
- package/dist/esm/index-ab9eb36d.js +2487 -0
- package/dist/esm/loader.js +4 -3
- package/dist/esm/polyfills/core-js.js +11 -0
- package/dist/esm/polyfills/dom.js +79 -0
- package/dist/esm/polyfills/es5-html-element.js +1 -0
- package/dist/esm/polyfills/index.js +34 -0
- package/dist/esm/polyfills/system.js +6 -0
- package/dist/{components/p-CPfvpKl5.js → esm/request-1d048f8a.js} +0 -2
- package/dist/{components/p-BA6KE1BD.js → esm/utils-868299de.js} +10 -3
- package/dist/loader/cdn.js +3 -1
- package/dist/loader/index.cjs.js +3 -1
- package/dist/loader/index.d.ts +0 -3
- package/dist/loader/index.es2017.js +3 -1
- package/dist/loader/index.js +3 -1
- package/dist/loader/package.json +11 -0
- package/dist/types/components.d.ts +0 -413
- package/dist/types/stencil-public-runtime.d.ts +11 -32
- package/dist/web-types.json +8 -7
- package/package.json +10 -11
- package/dist/b2b-core-components/p-0002d8d5.entry.js +0 -1
- package/dist/b2b-core-components/p-0386f660.entry.js +0 -1
- package/dist/b2b-core-components/p-0a08e2c8.entry.js +0 -1
- package/dist/b2b-core-components/p-0d8cc4eb.entry.js +0 -1
- package/dist/b2b-core-components/p-197dc9c0.entry.js +0 -1
- package/dist/b2b-core-components/p-220b8c79.entry.js +0 -1
- package/dist/b2b-core-components/p-2933f053.entry.js +0 -1
- package/dist/b2b-core-components/p-3a9f7db8.entry.js +0 -1
- package/dist/b2b-core-components/p-3e0919b3.entry.js +0 -1
- package/dist/b2b-core-components/p-42d9f79d.entry.js +0 -1
- package/dist/b2b-core-components/p-4bb42493.entry.js +0 -1
- package/dist/b2b-core-components/p-4c550170.entry.js +0 -1
- package/dist/b2b-core-components/p-50559efd.entry.js +0 -1
- package/dist/b2b-core-components/p-55db3d57.entry.js +0 -1
- package/dist/b2b-core-components/p-6e7abebc.entry.js +0 -1
- package/dist/b2b-core-components/p-7b75a0a4.entry.js +0 -1
- package/dist/b2b-core-components/p-7cbe33ef.entry.js +0 -1
- package/dist/b2b-core-components/p-8544b7e1.entry.js +0 -1
- package/dist/b2b-core-components/p-88037ad2.entry.js +0 -1
- package/dist/b2b-core-components/p-930425a1.entry.js +0 -1
- package/dist/b2b-core-components/p-B9l4NfeG.js +0 -1
- package/dist/b2b-core-components/p-BA6KE1BD.js +0 -1
- package/dist/b2b-core-components/p-a1a4efd4.entry.js +0 -1
- package/dist/b2b-core-components/p-a61eecf7.entry.js +0 -1
- package/dist/b2b-core-components/p-ada918c2.entry.js +0 -1
- package/dist/b2b-core-components/p-bb020c1c.entry.js +0 -1
- package/dist/b2b-core-components/p-bbb4c6f3.entry.js +0 -1
- package/dist/b2b-core-components/p-c0af184a.entry.js +0 -1
- package/dist/b2b-core-components/p-c40f7176.entry.js +0 -1
- package/dist/b2b-core-components/p-c6043d6a.entry.js +0 -1
- package/dist/b2b-core-components/p-c649c112.entry.js +0 -1
- package/dist/b2b-core-components/p-c69e9220.entry.js +0 -1
- package/dist/b2b-core-components/p-d1b46208.entry.js +0 -1
- package/dist/b2b-core-components/p-d2d40ae5.entry.js +0 -1
- package/dist/b2b-core-components/p-e8e156a4.entry.js +0 -1
- package/dist/b2b-core-components/p-ebcc2cce.entry.js +0 -1
- package/dist/b2b-core-components/p-edea84cc.entry.js +0 -1
- package/dist/b2b-core-components/p-f831e483.entry.js +0 -1
- package/dist/b2b-core-components/p-fdfb094e.entry.js +0 -1
- package/dist/b2b-core-components/p-zl-jO_Vq.js +0 -2
- package/dist/cjs/index-CIrNIFXs.js +0 -2406
- package/dist/esm/index-zl-jO_Vq.js +0 -2378
- /package/dist/b2b-core-components/{p-B8geQC3V.js → p-48608c23.js} +0 -0
- /package/dist/b2b-core-components/{p-BgHEmQ44.js → p-c500d93c.js} +0 -0
- /package/dist/cjs/{date-picker-util-VbL9p5ie.js → date-picker-util-51276571.js} +0 -0
- /package/dist/cjs/{wizard.types-uAv3s7tK.js → wizard.types-40a1058c.js} +0 -0
- /package/dist/components/{p-BsfreBZY.js → date-picker.types.js} +0 -0
- /package/dist/components/{p-BgHEmQ44.js → wizard.types.js} +0 -0
- /package/dist/esm/{date-picker-util-B8geQC3V.js → date-picker-util-44201ca6.js} +0 -0
- /package/dist/esm/{wizard.types-BgHEmQ44.js → wizard.types-40ae9b73.js} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as b,h as e,H as r,
|
|
1
|
+
import{r as b,h as e,H as r,g as o}from"./p-b6a753e8.js";import{W as i}from"./p-c500d93c.js";const s=class{constructor(e){b(this,e),this.MAX_STEP_AMOUNT=6,this.getChildSteps=()=>Array.from(this.host.querySelectorAll("b2b-wizard-step")),this.setStepsState=()=>{this.getChildSteps().map(((b,e)=>{b.state=this.getStepState(e+1),b.step=(e+1).toString(),b.checkIcon=this.checkIcon}))},this.getStepState=b=>{const e=Number(this.activeStep);return e==b?i.PENDING:b<e||0===e?i.COMPLETED:i.DEFAULT},this.activeStep="1",this.custom=!1,this.checkIcon=!0}componentWillLoad(){const b=this.getChildSteps();Number(this.activeStep)>b.length&&console.error("B2B WIZARD: Active step is higher than total steps."),b.length>this.MAX_STEP_AMOUNT&&console.warn(`B2B WIZARD: Please don't use more than ${this.MAX_STEP_AMOUNT} steps. If more needed get in touch with the B2B design team`)}componentWillRender(){this.custom||this.setStepsState()}render(){return e(r,{key:"82f36879396d38b9423200ba7a73601b327335b8"},e("div",{key:"83b2827e4c284420456b76c4b39c683851992731",class:"b2b_wizard"},e("slot",{key:"b88f8ab6a5831168bd5ab9b6f0e2c4cc9cabccec"})))}get host(){return o(this)}};s.style=':root,:host{--b2b-color-black-50:#333333;--b2b-color-black-100:#222222;--b2b-color-white-100:#FFFFFF;--b2b-color-grey-10:#F0F0F0;--b2b-color-grey-25:#F6F6F6;--b2b-color-grey-50:#EEEEEE;--b2b-color-grey-100:#E6E6E6;--b2b-color-grey-150:#D5D5D5;--b2b-color-grey-200:#C4C4C4;--b2b-color-grey-250:#B1B1B1;--b2b-color-grey-300:#9E9E9E;--b2b-color-grey-400:#777777;--b2b-color-red-50:#FFDDE3;--b2b-color-red-100:#D4021D;--b2b-color-red-150:#E6344B;--b2b-color-red-200:#BB0004;--b2b-color-red-250:#850012;--b2b-color-primary:#D4021D;--b2b-color-error-100:#E6344B;--b2b-color-warning-50:#FFD998;--b2b-color-warning-100:#FFB432;--b2b-color-success-50:#D6E0CC;--b2b-color-success-100:#326400;--b2b-color-info-50:#CCD6E0;--b2b-color-info-100:#003264;--b2b-color-hover-default:#E6F4FF;--b2b-color-hover-black:#3B3B3B;--b2b-color-background-overlay-transparent-80:#22222280;--b2b-color-background-overlay-transparent-40:#22222240;--b2b-color-table-selected-default:#CCE9FF;--b2b-color-table-expand-hover:#E6F4FF;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-font-weight-thin:100;--b2b-font-weight-normal:500;--b2b-font-weight-bold:700;--b2b-size-1:0.0625rem;--b2b-size-5:0.125rem;--b2b-size-7:0.1875rem;--b2b-size-10:0.25rem;--b2b-size-15:0.375rem;--b2b-size-20:0.5rem;--b2b-size-25:0.625rem;--b2b-size-30:0.75rem;--b2b-size-35:0.875rem;--b2b-size-40:1rem;--b2b-size-45:1.125rem;--b2b-size-50:1.25rem;--b2b-size-53:1.3125rem;--b2b-size-55:1.375rem;--b2b-size-60:1.5rem;--b2b-size-70:1.75rem;--b2b-size-80:2rem;--b2b-size-90:2.25rem;--b2b-size-100:2.5rem;--b2b-size-120:3rem;--b2b-size-140:3.5rem;--b2b-size-150:3.75rem;--b2b-size-160:4rem;--b2b-size-200:5rem;--b2b-color-error-50:var(--b2b-color-red-50);--b2b-color-background-page:var(--b2b-color-grey-10);--b2b-color-background-box:var(--b2b-color-white-100);--b2b-color-background-card:var(--b2b-color-white-100);--b2b-color-background-overlay:var(--b2b-color-black-100);--b2b-color-border-100:var(--b2b-color-grey-200);--b2b-color-copy-default:var(--b2b-color-black-100);--b2b-color-copy-secondary:var(--b2b-color-grey-400);--b2b-color-copy-inverted:var(--b2b-color-white-100);--b2b-color-copy-overlay:var(--b2b-color-white-100);--b2b-color-headline-title:var(--b2b-color-red-100);--b2b-color-headline-default:var(--b2b-color-black-100);--b2b-color-headline-inverted:var(--b2b-color-white-100);--b2b-color-icon-default:var(--b2b-color-black-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-inverted:var(--b2b-color-white-100);--b2b-color-table-expand-default:var(--b2b-color-grey-25);--b2b-size-icon-50:var(--b2b-size-40);--b2b-size-icon-100:var(--b2b-size-60);--b2b-size-icon-200:var(--b2b-size-80);--b2b-size-icon-400:var(--b2b-size-120);--b2b-size-space-25:var(--b2b-size-10);--b2b-size-space-50:var(--b2b-size-20);--b2b-size-space-75:var(--b2b-size-30);--b2b-size-space-100:var(--b2b-size-40);--b2b-size-space-150:var(--b2b-size-60);--b2b-size-space-175:var(--b2b-size-80);--b2b-size-space-200:var(--b2b-size-100);--b2b-size-space-250:var(--b2b-size-160);--b2b-size-space-300:var(--b2b-size-200);--b2b-size-padding-50:var(--b2b-size-20);--b2b-size-padding-100:var(--b2b-size-40);--b2b-size-padding-150:var(--b2b-size-60);--b2b-size-padding-175:var(--b2b-size-80);--b2b-size-border-width-50:var(--b2b-size-1);--b2b-size-border-width-100:var(--b2b-size-5);--b2b-size-border-width-150:var(--b2b-size-10);--b2b-size-border-radius-100:var(--b2b-size-7);--b2b-size-border-no-radius-left:0 var(--b2b-size-7) var(--b2b-size-7) 0;--b2b-size-border-no-radius-right:var(--b2b-size-7) 0 0 var(--b2b-size-7);--b2b-size-border-no-radius-top:0 0 var(--b2b-size-7) var(--b2b-size-7);--b2b-size-border-no-radius-bottom:var(--b2b-size-7) var(--b2b-size-7) 0 0;--b2b-size-copy-50:var(--b2b-size-30);--b2b-size-copy-100:var(--b2b-size-35);--b2b-size-copy-125:var(--b2b-size-40);--b2b-size-copy-200:var(--b2b-size-45);--b2b-size-copy-300:var(--b2b-size-60);--b2b-size-copy-line-height-50:var(--b2b-size-40);--b2b-size-copy-line-height-75:var(--b2b-size-45);--b2b-size-copy-line-height-100:var(--b2b-size-53);--b2b-size-copy-line-height-125:var(--b2b-size-60);--b2b-size-copy-line-height-200:var(--b2b-size-60);--b2b-size-copy-line-height-300:var(--b2b-size-90);--b2b-size-headline-100:var(--b2b-size-40);--b2b-size-headline-200:var(--b2b-size-45);--b2b-size-headline-400:var(--b2b-size-60);--b2b-size-headline-line-height-100:var(--b2b-size-60);--b2b-size-headline-line-height-200:var(--b2b-size-60);--b2b-size-headline-line-height-400:var(--b2b-size-60)}:root [data-theme="dark"]{--b2b-color-black-50:#333333;--b2b-color-black-100:#222222;--b2b-color-white-100:#FFFFFF;--b2b-color-grey-10:#F0F0F0;--b2b-color-grey-25:#F6F6F6;--b2b-color-grey-50:#EEEEEE;--b2b-color-grey-100:#E6E6E6;--b2b-color-grey-150:#D5D5D5;--b2b-color-grey-200:#C4C4C4;--b2b-color-grey-250:#B1B1B1;--b2b-color-grey-300:#9E9E9E;--b2b-color-grey-400:#777777;--b2b-color-red-50:#FFDDE3;--b2b-color-red-100:#D4021D;--b2b-color-red-150:#E6344B;--b2b-color-red-200:#BB0004;--b2b-color-red-250:#850012;--b2b-color-primary:#D4021D;--b2b-color-error-100:#E6344B;--b2b-color-warning-50:#FFD998;--b2b-color-warning-100:#FFB432;--b2b-color-success-50:#D6E0CC;--b2b-color-success-100:#326400;--b2b-color-info-50:#CCD6E0;--b2b-color-info-100:#003264;--b2b-color-hover-default:#E6F4FF;--b2b-color-hover-black:#3B3B3B;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-font-weight-thin:100;--b2b-font-weight-normal:500;--b2b-font-weight-bold:700;--b2b-size-1:0.0625rem;--b2b-size-5:0.125rem;--b2b-size-7:0.1875rem;--b2b-size-10:0.25rem;--b2b-size-15:0.375rem;--b2b-size-20:0.5rem;--b2b-size-25:0.625rem;--b2b-size-30:0.75rem;--b2b-size-35:0.875rem;--b2b-size-40:1rem;--b2b-size-45:1.125rem;--b2b-size-50:1.25rem;--b2b-size-53:1.3125rem;--b2b-size-55:1.375rem;--b2b-size-60:1.5rem;--b2b-size-70:1.75rem;--b2b-size-80:2rem;--b2b-size-90:2.25rem;--b2b-size-100:2.5rem;--b2b-size-120:3rem;--b2b-size-140:3.5rem;--b2b-size-150:3.75rem;--b2b-size-160:4rem;--b2b-size-200:5rem;--b2b-color-error-50:var(--b2b-color-red-50);--b2b-color-background-box:var(--b2b-color-black-50);--b2b-color-background-card:var(--b2b-color-black-50);--b2b-color-background-page:var(--b2b-color-grey-100);--b2b-color-border-100:var(--b2b-color-white-100);--b2b-color-copy-default:var(--b2b-color-white-100);--b2b-color-copy-secondary:var(--b2b-color-grey-100);--b2b-color-copy-inverted:var(--b2b-color-black-100);--b2b-color-headline-title:var(--b2b-color-red-50);--b2b-color-headline-default:var(--b2b-color-white-100);--b2b-color-headline-inverted:var(--b2b-color-black-100);--b2b-color-icon-default:var(--b2b-color-white-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-inverted:var(--b2b-color-black-100)}@font-face{font-family:OttoSans;src:url("https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans.ttf");font-weight:normal;font-style:normal}@font-face{font-family:OttoSans;src:url("https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.woff") format("woff"), url("https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.ttf") format("truetype");font-weight:bold;font-style:normal}@font-face{font-family:OttoSans;src:url("https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.woff") format("woff"), url("https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.ttf") format("truetype");font-weight:100;font-style:normal}@font-face{font-family:ObcIcons;src:url("https://pattern-library.portal.otto.market/static/assets/fonts/obc-icons.woff")}:host .b2b_wizard{display:flex;flex-wrap:wrap}.b2b_wizard__step{display:flex;align-items:center;gap:var(--b2b-size-space-50);padding:var(--b2b-size-space-50) 0}.b2b_wizard__step__label--default{color:var(--b2b-color-icon-secondary)}::slotted(b2b-wizard-step:not(:last-of-type)){display:flex;align-items:center}::slotted(b2b-wizard-step:not(:last-of-type))::after{content:" ";flex-grow:1;height:1px;min-width:var(--b2b-size-space-175);margin:0 var(--b2b-size-space-75) 0 var(--b2b-size-space-75);background:var(--b2b-color-icon-default)}';export{s as b2b_wizard}
|
|
@@ -1,23 +1,16 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
const index = require('./index-668808fd.js');
|
|
4
6
|
|
|
5
7
|
const alertCss = ":root,:host{--b2b-color-black-50:#333333;--b2b-color-black-100:#222222;--b2b-color-white-100:#FFFFFF;--b2b-color-grey-10:#F0F0F0;--b2b-color-grey-25:#F6F6F6;--b2b-color-grey-50:#EEEEEE;--b2b-color-grey-100:#E6E6E6;--b2b-color-grey-150:#D5D5D5;--b2b-color-grey-200:#C4C4C4;--b2b-color-grey-250:#B1B1B1;--b2b-color-grey-300:#9E9E9E;--b2b-color-grey-400:#777777;--b2b-color-red-50:#FFDDE3;--b2b-color-red-100:#D4021D;--b2b-color-red-150:#E6344B;--b2b-color-red-200:#BB0004;--b2b-color-red-250:#850012;--b2b-color-primary:#D4021D;--b2b-color-error-100:#E6344B;--b2b-color-warning-50:#FFD998;--b2b-color-warning-100:#FFB432;--b2b-color-success-50:#D6E0CC;--b2b-color-success-100:#326400;--b2b-color-info-50:#CCD6E0;--b2b-color-info-100:#003264;--b2b-color-hover-default:#E6F4FF;--b2b-color-hover-black:#3B3B3B;--b2b-color-background-overlay-transparent-80:#22222280;--b2b-color-background-overlay-transparent-40:#22222240;--b2b-color-table-selected-default:#CCE9FF;--b2b-color-table-expand-hover:#E6F4FF;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-font-weight-thin:100;--b2b-font-weight-normal:500;--b2b-font-weight-bold:700;--b2b-size-1:0.0625rem;--b2b-size-5:0.125rem;--b2b-size-7:0.1875rem;--b2b-size-10:0.25rem;--b2b-size-15:0.375rem;--b2b-size-20:0.5rem;--b2b-size-25:0.625rem;--b2b-size-30:0.75rem;--b2b-size-35:0.875rem;--b2b-size-40:1rem;--b2b-size-45:1.125rem;--b2b-size-50:1.25rem;--b2b-size-53:1.3125rem;--b2b-size-55:1.375rem;--b2b-size-60:1.5rem;--b2b-size-70:1.75rem;--b2b-size-80:2rem;--b2b-size-90:2.25rem;--b2b-size-100:2.5rem;--b2b-size-120:3rem;--b2b-size-140:3.5rem;--b2b-size-150:3.75rem;--b2b-size-160:4rem;--b2b-size-200:5rem;--b2b-color-error-50:var(--b2b-color-red-50);--b2b-color-background-page:var(--b2b-color-grey-10);--b2b-color-background-box:var(--b2b-color-white-100);--b2b-color-background-card:var(--b2b-color-white-100);--b2b-color-background-overlay:var(--b2b-color-black-100);--b2b-color-border-100:var(--b2b-color-grey-200);--b2b-color-copy-default:var(--b2b-color-black-100);--b2b-color-copy-secondary:var(--b2b-color-grey-400);--b2b-color-copy-inverted:var(--b2b-color-white-100);--b2b-color-copy-overlay:var(--b2b-color-white-100);--b2b-color-headline-title:var(--b2b-color-red-100);--b2b-color-headline-default:var(--b2b-color-black-100);--b2b-color-headline-inverted:var(--b2b-color-white-100);--b2b-color-icon-default:var(--b2b-color-black-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-inverted:var(--b2b-color-white-100);--b2b-color-table-expand-default:var(--b2b-color-grey-25);--b2b-size-icon-50:var(--b2b-size-40);--b2b-size-icon-100:var(--b2b-size-60);--b2b-size-icon-200:var(--b2b-size-80);--b2b-size-icon-400:var(--b2b-size-120);--b2b-size-space-25:var(--b2b-size-10);--b2b-size-space-50:var(--b2b-size-20);--b2b-size-space-75:var(--b2b-size-30);--b2b-size-space-100:var(--b2b-size-40);--b2b-size-space-150:var(--b2b-size-60);--b2b-size-space-175:var(--b2b-size-80);--b2b-size-space-200:var(--b2b-size-100);--b2b-size-space-250:var(--b2b-size-160);--b2b-size-space-300:var(--b2b-size-200);--b2b-size-padding-50:var(--b2b-size-20);--b2b-size-padding-100:var(--b2b-size-40);--b2b-size-padding-150:var(--b2b-size-60);--b2b-size-padding-175:var(--b2b-size-80);--b2b-size-border-width-50:var(--b2b-size-1);--b2b-size-border-width-100:var(--b2b-size-5);--b2b-size-border-width-150:var(--b2b-size-10);--b2b-size-border-radius-100:var(--b2b-size-7);--b2b-size-border-no-radius-left:0 var(--b2b-size-7) var(--b2b-size-7) 0;--b2b-size-border-no-radius-right:var(--b2b-size-7) 0 0 var(--b2b-size-7);--b2b-size-border-no-radius-top:0 0 var(--b2b-size-7) var(--b2b-size-7);--b2b-size-border-no-radius-bottom:var(--b2b-size-7) var(--b2b-size-7) 0 0;--b2b-size-copy-50:var(--b2b-size-30);--b2b-size-copy-100:var(--b2b-size-35);--b2b-size-copy-125:var(--b2b-size-40);--b2b-size-copy-200:var(--b2b-size-45);--b2b-size-copy-300:var(--b2b-size-60);--b2b-size-copy-line-height-50:var(--b2b-size-40);--b2b-size-copy-line-height-75:var(--b2b-size-45);--b2b-size-copy-line-height-100:var(--b2b-size-53);--b2b-size-copy-line-height-125:var(--b2b-size-60);--b2b-size-copy-line-height-200:var(--b2b-size-60);--b2b-size-copy-line-height-300:var(--b2b-size-90);--b2b-size-headline-100:var(--b2b-size-40);--b2b-size-headline-200:var(--b2b-size-45);--b2b-size-headline-400:var(--b2b-size-60);--b2b-size-headline-line-height-100:var(--b2b-size-60);--b2b-size-headline-line-height-200:var(--b2b-size-60);--b2b-size-headline-line-height-400:var(--b2b-size-60)}:root [data-theme=\"dark\"]{--b2b-color-black-50:#333333;--b2b-color-black-100:#222222;--b2b-color-white-100:#FFFFFF;--b2b-color-grey-10:#F0F0F0;--b2b-color-grey-25:#F6F6F6;--b2b-color-grey-50:#EEEEEE;--b2b-color-grey-100:#E6E6E6;--b2b-color-grey-150:#D5D5D5;--b2b-color-grey-200:#C4C4C4;--b2b-color-grey-250:#B1B1B1;--b2b-color-grey-300:#9E9E9E;--b2b-color-grey-400:#777777;--b2b-color-red-50:#FFDDE3;--b2b-color-red-100:#D4021D;--b2b-color-red-150:#E6344B;--b2b-color-red-200:#BB0004;--b2b-color-red-250:#850012;--b2b-color-primary:#D4021D;--b2b-color-error-100:#E6344B;--b2b-color-warning-50:#FFD998;--b2b-color-warning-100:#FFB432;--b2b-color-success-50:#D6E0CC;--b2b-color-success-100:#326400;--b2b-color-info-50:#CCD6E0;--b2b-color-info-100:#003264;--b2b-color-hover-default:#E6F4FF;--b2b-color-hover-black:#3B3B3B;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-font-weight-thin:100;--b2b-font-weight-normal:500;--b2b-font-weight-bold:700;--b2b-size-1:0.0625rem;--b2b-size-5:0.125rem;--b2b-size-7:0.1875rem;--b2b-size-10:0.25rem;--b2b-size-15:0.375rem;--b2b-size-20:0.5rem;--b2b-size-25:0.625rem;--b2b-size-30:0.75rem;--b2b-size-35:0.875rem;--b2b-size-40:1rem;--b2b-size-45:1.125rem;--b2b-size-50:1.25rem;--b2b-size-53:1.3125rem;--b2b-size-55:1.375rem;--b2b-size-60:1.5rem;--b2b-size-70:1.75rem;--b2b-size-80:2rem;--b2b-size-90:2.25rem;--b2b-size-100:2.5rem;--b2b-size-120:3rem;--b2b-size-140:3.5rem;--b2b-size-150:3.75rem;--b2b-size-160:4rem;--b2b-size-200:5rem;--b2b-color-error-50:var(--b2b-color-red-50);--b2b-color-background-box:var(--b2b-color-black-50);--b2b-color-background-card:var(--b2b-color-black-50);--b2b-color-background-page:var(--b2b-color-grey-100);--b2b-color-border-100:var(--b2b-color-white-100);--b2b-color-copy-default:var(--b2b-color-white-100);--b2b-color-copy-secondary:var(--b2b-color-grey-100);--b2b-color-copy-inverted:var(--b2b-color-black-100);--b2b-color-headline-title:var(--b2b-color-red-50);--b2b-color-headline-default:var(--b2b-color-white-100);--b2b-color-headline-inverted:var(--b2b-color-black-100);--b2b-color-icon-default:var(--b2b-color-white-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-inverted:var(--b2b-color-black-100)}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans.ttf\");font-weight:normal;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.ttf\") format(\"truetype\");font-weight:bold;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.ttf\") format(\"truetype\");font-weight:100;font-style:normal}@font-face{font-family:ObcIcons;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/obc-icons.woff\")}.b2b-alert{display:none;padding:var(--b2b-size-30);gap:var(--b2b-size-30);font-family:var(--b2b-font-family-default);font-size:var(--b2b-size-copy-100);line-height:var(--b2b-size-copy-line-height-100);flex-shrink:0;border-radius:var(--b2b-size-7)}.b2b-alert--info{background-color:var(--b2b-color-info-50)}.b2b-alert--info__icon{color:var(--b2b-color-info-100)}.b2b-alert--warning{background-color:var(--b2b-color-warning-50)}.b2b-alert--error{color:var(--b2b-color-error-100);background-color:var(--b2b-color-error-50)}.b2b-alert--success{background-color:var(--b2b-color-success-50)}.b2b-alert--success__icon{color:var(--b2b-color-success-100)}.b2b-alert__close-icon{padding-top:var(--b2b-size-7);width:var(--b2b-size-30);height:var(--b2b-size-35);cursor:pointer;fill:var(--b2b-color-grey-400);flex-shrink:0}.b2b-alert__content{display:flex;align-items:baseline;flex:2;gap:var(--b2b-size-30)}.b2b-alert__content p{width:100%;margin:0;padding:var(--b2b-size-5) 0 var(--b2b-size-1) 0}.b2b-alert--open{display:flex}.b2b-alert--small{width:fit-content;justify-content:center;padding:var(--b2b-size-7);display:inline-flex}.b2b-alert--large{width:inherit;justify-content:space-between}";
|
|
8
|
+
const B2bAlertStyle0 = alertCss;
|
|
6
9
|
|
|
7
10
|
const AlertComponent = class {
|
|
8
11
|
constructor(hostRef) {
|
|
9
12
|
index.registerInstance(this, hostRef);
|
|
10
|
-
this.b2bClose = index.createEvent(this, "b2b-close");
|
|
11
|
-
/** The type of alert. Per default it is info. */
|
|
12
|
-
this.type = 'info';
|
|
13
|
-
/** The size of the alert. Per default it is large. If set to small, the alert will only have an icon. */
|
|
14
|
-
this.size = 'large';
|
|
15
|
-
/** Whether the alert is currently open. Set to true to display the alert. */
|
|
16
|
-
this.opened = false;
|
|
17
|
-
/** Whether or not the alert has a close button. Per default it is true. Note that errors and small alerts cannot be closed. */
|
|
18
|
-
this.hasCloseButton = true;
|
|
19
|
-
/** Whether or not you want to use a custom icon. Per default, it is false. */
|
|
20
|
-
this.customIcon = false;
|
|
13
|
+
this.b2bClose = index.createEvent(this, "b2b-close", 7);
|
|
21
14
|
this.chooseIcon = () => {
|
|
22
15
|
const iconName = `b2b_icon-${this.type}`;
|
|
23
16
|
return index.h("b2b-icon-100", { icon: iconName });
|
|
@@ -32,6 +25,11 @@ const AlertComponent = class {
|
|
|
32
25
|
this.canCustomizeIcon = () => {
|
|
33
26
|
return this.size === 'small' && this.customIcon;
|
|
34
27
|
};
|
|
28
|
+
this.type = 'info';
|
|
29
|
+
this.size = 'large';
|
|
30
|
+
this.opened = false;
|
|
31
|
+
this.hasCloseButton = true;
|
|
32
|
+
this.customIcon = false;
|
|
35
33
|
}
|
|
36
34
|
openedChanged(newValue) {
|
|
37
35
|
this.opened = newValue;
|
|
@@ -42,14 +40,14 @@ const AlertComponent = class {
|
|
|
42
40
|
[`b2b-alert--${this.type}`]: true,
|
|
43
41
|
[`b2b-alert--${this.size}`]: true,
|
|
44
42
|
'b2b-alert--open': this.opened,
|
|
45
|
-
} }, index.h("div", { key: '4ea003fcc0fa7e3d88f15709c4919496a6ba20c9', class: "b2b-alert__content" }, index.h("span", { key: 'f5ef1818b868f8f3c14ebac0102559350d1d412d', class: { [`b2b-alert--${this.type}__icon`]: true } }, this.canCustomizeIcon() ? index.h("slot", null) : this.chooseIcon()), this.size === 'large' && (index.h("p",
|
|
43
|
+
} }, index.h("div", { key: '4ea003fcc0fa7e3d88f15709c4919496a6ba20c9', class: "b2b-alert__content" }, index.h("span", { key: 'f5ef1818b868f8f3c14ebac0102559350d1d412d', class: { [`b2b-alert--${this.type}__icon`]: true } }, this.canCustomizeIcon() ? index.h("slot", null) : this.chooseIcon()), this.size === 'large' && (index.h("p", null, index.h("slot", null)))), this.canClose() && (
|
|
46
44
|
//using a custom icon as this component needs an icon size that is not supported in the icon component
|
|
47
|
-
index.h("div", {
|
|
45
|
+
index.h("div", { class: "b2b-alert__close-icon", onClick: this.close }, index.h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 32 32" }, index.h("path", { d: "M17.886 16l8.057-8.057a1.333 1.333 0 1 0-1.885-1.886l-8.057 8.057-8.057-8.057a1.333 1.333 0 1 0-1.886 1.886L14.115 16l-8.057 8.057a1.332 1.332 0 1 0 1.886 1.885l8.057-8.057 8.057 8.057a1.331 1.331 0 0 0 1.886 0 1.332 1.332 0 0 0 0-1.885L17.887 16z" })))))));
|
|
48
46
|
}
|
|
49
47
|
static get watchers() { return {
|
|
50
48
|
"opened": ["openedChanged"]
|
|
51
49
|
}; }
|
|
52
50
|
};
|
|
53
|
-
AlertComponent.style =
|
|
51
|
+
AlertComponent.style = B2bAlertStyle0;
|
|
54
52
|
|
|
55
53
|
exports.b2b_alert = AlertComponent;
|
|
@@ -1,33 +1,31 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
const index = require('./index-668808fd.js');
|
|
4
6
|
|
|
5
7
|
const anchorCss = ":root,:host{--b2b-color-black-50:#333333;--b2b-color-black-100:#222222;--b2b-color-white-100:#FFFFFF;--b2b-color-grey-10:#F0F0F0;--b2b-color-grey-25:#F6F6F6;--b2b-color-grey-50:#EEEEEE;--b2b-color-grey-100:#E6E6E6;--b2b-color-grey-150:#D5D5D5;--b2b-color-grey-200:#C4C4C4;--b2b-color-grey-250:#B1B1B1;--b2b-color-grey-300:#9E9E9E;--b2b-color-grey-400:#777777;--b2b-color-red-50:#FFDDE3;--b2b-color-red-100:#D4021D;--b2b-color-red-150:#E6344B;--b2b-color-red-200:#BB0004;--b2b-color-red-250:#850012;--b2b-color-primary:#D4021D;--b2b-color-error-100:#E6344B;--b2b-color-warning-50:#FFD998;--b2b-color-warning-100:#FFB432;--b2b-color-success-50:#D6E0CC;--b2b-color-success-100:#326400;--b2b-color-info-50:#CCD6E0;--b2b-color-info-100:#003264;--b2b-color-hover-default:#E6F4FF;--b2b-color-hover-black:#3B3B3B;--b2b-color-background-overlay-transparent-80:#22222280;--b2b-color-background-overlay-transparent-40:#22222240;--b2b-color-table-selected-default:#CCE9FF;--b2b-color-table-expand-hover:#E6F4FF;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-font-weight-thin:100;--b2b-font-weight-normal:500;--b2b-font-weight-bold:700;--b2b-size-1:0.0625rem;--b2b-size-5:0.125rem;--b2b-size-7:0.1875rem;--b2b-size-10:0.25rem;--b2b-size-15:0.375rem;--b2b-size-20:0.5rem;--b2b-size-25:0.625rem;--b2b-size-30:0.75rem;--b2b-size-35:0.875rem;--b2b-size-40:1rem;--b2b-size-45:1.125rem;--b2b-size-50:1.25rem;--b2b-size-53:1.3125rem;--b2b-size-55:1.375rem;--b2b-size-60:1.5rem;--b2b-size-70:1.75rem;--b2b-size-80:2rem;--b2b-size-90:2.25rem;--b2b-size-100:2.5rem;--b2b-size-120:3rem;--b2b-size-140:3.5rem;--b2b-size-150:3.75rem;--b2b-size-160:4rem;--b2b-size-200:5rem;--b2b-color-error-50:var(--b2b-color-red-50);--b2b-color-background-page:var(--b2b-color-grey-10);--b2b-color-background-box:var(--b2b-color-white-100);--b2b-color-background-card:var(--b2b-color-white-100);--b2b-color-background-overlay:var(--b2b-color-black-100);--b2b-color-border-100:var(--b2b-color-grey-200);--b2b-color-copy-default:var(--b2b-color-black-100);--b2b-color-copy-secondary:var(--b2b-color-grey-400);--b2b-color-copy-inverted:var(--b2b-color-white-100);--b2b-color-copy-overlay:var(--b2b-color-white-100);--b2b-color-headline-title:var(--b2b-color-red-100);--b2b-color-headline-default:var(--b2b-color-black-100);--b2b-color-headline-inverted:var(--b2b-color-white-100);--b2b-color-icon-default:var(--b2b-color-black-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-inverted:var(--b2b-color-white-100);--b2b-color-table-expand-default:var(--b2b-color-grey-25);--b2b-size-icon-50:var(--b2b-size-40);--b2b-size-icon-100:var(--b2b-size-60);--b2b-size-icon-200:var(--b2b-size-80);--b2b-size-icon-400:var(--b2b-size-120);--b2b-size-space-25:var(--b2b-size-10);--b2b-size-space-50:var(--b2b-size-20);--b2b-size-space-75:var(--b2b-size-30);--b2b-size-space-100:var(--b2b-size-40);--b2b-size-space-150:var(--b2b-size-60);--b2b-size-space-175:var(--b2b-size-80);--b2b-size-space-200:var(--b2b-size-100);--b2b-size-space-250:var(--b2b-size-160);--b2b-size-space-300:var(--b2b-size-200);--b2b-size-padding-50:var(--b2b-size-20);--b2b-size-padding-100:var(--b2b-size-40);--b2b-size-padding-150:var(--b2b-size-60);--b2b-size-padding-175:var(--b2b-size-80);--b2b-size-border-width-50:var(--b2b-size-1);--b2b-size-border-width-100:var(--b2b-size-5);--b2b-size-border-width-150:var(--b2b-size-10);--b2b-size-border-radius-100:var(--b2b-size-7);--b2b-size-border-no-radius-left:0 var(--b2b-size-7) var(--b2b-size-7) 0;--b2b-size-border-no-radius-right:var(--b2b-size-7) 0 0 var(--b2b-size-7);--b2b-size-border-no-radius-top:0 0 var(--b2b-size-7) var(--b2b-size-7);--b2b-size-border-no-radius-bottom:var(--b2b-size-7) var(--b2b-size-7) 0 0;--b2b-size-copy-50:var(--b2b-size-30);--b2b-size-copy-100:var(--b2b-size-35);--b2b-size-copy-125:var(--b2b-size-40);--b2b-size-copy-200:var(--b2b-size-45);--b2b-size-copy-300:var(--b2b-size-60);--b2b-size-copy-line-height-50:var(--b2b-size-40);--b2b-size-copy-line-height-75:var(--b2b-size-45);--b2b-size-copy-line-height-100:var(--b2b-size-53);--b2b-size-copy-line-height-125:var(--b2b-size-60);--b2b-size-copy-line-height-200:var(--b2b-size-60);--b2b-size-copy-line-height-300:var(--b2b-size-90);--b2b-size-headline-100:var(--b2b-size-40);--b2b-size-headline-200:var(--b2b-size-45);--b2b-size-headline-400:var(--b2b-size-60);--b2b-size-headline-line-height-100:var(--b2b-size-60);--b2b-size-headline-line-height-200:var(--b2b-size-60);--b2b-size-headline-line-height-400:var(--b2b-size-60)}:root [data-theme=\"dark\"]{--b2b-color-black-50:#333333;--b2b-color-black-100:#222222;--b2b-color-white-100:#FFFFFF;--b2b-color-grey-10:#F0F0F0;--b2b-color-grey-25:#F6F6F6;--b2b-color-grey-50:#EEEEEE;--b2b-color-grey-100:#E6E6E6;--b2b-color-grey-150:#D5D5D5;--b2b-color-grey-200:#C4C4C4;--b2b-color-grey-250:#B1B1B1;--b2b-color-grey-300:#9E9E9E;--b2b-color-grey-400:#777777;--b2b-color-red-50:#FFDDE3;--b2b-color-red-100:#D4021D;--b2b-color-red-150:#E6344B;--b2b-color-red-200:#BB0004;--b2b-color-red-250:#850012;--b2b-color-primary:#D4021D;--b2b-color-error-100:#E6344B;--b2b-color-warning-50:#FFD998;--b2b-color-warning-100:#FFB432;--b2b-color-success-50:#D6E0CC;--b2b-color-success-100:#326400;--b2b-color-info-50:#CCD6E0;--b2b-color-info-100:#003264;--b2b-color-hover-default:#E6F4FF;--b2b-color-hover-black:#3B3B3B;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-font-weight-thin:100;--b2b-font-weight-normal:500;--b2b-font-weight-bold:700;--b2b-size-1:0.0625rem;--b2b-size-5:0.125rem;--b2b-size-7:0.1875rem;--b2b-size-10:0.25rem;--b2b-size-15:0.375rem;--b2b-size-20:0.5rem;--b2b-size-25:0.625rem;--b2b-size-30:0.75rem;--b2b-size-35:0.875rem;--b2b-size-40:1rem;--b2b-size-45:1.125rem;--b2b-size-50:1.25rem;--b2b-size-53:1.3125rem;--b2b-size-55:1.375rem;--b2b-size-60:1.5rem;--b2b-size-70:1.75rem;--b2b-size-80:2rem;--b2b-size-90:2.25rem;--b2b-size-100:2.5rem;--b2b-size-120:3rem;--b2b-size-140:3.5rem;--b2b-size-150:3.75rem;--b2b-size-160:4rem;--b2b-size-200:5rem;--b2b-color-error-50:var(--b2b-color-red-50);--b2b-color-background-box:var(--b2b-color-black-50);--b2b-color-background-card:var(--b2b-color-black-50);--b2b-color-background-page:var(--b2b-color-grey-100);--b2b-color-border-100:var(--b2b-color-white-100);--b2b-color-copy-default:var(--b2b-color-white-100);--b2b-color-copy-secondary:var(--b2b-color-grey-100);--b2b-color-copy-inverted:var(--b2b-color-black-100);--b2b-color-headline-title:var(--b2b-color-red-50);--b2b-color-headline-default:var(--b2b-color-white-100);--b2b-color-headline-inverted:var(--b2b-color-black-100);--b2b-color-icon-default:var(--b2b-color-white-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-inverted:var(--b2b-color-black-100)}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans.ttf\");font-weight:normal;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.ttf\") format(\"truetype\");font-weight:bold;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.ttf\") format(\"truetype\");font-weight:100;font-style:normal}@font-face{font-family:ObcIcons;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/obc-icons.woff\")}:host{z-index:0;width:fit-content;height:fit-content;position:relative}:host .b2b-anchor{font-family:var(--b2b-font-family-default);color:var(--b2b-color-copy-default);transition:all 0.3s ease;z-index:1001;position:relative}:host .b2b-anchor--100{font-size:var(--b2b-size-copy-100)}:host .b2b-anchor--inherit{font-size:inherit}:host .b2b-anchor-hover--default:hover{color:var(--b2b-color-red-100);cursor:pointer}:host .b2b-anchor-hover--inherit:hover{color:inherit;cursor:pointer}:host .b2b-anchor--underline-text{text-decoration:underline}:host .b2b-anchor:not(.b2b-anchor--underline-text){text-decoration:none}";
|
|
8
|
+
const B2bAnchorStyle0 = anchorCss;
|
|
6
9
|
|
|
7
10
|
const AnchorComponent = class {
|
|
8
11
|
constructor(hostRef) {
|
|
9
12
|
index.registerInstance(this, hostRef);
|
|
10
|
-
|
|
11
|
-
* defaults to the URL string, but can be changed by the user. */
|
|
13
|
+
this.href = undefined;
|
|
12
14
|
this.download = null;
|
|
13
|
-
/** The target the URL will be opened into. The default is self. */
|
|
14
15
|
this.target = 'self';
|
|
15
|
-
/** The size of the link. Per default, it is inherited from the parent element. If specified to 100, the font size is 14px. */
|
|
16
16
|
this.size = 'inherit';
|
|
17
|
-
/** The hoverColor of the link. Per default, it is set to b2b-color-red-100. If specified as inherit, it is inherited from the parent element. */
|
|
18
17
|
this.hoverColor = 'default';
|
|
19
|
-
/** The underlineText of the link. If set to false, the link text will not be underlined. */
|
|
20
18
|
this.underlineText = true;
|
|
21
19
|
}
|
|
22
20
|
render() {
|
|
23
|
-
return (index.h(index.Host, { key: '
|
|
21
|
+
return (index.h(index.Host, { key: '60d94771fa6bf9cf9d8e688ecd7eba179a8e28a3' }, index.h("a", { key: 'f18239735b64a33cf80167e98a8cec01c0b42fb3', href: this.href, download: this.download, target: `_${this.target}`, class: {
|
|
24
22
|
'b2b-anchor': true,
|
|
25
23
|
[`b2b-anchor--${this.size}`]: true,
|
|
26
24
|
[`b2b-anchor-hover--${this.hoverColor}`]: true,
|
|
27
25
|
'b2b-anchor--underline-text': this.underlineText,
|
|
28
|
-
} }, index.h("slot", { key: '
|
|
26
|
+
} }, index.h("slot", { key: '9bc35228a2265b620e8e32adf9ea8040cf259192' }))));
|
|
29
27
|
}
|
|
30
28
|
};
|
|
31
|
-
AnchorComponent.style =
|
|
29
|
+
AnchorComponent.style = B2bAnchorStyle0;
|
|
32
30
|
|
|
33
31
|
exports.b2b_anchor = AnchorComponent;
|
|
@@ -1,27 +1,24 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
const index = require('./index-668808fd.js');
|
|
4
6
|
|
|
5
7
|
const backgroundBoxCss = ":root,:host{--b2b-color-black-50:#333333;--b2b-color-black-100:#222222;--b2b-color-white-100:#FFFFFF;--b2b-color-grey-10:#F0F0F0;--b2b-color-grey-25:#F6F6F6;--b2b-color-grey-50:#EEEEEE;--b2b-color-grey-100:#E6E6E6;--b2b-color-grey-150:#D5D5D5;--b2b-color-grey-200:#C4C4C4;--b2b-color-grey-250:#B1B1B1;--b2b-color-grey-300:#9E9E9E;--b2b-color-grey-400:#777777;--b2b-color-red-50:#FFDDE3;--b2b-color-red-100:#D4021D;--b2b-color-red-150:#E6344B;--b2b-color-red-200:#BB0004;--b2b-color-red-250:#850012;--b2b-color-primary:#D4021D;--b2b-color-error-100:#E6344B;--b2b-color-warning-50:#FFD998;--b2b-color-warning-100:#FFB432;--b2b-color-success-50:#D6E0CC;--b2b-color-success-100:#326400;--b2b-color-info-50:#CCD6E0;--b2b-color-info-100:#003264;--b2b-color-hover-default:#E6F4FF;--b2b-color-hover-black:#3B3B3B;--b2b-color-background-overlay-transparent-80:#22222280;--b2b-color-background-overlay-transparent-40:#22222240;--b2b-color-table-selected-default:#CCE9FF;--b2b-color-table-expand-hover:#E6F4FF;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-font-weight-thin:100;--b2b-font-weight-normal:500;--b2b-font-weight-bold:700;--b2b-size-1:0.0625rem;--b2b-size-5:0.125rem;--b2b-size-7:0.1875rem;--b2b-size-10:0.25rem;--b2b-size-15:0.375rem;--b2b-size-20:0.5rem;--b2b-size-25:0.625rem;--b2b-size-30:0.75rem;--b2b-size-35:0.875rem;--b2b-size-40:1rem;--b2b-size-45:1.125rem;--b2b-size-50:1.25rem;--b2b-size-53:1.3125rem;--b2b-size-55:1.375rem;--b2b-size-60:1.5rem;--b2b-size-70:1.75rem;--b2b-size-80:2rem;--b2b-size-90:2.25rem;--b2b-size-100:2.5rem;--b2b-size-120:3rem;--b2b-size-140:3.5rem;--b2b-size-150:3.75rem;--b2b-size-160:4rem;--b2b-size-200:5rem;--b2b-color-error-50:var(--b2b-color-red-50);--b2b-color-background-page:var(--b2b-color-grey-10);--b2b-color-background-box:var(--b2b-color-white-100);--b2b-color-background-card:var(--b2b-color-white-100);--b2b-color-background-overlay:var(--b2b-color-black-100);--b2b-color-border-100:var(--b2b-color-grey-200);--b2b-color-copy-default:var(--b2b-color-black-100);--b2b-color-copy-secondary:var(--b2b-color-grey-400);--b2b-color-copy-inverted:var(--b2b-color-white-100);--b2b-color-copy-overlay:var(--b2b-color-white-100);--b2b-color-headline-title:var(--b2b-color-red-100);--b2b-color-headline-default:var(--b2b-color-black-100);--b2b-color-headline-inverted:var(--b2b-color-white-100);--b2b-color-icon-default:var(--b2b-color-black-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-inverted:var(--b2b-color-white-100);--b2b-color-table-expand-default:var(--b2b-color-grey-25);--b2b-size-icon-50:var(--b2b-size-40);--b2b-size-icon-100:var(--b2b-size-60);--b2b-size-icon-200:var(--b2b-size-80);--b2b-size-icon-400:var(--b2b-size-120);--b2b-size-space-25:var(--b2b-size-10);--b2b-size-space-50:var(--b2b-size-20);--b2b-size-space-75:var(--b2b-size-30);--b2b-size-space-100:var(--b2b-size-40);--b2b-size-space-150:var(--b2b-size-60);--b2b-size-space-175:var(--b2b-size-80);--b2b-size-space-200:var(--b2b-size-100);--b2b-size-space-250:var(--b2b-size-160);--b2b-size-space-300:var(--b2b-size-200);--b2b-size-padding-50:var(--b2b-size-20);--b2b-size-padding-100:var(--b2b-size-40);--b2b-size-padding-150:var(--b2b-size-60);--b2b-size-padding-175:var(--b2b-size-80);--b2b-size-border-width-50:var(--b2b-size-1);--b2b-size-border-width-100:var(--b2b-size-5);--b2b-size-border-width-150:var(--b2b-size-10);--b2b-size-border-radius-100:var(--b2b-size-7);--b2b-size-border-no-radius-left:0 var(--b2b-size-7) var(--b2b-size-7) 0;--b2b-size-border-no-radius-right:var(--b2b-size-7) 0 0 var(--b2b-size-7);--b2b-size-border-no-radius-top:0 0 var(--b2b-size-7) var(--b2b-size-7);--b2b-size-border-no-radius-bottom:var(--b2b-size-7) var(--b2b-size-7) 0 0;--b2b-size-copy-50:var(--b2b-size-30);--b2b-size-copy-100:var(--b2b-size-35);--b2b-size-copy-125:var(--b2b-size-40);--b2b-size-copy-200:var(--b2b-size-45);--b2b-size-copy-300:var(--b2b-size-60);--b2b-size-copy-line-height-50:var(--b2b-size-40);--b2b-size-copy-line-height-75:var(--b2b-size-45);--b2b-size-copy-line-height-100:var(--b2b-size-53);--b2b-size-copy-line-height-125:var(--b2b-size-60);--b2b-size-copy-line-height-200:var(--b2b-size-60);--b2b-size-copy-line-height-300:var(--b2b-size-90);--b2b-size-headline-100:var(--b2b-size-40);--b2b-size-headline-200:var(--b2b-size-45);--b2b-size-headline-400:var(--b2b-size-60);--b2b-size-headline-line-height-100:var(--b2b-size-60);--b2b-size-headline-line-height-200:var(--b2b-size-60);--b2b-size-headline-line-height-400:var(--b2b-size-60)}:root [data-theme=\"dark\"]{--b2b-color-black-50:#333333;--b2b-color-black-100:#222222;--b2b-color-white-100:#FFFFFF;--b2b-color-grey-10:#F0F0F0;--b2b-color-grey-25:#F6F6F6;--b2b-color-grey-50:#EEEEEE;--b2b-color-grey-100:#E6E6E6;--b2b-color-grey-150:#D5D5D5;--b2b-color-grey-200:#C4C4C4;--b2b-color-grey-250:#B1B1B1;--b2b-color-grey-300:#9E9E9E;--b2b-color-grey-400:#777777;--b2b-color-red-50:#FFDDE3;--b2b-color-red-100:#D4021D;--b2b-color-red-150:#E6344B;--b2b-color-red-200:#BB0004;--b2b-color-red-250:#850012;--b2b-color-primary:#D4021D;--b2b-color-error-100:#E6344B;--b2b-color-warning-50:#FFD998;--b2b-color-warning-100:#FFB432;--b2b-color-success-50:#D6E0CC;--b2b-color-success-100:#326400;--b2b-color-info-50:#CCD6E0;--b2b-color-info-100:#003264;--b2b-color-hover-default:#E6F4FF;--b2b-color-hover-black:#3B3B3B;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-font-weight-thin:100;--b2b-font-weight-normal:500;--b2b-font-weight-bold:700;--b2b-size-1:0.0625rem;--b2b-size-5:0.125rem;--b2b-size-7:0.1875rem;--b2b-size-10:0.25rem;--b2b-size-15:0.375rem;--b2b-size-20:0.5rem;--b2b-size-25:0.625rem;--b2b-size-30:0.75rem;--b2b-size-35:0.875rem;--b2b-size-40:1rem;--b2b-size-45:1.125rem;--b2b-size-50:1.25rem;--b2b-size-53:1.3125rem;--b2b-size-55:1.375rem;--b2b-size-60:1.5rem;--b2b-size-70:1.75rem;--b2b-size-80:2rem;--b2b-size-90:2.25rem;--b2b-size-100:2.5rem;--b2b-size-120:3rem;--b2b-size-140:3.5rem;--b2b-size-150:3.75rem;--b2b-size-160:4rem;--b2b-size-200:5rem;--b2b-color-error-50:var(--b2b-color-red-50);--b2b-color-background-box:var(--b2b-color-black-50);--b2b-color-background-card:var(--b2b-color-black-50);--b2b-color-background-page:var(--b2b-color-grey-100);--b2b-color-border-100:var(--b2b-color-white-100);--b2b-color-copy-default:var(--b2b-color-white-100);--b2b-color-copy-secondary:var(--b2b-color-grey-100);--b2b-color-copy-inverted:var(--b2b-color-black-100);--b2b-color-headline-title:var(--b2b-color-red-50);--b2b-color-headline-default:var(--b2b-color-white-100);--b2b-color-headline-inverted:var(--b2b-color-black-100);--b2b-color-icon-default:var(--b2b-color-white-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-inverted:var(--b2b-color-black-100)}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans.ttf\");font-weight:normal;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.ttf\") format(\"truetype\");font-weight:bold;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.ttf\") format(\"truetype\");font-weight:100;font-style:normal}@font-face{font-family:ObcIcons;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/obc-icons.woff\")}:host(.b2b-background-box){display:block;background:var(--b2b-color-background-box);border:var(--b2b-size-1) solid var(--b2b-color-border-100);padding:1.5rem}:host(.b2b-background-box--max-width.b2b-background-box--no-padding){max-width:75.75rem;padding:unset}:host(.b2b-background-box--max-width){max-width:72.75rem}:host(.b2b-background-box--no-padding){padding:unset}:host(.b2b-background-box--hide-border-top){border-top:0}:host(.b2b-background-box--hide-border-right){border-right:0}:host(.b2b-background-box--hide-border-bottom){border-bottom:0}:host(.b2b-background-box--hide-border-left){border-left:0}";
|
|
8
|
+
const B2bBackgroundBoxStyle0 = backgroundBoxCss;
|
|
6
9
|
|
|
7
10
|
const BackgroundBoxComponent = class {
|
|
8
11
|
constructor(hostRef) {
|
|
9
12
|
index.registerInstance(this, hostRef);
|
|
10
|
-
/** Sets max width to 1212px. Per default, it is false */
|
|
11
13
|
this.maxWidth = false;
|
|
12
|
-
/** Whether the box should have a padding. Per default, padding is enabled */
|
|
13
14
|
this.noPadding = false;
|
|
14
|
-
/** Whether the box should have a top border. Per default, the border is enabled */
|
|
15
15
|
this.borderTop = 'default';
|
|
16
|
-
/** Whether the box should have a right border. Per default, the border is enabled */
|
|
17
16
|
this.borderRight = 'default';
|
|
18
|
-
/** Whether the box should have a bottom border. Per default, the border is enabled */
|
|
19
17
|
this.borderBottom = 'default';
|
|
20
|
-
/** Whether the box should have a left border. Per default, the border is enabled */
|
|
21
18
|
this.borderLeft = 'default';
|
|
22
19
|
}
|
|
23
20
|
render() {
|
|
24
|
-
return (index.h(index.Host, { key: '
|
|
21
|
+
return (index.h(index.Host, { key: '3f5519f808f26a88fde93a7f933b11c9b3f96992', class: {
|
|
25
22
|
'b2b-background-box': true,
|
|
26
23
|
'b2b-background-box--max-width': this.maxWidth,
|
|
27
24
|
'b2b-background-box--no-padding': this.noPadding,
|
|
@@ -29,10 +26,10 @@ const BackgroundBoxComponent = class {
|
|
|
29
26
|
'b2b-background-box--hide-border-right': this.borderRight === 'none',
|
|
30
27
|
'b2b-background-box--hide-border-bottom': this.borderBottom === 'none',
|
|
31
28
|
'b2b-background-box--hide-border-left': this.borderLeft === 'none',
|
|
32
|
-
} }, index.h("slot", { key: '
|
|
29
|
+
} }, index.h("slot", { key: '35bd80fb92b66ab216db1cf86ce7817a9087fe19' })));
|
|
33
30
|
}
|
|
34
31
|
get host() { return index.getElement(this); }
|
|
35
32
|
};
|
|
36
|
-
BackgroundBoxComponent.style =
|
|
33
|
+
BackgroundBoxComponent.style = B2bBackgroundBoxStyle0;
|
|
37
34
|
|
|
38
35
|
exports.b2b_background_box = BackgroundBoxComponent;
|
|
@@ -1,17 +1,16 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
const index = require('./index-668808fd.js');
|
|
4
6
|
|
|
5
7
|
const breadcrumbCss = "@charset \"UTF-8\";:root,:host{--b2b-color-black-50:#333333;--b2b-color-black-100:#222222;--b2b-color-white-100:#FFFFFF;--b2b-color-grey-10:#F0F0F0;--b2b-color-grey-25:#F6F6F6;--b2b-color-grey-50:#EEEEEE;--b2b-color-grey-100:#E6E6E6;--b2b-color-grey-150:#D5D5D5;--b2b-color-grey-200:#C4C4C4;--b2b-color-grey-250:#B1B1B1;--b2b-color-grey-300:#9E9E9E;--b2b-color-grey-400:#777777;--b2b-color-red-50:#FFDDE3;--b2b-color-red-100:#D4021D;--b2b-color-red-150:#E6344B;--b2b-color-red-200:#BB0004;--b2b-color-red-250:#850012;--b2b-color-primary:#D4021D;--b2b-color-error-100:#E6344B;--b2b-color-warning-50:#FFD998;--b2b-color-warning-100:#FFB432;--b2b-color-success-50:#D6E0CC;--b2b-color-success-100:#326400;--b2b-color-info-50:#CCD6E0;--b2b-color-info-100:#003264;--b2b-color-hover-default:#E6F4FF;--b2b-color-hover-black:#3B3B3B;--b2b-color-background-overlay-transparent-80:#22222280;--b2b-color-background-overlay-transparent-40:#22222240;--b2b-color-table-selected-default:#CCE9FF;--b2b-color-table-expand-hover:#E6F4FF;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-font-weight-thin:100;--b2b-font-weight-normal:500;--b2b-font-weight-bold:700;--b2b-size-1:0.0625rem;--b2b-size-5:0.125rem;--b2b-size-7:0.1875rem;--b2b-size-10:0.25rem;--b2b-size-15:0.375rem;--b2b-size-20:0.5rem;--b2b-size-25:0.625rem;--b2b-size-30:0.75rem;--b2b-size-35:0.875rem;--b2b-size-40:1rem;--b2b-size-45:1.125rem;--b2b-size-50:1.25rem;--b2b-size-53:1.3125rem;--b2b-size-55:1.375rem;--b2b-size-60:1.5rem;--b2b-size-70:1.75rem;--b2b-size-80:2rem;--b2b-size-90:2.25rem;--b2b-size-100:2.5rem;--b2b-size-120:3rem;--b2b-size-140:3.5rem;--b2b-size-150:3.75rem;--b2b-size-160:4rem;--b2b-size-200:5rem;--b2b-color-error-50:var(--b2b-color-red-50);--b2b-color-background-page:var(--b2b-color-grey-10);--b2b-color-background-box:var(--b2b-color-white-100);--b2b-color-background-card:var(--b2b-color-white-100);--b2b-color-background-overlay:var(--b2b-color-black-100);--b2b-color-border-100:var(--b2b-color-grey-200);--b2b-color-copy-default:var(--b2b-color-black-100);--b2b-color-copy-secondary:var(--b2b-color-grey-400);--b2b-color-copy-inverted:var(--b2b-color-white-100);--b2b-color-copy-overlay:var(--b2b-color-white-100);--b2b-color-headline-title:var(--b2b-color-red-100);--b2b-color-headline-default:var(--b2b-color-black-100);--b2b-color-headline-inverted:var(--b2b-color-white-100);--b2b-color-icon-default:var(--b2b-color-black-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-inverted:var(--b2b-color-white-100);--b2b-color-table-expand-default:var(--b2b-color-grey-25);--b2b-size-icon-50:var(--b2b-size-40);--b2b-size-icon-100:var(--b2b-size-60);--b2b-size-icon-200:var(--b2b-size-80);--b2b-size-icon-400:var(--b2b-size-120);--b2b-size-space-25:var(--b2b-size-10);--b2b-size-space-50:var(--b2b-size-20);--b2b-size-space-75:var(--b2b-size-30);--b2b-size-space-100:var(--b2b-size-40);--b2b-size-space-150:var(--b2b-size-60);--b2b-size-space-175:var(--b2b-size-80);--b2b-size-space-200:var(--b2b-size-100);--b2b-size-space-250:var(--b2b-size-160);--b2b-size-space-300:var(--b2b-size-200);--b2b-size-padding-50:var(--b2b-size-20);--b2b-size-padding-100:var(--b2b-size-40);--b2b-size-padding-150:var(--b2b-size-60);--b2b-size-padding-175:var(--b2b-size-80);--b2b-size-border-width-50:var(--b2b-size-1);--b2b-size-border-width-100:var(--b2b-size-5);--b2b-size-border-width-150:var(--b2b-size-10);--b2b-size-border-radius-100:var(--b2b-size-7);--b2b-size-border-no-radius-left:0 var(--b2b-size-7) var(--b2b-size-7) 0;--b2b-size-border-no-radius-right:var(--b2b-size-7) 0 0 var(--b2b-size-7);--b2b-size-border-no-radius-top:0 0 var(--b2b-size-7) var(--b2b-size-7);--b2b-size-border-no-radius-bottom:var(--b2b-size-7) var(--b2b-size-7) 0 0;--b2b-size-copy-50:var(--b2b-size-30);--b2b-size-copy-100:var(--b2b-size-35);--b2b-size-copy-125:var(--b2b-size-40);--b2b-size-copy-200:var(--b2b-size-45);--b2b-size-copy-300:var(--b2b-size-60);--b2b-size-copy-line-height-50:var(--b2b-size-40);--b2b-size-copy-line-height-75:var(--b2b-size-45);--b2b-size-copy-line-height-100:var(--b2b-size-53);--b2b-size-copy-line-height-125:var(--b2b-size-60);--b2b-size-copy-line-height-200:var(--b2b-size-60);--b2b-size-copy-line-height-300:var(--b2b-size-90);--b2b-size-headline-100:var(--b2b-size-40);--b2b-size-headline-200:var(--b2b-size-45);--b2b-size-headline-400:var(--b2b-size-60);--b2b-size-headline-line-height-100:var(--b2b-size-60);--b2b-size-headline-line-height-200:var(--b2b-size-60);--b2b-size-headline-line-height-400:var(--b2b-size-60)}:root [data-theme=\"dark\"]{--b2b-color-black-50:#333333;--b2b-color-black-100:#222222;--b2b-color-white-100:#FFFFFF;--b2b-color-grey-10:#F0F0F0;--b2b-color-grey-25:#F6F6F6;--b2b-color-grey-50:#EEEEEE;--b2b-color-grey-100:#E6E6E6;--b2b-color-grey-150:#D5D5D5;--b2b-color-grey-200:#C4C4C4;--b2b-color-grey-250:#B1B1B1;--b2b-color-grey-300:#9E9E9E;--b2b-color-grey-400:#777777;--b2b-color-red-50:#FFDDE3;--b2b-color-red-100:#D4021D;--b2b-color-red-150:#E6344B;--b2b-color-red-200:#BB0004;--b2b-color-red-250:#850012;--b2b-color-primary:#D4021D;--b2b-color-error-100:#E6344B;--b2b-color-warning-50:#FFD998;--b2b-color-warning-100:#FFB432;--b2b-color-success-50:#D6E0CC;--b2b-color-success-100:#326400;--b2b-color-info-50:#CCD6E0;--b2b-color-info-100:#003264;--b2b-color-hover-default:#E6F4FF;--b2b-color-hover-black:#3B3B3B;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-font-weight-thin:100;--b2b-font-weight-normal:500;--b2b-font-weight-bold:700;--b2b-size-1:0.0625rem;--b2b-size-5:0.125rem;--b2b-size-7:0.1875rem;--b2b-size-10:0.25rem;--b2b-size-15:0.375rem;--b2b-size-20:0.5rem;--b2b-size-25:0.625rem;--b2b-size-30:0.75rem;--b2b-size-35:0.875rem;--b2b-size-40:1rem;--b2b-size-45:1.125rem;--b2b-size-50:1.25rem;--b2b-size-53:1.3125rem;--b2b-size-55:1.375rem;--b2b-size-60:1.5rem;--b2b-size-70:1.75rem;--b2b-size-80:2rem;--b2b-size-90:2.25rem;--b2b-size-100:2.5rem;--b2b-size-120:3rem;--b2b-size-140:3.5rem;--b2b-size-150:3.75rem;--b2b-size-160:4rem;--b2b-size-200:5rem;--b2b-color-error-50:var(--b2b-color-red-50);--b2b-color-background-box:var(--b2b-color-black-50);--b2b-color-background-card:var(--b2b-color-black-50);--b2b-color-background-page:var(--b2b-color-grey-100);--b2b-color-border-100:var(--b2b-color-white-100);--b2b-color-copy-default:var(--b2b-color-white-100);--b2b-color-copy-secondary:var(--b2b-color-grey-100);--b2b-color-copy-inverted:var(--b2b-color-black-100);--b2b-color-headline-title:var(--b2b-color-red-50);--b2b-color-headline-default:var(--b2b-color-white-100);--b2b-color-headline-inverted:var(--b2b-color-black-100);--b2b-color-icon-default:var(--b2b-color-white-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-inverted:var(--b2b-color-black-100)}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans.ttf\");font-weight:normal;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.ttf\") format(\"truetype\");font-weight:bold;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.ttf\") format(\"truetype\");font-weight:100;font-style:normal}@font-face{font-family:ObcIcons;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/obc-icons.woff\")}:host{display:block}.b2b-breadcrumb-nav{z-index:99;display:flex;flex-flow:row nowrap;height:var(--b2b-size-90);border-bottom:var(--b2b-size-border-width-50) solid var(--b2b-color-grey-200)}.b2b-breadcrumb-nav__item{font-size:var(--b2b-size-copy-125);line-height:var(--b2b-size-copy-line-height-125);display:inline-flex;color:var(--b2b-color-copy-secondary);cursor:pointer}.b2b-breadcrumb-nav__item a{color:var(--b2b-color-grey-400);text-decoration:none}.b2b-breadcrumb-nav__item:hover,.b2b-breadcrumb-nav__item a:hover{color:var(--b2b-color-red-100)}.b2b-breadcrumb-nav__item--active:hover,.b2b-breadcrumb-nav__item--active a:hover{cursor:default;color:var(--b2b-color-grey-400)}::slotted(*:not(:last-child))::after{content:\"»\";color:var(--b2b-color-grey-400);margin:0 0.375rem}";
|
|
8
|
+
const B2bBreadcrumbItemStyle0 = breadcrumbCss;
|
|
6
9
|
|
|
7
10
|
const BreadCrumbItemComponent = class {
|
|
8
11
|
constructor(hostRef) {
|
|
9
12
|
index.registerInstance(this, hostRef);
|
|
10
|
-
this.b2bChange = index.createEvent(this, "b2b-change");
|
|
11
|
-
/** If defined, an anchor tag will be rendered instead of a span, opening the specified link in the same context when clicked. */
|
|
12
|
-
this.href = null;
|
|
13
|
-
/** If the item is currently selected. If true, it will not emit an event when clicked and does not have a hover state.*/
|
|
14
|
-
this.active = false;
|
|
13
|
+
this.b2bChange = index.createEvent(this, "b2b-change", 7);
|
|
15
14
|
this.onClick = () => {
|
|
16
15
|
if (this.active || this.href != null) {
|
|
17
16
|
return;
|
|
@@ -26,14 +25,17 @@ const BreadCrumbItemComponent = class {
|
|
|
26
25
|
this.b2bChange.emit();
|
|
27
26
|
this.active = true;
|
|
28
27
|
};
|
|
28
|
+
this.href = null;
|
|
29
|
+
this.value = undefined;
|
|
30
|
+
this.active = false;
|
|
29
31
|
}
|
|
30
32
|
render() {
|
|
31
|
-
return (index.h(index.Host, { key: '
|
|
33
|
+
return (index.h(index.Host, { key: 'a0e98de57d8664a9a360fba87f0bd54ceaa26f45', onClick: this.onClick, onKeyDown: this.onKeyDown, tabindex: Boolean(this.href) ? null : 0 }, index.h("span", { key: '18df4ab47446ea909c073956309c7892907f4bb6', class: {
|
|
32
34
|
'b2b-breadcrumb-nav__item': true,
|
|
33
35
|
'b2b-breadcrumb-nav__item--active': this.active,
|
|
34
36
|
} }, this.href != null ? (index.h("a", { href: this.href }, index.h("slot", null))) : (index.h("slot", null)))));
|
|
35
37
|
}
|
|
36
38
|
};
|
|
37
|
-
BreadCrumbItemComponent.style =
|
|
39
|
+
BreadCrumbItemComponent.style = B2bBreadcrumbItemStyle0;
|
|
38
40
|
|
|
39
41
|
exports.b2b_breadcrumb_item = BreadCrumbItemComponent;
|
|
@@ -1,17 +1,16 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
const index = require('./index-668808fd.js');
|
|
4
6
|
|
|
5
7
|
const breadcrumbCss = "@charset \"UTF-8\";:root,:host{--b2b-color-black-50:#333333;--b2b-color-black-100:#222222;--b2b-color-white-100:#FFFFFF;--b2b-color-grey-10:#F0F0F0;--b2b-color-grey-25:#F6F6F6;--b2b-color-grey-50:#EEEEEE;--b2b-color-grey-100:#E6E6E6;--b2b-color-grey-150:#D5D5D5;--b2b-color-grey-200:#C4C4C4;--b2b-color-grey-250:#B1B1B1;--b2b-color-grey-300:#9E9E9E;--b2b-color-grey-400:#777777;--b2b-color-red-50:#FFDDE3;--b2b-color-red-100:#D4021D;--b2b-color-red-150:#E6344B;--b2b-color-red-200:#BB0004;--b2b-color-red-250:#850012;--b2b-color-primary:#D4021D;--b2b-color-error-100:#E6344B;--b2b-color-warning-50:#FFD998;--b2b-color-warning-100:#FFB432;--b2b-color-success-50:#D6E0CC;--b2b-color-success-100:#326400;--b2b-color-info-50:#CCD6E0;--b2b-color-info-100:#003264;--b2b-color-hover-default:#E6F4FF;--b2b-color-hover-black:#3B3B3B;--b2b-color-background-overlay-transparent-80:#22222280;--b2b-color-background-overlay-transparent-40:#22222240;--b2b-color-table-selected-default:#CCE9FF;--b2b-color-table-expand-hover:#E6F4FF;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-font-weight-thin:100;--b2b-font-weight-normal:500;--b2b-font-weight-bold:700;--b2b-size-1:0.0625rem;--b2b-size-5:0.125rem;--b2b-size-7:0.1875rem;--b2b-size-10:0.25rem;--b2b-size-15:0.375rem;--b2b-size-20:0.5rem;--b2b-size-25:0.625rem;--b2b-size-30:0.75rem;--b2b-size-35:0.875rem;--b2b-size-40:1rem;--b2b-size-45:1.125rem;--b2b-size-50:1.25rem;--b2b-size-53:1.3125rem;--b2b-size-55:1.375rem;--b2b-size-60:1.5rem;--b2b-size-70:1.75rem;--b2b-size-80:2rem;--b2b-size-90:2.25rem;--b2b-size-100:2.5rem;--b2b-size-120:3rem;--b2b-size-140:3.5rem;--b2b-size-150:3.75rem;--b2b-size-160:4rem;--b2b-size-200:5rem;--b2b-color-error-50:var(--b2b-color-red-50);--b2b-color-background-page:var(--b2b-color-grey-10);--b2b-color-background-box:var(--b2b-color-white-100);--b2b-color-background-card:var(--b2b-color-white-100);--b2b-color-background-overlay:var(--b2b-color-black-100);--b2b-color-border-100:var(--b2b-color-grey-200);--b2b-color-copy-default:var(--b2b-color-black-100);--b2b-color-copy-secondary:var(--b2b-color-grey-400);--b2b-color-copy-inverted:var(--b2b-color-white-100);--b2b-color-copy-overlay:var(--b2b-color-white-100);--b2b-color-headline-title:var(--b2b-color-red-100);--b2b-color-headline-default:var(--b2b-color-black-100);--b2b-color-headline-inverted:var(--b2b-color-white-100);--b2b-color-icon-default:var(--b2b-color-black-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-inverted:var(--b2b-color-white-100);--b2b-color-table-expand-default:var(--b2b-color-grey-25);--b2b-size-icon-50:var(--b2b-size-40);--b2b-size-icon-100:var(--b2b-size-60);--b2b-size-icon-200:var(--b2b-size-80);--b2b-size-icon-400:var(--b2b-size-120);--b2b-size-space-25:var(--b2b-size-10);--b2b-size-space-50:var(--b2b-size-20);--b2b-size-space-75:var(--b2b-size-30);--b2b-size-space-100:var(--b2b-size-40);--b2b-size-space-150:var(--b2b-size-60);--b2b-size-space-175:var(--b2b-size-80);--b2b-size-space-200:var(--b2b-size-100);--b2b-size-space-250:var(--b2b-size-160);--b2b-size-space-300:var(--b2b-size-200);--b2b-size-padding-50:var(--b2b-size-20);--b2b-size-padding-100:var(--b2b-size-40);--b2b-size-padding-150:var(--b2b-size-60);--b2b-size-padding-175:var(--b2b-size-80);--b2b-size-border-width-50:var(--b2b-size-1);--b2b-size-border-width-100:var(--b2b-size-5);--b2b-size-border-width-150:var(--b2b-size-10);--b2b-size-border-radius-100:var(--b2b-size-7);--b2b-size-border-no-radius-left:0 var(--b2b-size-7) var(--b2b-size-7) 0;--b2b-size-border-no-radius-right:var(--b2b-size-7) 0 0 var(--b2b-size-7);--b2b-size-border-no-radius-top:0 0 var(--b2b-size-7) var(--b2b-size-7);--b2b-size-border-no-radius-bottom:var(--b2b-size-7) var(--b2b-size-7) 0 0;--b2b-size-copy-50:var(--b2b-size-30);--b2b-size-copy-100:var(--b2b-size-35);--b2b-size-copy-125:var(--b2b-size-40);--b2b-size-copy-200:var(--b2b-size-45);--b2b-size-copy-300:var(--b2b-size-60);--b2b-size-copy-line-height-50:var(--b2b-size-40);--b2b-size-copy-line-height-75:var(--b2b-size-45);--b2b-size-copy-line-height-100:var(--b2b-size-53);--b2b-size-copy-line-height-125:var(--b2b-size-60);--b2b-size-copy-line-height-200:var(--b2b-size-60);--b2b-size-copy-line-height-300:var(--b2b-size-90);--b2b-size-headline-100:var(--b2b-size-40);--b2b-size-headline-200:var(--b2b-size-45);--b2b-size-headline-400:var(--b2b-size-60);--b2b-size-headline-line-height-100:var(--b2b-size-60);--b2b-size-headline-line-height-200:var(--b2b-size-60);--b2b-size-headline-line-height-400:var(--b2b-size-60)}:root [data-theme=\"dark\"]{--b2b-color-black-50:#333333;--b2b-color-black-100:#222222;--b2b-color-white-100:#FFFFFF;--b2b-color-grey-10:#F0F0F0;--b2b-color-grey-25:#F6F6F6;--b2b-color-grey-50:#EEEEEE;--b2b-color-grey-100:#E6E6E6;--b2b-color-grey-150:#D5D5D5;--b2b-color-grey-200:#C4C4C4;--b2b-color-grey-250:#B1B1B1;--b2b-color-grey-300:#9E9E9E;--b2b-color-grey-400:#777777;--b2b-color-red-50:#FFDDE3;--b2b-color-red-100:#D4021D;--b2b-color-red-150:#E6344B;--b2b-color-red-200:#BB0004;--b2b-color-red-250:#850012;--b2b-color-primary:#D4021D;--b2b-color-error-100:#E6344B;--b2b-color-warning-50:#FFD998;--b2b-color-warning-100:#FFB432;--b2b-color-success-50:#D6E0CC;--b2b-color-success-100:#326400;--b2b-color-info-50:#CCD6E0;--b2b-color-info-100:#003264;--b2b-color-hover-default:#E6F4FF;--b2b-color-hover-black:#3B3B3B;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-font-weight-thin:100;--b2b-font-weight-normal:500;--b2b-font-weight-bold:700;--b2b-size-1:0.0625rem;--b2b-size-5:0.125rem;--b2b-size-7:0.1875rem;--b2b-size-10:0.25rem;--b2b-size-15:0.375rem;--b2b-size-20:0.5rem;--b2b-size-25:0.625rem;--b2b-size-30:0.75rem;--b2b-size-35:0.875rem;--b2b-size-40:1rem;--b2b-size-45:1.125rem;--b2b-size-50:1.25rem;--b2b-size-53:1.3125rem;--b2b-size-55:1.375rem;--b2b-size-60:1.5rem;--b2b-size-70:1.75rem;--b2b-size-80:2rem;--b2b-size-90:2.25rem;--b2b-size-100:2.5rem;--b2b-size-120:3rem;--b2b-size-140:3.5rem;--b2b-size-150:3.75rem;--b2b-size-160:4rem;--b2b-size-200:5rem;--b2b-color-error-50:var(--b2b-color-red-50);--b2b-color-background-box:var(--b2b-color-black-50);--b2b-color-background-card:var(--b2b-color-black-50);--b2b-color-background-page:var(--b2b-color-grey-100);--b2b-color-border-100:var(--b2b-color-white-100);--b2b-color-copy-default:var(--b2b-color-white-100);--b2b-color-copy-secondary:var(--b2b-color-grey-100);--b2b-color-copy-inverted:var(--b2b-color-black-100);--b2b-color-headline-title:var(--b2b-color-red-50);--b2b-color-headline-default:var(--b2b-color-white-100);--b2b-color-headline-inverted:var(--b2b-color-black-100);--b2b-color-icon-default:var(--b2b-color-white-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-inverted:var(--b2b-color-black-100)}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans.ttf\");font-weight:normal;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.ttf\") format(\"truetype\");font-weight:bold;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.ttf\") format(\"truetype\");font-weight:100;font-style:normal}@font-face{font-family:ObcIcons;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/obc-icons.woff\")}:host{display:block}.b2b-breadcrumb-nav{z-index:99;display:flex;flex-flow:row nowrap;height:var(--b2b-size-90);border-bottom:var(--b2b-size-border-width-50) solid var(--b2b-color-grey-200)}.b2b-breadcrumb-nav__item{font-size:var(--b2b-size-copy-125);line-height:var(--b2b-size-copy-line-height-125);display:inline-flex;color:var(--b2b-color-copy-secondary);cursor:pointer}.b2b-breadcrumb-nav__item a{color:var(--b2b-color-grey-400);text-decoration:none}.b2b-breadcrumb-nav__item:hover,.b2b-breadcrumb-nav__item a:hover{color:var(--b2b-color-red-100)}.b2b-breadcrumb-nav__item--active:hover,.b2b-breadcrumb-nav__item--active a:hover{cursor:default;color:var(--b2b-color-grey-400)}::slotted(*:not(:last-child))::after{content:\"»\";color:var(--b2b-color-grey-400);margin:0 0.375rem}";
|
|
8
|
+
const B2bBreadcrumbStyle0 = breadcrumbCss;
|
|
6
9
|
|
|
7
10
|
const B2bBreadCrumbComponent = class {
|
|
8
11
|
constructor(hostRef) {
|
|
9
12
|
index.registerInstance(this, hostRef);
|
|
10
|
-
this.b2bSelected = index.createEvent(this, "b2b-selected");
|
|
11
|
-
/** Padding for the top of the breadcrumb component */
|
|
12
|
-
this.paddingTop = 0; // Default value is 0px
|
|
13
|
-
/** Padding for the bottom of the breadcrumb component */
|
|
14
|
-
this.paddingBottom = 0; // Default value is 0px
|
|
13
|
+
this.b2bSelected = index.createEvent(this, "b2b-selected", 7);
|
|
15
14
|
this.getBreadcrumbItems = () => {
|
|
16
15
|
return Array.from(this.host.querySelectorAll('b2b-breadcrumb-item'));
|
|
17
16
|
};
|
|
@@ -20,6 +19,8 @@ const B2bBreadCrumbComponent = class {
|
|
|
20
19
|
.filter(x => x.value !== newItem.value)
|
|
21
20
|
.forEach(x => (x.active = false));
|
|
22
21
|
};
|
|
22
|
+
this.paddingTop = 0;
|
|
23
|
+
this.paddingBottom = 0;
|
|
23
24
|
}
|
|
24
25
|
onSelectedChange(event) {
|
|
25
26
|
const item = event.target;
|
|
@@ -27,13 +28,13 @@ const B2bBreadCrumbComponent = class {
|
|
|
27
28
|
this.b2bSelected.emit({ value: item.value });
|
|
28
29
|
}
|
|
29
30
|
render() {
|
|
30
|
-
return (index.h(index.Host, { key: '
|
|
31
|
+
return (index.h(index.Host, { key: '28af1dc12b85c9c3a77829b9db6bc28d4ef8c079', style: {
|
|
31
32
|
paddingTop: `${this.paddingTop}px`,
|
|
32
33
|
paddingBottom: `${this.paddingBottom}px`,
|
|
33
|
-
} }, index.h("div", { key: '
|
|
34
|
+
} }, index.h("div", { key: 'e422ae486a483f52cb54ea114a51e1ae67c5241f', class: "b2b-breadcrumb-nav" }, index.h("slot", { key: '017dd20d5b8463563aa4f4d74e72557f5c703af5' }))));
|
|
34
35
|
}
|
|
35
36
|
get host() { return index.getElement(this); }
|
|
36
37
|
};
|
|
37
|
-
B2bBreadCrumbComponent.style =
|
|
38
|
+
B2bBreadCrumbComponent.style = B2bBreadcrumbStyle0;
|
|
38
39
|
|
|
39
40
|
exports.b2b_breadcrumb = B2bBreadCrumbComponent;
|
|
@@ -1,30 +1,15 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
const index = require('./index-668808fd.js');
|
|
4
6
|
|
|
5
7
|
const buttonCss = ":root,:host{--b2b-color-black-50:#333333;--b2b-color-black-100:#222222;--b2b-color-white-100:#FFFFFF;--b2b-color-grey-10:#F0F0F0;--b2b-color-grey-25:#F6F6F6;--b2b-color-grey-50:#EEEEEE;--b2b-color-grey-100:#E6E6E6;--b2b-color-grey-150:#D5D5D5;--b2b-color-grey-200:#C4C4C4;--b2b-color-grey-250:#B1B1B1;--b2b-color-grey-300:#9E9E9E;--b2b-color-grey-400:#777777;--b2b-color-red-50:#FFDDE3;--b2b-color-red-100:#D4021D;--b2b-color-red-150:#E6344B;--b2b-color-red-200:#BB0004;--b2b-color-red-250:#850012;--b2b-color-primary:#D4021D;--b2b-color-error-100:#E6344B;--b2b-color-warning-50:#FFD998;--b2b-color-warning-100:#FFB432;--b2b-color-success-50:#D6E0CC;--b2b-color-success-100:#326400;--b2b-color-info-50:#CCD6E0;--b2b-color-info-100:#003264;--b2b-color-hover-default:#E6F4FF;--b2b-color-hover-black:#3B3B3B;--b2b-color-background-overlay-transparent-80:#22222280;--b2b-color-background-overlay-transparent-40:#22222240;--b2b-color-table-selected-default:#CCE9FF;--b2b-color-table-expand-hover:#E6F4FF;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-font-weight-thin:100;--b2b-font-weight-normal:500;--b2b-font-weight-bold:700;--b2b-size-1:0.0625rem;--b2b-size-5:0.125rem;--b2b-size-7:0.1875rem;--b2b-size-10:0.25rem;--b2b-size-15:0.375rem;--b2b-size-20:0.5rem;--b2b-size-25:0.625rem;--b2b-size-30:0.75rem;--b2b-size-35:0.875rem;--b2b-size-40:1rem;--b2b-size-45:1.125rem;--b2b-size-50:1.25rem;--b2b-size-53:1.3125rem;--b2b-size-55:1.375rem;--b2b-size-60:1.5rem;--b2b-size-70:1.75rem;--b2b-size-80:2rem;--b2b-size-90:2.25rem;--b2b-size-100:2.5rem;--b2b-size-120:3rem;--b2b-size-140:3.5rem;--b2b-size-150:3.75rem;--b2b-size-160:4rem;--b2b-size-200:5rem;--b2b-color-error-50:var(--b2b-color-red-50);--b2b-color-background-page:var(--b2b-color-grey-10);--b2b-color-background-box:var(--b2b-color-white-100);--b2b-color-background-card:var(--b2b-color-white-100);--b2b-color-background-overlay:var(--b2b-color-black-100);--b2b-color-border-100:var(--b2b-color-grey-200);--b2b-color-copy-default:var(--b2b-color-black-100);--b2b-color-copy-secondary:var(--b2b-color-grey-400);--b2b-color-copy-inverted:var(--b2b-color-white-100);--b2b-color-copy-overlay:var(--b2b-color-white-100);--b2b-color-headline-title:var(--b2b-color-red-100);--b2b-color-headline-default:var(--b2b-color-black-100);--b2b-color-headline-inverted:var(--b2b-color-white-100);--b2b-color-icon-default:var(--b2b-color-black-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-inverted:var(--b2b-color-white-100);--b2b-color-table-expand-default:var(--b2b-color-grey-25);--b2b-size-icon-50:var(--b2b-size-40);--b2b-size-icon-100:var(--b2b-size-60);--b2b-size-icon-200:var(--b2b-size-80);--b2b-size-icon-400:var(--b2b-size-120);--b2b-size-space-25:var(--b2b-size-10);--b2b-size-space-50:var(--b2b-size-20);--b2b-size-space-75:var(--b2b-size-30);--b2b-size-space-100:var(--b2b-size-40);--b2b-size-space-150:var(--b2b-size-60);--b2b-size-space-175:var(--b2b-size-80);--b2b-size-space-200:var(--b2b-size-100);--b2b-size-space-250:var(--b2b-size-160);--b2b-size-space-300:var(--b2b-size-200);--b2b-size-padding-50:var(--b2b-size-20);--b2b-size-padding-100:var(--b2b-size-40);--b2b-size-padding-150:var(--b2b-size-60);--b2b-size-padding-175:var(--b2b-size-80);--b2b-size-border-width-50:var(--b2b-size-1);--b2b-size-border-width-100:var(--b2b-size-5);--b2b-size-border-width-150:var(--b2b-size-10);--b2b-size-border-radius-100:var(--b2b-size-7);--b2b-size-border-no-radius-left:0 var(--b2b-size-7) var(--b2b-size-7) 0;--b2b-size-border-no-radius-right:var(--b2b-size-7) 0 0 var(--b2b-size-7);--b2b-size-border-no-radius-top:0 0 var(--b2b-size-7) var(--b2b-size-7);--b2b-size-border-no-radius-bottom:var(--b2b-size-7) var(--b2b-size-7) 0 0;--b2b-size-copy-50:var(--b2b-size-30);--b2b-size-copy-100:var(--b2b-size-35);--b2b-size-copy-125:var(--b2b-size-40);--b2b-size-copy-200:var(--b2b-size-45);--b2b-size-copy-300:var(--b2b-size-60);--b2b-size-copy-line-height-50:var(--b2b-size-40);--b2b-size-copy-line-height-75:var(--b2b-size-45);--b2b-size-copy-line-height-100:var(--b2b-size-53);--b2b-size-copy-line-height-125:var(--b2b-size-60);--b2b-size-copy-line-height-200:var(--b2b-size-60);--b2b-size-copy-line-height-300:var(--b2b-size-90);--b2b-size-headline-100:var(--b2b-size-40);--b2b-size-headline-200:var(--b2b-size-45);--b2b-size-headline-400:var(--b2b-size-60);--b2b-size-headline-line-height-100:var(--b2b-size-60);--b2b-size-headline-line-height-200:var(--b2b-size-60);--b2b-size-headline-line-height-400:var(--b2b-size-60)}:root [data-theme=\"dark\"]{--b2b-color-black-50:#333333;--b2b-color-black-100:#222222;--b2b-color-white-100:#FFFFFF;--b2b-color-grey-10:#F0F0F0;--b2b-color-grey-25:#F6F6F6;--b2b-color-grey-50:#EEEEEE;--b2b-color-grey-100:#E6E6E6;--b2b-color-grey-150:#D5D5D5;--b2b-color-grey-200:#C4C4C4;--b2b-color-grey-250:#B1B1B1;--b2b-color-grey-300:#9E9E9E;--b2b-color-grey-400:#777777;--b2b-color-red-50:#FFDDE3;--b2b-color-red-100:#D4021D;--b2b-color-red-150:#E6344B;--b2b-color-red-200:#BB0004;--b2b-color-red-250:#850012;--b2b-color-primary:#D4021D;--b2b-color-error-100:#E6344B;--b2b-color-warning-50:#FFD998;--b2b-color-warning-100:#FFB432;--b2b-color-success-50:#D6E0CC;--b2b-color-success-100:#326400;--b2b-color-info-50:#CCD6E0;--b2b-color-info-100:#003264;--b2b-color-hover-default:#E6F4FF;--b2b-color-hover-black:#3B3B3B;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-font-weight-thin:100;--b2b-font-weight-normal:500;--b2b-font-weight-bold:700;--b2b-size-1:0.0625rem;--b2b-size-5:0.125rem;--b2b-size-7:0.1875rem;--b2b-size-10:0.25rem;--b2b-size-15:0.375rem;--b2b-size-20:0.5rem;--b2b-size-25:0.625rem;--b2b-size-30:0.75rem;--b2b-size-35:0.875rem;--b2b-size-40:1rem;--b2b-size-45:1.125rem;--b2b-size-50:1.25rem;--b2b-size-53:1.3125rem;--b2b-size-55:1.375rem;--b2b-size-60:1.5rem;--b2b-size-70:1.75rem;--b2b-size-80:2rem;--b2b-size-90:2.25rem;--b2b-size-100:2.5rem;--b2b-size-120:3rem;--b2b-size-140:3.5rem;--b2b-size-150:3.75rem;--b2b-size-160:4rem;--b2b-size-200:5rem;--b2b-color-error-50:var(--b2b-color-red-50);--b2b-color-background-box:var(--b2b-color-black-50);--b2b-color-background-card:var(--b2b-color-black-50);--b2b-color-background-page:var(--b2b-color-grey-100);--b2b-color-border-100:var(--b2b-color-white-100);--b2b-color-copy-default:var(--b2b-color-white-100);--b2b-color-copy-secondary:var(--b2b-color-grey-100);--b2b-color-copy-inverted:var(--b2b-color-black-100);--b2b-color-headline-title:var(--b2b-color-red-50);--b2b-color-headline-default:var(--b2b-color-white-100);--b2b-color-headline-inverted:var(--b2b-color-black-100);--b2b-color-icon-default:var(--b2b-color-white-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-inverted:var(--b2b-color-black-100)}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans.ttf\");font-weight:normal;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.ttf\") format(\"truetype\");font-weight:bold;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.ttf\") format(\"truetype\");font-weight:100;font-style:normal}@font-face{font-family:ObcIcons;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/obc-icons.woff\")}:root,:host{--b2b-border-radius:var(--b2b-size-border-radius-100);--b2b-button-secondary-background-color:var(--b2b-color-grey-50);--b2b-button-secondary-border-color:var(--b2b-color-grey-200);--b2b-button-secondary-hover-background-color:var(--b2b-color-grey-150);--b2b-border-right:1px solid var(--b2b-button-secondary-border-color)}:root [data-theme=dark],:host [data-theme=dark]{--b2b-button-secondary-background-color:var(--b2b-color-grey-300);--b2b-button-secondary-border-color:var(--b2b-color-grey-400);--b2b-button-secondary-hover-background-color:var(--b2b-color-grey-400)}:host button,:host a{align-items:center;height:2.25rem;box-sizing:border-box;display:inline-flex;margin:0;padding:0 var(--b2b-size-30);position:relative;text-align:center;text-decoration:none;user-select:none;cursor:pointer;font-family:var(--b2b-font-family-default);font-size:var(--b2b-size-copy-100);line-height:var(--b2b-size-copy-line-height-100);transition:background-color 0.3s ease;vertical-align:middle;border:none;border-radius:var(--b2b-border-radius)}:host button span,:host a span{display:flex;align-items:center}:host button.b2b-button--primary,:host a.b2b-button--primary{color:var(--b2b-color-white-100);background-color:var(--b2b-color-red-100);border:1px solid var(--b2b-color-red-100)}:host button.b2b-button--primary:hover,:host a.b2b-button--primary:hover{background-color:var(--b2b-color-red-200)}:host button.b2b-button--primary.loading::after,:host a.b2b-button--primary.loading::after{border:0.125rem solid rgba(var(--b2b-color-white-100), 0.5);border-top:0.125rem solid var(--b2b-color-red-100)}:host button.b2b-button--primary:active,:host a.b2b-button--primary:active{background-color:var(--b2b-color-red-250);border-color:var(--b2b-color-red-250)}:host button.b2b-button--secondary,:host a.b2b-button--secondary{color:var(--b2b-color-copy-default);background-color:var(--b2b-button-secondary-background-color);border:1px solid var(--b2b-button-secondary-border-color);border-right:var(--b2b-border-right)}:host button.b2b-button--secondary:hover,:host a.b2b-button--secondary:hover{background-color:var(--b2b-button-secondary-hover-background-color)}:host button.b2b-button--secondary.loading::after,:host a.b2b-button--secondary.loading::after{border:0.125rem solid rgba(var(--b2b-color-black-50), 0.2);border-top:0.125rem solid var(--b2b-color-copy-default)}:host button.b2b-button--secondary:active,:host a.b2b-button--secondary:active{background-color:var(--b2b-color-grey-200);border-color:var(--b2b-color-grey-200)}:host button:disabled,:host button.disabled,:host a:disabled,:host a.disabled{cursor:default;pointer-events:none;background-color:var(--b2b-color-grey-50);border:1px solid var(--b2b-color-grey-200);border-right:var(--b2b-border-right);color:var(--b2b-color-grey-250)}:host button:disabled [slot=start],:host button:disabled [slot=end],:host button.disabled [slot=start],:host button.disabled [slot=end],:host a:disabled [slot=start],:host a:disabled [slot=end],:host a.disabled [slot=start],:host a.disabled [slot=end]{fill:var(--b2b-color-grey-250)}:host button:focus,:host a:focus{z-index:10}:host(.b2b-button--loading) button,:host(.b2b-button--loading) a{color:transparent;position:relative;cursor:default;pointer-events:none}:host(.b2b-button--loading).b2b-button--primary::after,:host(.b2b-button--loading).b2b-button--primary:hover{color:var(--b2b-color-white-100)}:host(.b2b-button--loading).b2b-button--secondary::after,:host(.b2b-button--loading).b2b-button--secondary:hover{color:var(--b2b-color-copy-default)}:host(.b2b-button--loading) .b2b-button__spinner{box-sizing:border-box;display:inline;position:absolute !important;top:50%;left:50%;margin-top:-0.625rem;margin-left:-0.625rem}:host(.b2b-button--loading) [slot=start],:host(.b2b-button--loading) [slot=end]{visibility:hidden}:host(.b2b-button--50) button,:host(.b2b-button--50) a{height:1.875rem;max-width:100%}:host(.b2b-button--100) button,:host(.b2b-button--100) a{height:2.25rem}:host(.b2b-button--active) button,:host(.b2b-button--active) a{background-color:var(--b2b-color-black-100);color:var(--b2b-color-white-100);border:1px solid var(--b2b-button-secondary-border-color);border-right:var(--b2b-border-right)}:host(.b2b-button--active) button:hover,:host(.b2b-button--active) a:hover{background-color:var(--b2b-color-black-100)}:host(.b2b-button--icon-only) button,:host(.b2b-button--icon-only) a{padding:0 var(--b2b-size-20)}:host(.b2b-button--fit-container) button,:host(.b2b-button--fit-container) a{width:100%;display:inline-block}:host(.b2b-button--fit-container) span{display:inline-flex}:host(.b2b-button--custom) button,:host(.b2b-button--custom) a{width:inherit;display:inline-block}:host(.b2b-button--custom) span{display:inline-flex}::slotted(*[slot=start]){margin-right:var(--b2b-size-10)}::slotted(*[slot=end]){margin-left:var(--b2b-size-10)}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}";
|
|
8
|
+
const B2bButtonStyle0 = buttonCss;
|
|
6
9
|
|
|
7
10
|
const ButtonComponent = class {
|
|
8
11
|
constructor(hostRef) {
|
|
9
12
|
index.registerInstance(this, hostRef);
|
|
10
|
-
/** The button variant. If not specified, the button will be the secondary variant. */
|
|
11
|
-
this.variant = 'secondary';
|
|
12
|
-
/** The button type. Matches native HTML types. The default type is 'button'. */
|
|
13
|
-
this.type = 'button';
|
|
14
|
-
/** The size of the button, 100 is the default state */
|
|
15
|
-
this.size = '100';
|
|
16
|
-
/** The width of the button. Per default, it will fit the content */
|
|
17
|
-
this.width = 'fit-content';
|
|
18
|
-
/** Whether the button is disabled. */
|
|
19
|
-
this.disabled = false;
|
|
20
|
-
/** Whether the button is currently loading. Set to true to hide text and display loading spinner instead */
|
|
21
|
-
this.loading = false;
|
|
22
|
-
/** Whether the button is currently active. Set to true when using the button to signify a permanent active state */
|
|
23
|
-
this.active = false;
|
|
24
|
-
/** The target of the button if it should behave like an anchor. Per default it is self. */
|
|
25
|
-
this.target = 'self';
|
|
26
|
-
/** @internal Whether the parent input group is disabled. Per default, it is false. */
|
|
27
|
-
this.groupDisabled = false;
|
|
28
13
|
this.canLoad = () => {
|
|
29
14
|
return this.disabled === false && this.loading;
|
|
30
15
|
};
|
|
@@ -43,6 +28,17 @@ const ButtonComponent = class {
|
|
|
43
28
|
}
|
|
44
29
|
return false;
|
|
45
30
|
};
|
|
31
|
+
this.variant = 'secondary';
|
|
32
|
+
this.type = 'button';
|
|
33
|
+
this.size = '100';
|
|
34
|
+
this.width = 'fit-content';
|
|
35
|
+
this.disabled = false;
|
|
36
|
+
this.loading = false;
|
|
37
|
+
this.active = false;
|
|
38
|
+
this.href = undefined;
|
|
39
|
+
this.target = 'self';
|
|
40
|
+
this.download = undefined;
|
|
41
|
+
this.groupDisabled = false;
|
|
46
42
|
}
|
|
47
43
|
/** Manually set focus to button element */
|
|
48
44
|
async setFocus() {
|
|
@@ -72,7 +68,7 @@ const ButtonComponent = class {
|
|
|
72
68
|
return (index.h("div", { class: "b2b-button__spinner" }, index.h("b2b-spinner", { color: spinnerColor, size: "50" })));
|
|
73
69
|
}
|
|
74
70
|
render() {
|
|
75
|
-
return (index.h(index.Host, { key: '
|
|
71
|
+
return (index.h(index.Host, { key: '4050874af416fc23c0d67dc335aacb005f0d2279', class: {
|
|
76
72
|
[`b2b-button--loading`]: this.canLoad(),
|
|
77
73
|
[`b2b-button--${this.size}`]: true,
|
|
78
74
|
[`b2b-button--active`]: this.active,
|
|
@@ -85,27 +81,26 @@ const ButtonComponent = class {
|
|
|
85
81
|
}
|
|
86
82
|
get hostElement() { return index.getElement(this); }
|
|
87
83
|
};
|
|
88
|
-
ButtonComponent.style =
|
|
84
|
+
ButtonComponent.style = B2bButtonStyle0;
|
|
89
85
|
|
|
90
86
|
const spinnerCss = ":root,:host{--b2b-color-black-50:#333333;--b2b-color-black-100:#222222;--b2b-color-white-100:#FFFFFF;--b2b-color-grey-10:#F0F0F0;--b2b-color-grey-25:#F6F6F6;--b2b-color-grey-50:#EEEEEE;--b2b-color-grey-100:#E6E6E6;--b2b-color-grey-150:#D5D5D5;--b2b-color-grey-200:#C4C4C4;--b2b-color-grey-250:#B1B1B1;--b2b-color-grey-300:#9E9E9E;--b2b-color-grey-400:#777777;--b2b-color-red-50:#FFDDE3;--b2b-color-red-100:#D4021D;--b2b-color-red-150:#E6344B;--b2b-color-red-200:#BB0004;--b2b-color-red-250:#850012;--b2b-color-primary:#D4021D;--b2b-color-error-100:#E6344B;--b2b-color-warning-50:#FFD998;--b2b-color-warning-100:#FFB432;--b2b-color-success-50:#D6E0CC;--b2b-color-success-100:#326400;--b2b-color-info-50:#CCD6E0;--b2b-color-info-100:#003264;--b2b-color-hover-default:#E6F4FF;--b2b-color-hover-black:#3B3B3B;--b2b-color-background-overlay-transparent-80:#22222280;--b2b-color-background-overlay-transparent-40:#22222240;--b2b-color-table-selected-default:#CCE9FF;--b2b-color-table-expand-hover:#E6F4FF;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-font-weight-thin:100;--b2b-font-weight-normal:500;--b2b-font-weight-bold:700;--b2b-size-1:0.0625rem;--b2b-size-5:0.125rem;--b2b-size-7:0.1875rem;--b2b-size-10:0.25rem;--b2b-size-15:0.375rem;--b2b-size-20:0.5rem;--b2b-size-25:0.625rem;--b2b-size-30:0.75rem;--b2b-size-35:0.875rem;--b2b-size-40:1rem;--b2b-size-45:1.125rem;--b2b-size-50:1.25rem;--b2b-size-53:1.3125rem;--b2b-size-55:1.375rem;--b2b-size-60:1.5rem;--b2b-size-70:1.75rem;--b2b-size-80:2rem;--b2b-size-90:2.25rem;--b2b-size-100:2.5rem;--b2b-size-120:3rem;--b2b-size-140:3.5rem;--b2b-size-150:3.75rem;--b2b-size-160:4rem;--b2b-size-200:5rem;--b2b-color-error-50:var(--b2b-color-red-50);--b2b-color-background-page:var(--b2b-color-grey-10);--b2b-color-background-box:var(--b2b-color-white-100);--b2b-color-background-card:var(--b2b-color-white-100);--b2b-color-background-overlay:var(--b2b-color-black-100);--b2b-color-border-100:var(--b2b-color-grey-200);--b2b-color-copy-default:var(--b2b-color-black-100);--b2b-color-copy-secondary:var(--b2b-color-grey-400);--b2b-color-copy-inverted:var(--b2b-color-white-100);--b2b-color-copy-overlay:var(--b2b-color-white-100);--b2b-color-headline-title:var(--b2b-color-red-100);--b2b-color-headline-default:var(--b2b-color-black-100);--b2b-color-headline-inverted:var(--b2b-color-white-100);--b2b-color-icon-default:var(--b2b-color-black-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-inverted:var(--b2b-color-white-100);--b2b-color-table-expand-default:var(--b2b-color-grey-25);--b2b-size-icon-50:var(--b2b-size-40);--b2b-size-icon-100:var(--b2b-size-60);--b2b-size-icon-200:var(--b2b-size-80);--b2b-size-icon-400:var(--b2b-size-120);--b2b-size-space-25:var(--b2b-size-10);--b2b-size-space-50:var(--b2b-size-20);--b2b-size-space-75:var(--b2b-size-30);--b2b-size-space-100:var(--b2b-size-40);--b2b-size-space-150:var(--b2b-size-60);--b2b-size-space-175:var(--b2b-size-80);--b2b-size-space-200:var(--b2b-size-100);--b2b-size-space-250:var(--b2b-size-160);--b2b-size-space-300:var(--b2b-size-200);--b2b-size-padding-50:var(--b2b-size-20);--b2b-size-padding-100:var(--b2b-size-40);--b2b-size-padding-150:var(--b2b-size-60);--b2b-size-padding-175:var(--b2b-size-80);--b2b-size-border-width-50:var(--b2b-size-1);--b2b-size-border-width-100:var(--b2b-size-5);--b2b-size-border-width-150:var(--b2b-size-10);--b2b-size-border-radius-100:var(--b2b-size-7);--b2b-size-border-no-radius-left:0 var(--b2b-size-7) var(--b2b-size-7) 0;--b2b-size-border-no-radius-right:var(--b2b-size-7) 0 0 var(--b2b-size-7);--b2b-size-border-no-radius-top:0 0 var(--b2b-size-7) var(--b2b-size-7);--b2b-size-border-no-radius-bottom:var(--b2b-size-7) var(--b2b-size-7) 0 0;--b2b-size-copy-50:var(--b2b-size-30);--b2b-size-copy-100:var(--b2b-size-35);--b2b-size-copy-125:var(--b2b-size-40);--b2b-size-copy-200:var(--b2b-size-45);--b2b-size-copy-300:var(--b2b-size-60);--b2b-size-copy-line-height-50:var(--b2b-size-40);--b2b-size-copy-line-height-75:var(--b2b-size-45);--b2b-size-copy-line-height-100:var(--b2b-size-53);--b2b-size-copy-line-height-125:var(--b2b-size-60);--b2b-size-copy-line-height-200:var(--b2b-size-60);--b2b-size-copy-line-height-300:var(--b2b-size-90);--b2b-size-headline-100:var(--b2b-size-40);--b2b-size-headline-200:var(--b2b-size-45);--b2b-size-headline-400:var(--b2b-size-60);--b2b-size-headline-line-height-100:var(--b2b-size-60);--b2b-size-headline-line-height-200:var(--b2b-size-60);--b2b-size-headline-line-height-400:var(--b2b-size-60)}:root [data-theme=\"dark\"]{--b2b-color-black-50:#333333;--b2b-color-black-100:#222222;--b2b-color-white-100:#FFFFFF;--b2b-color-grey-10:#F0F0F0;--b2b-color-grey-25:#F6F6F6;--b2b-color-grey-50:#EEEEEE;--b2b-color-grey-100:#E6E6E6;--b2b-color-grey-150:#D5D5D5;--b2b-color-grey-200:#C4C4C4;--b2b-color-grey-250:#B1B1B1;--b2b-color-grey-300:#9E9E9E;--b2b-color-grey-400:#777777;--b2b-color-red-50:#FFDDE3;--b2b-color-red-100:#D4021D;--b2b-color-red-150:#E6344B;--b2b-color-red-200:#BB0004;--b2b-color-red-250:#850012;--b2b-color-primary:#D4021D;--b2b-color-error-100:#E6344B;--b2b-color-warning-50:#FFD998;--b2b-color-warning-100:#FFB432;--b2b-color-success-50:#D6E0CC;--b2b-color-success-100:#326400;--b2b-color-info-50:#CCD6E0;--b2b-color-info-100:#003264;--b2b-color-hover-default:#E6F4FF;--b2b-color-hover-black:#3B3B3B;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-font-weight-thin:100;--b2b-font-weight-normal:500;--b2b-font-weight-bold:700;--b2b-size-1:0.0625rem;--b2b-size-5:0.125rem;--b2b-size-7:0.1875rem;--b2b-size-10:0.25rem;--b2b-size-15:0.375rem;--b2b-size-20:0.5rem;--b2b-size-25:0.625rem;--b2b-size-30:0.75rem;--b2b-size-35:0.875rem;--b2b-size-40:1rem;--b2b-size-45:1.125rem;--b2b-size-50:1.25rem;--b2b-size-53:1.3125rem;--b2b-size-55:1.375rem;--b2b-size-60:1.5rem;--b2b-size-70:1.75rem;--b2b-size-80:2rem;--b2b-size-90:2.25rem;--b2b-size-100:2.5rem;--b2b-size-120:3rem;--b2b-size-140:3.5rem;--b2b-size-150:3.75rem;--b2b-size-160:4rem;--b2b-size-200:5rem;--b2b-color-error-50:var(--b2b-color-red-50);--b2b-color-background-box:var(--b2b-color-black-50);--b2b-color-background-card:var(--b2b-color-black-50);--b2b-color-background-page:var(--b2b-color-grey-100);--b2b-color-border-100:var(--b2b-color-white-100);--b2b-color-copy-default:var(--b2b-color-white-100);--b2b-color-copy-secondary:var(--b2b-color-grey-100);--b2b-color-copy-inverted:var(--b2b-color-black-100);--b2b-color-headline-title:var(--b2b-color-red-50);--b2b-color-headline-default:var(--b2b-color-white-100);--b2b-color-headline-inverted:var(--b2b-color-black-100);--b2b-color-icon-default:var(--b2b-color-white-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-inverted:var(--b2b-color-black-100)}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans.ttf\");font-weight:normal;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.ttf\") format(\"truetype\");font-weight:bold;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.ttf\") format(\"truetype\");font-weight:100;font-style:normal}@font-face{font-family:ObcIcons;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/obc-icons.woff\")}.b2b-spinner{box-sizing:border-box;border-radius:50%;display:inline-block;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.b2b-spinner--color-primary{border:var(--b2b-size-10) solid var(--b2b-color-grey-100);border-top:var(--b2b-size-10) solid var(--b2b-color-grey-300)}.b2b-spinner--color-inverse{border:var(--b2b-size-10) solid rgba(255, 255, 255, 0.5);border-top:var(--b2b-size-10) solid var(--b2b-color-white-100)}.b2b-spinner--color-secondary{border:var(--b2b-size-10) solid var(--b2b-color-grey-200);border-top:var(--b2b-size-10) solid var(--b2b-color-grey-400)}.b2b-spinner--size-50{width:var(--b2b-size-50);height:var(--b2b-size-50);border-width:var(--b2b-size-7)}.b2b-spinner--size-100{width:var(--b2b-size-90);height:var(--b2b-size-90)}.b2b-spinner--size-200{width:var(--b2b-size-150);height:var(--b2b-size-150)}";
|
|
87
|
+
const B2bSpinnerStyle0 = spinnerCss;
|
|
91
88
|
|
|
92
89
|
const SpinnerComponent = class {
|
|
93
90
|
constructor(hostRef) {
|
|
94
91
|
index.registerInstance(this, hostRef);
|
|
95
|
-
/** The size of the spinner. */
|
|
96
92
|
this.size = '100';
|
|
97
|
-
/** The color of the spinner. */
|
|
98
93
|
this.color = 'primary';
|
|
99
94
|
}
|
|
100
95
|
render() {
|
|
101
|
-
return (index.h("div", { key: '
|
|
96
|
+
return (index.h("div", { key: '4260cc2e742b9d3a77fc1739f7de248ee70ffd69', class: {
|
|
102
97
|
'b2b-spinner': true,
|
|
103
98
|
['b2b-spinner--size-' + this.size]: true,
|
|
104
99
|
['b2b-spinner--color-' + this.color]: true,
|
|
105
100
|
} }));
|
|
106
101
|
}
|
|
107
102
|
};
|
|
108
|
-
SpinnerComponent.style =
|
|
103
|
+
SpinnerComponent.style = B2bSpinnerStyle0;
|
|
109
104
|
|
|
110
105
|
exports.b2b_button = ButtonComponent;
|
|
111
106
|
exports.b2b_spinner = SpinnerComponent;
|
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
const index = require('./index-668808fd.js');
|
|
4
6
|
|
|
5
7
|
const cardCss = ":root,:host{--b2b-color-black-50:#333333;--b2b-color-black-100:#222222;--b2b-color-white-100:#FFFFFF;--b2b-color-grey-10:#F0F0F0;--b2b-color-grey-25:#F6F6F6;--b2b-color-grey-50:#EEEEEE;--b2b-color-grey-100:#E6E6E6;--b2b-color-grey-150:#D5D5D5;--b2b-color-grey-200:#C4C4C4;--b2b-color-grey-250:#B1B1B1;--b2b-color-grey-300:#9E9E9E;--b2b-color-grey-400:#777777;--b2b-color-red-50:#FFDDE3;--b2b-color-red-100:#D4021D;--b2b-color-red-150:#E6344B;--b2b-color-red-200:#BB0004;--b2b-color-red-250:#850012;--b2b-color-primary:#D4021D;--b2b-color-error-100:#E6344B;--b2b-color-warning-50:#FFD998;--b2b-color-warning-100:#FFB432;--b2b-color-success-50:#D6E0CC;--b2b-color-success-100:#326400;--b2b-color-info-50:#CCD6E0;--b2b-color-info-100:#003264;--b2b-color-hover-default:#E6F4FF;--b2b-color-hover-black:#3B3B3B;--b2b-color-background-overlay-transparent-80:#22222280;--b2b-color-background-overlay-transparent-40:#22222240;--b2b-color-table-selected-default:#CCE9FF;--b2b-color-table-expand-hover:#E6F4FF;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-font-weight-thin:100;--b2b-font-weight-normal:500;--b2b-font-weight-bold:700;--b2b-size-1:0.0625rem;--b2b-size-5:0.125rem;--b2b-size-7:0.1875rem;--b2b-size-10:0.25rem;--b2b-size-15:0.375rem;--b2b-size-20:0.5rem;--b2b-size-25:0.625rem;--b2b-size-30:0.75rem;--b2b-size-35:0.875rem;--b2b-size-40:1rem;--b2b-size-45:1.125rem;--b2b-size-50:1.25rem;--b2b-size-53:1.3125rem;--b2b-size-55:1.375rem;--b2b-size-60:1.5rem;--b2b-size-70:1.75rem;--b2b-size-80:2rem;--b2b-size-90:2.25rem;--b2b-size-100:2.5rem;--b2b-size-120:3rem;--b2b-size-140:3.5rem;--b2b-size-150:3.75rem;--b2b-size-160:4rem;--b2b-size-200:5rem;--b2b-color-error-50:var(--b2b-color-red-50);--b2b-color-background-page:var(--b2b-color-grey-10);--b2b-color-background-box:var(--b2b-color-white-100);--b2b-color-background-card:var(--b2b-color-white-100);--b2b-color-background-overlay:var(--b2b-color-black-100);--b2b-color-border-100:var(--b2b-color-grey-200);--b2b-color-copy-default:var(--b2b-color-black-100);--b2b-color-copy-secondary:var(--b2b-color-grey-400);--b2b-color-copy-inverted:var(--b2b-color-white-100);--b2b-color-copy-overlay:var(--b2b-color-white-100);--b2b-color-headline-title:var(--b2b-color-red-100);--b2b-color-headline-default:var(--b2b-color-black-100);--b2b-color-headline-inverted:var(--b2b-color-white-100);--b2b-color-icon-default:var(--b2b-color-black-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-inverted:var(--b2b-color-white-100);--b2b-color-table-expand-default:var(--b2b-color-grey-25);--b2b-size-icon-50:var(--b2b-size-40);--b2b-size-icon-100:var(--b2b-size-60);--b2b-size-icon-200:var(--b2b-size-80);--b2b-size-icon-400:var(--b2b-size-120);--b2b-size-space-25:var(--b2b-size-10);--b2b-size-space-50:var(--b2b-size-20);--b2b-size-space-75:var(--b2b-size-30);--b2b-size-space-100:var(--b2b-size-40);--b2b-size-space-150:var(--b2b-size-60);--b2b-size-space-175:var(--b2b-size-80);--b2b-size-space-200:var(--b2b-size-100);--b2b-size-space-250:var(--b2b-size-160);--b2b-size-space-300:var(--b2b-size-200);--b2b-size-padding-50:var(--b2b-size-20);--b2b-size-padding-100:var(--b2b-size-40);--b2b-size-padding-150:var(--b2b-size-60);--b2b-size-padding-175:var(--b2b-size-80);--b2b-size-border-width-50:var(--b2b-size-1);--b2b-size-border-width-100:var(--b2b-size-5);--b2b-size-border-width-150:var(--b2b-size-10);--b2b-size-border-radius-100:var(--b2b-size-7);--b2b-size-border-no-radius-left:0 var(--b2b-size-7) var(--b2b-size-7) 0;--b2b-size-border-no-radius-right:var(--b2b-size-7) 0 0 var(--b2b-size-7);--b2b-size-border-no-radius-top:0 0 var(--b2b-size-7) var(--b2b-size-7);--b2b-size-border-no-radius-bottom:var(--b2b-size-7) var(--b2b-size-7) 0 0;--b2b-size-copy-50:var(--b2b-size-30);--b2b-size-copy-100:var(--b2b-size-35);--b2b-size-copy-125:var(--b2b-size-40);--b2b-size-copy-200:var(--b2b-size-45);--b2b-size-copy-300:var(--b2b-size-60);--b2b-size-copy-line-height-50:var(--b2b-size-40);--b2b-size-copy-line-height-75:var(--b2b-size-45);--b2b-size-copy-line-height-100:var(--b2b-size-53);--b2b-size-copy-line-height-125:var(--b2b-size-60);--b2b-size-copy-line-height-200:var(--b2b-size-60);--b2b-size-copy-line-height-300:var(--b2b-size-90);--b2b-size-headline-100:var(--b2b-size-40);--b2b-size-headline-200:var(--b2b-size-45);--b2b-size-headline-400:var(--b2b-size-60);--b2b-size-headline-line-height-100:var(--b2b-size-60);--b2b-size-headline-line-height-200:var(--b2b-size-60);--b2b-size-headline-line-height-400:var(--b2b-size-60)}:root [data-theme=\"dark\"]{--b2b-color-black-50:#333333;--b2b-color-black-100:#222222;--b2b-color-white-100:#FFFFFF;--b2b-color-grey-10:#F0F0F0;--b2b-color-grey-25:#F6F6F6;--b2b-color-grey-50:#EEEEEE;--b2b-color-grey-100:#E6E6E6;--b2b-color-grey-150:#D5D5D5;--b2b-color-grey-200:#C4C4C4;--b2b-color-grey-250:#B1B1B1;--b2b-color-grey-300:#9E9E9E;--b2b-color-grey-400:#777777;--b2b-color-red-50:#FFDDE3;--b2b-color-red-100:#D4021D;--b2b-color-red-150:#E6344B;--b2b-color-red-200:#BB0004;--b2b-color-red-250:#850012;--b2b-color-primary:#D4021D;--b2b-color-error-100:#E6344B;--b2b-color-warning-50:#FFD998;--b2b-color-warning-100:#FFB432;--b2b-color-success-50:#D6E0CC;--b2b-color-success-100:#326400;--b2b-color-info-50:#CCD6E0;--b2b-color-info-100:#003264;--b2b-color-hover-default:#E6F4FF;--b2b-color-hover-black:#3B3B3B;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-font-weight-thin:100;--b2b-font-weight-normal:500;--b2b-font-weight-bold:700;--b2b-size-1:0.0625rem;--b2b-size-5:0.125rem;--b2b-size-7:0.1875rem;--b2b-size-10:0.25rem;--b2b-size-15:0.375rem;--b2b-size-20:0.5rem;--b2b-size-25:0.625rem;--b2b-size-30:0.75rem;--b2b-size-35:0.875rem;--b2b-size-40:1rem;--b2b-size-45:1.125rem;--b2b-size-50:1.25rem;--b2b-size-53:1.3125rem;--b2b-size-55:1.375rem;--b2b-size-60:1.5rem;--b2b-size-70:1.75rem;--b2b-size-80:2rem;--b2b-size-90:2.25rem;--b2b-size-100:2.5rem;--b2b-size-120:3rem;--b2b-size-140:3.5rem;--b2b-size-150:3.75rem;--b2b-size-160:4rem;--b2b-size-200:5rem;--b2b-color-error-50:var(--b2b-color-red-50);--b2b-color-background-box:var(--b2b-color-black-50);--b2b-color-background-card:var(--b2b-color-black-50);--b2b-color-background-page:var(--b2b-color-grey-100);--b2b-color-border-100:var(--b2b-color-white-100);--b2b-color-copy-default:var(--b2b-color-white-100);--b2b-color-copy-secondary:var(--b2b-color-grey-100);--b2b-color-copy-inverted:var(--b2b-color-black-100);--b2b-color-headline-title:var(--b2b-color-red-50);--b2b-color-headline-default:var(--b2b-color-white-100);--b2b-color-headline-inverted:var(--b2b-color-black-100);--b2b-color-icon-default:var(--b2b-color-white-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-inverted:var(--b2b-color-black-100)}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans.ttf\");font-weight:normal;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.ttf\") format(\"truetype\");font-weight:bold;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.ttf\") format(\"truetype\");font-weight:100;font-style:normal}@font-face{font-family:ObcIcons;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/obc-icons.woff\")}:host{width:100%;cursor:pointer;display:block;overflow:hidden;box-sizing:border-box;box-shadow:var(--b2b-size-5) var(--b2b-size-5) 5px rgba(0, 0, 0, 0.15);padding:var(--b2b-size-45) var(--b2b-size-60) var(--b2b-size-60);background:var(--b2b-color-white-100);border:var(--b2b-size-1) solid var(--b2b-color-grey-100);border-radius:var(--b2b-size-25);position:relative}:host a{width:100%;height:100%;display:block;position:absolute;top:0;left:0}:host(.b2b-card:hover),:host(.b2b-card:focus){box-shadow:5px 5px var(--b2b-size-15) rgba(0, 0, 0, 0.15);transition:box-shadow 0.2s ease-in-out;outline:none}:host(.b2b-card:focus){outline:2px solid -webkit-focus-ring-color;outline-offset:-1px;z-index:9999}:host(.b2b-card--disabled){pointer-events:none;background:var(--b2b-color-grey-25);color:var(--b2b-color-grey-400)}:host(.b2b-card--disabled) .b2b-card--disabled-overlay{position:absolute;top:0;left:0;background-color:var(--b2b-color-grey-25);opacity:0.5;width:100%;height:100%}";
|
|
8
|
+
const B2bCardStyle0 = cardCss;
|
|
6
9
|
|
|
7
10
|
const CardComponent = class {
|
|
8
11
|
constructor(hostRef) {
|
|
9
12
|
index.registerInstance(this, hostRef);
|
|
10
|
-
this.b2bChange = index.createEvent(this, "b2b-selected");
|
|
11
|
-
/** Disables the card. Per default, it is false */
|
|
13
|
+
this.b2bChange = index.createEvent(this, "b2b-selected", 7);
|
|
12
14
|
this.disabled = false;
|
|
13
|
-
/** An optional href in case the card is used to redirect on click. */
|
|
14
15
|
this.href = '';
|
|
15
|
-
/** The target of the card if used with an href. Blank per default. */
|
|
16
16
|
this.target = 'blank';
|
|
17
17
|
}
|
|
18
18
|
onClick() {
|
|
@@ -36,13 +36,13 @@ const CardComponent = class {
|
|
|
36
36
|
return 0;
|
|
37
37
|
}
|
|
38
38
|
render() {
|
|
39
|
-
return (index.h(index.Host, { key: '
|
|
39
|
+
return (index.h(index.Host, { key: 'f9fd7890d85a2c69fb416cacd1038a3e50ba8ce2', tabIndex: this.getTabIndex(), "aria-disabled": this.disabled ? 'true' : null, class: {
|
|
40
40
|
'b2b-card': true,
|
|
41
41
|
'b2b-card--disabled': this.disabled,
|
|
42
|
-
} }, this.href != '' && index.h("a", {
|
|
42
|
+
} }, this.href != '' && index.h("a", { href: this.href, target: `_${this.target}` }), this.disabled && index.h("div", { class: "b2b-card--disabled-overlay" }), index.h("slot", { key: '1258394d2cf138a0625c70af043d4590a45262db' })));
|
|
43
43
|
}
|
|
44
44
|
get host() { return index.getElement(this); }
|
|
45
45
|
};
|
|
46
|
-
CardComponent.style =
|
|
46
|
+
CardComponent.style = B2bCardStyle0;
|
|
47
47
|
|
|
48
48
|
exports.b2b_card = CardComponent;
|