@duetds/components 4.34.4 → 4.35.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/hydrate/index.js +282 -33
- package/lib/cjs/duet-alert.cjs.entry.js +1 -1
- package/lib/cjs/duet-badge.cjs.entry.js +1 -1
- package/lib/cjs/duet-breadcrumb.cjs.entry.js +1 -1
- package/lib/cjs/duet-breadcrumbs.cjs.entry.js +1 -1
- package/lib/cjs/duet-button_2.cjs.entry.js +2 -2
- package/lib/cjs/duet-caption_4.cjs.entry.js +2 -2
- package/lib/cjs/duet-card.cjs.entry.js +2 -2
- package/lib/cjs/duet-checkbox.cjs.entry.js +1 -1
- package/lib/cjs/duet-choice_2.cjs.entry.js +2 -2
- package/lib/cjs/duet-collapsible.cjs.entry.js +1 -1
- package/lib/cjs/duet-cookie-consent.cjs.entry.js +1 -1
- package/lib/cjs/duet-date-picker.cjs.entry.js +2 -2
- package/lib/cjs/duet-divider_2.cjs.entry.js +1 -1
- package/lib/cjs/duet-editable-table-button.cjs.entry.js +1 -1
- package/lib/cjs/duet-editable-table_4.cjs.entry.js +3 -3
- package/lib/cjs/duet-empty-state.cjs.entry.js +1 -1
- package/lib/cjs/duet-fieldset.cjs.entry.js +1 -1
- package/lib/cjs/duet-footer.cjs.entry.js +1 -1
- package/lib/cjs/duet-grid_2.cjs.entry.js +1 -1
- package/lib/cjs/duet-header_2.cjs.entry.js +20 -10
- package/lib/cjs/duet-hero.cjs.entry.js +1 -1
- package/lib/cjs/duet-icon.cjs.entry.js +1 -1
- package/lib/cjs/duet-input_2.cjs.entry.js +1 -1
- package/lib/cjs/duet-layout.cjs.entry.js +1 -1
- package/lib/cjs/duet-list_2.cjs.entry.js +1 -1
- package/lib/cjs/duet-modal.cjs.entry.js +15 -3
- package/lib/cjs/duet-notification_2.cjs.entry.js +1 -1
- package/lib/cjs/duet-number-input.cjs.entry.js +1 -1
- package/lib/cjs/duet-progress.cjs.entry.js +1 -1
- package/lib/cjs/duet-radio_2.cjs.entry.js +1 -1
- package/lib/cjs/duet-range-slider.cjs.entry.js +1 -1
- package/lib/cjs/duet-scrollable_3.cjs.entry.js +414 -0
- package/lib/cjs/duet-select.cjs.entry.js +1 -1
- package/lib/cjs/duet-step_2.cjs.entry.js +1 -1
- package/lib/cjs/duet-textarea.cjs.entry.js +1 -1
- package/lib/cjs/duet-toggle.cjs.entry.js +1 -1
- package/lib/cjs/duet-tooltip.cjs.entry.js +1 -1
- package/lib/cjs/duet-tray.cjs.entry.js +1 -1
- package/lib/cjs/duet-upload-aria-status.cjs.entry.js +1 -1
- package/lib/cjs/duet-visually-hidden.cjs.entry.js +1 -1
- package/lib/cjs/duet.cjs.js +2 -2
- package/lib/cjs/{focus-utils-0e3a744a.js → focus-utils-15cc3af9.js} +1 -1
- package/lib/cjs/{index-0bcb9cea.js → index-a38f3df3.js} +1 -1
- package/lib/cjs/loader.cjs.js +2 -2
- package/lib/collection/collection-manifest.json +8 -6
- package/lib/collection/components/duet-button/duet-button.js +1 -1
- package/lib/collection/components/duet-card/duet-card.js +3 -1
- package/lib/collection/components/duet-header/duet-header.css +61 -28
- package/lib/collection/components/duet-header/duet-header.js +18 -8
- package/lib/collection/components/duet-link/duet-link.js +1 -1
- package/lib/collection/components/duet-modal/duet-modal.js +33 -3
- package/lib/collection/components/duet-scrollable/duet-scrollable.css +83 -0
- package/lib/collection/components/duet-scrollable/duet-scrollable.js +240 -0
- package/lib/collection/components/duet-tab/duet-tab.js +63 -1
- package/lib/collection/components/duet-tab-group/duet-tab-group.css +12 -13
- package/lib/collection/components/duet-tab-group/duet-tab-group.js +101 -16
- package/lib/collection/components/duet-upload/duet-upload.js +7 -4
- package/lib/custom-elements-bundle/index.d.ts +6 -0
- package/lib/custom-elements-bundle/index.js +264 -37
- package/lib/duet/duet.esm.js +1 -1
- package/lib/duet/duet.js +1 -1
- package/lib/duet/{p-86013171.entry.js → p-04e3b06b.entry.js} +1 -1
- package/lib/duet/{p-808101d8.entry.js → p-0bc3239b.entry.js} +1 -1
- package/lib/duet/{p-6d62cb90.entry.js → p-0d15892b.entry.js} +1 -1
- package/lib/duet/{p-29000070.entry.js → p-0d6c3d07.entry.js} +1 -1
- package/lib/duet/{p-8ea50bd2.system.entry.js → p-0deee587.system.entry.js} +1 -1
- package/lib/duet/{p-d53bbad7.entry.js → p-0ea49de8.entry.js} +1 -1
- package/lib/duet/{p-379e8ebb.system.entry.js → p-114a20f1.system.entry.js} +1 -1
- package/lib/duet/p-13e81854.entry.js +4 -0
- package/lib/duet/p-15a42b87.entry.js +4 -0
- package/lib/duet/{p-48ed41e6.system.entry.js → p-18441899.system.entry.js} +1 -1
- package/lib/duet/{p-a63537e8.entry.js → p-1b98f91c.entry.js} +1 -1
- package/lib/duet/{p-1afec19f.entry.js → p-2056e3eb.entry.js} +1 -1
- package/lib/duet/{p-7c5b396c.system.entry.js → p-27b953e4.system.entry.js} +1 -1
- package/lib/duet/{p-5ea30033.entry.js → p-29e59e77.entry.js} +1 -1
- package/lib/duet/{p-4b7f998d.system.entry.js → p-2c8bd5a2.system.entry.js} +1 -1
- package/lib/duet/{p-36eae676.entry.js → p-30783ea4.entry.js} +1 -1
- package/lib/duet/{p-5b409624.system.entry.js → p-3081f8a5.system.entry.js} +1 -1
- package/lib/duet/p-35ff635e.system.js +4 -0
- package/lib/duet/{p-9aa7cb17.entry.js → p-38128fc3.entry.js} +1 -1
- package/lib/duet/{p-98fabd8b.entry.js → p-3b244de7.entry.js} +1 -1
- package/lib/duet/{p-3953b77a.system.entry.js → p-3baf5b41.system.entry.js} +1 -1
- package/lib/duet/{p-35133bc9.entry.js → p-3bd812df.entry.js} +1 -1
- package/lib/duet/{p-0aec7e4b.entry.js → p-3dbeddf5.entry.js} +1 -1
- package/lib/duet/{p-e90db543.system.entry.js → p-3e578cc5.system.entry.js} +1 -1
- package/lib/duet/p-41b4bad1.entry.js +4 -0
- package/lib/duet/{p-dc226f92.system.entry.js → p-49820427.system.entry.js} +1 -1
- package/lib/duet/{p-fe889838.system.js → p-4accc70c.system.js} +1 -1
- package/lib/duet/{p-ea934463.entry.js → p-4c3961a5.entry.js} +1 -1
- package/lib/duet/{p-e96fca2b.system.entry.js → p-4d7abe27.system.entry.js} +1 -1
- package/lib/duet/{p-aa379dec.system.entry.js → p-54d296d9.system.entry.js} +1 -1
- package/lib/duet/{p-0d18269c.entry.js → p-573921ca.entry.js} +1 -1
- package/lib/duet/{p-ddf5ecf5.system.entry.js → p-5af271ce.system.entry.js} +1 -1
- package/lib/duet/{p-bb1271a8.system.entry.js → p-5f24e161.system.entry.js} +1 -1
- package/lib/duet/{p-255bc205.system.entry.js → p-632186a9.system.entry.js} +1 -1
- package/lib/duet/{p-8bbdfac5.system.entry.js → p-67b22acc.system.entry.js} +1 -1
- package/lib/duet/{p-9c046b9a.entry.js → p-69c4ff6f.entry.js} +1 -1
- package/lib/duet/{p-f16213de.entry.js → p-6b3a14c2.entry.js} +1 -1
- package/lib/duet/{p-8049159b.system.entry.js → p-70cf255e.system.entry.js} +1 -1
- package/lib/duet/{p-ee58a262.entry.js → p-7142b886.entry.js} +1 -1
- package/lib/duet/{p-63ac5acd.entry.js → p-7641054f.entry.js} +1 -1
- package/lib/duet/{p-ea232a29.entry.js → p-7d019a4d.entry.js} +1 -1
- package/lib/duet/{p-f645b369.system.entry.js → p-7e2a2e30.system.entry.js} +1 -1
- package/lib/duet/{p-a209e483.entry.js → p-83261c61.entry.js} +1 -1
- package/lib/duet/{p-0cb07574.js → p-875bd99c.js} +1 -1
- package/lib/duet/{p-927e83d1.entry.js → p-889193e8.entry.js} +1 -1
- package/lib/duet/{p-4002454d.system.entry.js → p-8acdabb5.system.entry.js} +1 -1
- package/lib/duet/{p-3948a5c4.system.entry.js → p-8edd126b.system.entry.js} +1 -1
- package/lib/duet/{p-236cb8b6.entry.js → p-94b4ec76.entry.js} +1 -1
- package/lib/duet/{p-ded5548b.system.entry.js → p-97353a7f.system.entry.js} +1 -1
- package/lib/duet/{p-6d05eb8c.entry.js → p-9a47c28a.entry.js} +1 -1
- package/lib/duet/{p-2f36de45.entry.js → p-9b0c78de.entry.js} +1 -1
- package/lib/duet/{p-32488531.system.entry.js → p-9dd65758.system.entry.js} +1 -1
- package/lib/duet/{p-cf886223.entry.js → p-a53a8675.entry.js} +1 -1
- package/lib/duet/{p-ab6109d6.system.entry.js → p-a73609b4.system.entry.js} +1 -1
- package/lib/duet/{p-719e38e3.system.entry.js → p-ac01755b.system.entry.js} +1 -1
- package/lib/duet/{p-0a664450.system.entry.js → p-acf24fcd.system.entry.js} +1 -1
- package/lib/duet/{p-db1a8956.system.entry.js → p-aed2a35e.system.entry.js} +1 -1
- package/lib/duet/{p-fab77260.system.entry.js → p-b1ae4d5b.system.entry.js} +2 -2
- package/lib/duet/{p-c6c768b9.system.entry.js → p-b2985c8e.system.entry.js} +1 -1
- package/lib/duet/{p-842a43e7.system.entry.js → p-b692b4a4.system.entry.js} +1 -1
- package/lib/duet/{p-9f6649ef.system.entry.js → p-b80d80dc.system.entry.js} +1 -1
- package/lib/duet/{p-5e15d8f8.js → p-bcf94afd.js} +1 -1
- package/lib/duet/p-be872079.entry.js +4 -0
- package/lib/duet/{p-67798ed0.entry.js → p-bf859d7b.entry.js} +1 -1
- package/lib/duet/{p-09845306.entry.js → p-c0fa8865.entry.js} +1 -1
- package/lib/duet/{p-07bec67d.system.entry.js → p-c479f3be.system.entry.js} +1 -1
- package/lib/duet/{p-e339cb4f.entry.js → p-c9020872.entry.js} +1 -1
- package/lib/duet/{p-0945e0ac.entry.js → p-c99e23d2.entry.js} +1 -1
- package/lib/duet/p-ce40057c.entry.js +4 -0
- package/lib/duet/{p-51d5b428.system.js → p-d04561dc.system.js} +1 -1
- package/lib/duet/{p-addff36a.system.entry.js → p-d158b9ca.system.entry.js} +1 -1
- package/lib/duet/{p-a5b9f195.system.entry.js → p-d2edeb9a.system.entry.js} +1 -1
- package/lib/duet/{p-1c38354b.system.entry.js → p-d3432b68.system.entry.js} +1 -1
- package/lib/duet/{p-5818108d.system.entry.js → p-d6563133.system.entry.js} +1 -1
- package/lib/duet/{p-00b102b8.entry.js → p-d9da705b.entry.js} +1 -1
- package/lib/duet/p-e3c66ce5.system.entry.js +4 -0
- package/lib/duet/{p-c6268af4.entry.js → p-e701e364.entry.js} +1 -1
- package/lib/duet/{p-d701bd87.system.entry.js → p-e7056ea5.system.entry.js} +1 -1
- package/lib/duet/{p-55ad1bfb.entry.js → p-e9064858.entry.js} +1 -1
- package/lib/duet/{p-fedad35b.system.entry.js → p-e9ca4ae1.system.entry.js} +2 -2
- package/lib/duet/{p-5a9266c8.system.entry.js → p-ed981e8d.system.entry.js} +1 -1
- package/lib/duet/{p-db75f866.entry.js → p-ef7560b6.entry.js} +1 -1
- package/lib/duet/{p-1f08d290.system.entry.js → p-f1803ec3.system.entry.js} +1 -1
- package/lib/duet/p-f261a666.system.entry.js +4 -0
- package/lib/duet/{p-b465ac62.entry.js → p-fa5a028c.entry.js} +1 -1
- package/lib/esm/duet-alert.entry.js +1 -1
- package/lib/esm/duet-badge.entry.js +1 -1
- package/lib/esm/duet-breadcrumb.entry.js +1 -1
- package/lib/esm/duet-breadcrumbs.entry.js +1 -1
- package/lib/esm/duet-button_2.entry.js +2 -2
- package/lib/esm/duet-caption_4.entry.js +2 -2
- package/lib/esm/duet-card.entry.js +2 -2
- package/lib/esm/duet-checkbox.entry.js +1 -1
- package/lib/esm/duet-choice_2.entry.js +2 -2
- package/lib/esm/duet-collapsible.entry.js +1 -1
- package/lib/esm/duet-cookie-consent.entry.js +1 -1
- package/lib/esm/duet-date-picker.entry.js +2 -2
- package/lib/esm/duet-divider_2.entry.js +1 -1
- package/lib/esm/duet-editable-table-button.entry.js +1 -1
- package/lib/esm/duet-editable-table_4.entry.js +3 -3
- package/lib/esm/duet-empty-state.entry.js +1 -1
- package/lib/esm/duet-fieldset.entry.js +1 -1
- package/lib/esm/duet-footer.entry.js +1 -1
- package/lib/esm/duet-grid_2.entry.js +1 -1
- package/lib/esm/duet-header_2.entry.js +20 -10
- package/lib/esm/duet-hero.entry.js +1 -1
- package/lib/esm/duet-icon.entry.js +1 -1
- package/lib/esm/duet-input_2.entry.js +1 -1
- package/lib/esm/duet-layout.entry.js +1 -1
- package/lib/esm/duet-list_2.entry.js +1 -1
- package/lib/esm/duet-modal.entry.js +15 -3
- package/lib/esm/duet-notification_2.entry.js +1 -1
- package/lib/esm/duet-number-input.entry.js +1 -1
- package/lib/esm/duet-progress.entry.js +1 -1
- package/lib/esm/duet-radio_2.entry.js +1 -1
- package/lib/esm/duet-range-slider.entry.js +1 -1
- package/lib/esm/duet-scrollable_3.entry.js +408 -0
- package/lib/esm/duet-select.entry.js +1 -1
- package/lib/esm/duet-step_2.entry.js +1 -1
- package/lib/esm/duet-textarea.entry.js +1 -1
- package/lib/esm/duet-toggle.entry.js +1 -1
- package/lib/esm/duet-tooltip.entry.js +1 -1
- package/lib/esm/duet-tray.entry.js +1 -1
- package/lib/esm/duet-upload-aria-status.entry.js +1 -1
- package/lib/esm/duet-visually-hidden.entry.js +1 -1
- package/lib/esm/duet.js +2 -2
- package/lib/esm/{focus-utils-8d0688ae.js → focus-utils-d3cd655b.js} +1 -1
- package/lib/esm/{index-ff4326da.js → index-eb374972.js} +1 -1
- package/lib/esm/loader.js +2 -2
- package/lib/esm-es5/duet-alert.entry.js +1 -1
- package/lib/esm-es5/duet-badge.entry.js +1 -1
- package/lib/esm-es5/duet-breadcrumb.entry.js +1 -1
- package/lib/esm-es5/duet-breadcrumbs.entry.js +1 -1
- package/lib/esm-es5/duet-button_2.entry.js +1 -1
- package/lib/esm-es5/duet-caption_4.entry.js +1 -1
- package/lib/esm-es5/duet-card.entry.js +1 -1
- package/lib/esm-es5/duet-checkbox.entry.js +1 -1
- package/lib/esm-es5/duet-choice_2.entry.js +2 -2
- package/lib/esm-es5/duet-collapsible.entry.js +1 -1
- package/lib/esm-es5/duet-cookie-consent.entry.js +1 -1
- package/lib/esm-es5/duet-date-picker.entry.js +1 -1
- package/lib/esm-es5/duet-divider_2.entry.js +1 -1
- package/lib/esm-es5/duet-editable-table-button.entry.js +1 -1
- package/lib/esm-es5/duet-editable-table_4.entry.js +1 -1
- package/lib/esm-es5/duet-empty-state.entry.js +1 -1
- package/lib/esm-es5/duet-fieldset.entry.js +1 -1
- package/lib/esm-es5/duet-footer.entry.js +1 -1
- package/lib/esm-es5/duet-grid_2.entry.js +1 -1
- package/lib/esm-es5/duet-header_2.entry.js +2 -2
- package/lib/esm-es5/duet-hero.entry.js +1 -1
- package/lib/esm-es5/duet-icon.entry.js +1 -1
- package/lib/esm-es5/duet-input_2.entry.js +1 -1
- package/lib/esm-es5/duet-layout.entry.js +1 -1
- package/lib/esm-es5/duet-list_2.entry.js +1 -1
- package/lib/esm-es5/duet-modal.entry.js +1 -1
- package/lib/esm-es5/duet-notification_2.entry.js +1 -1
- package/lib/esm-es5/duet-number-input.entry.js +1 -1
- package/lib/esm-es5/duet-progress.entry.js +1 -1
- package/lib/esm-es5/duet-radio_2.entry.js +1 -1
- package/lib/esm-es5/duet-range-slider.entry.js +1 -1
- package/lib/esm-es5/duet-scrollable_3.entry.js +4 -0
- package/lib/esm-es5/duet-select.entry.js +1 -1
- package/lib/esm-es5/duet-step_2.entry.js +1 -1
- package/lib/esm-es5/duet-textarea.entry.js +1 -1
- package/lib/esm-es5/duet-toggle.entry.js +1 -1
- package/lib/esm-es5/duet-tooltip.entry.js +1 -1
- package/lib/esm-es5/duet-tray.entry.js +1 -1
- package/lib/esm-es5/duet-upload-aria-status.entry.js +1 -1
- package/lib/esm-es5/duet-visually-hidden.entry.js +1 -1
- package/lib/esm-es5/duet.js +1 -1
- package/lib/esm-es5/focus-utils-d3cd655b.js +4 -0
- package/lib/esm-es5/{index-ff4326da.js → index-eb374972.js} +1 -1
- package/lib/esm-es5/loader.js +1 -1
- package/lib/html.html-data.json +62 -3
- package/lib/types/components/duet-card/duet-card.d.ts +1 -0
- package/lib/types/components/duet-modal/duet-modal.d.ts +5 -1
- package/lib/types/components/duet-scrollable/duet-scrollable.d.ts +51 -0
- package/lib/types/components/duet-tab/duet-tab.d.ts +11 -0
- package/lib/types/components/duet-tab-group/duet-tab-group.d.ts +15 -0
- package/lib/types/components/duet-upload/duet-upload.d.ts +3 -0
- package/lib/types/components.d.ts +90 -1
- package/package.json +6 -5
- package/lib/cjs/duet-tab_2.cjs.entry.js +0 -213
- package/lib/duet/p-130476dc.entry.js +0 -4
- package/lib/duet/p-30410b67.system.js +0 -4
- package/lib/duet/p-4d30eee1.entry.js +0 -4
- package/lib/duet/p-56cda85e.system.entry.js +0 -4
- package/lib/duet/p-6f7539a6.entry.js +0 -4
- package/lib/duet/p-87804904.system.entry.js +0 -4
- package/lib/duet/p-b9fe29c7.entry.js +0 -4
- package/lib/duet/p-d9f076ed.entry.js +0 -4
- package/lib/esm/duet-tab_2.entry.js +0 -208
- package/lib/esm-es5/duet-tab_2.entry.js +0 -4
- package/lib/esm-es5/focus-utils-8d0688ae.js +0 -4
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
* Built with Duet Design System
|
|
3
3
|
*/
|
|
4
4
|
const NAMESPACE = 'duet';
|
|
5
|
-
const Env = /* duet */ {"cdnURILocal":"http://0.0.0.0:3334","cdnURIProd":"https://cdn.duetds.com/api","duetIconVersion":"2.2.
|
|
5
|
+
const Env = /* duet */ {"cdnURILocal":"http://0.0.0.0:3334","cdnURIProd":"https://cdn.duetds.com/api","duetIconVersion":"2.2.13"};
|
|
6
6
|
|
|
7
7
|
let scopeId;
|
|
8
8
|
let contentRef;
|
|
@@ -2630,7 +2630,7 @@ let DuetButton$1 = class extends H {
|
|
|
2630
2630
|
"duet-theme-turva": this.theme === "turva",
|
|
2631
2631
|
"duet-button-negative": this.negative || this.variation === "negative",
|
|
2632
2632
|
[this.variation]: true,
|
|
2633
|
-
} }, this.url ? (h$1("a", Object.assign({}, commonProps, { href: this.url, target: this.external ? "_blank" : "_self" }), commonChildren, this.external && h$1("duet-visually-hidden", null, ", ", this.accessibleLabelExternal))) : (h$1("button", Object.assign({}, commonProps, { type: this.getButtonType(), disabled: this.disabled, name: this.name, value: this.value, "aria-pressed": this.accessiblePressed != null ? this.accessiblePressed.toString() : undefined }), commonChildren)), this.loading && h$1("duet-spinner", { color: "currentColor" }))));
|
|
2633
|
+
} }, this.url ? (h$1("a", Object.assign({}, commonProps, { href: this.url, target: this.external ? "_blank" : "_self", rel: this.external ? "noopener" : undefined }), commonChildren, this.external && h$1("duet-visually-hidden", null, ", ", this.accessibleLabelExternal))) : (h$1("button", Object.assign({}, commonProps, { type: this.getButtonType(), disabled: this.disabled, name: this.name, value: this.value, "aria-pressed": this.accessiblePressed != null ? this.accessiblePressed.toString() : undefined }), commonChildren)), this.loading && h$1("duet-spinner", { color: "currentColor" }))));
|
|
2634
2634
|
}
|
|
2635
2635
|
get element() { return this; }
|
|
2636
2636
|
static get watchers() { return {
|
|
@@ -2802,7 +2802,7 @@ let DuetCard$1 = class extends H {
|
|
|
2802
2802
|
onKeyDown: this.handleKeyDown,
|
|
2803
2803
|
}
|
|
2804
2804
|
: {};
|
|
2805
|
-
return (h$1(HeadingTag, Object.assign({ class: "duet-card-heading" }, headingProps), h$1("div", { class: "duet-card-heading-grid" }, this.icon && (h$1(Fragment, null, h$1("duet-icon", { class: "duet-card-icon", name: this.icon, size: "medium", margin: "none", color: "currentColor" }), h$1("duet-spacer", { direction: "horizontal", size: "small" }))), h$1("div", { class: "duet-card-heading-text" }, this.heading), this.secondaryHeading && (h$1(Fragment, null, h$1("duet-spacer", { direction: "horizontal", size: "small" }), h$1("div", { class: "duet-card-secondary-heading duet-card-secondary-heading--inline" }, this.secondaryHeading))), this.collapsible && (h$1(Fragment, null, h$1("duet-spacer", { direction: "horizontal", size: "small" }), h$1("duet-icon", { class: "duet-card-caret", icon: actionArrowUp.svg, size: "small", margin: "none", color: "currentColor" })))), this.secondaryHeading && (h$1("div", { class: "duet-card-secondary-heading duet-card-secondary-heading--new-line" }, this.secondaryHeading))));
|
|
2805
|
+
return (h$1(HeadingTag, Object.assign({ class: "duet-card-heading" }, headingProps), h$1("div", { class: "duet-card-heading-grid" }, this.icon && (h$1(Fragment, null, h$1("duet-icon", { class: "duet-card-icon", name: this.icon, size: "medium", margin: "none", color: "currentColor" }), h$1("duet-spacer", { direction: "horizontal", size: "small" }))), h$1("div", { class: "duet-card-heading-text" }, this.heading), this.secondaryHeading && (h$1(Fragment, null, h$1("duet-spacer", { direction: "horizontal", size: "small" }), h$1("div", { class: "duet-card-secondary-heading duet-card-secondary-heading--inline" }, this.secondaryHeading))), this.collapsible && (h$1(Fragment, null, h$1("duet-spacer", { direction: "horizontal", size: "small" }), h$1("duet-icon", { class: "duet-card-caret", icon: actionArrowUp.svg, size: "small", margin: "none", color: "currentColor" })))), this.secondaryHeading && (h$1("div", { class: "duet-card-secondary-heading duet-card-secondary-heading--new-line" }, this.secondaryHeading)), h$1("slot", { name: "below-heading" })));
|
|
2806
2806
|
}
|
|
2807
2807
|
/**
|
|
2808
2808
|
* Sets focus on the specified `duet-card`. Use this method instead of the global
|
|
@@ -6084,7 +6084,7 @@ const DuetHeaderHamburger = () => (h("div", { class: "duet-header-hamburger" },
|
|
|
6084
6084
|
h("span", { class: "duet-header-bar" }),
|
|
6085
6085
|
h("span", { class: "duet-header-bar" })));
|
|
6086
6086
|
|
|
6087
|
-
const duetHeaderCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;width:100%}@supports (position: -webkit-sticky){:host{position:-webkit-sticky;top:-4rem;z-index:400}}@supports (position: sticky){:host{position:sticky;top:-4rem;z-index:400}}@supports (position: -webkit-sticky){:host(.duet-header-multi-level-desktop-variation){top:0}}@supports (position: sticky){:host(.duet-header-multi-level-desktop-variation){top:0}}.duet-header-reserved-space{height:4rem}@media (min-width: 62em){.duet-header-reserved-space.duet-with-links{height:7rem}}.duet-header{-webkit-user-select:none;user-select:none;position:fixed;top:0;left:0;z-index:400;display:block;width:100%;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:0.875rem;font-weight:400;line-height:1.5;color:#00294d;text-align:left}.duet-header.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}@media (min-width: 62em){.duet-header.duet-theme-turva{box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13)}}@media (min-width: 62em){.duet-header{position:absolute;box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07)}.duet-header.duet-header-inactive{position:fixed}}.duet-header *{-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}.duet-header-top{position:relative;z-index:200;display:flex;flex-direction:row;align-items:center;width:100%;height:4rem;padding:0 16px;background:white;border-bottom:1px solid #e1e3e6;box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07)}@media (min-width: 62em){.duet-header-top{z-index:100;padding:0 28px;box-shadow:none}.duet-header-top duet-logo{padding-right:4px}}@media (min-width: 106.25em){.duet-header-top{padding:0 48px}}.duet-theme-turva .duet-header-top{border-color:#e4e4e6;box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13)}@media (min-width: 62em){.duet-theme-turva .duet-header-top{box-shadow:none}}.duet-theme-turva .duet-header-top duet-logo{left:-80px !important;margin-top:-8px !important}.duet-header-top .duet-header-region{max-width:200px;padding-left:16px;margin-top:1px;margin-right:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-left:1px solid #cfd2d4}.duet-theme-turva .duet-header-top .duet-header-region{border-color:#cfcfd1}@media (max-width: 35.9375em){.duet-header-top .duet-header-region{display:none}}@media (min-width: 62em){.duet-header-top .duet-header-region{padding-left:19px}}.duet-header-bottom{position:fixed;top:4rem;bottom:0;left:0;z-index:100;display:flex;flex-direction:column;width:100%;overflow-y:auto;visibility:hidden;background:#f3f9fc;opacity:0;-webkit-overflow-scrolling:touch}.duet-theme-turva .duet-header-bottom{background:#f5f5f7}@media (min-width: 62em){.duet-header-bottom{position:relative;top:auto;bottom:auto;z-index:200;flex-direction:row;overflow:visible;visibility:visible;background:white;opacity:1}.duet-header-bottom.duet-header-inactive{position:relative}}.duet-header-bottom.active{visibility:visible;opacity:1;transition:opacity 300ms ease, visibility 300ms ease}@media (min-width: 62em){.duet-header-bottom{position:relative;transition:none !important}}.duet-header-items,.duet-header-bottom-utils,.duet-header-utils{opacity:0;transition:transform 600ms ease, opacity 600ms ease;transform:translateY(-28px)}@media (min-width: 62em){.duet-header-items,.duet-header-bottom-utils,.duet-header-utils{opacity:1;transition:none !important;transform:none}}.active .duet-header-items,.active .duet-header-bottom-utils,.active .duet-header-utils{opacity:1;transform:translateY(0)}.duet-header-items{position:relative;z-index:300;display:block;width:100%;font-size:1rem;font-weight:400;line-height:1.5;background:white}@media (min-width: 62em){.duet-header-items{z-index:100;display:flex;flex-direction:row;padding:0 21.5384615385px}}@media (min-width: 106.25em){.duet-header-items{padding-left:43.6363636364px}}.duet-header-items .duet-header-item-container{border-bottom:1px solid #e1e3e6;border-radius:0}@media (min-width: 62em){.duet-header-items .duet-header-item-container{border:0}}.duet-header-items .duet-header-second-level .duet-header-item{padding:0 40px;border:0}.duet-header-items .duet-header-second-level .duet-header-button{border:0}.duet-header-items .duet-header-second-level .duet-header-dropdown-content{padding:0;border:0}.duet-header-items .duet-header-third-level .duet-header-item{padding:0 75px}.duet-header-items .duet-header-item{position:relative;display:flex;align-items:center;width:100%;padding:0 20px;overflow:hidden;font-size:1rem;line-height:48px;color:#00294d;text-decoration:none;text-overflow:ellipsis;white-space:nowrap}@media (min-width: 62em){.duet-header-items .duet-header-item{border-radius:4px}}.duet-theme-turva .duet-header-items .duet-header-item{font-weight:600;color:#171c3a;border-color:#e1e3e6}.duet-header-items .duet-header-item:hover{color:#004d80}.duet-theme-turva .duet-header-items .duet-header-item:hover{color:#444445}.duet-header-items .duet-header-item:focus{outline:0}:host(.user-is-tabbing) .duet-header-items .duet-header-item:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing) .duet-theme-turva .duet-header-items .duet-header-item:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}@media (min-width: 62em){.duet-header-items .duet-header-item{width:auto;max-width:300px;padding:0 12px;overflow:hidden;font-size:0.875rem;text-overflow:ellipsis;border:0}}.duet-header-items .duet-header-item.active{color:#0077b3;-moz-osx-font-smoothing:auto;-webkit-font-smoothing:subpixel-antialiased}.duet-theme-turva .duet-header-items .duet-header-item.active{color:#c60c30}.duet-header-items .duet-header-item.active:hover{color:#0077b3}.duet-theme-turva .duet-header-items .duet-header-item.active:hover{color:#c60c30}.duet-header-items .duet-header-item.active::after{position:absolute;top:0;bottom:0;left:0;width:4px;content:\"\";background:#0077b3}.duet-theme-turva .duet-header-items .duet-header-item.active::after{background:#c60c30}@media (min-width: 62em){.duet-header-items .duet-header-item.active::after{top:auto;left:12px;width:calc(100% - 24px);height:3px}}.duet-header-third-level-active .duet-header-items .duet-header-first-level.active{color:#00294d}.duet-header-third-level-active .duet-header-items .duet-header-first-level.active::after{display:none}.duet-header-third-level-active .duet-header-items .duet-header-second-level button{color:#00294d}.duet-header-toggle{display:flex;align-items:center;justify-content:center;width:48px;height:48px;margin-right:-8px;margin-left:auto;cursor:pointer;border-radius:4px;-webkit-appearance:none;appearance:none}.duet-header-toggle:focus{outline:0}:host(.user-is-tabbing) .duet-header-toggle:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing) .duet-theme-turva .duet-header-toggle:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}@media (min-width: 62em){.duet-header-toggle{display:none}}.duet-header-hamburger{position:relative;width:24px;height:24px;margin-top:5px !important;pointer-events:none;transition:0.4s ease-in-out;backface-visibility:hidden}.duet-header-hamburger .duet-header-bar{position:absolute;left:0;display:block;width:100%;height:2px;background:#00294d;border-radius:20rem;opacity:1;transition:0.25s ease-in-out;transform:rotate(0deg) scale(0.98)}.duet-theme-turva .duet-header-hamburger .duet-header-bar{background:#171c3a}.duet-header-hamburger .duet-header-bar:nth-child(1){top:0}.duet-header-hamburger .duet-header-bar:nth-child(2),.duet-header-hamburger .duet-header-bar:nth-child(3){top:7px}.duet-header-hamburger .duet-header-bar:nth-child(4){top:14px}button.active .duet-header-hamburger .duet-header-bar:nth-child(1){top:7px;left:50%;width:0%}button.active .duet-header-hamburger .duet-header-bar:nth-child(2){transform:rotate(45deg)}button.active .duet-header-hamburger .duet-header-bar:nth-child(3){transform:rotate(-45deg)}button.active .duet-header-hamburger .duet-header-bar:nth-child(4){top:7px;left:50%;width:0%}.duet-header-utils{display:flex;flex-direction:column;width:100%}@media (min-width: 62em){.duet-header-utils{position:absolute;top:-4rem;right:0;z-index:999999999;flex-direction:row;align-items:center;justify-content:space-between;width:auto;margin-right:20px}}@media (min-width: 106.25em){.duet-header-utils{margin-right:36px}}@media (min-width: 62em){.duet-header-bottom-utils{position:absolute;top:0;right:0;z-index:999999999;margin-right:20px}}@media (min-width: 106.25em){.duet-header-bottom-utils{margin-right:36px}}button{font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-theme-turva button{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-header-button{position:relative;display:flex;align-items:center;width:100%;height:48px;padding:0 20px;overflow:hidden;font-size:1rem;font-weight:400;line-height:48px;color:#00294d;text-align:left;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;border-bottom:1px solid #e1e3e6;border-radius:4px;-webkit-appearance:none;appearance:none}.duet-theme-turva .duet-header-button{color:#171c3a;border-color:#e4e4e6}.duet-header-button:hover{color:#004d80}.duet-theme-turva .duet-header-button:hover{color:#444445}.duet-header-button:focus{outline:0}:host(.user-is-tabbing) .duet-header-button:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing) .duet-theme-turva .duet-header-button:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-header-button:active{opacity:0.75}@media (min-width: 62em){.duet-header-button{width:auto;max-width:200px;height:4rem;padding:0 16px;font-size:0.875rem;line-height:4rem;border:0}.duet-header-button::before{position:absolute;top:50%;right:0;width:1px;height:20px;content:\"\";background:#cfd2d4;transform:translateY(-50%)}.duet-theme-turva .duet-header-button::before{background:#cfcfd1}}.duet-header-button.active{color:#0077b3;border-radius:0}.duet-theme-turva .duet-header-button.active{color:#c60c30}.duet-header-button.active:hover{color:#0077b3}.duet-theme-turva .duet-header-button.active:hover{color:#c60c30}.duet-header-button.active::after{position:absolute;top:0;bottom:0;left:0;width:3px;content:\"\";background:#0077b3}.duet-theme-turva .duet-header-button.active::after{color:#c60c30}.duet-header-utils .duet-header-button.duet-header-logout{align-self:center;justify-content:center;width:auto;height:2.5rem;margin:2.25rem 0;font-weight:600;border:2px solid #00294d;border-radius:20rem}.duet-theme-turva .duet-header-utils .duet-header-button.duet-header-logout{border-color:#171c3a}.duet-header-utils .duet-header-button.duet-header-logout .duet-header-icon{margin-right:0.5rem}.duet-header-utils .duet-header-button.duet-header-logout .duet-header-button-label{font-size:0.875rem}@media (min-width: 62em){.duet-header-utils .duet-header-button.duet-header-logout{height:4rem;margin:0;font-weight:400;border:0}.duet-header-utils .duet-header-button.duet-header-logout .duet-header-icon{margin-right:0.75rem}}.duet-header-no-action{pointer-events:none}.duet-header-user-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (min-width: 62em){.duet-header-utils>*:last-child::before,.duet-header-utils>*:last-child button::before{display:none}}@media (min-width: 62em){.duet-header-utils>*:last-child .duet-header-dropdown-content{right:0;left:auto}}.duet-header-language{text-transform:uppercase}.duet-header-icon{display:inline-flex;min-width:12px;margin-right:12px;font-size:0;line-height:normal;vertical-align:baseline}@media (min-width: 62em){.duet-header-icon{margin-right:8px}}.duet-header-caret{position:absolute;top:50%;right:20px;display:flex;width:10px;height:10px;margin-left:8px;line-height:normal;pointer-events:none;transition:300ms ease;transform:translateY(-50%);transform-origin:50% 50%}@media (min-width: 62em){.duet-header-caret{width:7px;height:7px}}.duet-header-caret duet-icon{width:10px}.duet-header-dropdown-toggle.active .duet-header-caret{transform:translateY(-50%) rotate(180deg)}.duet-header-dropdown-toggle:focus{outline:0}:host(.user-is-tabbing) .duet-header-dropdown-toggle:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing) .duet-theme-turva .duet-header-dropdown-toggle:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-header-dropdown-toggle:active{outline:none}.duet-header-badge{display:inline-block;width:6px;height:6px;margin-top:-1rem;margin-left:5px;vertical-align:top;background:#f7b228;border-radius:50%;box-shadow:0 0 0 1px #c18b1f}.duet-theme-turva .duet-header-badge{background:#faa40f}.duet-header-dropdown{position:relative}@media (min-width: 62em){.duet-header-dropdown .duet-header-dropdown-toggle{z-index:200;padding-right:36px;overflow:hidden;transition:border 300ms ease}}.duet-header-dropdown .duet-header-dropdown-toggle::after{display:none !important}@media (min-width: 62em){.duet-header-dropdown .duet-header-dropdown-toggle::after{position:absolute;top:auto;bottom:0;left:0;display:block !important;width:100%;height:3px;content:\"\";background:#0077b3;transition:300ms ease;transform:translateY(3px)}.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle::after{background:#c60c30}}.duet-header-dropdown .duet-header-dropdown-toggle.active,.duet-header-dropdown .duet-header-dropdown-toggle.active:hover{color:#004d80;border-bottom:1px solid #f5f8fa}.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active,.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active:hover{color:#444445;border-color:#f5f5f7}@media (min-width: 62em){.duet-header-dropdown .duet-header-dropdown-toggle.active,.duet-header-dropdown .duet-header-dropdown-toggle.active:hover{border:0}.duet-header-dropdown .duet-header-dropdown-toggle.active::after,.duet-header-dropdown .duet-header-dropdown-toggle.active:hover::after{position:absolute;top:auto;bottom:0;left:0;width:100%;height:3px;transform:translateY(0)}}.duet-header-dropdown .duet-header-dropdown-content{display:none;padding-bottom:16px;background:#f3f9fc;border-bottom:1px solid #e1e3e6}.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content{background:#f5f5f7;border-color:#e1e3e6}@media (min-width: 62em){.duet-header-dropdown .duet-header-dropdown-content{position:absolute;top:100%;left:0;z-index:600;display:block;min-width:150px;padding-top:16px;padding-left:0;visibility:hidden;border:0;border-radius:4px;border-top-left-radius:0;border-top-right-radius:0;box-shadow:0 4px 10px 0 rgba(0, 41, 77, 0.15);opacity:0;transition:300ms ease;transform:scale(0.85) translateZ(0) translateY(-20px)}}@media (min-width: 64.0625em){.duet-header-dropdown .duet-header-dropdown-content{min-width:170px}}.duet-header-dropdown .duet-header-dropdown-content.active{display:block}@media (min-width: 62em){.duet-header-dropdown .duet-header-dropdown-content.active{visibility:visible;opacity:1;transform:translateZ(0) translateY(0)}}.duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item){padding:3px 8px 4px !important;position:relative;display:block;width:100%;padding-right:16px;padding-left:48px !important;overflow:hidden;font-size:0.875rem;font-weight:400;line-height:1.5;color:#00294d;text-align:left;text-decoration:none;white-space:nowrap;cursor:pointer;transition:300ms ease}.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item){color:#171c3a}@media (min-width: 62em){.duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item){padding-right:20px !important;padding-left:20px !important}}@media (min-width: 62em){.duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):hover{background:#e6f2f8}.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):hover{background:#f9e6ea}}.duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus{outline:0}:host(.user-is-tabbing) .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing) .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active{padding-right:36px;font-weight:600;vertical-align:baseline;pointer-events:none}.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active{font-weight:700}@media (min-width: 62em){.duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active{color:white;background:#0077b3}.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active{background:#c60c30}}.duet-header-dropdown .duet-header-dropdown-content .duet-header-link-external{margin-left:4px}.duet-header-back .duet-header-top{flex-direction:row;align-items:center;justify-content:center}.duet-header-back duet-button{position:absolute;top:50%;left:36px;transform:translateY(-50%)}@media (max-width: 35.9375em){.duet-header-back duet-button{left:20px;max-width:40px;padding:0 12px;overflow:hidden}}.duet-header-back .duet-header-toggle{display:none !important}.duet-header-skip{padding:15px 28px 16px !important;position:absolute;top:-100%;left:-100%;z-index:200;width:1px;min-width:190px;height:1px;overflow:hidden;font-weight:600;color:#0077b3;text-align:center;text-decoration:none;background:white;border-radius:4px;opacity:0}.duet-header-skip:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-header-skip:focus,.duet-header-skip:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-theme-turva .duet-header-skip{min-width:120px;color:#171c3a}@media (min-width: 106.25em){.duet-header-skip{margin-left:20px}}.duet-header-skip:focus{top:12px;left:20px;width:auto;height:auto;outline:0;opacity:1}.duet-header-multi-level-desktop{height:6rem}.duet-header-multi-level-desktop .duet-header-top{justify-content:space-between;height:6rem}.duet-header-multi-level-desktop .duet-header-button{height:6rem}.duet-header-multi-level-desktop .logo-and-segment{display:flex;flex-basis:0;flex-direction:column;flex-grow:1;padding-top:1rem}.duet-header-multi-level-desktop .logo-and-segment .duet-header-dropdown{z-index:400;margin-left:2rem}.duet-header-multi-level-desktop .logo-and-segment .duet-header-dropdown .duet-header-dropdown-content{background:#f3f9fc}.duet-header-multi-level-desktop .logo-and-segment button{align-items:flex-start;height:2rem;font-weight:600;line-height:1rem}.duet-header-multi-level-desktop .logo-and-segment button::before{display:none}.duet-header-multi-level-desktop .logo-and-segment .duet-header-caret{top:25%}.duet-header-multi-level-desktop-nav{display:flex}.duet-header-multi-level-desktop-nav .duet-header-dropdown{position:static}.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-toggle{z-index:400;padding-right:1rem;font-size:1rem;font-weight:600}.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-toggle.active{color:#0077b3}.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content{z-index:399;display:flex;justify-content:center;width:100%;height:4.5rem;padding:0;background:#f3f9fc;border-top:1px solid #e1e3e6;border-bottom:1px solid #e1e3e6;box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07);transition:none}.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:auto;min-width:6rem;height:100%;padding:0 1rem !important;font-weight:600}.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a::after{position:absolute;top:auto;bottom:0;left:0;display:block !important;width:100%;height:3px;content:\"\";background:#0077b3;transition:300ms ease;transform:translateY(3px)}.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a.active{font-weight:600;color:#0077b3;background:none}.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a.active::after{transform:translateY(0)}.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a .duet-header-icon{margin:0}.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content .duet-header-badge{position:absolute;margin-top:-2rem;margin-right:-2.25rem}.duet-header-multi-level-desktop-nav button::before{display:none}.duet-header-multi-level-desktop-nav .duet-header-caret{display:none}.duet-header-multi-level-desktop-utils{display:flex;flex-basis:0;flex-grow:1;justify-content:flex-end}.duet-header-multi-level-desktop-utils>:last-child::before{display:none}.duet-header-multi-level-desktop-utils .duet-header-dropdown{z-index:400}.duet-header-multi-level-desktop-utils .duet-header-dropdown .duet-header-dropdown-content{background:#f3f9fc}.duet-header-multi-level-desktop-utils .duet-header-button-label,.duet-header-multi-level-desktop-utils .duet-header-dropdown-label{display:none}@media (min-width: 64.0625em){.duet-header-multi-level-desktop-utils .duet-header-button-label,.duet-header-multi-level-desktop-utils .duet-header-dropdown-label{display:initial}}.duet-header-multi-level-desktop .duet-theme-turva .logo-and-segment .duet-header-dropdown .duet-header-dropdown-content{background:#fcf3f4}.duet-header-multi-level-desktop .duet-theme-turva .duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-toggle.active{color:#c60c30}.duet-header-multi-level-desktop .duet-theme-turva .duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content{background:#fcf3f4;border-color:#e4e4e6}.duet-header-multi-level-desktop .duet-theme-turva .duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a::after{background:#c60c30}.duet-header-multi-level-desktop .duet-theme-turva .duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a.active{color:#c60c30;background:none}.duet-header-multi-level-desktop .duet-theme-turva .duet-header-multi-level-desktop-utils .duet-header-dropdown .duet-header-dropdown-content{background:#fcf3f4}";
|
|
6087
|
+
const duetHeaderCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;width:100%}@supports (position: -webkit-sticky){:host{position:-webkit-sticky;top:-4rem;z-index:400}}@supports (position: sticky){:host{position:sticky;top:-4rem;z-index:400}}@supports (position: -webkit-sticky){:host(.duet-header-multi-level-desktop-variation){top:0}}@supports (position: sticky){:host(.duet-header-multi-level-desktop-variation){top:0}}.duet-header-reserved-space{height:4rem}@media (min-width: 62em){.duet-header-reserved-space.duet-with-links{height:7rem}}.duet-header{-webkit-user-select:none;user-select:none;position:fixed;top:0;left:0;z-index:400;display:block;width:100%;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:0.875rem;font-weight:400;line-height:1.5;color:#00294d;text-align:left}.duet-header.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}@media (min-width: 62em){.duet-header.duet-theme-turva{box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13)}}@media (min-width: 62em){.duet-header{position:absolute;box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07)}.duet-header.duet-header-inactive{position:fixed}}.duet-header *{-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}.duet-header-top{position:relative;z-index:200;display:flex;flex-direction:row;align-items:center;width:100%;height:4rem;padding:0 16px;background:white;border-bottom:1px solid #e1e3e6;box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07)}@media (min-width: 62em){.duet-header-top{z-index:100;padding:0 28px;box-shadow:none}.duet-header-top duet-logo{padding-right:4px}}@media (min-width: 106.25em){.duet-header-top{padding:0 48px}}.duet-theme-turva .duet-header-top{border-color:#e4e4e6;box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13)}@media (min-width: 62em){.duet-theme-turva .duet-header-top{box-shadow:none}}.duet-theme-turva .duet-header-top duet-logo{left:-80px !important;margin-top:-8px !important}.duet-header-top .duet-header-region{max-width:200px;padding-left:16px;margin-top:1px;margin-right:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-left:1px solid #cfd2d4}.duet-theme-turva .duet-header-top .duet-header-region{border-color:#cfcfd1}@media (max-width: 35.9375em){.duet-header-top .duet-header-region{display:none}}@media (min-width: 62em){.duet-header-top .duet-header-region{padding-left:19px}}.duet-header-bottom{position:fixed;top:4rem;bottom:0;left:0;z-index:100;display:flex;flex-direction:column;width:100%;overflow-y:auto;visibility:hidden;background:#f3f9fc;opacity:0;-webkit-overflow-scrolling:touch}.duet-theme-turva .duet-header-bottom{background:#f5f5f7}@media (min-width: 62em){.duet-header-bottom{position:relative;top:auto;bottom:auto;z-index:200;flex-direction:row;overflow:visible;visibility:visible;background:white;opacity:1}.duet-header-bottom.duet-header-inactive{position:relative}}.duet-header-bottom.active{visibility:visible;opacity:1;transition:opacity 300ms ease, visibility 300ms ease}@media (min-width: 62em){.duet-header-bottom{position:relative;transition:none !important}}.duet-header-items,.duet-header-bottom-utils,.duet-header-utils{opacity:0;transition:transform 600ms ease, opacity 600ms ease;transform:translateY(-28px)}@media (min-width: 62em){.duet-header-items,.duet-header-bottom-utils,.duet-header-utils{opacity:1;transition:none !important;transform:none}}.active .duet-header-items,.active .duet-header-bottom-utils,.active .duet-header-utils{opacity:1;transform:translateY(0)}.duet-header-items{position:relative;z-index:300;display:block;width:100%;font-size:1rem;font-weight:400;line-height:1.5;background:white}@media (min-width: 62em){.duet-header-items{z-index:100;display:flex;flex-direction:row;padding:0 21.5384615385px}}@media (min-width: 106.25em){.duet-header-items{padding-left:43.6363636364px}}.duet-header-items .duet-header-item-container{border-bottom:1px solid #e1e3e6;border-radius:0}@media (min-width: 62em){.duet-header-items .duet-header-item-container{border:0}}.duet-header-items .duet-header-second-level .duet-header-item{padding:0 40px;border:0}.duet-header-items .duet-header-second-level .duet-header-button{border:0}.duet-header-items .duet-header-second-level .duet-header-dropdown-content{padding:0;border:0}.duet-header-items .duet-header-third-level .duet-header-item{padding:0 75px}.duet-header-items .duet-header-item{position:relative;display:flex;align-items:center;width:100%;padding:0 20px;overflow:hidden;font-size:1rem;line-height:48px;color:#00294d;text-decoration:none;text-overflow:ellipsis;white-space:nowrap}@media (min-width: 62em){.duet-header-items .duet-header-item{border-radius:4px}}.duet-theme-turva .duet-header-items .duet-header-item{font-weight:600;color:#171c3a;border-color:#e1e3e6}.duet-header-items .duet-header-item:hover{color:#004d80}.duet-theme-turva .duet-header-items .duet-header-item:hover{color:#444445}.duet-header-items .duet-header-item:focus{outline:0}:host(.user-is-tabbing) .duet-header-items .duet-header-item:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing) .duet-theme-turva .duet-header-items .duet-header-item:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}@media (min-width: 62em){.duet-header-items .duet-header-item{width:auto;max-width:300px;padding:0 12px;overflow:hidden;font-size:0.875rem;text-overflow:ellipsis;border:0}}.duet-header-items .duet-header-item.active{color:#0077b3}.duet-theme-turva .duet-header-items .duet-header-item.active{color:#c60c30}.duet-header-items .duet-header-item.active:hover{color:#0077b3}.duet-theme-turva .duet-header-items .duet-header-item.active:hover{color:#c60c30}.duet-header-items .duet-header-item.active::after{position:absolute;top:0;bottom:0;left:0;width:4px;content:\"\";background:#0077b3}.duet-theme-turva .duet-header-items .duet-header-item.active::after{background:#c60c30}@media (min-width: 62em){.duet-header-items .duet-header-item.active::after{top:auto;left:12px;width:calc(100% - 24px);height:3px}}.duet-header-toggle{display:flex;align-items:center;justify-content:center;width:48px;height:48px;margin-right:-8px;margin-left:auto;cursor:pointer;border-radius:4px;-webkit-appearance:none;appearance:none}.duet-header-toggle:focus{outline:0}:host(.user-is-tabbing) .duet-header-toggle:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing) .duet-theme-turva .duet-header-toggle:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}@media (min-width: 62em){.duet-header-toggle{display:none}}.duet-header-hamburger{position:relative;width:24px;height:24px;margin-top:5px !important;pointer-events:none;transition:0.4s ease-in-out;backface-visibility:hidden}.duet-header-hamburger .duet-header-bar{position:absolute;left:0;display:block;width:100%;height:2px;background:#00294d;border-radius:20rem;opacity:1;transition:0.25s ease-in-out;transform:rotate(0deg) scale(0.98)}.duet-theme-turva .duet-header-hamburger .duet-header-bar{background:#171c3a}.duet-header-hamburger .duet-header-bar:nth-child(1){top:0}.duet-header-hamburger .duet-header-bar:nth-child(2),.duet-header-hamburger .duet-header-bar:nth-child(3){top:7px}.duet-header-hamburger .duet-header-bar:nth-child(4){top:14px}button.active .duet-header-hamburger .duet-header-bar:nth-child(1){top:7px;left:50%;width:0%}button.active .duet-header-hamburger .duet-header-bar:nth-child(2){transform:rotate(45deg)}button.active .duet-header-hamburger .duet-header-bar:nth-child(3){transform:rotate(-45deg)}button.active .duet-header-hamburger .duet-header-bar:nth-child(4){top:7px;left:50%;width:0%}.duet-header-utils{display:flex;flex-direction:column;width:100%}@media (min-width: 62em){.duet-header-utils{position:absolute;top:-4rem;right:0;z-index:999999999;flex-direction:row;align-items:center;justify-content:space-between;width:auto;margin-right:20px}}@media (min-width: 106.25em){.duet-header-utils{margin-right:36px}}@media (min-width: 62em){.duet-header-bottom-utils{position:absolute;top:0;right:0;z-index:999999999;margin-right:20px}}@media (min-width: 106.25em){.duet-header-bottom-utils{margin-right:36px}}button{font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-theme-turva button{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-header-button{position:relative;display:flex;align-items:center;width:100%;height:48px;padding:0 20px;overflow:hidden;font-size:1rem;font-weight:400;line-height:48px;color:#00294d;text-align:left;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;border-bottom:1px solid #e1e3e6;border-radius:4px;-webkit-appearance:none;appearance:none}.duet-theme-turva .duet-header-button{color:#171c3a;border-color:#e4e4e6}.duet-header-button:hover{color:#004d80}.duet-theme-turva .duet-header-button:hover{color:#444445}.duet-header-button:focus{outline:0}:host(.user-is-tabbing) .duet-header-button:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing) .duet-theme-turva .duet-header-button:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-header-button:active{opacity:0.75}@media (min-width: 62em){.duet-header-button{width:auto;max-width:200px;height:4rem;padding:0 16px;font-size:0.875rem;line-height:4rem;border:0}.duet-header-button::before{position:absolute;top:50%;right:0;width:1px;height:20px;content:\"\";background:#cfd2d4;transform:translateY(-50%)}.duet-theme-turva .duet-header-button::before{background:#cfcfd1}}.duet-header-button.active{color:#0077b3;border-radius:0}.duet-theme-turva .duet-header-button.active{color:#c60c30}.duet-header-button.active:hover{color:#0077b3}.duet-theme-turva .duet-header-button.active:hover{color:#c60c30}@media (min-width: 62em){.duet-header-button.active::after{position:absolute;top:0;bottom:0;left:0;width:3px;content:\"\";background:#0077b3}.duet-theme-turva .duet-header-button.active::after{color:#c60c30}}.duet-header-utils .duet-header-button.duet-header-logout{align-self:center;justify-content:center;width:auto;height:2.5rem;margin:2.25rem 0;font-weight:600;border:2px solid #00294d;border-radius:20rem}.duet-theme-turva .duet-header-utils .duet-header-button.duet-header-logout{border-color:#171c3a}.duet-header-utils .duet-header-button.duet-header-logout .duet-header-icon{margin-right:0.5rem}.duet-header-utils .duet-header-button.duet-header-logout .duet-header-button-label{font-size:0.875rem}@media (min-width: 62em){.duet-header-utils .duet-header-button.duet-header-logout{height:4rem;margin:0;font-weight:400;border:0}.duet-header-utils .duet-header-button.duet-header-logout .duet-header-icon{margin-right:0.75rem}}.duet-header-no-action{pointer-events:none}.duet-header-user-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (min-width: 62em){.duet-header-utils>*:last-child::before,.duet-header-utils>*:last-child button::before{display:none}}@media (min-width: 62em){.duet-header-utils>*:last-child .duet-header-dropdown-content{right:0;left:auto}}.duet-header-language{text-transform:uppercase}.duet-header-language.active,.duet-header-language.active:hover,.duet-header-contact.active,.duet-header-contact.active:hover{color:inherit}.duet-header-dropdown .duet-header-language.duet-header-dropdown-toggle.active::after,.duet-header-dropdown .duet-header-language.duet-header-dropdown-toggle.active:hover::after,.duet-header-dropdown .duet-header-contact.duet-header-dropdown-toggle.active::after,.duet-header-dropdown .duet-header-contact.duet-header-dropdown-toggle.active:hover::after{width:0}@media (min-width: 62em){.duet-header-dropdown .duet-header-language.duet-header-dropdown-toggle.active::after,.duet-header-dropdown .duet-header-language.duet-header-dropdown-toggle.active:hover::after,.duet-header-dropdown .duet-header-contact.duet-header-dropdown-toggle.active::after,.duet-header-dropdown .duet-header-contact.duet-header-dropdown-toggle.active:hover::after{width:100%}}.duet-header-icon{display:inline-flex;min-width:12px;margin-right:12px;font-size:0;line-height:normal;vertical-align:baseline}@media (min-width: 62em){.duet-header-icon{margin-right:8px}}.duet-header-caret{position:absolute;top:50%;right:20px;display:flex;width:10px;height:10px;margin-left:8px;line-height:normal;pointer-events:none;transition:300ms ease;transform:translateY(-50%);transform-origin:50% 50%}@media (min-width: 62em){.duet-header-caret{width:7px;height:7px}}.duet-header-caret duet-icon{width:10px}.duet-header-dropdown-toggle.active .duet-header-caret{transform:translateY(-50%) rotate(180deg)}.duet-header-dropdown-toggle:focus{outline:0}:host(.user-is-tabbing) .duet-header-dropdown-toggle:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing) .duet-theme-turva .duet-header-dropdown-toggle:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-header-dropdown-toggle:active{outline:none}.duet-header-badge{display:inline-block;width:6px;height:6px;margin-top:-1rem;margin-left:5px;vertical-align:top;background:#f7b228;border-radius:50%;box-shadow:0 0 0 1px #c18b1f}.duet-theme-turva .duet-header-badge{background:#faa40f}.active-bar{color:#0077b3}.active-bar::after{position:absolute;top:0;bottom:0;left:0;width:4px;content:\"\";background:#0077b3}.duet-theme-turva .active-bar::after{background:#c60c30}.duet-header-dropdown{position:relative}@media (min-width: 62em){.duet-header-dropdown .duet-header-dropdown-toggle{z-index:200;padding-right:36px;overflow:hidden;transition:border 300ms ease}}@media (min-width: 62em){.duet-header-dropdown .duet-header-dropdown-toggle::after{position:absolute;top:auto;bottom:0;left:0;display:block !important;width:100%;height:3px !important;content:\"\";background:#0077b3;transition:300ms ease;transform:translateY(3px)}.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle::after{background:#c60c30}}.duet-header-dropdown .duet-header-dropdown-toggle.active,.duet-header-dropdown .duet-header-dropdown-toggle.active:hover{border-bottom:1px solid #f5f8fa}.duet-header-dropdown .duet-header-dropdown-toggle.active::after,.duet-header-dropdown .duet-header-dropdown-toggle.active:hover::after{position:absolute;top:0;bottom:0;left:0;width:4px;content:\"\";background:#0077b3}.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active::after,.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active:hover::after{background:#c60c30}.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active,.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active:hover{color:#444445;border-color:#f5f5f7}@media (min-width: 62em){.duet-header-dropdown .duet-header-dropdown-toggle.active,.duet-header-dropdown .duet-header-dropdown-toggle.active:hover{color:#004d80;border:0}.duet-header-dropdown .duet-header-dropdown-toggle.active::after,.duet-header-dropdown .duet-header-dropdown-toggle.active:hover::after{position:absolute;top:auto;bottom:0;left:0;width:100%;height:3px;transform:translateY(0)}}.duet-header-dropdown .duet-header-dropdown-content{display:none;padding-bottom:16px;background:#f3f9fc;border-bottom:1px solid #e1e3e6}.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content{background:#f5f5f7;border-color:#e1e3e6}@media (min-width: 62em){.duet-header-dropdown .duet-header-dropdown-content{position:absolute;top:100%;left:0;z-index:600;display:block;min-width:150px;padding-top:16px;padding-left:0;visibility:hidden;border:0;border-radius:4px;border-top-left-radius:0;border-top-right-radius:0;box-shadow:0 4px 10px 0 rgba(0, 41, 77, 0.15);opacity:0;transition:300ms ease;transform:scale(0.85) translateZ(0) translateY(-20px)}}@media (min-width: 64.0625em){.duet-header-dropdown .duet-header-dropdown-content{min-width:170px}}.duet-header-dropdown .duet-header-dropdown-content.active{display:block}@media (min-width: 62em){.duet-header-dropdown .duet-header-dropdown-content.active{visibility:visible;opacity:1;transform:translateZ(0) translateY(0)}}.duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item){padding:3px 8px 4px !important;position:relative;display:block;width:100%;padding-right:16px;padding-left:48px !important;overflow:hidden;font-size:0.875rem;font-weight:400;line-height:1.5;color:#00294d;text-align:left;text-decoration:none;white-space:nowrap;cursor:pointer;transition:300ms ease}.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item){color:#171c3a}@media (min-width: 62em){.duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item){padding-right:20px !important;padding-left:20px !important}}@media (min-width: 62em){.duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):hover{background:#e6f2f8}.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):hover{background:#f9e6ea}}.duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus{outline:0}:host(.user-is-tabbing) .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing) .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active{padding-right:36px;font-weight:600;vertical-align:baseline}.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active{font-weight:700}@media (min-width: 62em){.duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active{color:white;background:#0077b3}.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active{background:#c60c30}}.duet-header-dropdown .duet-header-dropdown-content .duet-header-link-external{margin-left:4px}.duet-header-back .duet-header-top{flex-direction:row;align-items:center;justify-content:center}.duet-header-back duet-button{position:absolute;top:50%;left:36px;transform:translateY(-50%)}@media (max-width: 35.9375em){.duet-header-back duet-button{left:20px;max-width:40px;padding:0 12px;overflow:hidden}}.duet-header-back .duet-header-toggle{display:none !important}.duet-header-skip{padding:15px 28px 16px !important;position:absolute;top:-100%;left:-100%;z-index:200;width:1px;min-width:190px;height:1px;overflow:hidden;font-weight:600;color:#0077b3;text-align:center;text-decoration:none;background:white;border-radius:4px;opacity:0}.duet-header-skip:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-header-skip:focus,.duet-header-skip:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-theme-turva .duet-header-skip{min-width:120px;color:#171c3a}@media (min-width: 106.25em){.duet-header-skip{margin-left:20px}}.duet-header-skip:focus{top:12px;left:20px;width:auto;height:auto;outline:0;opacity:1}.duet-header-multi-level-desktop{height:6rem}.duet-header-multi-level-desktop .duet-header-top{justify-content:space-between;height:6rem}.duet-header-multi-level-desktop .duet-header-button{height:6rem}.duet-header-multi-level-desktop .logo-and-segment{display:flex;flex-basis:0;flex-direction:column;flex-grow:1;padding-top:1rem}.duet-header-multi-level-desktop .logo-and-segment .duet-header-dropdown{z-index:400;margin-left:2rem}.duet-header-multi-level-desktop .logo-and-segment .duet-header-dropdown .duet-header-dropdown-content{background:#f3f9fc}.duet-header-multi-level-desktop .logo-and-segment button{align-items:flex-start;height:2rem;font-weight:600;line-height:1rem}.duet-header-multi-level-desktop .logo-and-segment button::before{display:none}.duet-header-multi-level-desktop .logo-and-segment .duet-header-caret{top:25%}.duet-header-multi-level-desktop-nav{display:flex}.duet-header-multi-level-desktop-nav .duet-header-dropdown{position:static}.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-toggle{z-index:400;padding-right:1rem;font-size:1rem;font-weight:600}.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-toggle.active{color:#0077b3}.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content{z-index:399;display:flex;justify-content:center;width:100%;height:4.5rem;padding:0;background:#f3f9fc;border-top:1px solid #e1e3e6;border-bottom:1px solid #e1e3e6;box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07);transition:none}.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:auto;min-width:6rem;height:100%;padding:0 1rem !important;font-weight:600}.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a::after{position:absolute;top:auto;bottom:0;left:0;display:block !important;width:100%;height:3px;content:\"\";background:#0077b3;transition:300ms ease;transform:translateY(3px)}.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a.active{font-weight:600;color:#0077b3;background:none}.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a.active::after{transform:translateY(0)}.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a .duet-header-icon{margin:0}.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content .duet-header-badge{position:absolute;margin-top:-2rem;margin-right:-2.25rem}.duet-header-multi-level-desktop-nav button::before{display:none}.duet-header-multi-level-desktop-nav .duet-header-caret{display:none}.duet-header-multi-level-desktop-utils{display:flex;flex-basis:0;flex-grow:1;justify-content:flex-end}.duet-header-multi-level-desktop-utils>:last-child::before{display:none}.duet-header-multi-level-desktop-utils .duet-header-dropdown{z-index:400}.duet-header-multi-level-desktop-utils .duet-header-dropdown .duet-header-dropdown-content{background:#f3f9fc}.duet-header-multi-level-desktop-utils .duet-header-button-label,.duet-header-multi-level-desktop-utils .duet-header-dropdown-label{display:none}@media (min-width: 64.0625em){.duet-header-multi-level-desktop-utils .duet-header-button-label,.duet-header-multi-level-desktop-utils .duet-header-dropdown-label{display:initial}}.duet-header-multi-level-desktop .duet-theme-turva .logo-and-segment .duet-header-dropdown .duet-header-dropdown-content{background:#fcf3f4}.duet-header-multi-level-desktop .duet-theme-turva .duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-toggle.active{color:#c60c30}.duet-header-multi-level-desktop .duet-theme-turva .duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content{background:#fcf3f4;border-color:#e4e4e6}.duet-header-multi-level-desktop .duet-theme-turva .duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a::after{background:#c60c30}.duet-header-multi-level-desktop .duet-theme-turva .duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a.active{color:#c60c30;background:none}.duet-header-multi-level-desktop .duet-theme-turva .duet-header-multi-level-desktop-utils .duet-header-dropdown .duet-header-dropdown-content{background:#fcf3f4}";
|
|
6088
6088
|
|
|
6089
6089
|
const createEvent = (ev, data) => ({
|
|
6090
6090
|
component: "duet-header",
|
|
@@ -6578,6 +6578,8 @@ let DuetHeader$1 = class extends H {
|
|
|
6578
6578
|
})), h$1("div", { class: "duet-header-multi-level-desktop-utils" }, processedSearch, languageDropdown, processedSession), h$1("slot", { name: "utility" }))))));
|
|
6579
6579
|
}
|
|
6580
6580
|
// Default variation
|
|
6581
|
+
const isSecondLevelActive = this.processedItems &&
|
|
6582
|
+
this.processedItems.some(item => item.items && item.items.some(secondLevelItem => secondLevelItem.active === true));
|
|
6581
6583
|
const isThirdLevelActive = this.processedItems &&
|
|
6582
6584
|
this.processedItems.some(item => item.items &&
|
|
6583
6585
|
item.items.some(secondLevelItem => secondLevelItem.items && secondLevelItem.items.some(thirdLevelItem => thirdLevelItem.active === true)));
|
|
@@ -6586,6 +6588,7 @@ let DuetHeader$1 = class extends H {
|
|
|
6586
6588
|
} }, h$1("div", { class: {
|
|
6587
6589
|
"duet-header-reserved-space": true,
|
|
6588
6590
|
"duet-with-links": !!this.processedItems,
|
|
6591
|
+
"duet-header-second-level-active": isSecondLevelActive,
|
|
6589
6592
|
"duet-header-third-level-active": isThirdLevelActive,
|
|
6590
6593
|
} }, h$1("header", { class: {
|
|
6591
6594
|
"duet-header": true,
|
|
@@ -6603,19 +6606,26 @@ let DuetHeader$1 = class extends H {
|
|
|
6603
6606
|
this.processedItems.map((item, itemIndex) => (h$1("div", { class: "duet-header-item-container" }, h$1("a", { class: {
|
|
6604
6607
|
"duet-header-first-level": true,
|
|
6605
6608
|
"duet-header-item": true,
|
|
6606
|
-
active: (!itemsHaveSubItems && this.currentHref === item.href) ||
|
|
6609
|
+
active: (!itemsHaveSubItems && this.currentHref === item.href) ||
|
|
6610
|
+
(item.active === true &&
|
|
6611
|
+
!this.openMenu &&
|
|
6612
|
+
this.closedActives &&
|
|
6613
|
+
this.closedActives.length === 1) ||
|
|
6614
|
+
(item.active === true &&
|
|
6615
|
+
!this.openMenu &&
|
|
6616
|
+
item.items &&
|
|
6617
|
+
!item.items.some(s => s.active === true)),
|
|
6607
6618
|
}, href: item.href || "#", id: item.id || `header-item-${itemIndex}`, onClick: event => this.handleItemClick(event, item) }, item.label, item.badge && h$1("div", { class: "duet-header-badge" })), item.items &&
|
|
6608
6619
|
item.items
|
|
6609
6620
|
.filter(secondLevelitem => secondLevelitem.items && secondLevelitem.items.length > 0)
|
|
6610
6621
|
.map((secondLevelItem, secondLevelItemIndex) => {
|
|
6611
6622
|
const id = secondLevelItem.id || `header-item-${itemIndex}-${secondLevelItemIndex}`;
|
|
6612
|
-
|
|
6613
|
-
|
|
6614
|
-
|
|
6615
|
-
|
|
6616
|
-
|
|
6617
|
-
|
|
6618
|
-
this.openMenu === id, badge: secondLevelItem.badge, toggleRef: el => (this.subMenuButtonRefs[id] = el), itemsRef: el => (this.subMenuItemRefs[id] = el), onToggle: event => this.toggleMenu(event, "sub", id, secondLevelItem.active === true) }, h$1("div", { class: "duet-header-third-level" }, secondLevelItem.items &&
|
|
6623
|
+
const active = (!this.openMenu &&
|
|
6624
|
+
secondLevelItem.active === true &&
|
|
6625
|
+
!(this.closedActives && !!this.closedActives.find(i => i === id))) ||
|
|
6626
|
+
this.openMenu === id;
|
|
6627
|
+
const activeBar = active && !(secondLevelItem.items && secondLevelItem.items.some(s => s.active === true));
|
|
6628
|
+
return (h$1(DuetHeaderDropdown, { id: id, className: "duet-header-second-level", label: secondLevelItem.label, icon: `${secondLevelItem.icon}.svg`, active: activeBar, isOpen: active, badge: secondLevelItem.badge, toggleRef: el => (this.subMenuButtonRefs[id] = el), itemsRef: el => (this.subMenuItemRefs[id] = el), onToggle: event => this.toggleMenu(event, "sub", id, secondLevelItem.active === true) }, h$1("div", { class: "duet-header-third-level" }, secondLevelItem.items &&
|
|
6619
6629
|
secondLevelItem.items.map(thirdLevelItem => (h$1("a", { class: {
|
|
6620
6630
|
"duet-header-item": true,
|
|
6621
6631
|
active: thirdLevelItem.active === true,
|
|
@@ -7533,7 +7543,7 @@ let DuetLink$1 = class extends H {
|
|
|
7533
7543
|
"duet-link": true,
|
|
7534
7544
|
"duet-link-is-external": this.external,
|
|
7535
7545
|
"duet-theme-turva": this.theme === "turva",
|
|
7536
|
-
}, target: this.external ? "_blank" : "_self", "aria-label": this.accessibleLabel, id: this.identifier, ref: el => (this.nativeLink = el), part: "duet-link" }, h$1("slot", null), this.external && (h$1(Fragment, null, h$1("duet-visually-hidden", null, this.accessibleLabelExternal), h$1("span", { class: "duet-link-external" }, h$1("duet-icon", { icon: actionNewWindowSmall.svg, size: "xx-small", margin: "none", color: "currentColor" })))))));
|
|
7546
|
+
}, target: this.external ? "_blank" : "_self", "aria-label": this.accessibleLabel, id: this.identifier, ref: el => (this.nativeLink = el), part: "duet-link", rel: this.external ? "noopener" : undefined }, h$1("slot", null), this.external && (h$1(Fragment, null, h$1("duet-visually-hidden", null, this.accessibleLabelExternal), h$1("span", { class: "duet-link-external" }, h$1("duet-icon", { icon: actionNewWindowSmall.svg, size: "xx-small", margin: "none", color: "currentColor" })))))));
|
|
7537
7547
|
}
|
|
7538
7548
|
static get delegatesFocus() { return true; }
|
|
7539
7549
|
static get style() { return duetLinkCss; }
|
|
@@ -7859,6 +7869,10 @@ let DuetModal$1 = class extends H {
|
|
|
7859
7869
|
* Use this property when you need to have the modal dialog initially active.
|
|
7860
7870
|
*/
|
|
7861
7871
|
this.active = false;
|
|
7872
|
+
/**
|
|
7873
|
+
* Use this property when you want the modal to close when clicked outside of modal.
|
|
7874
|
+
*/
|
|
7875
|
+
this.closeOnBlur = false;
|
|
7862
7876
|
}
|
|
7863
7877
|
openChanged() {
|
|
7864
7878
|
if (this.open) {
|
|
@@ -7971,7 +7985,15 @@ let DuetModal$1 = class extends H {
|
|
|
7971
7985
|
} }, h$1(FocusGuard, { moveFocusTo: this.buttonEl }), h$1("div", { class: {
|
|
7972
7986
|
"duet-modal-inner": true,
|
|
7973
7987
|
"duet-modal-large": this.size === "large",
|
|
7974
|
-
}, role: "document"
|
|
7988
|
+
}, role: "document", onClick: e => {
|
|
7989
|
+
if (this.closeOnBlur) {
|
|
7990
|
+
this.closeModal(e);
|
|
7991
|
+
}
|
|
7992
|
+
} }, h$1("div", { class: { "duet-modal": true, [this.size]: true }, onClick: e => {
|
|
7993
|
+
if (this.closeOnBlur) {
|
|
7994
|
+
e.stopPropagation();
|
|
7995
|
+
}
|
|
7996
|
+
} }, h$1("duet-spacer", null), h$1("div", { class: "duet-modal-close" }, h$1("duet-button", { ref: button => (this.buttonEl = button), variation: "plain", accessibleLabel: this.accessibleCloseLabel, color: closeColor, iconSize: "large", icon: "navigation-close", iconOnly: true, margin: "none", theme: this.theme, onClick: ev => this.closeModal(ev), fixed: true })), h$1("div", { class: {
|
|
7975
7997
|
"duet-modal-body": true,
|
|
7976
7998
|
"duet-modal-gutter-small": this.gutterSize === "small",
|
|
7977
7999
|
"duet-modal-gutter-medium": this.gutterSize === "medium",
|
|
@@ -9087,6 +9109,165 @@ let DuetRangeSlider$1 = class extends H {
|
|
|
9087
9109
|
static get style() { return duetRangeSliderCss; }
|
|
9088
9110
|
};
|
|
9089
9111
|
|
|
9112
|
+
const duetScrollableCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent}:host{position:relative !important}:host .duet-scrollable-items{display:flex}:host .duet-scrollable-items .duet-scrollable-button{position:relative;flex:0 0 auto;flex-basis:40px;padding:10px;cursor:pointer}:host .duet-scrollable-items .duet-scrollable-button:active{transform:scale(0.8)}:host .duet-scrollable-items .duet-scrollable-button--left{left:-12px}:host .duet-scrollable-items .duet-scrollable-button--right{right:-12px}:host .duet-scrollable-items .duet-scrollable-button--occluded{display:none}:host .duet-scrollable-items .duet-scrollable-list{display:flex;flex-wrap:nowrap;gap:20px;padding-top:2px;overflow-x:auto;overflow-y:hidden;white-space:nowrap;scroll-snap-type:x mandatory;scroll-behavior:smooth;scroll-margin:0 20px;-ms-overflow-style:-ms-autohiding-scrollbar;-webkit-overflow-scrolling:touch;}:host .duet-scrollable-items .duet-scrollable-list::-webkit-scrollbar{display:none}::slotted(*){scroll-snap-align:center;margin-left:0;-webkit-transition:-webkit-transform 0.2s ease-in-out;transition:-webkit-transform 0.2s ease-in-out;transition:transform 0.2s ease-in-out;transition:transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out}";
|
|
9113
|
+
|
|
9114
|
+
let DuetScrollable$1 = class extends H {
|
|
9115
|
+
constructor() {
|
|
9116
|
+
super();
|
|
9117
|
+
this.__registerHost();
|
|
9118
|
+
this.__attachShadow();
|
|
9119
|
+
/**
|
|
9120
|
+
* Private variables and constants index
|
|
9121
|
+
*/
|
|
9122
|
+
this.currentIndex = 0;
|
|
9123
|
+
this.tabListElement = undefined;
|
|
9124
|
+
this.tabListClass = "duet-scrollable-list";
|
|
9125
|
+
this.tablistAtStart = true;
|
|
9126
|
+
this.isTabContentSmallerThanWrapper = false;
|
|
9127
|
+
this.tablistAtEnd = false;
|
|
9128
|
+
this.childrenData = {};
|
|
9129
|
+
this.resizeObserver = new ResizeObserver(entries => {
|
|
9130
|
+
var _a, _b, _c, _d;
|
|
9131
|
+
// otherwise, something is wrong, expecting 1 element only
|
|
9132
|
+
if ((entries === null || entries === void 0 ? void 0 : entries.length) === 1) {
|
|
9133
|
+
const currentWidth = (_b = (_a = entries[0]) === null || _a === void 0 ? void 0 : _a.target) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect().width;
|
|
9134
|
+
const scrollWidth = (_d = (_c = entries[0]) === null || _c === void 0 ? void 0 : _c.target) === null || _d === void 0 ? void 0 : _d.scrollWidth;
|
|
9135
|
+
// in order to avoid state "jumping" on the boundary condition we add a few pixels to the comparison
|
|
9136
|
+
this.isTabContentSmallerThanWrapper = scrollWidth > currentWidth + 5;
|
|
9137
|
+
}
|
|
9138
|
+
});
|
|
9139
|
+
/**
|
|
9140
|
+
* Theme of duet-tab-scrollable. When used this will override the color setting and
|
|
9141
|
+
* use "primary" or "primary-turva" as the color depending on which theme
|
|
9142
|
+
* is chosen.
|
|
9143
|
+
*/
|
|
9144
|
+
this.theme = "";
|
|
9145
|
+
/**
|
|
9146
|
+
* Optional identifier to add to buttons in the tab group
|
|
9147
|
+
*/
|
|
9148
|
+
this.identifier = "";
|
|
9149
|
+
/**
|
|
9150
|
+
* Selected element
|
|
9151
|
+
*/
|
|
9152
|
+
this.selected = 0;
|
|
9153
|
+
}
|
|
9154
|
+
watchPropHandler(newValue) {
|
|
9155
|
+
this.scrollToTab(newValue, "center");
|
|
9156
|
+
}
|
|
9157
|
+
/**
|
|
9158
|
+
* Component lifecycle events.
|
|
9159
|
+
*/
|
|
9160
|
+
componentWillLoad() {
|
|
9161
|
+
inheritGlobalTheme(this);
|
|
9162
|
+
const slotted = this.host.children;
|
|
9163
|
+
this.childrenData = { hasChildren: slotted && slotted.length > 0, numberOfChildren: slotted && slotted.length };
|
|
9164
|
+
}
|
|
9165
|
+
componentDidLoad() {
|
|
9166
|
+
this.resizeObserver.observe(this.tabListElement);
|
|
9167
|
+
}
|
|
9168
|
+
disconnectedCallback() {
|
|
9169
|
+
this.resizeObserver.disconnect();
|
|
9170
|
+
}
|
|
9171
|
+
/**
|
|
9172
|
+
* Private methods.
|
|
9173
|
+
*/
|
|
9174
|
+
getLastVisibleElement() {
|
|
9175
|
+
const clientWidth = this.tabListElement.clientWidth;
|
|
9176
|
+
const xValues = Array.from(this.host.querySelectorAll("button")).findIndex(element => element.getBoundingClientRect().x > clientWidth);
|
|
9177
|
+
return xValues;
|
|
9178
|
+
}
|
|
9179
|
+
getFirstVisibleElement() {
|
|
9180
|
+
const buttonCollection = this.host.querySelectorAll("button");
|
|
9181
|
+
// reverse the array because we want the first invisible element form the middle, not the first in the list
|
|
9182
|
+
const arrayOfXValues = Array.from(buttonCollection).map(el => el.getBoundingClientRect().x - el.getBoundingClientRect().width);
|
|
9183
|
+
const xValues = arrayOfXValues.findIndex(element => {
|
|
9184
|
+
return element > 0;
|
|
9185
|
+
});
|
|
9186
|
+
return xValues;
|
|
9187
|
+
}
|
|
9188
|
+
updateScrollButtons(container = this.tabListElement) {
|
|
9189
|
+
if (container.scrollLeft <= 0) {
|
|
9190
|
+
this.tablistAtStart = true;
|
|
9191
|
+
}
|
|
9192
|
+
else if (container.scrollLeft > 0) {
|
|
9193
|
+
this.tablistAtStart = false;
|
|
9194
|
+
}
|
|
9195
|
+
if (container.clientWidth + container.scrollLeft + 10 >= container.scrollWidth) {
|
|
9196
|
+
this.tablistAtEnd = true;
|
|
9197
|
+
}
|
|
9198
|
+
else if (container.clientWidth + container.scrollLeft + 10 < container.scrollWidth) {
|
|
9199
|
+
this.tablistAtEnd = false;
|
|
9200
|
+
}
|
|
9201
|
+
}
|
|
9202
|
+
scrollToTab(index = this.currentIndex, inline) {
|
|
9203
|
+
if (!this.childrenData.hasChildren) {
|
|
9204
|
+
return;
|
|
9205
|
+
}
|
|
9206
|
+
if (index + 1 >= this.childrenData.numberOfChildren) {
|
|
9207
|
+
index = this.childrenData.numberOfChildren - 1;
|
|
9208
|
+
}
|
|
9209
|
+
if (index < 0) {
|
|
9210
|
+
index = 0;
|
|
9211
|
+
}
|
|
9212
|
+
const buttons = this.host.querySelectorAll("button");
|
|
9213
|
+
// store previous position
|
|
9214
|
+
let prevPosition = buttons[0].getBoundingClientRect().x;
|
|
9215
|
+
// iterations to run
|
|
9216
|
+
let ticksWhereScrollDidNotHappen = 5;
|
|
9217
|
+
const getAnimationFrame = () => {
|
|
9218
|
+
// if we get the same value enter the logic loop
|
|
9219
|
+
if (buttons[0].getBoundingClientRect().x === prevPosition) {
|
|
9220
|
+
ticksWhereScrollDidNotHappen--;
|
|
9221
|
+
// When iteration is not complete run the calculation again
|
|
9222
|
+
if (ticksWhereScrollDidNotHappen !== 0) {
|
|
9223
|
+
window.requestAnimationFrame(getAnimationFrame);
|
|
9224
|
+
return;
|
|
9225
|
+
}
|
|
9226
|
+
this.updateScrollButtons();
|
|
9227
|
+
}
|
|
9228
|
+
else {
|
|
9229
|
+
window.requestAnimationFrame(getAnimationFrame);
|
|
9230
|
+
prevPosition = buttons[0].getBoundingClientRect().x;
|
|
9231
|
+
}
|
|
9232
|
+
};
|
|
9233
|
+
buttons[index].scrollIntoView({ behavior: "smooth", inline });
|
|
9234
|
+
window.requestAnimationFrame(getAnimationFrame);
|
|
9235
|
+
}
|
|
9236
|
+
scrollLeft() {
|
|
9237
|
+
this.tablistAtEnd = false;
|
|
9238
|
+
const first = this.getFirstVisibleElement() - 1;
|
|
9239
|
+
this.scrollToTab(first, "center");
|
|
9240
|
+
}
|
|
9241
|
+
scrollRight() {
|
|
9242
|
+
this.tablistAtStart = false;
|
|
9243
|
+
const last = this.getLastVisibleElement() + 1;
|
|
9244
|
+
this.scrollToTab(last, "center");
|
|
9245
|
+
}
|
|
9246
|
+
/**
|
|
9247
|
+
* render() function
|
|
9248
|
+
* Always the last one in the class.
|
|
9249
|
+
*/
|
|
9250
|
+
render() {
|
|
9251
|
+
return (h$1(Host, { class: {
|
|
9252
|
+
"duet-theme-turva": this.theme === "turva",
|
|
9253
|
+
"duet-theme-default": this.theme === "default",
|
|
9254
|
+
} }, h$1("div", { class: "duet-scrollable-items" }, h$1("button", { part: `${this.identifier}-button-left`, "aria-hidden": "true", class: {
|
|
9255
|
+
"duet-scrollable-button": true,
|
|
9256
|
+
"duet-scrollable-button--left": true,
|
|
9257
|
+
"duet-scrollable-button--occluded": !this.isTabContentSmallerThanWrapper,
|
|
9258
|
+
}, onClick: () => this.scrollLeft(), disabled: this.tablistAtStart, tabindex: "-1" }, h$1("duet-icon", { name: "action-arrow-left-small", size: "small", margin: "none" })), h$1("div", { class: this.tabListClass, onScroll: () => this.updateScrollButtons(), ref: element => (this.tabListElement = element) }, h$1("slot", null)), h$1("button", { part: `${this.identifier}-button-right`, "aria-hidden": "true", class: {
|
|
9259
|
+
"duet-scrollable-button": true,
|
|
9260
|
+
"duet-scrollable-button--right": true,
|
|
9261
|
+
"duet-scrollable-button--occluded": !this.isTabContentSmallerThanWrapper,
|
|
9262
|
+
}, onClick: () => this.scrollRight(), disabled: this.tablistAtEnd, tabindex: "-1" }, h$1("duet-icon", { name: "action-arrow-right-small", size: "small", margin: "none" })))));
|
|
9263
|
+
}
|
|
9264
|
+
get host() { return this; }
|
|
9265
|
+
static get watchers() { return {
|
|
9266
|
+
"selected": ["watchPropHandler"]
|
|
9267
|
+
}; }
|
|
9268
|
+
static get style() { return duetScrollableCss; }
|
|
9269
|
+
};
|
|
9270
|
+
|
|
9090
9271
|
const duetSelectCss = "@charset \"UTF-8\";*.sc-duet-select,*.sc-duet-select::after,*.sc-duet-select::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-select-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:16px !important;margin-bottom:12px !important;display:inline-flex;width:100%;max-width:100%;vertical-align:bottom}.sc-duet-select-h:last-child,.sc-duet-select-h:last-of-type{margin-right:0 !important}@media (min-width: 36em){.sc-duet-select-h{width:calc(50% - 16px - 3px)}.duet-expand.sc-duet-select-h{width:100% !important}}.duet-m-0.sc-duet-select-h{margin:0 !important}duet-tooltip.sc-duet-select{position:absolute;top:12px;right:0}@media (min-width: 48em){duet-tooltip.sc-duet-select{position:relative;top:4px;right:auto}}.duet-select-placeholder.sc-duet-select{position:absolute;top:-9px;left:9px;z-index:200;display:block;width:auto;max-width:60%;padding:0 0.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:white}.duet-select-container.sc-duet-select{position:relative;width:100%}.duet-select-wrapper.sc-duet-select{position:relative;width:100%;padding:15px 14px !important;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;line-height:1.25}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-select-wrapper.sc-duet-select::after{content:\" \"}.duet-select-wrapper.sc-duet-select select.sc-duet-select{position:absolute;top:0;right:0;bottom:0;left:0;z-index:200;width:100%;height:100%;padding:0;margin:0;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;cursor:pointer;border:0;outline:none;opacity:0}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{border-color:#909599;box-shadow:0 0 0 1px #909599}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{border-color:#747475;box-shadow:0 0 0 1px #747475}.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{box-shadow:0 0 0 1px #e02a0d}.duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{border-color:#0077b3;outline:0;box-shadow:0 0 0 1px #0077b3;transition:none}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{border-color:#171c3a;box-shadow:0 0 0 1px #171c3a}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:#171c3a}.duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:#0077b3}.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{box-shadow:0 0 0 1px #e02a0d}.duet-select-wrapper.sc-duet-select select[disabled].sc-duet-select{cursor:default !important}.duet-select-wrapper.sc-duet-select select[disabled].sc-duet-select+.duet-select.sc-duet-select{color:#00294d !important;cursor:default !important;background:#f5f8fa !important;border-color:#f5f8fa !important;box-shadow:none !important;opacity:1 !important;-webkit-text-fill-color:#00294d !important}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select[disabled].sc-duet-select+.duet-select.sc-duet-select{color:#171c3a !important;background:#f5f5f7 !important;border-color:#f5f5f7 !important;-webkit-text-fill-color:#171c3a !important}.duet-select.sc-duet-select{position:absolute;top:0;right:0;bottom:0;left:0;z-index:100;display:block;width:100%;min-width:8rem;padding:12px 14px !important;padding-right:48px !important;overflow:hidden;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;font-variant-numeric:tabular-nums;line-height:1.5;color:#00294d;text-align:left;text-overflow:ellipsis;white-space:nowrap;background:white;border:1px solid #909599;border-radius:4px;transition:150ms ease}.has-error.sc-duet-select .duet-select.sc-duet-select{border-color:#de2362 !important}.has-error.sc-duet-select .duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:#de2362 !important}.duet-theme-turva.has-error.sc-duet-select .duet-select.sc-duet-select{border-color:#e02a0d !important}.duet-theme-turva.has-error.sc-duet-select .duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:#e02a0d !important}.duet-theme-turva.sc-duet-select .duet-select.sc-duet-select{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a;border-color:#747475}.duet-select.sc-duet-select svg.sc-duet-select{position:absolute;top:50%;right:16px;z-index:200;width:20px;height:20px;color:#00294d;pointer-events:none;transform:translateY(-50%)}.duet-theme-turva.sc-duet-select .duet-select.sc-duet-select svg.sc-duet-select{color:#171c3a}.duet-select-help.sc-duet-select{display:block;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:0.875rem;font-weight:400;line-height:1.25;color:#657787;border-radius:4px}.duet-select-help.sc-duet-select span.sc-duet-select{display:block;margin-top:8px}.duet-theme-turva.sc-duet-select .duet-select-help.sc-duet-select{color:#747475}.has-error.sc-duet-select .duet-select-help.sc-duet-select{color:#de2362}.duet-theme-turva.has-error.sc-duet-select .duet-select-help.sc-duet-select{color:#e02a0d}.duet-label-hidden.sc-duet-select duet-label.sc-duet-select{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}";
|
|
9091
9272
|
|
|
9092
9273
|
function isOptionGroup(item) {
|
|
@@ -9596,6 +9777,18 @@ let DuetTab$1 = class extends H {
|
|
|
9596
9777
|
constructor() {
|
|
9597
9778
|
super();
|
|
9598
9779
|
this.__registerHost();
|
|
9780
|
+
/**
|
|
9781
|
+
* Defaults for AccessibleLabel
|
|
9782
|
+
* @default null
|
|
9783
|
+
*/
|
|
9784
|
+
this.accessibleDescriptionDefault = null;
|
|
9785
|
+
/**
|
|
9786
|
+
* String for AccessibleLabel
|
|
9787
|
+
* @default null
|
|
9788
|
+
*/
|
|
9789
|
+
this.accessibleDescription = this.accessibleDescriptionDefault
|
|
9790
|
+
? getLocaleString(this.accessibleDescriptionDefault)
|
|
9791
|
+
: null;
|
|
9599
9792
|
}
|
|
9600
9793
|
/**
|
|
9601
9794
|
* render() function
|
|
@@ -9603,18 +9796,19 @@ let DuetTab$1 = class extends H {
|
|
|
9603
9796
|
*/
|
|
9604
9797
|
render() {
|
|
9605
9798
|
{
|
|
9606
|
-
return (h$1("div", { role: "tabpanel", class: { "duet-tab": true, selected: this.selected } }, h$1("slot", null)));
|
|
9799
|
+
return (h$1("div", { role: "tabpanel", class: { "duet-tab": true, selected: this.selected }, "aria-description": this.accessibleDescription }, h$1("slot", null)));
|
|
9607
9800
|
}
|
|
9608
9801
|
}
|
|
9609
9802
|
static get style() { return duetTabCss; }
|
|
9610
9803
|
};
|
|
9611
9804
|
|
|
9612
|
-
const duetTabGroupCss = "
|
|
9805
|
+
const duetTabGroupCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;display:block;width:100%}.duet-tab-group-tabs{margin-bottom:28px !important;display:block;width:100%;max-width:100%;padding-top:2px;list-style:none}.duet-tab-group-tabs.duet-m-0{margin:0 !important}.duet-tab-group-tabs.duet-tab-group-collapses.duet-tab-group-hidden{display:none}@media (min-width: 36em){.duet-tab-group-tabs.duet-tab-group-collapses.duet-tab-group-hidden{display:block}}.duet-tab-variation-plain .duet-tab-group-tabs{border-bottom:1px solid #e1e3e6}.duet-theme-turva.duet-tab-variation-plain .duet-tab-group-tabs{border-bottom-color:#e4e4e6}@media (min-width: 36em){duet-select{display:none !important}}.duet-tab-button{-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:block;width:100%;padding:20px;margin-top:-2px;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:600;line-height:1.1;color:#00294d;text-align:left;text-decoration:none;cursor:pointer;background:white;border:2px solid #e1e3e6;border-radius:0;transition:150ms ease}.duet-tab-button.duet-p-0{padding:0 !important}.duet-tab-button.duet-m-0{margin:0 !important}.duet-theme-turva .duet-tab-button{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a;border-color:#e4e4e6}.duet-tab-button.duet-p-0{padding:0 !important}@media (min-width: 36em){.duet-tab-button{display:inline-block;width:auto;margin-left:-2px;border-right:2px solid #e1e3e6;border-radius:0}}.duet-tab-button:hover{z-index:200;border-color:#909599}.duet-theme-turva .duet-tab-button:hover{border-color:#747475}.duet-tab-button:active{opacity:0.75;transition:none}.duet-tab-button.selected{z-index:201;color:white;background:#00294d;border-color:#00294d;outline:0;box-shadow:none !important}.duet-theme-turva .duet-tab-button.selected{color:white;background-color:#171c3a;border-color:#171c3a}.duet-tab-button:focus{z-index:200;outline:0}:host(.user-is-tabbing) .duet-tab-button:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3 !important}:host(.user-is-tabbing) .duet-theme-turva .duet-tab-button:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a !important}.duet-tab-button:first-child{border-top-left-radius:4px;border-top-right-radius:4px}@media (min-width: 36em){.duet-tab-button:first-child{border-top-right-radius:0;border-bottom-left-radius:4px}}.duet-tab-button:last-child{border-bottom-right-radius:4px;border-bottom-left-radius:4px}@media (min-width: 36em){.duet-tab-button:last-child{border-radius:0;border-top-right-radius:4px;border-bottom-right-radius:4px}}.duet-tab-variation-plain .duet-tab-button{display:inline-block;width:auto;padding-right:0;padding-left:0;border:0;border-radius:0;transition:none}.duet-tab-variation-plain .duet-tab-button+.duet-tab-button{margin-left:36px}.duet-tab-variation-plain .duet-tab-button.selected{color:#0077b3;background:white;border-bottom:3px solid #0077b3}.duet-theme-turva.duet-tab-variation-plain .duet-tab-button.selected{color:#c60c30;border-bottom-color:#c60c30}.duet-tab-group-content{position:relative;width:100%;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;line-height:1.5;color:#00294d;text-align:left}.duet-theme-turva .duet-tab-group-content{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}";
|
|
9613
9806
|
|
|
9614
9807
|
let DuetTabGroup$1 = class extends H {
|
|
9615
9808
|
constructor() {
|
|
9616
9809
|
super();
|
|
9617
9810
|
this.__registerHost();
|
|
9811
|
+
this.__attachShadow();
|
|
9618
9812
|
this.duetChange = createEvent$2(this, "duetChange", 3);
|
|
9619
9813
|
this.duetTabChange = createEvent$2(this, "duetTabChange", 7);
|
|
9620
9814
|
this.id = createID("DuetTabGroup");
|
|
@@ -9628,6 +9822,15 @@ let DuetTabGroup$1 = class extends H {
|
|
|
9628
9822
|
* Theme of the component.
|
|
9629
9823
|
*/
|
|
9630
9824
|
this.theme = "";
|
|
9825
|
+
/**
|
|
9826
|
+
* Controls whether the tab-group should scroll (by inflection this will disable collapsing to select box on small screens),
|
|
9827
|
+
* if this is a number instead of true it will be used as "amount of items to scroll"
|
|
9828
|
+
*/
|
|
9829
|
+
this.scrolls = false;
|
|
9830
|
+
/**
|
|
9831
|
+
* Whether the tab-group collapses to a select dropwdown in minor breakpoints
|
|
9832
|
+
*/
|
|
9833
|
+
this.collapses = true;
|
|
9631
9834
|
/**
|
|
9632
9835
|
* Style variation of the tab group.
|
|
9633
9836
|
*/
|
|
@@ -9657,6 +9860,10 @@ let DuetTabGroup$1 = class extends H {
|
|
|
9657
9860
|
* Determines whether the label for the select element shown on mobile is visually hidden.
|
|
9658
9861
|
*/
|
|
9659
9862
|
this.labelHidden = true;
|
|
9863
|
+
/**
|
|
9864
|
+
* Optional identifier to add to buttons in the tab group
|
|
9865
|
+
*/
|
|
9866
|
+
this.identifier = this.id;
|
|
9660
9867
|
/**
|
|
9661
9868
|
* Controls the margin of the component.
|
|
9662
9869
|
*/
|
|
@@ -9682,12 +9889,18 @@ let DuetTabGroup$1 = class extends H {
|
|
|
9682
9889
|
button.focus();
|
|
9683
9890
|
}
|
|
9684
9891
|
};
|
|
9685
|
-
this.renderTab = (
|
|
9686
|
-
|
|
9687
|
-
|
|
9688
|
-
|
|
9689
|
-
|
|
9690
|
-
|
|
9892
|
+
this.renderTab = () => {
|
|
9893
|
+
const renderedTabs = this.tabs.map((element, index) => {
|
|
9894
|
+
return (h$1("button", { role: "tab", id: this.getButtonId(index), "aria-controls": this.getTabId(index), "aria-selected": element.selected ? "true" : "false", "aria-description": this.getAccessibleDescription(index), part: `${this.identifier}-button`, type: "button", class: {
|
|
9895
|
+
"duet-p-0": this.padding === "none",
|
|
9896
|
+
"duet-tab-button": true,
|
|
9897
|
+
selected: element.selected,
|
|
9898
|
+
}, onClick: () => this.openTab(index), onKeyDown: ev => this.handleKeyDown(ev) }, element.label));
|
|
9899
|
+
});
|
|
9900
|
+
if (this.scrolls) {
|
|
9901
|
+
return (h$1("duet-scrollable", { selected: this.selected, identifier: this.identifier }, renderedTabs));
|
|
9902
|
+
}
|
|
9903
|
+
return renderedTabs;
|
|
9691
9904
|
};
|
|
9692
9905
|
}
|
|
9693
9906
|
/**
|
|
@@ -9706,7 +9919,7 @@ let DuetTabGroup$1 = class extends H {
|
|
|
9706
9919
|
subtree: true,
|
|
9707
9920
|
});
|
|
9708
9921
|
}
|
|
9709
|
-
this.updateTabs();
|
|
9922
|
+
await this.updateTabs();
|
|
9710
9923
|
}
|
|
9711
9924
|
disconnectedCallback() {
|
|
9712
9925
|
if (this.mutationO) {
|
|
@@ -9747,19 +9960,27 @@ let DuetTabGroup$1 = class extends H {
|
|
|
9747
9960
|
/**
|
|
9748
9961
|
* Local methods.
|
|
9749
9962
|
*/
|
|
9963
|
+
getTabs() {
|
|
9964
|
+
const allTabs = Array.from(this.element.querySelectorAll("duet-tab"));
|
|
9965
|
+
const localTabs = allTabs.filter(tab => tab.closest("duet-tab-group") === this.element);
|
|
9966
|
+
if (localTabs.length === 0) {
|
|
9967
|
+
throw new Error("[duet-tabs] Must have at least one tab");
|
|
9968
|
+
}
|
|
9969
|
+
// filter out any nested tabs
|
|
9970
|
+
return localTabs;
|
|
9971
|
+
}
|
|
9750
9972
|
getButtonId(index) {
|
|
9751
9973
|
return `${this.id}-button-${index}`;
|
|
9752
9974
|
}
|
|
9753
9975
|
getTabId(index) {
|
|
9754
9976
|
return `${this.id}-tab-${index}`;
|
|
9755
9977
|
}
|
|
9978
|
+
getAccessibleDescription(index) {
|
|
9979
|
+
const description = this.tabs[index].getAttribute("accessible-description") || null;
|
|
9980
|
+
return description;
|
|
9981
|
+
}
|
|
9756
9982
|
async updateTabs() {
|
|
9757
|
-
|
|
9758
|
-
// filter out any nested tabs
|
|
9759
|
-
this.tabs = allTabs.filter(tab => tab.closest("duet-tab-group") === this.element);
|
|
9760
|
-
if (this.tabs.length === 0) {
|
|
9761
|
-
throw new Error("[duet-tabs] Must have at least one tab");
|
|
9762
|
-
}
|
|
9983
|
+
this.tabs = this.getTabs();
|
|
9763
9984
|
this.tabs.forEach((tab, index) => {
|
|
9764
9985
|
tab.id = this.getTabId(index);
|
|
9765
9986
|
tab.setAttribute("aria-labelledby", this.getButtonId(index));
|
|
@@ -9767,6 +9988,7 @@ let DuetTabGroup$1 = class extends H {
|
|
|
9767
9988
|
this.selected = index;
|
|
9768
9989
|
}
|
|
9769
9990
|
});
|
|
9991
|
+
return;
|
|
9770
9992
|
}
|
|
9771
9993
|
/**
|
|
9772
9994
|
* render() function
|
|
@@ -9777,13 +9999,16 @@ let DuetTabGroup$1 = class extends H {
|
|
|
9777
9999
|
"duet-tab-group": true,
|
|
9778
10000
|
"duet-theme-turva": this.theme === "turva",
|
|
9779
10001
|
[`duet-tab-variation-${this.variation}`]: true,
|
|
9780
|
-
|
|
10002
|
+
"duet-tab-group-scrolls": this.scrolls,
|
|
10003
|
+
"duet-tab-group-collapses": this.collapses,
|
|
10004
|
+
} }, this.tabs.length > 3 && this.collapses && (h$1("duet-select", { value: this.selected.toString(), expand: true, label: this.label, labelHidden: this.labelHidden, theme: this.theme, onDuetChange: event => this.openTab(Number(event.detail.value)), items: this.tabs.map((tab, index) => {
|
|
9781
10005
|
return { label: tab.label, value: index.toString() };
|
|
9782
10006
|
}) })), h$1("div", { role: "tablist", class: {
|
|
9783
10007
|
"duet-m-0": this.margin === "none",
|
|
9784
10008
|
"duet-tab-group-tabs": true,
|
|
9785
10009
|
"duet-tab-group-hidden": this.tabs.length > 3,
|
|
9786
|
-
|
|
10010
|
+
"duet-tab-group-collapses": this.collapses,
|
|
10011
|
+
} }, this.renderTab()), h$1("div", { class: { "duet-tab-group-content": true, "duet-m-0": this.margin === "none" } }, h$1("slot", null))));
|
|
9787
10012
|
}
|
|
9788
10013
|
get element() { return this; }
|
|
9789
10014
|
static get style() { return duetTabGroupCss; }
|
|
@@ -11630,11 +11855,11 @@ let DuetUpload$1 = class extends H {
|
|
|
11630
11855
|
let caption = this.description.replace(/{maxfiles}/g, this.maxFiles.toString());
|
|
11631
11856
|
caption = caption.replace(/{maxbytes}/g, `${Math.floor(this.maxBytes / 1024 / 1024)} MB`);
|
|
11632
11857
|
caption = caption.replace(/{filetypes}/g, this.allowedExtensions.split(",").join(", "));
|
|
11633
|
-
return (h$1(Host, { class: { "duet-m-0": this.margin === "none" } }, h$1("duet-fieldset", { label: this.label, caption: caption }, h$1("slot", { name: "header" }), !this.files.size && (h$1("duet-label", { theme: this.theme === "turva" ? "turva" : "default", size: "small", class: {
|
|
11858
|
+
return (h$1(Host, { class: { "duet-m-0": this.margin === "none" } }, h$1("duet-fieldset", { label: this.label, caption: caption }, h$1("slot", { name: "header" }), !this.files.size && (h$1("duet-label", { part: this.identifier ? `${this.identifier}-empty-state` : "duet-upload-empty-state", theme: this.theme === "turva" ? "turva" : "default", size: "small", class: {
|
|
11634
11859
|
"duet-upload-filelist-empty": !this.files.size,
|
|
11635
11860
|
"duet-upload-filelist": true,
|
|
11636
11861
|
"duet-upload-filelist-filled": this.files.size,
|
|
11637
|
-
}, id: this.labelId, for: identifier }, this.fileListEmpty)), !!this.files.size && h$1("slot", { name: "fileheader" }), !!this.files.size && (h$1("duet-upload-aria-status", { invalid: this.getFilesAsArray().invalid.length, valid: this.getFilesAsArray().valid.length, inprogress: this.filesInProgress.size, total: this.files.size, statusMessageLabel: this.internalStatusMessageLabel })), !!this.files.size && (h$1("duet-editable-table", { "aria-live": "polite", "aria-relevant": "removals", accessibleRole: "log", id: this.editableTableId, groups: this.groups, actions: this.actions, hideGroups: this.hideGroups, alignment: this.alignment, items: this.convertToDuetEditableTableItems() })), !!this.files.size && h$1("slot", { name: "filefooter" }), h$1("duet-spacer", { size: "large" }), !this.hideButton && (h$1("duet-button", { id: this.buttonId, onClick: this.startUpload, "accessible-controls": identifier, disabled: this.fileMaxReached, "accessible-label": this.accessibleButtonLabel, "accessible-owns": identifier, size: "small", variation: "secondary", fixed: true, icon: "action-add-circle" }, this.buttonLabel)), h$1("duet-spacer", { size: "medium" }), (this.fileMaxReached || this.bytesMaxReached) && (h$1("duet-alert",
|
|
11862
|
+
}, id: this.labelId, for: identifier }, this.fileListEmpty)), !!this.files.size && h$1("slot", { name: "fileheader" }), !!this.files.size && (h$1("duet-upload-aria-status", { invalid: this.getFilesAsArray().invalid.length, valid: this.getFilesAsArray().valid.length, inprogress: this.filesInProgress.size, total: this.files.size, statusMessageLabel: this.internalStatusMessageLabel })), !!this.files.size && (h$1("duet-editable-table", { part: this.identifier ? `${this.identifier}-editable-table` : "duet-upload-editable-table", "aria-live": "polite", "aria-relevant": "removals", accessibleRole: "log", id: this.editableTableId, groups: this.groups, actions: this.actions, hideGroups: this.hideGroups, alignment: this.alignment, items: this.convertToDuetEditableTableItems() })), !!this.files.size && h$1("slot", { name: "filefooter" }), h$1("duet-spacer", { size: "large" }), !this.hideButton && (h$1("duet-button", { id: this.buttonId, onClick: this.startUpload, "accessible-controls": identifier, disabled: this.fileMaxReached, "accessible-label": this.accessibleButtonLabel, "accessible-owns": identifier, size: "small", variation: "secondary", fixed: true, icon: "action-add-circle", part: this.identifier ? `${this.identifier}-button-upload` : "duet-upload-button-upload" }, this.buttonLabel)), h$1("duet-spacer", { size: "medium" }), (this.fileMaxReached || this.bytesMaxReached) && (h$1("duet-alert", { part: this.identifier ? `${this.identifier}-error-notification` : "duet-upload-error-notification" }, this.fileMaxReached && getI18nError("duet-upload-301"), this.bytesMaxReached && getI18nError("duet-upload-202"))), h$1("duet-spacer", { size: "medium" }), h$1("duet-visually-hidden", null, h$1("input", { ref: input => {
|
|
11638
11863
|
this.nativeInput = input;
|
|
11639
11864
|
}, accept: !this.limitSelection ? undefined : `${this.allowedMimetypes},${this.allowedExtensions}`, onBlur: this.onBlur, onFocus: this.onFocus, onChange: e => this.onChange(e), type: "file", class: {
|
|
11640
11865
|
"duet-upload": true,
|
|
@@ -11791,7 +12016,7 @@ const DuetLink = /*@__PURE__*/proxyCustomElement(DuetLink$1, [17,"duet-link",{"a
|
|
|
11791
12016
|
const DuetList = /*@__PURE__*/proxyCustomElement(DuetList$1, [1,"duet-list",{"theme":[1025],"margin":[1],"padding":[1],"mobile":[1],"breakpoint":[1],"variation":[1],"labelWidth":[1,"label-width"]}]);
|
|
11792
12017
|
const DuetListItem = /*@__PURE__*/proxyCustomElement(DuetListItem$1, [1,"duet-list-item"]);
|
|
11793
12018
|
const DuetLogo = /*@__PURE__*/proxyCustomElement(DuetLogo$1, [1,"duet-logo",{"theme":[1025],"margin":[1],"inverse":[4],"size":[1],"href":[1537],"language":[1537]}]);
|
|
11794
|
-
const DuetModal = /*@__PURE__*/proxyCustomElement(DuetModal$1, [1,"duet-modal",{"language":[1025],"accessibleCloseLabelDefaults":[1,"accessible-close-label-default"],"accessibleCloseLabel":[1,"accessible-close-label"],"size":[1],"gutterSize":[1,"gutter-size"],"theme":[1025],"heading":[1],"headingLevel":[1,"heading-level"],"icon":[1],"color":[1],"active":[1540],"open":[32]},[[8,"keyup","handleKeyUp"]]]);
|
|
12019
|
+
const DuetModal = /*@__PURE__*/proxyCustomElement(DuetModal$1, [1,"duet-modal",{"language":[1025],"accessibleCloseLabelDefaults":[1,"accessible-close-label-default"],"accessibleCloseLabel":[1,"accessible-close-label"],"size":[1],"gutterSize":[1,"gutter-size"],"theme":[1025],"heading":[1],"headingLevel":[1,"heading-level"],"icon":[1],"color":[1],"active":[1540],"closeOnBlur":[1028,"close-on-blur"],"open":[32]},[[8,"keyup","handleKeyUp"]]]);
|
|
11795
12020
|
const DuetNotification = /*@__PURE__*/proxyCustomElement(DuetNotification$1, [1,"duet-notification",{"language":[1],"accessibleLabelUnreadDefaults":[16],"accessibleLabelUnread":[1,"accessible-label-unread"],"url":[1],"date":[1],"highlight":[4],"external":[4],"theme":[1025]}]);
|
|
11796
12021
|
const DuetNotificationDrawer = /*@__PURE__*/proxyCustomElement(DuetNotificationDrawer$1, [1,"duet-notification-drawer",{"icon":[1],"label":[1],"language":[1],"accessibleLabelNotificationsDefaults":[1,"accessible-label-notification-default"],"accessibleLabelNotifications":[1,"accessible-label-notifications"],"badge":[4],"theme":[1025],"direction":[1],"isOpen":[32],"hasNotifications":[32]},[[6,"focus","handleClickFocusOutside"],[6,"click","handleClickFocusOutside"]]]);
|
|
11797
12022
|
const DuetNumberInput = /*@__PURE__*/proxyCustomElement(DuetNumberInput$1, [2,"duet-number-input",{"language":[1025],"locale":[1],"unit":[1],"accessibleActiveDescendant":[1,"accessible-active-descendant"],"accessibleControls":[1,"accessible-controls"],"accessibleOwns":[1,"accessible-owns"],"accessibleDescribedBy":[1,"accessible-described-by"],"accessibleLiveDefaults":[1,"accessible-live-default"],"accessibleLive":[1,"accessible-live"],"accessibleLiveEnabled":[4,"accessible-live-enabled"],"accessibleAddDefaults":[1,"accessible-add-default"],"accessibleAdd":[1,"accessible-add"],"accessibleSubtractDefaults":[1,"accessible-subtract-defaults"],"accessibleSubtract":[1,"accessible-subtract"],"theme":[1025],"margin":[1],"expand":[4],"identifier":[1],"min":[2],"labelDefaults":[1,"label-default"],"label":[1],"labelHidden":[4,"label-hidden"],"max":[2],"name":[1],"error":[1],"tooltip":[1],"step":[2],"rounding":[4],"role":[1],"disabled":[516],"required":[4],"value":[1025],"focusedValue":[32]}]);
|
|
@@ -11800,13 +12025,14 @@ const DuetProgress = /*@__PURE__*/proxyCustomElement(DuetProgress$1, [0,"duet-pr
|
|
|
11800
12025
|
const DuetRadio = /*@__PURE__*/proxyCustomElement(DuetRadio$1, [2,"duet-radio",{"accessibleActiveDescendant":[1,"accessible-active-descendant"],"accessibleIndex":[1,"accessible-index"],"margin":[1],"accessibleControls":[1,"accessible-controls"],"accessibleOwns":[1,"accessible-owns"],"accessibleDescribedBy":[1,"accessible-described-by"],"theme":[1025],"disabled":[516],"required":[4],"blockEvents":[4,"block-events"],"identifier":[1],"label":[1],"name":[1],"role":[1],"groupDisabled":[4,"group-disabled"],"groupDirection":[1,"group-direction"],"groupResponsive":[4,"group-responsive"],"checked":[1540],"value":[1537]}]);
|
|
11801
12026
|
const DuetRadioGroup = /*@__PURE__*/proxyCustomElement(DuetRadioGroup$1, [6,"duet-radio-group",{"direction":[1],"margin":[1],"theme":[1025],"error":[1],"tooltip":[1],"tooltipDirection":[1,"tooltip-direction"],"name":[1],"label":[1],"labelHidden":[4,"label-hidden"],"caption":[1],"responsive":[4],"value":[1537],"disabled":[4]}]);
|
|
11802
12027
|
const DuetRangeSlider = /*@__PURE__*/proxyCustomElement(DuetRangeSlider$1, [2,"duet-range-slider",{"theme":[1025],"margin":[1],"expand":[4],"identifier":[1],"name":[1],"required":[4],"disabled":[516],"accessibleActiveDescendant":[1,"accessible-active-descendant"],"accessibleControls":[1,"accessible-controls"],"accessibleOwns":[1,"accessible-owns"],"accessibleDescribedBy":[1,"accessible-described-by"],"min":[2],"label":[1],"labelHidden":[4,"label-hidden"],"unit":[1],"max":[2],"step":[2],"locale":[1],"value":[1026],"debounce":[2]}]);
|
|
12028
|
+
const DuetScrollable = /*@__PURE__*/proxyCustomElement(DuetScrollable$1, [1,"duet-scrollable",{"theme":[1025],"identifier":[1],"selected":[1026],"tablistAtStart":[32],"isTabContentSmallerThanWrapper":[32],"tablistAtEnd":[32],"childrenData":[32]}]);
|
|
11803
12029
|
const DuetSelect = /*@__PURE__*/proxyCustomElement(DuetSelect$1, [2,"duet-select",{"accessibleActiveDescendant":[1,"accessible-active-descendant"],"accessibleDescribedBy":[1,"accessible-described-by"],"margin":[1],"accessibleControls":[1,"accessible-controls"],"accessibleOwns":[1,"accessible-owns"],"error":[1],"expand":[4],"value":[1537],"theme":[1025],"labelHidden":[4,"label-hidden"],"identifier":[1],"name":[1],"placeholder":[1],"caption":[1],"echoPlaceholder":[4,"echo-placeholder"],"items":[1],"disabled":[516],"required":[4],"label":[1],"role":[1],"tooltip":[1],"tooltipDirection":[1,"tooltip-direction"],"processedItems":[32]}]);
|
|
11804
12030
|
const DuetSpacer = /*@__PURE__*/proxyCustomElement(DuetSpacer$1, [1,"duet-spacer",{"size":[1],"direction":[1],"breakpoint":[1]}]);
|
|
11805
12031
|
const DuetSpinner = /*@__PURE__*/proxyCustomElement(DuetSpinner$1, [1,"duet-spinner",{"accessibleLabel":[1,"accessible-label"],"color":[1],"size":[1],"theme":[1025]}]);
|
|
11806
12032
|
const DuetStep = /*@__PURE__*/proxyCustomElement(DuetStep$1, [6,"duet-step",{"theme":[1025],"heading":[1],"headingLevel":[1,"heading-level"],"stepIndex":[2,"step-index"],"state":[1],"roundedTop":[4,"rounded-top"],"roundedBottom":[4,"rounded-bottom"]}]);
|
|
11807
12033
|
const DuetStepper = /*@__PURE__*/proxyCustomElement(DuetStepper$1, [1,"duet-stepper",{"theme":[1025],"accessibleLive":[1,"accessible-live"],"margin":[1],"backDisabled":[4,"back-disabled"],"selected":[514]},[[0,"duetStepClick","onDuetStepClick"]]]);
|
|
11808
|
-
const DuetTab = /*@__PURE__*/proxyCustomElement(DuetTab$1, [6,"duet-tab",{"label":[513],"selected":[516]}]);
|
|
11809
|
-
const DuetTabGroup = /*@__PURE__*/proxyCustomElement(DuetTabGroup$1, [
|
|
12034
|
+
const DuetTab = /*@__PURE__*/proxyCustomElement(DuetTab$1, [6,"duet-tab",{"label":[513],"selected":[516],"accessibleDescriptionDefault":[1,"accessible-description-defaults"],"accessibleDescription":[1,"accessible-description"]}]);
|
|
12035
|
+
const DuetTabGroup = /*@__PURE__*/proxyCustomElement(DuetTabGroup$1, [1,"duet-tab-group",{"theme":[1025],"scrolls":[4],"collapses":[4],"variation":[1],"language":[1025],"labelDefaults":[1,"label-default"],"label":[1],"labelHidden":[4,"label-hidden"],"identifier":[1],"margin":[1],"padding":[1],"tabs":[32],"selected":[32]}]);
|
|
11810
12036
|
const DuetTable = /*@__PURE__*/proxyCustomElement(DuetTable$1, [4,"duet-table",{"theme":[1025],"margin":[1],"variation":[1],"sticky":[4],"stickyDistance":[1,"sticky-distance"],"breakpoint":[1],"matchesBreakpoint":[32]}]);
|
|
11811
12037
|
const DuetTextarea = /*@__PURE__*/proxyCustomElement(DuetTextarea$1, [2,"duet-textarea",{"margin":[1],"accessibleActiveDescendant":[1,"accessible-active-descendant"],"accessibleAutocomplete":[1,"accessible-autocomplete"],"accessibleControls":[1,"accessible-controls"],"accessibleOwns":[1,"accessible-owns"],"accessibleDescribedBy":[1,"accessible-described-by"],"theme":[1025],"expand":[4],"disabled":[516],"identifier":[1],"required":[4],"label":[1],"labelHidden":[4,"label-hidden"],"name":[1],"placeholder":[1],"caption":[1],"echoPlaceholder":[4,"echo-placeholder"],"maxlength":[2],"minlength":[2],"error":[1],"role":[1],"tooltip":[1],"tooltipDirection":[1,"tooltip-direction"],"value":[1025],"disallowPattern":[1,"disallow-pattern"],"counter":[4],"counterLabel":[1,"counter-label"]}]);
|
|
11812
12038
|
const DuetToggle = /*@__PURE__*/proxyCustomElement(DuetToggle$1, [2,"duet-toggle",{"theme":[1025],"margin":[1],"accessibleActiveDescendant":[1,"accessible-active-descendant"],"accessibleControls":[1,"accessible-controls"],"accessibleOwns":[1,"accessible-owns"],"accessibleDescribedBy":[1,"accessible-described-by"],"label":[1],"required":[4],"disabled":[516],"checked":[1540],"value":[1537],"identifier":[1],"name":[1],"role":[1]}]);
|
|
@@ -11860,6 +12086,7 @@ const defineCustomElements = (opts) => {
|
|
|
11860
12086
|
DuetRadio,
|
|
11861
12087
|
DuetRadioGroup,
|
|
11862
12088
|
DuetRangeSlider,
|
|
12089
|
+
DuetScrollable,
|
|
11863
12090
|
DuetSelect,
|
|
11864
12091
|
DuetSpacer,
|
|
11865
12092
|
DuetSpinner,
|
|
@@ -12275,4 +12502,4 @@ const shadowCss = /*#__PURE__*/Object.freeze({
|
|
|
12275
12502
|
scopeCss: scopeCss
|
|
12276
12503
|
});
|
|
12277
12504
|
|
|
12278
|
-
export { DuetAlert, DuetBadge, DuetBreadcrumb, DuetBreadcrumbs, DuetButton, DuetCaption, DuetCard, DuetCheckbox, DuetChoice, DuetChoiceGroup, DuetCollapsible, DuetCookieConsent, DuetDatePicker, DuetDivider, DuetEditableTable, DuetEditableTableButton, DuetEditableTableItem, DuetEmptyState, DuetFieldset, DuetFooter, DuetGrid, DuetGridItem, DuetHeader, DuetHeading, DuetHero, DuetIcon, DuetInput, DuetLabel, DuetLayout, DuetLink, DuetList, DuetListItem, DuetLogo, DuetModal, DuetNotification, DuetNotificationDrawer, DuetNumberInput, DuetParagraph, DuetProgress, DuetRadio, DuetRadioGroup, DuetRangeSlider, DuetSelect, DuetSpacer, DuetSpinner, DuetStep, DuetStepper, DuetTab, DuetTabGroup, DuetTable, DuetTextarea, DuetToggle, DuetTooltip, DuetTray, DuetUpload, DuetUploadAriaStatus, DuetVisuallyHidden, defineCustomElements, setAssetPath, setPlatformOptions };
|
|
12505
|
+
export { DuetAlert, DuetBadge, DuetBreadcrumb, DuetBreadcrumbs, DuetButton, DuetCaption, DuetCard, DuetCheckbox, DuetChoice, DuetChoiceGroup, DuetCollapsible, DuetCookieConsent, DuetDatePicker, DuetDivider, DuetEditableTable, DuetEditableTableButton, DuetEditableTableItem, DuetEmptyState, DuetFieldset, DuetFooter, DuetGrid, DuetGridItem, DuetHeader, DuetHeading, DuetHero, DuetIcon, DuetInput, DuetLabel, DuetLayout, DuetLink, DuetList, DuetListItem, DuetLogo, DuetModal, DuetNotification, DuetNotificationDrawer, DuetNumberInput, DuetParagraph, DuetProgress, DuetRadio, DuetRadioGroup, DuetRangeSlider, DuetScrollable, DuetSelect, DuetSpacer, DuetSpinner, DuetStep, DuetStepper, DuetTab, DuetTabGroup, DuetTable, DuetTextarea, DuetToggle, DuetTooltip, DuetTray, DuetUpload, DuetUploadAriaStatus, DuetVisuallyHidden, defineCustomElements, setAssetPath, setPlatformOptions };
|