@otto-de/b2b-core-components 1.33.0 → 1.34.0
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-28a06853.entry.js → p-04ac661d.entry.js} +1 -1
- package/dist/b2b-core-components/{p-57842105.entry.js → p-04f5748b.entry.js} +1 -1
- package/dist/b2b-core-components/{p-2d625559.entry.js → p-0648230f.entry.js} +1 -1
- package/dist/b2b-core-components/{p-0bd177d4.entry.js → p-0aa0c59a.entry.js} +1 -1
- package/dist/b2b-core-components/{p-7df12ddf.entry.js → p-0ab41eb5.entry.js} +1 -1
- package/dist/b2b-core-components/{p-e7590b6e.entry.js → p-13d37dec.entry.js} +1 -1
- package/dist/b2b-core-components/{p-bf9c8817.entry.js → p-17778cfc.entry.js} +1 -1
- package/dist/b2b-core-components/p-1af4d133.entry.js +1 -0
- package/dist/b2b-core-components/{p-fc431bbe.entry.js → p-2486830b.entry.js} +1 -1
- package/dist/b2b-core-components/p-2488ef54.entry.js +1 -0
- package/dist/b2b-core-components/{p-6abfdb73.entry.js → p-260dcc05.entry.js} +1 -1
- package/dist/b2b-core-components/{p-797c85c2.entry.js → p-371df3f8.entry.js} +1 -1
- package/dist/b2b-core-components/p-3c3edafd.entry.js +1 -0
- package/dist/b2b-core-components/p-3d8e14e6.entry.js +1 -0
- package/dist/b2b-core-components/{p-521303c4.entry.js → p-433a3f3e.entry.js} +1 -1
- package/dist/b2b-core-components/{p-fb0338a8.entry.js → p-4b27240b.entry.js} +1 -1
- package/dist/b2b-core-components/p-4e0ed246.entry.js +1 -0
- package/dist/b2b-core-components/p-5f3ba5e6.js +1 -0
- package/dist/b2b-core-components/{p-6749d668.entry.js → p-66c435c1.entry.js} +1 -1
- package/dist/b2b-core-components/{p-db92de92.entry.js → p-79a01d0d.entry.js} +1 -1
- package/dist/b2b-core-components/{p-092855b3.entry.js → p-81cffff6.entry.js} +1 -1
- package/dist/b2b-core-components/p-89e817e9.entry.js +1 -0
- package/dist/b2b-core-components/{p-26755654.entry.js → p-8aba659a.entry.js} +1 -1
- package/dist/b2b-core-components/{p-0322b052.entry.js → p-8ae9c2fe.entry.js} +1 -1
- package/dist/b2b-core-components/{p-16872771.entry.js → p-997a232e.entry.js} +1 -1
- package/dist/b2b-core-components/{p-2daee203.entry.js → p-a46674a7.entry.js} +1 -1
- package/dist/b2b-core-components/{p-848e4af7.entry.js → p-a9c9552f.entry.js} +1 -1
- package/dist/b2b-core-components/{p-1abe3f2f.entry.js → p-b175fb79.entry.js} +1 -1
- package/dist/b2b-core-components/{p-bade1cab.entry.js → p-b4310b58.entry.js} +1 -1
- package/dist/b2b-core-components/p-b481eb09.entry.js +1 -0
- package/dist/b2b-core-components/{p-40371f89.entry.js → p-b9a6ad5d.entry.js} +1 -1
- package/dist/b2b-core-components/{p-01f46118.entry.js → p-c086532b.entry.js} +1 -1
- package/dist/b2b-core-components/{p-58e9953b.entry.js → p-c25832e1.entry.js} +1 -1
- package/dist/b2b-core-components/{p-ff6a0874.entry.js → p-c43e067a.entry.js} +1 -1
- package/dist/b2b-core-components/{p-76573f9f.entry.js → p-c8b5c7e2.entry.js} +1 -1
- package/dist/b2b-core-components/{p-190a7350.entry.js → p-c8cc1797.entry.js} +1 -1
- package/dist/b2b-core-components/{p-ed5c6006.entry.js → p-d163d252.entry.js} +1 -1
- package/dist/b2b-core-components/{p-dcef84a5.entry.js → p-d2f4db88.entry.js} +1 -1
- package/dist/b2b-core-components/{p-fedefca2.entry.js → p-d62e615b.entry.js} +1 -1
- package/dist/b2b-core-components/p-d97a7119.entry.js +1 -0
- package/dist/b2b-core-components/p-dff37884.entry.js +1 -0
- package/dist/b2b-core-components/{p-b1191aa7.entry.js → p-e3877fc1.entry.js} +1 -1
- package/dist/b2b-core-components/{p-e2518c43.entry.js → p-e512628d.entry.js} +1 -1
- package/dist/b2b-core-components/p-e8151556.entry.js +1 -0
- package/dist/b2b-core-components/p-e90d3aba.entry.js +1 -0
- package/dist/b2b-core-components/{p-3a088f2b.entry.js → p-f3c0fe56.entry.js} +1 -1
- package/dist/b2b-core-components/{p-840dd6cd.entry.js → p-f4f20944.entry.js} +1 -1
- package/dist/b2b-core-components/{p-ef598009.entry.js → p-f9f9820a.entry.js} +1 -1
- package/dist/cjs/b2b-button_2.cjs.entry.js +1 -1
- package/dist/cjs/b2b-chip-component_2.cjs.entry.js +2 -2
- package/dist/cjs/b2b-core-components.cjs.js +1 -1
- package/dist/cjs/{b2b-date-picker-days_5.cjs.entry.js → b2b-date-picker-days-header_4.cjs.entry.js} +0 -174
- package/dist/cjs/b2b-date-picker-days.cjs.entry.js +180 -0
- package/dist/cjs/b2b-date-picker.cjs.entry.js +1 -1
- package/dist/cjs/b2b-date-range-picker-days_2.cjs.entry.js +201 -0
- package/dist/cjs/b2b-date-range-picker.cjs.entry.js +159 -0
- package/dist/cjs/b2b-dropdown.cjs.entry.js +28 -24
- package/dist/cjs/b2b-flyout-menu-option.cjs.entry.js +1 -1
- package/dist/cjs/b2b-flyout-menu.cjs.entry.js +3 -3
- package/dist/cjs/b2b-grid-col.cjs.entry.js +1 -1
- package/dist/cjs/b2b-grid-row.cjs.entry.js +2 -2
- package/dist/cjs/b2b-grid.cjs.entry.js +1 -1
- package/dist/cjs/b2b-icon-100.cjs.entry.js +0 -1
- package/dist/cjs/b2b-input-group_2.cjs.entry.js +3 -3
- package/dist/cjs/b2b-input-label.cjs.entry.js +2 -2
- package/dist/cjs/b2b-input_2.cjs.entry.js +5 -5
- package/dist/cjs/b2b-label.cjs.entry.js +2 -2
- package/dist/cjs/b2b-modal.cjs.entry.js +2 -2
- package/dist/cjs/b2b-multiselect-dropdown.cjs.entry.js +3 -3
- package/dist/cjs/b2b-pagination.cjs.entry.js +1 -1
- package/dist/cjs/b2b-progress-bar.cjs.entry.js +3 -3
- package/dist/cjs/b2b-radio-button.cjs.entry.js +2 -2
- package/dist/cjs/b2b-radio-group.cjs.entry.js +2 -2
- package/dist/cjs/b2b-required-separator.cjs.entry.js +1 -1
- package/dist/cjs/b2b-rounded-icon.cjs.entry.js +4 -4
- package/dist/cjs/b2b-scrollable-container.cjs.entry.js +1 -1
- package/dist/cjs/b2b-search.cjs.entry.js +1 -1
- package/dist/cjs/b2b-separator.cjs.entry.js +1 -1
- package/dist/cjs/b2b-shimmer.cjs.entry.js +1 -1
- package/dist/cjs/b2b-snackbar.cjs.entry.js +4 -4
- package/dist/cjs/b2b-tab-group.cjs.entry.js +1 -1
- package/dist/cjs/b2b-tab-panel.cjs.entry.js +1 -1
- package/dist/cjs/b2b-tab.cjs.entry.js +2 -2
- package/dist/cjs/b2b-table-cell_2.cjs.entry.js +3 -3
- package/dist/cjs/b2b-table-row.cjs.entry.js +2 -2
- package/dist/cjs/b2b-table-rowgroup.cjs.entry.js +2 -2
- package/dist/cjs/b2b-table.cjs.entry.js +2 -2
- package/dist/cjs/b2b-textarea.cjs.entry.js +2 -2
- package/dist/cjs/b2b-toggle-button.cjs.entry.js +3 -3
- package/dist/cjs/b2b-toggle-chip.cjs.entry.js +3 -3
- package/dist/cjs/b2b-toggle-group.cjs.entry.js +2 -2
- package/dist/cjs/b2b-toggle-switch.cjs.entry.js +5 -5
- package/dist/cjs/b2b-tooltip.cjs.entry.js +3 -3
- package/dist/cjs/b2b-wizard-icon.cjs.entry.js +1 -1
- package/dist/cjs/b2b-wizard-step.cjs.entry.js +2 -2
- package/dist/cjs/b2b-wizard.cjs.entry.js +1 -1
- package/dist/cjs/date-range-picker-utils-f4b4f5bf.js +135 -0
- package/dist/cjs/index-668808fd.js +14 -6
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +3 -1
- package/dist/collection/components/date-picker/date-picker.css +1 -1
- package/dist/collection/components/date-picker/date-picker.js +2 -2
- package/dist/collection/components/date-range-picker/date-range-picker-days.css +280 -0
- package/dist/collection/components/date-range-picker/date-range-picker-days.e2e.js +19 -0
- package/dist/collection/components/date-range-picker/date-range-picker-days.js +349 -0
- package/dist/collection/components/date-range-picker/date-range-picker-utils.js +126 -0
- package/dist/collection/components/date-range-picker/date-range-picker-utils.spec.js +189 -0
- package/dist/collection/components/date-range-picker/date-range-picker.css +327 -0
- package/dist/collection/components/date-range-picker/date-range-picker.e2e.js +45 -0
- package/dist/collection/components/date-range-picker/date-range-picker.js +466 -0
- package/dist/collection/components/date-range-picker/date-range-picker.spec.js +18 -0
- package/dist/collection/components/date-range-picker/date-range-picker.stories.js +131 -0
- package/dist/collection/components/dropdown/dropdown.js +30 -25
- package/dist/collection/components/flyout-menu/flyout-menu-option.js +1 -1
- package/dist/collection/components/flyout-menu/flyout-menu.js +3 -3
- package/dist/collection/components/grid/column.js +1 -1
- package/dist/collection/components/grid/grid.js +1 -1
- package/dist/collection/components/grid/row.js +2 -2
- package/dist/collection/components/icon-100/icon-100.stories.js +1 -1
- package/dist/collection/components/icon-100/types.js +0 -1
- package/dist/collection/components/input/input.js +4 -4
- package/dist/collection/components/input-group/input-group.js +1 -1
- package/dist/collection/components/input-label/input-label.js +2 -2
- package/dist/collection/components/input-list/input-list-option.js +1 -1
- package/dist/collection/components/input-list/input-list.js +2 -2
- package/dist/collection/components/label/label.js +2 -2
- package/dist/collection/components/modal/modal.js +2 -2
- package/dist/collection/components/multiselect-dropdown/multiselect-dropdown.js +3 -3
- package/dist/collection/components/multiselect-dropdown/multiselect-option/multiselect-option.js +2 -2
- package/dist/collection/components/pagination/pagination.js +1 -1
- package/dist/collection/components/paragraph/paragraph.js +2 -2
- package/dist/collection/components/progress-bar/progress-bar.js +3 -3
- package/dist/collection/components/radio/radio.js +2 -2
- package/dist/collection/components/radio-group/radio-group.js +2 -2
- package/dist/collection/components/required-separator/required-separator.js +1 -1
- package/dist/collection/components/rounded-icon/rounded-icon.js +4 -4
- package/dist/collection/components/scrollable-container/scrollable-container.js +1 -1
- package/dist/collection/components/search/search.js +1 -1
- package/dist/collection/components/separator/separator.js +1 -1
- package/dist/collection/components/shimmer/shimmer.js +1 -1
- package/dist/collection/components/snackbar/snackbar.js +5 -5
- package/dist/collection/components/spinner/spinner.js +1 -1
- package/dist/collection/components/tab/tab.js +2 -2
- package/dist/collection/components/tab-group/tab-group.js +1 -1
- package/dist/collection/components/tab-panel/tab-panel.js +1 -1
- package/dist/collection/components/table/table-cell/table-cell.js +2 -2
- package/dist/collection/components/table/table-header/table-header.js +1 -1
- package/dist/collection/components/table/table-row/table-row.js +2 -2
- package/dist/collection/components/table/table-rowgroup/table-rowgroup.js +2 -2
- package/dist/collection/components/table/table.js +2 -2
- package/dist/collection/components/textarea/textarea.js +2 -2
- package/dist/collection/components/toggle-button/toggle-button.js +3 -3
- package/dist/collection/components/toggle-chip/toggle-chip.js +3 -3
- package/dist/collection/components/toggle-group/toggle-group.js +2 -2
- package/dist/collection/components/toggle-switch/toggle-switch.css +1 -1
- package/dist/collection/components/toggle-switch/toggle-switch.js +4 -4
- package/dist/collection/components/toggle-switch/toggle-switch.stories.js +15 -9
- package/dist/collection/components/tooltip/tooltip.js +3 -3
- package/dist/collection/components/wizard/wizard-step.js +2 -2
- package/dist/collection/components/wizard/wizard.js +1 -1
- package/dist/collection/components/wizard-icon/wizard-icon.js +1 -1
- package/dist/collection/docs/config/utils.js +10 -7
- package/dist/components/b2b-date-picker.js +1 -1
- package/dist/components/b2b-date-range-picker-days.d.ts +11 -0
- package/dist/components/b2b-date-range-picker-days.js +6 -0
- package/dist/components/b2b-date-range-picker.d.ts +11 -0
- package/dist/components/b2b-date-range-picker.js +246 -0
- package/dist/components/b2b-dropdown.js +29 -24
- package/dist/components/b2b-flyout-menu-option.js +1 -1
- package/dist/components/b2b-flyout-menu.js +3 -3
- package/dist/components/b2b-grid-col.js +1 -1
- package/dist/components/b2b-grid-row.js +2 -2
- package/dist/components/b2b-grid.js +1 -1
- package/dist/components/b2b-label.js +2 -2
- package/dist/components/b2b-modal.js +2 -2
- package/dist/components/b2b-multiselect-dropdown.js +3 -3
- package/dist/components/b2b-pagination.js +1 -1
- package/dist/components/b2b-paragraph.js +1 -51
- package/dist/components/b2b-progress-bar.js +3 -3
- package/dist/components/b2b-radio-button.js +2 -2
- package/dist/components/b2b-radio-group.js +2 -2
- package/dist/components/b2b-required-separator.js +1 -1
- package/dist/components/b2b-scrollable-container.js +1 -1
- package/dist/components/b2b-search.js +1 -1
- package/dist/components/b2b-shimmer.js +1 -1
- package/dist/components/b2b-snackbar.js +4 -4
- package/dist/components/b2b-tab-group.js +1 -1
- package/dist/components/b2b-tab-panel.js +1 -1
- package/dist/components/b2b-tab.js +2 -2
- package/dist/components/b2b-table-row.js +2 -2
- package/dist/components/b2b-table-rowgroup.js +2 -2
- package/dist/components/b2b-table.js +2 -2
- package/dist/components/b2b-textarea.js +2 -2
- package/dist/components/b2b-toggle-button.js +3 -3
- package/dist/components/b2b-toggle-chip.js +3 -3
- package/dist/components/b2b-toggle-group.js +2 -2
- package/dist/components/b2b-toggle-switch.js +5 -5
- package/dist/components/b2b-tooltip.js +3 -3
- package/dist/components/b2b-wizard-step.js +2 -2
- package/dist/components/b2b-wizard.js +1 -1
- package/dist/components/date-range-picker-days.js +316 -0
- package/dist/components/icon-100.js +0 -1
- package/dist/components/input-group.js +1 -1
- package/dist/components/input-label.js +2 -2
- package/dist/components/input-list-option.js +1 -1
- package/dist/components/input-list.js +2 -2
- package/dist/components/input.js +4 -4
- package/dist/components/multiselect-option.js +2 -2
- package/dist/{cjs/b2b-paragraph.cjs.entry.js → components/paragraph.js} +31 -13
- package/dist/components/rounded-icon.js +4 -4
- package/dist/components/separator.js +1 -1
- package/dist/components/spinner.js +1 -1
- package/dist/components/table-cell.js +2 -2
- package/dist/components/table-header.js +1 -1
- package/dist/components/wizard-icon.js +1 -1
- package/dist/custom-elements.json +70 -0
- package/dist/esm/b2b-button_2.entry.js +1 -1
- package/dist/esm/b2b-chip-component_2.entry.js +2 -2
- package/dist/esm/b2b-core-components.js +1 -1
- package/dist/esm/{b2b-date-picker-days_5.entry.js → b2b-date-picker-days-header_4.entry.js} +2 -175
- package/dist/esm/b2b-date-picker-days.entry.js +176 -0
- package/dist/esm/b2b-date-picker.entry.js +1 -1
- package/dist/esm/b2b-date-range-picker-days_2.entry.js +196 -0
- package/dist/esm/b2b-date-range-picker.entry.js +155 -0
- package/dist/esm/b2b-dropdown.entry.js +28 -24
- package/dist/esm/b2b-flyout-menu-option.entry.js +1 -1
- package/dist/esm/b2b-flyout-menu.entry.js +3 -3
- package/dist/esm/b2b-grid-col.entry.js +1 -1
- package/dist/esm/b2b-grid-row.entry.js +2 -2
- package/dist/esm/b2b-grid.entry.js +1 -1
- package/dist/esm/b2b-icon-100.entry.js +0 -1
- package/dist/esm/b2b-input-group_2.entry.js +3 -3
- package/dist/esm/b2b-input-label.entry.js +2 -2
- package/dist/esm/b2b-input_2.entry.js +5 -5
- package/dist/esm/b2b-label.entry.js +2 -2
- package/dist/esm/b2b-modal.entry.js +2 -2
- package/dist/esm/b2b-multiselect-dropdown.entry.js +3 -3
- package/dist/esm/b2b-pagination.entry.js +1 -1
- package/dist/esm/b2b-progress-bar.entry.js +3 -3
- package/dist/esm/b2b-radio-button.entry.js +2 -2
- package/dist/esm/b2b-radio-group.entry.js +2 -2
- package/dist/esm/b2b-required-separator.entry.js +1 -1
- package/dist/esm/b2b-rounded-icon.entry.js +4 -4
- package/dist/esm/b2b-scrollable-container.entry.js +1 -1
- package/dist/esm/b2b-search.entry.js +1 -1
- package/dist/esm/b2b-separator.entry.js +1 -1
- package/dist/esm/b2b-shimmer.entry.js +1 -1
- package/dist/esm/b2b-snackbar.entry.js +4 -4
- package/dist/esm/b2b-tab-group.entry.js +1 -1
- package/dist/esm/b2b-tab-panel.entry.js +1 -1
- package/dist/esm/b2b-tab.entry.js +2 -2
- package/dist/esm/b2b-table-cell_2.entry.js +3 -3
- package/dist/esm/b2b-table-row.entry.js +2 -2
- package/dist/esm/b2b-table-rowgroup.entry.js +2 -2
- package/dist/esm/b2b-table.entry.js +2 -2
- package/dist/esm/b2b-textarea.entry.js +2 -2
- package/dist/esm/b2b-toggle-button.entry.js +3 -3
- package/dist/esm/b2b-toggle-chip.entry.js +3 -3
- package/dist/esm/b2b-toggle-group.entry.js +2 -2
- package/dist/esm/b2b-toggle-switch.entry.js +5 -5
- package/dist/esm/b2b-tooltip.entry.js +3 -3
- package/dist/esm/b2b-wizard-icon.entry.js +1 -1
- package/dist/esm/b2b-wizard-step.entry.js +2 -2
- package/dist/esm/b2b-wizard.entry.js +1 -1
- package/dist/esm/date-range-picker-utils-92a5fb50.js +128 -0
- package/dist/esm/index-ab9eb36d.js +14 -6
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/date-range-picker/date-range-picker-days.d.ts +57 -0
- package/dist/types/components/date-range-picker/date-range-picker-utils.d.ts +58 -0
- package/dist/types/components/date-range-picker/date-range-picker.d.ts +89 -0
- package/dist/types/components/date-range-picker/date-range-picker.stories.d.ts +23 -0
- package/dist/types/components/dropdown/dropdown.d.ts +2 -2
- package/dist/types/components/icon-100/types.d.ts +1 -1
- package/dist/types/components/snackbar/snackbar.d.ts +2 -2
- package/dist/types/components/toggle-switch/toggle-switch.stories.d.ts +16 -4
- package/dist/types/components.d.ts +214 -2
- package/dist/types/docs/config/utils.d.ts +14 -0
- package/dist/types/utils/interfaces/form.interface.d.ts +6 -2
- package/dist/web-types.json +206 -3
- package/package.json +2 -2
- package/dist/b2b-core-components/icons-100/b2b_icon-cosmetics.png +0 -0
- package/dist/b2b-core-components/p-15df2a47.entry.js +0 -1
- package/dist/b2b-core-components/p-1d6f73dd.entry.js +0 -1
- package/dist/b2b-core-components/p-3369f3c0.entry.js +0 -1
- package/dist/b2b-core-components/p-67484ecc.entry.js +0 -1
- package/dist/b2b-core-components/p-6d64a994.entry.js +0 -1
- package/dist/b2b-core-components/p-76bf79ec.entry.js +0 -1
- package/dist/b2b-core-components/p-82a2809e.entry.js +0 -1
- package/dist/b2b-core-components/p-917a7f00.entry.js +0 -1
- package/dist/b2b-core-components/p-d88113f5.entry.js +0 -1
- package/dist/collection/components/icon-100/icons-100/b2b_icon-cosmetics.png +0 -0
- package/dist/esm/b2b-paragraph.entry.js +0 -31
|
@@ -17,12 +17,12 @@ export class B2bTabComponent {
|
|
|
17
17
|
}
|
|
18
18
|
}
|
|
19
19
|
render() {
|
|
20
|
-
return (h(Host, { key: '
|
|
20
|
+
return (h(Host, { key: '040969f8040c2e7f38641b054aa71dbce563bbcd', id: `b2b-tab-${this.generatedId}`, "aria-role": "tab", "aria-selected": this.selected, role: this.disabled ? false : 'tab', disabled: this.disabled, tabindex: this.disabled ? false : this.selected ? '0' : '-1' }, h("span", { key: '094d8312566c347cf529fb9f71b747f2ed1348f6', class: {
|
|
21
21
|
'b2b-tab': true,
|
|
22
22
|
'b2b-tab--selected': this.selected,
|
|
23
23
|
'b2b-tab--disabled': this.disabled,
|
|
24
24
|
'b2b-tab--error': this.invalid,
|
|
25
|
-
} }, h("slot", { key: '
|
|
25
|
+
} }, h("slot", { key: 'cd453ac793439c1572ff80f84a29d5d60b6e0517' }))));
|
|
26
26
|
}
|
|
27
27
|
static get is() { return "b2b-tab"; }
|
|
28
28
|
static get encapsulation() { return "shadow"; }
|
|
@@ -121,7 +121,7 @@ export class B2bTabGroupComponent {
|
|
|
121
121
|
});
|
|
122
122
|
}
|
|
123
123
|
render() {
|
|
124
|
-
return (h(Host, { key: '
|
|
124
|
+
return (h(Host, { key: 'a652623572354f06d1b773b9a98760a7c9ec9cf7' }, h("slot", { key: 'f80657d44b37339fb026e92873fb177b2393e841', name: "tab" }), h("b2b-separator", { key: 'e82a1891e3c509fab6f2b17e74f39796645bbdd2' }), h("slot", { key: 'e9ccf361a9bfa3424fc861b6ba8f685510ef39bd', name: "panel" })));
|
|
125
125
|
}
|
|
126
126
|
static get is() { return "b2b-tab-group"; }
|
|
127
127
|
static get encapsulation() { return "shadow"; }
|
|
@@ -5,7 +5,7 @@ export class B2bTabPanelComponent {
|
|
|
5
5
|
this.generatedId = i++;
|
|
6
6
|
}
|
|
7
7
|
render() {
|
|
8
|
-
return (h(Host, { key: '
|
|
8
|
+
return (h(Host, { key: '09b20e44ef0677b3ce5babd5da199ac5803e60c2', id: `b2b-tab-panel-${this.generatedId}`, role: "tabpanel" }, h("div", { key: '72ddbd132da8c1bcb7810397dd50530d722eb5ce', class: "b2b-tab-panel" }, h("slot", { key: '6318fea037462b2b43f33bde3bd0e6ee42c1dc18' }))));
|
|
9
9
|
}
|
|
10
10
|
static get is() { return "b2b-tab-panel"; }
|
|
11
11
|
static get encapsulation() { return "shadow"; }
|
|
@@ -36,14 +36,14 @@ export class TableCellComponent {
|
|
|
36
36
|
}
|
|
37
37
|
}
|
|
38
38
|
render() {
|
|
39
|
-
return (h(Host, { key: '
|
|
39
|
+
return (h(Host, { key: '285cee3af71e3d05dd2916f771fe36e47e001998', onMouseEnter: this.addExpandStyles, onMouseLeave: this.removeExpandStyles, class: {
|
|
40
40
|
'b2b-table-cell': true,
|
|
41
41
|
['b2b-table-cell--colspan']: this.size === TableSizes.COLSPAN,
|
|
42
42
|
['b2b-table-cell--ellipsis']: this.useTextEllipsis,
|
|
43
43
|
['b2b-table-cell--' + this.align]: true,
|
|
44
44
|
['b2b-table-cell--divider']: this.divider,
|
|
45
45
|
[`b2b-table-cell-color-${this.color}`]: true,
|
|
46
|
-
}, role: "cell" }, h("slot", { key: '
|
|
46
|
+
}, role: "cell" }, h("slot", { key: 'd0812f47d90ee1b225110855df1c8918960505e7' })));
|
|
47
47
|
}
|
|
48
48
|
static get is() { return "b2b-table-cell"; }
|
|
49
49
|
static get encapsulation() { return "shadow"; }
|
|
@@ -72,7 +72,7 @@ export class TableHeaderComponent {
|
|
|
72
72
|
this.setIconPlacement();
|
|
73
73
|
}
|
|
74
74
|
render() {
|
|
75
|
-
return (h(Host, { key: '
|
|
75
|
+
return (h(Host, { key: '9b0df06a2325c4bac0e64f1a3b1dadec9150b14b', class: {
|
|
76
76
|
[`b2b-table-header--${this.sortDirection && this.iconAlign}`]: true,
|
|
77
77
|
'b2b-table-header--divider': this.divider,
|
|
78
78
|
[`b2b-table-header--${this.size}`]: true,
|
|
@@ -110,12 +110,12 @@ export class TableRowComponent {
|
|
|
110
110
|
}
|
|
111
111
|
}
|
|
112
112
|
render() {
|
|
113
|
-
return (h(Host, { key: '
|
|
113
|
+
return (h(Host, { key: 'b3c742ca195dec5c8037a589122e41d87afcee5d', class: {
|
|
114
114
|
'b2b-table-row': true,
|
|
115
115
|
['b2b-table-row--colspan']: this.size === TableSizes.COLSPAN,
|
|
116
116
|
['b2b-table-row--highlight']: this.highlight,
|
|
117
117
|
[`b2b-table-row--color-${this.getRowColor()}`]: true,
|
|
118
|
-
}, role: "row" }, this.getAccordionColumns(), this.getCheckbox(), h("slot", { key: '
|
|
118
|
+
}, role: "row" }, this.getAccordionColumns(), this.getCheckbox(), h("slot", { key: 'ae02badbe6847a68f2e5e1e08e676678f7144c1b' })));
|
|
119
119
|
}
|
|
120
120
|
static get is() { return "b2b-table-row"; }
|
|
121
121
|
static get encapsulation() { return "shadow"; }
|
|
@@ -113,11 +113,11 @@ export class TableRowgroupComponent {
|
|
|
113
113
|
this.makeHeaderRowNotSelectable();
|
|
114
114
|
}
|
|
115
115
|
render() {
|
|
116
|
-
return (h(Host, { key: '
|
|
116
|
+
return (h(Host, { key: '1fa1822d42bf6819b2fd6de382a0075a05715569', class: {
|
|
117
117
|
['b2b-table-rowgroup__' + this.type]: true,
|
|
118
118
|
'b2b-table-rowgroup--fixed': this.fixed,
|
|
119
119
|
'b2b-table-rowgroup--colspan': this.size === TableSizes.COLSPAN,
|
|
120
|
-
}, role: "rowgroup" }, h("slot", { key: '
|
|
120
|
+
}, role: "rowgroup" }, h("slot", { key: '6ffd528b4b6330a5f4c66b50b3c329853fd441a8' })));
|
|
121
121
|
}
|
|
122
122
|
static get is() { return "b2b-table-rowgroup"; }
|
|
123
123
|
static get encapsulation() { return "shadow"; }
|
|
@@ -60,9 +60,9 @@ export class TableComponent {
|
|
|
60
60
|
}
|
|
61
61
|
}
|
|
62
62
|
render() {
|
|
63
|
-
return (h(Host, { key: '
|
|
63
|
+
return (h(Host, { key: 'b838cb824f9e59b01eb827642d130b8933bfa331', class: {
|
|
64
64
|
['b2b-table--' + this.size]: true,
|
|
65
|
-
}, role: "table" }, h("slot", { key: '
|
|
65
|
+
}, role: "table" }, h("slot", { key: 'a657fe4d62601fff6bf5ee6d640fbb8d8c351055' })));
|
|
66
66
|
}
|
|
67
67
|
static get is() { return "b2b-table"; }
|
|
68
68
|
static get encapsulation() { return "shadow"; }
|
|
@@ -45,10 +45,10 @@ export class B2BTextareaComponent {
|
|
|
45
45
|
}
|
|
46
46
|
}
|
|
47
47
|
render() {
|
|
48
|
-
return (h(Host, { key: '
|
|
48
|
+
return (h(Host, { key: 'b5ecf98b41d74602941e9b3a5a22962e7c6c94d9', class: {
|
|
49
49
|
'b2b-textarea': true,
|
|
50
50
|
'b2b-textarea--error': this.invalid && !this.disabled,
|
|
51
|
-
} }, this.label && (h("b2b-input-label", { id: this.name, required: this.required }, this.label)), h("textarea", { key: '
|
|
51
|
+
} }, this.label && (h("b2b-input-label", { id: this.name, required: this.required }, this.label)), h("textarea", { key: '1cb84cd64595ee68ca04e62f5b587ef9eef3ff3e', class: "textarea-input", "aria-labelledby": this.name, style: Object.assign({ height: this.height }, (Boolean(this.resize) && { resize: this.resize })), value: this.value, name: this.name, placeholder: this.placeholder, disabled: this.disabled, autoFocus: this.focusOnLoad, onFocus: this.onFocus, onBlur: this.onBlur, onInput: this.onInput, maxLength: this.maxLength }), (this.hint !== undefined && !this.invalid) ||
|
|
52
52
|
(this.hint !== undefined && this.disabled) ? (h("span", null, this.hint)) : (''), this.error !== undefined && this.invalid && !this.disabled ? (h("span", null, this.error)) : ('')));
|
|
53
53
|
}
|
|
54
54
|
static get is() { return "b2b-textarea"; }
|
|
@@ -31,13 +31,13 @@ export class B2bToggleButtonComponent {
|
|
|
31
31
|
return Array.from(document.querySelectorAll(`b2b-toggle-button[name="${this.name}"]`)).filter((toggle) => toggle.value !== this.value);
|
|
32
32
|
}
|
|
33
33
|
render() {
|
|
34
|
-
return (h(Host, { key: '
|
|
34
|
+
return (h(Host, { key: 'a6f1b65c7fc3b33b46d9f12f03c47d7abb14c345', onClick: this.onClick }, h("span", { key: '546d4e19b0f924c7ba6f3d86a917f9a6d56800e8', class: {
|
|
35
35
|
'b2b-toggle-button': true,
|
|
36
36
|
'b2b-toggle-button--disabled': this.disabled,
|
|
37
|
-
} }, h("input", { key: '
|
|
37
|
+
} }, h("input", { key: 'f80c968bb2b970b2fee8f028183786ee62cb46aa', tabindex: 0, class: {
|
|
38
38
|
'b2b-toggle-button__input': true,
|
|
39
39
|
'b2b-toggle-button__input--disabled': this.disabled,
|
|
40
|
-
}, "aria-labelledby": this.name, type: "radio", checked: this.checked && !this.disabled, disabled: this.disabled, name: this.name, value: this.value }), h("label", { key: '
|
|
40
|
+
}, "aria-labelledby": this.name, type: "radio", checked: this.checked && !this.disabled, disabled: this.disabled, name: this.name, value: this.value }), h("label", { key: 'dcf4bd01503bed93040bb788c5c8f501e900bdcc', id: this.name, tabindex: -1, class: {
|
|
41
41
|
'b2b-toggle-button__label': true,
|
|
42
42
|
'b2b-toggle-button__label--disabled': this.disabled,
|
|
43
43
|
'b2b-toggle-button__label--checked': this.checked && !this.disabled,
|
|
@@ -32,11 +32,11 @@ export class B2BToggleChipComponent {
|
|
|
32
32
|
this.disabled = false;
|
|
33
33
|
}
|
|
34
34
|
render() {
|
|
35
|
-
return (h(Host, { key: '
|
|
35
|
+
return (h(Host, { key: '70fad02b2046f9a929159944de8d1bcfb73e695b' }, h("span", { key: 'e0999281f64d4dcf7fadd9861e69c2ccd5242381', onClick: this.onClick, onKeyDown: this.onKeyDown, class: {
|
|
36
36
|
'b2b-toggle-chip': true,
|
|
37
|
-
} }, h("input", { key: '
|
|
37
|
+
} }, h("input", { key: '9a5adfa2b4b45fd86511167a879b2324ec1514aa', "aria-labelledby": this.name, tabindex: this.disabled ? -1 : 0, class: {
|
|
38
38
|
'b2b-toggle-chip__input': true,
|
|
39
|
-
}, type: "checkbox", checked: this.active && !this.disabled, disabled: this.disabled, name: this.name, value: this.value }), h("label", { key: '
|
|
39
|
+
}, type: "checkbox", checked: this.active && !this.disabled, disabled: this.disabled, name: this.name, value: this.value }), h("label", { key: 'b35900d6765c98d6a403384ae87ce666df7a391e', id: this.name, tabIndex: -1, class: {
|
|
40
40
|
'b2b-toggle-chip__label': true,
|
|
41
41
|
'b2b-toggle-chip__label--active': this.active && !this.disabled,
|
|
42
42
|
'b2b-toggle-chip__label--disabled': this.disabled,
|
|
@@ -45,10 +45,10 @@ export class B2BToggleGroup {
|
|
|
45
45
|
}
|
|
46
46
|
}
|
|
47
47
|
render() {
|
|
48
|
-
return (h(Host, { key: '
|
|
48
|
+
return (h(Host, { key: '7226291d34975d1f924ef09c9b8d4d74bef97733' }, h("div", { key: 'e483cc453088f46d77e49c02fcc7ec81947cfbf5', class: {
|
|
49
49
|
'b2b-toggle-group': true,
|
|
50
50
|
'b2b-toggle-group--disabled': this.disabled,
|
|
51
|
-
} }, h("fieldset", { key: '
|
|
51
|
+
} }, h("fieldset", { key: '3bf9e738d0629438870a7618087c82b0b4841f4d' }, h("slot", { key: '648b2303ec2207e3c1069b313194de5abdef0518' })))));
|
|
52
52
|
}
|
|
53
53
|
static get is() { return "b2b-toggle-group"; }
|
|
54
54
|
static get encapsulation() { return "shadow"; }
|
|
@@ -38,17 +38,17 @@ export class B2bToggleSwitchComponent {
|
|
|
38
38
|
render() {
|
|
39
39
|
// workaround for purgecss as safelist doesn't work
|
|
40
40
|
const isLeft = this.labelPosition === 'left';
|
|
41
|
-
return (h(Host, { key: '
|
|
41
|
+
return (h(Host, { key: 'b391da32ba761f1901c77bd80d55685fdaf683f9' }, h("div", { key: '98eee1a17196010cbe0a430d963008e8ef2a2dc7', class: {
|
|
42
42
|
'b2b-toggle': true,
|
|
43
43
|
'b2b-toggle--disabled': this.disabled,
|
|
44
44
|
'b2b-toggle--checked': this.state,
|
|
45
|
-
} }, h("div", { key: '
|
|
45
|
+
} }, h("div", { key: '8846212651ba0626eb6bc00c8b855a51f2b37fcc', class: {
|
|
46
46
|
'b2b-toggle__label': true,
|
|
47
47
|
'b2b-toggle__label--left': isLeft,
|
|
48
|
-
} }, h("span", { key: '
|
|
48
|
+
} }, h("span", { key: '9c6e0953a0f809acb692bf21d7c326b18695d98c', class: "b2b-toggle__switch", role: "switch", tabIndex: 0, onKeyDown: this.onKeyDown, onClick: this.onClick }, h("svg", { key: '891608602164176e3d76301dbb519a127ed8d7c1', class: {
|
|
49
49
|
'b2b-toggle__icon': true,
|
|
50
50
|
'b2b-toggle__icon--show': this.state,
|
|
51
|
-
}, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 30 30" }, h("path", { key: '
|
|
51
|
+
}, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 30 30" }, h("path", { key: '8e7c9be51b1bf4e9545d472aa4b3ebb35a84d5a7', d: "M11.798 25.082c-.341 0-.681-.13-.942-.389l-7.132-7.115a1.334 1.334 0 0 1 1.884-1.888l6.19 6.175L26.391 7.307a1.334 1.334 0 0 1 1.884 1.888L12.74 24.693c-.26.259-.601.389-.942.389z" }))), this.label && (h("span", { class: {
|
|
52
52
|
'b2b-toggle__text': true,
|
|
53
53
|
'b2b-toggle__text--left': isLeft,
|
|
54
54
|
} }, this.label))))));
|
|
@@ -12,12 +12,12 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
12
12
|
};
|
|
13
13
|
import { getArgTypes } from "../../docs/config/utils";
|
|
14
14
|
import { html } from "lit-html";
|
|
15
|
-
|
|
15
|
+
export default {
|
|
16
16
|
title: 'Components/Interaction/Toggle Switch',
|
|
17
17
|
component: 'b2b-toggle-switch',
|
|
18
18
|
args: {
|
|
19
19
|
label: 'Label',
|
|
20
|
-
disabled:
|
|
20
|
+
disabled: false,
|
|
21
21
|
labelPosition: 'left',
|
|
22
22
|
state: true,
|
|
23
23
|
},
|
|
@@ -31,16 +31,22 @@ const meta = {
|
|
|
31
31
|
state="${args.state}" />`;
|
|
32
32
|
},
|
|
33
33
|
};
|
|
34
|
-
export
|
|
35
|
-
export const SwitchOn = {
|
|
36
|
-
args: Object.assign({}, meta.args),
|
|
37
|
-
};
|
|
34
|
+
export const SwitchOn = {};
|
|
38
35
|
export const SwitchOff = {
|
|
39
|
-
args:
|
|
36
|
+
args: {
|
|
37
|
+
disabled: false,
|
|
38
|
+
state: false,
|
|
39
|
+
},
|
|
40
40
|
};
|
|
41
41
|
export const SwitchOnDisabled = {
|
|
42
|
-
args:
|
|
42
|
+
args: {
|
|
43
|
+
state: true,
|
|
44
|
+
disabled: true,
|
|
45
|
+
},
|
|
43
46
|
};
|
|
44
47
|
export const SwitchOffDisabled = {
|
|
45
|
-
args:
|
|
48
|
+
args: {
|
|
49
|
+
state: false,
|
|
50
|
+
disabled: true,
|
|
51
|
+
},
|
|
46
52
|
};
|
|
@@ -59,13 +59,13 @@ export class B2BTooltipComponent {
|
|
|
59
59
|
}
|
|
60
60
|
}
|
|
61
61
|
render() {
|
|
62
|
-
return (h(Host, { key: '
|
|
62
|
+
return (h(Host, { key: '28dc2c4c09c44990df7fb0be9808dc25cc54c768', onMouseEnter: this.onMouseEnter, onMouseLeave: this.onMouseLeave }, h("span", { key: '4e635a06e5edec983a458ed29d5c742434fc2b0e', class: {
|
|
63
63
|
[`b2b-tooltip--${this.position}`]: true,
|
|
64
64
|
'b2b-tooltip__trigger': true,
|
|
65
|
-
} }, h("slot", { key: '
|
|
65
|
+
} }, h("slot", { key: '4226bd0e1427bf1c2cb43ff766a2474e23860ba6' }), h("div", { key: 'f1b3f5f8d8e18da6026103246bcc2af6d3c9224d', class: {
|
|
66
66
|
'b2b-tooltip__content': true,
|
|
67
67
|
'b2b-tooltip--visible': this.opened,
|
|
68
|
-
} }, h("slot", { key: '
|
|
68
|
+
} }, h("slot", { key: 'f8506cfc288896cd691dde111c7b331ed00739a0', name: "content" }, this.content)))));
|
|
69
69
|
}
|
|
70
70
|
static get is() { return "b2b-tooltip"; }
|
|
71
71
|
static get encapsulation() { return "shadow"; }
|
|
@@ -7,10 +7,10 @@ export class WizardStepComponent {
|
|
|
7
7
|
this.checkIcon = true;
|
|
8
8
|
}
|
|
9
9
|
render() {
|
|
10
|
-
return (h(Host, { key: '
|
|
10
|
+
return (h(Host, { key: '367c15511fb060caf9c100ef1cc3eb500104e19e' }, h("div", { key: 'a50230361f5d8a017c4573d25cc8b5cf5880c7c7', class: "b2b_wizard__step" }, h("b2b-wizard-icon", { key: 'fe0620d30525c9219ba8e9a6e4d6fbee0327c44d', step: this.step, state: this.state, checkIcon: this.checkIcon }), h("div", { key: 'e721cb200a6e09039cfcf291529f0d36b47c10af', class: {
|
|
11
11
|
'b2b_wizard__step__label': true,
|
|
12
12
|
'b2b_wizard__step__label--default': this.state === WizardStatus.DEFAULT,
|
|
13
|
-
} }, h("slot", { key: '
|
|
13
|
+
} }, h("slot", { key: '9947aa5306e78326ce754fc777616c3c90fd2d1c' })))));
|
|
14
14
|
}
|
|
15
15
|
static get is() { return "b2b-wizard-step"; }
|
|
16
16
|
static get encapsulation() { return "shadow"; }
|
|
@@ -44,7 +44,7 @@ export class WizardComponent {
|
|
|
44
44
|
this.setStepsState();
|
|
45
45
|
}
|
|
46
46
|
render() {
|
|
47
|
-
return (h(Host, { key: '
|
|
47
|
+
return (h(Host, { key: 'dd8021387b9e3388daa3b59872855f2c10876443' }, h("div", { key: '9732f51d245e4459a47d9c1136d61e3a93e0913f', class: "b2b_wizard" }, h("slot", { key: 'bca40318290b823efdc47973f20d9e63d27dc701' }))));
|
|
48
48
|
}
|
|
49
49
|
static get is() { return "b2b-wizard"; }
|
|
50
50
|
static get encapsulation() { return "shadow"; }
|
|
@@ -7,7 +7,7 @@ export class WizardIconComponent {
|
|
|
7
7
|
this.checkIcon = true;
|
|
8
8
|
}
|
|
9
9
|
render() {
|
|
10
|
-
return (h(Host, { key: '
|
|
10
|
+
return (h(Host, { key: '7525116ebb5564170b75a07d619777a3a8d5dbac' }, h("div", { key: 'af75be9343349999f705cc5d2990b14e90d42c65', class: {
|
|
11
11
|
'b2b-wizard-icon': true,
|
|
12
12
|
} }, this.state === WizardStatus.COMPLETED && (h("b2b-rounded-icon", { color: "var(--b2b-color-success-50)", "content-color": "var(--b2b-color-success-100)" }, this.checkIcon ? (h("b2b-icon-100", { slot: "icon", icon: "b2b_icon-check" })) : (h("span", { slot: "text" }, this.step)))), this.state === WizardStatus.PENDING && (h("b2b-rounded-icon", { color: "var(--b2b-color-icon-default)", "content-color": "var(--b2b-color-icon-inverted)" }, h("span", { slot: "text" }, this.step))), this.state === WizardStatus.DISABLED && (h("b2b-rounded-icon", { color: "var(--b2b-color-grey-100)", "content-color": "var(--b2b-color-grey-400)" }, h("span", { slot: "text" }, this.step))), this.state === WizardStatus.DEFAULT && (h("b2b-rounded-icon", { color: "transparent", "border-color": "var(--b2b-color-icon-secondary)", "content-color": "var(--b2b-color-icon-secondary)" }, h("span", { slot: "text" }, this.step))))));
|
|
13
13
|
}
|
|
@@ -1,20 +1,23 @@
|
|
|
1
1
|
import componentsArgs from "./components-args.json";
|
|
2
2
|
import { replacePropControls } from "./replace-prop-controls";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
3
|
+
/**
|
|
4
|
+
* Default controls can be changed by passing a controls object like so:
|
|
5
|
+
* `{ 'attribute-name': 'control-type' }`
|
|
6
|
+
*
|
|
7
|
+
* Example: `{ 'steps': 'select' }`
|
|
8
|
+
* For all the control types see https://storybook.js.org/docs/react/essentials/controls#annotation
|
|
7
9
|
*/
|
|
8
10
|
export const getArgTypes = (componentTag, controls) => {
|
|
9
11
|
const componentDocs = componentsArgs[componentTag];
|
|
10
12
|
return replacePropControls(componentDocs, controls);
|
|
11
13
|
};
|
|
12
|
-
|
|
13
|
-
|
|
14
|
+
/**
|
|
15
|
+
* Function to hide all arguments from a single story.
|
|
16
|
+
* I wasn't able to find a way to do this in Storybook.
|
|
14
17
|
* This can be used like so:
|
|
15
18
|
* storyName.argTypes = hideAllControls(storyArgTypes);
|
|
16
19
|
* If you find a better way, remove this function and use Storybook solution
|
|
17
|
-
|
|
20
|
+
*/
|
|
18
21
|
export const hideAllControls = (argTypes) => {
|
|
19
22
|
const argsWithHiddenControls = {};
|
|
20
23
|
Object.keys(argTypes).map(key => {
|
|
@@ -9,7 +9,7 @@ import { d as defineCustomElement$4 } from './headline.js';
|
|
|
9
9
|
import { d as defineCustomElement$3 } from './icon-100.js';
|
|
10
10
|
import { d as defineCustomElement$2 } from './input-label.js';
|
|
11
11
|
|
|
12
|
-
const datePickerCss = ":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-blue-10:#F2F7FF;--b2b-color-blue-25:#DBE7FA;--b2b-color-blue-50:#87B1F0;--b2b-color-blue-100:#0F63E1;--b2b-color-blue-200:#093E90;--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:#DBE7FA;--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:#DBE7FA;--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-13:0.3125rem;--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-blue-10:#F2F7FF;--b2b-color-blue-25:#DBE7FA;--b2b-color-blue-50:#87B1F0;--b2b-color-blue-100:#0F63E1;--b2b-color-blue-200:#093E90;--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:#DBE7FA;--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-13:0.3125rem;--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{position:relative}.b2b-date-picker{position:relative}.b2b-date-picker__backdrop{position:fixed;top:0;left:0;width:100%;height:100%;z-index:100}.b2b-date-picker-input-focus-wrapper{width:100%;height:100%}.b2b-date-picker-input-focus-wrapper:hover{cursor:text}.b2b-date-picker-input-wrapper{display:flex;box-sizing:border-box;height:var(--b2b-size-90);border:var(--b2b-size-1) solid var(--b2b-color-grey-200);justify-content:flex-start;border-radius:var(--b2b-size-7);padding:var(--b2b-size-13) var(--b2b-size-25) var(--b2b-size-13);background-color:var(--b2b-color-white-100);transition:outline 0.2s ease-in-out, border-color 0.2s ease-in-out}.b2b-date-picker-input-wrapper--focused{outline:2px solid -webkit-focus-ring-color;outline-offset:-1px}.b2b-date-picker-input-wrapper--error{background-color:var(--b2b-color-error-50);border:1px solid var(--b2b-color-error-100);border-color:var(--b2b-color-error-100)}.b2b-date-picker-input-wrapper .b2b-date-picker-input{border:none;outline:none;box-shadow:none;box-sizing:border-box;margin-left:0;padding-left:0;height:100%;color:var(--b2b-color-black-100);font-size:var(--b2b-size-35);line-height:var(--b2b-size-copy-line-height-100);font-weight:var(--b2b-font-weight-normal);font-family:var(--b2b-font-family-default)}.b2b-date-picker-input-wrapper .b2b-date-picker-input--error{background-color:var(--b2b-color-error-50)}b2b-input-label{display:block;margin-bottom:var(--b2b-size-5);color:var(--b2b-color-black-100)}.b2b-date-picker-selected-date{flex:1;align-self:center;font-size:var(--b2b-size-35)}.b2b-date-picker-label{font-size:var(--b2b-size-35);color:var(--b2b-color-black-100);line-height:var(--b2b-size-copy-line-height-100);margin-bottom:var(--b2b-size-5)}.b2b-date-picker-hint{font-size:var(--b2b-size-copy-50);line-height:var(--b2b-size-copy-line-height-75);display:block;margin-top:var(--b2b-size-7);color:var(--b2b-color-grey-300)}.b2b-date-picker-hint--error{color:var(--b2b-color-error-100)}.b2b-date-picker-body{position:absolute;border-right:var(--b2b-size-1) solid var(--b2b-color-black-100);border-left:var(--b2b-size-1) solid var(--b2b-color-black-100);border-bottom:var(--b2b-size-1) solid var(--b2b-color-black-100);outline-offset:-1px;width:300px;box-sizing:border-box;margin-top:1px;padding-bottom:var(--b2b-size-40);outline:none;background-color:var(--b2b-color-white-100);z-index:101}.b2b-date-picker-body--hidden{display:none}.b2b-icons{display:flex;margin-top:var(--b2b-size-5);align-items:center}.b2b-close-icon{display:block}.b2b-event-icon{display:block}";
|
|
12
|
+
const datePickerCss = ":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-blue-10:#F2F7FF;--b2b-color-blue-25:#DBE7FA;--b2b-color-blue-50:#87B1F0;--b2b-color-blue-100:#0F63E1;--b2b-color-blue-200:#093E90;--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:#DBE7FA;--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:#DBE7FA;--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-13:0.3125rem;--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-blue-10:#F2F7FF;--b2b-color-blue-25:#DBE7FA;--b2b-color-blue-50:#87B1F0;--b2b-color-blue-100:#0F63E1;--b2b-color-blue-200:#093E90;--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:#DBE7FA;--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-13:0.3125rem;--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{position:relative}.b2b-date-picker{position:relative}.b2b-date-picker__backdrop{position:fixed;top:0;left:0;width:100%;height:100%;z-index:100}.b2b-date-picker-input-focus-wrapper{width:100%;height:100%}.b2b-date-picker-input-focus-wrapper:hover{cursor:text}.b2b-date-picker-input-wrapper{display:flex;box-sizing:border-box;height:var(--b2b-size-90);border:var(--b2b-size-1) solid var(--b2b-color-grey-200);justify-content:flex-start;border-radius:var(--b2b-size-7);padding:var(--b2b-size-13) var(--b2b-size-25) var(--b2b-size-13);background-color:var(--b2b-color-white-100);transition:outline 0.2s ease-in-out, border-color 0.2s ease-in-out}.b2b-date-picker-input-wrapper--focused{outline:2px solid -webkit-focus-ring-color;outline-offset:-1px;border-radius:var(--b2b-size-7) var(--b2b-size-7) 0 0}.b2b-date-picker-input-wrapper--error{background-color:var(--b2b-color-error-50);border:1px solid var(--b2b-color-error-100);border-color:var(--b2b-color-error-100)}.b2b-date-picker-input-wrapper .b2b-date-picker-input{border:none;outline:none;box-shadow:none;box-sizing:border-box;margin-left:0;padding-left:0;height:100%;color:var(--b2b-color-black-100);font-size:var(--b2b-size-35);line-height:var(--b2b-size-copy-line-height-100);font-weight:var(--b2b-font-weight-normal);font-family:var(--b2b-font-family-default)}.b2b-date-picker-input-wrapper .b2b-date-picker-input--error{background-color:var(--b2b-color-error-50)}b2b-input-label{display:block;margin-bottom:var(--b2b-size-5);color:var(--b2b-color-black-100)}.b2b-date-picker-selected-date{flex:1;align-self:center;font-size:var(--b2b-size-35)}.b2b-date-picker-label{font-size:var(--b2b-size-35);color:var(--b2b-color-black-100);line-height:var(--b2b-size-copy-line-height-100);margin-bottom:var(--b2b-size-5)}.b2b-date-picker-hint{font-size:var(--b2b-size-copy-50);line-height:var(--b2b-size-copy-line-height-75);display:block;margin-top:var(--b2b-size-7);color:var(--b2b-color-grey-300)}.b2b-date-picker-hint--error{color:var(--b2b-color-error-100)}.b2b-date-picker-body{position:absolute;border-right:var(--b2b-size-1) solid var(--b2b-color-black-100);border-left:var(--b2b-size-1) solid var(--b2b-color-black-100);border-bottom:var(--b2b-size-1) solid var(--b2b-color-black-100);outline-offset:-1px;width:300px;box-sizing:border-box;padding-bottom:var(--b2b-size-40);outline:none;background-color:var(--b2b-color-white-100);z-index:101}.b2b-date-picker-body--hidden{display:none}.b2b-icons{display:flex;margin-top:var(--b2b-size-5);align-items:center}.b2b-close-icon{display:block}.b2b-event-icon{display:block}";
|
|
13
13
|
const B2bDatePickerStyle0 = datePickerCss;
|
|
14
14
|
|
|
15
15
|
const B2bDatePicker$1 = /*@__PURE__*/ proxyCustomElement(class B2bDatePicker extends HTMLElement {
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Components, JSX } from "../types/components";
|
|
2
|
+
|
|
3
|
+
interface B2bDateRangePickerDays extends Components.B2bDateRangePickerDays, HTMLElement {}
|
|
4
|
+
export const B2bDateRangePickerDays: {
|
|
5
|
+
prototype: B2bDateRangePickerDays;
|
|
6
|
+
new (): B2bDateRangePickerDays;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Used to define this component and all nested components recursively.
|
|
10
|
+
*/
|
|
11
|
+
export const defineCustomElement: () => void;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Components, JSX } from "../types/components";
|
|
2
|
+
|
|
3
|
+
interface B2bDateRangePicker extends Components.B2bDateRangePicker, HTMLElement {}
|
|
4
|
+
export const B2bDateRangePicker: {
|
|
5
|
+
prototype: B2bDateRangePicker;
|
|
6
|
+
new (): B2bDateRangePicker;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Used to define this component and all nested components recursively.
|
|
10
|
+
*/
|
|
11
|
+
export const defineCustomElement: () => void;
|