@duetds/components 10.6.0 → 10.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/hydrate/index.js +557 -271
- package/hydrate/index.mjs +557 -271
- package/lib/cjs/{a11y-utils-CgWjS7yq.js → a11y-utils-DZ42p33K.js} +1 -1
- package/lib/cjs/{app-globals-D68ciWsb.js → app-globals-DiBfle2l.js} +1 -1
- package/lib/cjs/duet-action-button.cjs.entry.js +3 -3
- package/lib/cjs/duet-alert.cjs.entry.js +4 -4
- package/lib/cjs/duet-badge.cjs.entry.js +6 -6
- package/lib/cjs/duet-banner.cjs.entry.js +8 -8
- package/lib/cjs/duet-breadcrumb.cjs.entry.js +6 -6
- package/lib/cjs/duet-breadcrumbs.cjs.entry.js +5 -5
- package/lib/cjs/duet-button_2.cjs.entry.js +5 -5
- package/lib/cjs/duet-callout.cjs.entry.js +5 -5
- package/lib/cjs/duet-caption_4.cjs.entry.js +10 -10
- package/lib/cjs/duet-card.cjs.entry.js +10 -9
- package/lib/cjs/duet-checkbox.cjs.entry.js +3 -3
- package/lib/cjs/duet-checkmark.cjs.entry.js +4 -4
- package/lib/cjs/duet-chip.cjs.entry.js +3 -3
- package/lib/cjs/duet-choice_2.cjs.entry.js +16 -7
- package/lib/cjs/duet-collapsible.cjs.entry.js +3 -3
- package/lib/cjs/duet-combobox.cjs.entry.js +32 -25
- package/lib/cjs/duet-contact-card.cjs.entry.js +8 -7
- package/lib/cjs/duet-cookie-consent.cjs.entry.js +2 -2
- package/lib/cjs/duet-date-picker.cjs.entry.js +17 -13
- package/lib/cjs/duet-divider_2.cjs.entry.js +3 -3
- package/lib/cjs/duet-editable-table_3.cjs.entry.js +8 -8
- package/lib/cjs/duet-empty-state.cjs.entry.js +2 -2
- package/lib/cjs/duet-fieldset.cjs.entry.js +6 -6
- package/lib/cjs/duet-file-chooser.cjs.entry.js +2 -2
- package/lib/cjs/duet-footer.cjs.entry.js +4 -4
- package/lib/cjs/duet-grid_2.cjs.entry.js +12 -8
- package/lib/cjs/duet-header_2.cjs.entry.js +3 -3
- package/lib/cjs/duet-hero.cjs.entry.js +18 -13
- package/lib/cjs/duet-icon.cjs.entry.js +5 -5
- package/lib/cjs/duet-indicator.cjs.entry.js +3 -3
- package/lib/cjs/duet-input_2.cjs.entry.js +33 -19
- package/lib/cjs/duet-layout.cjs.entry.js +2 -2
- package/lib/cjs/duet-list_2.cjs.entry.js +4 -4
- package/lib/cjs/duet-menu-bar-button.cjs.entry.js +4 -4
- package/lib/cjs/duet-menu-bar-dropdown-link.cjs.entry.js +4 -4
- package/lib/cjs/duet-menu-bar-dropdown.cjs.entry.js +6 -6
- package/lib/cjs/duet-menu-bar-item.cjs.entry.js +7 -7
- package/lib/cjs/duet-menu-bar-link.cjs.entry.js +4 -4
- package/lib/cjs/duet-menu-bar.cjs.entry.js +3 -3
- package/lib/cjs/duet-modal.cjs.entry.js +12 -13
- package/lib/cjs/duet-multiselect.cjs.entry.js +10 -10
- package/lib/cjs/duet-nav.cjs.entry.js +3 -3
- package/lib/cjs/duet-notification_2.cjs.entry.js +9 -9
- package/lib/cjs/duet-number-input.cjs.entry.js +8 -8
- package/lib/cjs/duet-overlay.cjs.entry.js +3 -3
- package/lib/cjs/duet-page-heading.cjs.entry.js +6 -6
- package/lib/cjs/duet-pagination_2.cjs.entry.js +16 -16
- package/lib/cjs/duet-panel.cjs.entry.js +4 -4
- package/lib/cjs/duet-phone-input.cjs.entry.js +13 -5
- package/lib/cjs/duet-popup-menu_2.cjs.entry.js +22 -13
- package/lib/cjs/duet-progress.cjs.entry.js +3 -3
- package/lib/cjs/duet-promo-card.cjs.entry.js +8 -8
- package/lib/cjs/duet-radio_2.cjs.entry.js +7 -7
- package/lib/cjs/duet-range-slider.cjs.entry.js +6 -6
- package/lib/cjs/duet-scrollable_3.cjs.entry.js +15 -15
- package/lib/cjs/duet-section-layout.cjs.entry.js +4 -4
- package/lib/cjs/duet-select.cjs.entry.js +9 -9
- package/lib/cjs/duet-shaped-image.cjs.entry.js +4 -4
- package/lib/cjs/duet-share-chart-item.cjs.entry.js +2 -2
- package/lib/cjs/duet-share-chart.cjs.entry.js +6 -6
- package/lib/cjs/duet-show-more.cjs.entry.js +5 -5
- package/lib/cjs/duet-slideout-lang.cjs.entry.js +4 -4
- package/lib/cjs/duet-slideout-link.cjs.entry.js +7 -7
- package/lib/cjs/duet-slideout-panel-dropdown.cjs.entry.js +6 -6
- package/lib/cjs/duet-slideout-panel.cjs.entry.js +11 -11
- package/lib/cjs/duet-slideout.cjs.entry.js +10 -10
- package/lib/cjs/duet-status-icon.cjs.entry.js +3 -3
- package/lib/cjs/duet-step_2.cjs.entry.js +6 -6
- package/lib/cjs/duet-submenu-bar-dropdown-link.cjs.entry.js +4 -4
- package/lib/cjs/duet-submenu-bar-dropdown.cjs.entry.js +6 -6
- package/lib/cjs/duet-submenu-bar-item.cjs.entry.js +6 -6
- package/lib/cjs/duet-submenu-bar-link.cjs.entry.js +3 -3
- package/lib/cjs/duet-submenu-bar.cjs.entry.js +7 -7
- package/lib/cjs/duet-teaser.cjs.entry.js +110 -0
- package/lib/cjs/duet-textarea.cjs.entry.js +20 -11
- package/lib/cjs/duet-toggle.cjs.entry.js +8 -8
- package/lib/cjs/duet-toolbar-dropdown-link.cjs.entry.js +4 -4
- package/lib/cjs/duet-toolbar-dropdown.cjs.entry.js +6 -6
- package/lib/cjs/duet-toolbar-item.cjs.entry.js +8 -8
- package/lib/cjs/duet-toolbar-link.cjs.entry.js +4 -4
- package/lib/cjs/duet-toolbar.cjs.entry.js +4 -4
- package/lib/cjs/duet-tooltip-button_2.cjs.entry.js +10 -10
- package/lib/cjs/duet-tooltip.cjs.entry.js +5 -5
- package/lib/cjs/duet-tray.cjs.entry.js +5 -5
- package/lib/cjs/duet-upload-aria-status.cjs.entry.js +2 -2
- package/lib/cjs/duet-upload-item.cjs.entry.js +6 -6
- package/lib/cjs/duet-visually-hidden.cjs.entry.js +2 -2
- package/lib/cjs/duet.cjs.js +3 -3
- package/lib/cjs/{errorcodes.utils-C0tQ3k6Z.js → errorcodes.utils-MdC-C1Fa.js} +1 -1
- package/lib/cjs/{floating-ui.dom.browser.min-Cj0r5YDz.js → floating-ui.dom.browser.min-DaH62q3u.js} +83 -0
- package/lib/cjs/{focus-utils-tCoGOO7d.js → focus-utils-KpSp5WDp.js} +1 -1
- package/lib/cjs/{index-BeiMjjVl.js → index-BP4tQozH.js} +5 -1
- package/lib/cjs/{label-Cu4DNShe.js → label-CjvqwyJR.js} +1 -1
- package/lib/cjs/{language-utils-B3NubUDr.js → language-utils-BCJyRc_q.js} +1 -1
- package/lib/cjs/loader.cjs.js +3 -3
- package/lib/cjs/{picture-utils-D_HVgfq5.js → picture-utils-Dp6TiDHy.js} +7 -2
- package/lib/cjs/{slot-utils-Dny6EJ_G.js → slot-utils-DvtoWHAA.js} +1 -1
- package/lib/cjs/{themeable-component-Csdvrnsd.js → themeable-component-BXqwFhg-.js} +1 -1
- package/lib/collection/collection-manifest.json +1 -0
- package/lib/collection/components/duet-badge/duet-badge.js +2 -2
- package/lib/collection/components/duet-banner/duet-banner.js +23 -4
- package/lib/collection/components/duet-breadcrumbs/duet-breadcrumb.js +4 -4
- package/lib/collection/components/duet-breadcrumbs/duet-breadcrumbs.js +2 -2
- package/lib/collection/components/duet-button/duet-button.css +3 -0
- package/lib/collection/components/duet-callout/duet-callout.js +2 -2
- package/lib/collection/components/duet-card/duet-card.css +13 -9
- package/lib/collection/components/duet-card/duet-card.js +24 -4
- package/lib/collection/components/duet-choice/duet-checkmark.js +2 -2
- package/lib/collection/components/duet-choice-group/duet-choice-group.js +12 -3
- package/lib/collection/components/duet-combobox/duet-combobox-select.js +1 -1
- package/lib/collection/components/duet-combobox/duet-combobox.js +30 -24
- package/lib/collection/components/duet-contact-card/duet-contact-card.js +23 -3
- package/lib/collection/components/duet-date-picker/date-picker-day.js +1 -1
- package/lib/collection/components/duet-date-picker/duet-date-picker.js +34 -7
- package/lib/collection/components/duet-fieldset/duet-fieldset.js +3 -3
- package/lib/collection/components/duet-grid/duet-grid.css +22 -0
- package/lib/collection/components/duet-grid/duet-grid.js +14 -5
- package/lib/collection/components/duet-grid-item/duet-grid-item.js +2 -2
- package/lib/collection/components/duet-hero/duet-hero.css +149 -136
- package/lib/collection/components/duet-hero/duet-hero.js +32 -7
- package/lib/collection/components/duet-icon/duet-icon.js +3 -3
- package/lib/collection/components/duet-input/duet-input.css +31 -0
- package/lib/collection/components/duet-input/duet-input.js +48 -14
- package/lib/collection/components/duet-link/duet-link.css +16 -0
- package/lib/collection/components/duet-link/duet-link.js +2 -2
- package/lib/collection/components/duet-list-item/duet-list-item.js +2 -2
- package/lib/collection/components/duet-menu-bar-button/duet-menu-bar-button.js +2 -2
- package/lib/collection/components/duet-menu-bar-dropdown/duet-menu-bar-dropdown.js +4 -4
- package/lib/collection/components/duet-menu-bar-dropdown-link/duet-menu-bar-dropdown-link.js +2 -2
- package/lib/collection/components/duet-menu-bar-item/duet-menu-bar-item.js +2 -2
- package/lib/collection/components/duet-menu-bar-link/duet-menu-bar-link.js +2 -2
- package/lib/collection/components/duet-modal/duet-modal.css +8 -1
- package/lib/collection/components/duet-modal/duet-modal.js +6 -7
- package/lib/collection/components/duet-multiselect/duet-multiselect.js +5 -5
- package/lib/collection/components/duet-nav/duet-nav.js +1 -1
- package/lib/collection/components/duet-notification/duet-notification.js +2 -2
- package/lib/collection/components/duet-notification-drawer/duet-notification-drawer.js +3 -3
- package/lib/collection/components/duet-number-input/duet-number-input.js +23 -4
- package/lib/collection/components/duet-overlay/duet-overlay.js +1 -1
- package/lib/collection/components/duet-page-heading/duet-page-heading.js +3 -3
- package/lib/collection/components/duet-pagination/duet-pagination.js +11 -11
- package/lib/collection/components/duet-panel/duet-panel.js +2 -2
- package/lib/collection/components/duet-paragraph/duet-paragraph.js +2 -2
- package/lib/collection/components/duet-phone-input/duet-phone-input.js +9 -1
- package/lib/collection/components/duet-popup-menu/duet-popup-menu.js +13 -4
- package/lib/collection/components/duet-popup-menu-item/duet-popup-menu-item.css +2 -0
- package/lib/collection/components/duet-popup-menu-item/duet-popup-menu-item.js +2 -2
- package/lib/collection/components/duet-promo-card/duet-promo-card.js +23 -4
- package/lib/collection/components/duet-radio/duet-radio.js +3 -3
- package/lib/collection/components/duet-radio-group/duet-radio-group.js +1 -1
- package/lib/collection/components/duet-range-slider/duet-range-slider.js +2 -2
- package/lib/collection/components/duet-range-stepper/duet-range-stepper.js +2 -2
- package/lib/collection/components/duet-scrollable/duet-scrollable.js +5 -5
- package/lib/collection/components/duet-section-layout/duet-section-layout.js +3 -3
- package/lib/collection/components/duet-select/duet-select.js +5 -5
- package/lib/collection/components/duet-shaped-image/duet-shaped-image.js +2 -2
- package/lib/collection/components/duet-share-chart/duet-share-chart.js +2 -2
- package/lib/collection/components/duet-share-chart-item/duet-share-chart-item.js +1 -1
- package/lib/collection/components/duet-show-more/duet-show-more.js +2 -2
- package/lib/collection/components/duet-slideout/duet-slideout.js +4 -4
- package/lib/collection/components/duet-slideout-lang/duet-slideout-lang.js +1 -1
- package/lib/collection/components/duet-slideout-link/duet-slideout-link.js +2 -2
- package/lib/collection/components/duet-slideout-panel/duet-slideout-panel.js +6 -6
- package/lib/collection/components/duet-slideout-panel-dropdown/duet-slideout-panel-dropdown.js +4 -4
- package/lib/collection/components/duet-spacer/duet-spacer.js +1 -1
- package/lib/collection/components/duet-spinner/duet-spinner.js +1 -1
- package/lib/collection/components/duet-status-icon/duet-status-icon.js +2 -2
- package/lib/collection/components/duet-step/duet-step.js +2 -2
- package/lib/collection/components/duet-stepper/duet-stepper.js +1 -1
- package/lib/collection/components/duet-submenu-bar/duet-submenu-bar.js +5 -5
- package/lib/collection/components/duet-submenu-bar-dropdown/duet-submenu-bar-dropdown.js +4 -4
- package/lib/collection/components/duet-submenu-bar-dropdown-link/duet-submenu-bar-dropdown-link.js +2 -2
- package/lib/collection/components/duet-submenu-bar-item/duet-submenu-bar-item.js +1 -1
- package/lib/collection/components/duet-submenu-bar-link/duet-submenu-bar-link.js +1 -1
- package/lib/collection/components/duet-tab/duet-tab.js +2 -2
- package/lib/collection/components/duet-tab-group/duet-tab-group.js +4 -4
- package/lib/collection/components/duet-table/duet-table.js +2 -2
- package/lib/collection/components/duet-teaser/duet-teaser.css +127 -0
- package/lib/collection/components/duet-teaser/duet-teaser.js +462 -0
- package/lib/collection/components/duet-textarea/duet-textarea.css +8 -0
- package/lib/collection/components/duet-textarea/duet-textarea.js +35 -6
- package/lib/collection/components/duet-toggle/duet-toggle.js +3 -3
- package/lib/collection/components/duet-toolbar/duet-toolbar.js +2 -2
- package/lib/collection/components/duet-toolbar-dropdown/duet-toolbar-dropdown.js +4 -4
- package/lib/collection/components/duet-toolbar-dropdown-link/duet-toolbar-dropdown-link.js +2 -2
- package/lib/collection/components/duet-toolbar-item/duet-toolbar-item.js +3 -3
- package/lib/collection/components/duet-toolbar-link/duet-toolbar-link.js +2 -2
- package/lib/collection/components/duet-tooltip/duet-tooltip-button.css +6 -0
- package/lib/collection/components/duet-tooltip/duet-tooltip-button.js +3 -3
- package/lib/collection/components/duet-tooltip/duet-tooltip-popup.js +3 -3
- package/lib/collection/components/duet-tray/duet-tray.js +2 -2
- package/lib/collection/components/duet-upload/duet-upload.js +2 -2
- package/lib/collection/components/duet-upload-aria-status/duet-upload-aria-status.js +1 -1
- package/lib/collection/components/duet-upload-item/duet-upload-item.js +2 -2
- package/lib/collection/components/duet-visually-hidden/duet-visually-hidden.js +1 -1
- package/lib/collection/utils/picture-utils.js +6 -1
- package/lib/duet/duet.esm.js +1 -1
- package/lib/duet/p-01a6e993.entry.js +4 -0
- package/lib/duet/{p-4e1c2676.entry.js → p-0476dabc.entry.js} +1 -1
- package/lib/duet/p-06e879d2.entry.js +4 -0
- package/lib/duet/p-0f433f55.entry.js +4 -0
- package/lib/duet/{p-1d7a9425.entry.js → p-126b3fd0.entry.js} +1 -1
- package/lib/duet/{p-c54ecb23.entry.js → p-1566e2ec.entry.js} +1 -1
- package/lib/duet/{p-4e5532c8.entry.js → p-1956dd8e.entry.js} +1 -1
- package/lib/duet/{p-20c8226c.entry.js → p-1db9e784.entry.js} +1 -1
- package/lib/duet/{p-6ce82324.entry.js → p-1deed1aa.entry.js} +1 -1
- package/lib/duet/{p-3b9d7f6a.entry.js → p-27894857.entry.js} +1 -1
- package/lib/duet/{p-4a041c60.entry.js → p-2c2e7c9b.entry.js} +1 -1
- package/lib/duet/{p-ee369233.entry.js → p-2c465a03.entry.js} +1 -1
- package/lib/duet/p-2d780739.entry.js +4 -0
- package/lib/duet/{p-4b07ce36.entry.js → p-2f092aed.entry.js} +1 -1
- package/lib/duet/p-304af2e5.entry.js +4 -0
- package/lib/duet/{p-6a11ba26.entry.js → p-34d16cbb.entry.js} +1 -1
- package/lib/duet/p-34ec25cb.entry.js +4 -0
- package/lib/duet/{p-f4de7ac0.entry.js → p-37d5a3c5.entry.js} +1 -1
- package/lib/duet/{p-2e44c6b8.entry.js → p-3932a89b.entry.js} +1 -1
- package/lib/duet/{p-46287d85.entry.js → p-3c8d76e2.entry.js} +1 -1
- package/lib/duet/{p-8fbcea55.entry.js → p-3d454072.entry.js} +1 -1
- package/lib/duet/{p-aa1256f9.entry.js → p-3e66035d.entry.js} +1 -1
- package/lib/duet/{p-83dcbb64.entry.js → p-471d4d75.entry.js} +1 -1
- package/lib/duet/{p-f4538e9d.entry.js → p-4ddf8009.entry.js} +1 -1
- package/lib/duet/{p-4acdc586.entry.js → p-5044e0ed.entry.js} +1 -1
- package/lib/duet/{p-304a9a55.entry.js → p-5103d5f4.entry.js} +1 -1
- package/lib/duet/{p-3533d6ee.entry.js → p-51693a7c.entry.js} +1 -1
- package/lib/duet/{p-f297f8f2.entry.js → p-54bfe081.entry.js} +1 -1
- package/lib/duet/p-588e75cd.entry.js +4 -0
- package/lib/duet/{p-174935bc.entry.js → p-5d70e259.entry.js} +1 -1
- package/lib/duet/p-618cfeef.entry.js +4 -0
- package/lib/duet/{p-12d7fdf6.entry.js → p-6449b1cc.entry.js} +1 -1
- package/lib/duet/{p-e442943d.entry.js → p-6502a274.entry.js} +1 -1
- package/lib/duet/p-69a72f22.entry.js +4 -0
- package/lib/duet/{p-512d18c8.entry.js → p-6e4536e3.entry.js} +1 -1
- package/lib/duet/{p-fdc4a97c.entry.js → p-6ed52261.entry.js} +1 -1
- package/lib/duet/{p-ac4fc44c.entry.js → p-712adcec.entry.js} +1 -1
- package/lib/duet/{p-4cee693b.entry.js → p-79afa773.entry.js} +1 -1
- package/lib/duet/p-7d61dc62.entry.js +4 -0
- package/lib/duet/p-7f9de2a6.entry.js +4 -0
- package/lib/duet/{p-e40d9c21.entry.js → p-870d3c78.entry.js} +1 -1
- package/lib/duet/{p-ae382e2e.entry.js → p-88bf42dc.entry.js} +1 -1
- package/lib/duet/{p-8927ccc1.entry.js → p-88e65283.entry.js} +1 -1
- package/lib/duet/{p-bc41d13d.entry.js → p-8aaf283d.entry.js} +1 -1
- package/lib/duet/p-8d939074.entry.js +4 -0
- package/lib/duet/{p-a01f3141.entry.js → p-908fca79.entry.js} +1 -1
- package/lib/duet/{p-9b2731b9.entry.js → p-93080f2d.entry.js} +1 -1
- package/lib/duet/{p-407d4e5a.entry.js → p-94d057ea.entry.js} +1 -1
- package/lib/duet/{p-84f8bee8.entry.js → p-99367980.entry.js} +1 -1
- package/lib/duet/{p-f30c3cfe.entry.js → p-9a248faf.entry.js} +1 -1
- package/lib/duet/p-9d405b35.entry.js +4 -0
- package/lib/duet/{p-30d8a1e4.entry.js → p-9ed154f5.entry.js} +1 -1
- package/lib/duet/{p-DI7IXBXp.js → p-B1GzOTNZ.js} +1 -1
- package/lib/duet/p-BQTM1aqo.js +4 -0
- package/lib/duet/{p-D3450NfA.js → p-CdcBxXLd.js} +1 -1
- package/lib/duet/{p-KbNgo0QF.js → p-CirNV9Vh.js} +1 -1
- package/lib/duet/{p-D9N9LBeD.js → p-Cj9zQLn2.js} +1 -1
- package/lib/duet/{p-JFwTD5kM.js → p-D3ladndz.js} +1 -1
- package/lib/duet/p-D4pJQwPW.js +4 -0
- package/lib/duet/p-Dbe-q7B5.js +4 -0
- package/lib/duet/{p-BDgGHTHh.js → p-DmLE9-rw.js} +1 -1
- package/lib/duet/{p-CcoGR9T9.js → p-DoEOuTZj.js} +1 -1
- package/lib/duet/{p-61abccd4.entry.js → p-a2514ad4.entry.js} +1 -1
- package/lib/duet/{p-0e10e36b.entry.js → p-a4a3febe.entry.js} +1 -1
- package/lib/duet/p-a517cdce.entry.js +4 -0
- package/lib/duet/{p-374b48f6.entry.js → p-a70bb08d.entry.js} +1 -1
- package/lib/duet/{p-d72dee5d.entry.js → p-aa2c3e0a.entry.js} +1 -1
- package/lib/duet/{p-95bb2a8d.entry.js → p-af7b2954.entry.js} +1 -1
- package/lib/duet/{p-9c41f1d5.entry.js → p-b37d4985.entry.js} +1 -1
- package/lib/duet/p-b4cf5f14.entry.js +4 -0
- package/lib/duet/{p-d7abb7fa.entry.js → p-b6233e75.entry.js} +1 -1
- package/lib/duet/{p-555e0c78.entry.js → p-b97098a6.entry.js} +1 -1
- package/lib/duet/{p-f8d640ba.entry.js → p-bd0263e4.entry.js} +1 -1
- package/lib/duet/{p-244bfbf9.entry.js → p-beaa4612.entry.js} +1 -1
- package/lib/duet/{p-264688ae.entry.js → p-c15c8dd2.entry.js} +1 -1
- package/lib/duet/{p-20066df8.entry.js → p-c223cd3e.entry.js} +1 -1
- package/lib/duet/{p-8bdcfd1f.entry.js → p-c35ae5a0.entry.js} +1 -1
- package/lib/duet/p-c435bb67.entry.js +4 -0
- package/lib/duet/{p-3def9480.entry.js → p-c6e3723f.entry.js} +1 -1
- package/lib/duet/{p-9b448008.entry.js → p-c7b32952.entry.js} +1 -1
- package/lib/duet/p-c95669be.entry.js +4 -0
- package/lib/duet/{p-1579bdf5.entry.js → p-c987a644.entry.js} +1 -1
- package/lib/duet/p-c9b8c2ba.entry.js +4 -0
- package/lib/duet/{p-ec1d2e0a.entry.js → p-c9bdf927.entry.js} +1 -1
- package/lib/duet/p-cdf0fb4c.entry.js +4 -0
- package/lib/duet/p-d069edf1.entry.js +4 -0
- package/lib/duet/p-ddafe27d.entry.js +4 -0
- package/lib/duet/{p-210bc161.entry.js → p-dfdec452.entry.js} +1 -1
- package/lib/duet/{p-829bccb7.entry.js → p-e0f729ad.entry.js} +1 -1
- package/lib/duet/{p-5f72134e.entry.js → p-e32af858.entry.js} +1 -1
- package/lib/duet/{p-5b322a86.entry.js → p-e353daaf.entry.js} +1 -1
- package/lib/duet/p-e5dbac7a.entry.js +4 -0
- package/lib/duet/p-ec2dcb1b.entry.js +4 -0
- package/lib/duet/{p-9889218e.entry.js → p-ed7fbc44.entry.js} +1 -1
- package/lib/duet/{p-914ee7ac.entry.js → p-ef6ce9dc.entry.js} +1 -1
- package/lib/duet/{p-fc2be136.entry.js → p-fcb9c0db.entry.js} +1 -1
- package/lib/duet/{p-48e77341.entry.js → p-fe821e46.entry.js} +1 -1
- package/lib/duet/p-qboSQpUe.js +4 -0
- package/lib/esm/{a11y-utils--wwGTL0T.js → a11y-utils-DbDY4hy4.js} +1 -1
- package/lib/esm/{app-globals-Diuuep9d.js → app-globals-COfbcvxE.js} +1 -1
- package/lib/esm/duet-action-button.entry.js +3 -3
- package/lib/esm/duet-alert.entry.js +4 -4
- package/lib/esm/duet-badge.entry.js +6 -6
- package/lib/esm/duet-banner.entry.js +8 -8
- package/lib/esm/duet-breadcrumb.entry.js +6 -6
- package/lib/esm/duet-breadcrumbs.entry.js +5 -5
- package/lib/esm/duet-button_2.entry.js +5 -5
- package/lib/esm/duet-callout.entry.js +5 -5
- package/lib/esm/duet-caption_4.entry.js +10 -10
- package/lib/esm/duet-card.entry.js +10 -9
- package/lib/esm/duet-checkbox.entry.js +3 -3
- package/lib/esm/duet-checkmark.entry.js +4 -4
- package/lib/esm/duet-chip.entry.js +3 -3
- package/lib/esm/duet-choice_2.entry.js +16 -7
- package/lib/esm/duet-collapsible.entry.js +3 -3
- package/lib/esm/duet-combobox.entry.js +32 -25
- package/lib/esm/duet-contact-card.entry.js +8 -7
- package/lib/esm/duet-cookie-consent.entry.js +2 -2
- package/lib/esm/duet-date-picker.entry.js +17 -13
- package/lib/esm/duet-divider_2.entry.js +3 -3
- package/lib/esm/duet-editable-table_3.entry.js +8 -8
- package/lib/esm/duet-empty-state.entry.js +2 -2
- package/lib/esm/duet-fieldset.entry.js +6 -6
- package/lib/esm/duet-file-chooser.entry.js +2 -2
- package/lib/esm/duet-footer.entry.js +4 -4
- package/lib/esm/duet-grid_2.entry.js +12 -8
- package/lib/esm/duet-header_2.entry.js +3 -3
- package/lib/esm/duet-hero.entry.js +18 -13
- package/lib/esm/duet-icon.entry.js +5 -5
- package/lib/esm/duet-indicator.entry.js +3 -3
- package/lib/esm/duet-input_2.entry.js +33 -19
- package/lib/esm/duet-layout.entry.js +2 -2
- package/lib/esm/duet-list_2.entry.js +4 -4
- package/lib/esm/duet-menu-bar-button.entry.js +4 -4
- package/lib/esm/duet-menu-bar-dropdown-link.entry.js +4 -4
- package/lib/esm/duet-menu-bar-dropdown.entry.js +6 -6
- package/lib/esm/duet-menu-bar-item.entry.js +7 -7
- package/lib/esm/duet-menu-bar-link.entry.js +4 -4
- package/lib/esm/duet-menu-bar.entry.js +3 -3
- package/lib/esm/duet-modal.entry.js +12 -13
- package/lib/esm/duet-multiselect.entry.js +10 -10
- package/lib/esm/duet-nav.entry.js +3 -3
- package/lib/esm/duet-notification_2.entry.js +9 -9
- package/lib/esm/duet-number-input.entry.js +8 -8
- package/lib/esm/duet-overlay.entry.js +3 -3
- package/lib/esm/duet-page-heading.entry.js +6 -6
- package/lib/esm/duet-pagination_2.entry.js +16 -16
- package/lib/esm/duet-panel.entry.js +4 -4
- package/lib/esm/duet-phone-input.entry.js +13 -5
- package/lib/esm/duet-popup-menu_2.entry.js +22 -13
- package/lib/esm/duet-progress.entry.js +3 -3
- package/lib/esm/duet-promo-card.entry.js +8 -8
- package/lib/esm/duet-radio_2.entry.js +7 -7
- package/lib/esm/duet-range-slider.entry.js +6 -6
- package/lib/esm/duet-scrollable_3.entry.js +15 -15
- package/lib/esm/duet-section-layout.entry.js +4 -4
- package/lib/esm/duet-select.entry.js +9 -9
- package/lib/esm/duet-shaped-image.entry.js +4 -4
- package/lib/esm/duet-share-chart-item.entry.js +2 -2
- package/lib/esm/duet-share-chart.entry.js +6 -6
- package/lib/esm/duet-show-more.entry.js +5 -5
- package/lib/esm/duet-slideout-lang.entry.js +4 -4
- package/lib/esm/duet-slideout-link.entry.js +7 -7
- package/lib/esm/duet-slideout-panel-dropdown.entry.js +6 -6
- package/lib/esm/duet-slideout-panel.entry.js +11 -11
- package/lib/esm/duet-slideout.entry.js +10 -10
- package/lib/esm/duet-status-icon.entry.js +3 -3
- package/lib/esm/duet-step_2.entry.js +6 -6
- package/lib/esm/duet-submenu-bar-dropdown-link.entry.js +4 -4
- package/lib/esm/duet-submenu-bar-dropdown.entry.js +6 -6
- package/lib/esm/duet-submenu-bar-item.entry.js +6 -6
- package/lib/esm/duet-submenu-bar-link.entry.js +3 -3
- package/lib/esm/duet-submenu-bar.entry.js +7 -7
- package/lib/esm/duet-teaser.entry.js +108 -0
- package/lib/esm/duet-textarea.entry.js +20 -11
- package/lib/esm/duet-toggle.entry.js +8 -8
- package/lib/esm/duet-toolbar-dropdown-link.entry.js +4 -4
- package/lib/esm/duet-toolbar-dropdown.entry.js +6 -6
- package/lib/esm/duet-toolbar-item.entry.js +8 -8
- package/lib/esm/duet-toolbar-link.entry.js +4 -4
- package/lib/esm/duet-toolbar.entry.js +4 -4
- package/lib/esm/duet-tooltip-button_2.entry.js +10 -10
- package/lib/esm/duet-tooltip.entry.js +5 -5
- package/lib/esm/duet-tray.entry.js +5 -5
- package/lib/esm/duet-upload-aria-status.entry.js +2 -2
- package/lib/esm/duet-upload-item.entry.js +6 -6
- package/lib/esm/duet-visually-hidden.entry.js +2 -2
- package/lib/esm/duet.js +4 -4
- package/lib/esm/{errorcodes.utils-S_WrUPeV.js → errorcodes.utils-0XnfYFAn.js} +1 -1
- package/lib/esm/{floating-ui.dom.browser.min-B_NkY9T0.js → floating-ui.dom.browser.min-BQTM1aqo.js} +83 -1
- package/lib/esm/{focus-utils-C4oaajGr.js → focus-utils-BwoMMpkj.js} +1 -1
- package/lib/esm/{index-D3450NfA.js → index-CdcBxXLd.js} +5 -1
- package/lib/esm/{label-C1HF2o4Y.js → label-D835wXCb.js} +1 -1
- package/lib/esm/{language-utils-D4WVl8Ph.js → language-utils-C-lpMyP9.js} +1 -1
- package/lib/esm/loader.js +4 -4
- package/lib/esm/{picture-utils-MSeJTkDk.js → picture-utils-Cl2qK3GJ.js} +7 -2
- package/lib/esm/{slot-utils-Dxcjtmp3.js → slot-utils-BSS0Em_Z.js} +1 -1
- package/lib/esm/{themeable-component-QHdUfcat.js → themeable-component-DQtSOD4i.js} +1 -1
- package/lib/types/components/duet-banner/duet-banner.d.ts +5 -0
- package/lib/types/components/duet-card/duet-card.d.ts +5 -0
- package/lib/types/components/duet-combobox/duet-combobox.d.ts +2 -1
- package/lib/types/components/duet-contact-card/duet-contact-card.d.ts +5 -0
- package/lib/types/components/duet-date-picker/duet-date-picker.d.ts +5 -1
- package/lib/types/components/duet-grid/duet-grid.d.ts +2 -1
- package/lib/types/components/duet-hero/duet-hero.d.ts +5 -0
- package/lib/types/components/duet-input/duet-input.d.ts +11 -1
- package/lib/types/components/duet-number-input/duet-number-input.d.ts +4 -0
- package/lib/types/components/duet-phone-input/duet-phone-input.d.ts +1 -0
- package/lib/types/components/duet-promo-card/duet-promo-card.d.ts +5 -0
- package/lib/types/components/duet-teaser/duet-teaser.d.ts +93 -0
- package/lib/types/components/duet-textarea/duet-textarea.d.ts +8 -1
- package/lib/types/components.d.ts +235 -12
- package/lib/types/utils/picture-utils.d.ts +4 -0
- package/package.json +5 -5
- package/lib/duet/p-054c334d.entry.js +0 -4
- package/lib/duet/p-2bf78fe4.entry.js +0 -4
- package/lib/duet/p-3445529c.entry.js +0 -4
- package/lib/duet/p-3fbe466a.entry.js +0 -4
- package/lib/duet/p-41230630.entry.js +0 -4
- package/lib/duet/p-44e53564.entry.js +0 -4
- package/lib/duet/p-4a251661.entry.js +0 -4
- package/lib/duet/p-4a4e5bb5.entry.js +0 -4
- package/lib/duet/p-6bd78205.entry.js +0 -4
- package/lib/duet/p-6c239923.entry.js +0 -4
- package/lib/duet/p-6d1d1199.entry.js +0 -4
- package/lib/duet/p-81c5d3e3.entry.js +0 -4
- package/lib/duet/p-985213bb.entry.js +0 -4
- package/lib/duet/p-BZev46O8.js +0 -4
- package/lib/duet/p-B_NkY9T0.js +0 -4
- package/lib/duet/p-CyfEm8iD.js +0 -4
- package/lib/duet/p-Dk60lC7n.js +0 -4
- package/lib/duet/p-a49b5d93.entry.js +0 -4
- package/lib/duet/p-a6dbe893.entry.js +0 -4
- package/lib/duet/p-aa7e4c81.entry.js +0 -4
- package/lib/duet/p-dbb9e1d4.entry.js +0 -4
- package/lib/duet/p-e43df9c2.entry.js +0 -4
- package/lib/duet/p-eb7bc989.entry.js +0 -4
- package/lib/duet/p-edcdf0b7.entry.js +0 -4
- package/lib/duet/p-f9db8670.entry.js +0 -4
- package/lib/duet/p-fc1a18f8.entry.js +0 -4
package/hydrate/index.js
CHANGED
|
@@ -5272,13 +5272,13 @@ class DuetBadge {
|
|
|
5272
5272
|
*/
|
|
5273
5273
|
render() {
|
|
5274
5274
|
const backgroundClass = `background-${this.background}`;
|
|
5275
|
-
return (hAsync(Host, { key: '
|
|
5275
|
+
return (hAsync(Host, { key: '1963c91d66ae23fdb441d2dce1a84f073bcdf7dc', class: { "duet-m-0": this.margin === "none" } }, hAsync("span", { key: 'b7e28ae61de88316c3d7731611b97826205a66b8', class: {
|
|
5276
5276
|
"duet-badge": true,
|
|
5277
5277
|
[this.variation]: true,
|
|
5278
5278
|
[backgroundClass]: true,
|
|
5279
5279
|
"has-tooltip": !!this.tooltip || this.hasTooltipSlot,
|
|
5280
5280
|
"duet-theme-turva": this.theme === "turva",
|
|
5281
|
-
} }, hAsync("duet-visually-hidden", { key: '
|
|
5281
|
+
} }, hAsync("duet-visually-hidden", { key: '4fe8e2e72cd4fa1081b9bad8c96997cfb835891e' }, this.getVariationLabel()), hAsync("slot", { key: '399d4132158cef2c65e9646eb62d8c345f6047f9' }), (this.tooltip || this.hasTooltipSlot) && (hAsync("span", { key: '1e908df23daa2a69ac125d56f9b25662e3fb308e', class: "tooltip-wrap" }, !this.hasTooltipSlot && (hAsync("duet-tooltip", { key: 'e4bc5393384f5cc5932a2e222336dc2e7ddc6573', "accessible-about-label": this.getBadgeText(), badgeElement: this.element }, this.tooltip)), hAsync("slot", { key: '452acb4e7b7d7e90e7414efcf4cbf3ed7937225c', name: "tooltip" }))))));
|
|
5282
5282
|
}
|
|
5283
5283
|
get element() { return getElement(this); }
|
|
5284
5284
|
static get style() { return duetBadgeCss; }
|
|
@@ -5299,10 +5299,15 @@ class DuetBadge {
|
|
|
5299
5299
|
}
|
|
5300
5300
|
|
|
5301
5301
|
const DuetPicture = ({ img, sources }) => {
|
|
5302
|
+
const imgAttrs = Object.assign({}, img);
|
|
5303
|
+
if (!img.alt) {
|
|
5304
|
+
imgAttrs.alt = "";
|
|
5305
|
+
imgAttrs.role = "presentation";
|
|
5306
|
+
}
|
|
5302
5307
|
return (hAsync("picture", null,
|
|
5303
5308
|
sources &&
|
|
5304
5309
|
sources.map(source => (hAsync("source", { srcSet: source.srcset, media: source.media, type: source.type, sizes: source.sizes }))),
|
|
5305
|
-
hAsync("img", Object.assign({},
|
|
5310
|
+
hAsync("img", Object.assign({}, imgAttrs))));
|
|
5306
5311
|
};
|
|
5307
5312
|
|
|
5308
5313
|
const duetBannerCss = "*,\n*::after,\n*::before {\n box-sizing: border-box;\n padding: 0;\n margin: 0;\n -moz-appearance: none;\n -webkit-appearance: none;\n appearance: none;\n background: transparent;\n border: 0;\n}\n\n:host {\n box-sizing: border-box;\n padding: 0;\n margin: 0;\n -moz-appearance: none;\n -webkit-appearance: none;\n appearance: none;\n background: transparent;\n border: 0;\n margin-right: 36px !important;\n margin-bottom: 36px !important;\n display: flex;\n justify-content: center;\n width: auto;\n container: duet-banner-container;\n container-type: inline-size;\n}\n:host:last-child, :host:last-of-type {\n margin-right: 0 !important;\n}\n[alignment=form-distribute] > :host:last-of-type:not(:last-child) {\n margin-right: 36px !important;\n}\n\n:host(.duet-m-0) {\n margin: 0 !important;\n}\n\n.duet-banner {\n display: grid;\n grid-template-rows: min-content 1fr;\n width: 100%;\n height: 100%;\n font-family: \"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n font-style: normal;\n text-align: left;\n border-radius: 16px;\n}\n.duet-banner.duet-p-0 {\n padding: 0 !important;\n}\n.duet-banner.duet-m-0 {\n margin: 0 !important;\n}\n.duet-banner .visual {\n position: relative;\n display: none;\n overflow: hidden;\n}\n@container duet-banner-container (min-width: 0) {\n .duet-banner .visual {\n display: block;\n }\n}\n.duet-banner .visual .image-container {\n position: relative;\n aspect-ratio: 2/1;\n overflow: hidden;\n}\n.duet-banner .visual .image {\n position: relative;\n width: 100%;\n height: 100%;\n object-fit: cover;\n object-position: center;\n}\n.duet-banner .visual .image.contain {\n padding: 16px 20px 0;\n object-fit: contain;\n object-position: center bottom;\n}\n.duet-banner .visual .icon {\n position: absolute;\n}\n.duet-banner .visual .brand-shape {\n position: absolute;\n top: 0;\n left: 72%;\n display: none;\n width: 100%;\n height: 100%;\n mask-image: url(\"data:image/svg+xml,%3Csvg%20%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20344%22%20fill%3D%22none%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M2.72641e-07%2091.1902C0.000476976%2097.9034%200.626077%20104.726%201.92282%20111.592L42.7493%20327.771C43.8045%20333.358%2045.2667%20338.776%2047.0996%20344H160V0H51.1439C19.7799%2019.1253%200.00268143%2053.4178%202.72641e-07%2091.1749C-9.08807e-08%2091.18%20-9.08875e-08%2091.1851%202.72641e-07%2091.1902Z%22%20fill%3D%22%23E6F2F8%22%2F%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fsvg%3E\");\n transform: scale(101%);\n}\n.duet-banner .content {\n display: flex;\n flex-direction: column;\n gap: 8px;\n padding: 16px 20px 28px;\n}\n.duet-banner .content .description {\n hyphens: auto;\n}\n.duet-banner .action {\n display: flex;\n flex-grow: 1;\n flex-direction: column;\n align-items: flex-start;\n justify-content: flex-end;\n padding-top: 16px;\n}\n.duet-banner .visual {\n border-top-left-radius: 16px;\n border-top-right-radius: 16px;\n}\n.duet-banner .visual .image-container {\n width: 100%;\n height: auto;\n border-radius: 0;\n}\n.duet-banner .visual .icon {\n bottom: 30px;\n left: 15px;\n}\n@container duet-banner-container (min-width: 486px) {\n .duet-banner.size-medium, .duet-banner.size-large {\n grid-template-rows: none;\n grid-template-columns: 50% 50%;\n }\n .duet-banner.size-medium .visual, .duet-banner.size-large .visual {\n border-top-left-radius: 16px;\n border-top-right-radius: 0;\n border-bottom-left-radius: 16px;\n }\n .duet-banner.size-medium .visual .image-container, .duet-banner.size-large .visual .image-container {\n height: 100%;\n }\n .duet-banner.size-medium .visual .image, .duet-banner.size-large .visual .image {\n width: 100%;\n height: 100%;\n }\n .duet-banner.size-medium .visual .image.contain, .duet-banner.size-large .visual .image.contain {\n padding: 28px;\n object-position: center;\n }\n .duet-banner.size-medium .visual .icon, .duet-banner.size-large .visual .icon {\n top: 36px;\n left: 168px;\n }\n .duet-banner.size-medium .visual .brand-shape, .duet-banner.size-large .visual .brand-shape {\n display: block;\n }\n .duet-banner.size-medium .content, .duet-banner.size-large .content {\n align-items: flex-start;\n justify-content: center;\n padding: 28px 28px 28px 0;\n }\n .duet-banner.size-medium .action, .duet-banner.size-large .action {\n flex-grow: 0;\n }\n}\n@container duet-banner-container (min-width: 586px) {\n .duet-banner.size-medium .visual .brand-shape, .duet-banner.size-large .visual .brand-shape {\n left: 80%;\n }\n}\n@container duet-banner-container (min-width: 900px) {\n .duet-banner.size-large {\n grid-template-rows: none;\n grid-template-columns: 50% 50%;\n }\n .duet-banner.size-large .visual {\n border-top-left-radius: 16px;\n border-bottom-left-radius: 16px;\n }\n .duet-banner.size-large .visual .image-container {\n height: 100%;\n }\n .duet-banner.size-large .visual .image {\n width: 100%;\n height: 100%;\n }\n .duet-banner.size-large .visual .image.contain {\n padding: 48px;\n }\n .duet-banner.size-large .visual .icon {\n top: 40px;\n bottom: auto;\n left: 335px;\n }\n .duet-banner.size-large .visual .brand-shape {\n display: block;\n }\n .duet-banner.size-large .content {\n align-items: flex-start;\n justify-content: center;\n padding: 48px 48px 48px 0;\n }\n .duet-banner.size-large .action {\n flex-grow: 0;\n }\n}\n.duet-banner.no-image {\n display: flex;\n justify-content: center;\n padding: 36px 20px;\n}\n.duet-banner.no-image .visual {\n display: none;\n}\n.duet-banner.no-image .content {\n width: 100%;\n max-width: 720px;\n padding: 0;\n}\n@container duet-banner-container (min-width: 486px) {\n .duet-banner.no-image.size-medium, .duet-banner.no-image.size-large {\n padding: 48px;\n }\n}\n\n::slotted(.duet-heading) {\n margin: inherit !important;\n font-size: inherit !important;\n line-height: inherit !important;\n color: inherit !important;\n}\n\n.duet-banner.duet-theme-turva {\n font-family: \"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n border-radius: 12px;\n}\n.duet-banner.duet-theme-turva .visual .brand-shape {\n right: 0;\n bottom: 0;\n left: 0;\n display: block;\n mask-image: url(\"data:image/svg+xml,%3Csvg%20width%3D%22540%22%20height%3D%2258%22%20viewBox%3D%220%200%20540%2058%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M540%2018.0729L540%2057.6749H0L0.000139455%2011.2563C0.000139455%202.85822%208.31858%20-2.59156%2015.3307%201.26796C33.6821%2011.3367%2055.6983%2020.0831%2080.3633%2027.3465C134.438%2043.276%20201.239%2052.0939%20270%2052.0939C338.761%2052.0939%20405.572%2043.276%20459.637%2027.3465C484.302%2020.0742%20506.318%2011.3277%20524.669%201.25902C531.682%20-2.59156%20540%202.85822%20540%2011.2563V18.0729Z%22%20fill%3D%22%23FBEBE1%22%2F%3E%0A%3C%2Fsvg%3E%0A\");\n mask-repeat: no-repeat;\n mask-position: bottom;\n mask-size: contain;\n scale: 101%;\n}\n.duet-banner.duet-theme-turva.size-medium .visual, .duet-banner.duet-theme-turva.size-large .visual {\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n}\n@container duet-banner-container (min-width: 486px) {\n .duet-banner.duet-theme-turva.size-medium, .duet-banner.duet-theme-turva.size-large {\n grid-template-columns: 1fr 1fr;\n gap: 28px;\n border-radius: 12px;\n }\n .duet-banner.duet-theme-turva.size-medium .visual, .duet-banner.duet-theme-turva.size-large .visual {\n border-top-left-radius: 12px;\n border-top-right-radius: 0;\n border-bottom-left-radius: 12px;\n }\n .duet-banner.duet-theme-turva.size-medium .visual .image-container, .duet-banner.duet-theme-turva.size-large .visual .image-container {\n padding: 20px;\n padding-right: 0;\n }\n .duet-banner.duet-theme-turva.size-medium .visual .image, .duet-banner.duet-theme-turva.size-large .visual .image {\n border-radius: 12px;\n }\n .duet-banner.duet-theme-turva.size-medium .visual .brand-shape, .duet-banner.duet-theme-turva.size-large .visual .brand-shape {\n display: none;\n }\n}";
|
|
@@ -5435,20 +5440,20 @@ class DuetBanner {
|
|
|
5435
5440
|
img: {
|
|
5436
5441
|
src: this.image,
|
|
5437
5442
|
alt: this.imageAlt || "",
|
|
5438
|
-
loading: "lazy",
|
|
5443
|
+
loading: this.imagePriority === "high" ? "eager" : "lazy",
|
|
5444
|
+
fetchpriority: this.imagePriority,
|
|
5439
5445
|
class: `image ${this.imageFit}`,
|
|
5440
|
-
role: this.imageAlt ? undefined : "presentation",
|
|
5441
5446
|
},
|
|
5442
5447
|
sources: parsePossibleJSON(this.sources),
|
|
5443
5448
|
};
|
|
5444
|
-
return (hAsync(Host, { key: '
|
|
5449
|
+
return (hAsync(Host, { key: '021aafd46f614c2d52ccd2d014574a7a095e2883', class: { "duet-m-0": this.margin === "none" } }, hAsync("aside", { key: 'ea207c896e6b1624a27d4b6ceb79836ab152f207', class: {
|
|
5445
5450
|
"duet-banner": true,
|
|
5446
5451
|
"duet-theme-turva": this.theme === "turva",
|
|
5447
5452
|
[this.currentSize]: true,
|
|
5448
5453
|
"size-medium": this.size === "medium" || this.size === "large",
|
|
5449
5454
|
"size-large": this.size === "large",
|
|
5450
5455
|
"no-image": !this.image,
|
|
5451
|
-
}, style: bannerStyles }, hAsync("div", { key: '
|
|
5456
|
+
}, style: bannerStyles }, hAsync("div", { key: '525c58ab8a5aaa6cf08bab777f9ea3dd071f75ec', class: "visual" }, hAsync("div", { key: '89b977717483d9ffcedeae98f7d2a36263b0f3d3', class: "image-container" }, this.image && hAsync(DuetPicture, Object.assign({ key: '7f1d73ce70cf6687500eef1d0fc546e4bdbb6ea5' }, pictureSource))), 1 > 2, this.imageFit !== "contain" && hAsync("div", { key: '9cb97c2fefe6058b2d1c9b0e1a0c517d732c8b3f', style: bannerStyles, class: "brand-shape" })), hAsync("div", { key: '2674a03efa17932dd1654e18a72115646a806fd3', class: "content" }, this.hasHeadingSlot && (hAsync("div", { key: '9de6d6fe0940b868b74205ff45c48986776c67a7', class: "heading" }, hAsync("duet-heading", { key: 'dca384f371f65d7f40e59c97603ffde9536c10ae', theme: this.theme, level: this.hasHeadingSlotNative ? "div" : this.headingLevel, "visual-level": this.currentSize === "large" ? "h2" : "h3", "fixed-size": true, margin: "none", color: postfixTheme(this.textColor, this.theme) }, hAsync("span", { key: 'e5f9d70b35eb5e3507cc9c4ae78554debd08f7c7' }, hAsync("slot", { key: '26d9d93896e0f095112db72501c8c9de765eba16', name: "heading" }))))), this.hasDescriptionSlot && (hAsync("div", { key: '1a82c4532fa9862d0207675f89308ee8cd071302', class: "description", style: { color } }, hAsync("slot", { key: '78febb3eca846bffd9555b8114c9ecaf33e55433', name: "description" }))), this.hasActionSlot && (hAsync("div", { key: '2f25d1c449e2ff59bbd41d39da665e1a8822a7a2', class: "action" }, hAsync("slot", { key: '2951e812095eaf2e55a40575e6948e83bfd27b2a', name: "action" })))))));
|
|
5452
5457
|
}
|
|
5453
5458
|
get element() { return getElement(this); }
|
|
5454
5459
|
static get style() { return duetBannerCss; }
|
|
@@ -5466,6 +5471,7 @@ class DuetBanner {
|
|
|
5466
5471
|
"image": [1],
|
|
5467
5472
|
"imageAlt": [1, "image-alt"],
|
|
5468
5473
|
"imageFit": [1, "image-fit"],
|
|
5474
|
+
"imagePriority": [1, "image-priority"],
|
|
5469
5475
|
"sources": [1],
|
|
5470
5476
|
"icon": [1],
|
|
5471
5477
|
"headingLevel": [1, "heading-level"],
|
|
@@ -5536,15 +5542,15 @@ class DuetBreadcrumb {
|
|
|
5536
5542
|
*/
|
|
5537
5543
|
render() {
|
|
5538
5544
|
const Tag = this.href ? "a" : "span";
|
|
5539
|
-
return (hAsync(Host, { key: '
|
|
5545
|
+
return (hAsync(Host, { key: '458e4f048570629b3f8002588b750757021e0bbd', role: "listitem" }, hAsync("div", { key: '4fade87714b80818fda47fbfb3789b0f8b27f489', class: "container" }, this.icon === "arrow-right-small-icon" && (hAsync("duet-icon", { key: '9269d8c80d836f44019a394e8a26e878fced07f2', class: "duet-breadrumbs-arrow", size: "auto", icon: arrowRightSmallIcon.svg, margin: "none", color: "currentColor" })), hAsync(Tag, { key: '23772d6dae87c75499adb847dd4a49acb4ffabff', class: {
|
|
5540
5546
|
"duet-breadcrumb": true,
|
|
5541
5547
|
"duet-theme-turva": this.theme === "turva",
|
|
5542
5548
|
"icon-only": this.icon && !this.hasSlottedContent,
|
|
5543
5549
|
}, href: this.href || undefined, "aria-label": this.accessibleLabel || this.element.textContent, "aria-current": this.href ? undefined : "page" }, this.icon !== "arrow-right-small-icon" &&
|
|
5544
5550
|
this.icon && [
|
|
5545
|
-
hAsync("duet-icon", { key: '
|
|
5546
|
-
this.hasSlottedContent && hAsync("duet-spacer", { key: '
|
|
5547
|
-
], hAsync("slot", { key: '
|
|
5551
|
+
hAsync("duet-icon", { key: '5d413bae291a7d10dc2a54b9b0389128defc9e82', size: this.iconSize, name: this.icon, margin: "none", color: "currentColor" }),
|
|
5552
|
+
this.hasSlottedContent && hAsync("duet-spacer", { key: '9fef8271d98fa98c6a31623a937156413718f37c', size: "x-small", direction: "horizontal" }),
|
|
5553
|
+
], hAsync("slot", { key: '47df258e2b4f9bb7d75f4869abd16c8ed84e8550' })))));
|
|
5548
5554
|
}
|
|
5549
5555
|
get element() { return getElement(this); }
|
|
5550
5556
|
static get style() { return duetBreadcrumbCss; }
|
|
@@ -5612,11 +5618,11 @@ class DuetBreadcrumbs {
|
|
|
5612
5618
|
*/
|
|
5613
5619
|
render() {
|
|
5614
5620
|
const color = getColorByName(this.color);
|
|
5615
|
-
return (hAsync(Host, { key: '
|
|
5621
|
+
return (hAsync(Host, { key: '4858d49a29bb34e845436ec070f27e75a6fbe504' }, hAsync("nav", { key: 'fdf5c15b2ee7adcbf8e4b0c230735f8d26ccd83f', "aria-label": this.breadcrumbsAriaLabel, class: {
|
|
5616
5622
|
"duet-breadcrumbs": true,
|
|
5617
5623
|
"duet-theme-turva": this.theme === "turva",
|
|
5618
5624
|
[this.variation]: true,
|
|
5619
|
-
} }, hAsync("div", { key: '
|
|
5625
|
+
} }, hAsync("div", { key: '3235e10bb08008d3b3854f888bf3e4b934aed9e6', class: "container" }, hAsync("div", { key: '60d548db832a4eca47caf48789d5082a7100b5ba', role: "list", class: "list", style: { color } }, hAsync("slot", { key: 'd8170a022b3c9f2e737a29c353a0d2070f752a9c' })), hAsync("div", { key: 'c76631c4b488b8f3ba0007de6c4a62aaf7abc4c7', class: "bottom-border bottom-border--container" })), hAsync("div", { key: '1ca349ec39f209d18d6713f1a127932d4c6d08c8', class: "bottom-border bottom-border--nav" }))));
|
|
5620
5626
|
}
|
|
5621
5627
|
get element() { return getElement(this); }
|
|
5622
5628
|
static get style() { return duetBreadcrumbsCss; }
|
|
@@ -5635,7 +5641,7 @@ class DuetBreadcrumbs {
|
|
|
5635
5641
|
}; }
|
|
5636
5642
|
}
|
|
5637
5643
|
|
|
5638
|
-
const duetButtonCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;margin-right:8px !important;margin-bottom:12px !important;position:relative;z-index:1;display:inline-flex;width:auto;max-width:100%;font-size:0;vertical-align:bottom;-webkit-tap-highlight-color:transparent}:host:last-child,:host:last-of-type{margin-right:0 !important}[alignment=form-distribute]>:host:last-of-type:not(:last-child){margin-right:8px !important}@media (max-width: 35.9375em){:host{width:100%}}:host(.square){margin-right:12px !important}:host(.square):last-child,:host(.square):last-of-type{margin-right:0 !important}[alignment=form-distribute]>:host(.square):last-of-type:not(:last-child){margin-right:12px !important}:host(.input-button){z-index:250}:host(.duet-small),:host(.duet-x-small){margin-right:4px !important;margin-bottom:8px !important}:host(.duet-small):last-child,:host(.duet-small):last-of-type,:host(.duet-x-small):last-child,:host(.duet-x-small):last-of-type{margin-right:0 !important}[alignment=form-distribute]>:host(.duet-small):last-of-type:not(:last-child),[alignment=form-distribute]>:host(.duet-x-small):last-of-type:not(:last-child){margin-right:4px !important}@media (max-width: 35.9375em){:host(.duet-small),:host(.duet-x-small){width:auto}}:host(.duet-x-small){margin-right:2px !important}:host(.duet-x-small):last-child,:host(.duet-x-small):last-of-type{margin-right:0 !important}[alignment=form-distribute]>:host(.duet-x-small):last-of-type:not(:last-child){margin-right:2px !important}:host(.square.duet-small),:host(.square.duet-x-small){margin-right:8px !important}:host(.square.duet-small):last-child,:host(.square.duet-small):last-of-type,:host(.square.duet-x-small):last-child,:host(.square.duet-x-small):last-of-type{margin-right:0 !important}[alignment=form-distribute]>:host(.square.duet-small):last-of-type:not(:last-child),[alignment=form-distribute]>:host(.square.duet-x-small):last-of-type:not(:last-child){margin-right:8px !important}:host(.duet-expand){width:100% !important}:host(.duet-m-0){margin:0 !important}:host(.duet-fixed){width:auto !important}:host(:last-child){margin-right:0 !important}.duet-button-container{position:relative;display:block;width:100%}.duet-button{-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:flex;align-items:center;width:100%;min-width:8rem;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:rgb(0, 119, 179) !important;text-align:center;text-decoration:none;cursor:pointer;background:transparent;border-style:solid;border-width:1px;transition:background-color 300ms ease, color 300ms ease, border 300ms ease, padding 300ms ease, box-shadow 300ms ease}.duet-button.duet-p-0{padding:0 !important}.duet-button.duet-m-0{margin:0 !important}.duet-button:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-button:focus,.duet-button:focus.duet-theme-turva{outline:2px solid;outline-offset:2px;outline-color:rgba(53, 79, 101, 0.8)}.duet-button.duet-button-size-medium{height:50px;padding-right:30px;padding-left:30px;font-size:1rem;border-radius:25px}.duet-button.duet-button-size-medium.square{border-radius:12.5px}.duet-button.duet-button-size-medium.icon-left{padding-left:24px}.duet-button.duet-button-size-medium.icon-right{padding-right:24px}.duet-button.duet-button-size-small{height:40px;padding-right:20px;padding-left:20px;font-size:0.875rem;border-radius:20px}.duet-button.duet-button-size-small.square{border-radius:10px}.duet-button.duet-button-size-small.icon-left{padding-left:18px}.duet-button.duet-button-size-small.icon-right{padding-right:18px}.duet-button.duet-button-size-x-small{height:32px;padding-right:12px;padding-left:12px;font-size:0.75rem;border-radius:8px}.duet-button.duet-button-size-x-small.icon-left{padding-left:10px}.duet-button.duet-button-size-x-small.icon-right{padding-right:10px}.duet-button.plain.duet-p-0{height:auto}.duet-button:not(.input-button-primary,.input-button-secondary,.input-button-embedded){font-variant-numeric:tabular-nums}.duet-button.duet-button-text-center{text-align:center !important}.duet-button.duet-button-is-small:not(.duet-button-icon-only){min-width:48px}.duet-button.duet-button-is-small:not(.duet-button-icon-only).plain{padding-right:0 !important;padding-left:0 !important}.duet-button.duet-button-is-small:not(.duet-button-icon-only).duet-p-0{padding:0 !important}.duet-button .duet-button-contents{position:relative;display:flex;gap:10px;align-items:center;margin:0 auto;pointer-events:none}.duet-button .duet-button-contents.icon-right{flex-direction:row-reverse}.duet-button .duet-button-contents .duet-button-contents-slot{position:relative;top:0}.duet-button.duet-no-wrap{white-space:nowrap}.duet-button svg{width:100%;min-width:100%;fill:currentColor}.duet-button .duet-button-icon{display:flex;align-items:center}.duet-button .duet-button-icon duet-icon{width:16px;height:16px}.duet-button .duet-button-icon.large duet-icon{width:20px;height:20px}.duet-button .duet-button-icon.medium-small duet-icon{width:10px;height:10px}.duet-button .duet-button-icon.small duet-icon{width:7px;height:7px}.duet-button:active:not([disabled]){opacity:0.75;transition:none}.duet-button.default{background:rgb(255, 255, 255);border-color:rgb(181, 198, 208)}.duet-button.default:hover{outline:2px solid rgb(0, 119, 179);outline-offset:-2px;border-color:rgb(0, 119, 179)}.duet-button.default.duet-button-negative{background-color:rgb(255, 255, 255)}.duet-button.default.duet-button-negative:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}.duet-button.primary,.duet-button.input-button-primary,.duet-button.input-button-left-primary{color:rgb(255, 255, 255) !important;background:rgb(0, 119, 179);border-color:rgb(0, 119, 179)}.duet-button.primary:hover,.duet-button.input-button-primary:hover,.duet-button.input-button-left-primary:hover{background:#005f8f;border-color:#005f8f;box-shadow:0 4px 20px 0 rgba(34, 34, 34, 0.1)}.duet-button.secondary,.duet-button.input-button-secondary,.duet-button.input-button-left-secondary,.duet-button.input-button-embedded{color:rgb(8, 42, 77) !important;background:transparent;border-color:rgb(8, 42, 77)}.duet-button.secondary:hover,.duet-button.input-button-secondary:hover,.duet-button.input-button-left-secondary:hover,.duet-button.input-button-embedded:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179);outline:2px solid;outline-color:rgb(127, 150, 165) !important;outline-offset:-1px}.duet-theme-turva .duet-button.secondary:hover,.duet-button.secondary:hover.duet-theme-turva,.duet-theme-turva .duet-button.input-button-secondary:hover,.duet-button.input-button-secondary:hover.duet-theme-turva,.duet-theme-turva .duet-button.input-button-left-secondary:hover,.duet-button.input-button-left-secondary:hover.duet-theme-turva,.duet-theme-turva .duet-button.input-button-embedded:hover,.duet-button.input-button-embedded:hover.duet-theme-turva{outline-color:rgb(120, 145, 164) !important}.duet-button.secondary.duet-button-negative,.duet-button.input-button-secondary.duet-button-negative,.duet-button.input-button-left-secondary.duet-button-negative,.duet-button.input-button-embedded.duet-button-negative{color:rgb(212, 223, 229) !important;border-color:rgb(255, 255, 255)}.duet-button.secondary.duet-button-negative:hover,.duet-button.input-button-secondary.duet-button-negative:hover,.duet-button.input-button-left-secondary.duet-button-negative:hover,.duet-button.input-button-embedded.duet-button-negative:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}.duet-button.input-button-embedded{width:40px;min-width:40px !important;min-height:40px !important;margin:4px !important;border-width:0 !important;border-radius:4px !important}.duet-button.input-button{height:auto}.duet-button.negative{color:rgb(8, 42, 77) !important;background:rgb(255, 255, 255);border-color:rgb(255, 255, 255)}.duet-button.negative:hover{color:rgb(255, 255, 255) !important;background:transparent;border-color:rgb(255, 255, 255)}.duet-button.duet-button-negative:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(255, 255, 255, 0.8)}.duet-button.destructive-primary{color:rgb(255, 255, 255) !important;background:rgb(214, 28, 82);border-color:rgb(214, 28, 82)}.duet-button.destructive-primary:hover{background:#ab1642;border-color:#ab1642;box-shadow:0 4px 20px 0 rgba(34, 34, 34, 0.1)}.duet-button.destructive,.duet-button.destructive-secondary{color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255);border-color:rgb(214, 28, 82)}.duet-button.destructive:hover,.duet-button.destructive-secondary:hover{color:rgb(255, 255, 255) !important;background:#ab1642;border-color:#ab1642}.duet-button.plain{min-width:48px;padding-right:0 !important;padding-left:0 !important;line-height:1.5;text-align:left;background:transparent;border:0;border-color:transparent;border-radius:4px}.duet-button.plain.duet-p-0 .duet-button-contents{height:auto}.duet-button.plain[disabled],.duet-button.plain[disabled]:hover{color:rgb(98, 121, 138) !important;cursor:not-allowed;background:transparent !important;border-color:transparent !important}.duet-button.plain:hover{color:rgb(0, 75, 129) !important;background:transparent !important}.duet-button.plain.duet-button-negative{color:rgb(255, 255, 255) !important}.duet-button.plain.duet-button-negative:hover{color:rgba(255, 255, 255, 0.8) !important}.duet-button.plain.duet-button-icon-only:focus{outline-offset:1px}.duet-button.duet-button-icon-only{min-width:48px;min-height:48px;padding:0 !important}.duet-button.duet-button-icon-only .duet-button-contents{position:static}.duet-button.duet-button-icon-only .duet-button-icon.left.large,.duet-button.duet-button-icon-only .duet-button-icon.left.medium,.duet-button.duet-button-icon-only .duet-button-icon.left.small{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}.duet-button.duet-button.input-button-primary,.duet-button.duet-button.input-button-secondary,.duet-button.duet-button.input-button-embedded,.duet-button.duet-button.input-button-left-primary,.duet-button.duet-button.input-button-left-secondary{box-sizing:content-box;min-width:48px;min-height:48px;padding:0 !important;border-width:1px}.duet-button.duet-button.input-button-primary .duet-button-contents,.duet-button.duet-button.input-button-secondary .duet-button-contents,.duet-button.duet-button.input-button-embedded .duet-button-contents,.duet-button.duet-button.input-button-left-primary .duet-button-contents,.duet-button.duet-button.input-button-left-secondary .duet-button-contents{position:static}.duet-button.duet-button.input-button-primary .duet-button-contents.icon-right,.duet-button.duet-button.input-button-secondary .duet-button-contents.icon-right,.duet-button.duet-button.input-button-embedded .duet-button-contents.icon-right,.duet-button.duet-button.input-button-left-primary .duet-button-contents.icon-right,.duet-button.duet-button.input-button-left-secondary .duet-button-contents.icon-right{padding:0 16px}.duet-button.duet-button.input-button-primary,.duet-button.duet-button.input-button-secondary,.duet-button.duet-button.input-button-embedded{border-top-left-radius:0;border-top-right-radius:4px !important;border-bottom-right-radius:4px !important;border-bottom-left-radius:0}.duet-button.duet-button.input-button-primary .duet-button-icon.left.large,.duet-button.duet-button.input-button-primary .duet-button-icon.left.medium,.duet-button.duet-button.input-button-primary .duet-button-icon.left.small,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.large,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.medium,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.small,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.large,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.medium,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.small{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}.duet-button.duet-button.input-button-embedded{border-left-width:0}.duet-button.duet-button.input-button-left-primary,.duet-button.duet-button.input-button-left-secondary{border-top-left-radius:4px !important;border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:4px !important}.duet-button.duet-button.input-button-left-primary .duet-button-contents,.duet-button.duet-button.input-button-left-secondary .duet-button-contents{position:static}.duet-button.duet-button.input-button-secondary,.duet-button.duet-button.input-button-left-secondary{border-color:rgb(127, 150, 165)}.duet-button.square{width:52px;min-width:auto !important;padding:0 !important;font-size:1rem;border-color:rgb(181, 198, 208);border-width:1px}.duet-button.square.duet-button-size-small{width:42px;font-size:0.875rem}.duet-button.square.duet-button-size-x-small{width:34px;font-size:0.875rem}.duet-button.square.duet-button-negative{color:rgb(255, 255, 255) !important;background:rgb(0, 119, 179);border-color:rgb(0, 119, 179)}.duet-button.square:hover{outline:2px solid rgb(0, 119, 179);outline-offset:-2px;border-color:rgb(0, 119, 179)}.duet-button.square .duet-button-contents{gap:0}.duet-button[disabled],.duet-button[disabled]:hover,.duet-button.duet-button-negative[disabled],.duet-button.duet-button-negative[disabled]:hover{color:rgb(98, 121, 138) !important;cursor:not-allowed;outline:none !important;outline-color:rgb(212, 223, 229) !important;outline-color:rgb(212, 223, 229) !important;background:rgb(212, 223, 229) !important;border-color:rgb(212, 223, 229) !important;box-shadow:none !important}.duet-button-is-loading.primary,.duet-button-is-loading.input-button-primary{color:rgb(255, 255, 255)}.duet-button-is-loading.default{color:rgb(0, 119, 179)}.duet-button-is-loading .duet-button-contents{visibility:hidden;opacity:0}.duet-theme-turva .duet-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:rgb(230, 23, 64) !important;border-radius:8px}.duet-theme-turva .duet-button.duet-button-size-medium{padding-right:24px;padding-left:24px;border-radius:8px}.duet-theme-turva .duet-button.duet-button-size-medium.icon-left{padding-left:14px}.duet-theme-turva .duet-button.duet-button-size-medium.icon-right{padding-right:14px}.duet-theme-turva .duet-button.duet-button-size-small{padding-right:18px;padding-left:18px;border-radius:8px}.duet-theme-turva .duet-button.duet-button-size-small.icon-left{padding-left:18px}.duet-theme-turva .duet-button.duet-button-size-small.icon-right{padding-right:18px}.duet-theme-turva .duet-button.default{color:rgb(230, 23, 64) !important;border-color:rgb(178, 194, 205)}.duet-theme-turva .duet-button.default:hover{outline-color:rgb(230, 23, 64);border-color:rgb(230, 23, 64)}.duet-theme-turva .duet-button.default.duet-button-negative{background-color:rgb(251, 225, 209) !important}.duet-theme-turva .duet-button.default.duet-button-negative:hover{color:rgb(230, 23, 64) !important;border-color:rgb(230, 23, 64)}.duet-theme-turva .duet-button.primary,.duet-theme-turva .duet-button.input-button-primary,.duet-theme-turva .duet-button.input-button-left-primary{color:rgb(255, 255, 255) !important;background:rgb(230, 23, 64);border-color:rgb(230, 23, 64)}.duet-theme-turva .duet-button.primary:hover,.duet-theme-turva .duet-button.input-button-primary:hover,.duet-theme-turva .duet-button.input-button-left-primary:hover{background:rgb(140, 0, 30);border-color:rgb(140, 0, 30)}.duet-theme-turva .duet-button.secondary,.duet-theme-turva .duet-button.input-button-secondary,.duet-theme-turva .duet-button.input-button-left-secondary,.duet-theme-turva .duet-button.input-button-embedded{color:rgb(23, 42, 59) !important;border-color:rgb(23, 42, 59)}.duet-theme-turva .duet-button.secondary:hover,.duet-theme-turva .duet-button.input-button-secondary:hover,.duet-theme-turva .duet-button.input-button-left-secondary:hover,.duet-theme-turva .duet-button.input-button-embedded:hover{color:rgb(230, 23, 64) !important;border-color:rgb(230, 23, 64)}.duet-theme-turva .duet-button.secondary.duet-button-negative,.duet-theme-turva .duet-button.input-button-secondary.duet-button-negative,.duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative,.duet-theme-turva .duet-button.input-button-embedded.duet-button-negative{color:rgb(251, 225, 209) !important}.duet-theme-turva .duet-button.secondary.duet-button-negative:hover,.duet-theme-turva .duet-button.input-button-secondary.duet-button-negative:hover,.duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative:hover,.duet-theme-turva .duet-button.input-button-embedded.duet-button-negative:hover{color:rgb(230, 23, 64) !important;border-color:rgb(230, 23, 64)}.duet-theme-turva .duet-button.duet-button.input-button-primary,.duet-theme-turva .duet-button.duet-button.input-button-secondary,.duet-theme-turva .duet-button.duet-button.input-button-embedded{border-top-left-radius:0;border-bottom-left-radius:0}.duet-theme-turva .duet-button.duet-button.input-button-left-primary,.duet-theme-turva .duet-button.duet-button.input-button-left-secondary{border-top-right-radius:0;border-bottom-right-radius:0}.duet-theme-turva .duet-button.duet-button.input-button-secondary,.duet-theme-turva .duet-button.duet-button.input-button-left-secondary{border-color:rgb(120, 145, 164)}.duet-theme-turva .duet-button.negative{color:rgb(23, 42, 59) !important}.duet-theme-turva .duet-button.negative:hover{color:rgb(255, 255, 255) !important}.duet-theme-turva .duet-button.destructive-primary{color:rgb(255, 255, 255) !important;background:rgb(214, 28, 82);border-color:rgb(214, 28, 82)}.duet-theme-turva .duet-button.destructive-primary:hover{background:#ab1642}.duet-theme-turva .duet-button.destructive,.duet-theme-turva .duet-button.destructive-secondary{color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255);border-color:rgb(214, 28, 82)}.duet-theme-turva .duet-button.destructive:hover,.duet-theme-turva .duet-button.destructive-secondary:hover{color:rgb(255, 255, 255) !important;background:#ab1642;border-color:#ab1642}.duet-theme-turva .duet-button.plain{color:rgb(230, 23, 64) !important;background:transparent;border-color:transparent}.duet-theme-turva .duet-button.plain.duet-button-negative{color:rgb(255, 255, 255) !important}.duet-theme-turva .duet-button.plain:hover{color:rgb(140, 0, 30) !important}.duet-theme-turva .duet-button.plain[disabled],.duet-theme-turva .duet-button.plain[disabled]:hover{color:rgb(95, 122, 143) !important;cursor:not-allowed;background:transparent !important;border-color:rgb(251, 225, 209) !important}.duet-theme-turva .duet-button.square{border-color:rgb(212, 221, 226)}.duet-theme-turva .duet-button.square.duet-button-negative{color:rgb(255, 255, 255) !important;background:rgb(230, 23, 64);border-color:rgb(230, 23, 64)}.duet-theme-turva .duet-button.square:hover{outline-color:rgb(230, 23, 64);border-color:rgb(230, 23, 64)}.duet-theme-turva .duet-button[disabled],.duet-theme-turva .duet-button[disabled]:hover,.duet-theme-turva .duet-button.duet-button-negative [disabled],.duet-theme-turva .duet-button.duet-button-negative [disabled]:hover{color:rgb(120, 145, 164) !important;cursor:not-allowed;outline-color:rgb(212, 221, 226) !important;background:rgb(212, 221, 226) !important;border-color:rgb(212, 221, 226) !important}.duet-theme-turva .duet-button-is-loading.default{color:rgb(230, 23, 64)}";
|
|
5644
|
+
const duetButtonCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;margin-right:8px !important;margin-bottom:12px !important;position:relative;z-index:1;display:inline-flex;width:auto;max-width:100%;font-size:0;vertical-align:bottom;-webkit-tap-highlight-color:transparent}:host:last-child,:host:last-of-type{margin-right:0 !important}[alignment=form-distribute]>:host:last-of-type:not(:last-child){margin-right:8px !important}@media (max-width: 35.9375em){:host{width:100%}}:host(.square){margin-right:12px !important}:host(.square):last-child,:host(.square):last-of-type{margin-right:0 !important}[alignment=form-distribute]>:host(.square):last-of-type:not(:last-child){margin-right:12px !important}:host(.input-button){z-index:250}:host(.duet-small),:host(.duet-x-small){margin-right:4px !important;margin-bottom:8px !important}:host(.duet-small):last-child,:host(.duet-small):last-of-type,:host(.duet-x-small):last-child,:host(.duet-x-small):last-of-type{margin-right:0 !important}[alignment=form-distribute]>:host(.duet-small):last-of-type:not(:last-child),[alignment=form-distribute]>:host(.duet-x-small):last-of-type:not(:last-child){margin-right:4px !important}@media (max-width: 35.9375em){:host(.duet-small),:host(.duet-x-small){width:auto}}:host(.duet-x-small){margin-right:2px !important}:host(.duet-x-small):last-child,:host(.duet-x-small):last-of-type{margin-right:0 !important}[alignment=form-distribute]>:host(.duet-x-small):last-of-type:not(:last-child){margin-right:2px !important}:host(.square.duet-small),:host(.square.duet-x-small){margin-right:8px !important}:host(.square.duet-small):last-child,:host(.square.duet-small):last-of-type,:host(.square.duet-x-small):last-child,:host(.square.duet-x-small):last-of-type{margin-right:0 !important}[alignment=form-distribute]>:host(.square.duet-small):last-of-type:not(:last-child),[alignment=form-distribute]>:host(.square.duet-x-small):last-of-type:not(:last-child){margin-right:8px !important}:host(.duet-expand){width:100% !important}:host(.duet-m-0){margin:0 !important}:host(.duet-fixed){width:auto !important}:host(:last-child){margin-right:0 !important}.duet-button-container{position:relative;display:block;width:100%}.duet-button{-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:flex;align-items:center;width:100%;min-width:8rem;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:rgb(0, 119, 179) !important;text-align:center;text-decoration:none;cursor:pointer;background:transparent;border-style:solid;border-width:1px;transition:background-color 300ms ease, color 300ms ease, border 300ms ease, padding 300ms ease, box-shadow 300ms ease}.duet-button.duet-p-0{padding:0 !important}.duet-button.duet-m-0{margin:0 !important}.duet-button:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-button:focus,.duet-button:focus.duet-theme-turva{outline:2px solid;outline-offset:2px;outline-color:rgba(53, 79, 101, 0.8)}.duet-button.duet-button-size-medium{height:50px;padding-right:30px;padding-left:30px;font-size:1rem;border-radius:25px}.duet-button.duet-button-size-medium.square{border-radius:12.5px}.duet-button.duet-button-size-medium.icon-left{padding-left:24px}.duet-button.duet-button-size-medium.icon-right{padding-right:24px}.duet-button.duet-button-size-small{height:40px;padding-right:20px;padding-left:20px;font-size:0.875rem;border-radius:20px}.duet-button.duet-button-size-small.square{border-radius:10px}.duet-button.duet-button-size-small.icon-left{padding-left:18px}.duet-button.duet-button-size-small.icon-right{padding-right:18px}.duet-button.duet-button-size-x-small{height:32px;padding-right:12px;padding-left:12px;font-size:0.75rem;border-radius:8px}.duet-button.duet-button-size-x-small.icon-left{padding-left:10px}.duet-button.duet-button-size-x-small.icon-right{padding-right:10px}.duet-button.plain.duet-p-0{height:auto}.duet-button:not(.input-button-primary,.input-button-secondary,.input-button-embedded){font-variant-numeric:tabular-nums}.duet-button.duet-button-text-center{text-align:center !important}.duet-button.duet-button-is-small:not(.duet-button-icon-only){min-width:48px}.duet-button.duet-button-is-small:not(.duet-button-icon-only).plain{padding-right:0 !important;padding-left:0 !important}.duet-button.duet-button-is-small:not(.duet-button-icon-only).duet-p-0{padding:0 !important}.duet-button .duet-button-contents{position:relative;display:flex;gap:10px;align-items:center;margin:0 auto;pointer-events:none}.duet-button .duet-button-contents.icon-right{flex-direction:row-reverse}.duet-button .duet-button-contents .duet-button-contents-slot{position:relative;top:0}.duet-button.duet-no-wrap{white-space:nowrap}.duet-button svg{width:100%;min-width:100%;fill:currentColor}.duet-button .duet-button-icon{display:flex;align-items:center}.duet-button .duet-button-icon duet-icon{width:16px;height:16px}.duet-button .duet-button-icon.large duet-icon{width:20px;height:20px}.duet-button .duet-button-icon.medium-small duet-icon{width:10px;height:10px}.duet-button .duet-button-icon.small duet-icon{width:7px;height:7px}.duet-button:active:not([disabled]){opacity:0.75;transition:none}.duet-button.default{background:rgb(255, 255, 255);border-color:rgb(181, 198, 208)}.duet-button.default:hover{outline:2px solid rgb(0, 119, 179);outline-offset:-2px;border-color:rgb(0, 119, 179)}.duet-button.default.duet-button-negative{background-color:rgb(255, 255, 255)}.duet-button.default.duet-button-negative:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}.duet-button.primary,.duet-button.input-button-primary,.duet-button.input-button-left-primary{color:rgb(255, 255, 255) !important;background:rgb(0, 119, 179);border-color:rgb(0, 119, 179)}.duet-button.primary:hover,.duet-button.input-button-primary:hover,.duet-button.input-button-left-primary:hover{background:#005f8f;border-color:#005f8f;box-shadow:0 4px 20px 0 rgba(34, 34, 34, 0.1)}.duet-button.secondary,.duet-button.input-button-secondary,.duet-button.input-button-left-secondary,.duet-button.input-button-embedded{color:rgb(8, 42, 77) !important;background:transparent;border-color:rgb(8, 42, 77)}.duet-button.secondary:hover,.duet-button.input-button-secondary:hover,.duet-button.input-button-left-secondary:hover,.duet-button.input-button-embedded:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179);outline:2px solid;outline-color:rgb(127, 150, 165) !important;outline-offset:-1px}.duet-theme-turva .duet-button.secondary:hover,.duet-button.secondary:hover.duet-theme-turva,.duet-theme-turva .duet-button.input-button-secondary:hover,.duet-button.input-button-secondary:hover.duet-theme-turva,.duet-theme-turva .duet-button.input-button-left-secondary:hover,.duet-button.input-button-left-secondary:hover.duet-theme-turva,.duet-theme-turva .duet-button.input-button-embedded:hover,.duet-button.input-button-embedded:hover.duet-theme-turva{outline-color:rgb(120, 145, 164) !important}.duet-button.secondary.duet-button-negative,.duet-button.input-button-secondary.duet-button-negative,.duet-button.input-button-left-secondary.duet-button-negative,.duet-button.input-button-embedded.duet-button-negative{color:rgb(212, 223, 229) !important;border-color:rgb(255, 255, 255)}.duet-button.secondary.duet-button-negative:hover,.duet-button.input-button-secondary.duet-button-negative:hover,.duet-button.input-button-left-secondary.duet-button-negative:hover,.duet-button.input-button-embedded.duet-button-negative:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}.duet-button.input-button-embedded{width:40px;min-width:40px !important;min-height:40px !important;margin:4px !important;border-width:0 !important;border-radius:4px !important}.duet-button.input-button{height:auto}.duet-button.negative{color:rgb(8, 42, 77) !important;background:rgb(255, 255, 255);border-color:rgb(255, 255, 255)}.duet-button.negative:hover{color:rgb(255, 255, 255) !important;background:transparent;border-color:rgb(255, 255, 255)}.duet-button.duet-button-negative:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(255, 255, 255, 0.8)}.duet-button.destructive-primary{color:rgb(255, 255, 255) !important;background:rgb(214, 28, 82);border-color:rgb(214, 28, 82)}.duet-button.destructive-primary:hover{background:#ab1642;border-color:#ab1642;box-shadow:0 4px 20px 0 rgba(34, 34, 34, 0.1)}.duet-button.destructive,.duet-button.destructive-secondary{color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255);border-color:rgb(214, 28, 82)}.duet-button.destructive:hover,.duet-button.destructive-secondary:hover{color:rgb(255, 255, 255) !important;background:#ab1642;border-color:#ab1642}.duet-button.plain{min-width:48px;padding-right:0 !important;padding-left:0 !important;line-height:1.5;text-align:left;background:transparent;border:0;border-color:transparent;border-radius:4px}.duet-button.plain.duet-p-0 .duet-button-contents{height:auto}.duet-button.plain[disabled],.duet-button.plain[disabled]:hover{color:rgb(98, 121, 138) !important;cursor:not-allowed;background:transparent !important;border-color:transparent !important}.duet-button.plain:hover{color:rgb(0, 75, 129) !important;background:transparent !important}.duet-button.plain.duet-button-negative{color:rgb(255, 255, 255) !important}.duet-button.plain.duet-button-negative:hover{color:rgba(255, 255, 255, 0.8) !important}.duet-button.plain.duet-button-icon-only:focus{outline-offset:1px}.duet-button.duet-button-icon-only{min-width:48px;min-height:48px;padding:0 !important}.duet-button.duet-button-icon-only .duet-button-contents{position:static}.duet-button.duet-button-icon-only .duet-button-icon.left.large,.duet-button.duet-button-icon-only .duet-button-icon.left.medium,.duet-button.duet-button-icon-only .duet-button-icon.left.small{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}.duet-button.duet-button.input-button-primary,.duet-button.duet-button.input-button-secondary,.duet-button.duet-button.input-button-embedded,.duet-button.duet-button.input-button-left-primary,.duet-button.duet-button.input-button-left-secondary{box-sizing:content-box;min-width:48px;min-height:48px;padding:0 !important;border-width:1px}.duet-button.duet-button.input-button-primary .duet-button-contents,.duet-button.duet-button.input-button-secondary .duet-button-contents,.duet-button.duet-button.input-button-embedded .duet-button-contents,.duet-button.duet-button.input-button-left-primary .duet-button-contents,.duet-button.duet-button.input-button-left-secondary .duet-button-contents{position:static}.duet-button.duet-button.input-button-primary .duet-button-contents.icon-right,.duet-button.duet-button.input-button-secondary .duet-button-contents.icon-right,.duet-button.duet-button.input-button-embedded .duet-button-contents.icon-right,.duet-button.duet-button.input-button-left-primary .duet-button-contents.icon-right,.duet-button.duet-button.input-button-left-secondary .duet-button-contents.icon-right{padding:0 16px}.duet-button.duet-button.input-button-primary,.duet-button.duet-button.input-button-secondary,.duet-button.duet-button.input-button-embedded{border-top-left-radius:0;border-top-right-radius:4px !important;border-bottom-right-radius:4px !important;border-bottom-left-radius:0}.duet-button.duet-button.input-button-primary .duet-button-icon.left.large,.duet-button.duet-button.input-button-primary .duet-button-icon.left.medium,.duet-button.duet-button.input-button-primary .duet-button-icon.left.small,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.large,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.medium,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.small,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.large,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.medium,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.small{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}.duet-button.duet-button.input-button-embedded{border-left-width:0}.duet-button.duet-button.input-button-left-primary,.duet-button.duet-button.input-button-left-secondary{border-top-left-radius:4px !important;border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:4px !important}.duet-button.duet-button.input-button-left-primary .duet-button-contents,.duet-button.duet-button.input-button-left-secondary .duet-button-contents{position:static}.duet-button.duet-button.input-button-secondary,.duet-button.duet-button.input-button-left-secondary{border-color:rgb(127, 150, 165)}.duet-button.square{width:52px;min-width:auto !important;padding:0 !important;font-size:1rem;border-color:rgb(181, 198, 208);border-width:1px}.duet-button.square.duet-button-size-small{width:42px;font-size:0.875rem}.duet-button.square.duet-button-size-x-small{width:34px;font-size:0.875rem}.duet-button.square.duet-button-negative{color:rgb(255, 255, 255) !important;background:rgb(0, 119, 179);border-color:rgb(0, 119, 179)}.duet-button.square:hover{outline:2px solid rgb(0, 119, 179);outline-offset:-2px;border-color:rgb(0, 119, 179)}.duet-button.square .duet-button-contents{gap:0}.duet-button[disabled],.duet-button[disabled]:hover,.duet-button.duet-button-negative[disabled],.duet-button.duet-button-negative[disabled]:hover{color:rgb(98, 121, 138) !important;cursor:not-allowed;outline:none !important;outline-color:rgb(212, 223, 229) !important;outline-color:rgb(212, 223, 229) !important;background:rgb(212, 223, 229) !important;border-color:rgb(212, 223, 229) !important;box-shadow:none !important}.duet-button-is-loading.primary,.duet-button-is-loading.input-button-primary{color:rgb(255, 255, 255)}.duet-button-is-loading.default{color:rgb(0, 119, 179)}.duet-button-is-loading .duet-button-contents{visibility:hidden;opacity:0}.duet-theme-turva .duet-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:rgb(230, 23, 64) !important;border-radius:8px}.duet-theme-turva .duet-button.duet-button-size-medium{padding-right:24px;padding-left:24px;border-radius:8px}.duet-theme-turva .duet-button.duet-button-size-medium.icon-left{padding-left:14px}.duet-theme-turva .duet-button.duet-button-size-medium.icon-right{padding-right:14px}.duet-theme-turva .duet-button.duet-button-size-small{padding-right:18px;padding-left:18px;border-radius:8px}.duet-theme-turva .duet-button.duet-button-size-small.icon-left{padding-left:18px}.duet-theme-turva .duet-button.duet-button-size-small.icon-right{padding-right:18px}.duet-theme-turva .duet-button.default{color:rgb(230, 23, 64) !important;border-color:rgb(178, 194, 205)}.duet-theme-turva .duet-button.default:hover{outline-color:rgb(230, 23, 64);border-color:rgb(230, 23, 64)}.duet-theme-turva .duet-button.default.duet-button-negative{background-color:rgb(251, 225, 209) !important}.duet-theme-turva .duet-button.default.duet-button-negative:hover{color:rgb(230, 23, 64) !important;border-color:rgb(230, 23, 64)}.duet-theme-turva .duet-button.primary,.duet-theme-turva .duet-button.input-button-primary,.duet-theme-turva .duet-button.input-button-left-primary{color:rgb(255, 255, 255) !important;background:rgb(230, 23, 64);border-color:rgb(230, 23, 64)}.duet-theme-turva .duet-button.primary:hover,.duet-theme-turva .duet-button.input-button-primary:hover,.duet-theme-turva .duet-button.input-button-left-primary:hover{background:rgb(140, 0, 30);border-color:rgb(140, 0, 30)}.duet-theme-turva .duet-button.secondary,.duet-theme-turva .duet-button.input-button-secondary,.duet-theme-turva .duet-button.input-button-left-secondary,.duet-theme-turva .duet-button.input-button-embedded{color:rgb(23, 42, 59) !important;border-color:rgb(23, 42, 59)}.duet-theme-turva .duet-button.secondary:hover,.duet-theme-turva .duet-button.input-button-secondary:hover,.duet-theme-turva .duet-button.input-button-left-secondary:hover,.duet-theme-turva .duet-button.input-button-embedded:hover{color:rgb(230, 23, 64) !important;border-color:rgb(230, 23, 64)}.duet-theme-turva .duet-button.secondary.duet-button-negative,.duet-theme-turva .duet-button.input-button-secondary.duet-button-negative,.duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative,.duet-theme-turva .duet-button.input-button-embedded.duet-button-negative{color:rgb(251, 225, 209) !important}.duet-theme-turva .duet-button.secondary.duet-button-negative:hover,.duet-theme-turva .duet-button.input-button-secondary.duet-button-negative:hover,.duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative:hover,.duet-theme-turva .duet-button.input-button-embedded.duet-button-negative:hover{color:rgb(230, 23, 64) !important;border-color:rgb(230, 23, 64)}.duet-theme-turva .duet-button.duet-button.input-button-primary,.duet-theme-turva .duet-button.duet-button.input-button-secondary,.duet-theme-turva .duet-button.duet-button.input-button-embedded{border-top-left-radius:0;border-bottom-left-radius:0}.duet-theme-turva .duet-button.duet-button.input-button-left-primary,.duet-theme-turva .duet-button.duet-button.input-button-left-secondary{border-top-right-radius:0;border-bottom-right-radius:0}.duet-theme-turva .duet-button.duet-button.input-button-secondary,.duet-theme-turva .duet-button.duet-button.input-button-left-secondary{border-color:rgb(120, 145, 164)}.duet-theme-turva .duet-button.negative{color:rgb(23, 42, 59) !important}.duet-theme-turva .duet-button.negative:hover{color:rgb(255, 255, 255) !important}.duet-theme-turva .duet-button.destructive-primary{color:rgb(255, 255, 255) !important;background:rgb(214, 28, 82);border-color:rgb(214, 28, 82)}.duet-theme-turva .duet-button.destructive-primary:hover{background:#ab1642}.duet-theme-turva .duet-button.destructive,.duet-theme-turva .duet-button.destructive-secondary{color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255);border-color:rgb(214, 28, 82)}.duet-theme-turva .duet-button.destructive:hover,.duet-theme-turva .duet-button.destructive-secondary:hover{color:rgb(255, 255, 255) !important;background:#ab1642;border-color:#ab1642}.duet-theme-turva .duet-button.plain{color:rgb(230, 23, 64) !important;background:transparent;border-color:transparent}.duet-theme-turva .duet-button.plain.duet-button-negative{color:rgb(255, 255, 255) !important}.duet-theme-turva .duet-button.plain.duet-button-negative:hover{color:rgba(255, 255, 255, 0.8) !important}.duet-theme-turva .duet-button.plain:hover{color:rgb(140, 0, 30) !important}.duet-theme-turva .duet-button.plain[disabled],.duet-theme-turva .duet-button.plain[disabled]:hover{color:rgb(95, 122, 143) !important;cursor:not-allowed;background:transparent !important;border-color:rgb(251, 225, 209) !important}.duet-theme-turva .duet-button.square{border-color:rgb(212, 221, 226)}.duet-theme-turva .duet-button.square.duet-button-negative{color:rgb(255, 255, 255) !important;background:rgb(230, 23, 64);border-color:rgb(230, 23, 64)}.duet-theme-turva .duet-button.square:hover{outline-color:rgb(230, 23, 64);border-color:rgb(230, 23, 64)}.duet-theme-turva .duet-button[disabled],.duet-theme-turva .duet-button[disabled]:hover,.duet-theme-turva .duet-button.duet-button-negative [disabled],.duet-theme-turva .duet-button.duet-button-negative [disabled]:hover{color:rgb(120, 145, 164) !important;cursor:not-allowed;outline-color:rgb(212, 221, 226) !important;background:rgb(212, 221, 226) !important;border-color:rgb(212, 221, 226) !important}.duet-theme-turva .duet-button-is-loading.default{color:rgb(230, 23, 64)}";
|
|
5639
5645
|
|
|
5640
5646
|
class DuetButton {
|
|
5641
5647
|
constructor(hostRef) {
|
|
@@ -6052,11 +6058,11 @@ class DuetCallout {
|
|
|
6052
6058
|
<path d="M6.6591 0.557547L9.2031 2.33355C7.0911 5.21355 6.1311 7.18155 5.8431 8.90955C7.4751 9.34155 8.7231 10.5415 8.7231 12.6535C8.7231 15.2935 6.9471 16.9255 4.6431 16.9255C2.0511 16.9255 0.227096 15.1975 0.227096 12.2695C0.227096 8.28555 2.3871 4.34955 6.6591 0.557547ZM17.9871 8.95755C19.6191 9.34155 20.8671 10.5415 20.8671 12.6535C20.8671 15.2935 19.1391 16.9255 16.8351 16.9255C14.2431 16.9255 12.4191 15.1975 12.4191 12.2695C12.4191 8.28555 14.5791 4.34955 18.8511 0.557547L21.3951 2.33355C19.2351 5.21355 18.3231 7.18155 17.9871 8.95755Z"/>
|
|
6053
6059
|
</svg>
|
|
6054
6060
|
`;
|
|
6055
|
-
return (hAsync(Host, { key: '
|
|
6061
|
+
return (hAsync(Host, { key: '7c2142db52608760dec767f79a7bca3447a7cd5f' }, hAsync("div", { key: 'f8198db62bb29ce33d65fc3c3cc3e32f87de2c5c', class: {
|
|
6056
6062
|
"duet-callout": true,
|
|
6057
6063
|
"duet-theme-turva": this.theme === "turva",
|
|
6058
6064
|
"duet-m-0": this.margin === "none",
|
|
6059
|
-
} }, hAsync("figure", { key: '
|
|
6065
|
+
} }, hAsync("figure", { key: 'e994ff471b5559524635c85974669c8057658363', class: "container" }, hAsync("duet-icon", { key: '88762cb245c8695ac5a4e6e964429055b7256fa5', class: "callout-icon", shape: "brand-rotated", background: "primary-lighter", "background-opacity": "0.75", "background-rotation": this.theme === "turva" ? "0" : "7", color: "secondary", icon: icon, size: "auto", margin: "none", theme: this.theme }), hAsync("blockquote", { key: '4b39bc138213d594a5eb81c9f0fe50e49342c626' }, hAsync("slot", { key: 'fc14d22469315c162b71aa1b3bf09c8bcd0e1901' })), this.hasAuthorSlot && (hAsync("figcaption", { key: 'b8fc8be9af52e97966a8ae61ad5ab3f88e7e8aa0', class: "author" }, hAsync("span", { key: 'e0ca2034da2119ef9b5c6b9ddf004f46706a59fe' }, "\u2014 "), hAsync("slot", { key: '6224eae7686973960ea35086635e3dbeeaa8e944', name: "author" })))))));
|
|
6060
6066
|
}
|
|
6061
6067
|
get element() { return getElement(this); }
|
|
6062
6068
|
static get style() { return duetCalloutCss; }
|
|
@@ -6144,7 +6150,7 @@ function requireActionArrowUp () {
|
|
|
6144
6150
|
var actionArrowUpExports = requireActionArrowUp();
|
|
6145
6151
|
var arrowUpIcon = /*@__PURE__*/getDefaultExportFromCjs(actionArrowUpExports);
|
|
6146
6152
|
|
|
6147
|
-
const duetCardCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;margin-bottom:20px !important;display:flex;width:100%;vertical-align:top}:host(.duet-card-info){margin-bottom:16px !important}:host(.duet-m-0){margin:0 !important}:host{--duet-card-border-radius:12px}@media (min-width: 36em){:host{--duet-card-border-radius:16px}}.duet-card{padding:20px !important;position:relative;display:flex;flex-direction:column;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-style:normal;font-weight:400;line-height:1.5;color:rgb(8, 42, 77);text-decoration:none;border-radius:var(--duet-card-border-radius);box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07)}.duet-card.duet-p-0{padding:0 !important}.duet-card.duet-m-0{margin:0 !important}.duet-card:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-card:focus,.duet-card:focus.duet-theme-turva{outline:2px solid;outline-offset:2px;outline-color:rgba(53, 79, 101, 0.8)}@media (max-width: 20.5em){.duet-card.shadow-xxx-small{box-shadow:none}}@media (max-width: 22.5em){.duet-card.shadow-xx-small{box-shadow:none}}@media (max-width: 35.9375em){.duet-card.shadow-x-small{box-shadow:none}}@media (min-width: 36em){.duet-card.shadow-small{box-shadow:none}}@media (min-width: 48em){.duet-card.shadow-medium{box-shadow:none}}@media (min-width: 62em){.duet-card.shadow-large{box-shadow:none}}@media (min-width: 64.0625em){.duet-card.shadow-x-large{box-shadow:none}}@media (min-width: 76.25em){.duet-card.shadow-xx-large{box-shadow:none}}@media (min-width: 106.25em){.duet-card.shadow-xxx-large{box-shadow:none}}@media (min-width: 36em){.duet-card{padding:28px !important}}@media (min-width: 36em){.duet-card.xx-small{padding:12px !important}}@media (min-width: 36em){.duet-card.x-small{padding:20px !important}}@media (min-width: 36em){.duet-card.medium{padding:28px !important}}@media (min-width: 48em){.duet-card.medium{padding:36px !important}}@media (min-width: 36em){.duet-card.large{padding:36px !important}}@media (min-width: 48em){.duet-card.large{padding:48px !important}}@media (min-width: 36em){.duet-card.x-large{padding:48px !important}}@media (min-width: 48em){.duet-card.x-large{padding:72px !important}}.duet-card.duet-card-collapsed{padding-bottom:0 !important}@media (min-width: 36em){.duet-card.duet-card-collapsed{padding-bottom:0 !important}}.duet-card.info{background:rgba(4, 81, 128, 0.04) !important;box-shadow:none}.duet-card.plain{box-shadow:none}.duet-card.plain:not(.duet-card-has-bg){background:transparent !important}.duet-card-heading-grid{display:flex;flex-direction:row}.duet-card-icon{align-self:center}.duet-card-heading-text{flex:1;word-break:break-word}.duet-card-secondary-heading{font-size:1rem;font-weight:600;word-break:break-word}.duet-card-secondary-heading--inline{display:block;flex:1;align-self:flex-start;line-height:1.875;text-align:right}@media (max-width: 22.5em){.duet-card-secondary-heading--inline{display:none}}.duet-card-secondary-heading--new-line{display:none}@media (max-width: 22.5em){.duet-card-secondary-heading--new-line{display:block}}.duet-card-heading{position:relative;display:block;padding:16px 20px;margin:-20px -20px 20px;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:1.25rem;font-weight:800;color:rgb(8, 42, 77);border-bottom:1px solid rgb(212, 223, 229);border-radius:var(--duet-card-border-radius) var(--duet-card-border-radius) 0 0}@media (min-width: 36em){.duet-card-heading{padding:15px 28px 16px !important;margin:-28px -28px 20px}.none .duet-card-heading{padding:0 !important;margin:0}}.duet-card-collapsed .duet-card-heading{border-radius:var(--duet-card-border-radius)}.duet-card-image-mask+.duet-card-heading{border-radius:0}.duet-card-heading.duet-card-heading--collapsible{cursor:pointer}.duet-card-heading.duet-card-heading--collapsible button{width:100%;font-family:inherit;font-size:inherit;font-weight:inherit;color:inherit;text-align:left;cursor:pointer}.duet-card-heading.duet-card-heading--collapsible button:focus{outline:0}:host(.user-is-tabbing) .duet-card-heading.duet-card-heading--collapsible button:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva :host(.user-is-tabbing) .duet-card-heading.duet-card-heading--collapsible button:focus,:host(.user-is-tabbing) .duet-card-heading.duet-card-heading--collapsible button:focus.duet-theme-turva{outline-color:rgba(53, 79, 101, 0.8)}:host(.user-is-tabbing) .duet-card-heading.duet-card-heading--collapsible button:focus{border-radius:var(--duet-card-border-radius)}.duet-card-collapsed .duet-card-heading{margin-bottom:0 !important;border-bottom:0 !important}@media (min-width: 36em){.xx-small .duet-card-heading{padding:6px 12px 7px !important;margin:-12px -12px 12px}}@media (min-width: 48em){.xx-small .duet-card-heading{padding:6px 12px 7px !important;margin:-12px -12px 12px}}@media (min-width: 36em){.x-small .duet-card-heading{padding:10px 20px 11px !important;margin:-20px -20px 20px}}@media (min-width: 48em){.x-small .duet-card-heading{padding:10px 20px 11px !important;margin:-20px -20px 20px}}.medium .duet-card-heading{margin:-20px -20px 20px}@media (min-width: 36em){.medium .duet-card-heading{padding:15px 28px 16px !important;margin:-28px -28px 20px}}@media (min-width: 48em){.medium .duet-card-heading{padding:19px 36px 20px !important;margin:-36px -36px 28px}}.large .duet-card-heading{margin:-20px -20px 20px}@media (min-width: 36em){.large .duet-card-heading{padding:19px 36px 20px !important;margin:-36px -36px 28px}}@media (min-width: 48em){.large .duet-card-heading{padding:26px 48px 27px !important;margin:-48px -48px 36px}}.x-large .duet-card-heading{margin:-20px -20px 20px}@media (min-width: 36em){.x-large .duet-card-heading{padding:26px 48px 27px !important;margin:-48px -48px 36px}}@media (min-width: 48em){.x-large .duet-card-heading{padding:39px 72px 40px !important;margin:-72px -72px 48px}}.none .duet-card-heading{padding:0;margin:0}.duet-card-footer{padding:20px;margin:20px -20px -20px;font-size:0.875rem;line-height:1.25;background:rgb(245, 248, 250);border-bottom-right-radius:4px;border-bottom-left-radius:4px}@media (min-width: 36em){.duet-card-footer{padding:15px 28px 16px !important;margin:20px -28px -28px}}@media (min-width: 48em){.duet-card-footer{padding:15px 28px 16px !important;margin:20px -28px -28px}}@media (min-width: 36em){.xx-small .duet-card-footer{padding:10px 20px 11px !important;padding-left:12px !important;margin:12px -12px -12px}}@media (min-width: 36em){.x-small .duet-card-footer{padding:15px 28px 16px !important;padding-left:20px !important;margin:20px -20px -20px}}@media (min-width: 36em){.medium .duet-card-footer{padding:15px 28px 16px !important;margin:20px -28px -28px}}@media (min-width: 48em){.medium .duet-card-footer{padding:19px 36px 20px !important;margin:28px -36px -36px}}@media (min-width: 36em){.large .duet-card-footer{padding:19px 36px 20px !important;margin:28px -36px -36px}}@media (min-width: 48em){.large .duet-card-footer{padding:26px 48px 27px !important;margin:36px -48px -48px}}@media (min-width: 36em){.x-large .duet-card-footer{padding:26px 48px 27px !important;margin:36px -48px -48px}}@media (min-width: 48em){.x-large .duet-card-footer{padding:39px 72px 40px !important;margin:48px -72px -72px}}.none .duet-card-footer{padding:0;margin:0}.duet-card-content{flex:1 1 auto;width:100%}.duet-card-collapsed .duet-card-content{display:none}.duet-card-caret{position:relative;top:6px;align-self:flex-start;transition:300ms ease}[aria-expanded=false] .duet-card-caret{transform:rotate(-180deg)}.duet-card-image-mask{position:relative;width:calc(100% + 40px);margin:-20px 0 20px -20px;overflow:hidden;border-top-left-radius:4px;border-top-right-radius:4px}@media (min-width: 36em){.small .duet-card-image-mask{width:calc(100% + 56px);margin:-28px 0 28px -28px}}@media (min-width: 36em){.medium .duet-card-image-mask{width:calc(100% + 56px);margin:-28px 0 28px -28px}}@media (min-width: 48em){.medium .duet-card-image-mask{width:calc(100% + 72px);margin:-36px 0 28px -36px}}@media (min-width: 36em){.large .duet-card-image-mask{width:calc(100% + 72px);margin:-36px 0 36px -36px}}@media (min-width: 48em){.large .duet-card-image-mask{width:calc(100% + 96px);margin:-48px 0 36px -48px}}@media (min-width: 36em){.x-large .duet-card-image-mask{width:calc(100% + 96px);margin:-48px 0 36px -48px}}@media (min-width: 48em){.x-large .duet-card-image-mask{width:calc(100% + 144px);margin:-72px 0 36px -72px}}.none .duet-card-image-mask{width:100%;padding:0;margin:0}.duet-card-image-mask picture{display:block}.duet-card-image{display:block;width:102%;min-width:1px;max-width:102%;height:auto;min-height:1px;margin-left:-1%;transform:scale(1.0001);transition:transform 300ms ease}a.duet-card{transition:box-shadow 300ms ease, background-position 300ms ease}a.duet-card:hover{box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07), 0 2px 10px 0 rgba(0, 41, 77, 0.1)}a.duet-card:hover .duet-card-image{transform:scale(1.024)}.duet-theme-turva a.duet-card:hover{box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07), 0 2px 10px 0 rgba(117, 117, 117, 0.15)}a.duet-card:active{transform:translateY(1px);transition:none}.duet-card.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:rgb(23, 42, 59);box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07)}.duet-card.duet-theme-turva.info{background:rgb(253, 247, 242) !important}.duet-card.duet-theme-turva .duet-card-heading{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 42, 59);border-color:rgb(212, 221, 226)}.duet-card.duet-theme-turva .duet-card-footer{background:rgb(245, 246, 247)}";
|
|
6153
|
+
const duetCardCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;margin-bottom:20px !important;display:flex;width:100%;vertical-align:top}:host(.duet-card-info){margin-bottom:16px !important}:host(.duet-m-0){margin:0 !important}:host{--duet-card-border-radius:12px}@media (min-width: 36em){:host{--duet-card-border-radius:16px}}.duet-card{padding:20px !important;position:relative;display:flex;flex-direction:column;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-style:normal;font-weight:400;line-height:1.5;color:rgb(8, 42, 77);text-decoration:none;border-radius:var(--duet-card-border-radius);box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07)}.duet-card.duet-p-0{padding:0 !important}.duet-card.duet-m-0{margin:0 !important}.duet-card:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-card:focus,.duet-card:focus.duet-theme-turva{outline:2px solid;outline-offset:2px;outline-color:rgba(53, 79, 101, 0.8)}@media (max-width: 20.5em){.duet-card.shadow-xxx-small,.duet-card.duet-theme-turva.shadow-xxx-small{box-shadow:none}}@media (max-width: 22.5em){.duet-card.shadow-xx-small,.duet-card.duet-theme-turva.shadow-xx-small{box-shadow:none}}@media (max-width: 35.9375em){.duet-card.shadow-x-small,.duet-card.duet-theme-turva.shadow-x-small{box-shadow:none}}@media (min-width: 36em){.duet-card.shadow-small,.duet-card.duet-theme-turva.shadow-small{box-shadow:none}}@media (min-width: 48em){.duet-card.shadow-medium,.duet-card.duet-theme-turva.shadow-medium{box-shadow:none}}@media (min-width: 62em){.duet-card.shadow-large,.duet-card.duet-theme-turva.shadow-large{box-shadow:none}}@media (min-width: 64.0625em){.duet-card.shadow-x-large,.duet-card.duet-theme-turva.shadow-x-large{box-shadow:none}}@media (min-width: 76.25em){.duet-card.shadow-xx-large,.duet-card.duet-theme-turva.shadow-xx-large{box-shadow:none}}@media (min-width: 106.25em){.duet-card.shadow-xxx-large,.duet-card.duet-theme-turva.shadow-xxx-large{box-shadow:none}}@media (min-width: 36em){.duet-card{padding:28px !important}}@media (min-width: 36em){.duet-card.xx-small{padding:12px !important}}@media (min-width: 36em){.duet-card.x-small{padding:20px !important}}@media (min-width: 36em){.duet-card.medium{padding:28px !important}}@media (min-width: 48em){.duet-card.medium{padding:36px !important}}@media (min-width: 36em){.duet-card.large{padding:36px !important}}@media (min-width: 48em){.duet-card.large{padding:48px !important}}@media (min-width: 36em){.duet-card.x-large{padding:48px !important}}@media (min-width: 48em){.duet-card.x-large{padding:72px !important}}.duet-card.duet-card-collapsed{padding-bottom:0 !important}@media (min-width: 36em){.duet-card.duet-card-collapsed{padding-bottom:0 !important}}.duet-card.info{background:rgba(4, 81, 128, 0.04) !important;box-shadow:none}.duet-card.plain{box-shadow:none}.duet-card.plain:not(.duet-card-has-bg){background:transparent !important}.duet-card-heading-grid{display:flex;flex-direction:row}.duet-card-icon{align-self:center}.duet-card-heading-text{flex:1;word-break:break-word}.duet-card-secondary-heading{font-size:1rem;font-weight:600;word-break:break-word}.duet-card-secondary-heading--inline{display:block;flex:1;align-self:flex-start;line-height:1.875;text-align:right}@media (max-width: 22.5em){.duet-card-secondary-heading--inline{display:none}}.duet-card-secondary-heading--new-line{display:none}@media (max-width: 22.5em){.duet-card-secondary-heading--new-line{display:block}}.duet-card-heading{position:relative;display:block;padding:16px 20px;margin:-20px -20px 20px;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:1.25rem;font-weight:800;color:rgb(8, 42, 77);border-bottom:1px solid rgb(212, 223, 229);border-radius:var(--duet-card-border-radius) var(--duet-card-border-radius) 0 0}@media (min-width: 36em){.duet-card-heading{padding:15px 28px 16px !important;margin:-28px -28px 20px}.none .duet-card-heading{padding:0 !important;margin:0}}.duet-card-collapsed .duet-card-heading{border-radius:var(--duet-card-border-radius)}.duet-card-image-mask+.duet-card-heading{border-radius:0}.duet-card-heading.duet-card-heading--collapsible{cursor:pointer}.duet-card-heading.duet-card-heading--collapsible button{width:100%;font-family:inherit;font-size:inherit;font-weight:inherit;color:inherit;text-align:left;cursor:pointer}.duet-card-heading.duet-card-heading--collapsible button:focus{outline:0}:host(.user-is-tabbing) .duet-card-heading.duet-card-heading--collapsible button:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva :host(.user-is-tabbing) .duet-card-heading.duet-card-heading--collapsible button:focus,:host(.user-is-tabbing) .duet-card-heading.duet-card-heading--collapsible button:focus.duet-theme-turva{outline-color:rgba(53, 79, 101, 0.8)}:host(.user-is-tabbing) .duet-card-heading.duet-card-heading--collapsible button:focus{border-radius:var(--duet-card-border-radius)}.duet-card-collapsed .duet-card-heading{margin-bottom:0 !important;border-bottom:0 !important}@media (min-width: 36em){.xx-small .duet-card-heading{padding:6px 12px 7px !important;margin:-12px -12px 12px}}@media (min-width: 48em){.xx-small .duet-card-heading{padding:6px 12px 7px !important;margin:-12px -12px 12px}}@media (min-width: 36em){.x-small .duet-card-heading{padding:10px 20px 11px !important;margin:-20px -20px 20px}}@media (min-width: 48em){.x-small .duet-card-heading{padding:10px 20px 11px !important;margin:-20px -20px 20px}}.medium .duet-card-heading{margin:-20px -20px 20px}@media (min-width: 36em){.medium .duet-card-heading{padding:15px 28px 16px !important;margin:-28px -28px 20px}}@media (min-width: 48em){.medium .duet-card-heading{padding:19px 36px 20px !important;margin:-36px -36px 28px}}.large .duet-card-heading{margin:-20px -20px 20px}@media (min-width: 36em){.large .duet-card-heading{padding:19px 36px 20px !important;margin:-36px -36px 28px}}@media (min-width: 48em){.large .duet-card-heading{padding:26px 48px 27px !important;margin:-48px -48px 36px}}.x-large .duet-card-heading{margin:-20px -20px 20px}@media (min-width: 36em){.x-large .duet-card-heading{padding:26px 48px 27px !important;margin:-48px -48px 36px}}@media (min-width: 48em){.x-large .duet-card-heading{padding:39px 72px 40px !important;margin:-72px -72px 48px}}.none .duet-card-heading{padding:0;margin:0}.duet-card-footer{padding:20px;margin:20px -20px -20px;font-size:0.875rem;line-height:1.25;background:rgb(245, 248, 250);border-bottom-right-radius:4px;border-bottom-left-radius:4px}@media (min-width: 36em){.duet-card-footer{padding:15px 28px 16px !important;margin:20px -28px -28px}}@media (min-width: 48em){.duet-card-footer{padding:15px 28px 16px !important;margin:20px -28px -28px}}@media (min-width: 36em){.xx-small .duet-card-footer{padding:10px 20px 11px !important;padding-left:12px !important;margin:12px -12px -12px}}@media (min-width: 36em){.x-small .duet-card-footer{padding:15px 28px 16px !important;padding-left:20px !important;margin:20px -20px -20px}}@media (min-width: 36em){.medium .duet-card-footer{padding:15px 28px 16px !important;margin:20px -28px -28px}}@media (min-width: 48em){.medium .duet-card-footer{padding:19px 36px 20px !important;margin:28px -36px -36px}}@media (min-width: 36em){.large .duet-card-footer{padding:19px 36px 20px !important;margin:28px -36px -36px}}@media (min-width: 48em){.large .duet-card-footer{padding:26px 48px 27px !important;margin:36px -48px -48px}}@media (min-width: 36em){.x-large .duet-card-footer{padding:26px 48px 27px !important;margin:36px -48px -48px}}@media (min-width: 48em){.x-large .duet-card-footer{padding:39px 72px 40px !important;margin:48px -72px -72px}}.none .duet-card-footer{padding:0;margin:0}.duet-card-content{flex:1 1 auto;width:100%}.duet-card-collapsed .duet-card-content{display:none}.duet-card-caret{position:relative;top:6px;align-self:flex-start;transition:300ms ease}[aria-expanded=false] .duet-card-caret{transform:rotate(-180deg)}.duet-card-image-mask{position:relative;width:calc(100% + 40px);margin:-20px 0 20px -20px;overflow:hidden;border-top-left-radius:4px;border-top-right-radius:4px}@media (min-width: 36em){.small .duet-card-image-mask{width:calc(100% + 56px);margin:-28px 0 28px -28px}}@media (min-width: 36em){.medium .duet-card-image-mask{width:calc(100% + 56px);margin:-28px 0 28px -28px}}@media (min-width: 48em){.medium .duet-card-image-mask{width:calc(100% + 72px);margin:-36px 0 28px -36px}}@media (min-width: 36em){.large .duet-card-image-mask{width:calc(100% + 72px);margin:-36px 0 36px -36px}}@media (min-width: 48em){.large .duet-card-image-mask{width:calc(100% + 96px);margin:-48px 0 36px -48px}}@media (min-width: 36em){.x-large .duet-card-image-mask{width:calc(100% + 96px);margin:-48px 0 36px -48px}}@media (min-width: 48em){.x-large .duet-card-image-mask{width:calc(100% + 144px);margin:-72px 0 36px -72px}}.none .duet-card-image-mask{width:100%;padding:0;margin:0}.duet-card-image-mask picture{display:block}.duet-card-image{display:block;width:102%;min-width:1px;max-width:102%;height:auto;min-height:1px;margin-left:-1%;transform:scale(1.0001);transition:transform 300ms ease}a.duet-card{transition:box-shadow 300ms ease, background-position 300ms ease}a.duet-card:hover{box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07), 0 2px 10px 0 rgba(0, 41, 77, 0.1)}a.duet-card:hover .duet-card-image{transform:scale(1.024)}.duet-theme-turva a.duet-card:hover{box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07), 0 2px 10px 0 rgba(117, 117, 117, 0.15)}a.duet-card:active{transform:translateY(1px);transition:none}.duet-card.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:rgb(23, 42, 59);box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07)}.duet-card.duet-theme-turva.info{background:rgb(253, 247, 242) !important;box-shadow:none}.duet-card.duet-theme-turva.plain{box-shadow:none}.duet-card.duet-theme-turva .duet-card-heading{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 42, 59);border-color:rgb(212, 221, 226)}.duet-card.duet-theme-turva .duet-card-footer{background:rgb(245, 246, 247)}";
|
|
6148
6154
|
|
|
6149
6155
|
/**
|
|
6150
6156
|
* @slot unnamed default slot - The component’s primary content. All child nodes that do not have a slot attribute defined are inserted into this primary slot.
|
|
@@ -6293,16 +6299,17 @@ class DuetCard {
|
|
|
6293
6299
|
img: {
|
|
6294
6300
|
src: this.image,
|
|
6295
6301
|
alt: this.imageAlt || "",
|
|
6296
|
-
loading: "lazy",
|
|
6302
|
+
loading: this.imagePriority === "high" ? "eager" : "lazy",
|
|
6303
|
+
fetchpriority: this.imagePriority,
|
|
6297
6304
|
class: "duet-card-image",
|
|
6298
6305
|
role: this.imageAlt ? undefined : "presentation",
|
|
6299
6306
|
},
|
|
6300
6307
|
sources: parsePossibleJSON(this.sources),
|
|
6301
6308
|
};
|
|
6302
|
-
return (hAsync(Host, { key: '
|
|
6309
|
+
return (hAsync(Host, { key: 'e665c5842a71a942c9098bb06045587327958776', class: {
|
|
6303
6310
|
"duet-m-0": this.margin === "none",
|
|
6304
6311
|
"duet-card-info": this.variation === "info",
|
|
6305
|
-
} }, hAsync(TagName, { key: '
|
|
6312
|
+
} }, hAsync(TagName, { key: '10722ae1c42744e1924df0a38313eb68acb8a4b1', href: this.url, style: styles, ref: card => (this.nativeCard = card), "aria-label": this.accessibleLabel, class: {
|
|
6306
6313
|
"duet-card": true,
|
|
6307
6314
|
[this.padding]: true,
|
|
6308
6315
|
[this.variation]: true,
|
|
@@ -6312,7 +6319,7 @@ class DuetCard {
|
|
|
6312
6319
|
"duet-card-has-bg": this.background !== "gray-lightest",
|
|
6313
6320
|
"duet-card-has-icon": !!this.icon,
|
|
6314
6321
|
"duet-card-collapsed": this.collapsible && !this.open,
|
|
6315
|
-
} }, this.image && (hAsync("div", { key: '
|
|
6322
|
+
} }, this.image && (hAsync("div", { key: 'a9a0b21ac68624cba6b3bfb9c0e8d3d87597cfe0', class: "duet-card-image-mask" }, hAsync(DuetPicture, Object.assign({ key: 'efa16a802e16d5be73243c2c1e2c2bd7fe49839b' }, pictureSource)))), (this.heading || this.hasHeadingSlot) && this.renderHeading(), hAsync("div", { key: 'a6ea5db0ad9150e7e5a4dd59ae42bb1c6603aac3', class: "duet-card-content", id: this.cardId }, hAsync("slot", { key: '33a498070a2b68d6361247afe7bd12c440abad6b' }), this.hasFooter && (hAsync("div", { key: 'f2ddb3f3e200fcab419911d5023831019cc4e9e3', class: "duet-card-footer" }, hAsync("slot", { key: 'ac749be2398980321f3cfe4f6b3b679cd2803be0', name: "footer" })))))));
|
|
6316
6323
|
}
|
|
6317
6324
|
get element() { return getElement(this); }
|
|
6318
6325
|
static get style() { return duetCardCss; }
|
|
@@ -6332,6 +6339,7 @@ class DuetCard {
|
|
|
6332
6339
|
"iconColor": [513, "icon-color"],
|
|
6333
6340
|
"image": [1],
|
|
6334
6341
|
"imageAlt": [1, "image-alt"],
|
|
6342
|
+
"imagePriority": [1, "image-priority"],
|
|
6335
6343
|
"sources": [1],
|
|
6336
6344
|
"background": [1],
|
|
6337
6345
|
"padding": [1],
|
|
@@ -6574,11 +6582,11 @@ class DuetCheckmark {
|
|
|
6574
6582
|
inheritGlobalTheme(this);
|
|
6575
6583
|
}
|
|
6576
6584
|
render() {
|
|
6577
|
-
return (hAsync(Host, { key: '
|
|
6585
|
+
return (hAsync(Host, { key: '2142269327442a806b3ea159abe1c55920cd4ec7', class: { "duet-theme-turva": this.theme === "turva" } }, hAsync("div", { key: '5e80d429c85b08fdc7252dc4b63bae771186b611', role: this.presentationOnly ? "presentation" : null, class: { checked: this.checked } }, hAsync("div", { key: '059edd1d87fa195725d63016b61692f62d1a5728', class: {
|
|
6578
6586
|
"duet-checkmark-container": true,
|
|
6579
6587
|
center: this.center,
|
|
6580
6588
|
"duet-checkmark-radio": this.type === "radio",
|
|
6581
|
-
} }, this.checked && hAsync("div", { key: '
|
|
6589
|
+
} }, this.checked && hAsync("div", { key: '3a81e706e386b1e81377521a89875eb790f5e68e', class: "duet-checkmark" })))));
|
|
6582
6590
|
}
|
|
6583
6591
|
static get style() { return duetCheckmarkCss; }
|
|
6584
6592
|
static get cmpMeta() { return {
|
|
@@ -7604,7 +7612,16 @@ class DuetChoiceGroup {
|
|
|
7604
7612
|
var _a;
|
|
7605
7613
|
const value = (_a = this.value) !== null && _a !== void 0 ? _a : this.initialValue;
|
|
7606
7614
|
const allChoices = Array.from(this.element.querySelectorAll("duet-choice"));
|
|
7607
|
-
const ownChoices = allChoices
|
|
7615
|
+
const ownChoices = allChoices
|
|
7616
|
+
.filter(choice => !allChoices.includes(choice.parentElement.closest("duet-choice")))
|
|
7617
|
+
.filter(ownChoice => {
|
|
7618
|
+
if (ownChoice.type === "checkbox") {
|
|
7619
|
+
console.error("Choice Group must consist of type=radio Choices. Choise type=checkbox is not allowed. They will be removed in a future Duet version", ownChoice);
|
|
7620
|
+
// ownChoice.remove()
|
|
7621
|
+
return false;
|
|
7622
|
+
}
|
|
7623
|
+
return true;
|
|
7624
|
+
});
|
|
7608
7625
|
let hasChecked = false;
|
|
7609
7626
|
this.choices.clear();
|
|
7610
7627
|
ownChoices.forEach(choice => this.choices.add(choice));
|
|
@@ -7639,14 +7656,14 @@ class DuetChoiceGroup {
|
|
|
7639
7656
|
* Always the last one in the class.
|
|
7640
7657
|
*/
|
|
7641
7658
|
render() {
|
|
7642
|
-
return (hAsync(Host, { key: '
|
|
7659
|
+
return (hAsync(Host, { key: 'bef9e6aed77ae942a881822af3fd9b2fd340088b', onDuetChange: this.onSelect, onDuetChoiceReady: this.onChoiceReady, class: {
|
|
7643
7660
|
horizontal: this.direction === "horizontal",
|
|
7644
7661
|
"duet-choice-group-breakpoint-x-small": this.responsive && this.breakpoint === "x-small",
|
|
7645
7662
|
"duet-choice-group-breakpoint-small": this.responsive && this.breakpoint === "small",
|
|
7646
7663
|
"duet-choice-group-breakpoint-medium": this.responsive && this.breakpoint === "medium",
|
|
7647
7664
|
"duet-choice-group-breakpoint-large": this.responsive && this.breakpoint === "large",
|
|
7648
7665
|
"duet-choice-group-breakpoint-x-large": this.responsive && this.breakpoint === "x-large",
|
|
7649
|
-
} }, hAsync("duet-fieldset", { key: '
|
|
7666
|
+
} }, hAsync("duet-fieldset", { key: '18197d3bbcf9772c85e002a0df25e9df79dcb3a7', label: this.label, labelHidden: this.labelHidden, compactLabel: true, caption: this.caption, error: this.error, margin: this.margin, theme: this.theme, "accessible-live-error": this.accessibleLiveError }, this.tooltip && (hAsync("duet-tooltip", { key: 'f9a555c68c6f7312e0941a16752f5c2b3e488e93', slot: "tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), hAsync("slot", { key: '041c890f290b5ecd750edd189288cfb2769aa60b', name: "tooltip", slot: "tooltip" }), hAsync("div", { key: '01d3e4cad179c9aa864c80557831cbf10bf2b0f2', class: { [this.choiceGroupName]: true, "duet-no-stacking": !this.responsive } }, hAsync("slot", { key: '87f9ea13d22d029ba9025572432ebdde96456838' })))));
|
|
7650
7667
|
}
|
|
7651
7668
|
get element() { return getElement(this); }
|
|
7652
7669
|
static get watchers() { return {
|
|
@@ -9092,6 +9109,7 @@ class DuetCombobox {
|
|
|
9092
9109
|
// the activeItem number is based upon the array.index of the array stored in processedItems
|
|
9093
9110
|
this.activeItem = undefined;
|
|
9094
9111
|
this.activeItemAnnouncement = "";
|
|
9112
|
+
this.optionsFoundAnnouncement = "";
|
|
9095
9113
|
/**
|
|
9096
9114
|
* Defaults for the accessible labels for the select items
|
|
9097
9115
|
*/
|
|
@@ -9099,17 +9117,23 @@ class DuetCombobox {
|
|
|
9099
9117
|
en: {
|
|
9100
9118
|
heading: "Select:",
|
|
9101
9119
|
item: "{name}",
|
|
9102
|
-
|
|
9120
|
+
activeItemLabel: "{name}, {current} / {total}",
|
|
9121
|
+
optionsFound: "{optionCount} options found",
|
|
9122
|
+
noOptionsFound: "No options found",
|
|
9103
9123
|
},
|
|
9104
9124
|
fi: {
|
|
9105
9125
|
heading: "Valitse:",
|
|
9106
9126
|
item: "{name}",
|
|
9107
|
-
|
|
9127
|
+
activeItemLabel: "{name}, {current} / {total}",
|
|
9128
|
+
optionsFound: "{optionCount}, valintaa löydetty", // extra comma to prevent unwanted conjugation
|
|
9129
|
+
noOptionsFound: "Yhtään valintaa ei löydy",
|
|
9108
9130
|
},
|
|
9109
9131
|
sv: {
|
|
9110
9132
|
heading: "Välj:",
|
|
9111
9133
|
item: "{name}",
|
|
9112
|
-
|
|
9134
|
+
activeItemLabel: "{name}, {current} / {total}",
|
|
9135
|
+
optionsFound: "{optionCount} val hittades",
|
|
9136
|
+
noOptionsFound: "Inget val hittades",
|
|
9113
9137
|
},
|
|
9114
9138
|
};
|
|
9115
9139
|
/**
|
|
@@ -9185,16 +9209,24 @@ class DuetCombobox {
|
|
|
9185
9209
|
}
|
|
9186
9210
|
});
|
|
9187
9211
|
};
|
|
9212
|
+
this.optionsFoundTimeoutId = 0;
|
|
9188
9213
|
this.onInputTyping = async (e) => {
|
|
9189
9214
|
var _a;
|
|
9190
9215
|
const newValue = e.detail.value;
|
|
9191
9216
|
if (!this.force && !this.multiple && this.selectedItems.size > 0 && newValue !== this.getSelectedItemLabel()) {
|
|
9192
9217
|
this.selectedItems.clear();
|
|
9193
9218
|
}
|
|
9194
|
-
if (!this.
|
|
9219
|
+
if (!this.multiple && newValue === "") {
|
|
9195
9220
|
this.value = undefined;
|
|
9196
9221
|
}
|
|
9197
|
-
|
|
9222
|
+
const filteredItemsCount = ((_a = this.getFilteredItems()) === null || _a === void 0 ? void 0 : _a.length) || 0;
|
|
9223
|
+
this.listOpen = String(newValue).length >= this.minCharacters && filteredItemsCount > 0;
|
|
9224
|
+
clearTimeout(this.optionsFoundTimeoutId);
|
|
9225
|
+
this.optionsFoundTimeoutId = setTimeout(() => {
|
|
9226
|
+
this.optionsFoundAnnouncement = filteredItemsCount
|
|
9227
|
+
? this.accessibleLabels.optionsFound.replace("{optionCount}", `${filteredItemsCount}`)
|
|
9228
|
+
: this.accessibleLabels.noOptionsFound;
|
|
9229
|
+
}, 1000);
|
|
9198
9230
|
};
|
|
9199
9231
|
this.onKeyDown = (e) => {
|
|
9200
9232
|
var _a, _b, _c;
|
|
@@ -9299,15 +9331,6 @@ class DuetCombobox {
|
|
|
9299
9331
|
}
|
|
9300
9332
|
this.activeItemAnnouncement = "";
|
|
9301
9333
|
}
|
|
9302
|
-
inputValueHandler() {
|
|
9303
|
-
setTimeout(async () => {
|
|
9304
|
-
const label = await this.getSelectedItemLabel();
|
|
9305
|
-
if (this.input.value == "" && label) {
|
|
9306
|
-
this.input.value = "";
|
|
9307
|
-
this.value = undefined;
|
|
9308
|
-
}
|
|
9309
|
-
}, 200);
|
|
9310
|
-
}
|
|
9311
9334
|
handleDocumentClick(e) {
|
|
9312
9335
|
//we want to remove all user text if they have NOT selected from the dropdown
|
|
9313
9336
|
const path = e.composedPath();
|
|
@@ -9573,7 +9596,8 @@ class DuetCombobox {
|
|
|
9573
9596
|
}
|
|
9574
9597
|
//function that scrolls to the li element with the class "active"
|
|
9575
9598
|
scrollToActive() {
|
|
9576
|
-
|
|
9599
|
+
var _a;
|
|
9600
|
+
const activeElement = (_a = this.element.shadowRoot) === null || _a === void 0 ? void 0 : _a.getElementById(`${this.activeDescendantId}`);
|
|
9577
9601
|
if (activeElement) {
|
|
9578
9602
|
activeElement.scrollIntoView({
|
|
9579
9603
|
behavior: "smooth",
|
|
@@ -9585,12 +9609,11 @@ class DuetCombobox {
|
|
|
9585
9609
|
if (!item || itemsLength === undefined) {
|
|
9586
9610
|
return "";
|
|
9587
9611
|
}
|
|
9588
|
-
const labelString = length === itemsLength ? this.accessibleLabels.item : this.accessibleLabels.
|
|
9612
|
+
const labelString = length === itemsLength ? this.accessibleLabels.item : this.accessibleLabels.activeItemLabel;
|
|
9589
9613
|
return labelString
|
|
9590
9614
|
.replace("{name}", String(item.name))
|
|
9591
9615
|
.replace("{current}", String(itemIndex + 1))
|
|
9592
|
-
.replace("{total}", String(length))
|
|
9593
|
-
.replace("{hiddenItems}", String(itemsLength - length));
|
|
9616
|
+
.replace("{total}", String(length));
|
|
9594
9617
|
}
|
|
9595
9618
|
/**
|
|
9596
9619
|
* Filter the items based on the input value
|
|
@@ -9661,7 +9684,6 @@ class DuetCombobox {
|
|
|
9661
9684
|
static get watchers() { return {
|
|
9662
9685
|
"listOpen": ["popupMenuOpenHandler", "processListOpenChange"],
|
|
9663
9686
|
"activeItem": ["activeItemHandler"],
|
|
9664
|
-
"inputValue": ["inputValueHandler"],
|
|
9665
9687
|
"items": ["processItems"],
|
|
9666
9688
|
"value": ["processValue"]
|
|
9667
9689
|
}; }
|
|
@@ -9690,6 +9712,7 @@ class DuetCombobox {
|
|
|
9690
9712
|
"selectedItems": [32],
|
|
9691
9713
|
"activeItem": [32],
|
|
9692
9714
|
"activeItemAnnouncement": [32],
|
|
9715
|
+
"optionsFoundAnnouncement": [32],
|
|
9693
9716
|
"formatItem": [64]
|
|
9694
9717
|
},
|
|
9695
9718
|
"$listeners$": [[4, "click", "handleDocumentClick"]],
|
|
@@ -9748,15 +9771,16 @@ class DuetContactCard {
|
|
|
9748
9771
|
img: {
|
|
9749
9772
|
src: this.image,
|
|
9750
9773
|
alt: this.name || "",
|
|
9751
|
-
loading: "lazy",
|
|
9774
|
+
loading: this.imagePriority === "high" ? "eager" : "lazy",
|
|
9775
|
+
fetchpriority: this.imagePriority,
|
|
9752
9776
|
class: "image",
|
|
9753
9777
|
},
|
|
9754
9778
|
sources: parsePossibleJSON(this.sources),
|
|
9755
9779
|
};
|
|
9756
|
-
return (hAsync(Host, { key: '
|
|
9780
|
+
return (hAsync(Host, { key: '04096609d15dbb158a385792f711da26ee95dd95', class: { "duet-m-0": this.margin === "none" } }, hAsync("div", { key: 'a0878e116a425a2ed9652904f7bc7d3d93544354', class: {
|
|
9757
9781
|
"duet-contact-card": true,
|
|
9758
9782
|
"duet-theme-turva": this.theme === "turva",
|
|
9759
|
-
}, role: "group", "aria-label": this.name }, this.image ? hAsync(DuetPicture, Object.assign({}, pictureSource)) : hAsync("div", null), hAsync("div", { key: '
|
|
9783
|
+
}, role: "group", "aria-label": this.name }, this.image ? hAsync(DuetPicture, Object.assign({}, pictureSource)) : hAsync("div", null), hAsync("div", { key: '152a894a38c39c7f16488b0507ea8a2c139d29c5' }, this.name && (hAsync("duet-heading", { key: '8738ca48c85445b027021dc89b500332a6d6b449', class: "name", level: "h3", margin: "none", theme: theme }, this.name)), this.description && (hAsync("duet-paragraph", { key: 'a9f592ba12df7aeb59c5a5e2fad53ae1e52bab85', class: "description", margin: "none", theme: theme }, this.description)), this.email && (hAsync("div", { key: 'afc1e103364b705e988962ab9edfdd5e0dfbbf5f', class: "email" }, hAsync("duet-icon", { key: '5cf4768948c4b002f742233dc4d4f279bbc45b54', name: "navigation-message", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: 'e2e59421cec8883de026f5f47a6da855545a68ce', url: `mailto:${this.email}`, accessibleLabel: `Email: ${this.email}`, theme: theme }, this.email))), this.phone && (hAsync("div", { key: '5a4085420c24900f3ae971f5cf5b84a91a830da4', class: "phone" }, hAsync("duet-icon", { key: '01c049683d092c7b71fcdbf24b9a8470bd8af2da', name: "form-tel", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: '99c27b5983a2388e1349de7eb7b7db19d754b475', url: `tel:${this.phone}`, accessibleLabel: `${this.phoneLabel[this.language]}: ${this.phone}`, theme: theme }, this.phone)))), this.buttonUrl && this.buttonText && (hAsync("div", { key: '9996e7c2693ddb274ab8a803e0dc564bfc40c246', class: "call-to-action" }, hAsync("duet-button", { key: 'c0730311ffec7410311d527e75a725332a849ac8', variation: "default", icon: this.buttonIcon, fixed: true, margin: "none", url: this.buttonUrl, theme: theme }, this.buttonText))), hAsync("div", { key: '136c1d0c39ad396194d2f9f7e9ca180e82aa66a7' }), hAsync("slot", { key: 'fc98de9e746468e61a869ed3f4678495fe9df91f' }))));
|
|
9760
9784
|
}
|
|
9761
9785
|
get element() { return getElement(this); }
|
|
9762
9786
|
static get style() { return duetContactCardCss; }
|
|
@@ -9767,6 +9791,7 @@ class DuetContactCard {
|
|
|
9767
9791
|
"theme": [1025],
|
|
9768
9792
|
"margin": [1],
|
|
9769
9793
|
"image": [1025],
|
|
9794
|
+
"imagePriority": [1, "image-priority"],
|
|
9770
9795
|
"sources": [1],
|
|
9771
9796
|
"name": [1025],
|
|
9772
9797
|
"description": [1025],
|
|
@@ -10203,7 +10228,7 @@ const DatePickerDay = ({ focusedDay, today, day, language, onDaySelect, onKeyboa
|
|
|
10203
10228
|
function handleClick(e) {
|
|
10204
10229
|
onDaySelect(e, day);
|
|
10205
10230
|
}
|
|
10206
|
-
return (hAsync("td", { "data-day": printISODate(day), class: { "duet-date-table-cell": true, selected: isSelected }, "aria-label": `${formatterShort.format(day)}${isSelected ? `, ${selectedDayLabel[language]}` :
|
|
10231
|
+
return (hAsync("td", { "data-day": printISODate(day), class: { "duet-date-table-cell": true, selected: isSelected }, "aria-label": `${formatterShort.format(day)}${isSelected ? `, ${selectedDayLabel[language]}` : ""}`, role: "button", tabIndex: isFocused ? 0 : -1, onClick: handleClick, onKeyDown: onKeyboardNavigation, "aria-disabled": isOutsideRange || isDisabled, ref: ref },
|
|
10207
10232
|
hAsync("span", { class: { "duet-date-table-button": true, outside: isOutsideRange, disabled: isDisabled, today: isToday } }, day.getDate())));
|
|
10208
10233
|
};
|
|
10209
10234
|
|
|
@@ -10483,9 +10508,13 @@ class DuetDatePicker {
|
|
|
10483
10508
|
*/
|
|
10484
10509
|
this.error = "";
|
|
10485
10510
|
/**
|
|
10486
|
-
*
|
|
10511
|
+
* @deprecated changed from opt-out to opt-in with attribute `enable-built-in-errors`
|
|
10487
10512
|
*/
|
|
10488
|
-
this.disableBuiltInErrors =
|
|
10513
|
+
this.disableBuiltInErrors = true;
|
|
10514
|
+
/**
|
|
10515
|
+
* Date picker can use built-in error messages for invalid or missing entries if the application does not handle those.
|
|
10516
|
+
*/
|
|
10517
|
+
this.enableBuiltInErrors = false;
|
|
10489
10518
|
/**
|
|
10490
10519
|
* Visually hide the label, but still show it to screen readers.
|
|
10491
10520
|
*/
|
|
@@ -10563,7 +10592,7 @@ class DuetDatePicker {
|
|
|
10563
10592
|
this.handleBlur = (event) => {
|
|
10564
10593
|
event.stopPropagation();
|
|
10565
10594
|
this.inputHasFocus = false;
|
|
10566
|
-
if (!this._validity.valid &&
|
|
10595
|
+
if (!this._validity.valid && this.enableBuiltInErrors) {
|
|
10567
10596
|
const errorKey = Object.entries(this._validity).find(entry => !!entry[1])[0];
|
|
10568
10597
|
this.error = getLocaleString(this.dateErrorMessages[errorKey]);
|
|
10569
10598
|
}
|
|
@@ -10800,7 +10829,7 @@ class DuetDatePicker {
|
|
|
10800
10829
|
valueMissing,
|
|
10801
10830
|
valid: !(valueMissing || badInput || rangeUnderflow || rangeOverflow || customError),
|
|
10802
10831
|
};
|
|
10803
|
-
if (this._validity.valid) {
|
|
10832
|
+
if (this._validity.valid && this.enableBuiltInErrors) {
|
|
10804
10833
|
this.error = "";
|
|
10805
10834
|
}
|
|
10806
10835
|
}
|
|
@@ -10861,13 +10890,13 @@ class DuetDatePicker {
|
|
|
10861
10890
|
if (maxDate) {
|
|
10862
10891
|
maxYear = Math.min(maxYear, maxDate.getFullYear());
|
|
10863
10892
|
}
|
|
10864
|
-
return (hAsync(Host, { key: '
|
|
10893
|
+
return (hAsync(Host, { key: '2101b93d551d7db95be216d7e8293354201e68fb', class: { "duet-expand": this.expand, "duet-m-0": this.margin === "none" } }, hAsync("div", { key: 'd23a2c29a015fbf53bf97b6f07cc79230ec77ae3', class: "duet-date" }, hAsync(DatePickerInput, { key: '0d7a4f813cb59f576fe7bdf0b5866e60cbaccc71', hasFocus: this.inputHasFocus, value: this.value, valueAsDate: valueAsDate, formattedValue: this.inputValue, language: this.language, onInput: this.handleInputChange, onBlur: this.handleBlur, onFocus: this.handleFocus, onClick: this.toggleOpen, name: this.name, disabled: this.disabled, error: this.error, role: this.role, required: this.required, theme: this.theme, tooltip: this.tooltip, tooltipDirection: this.tooltipDirection, labelHidden: this.labelHidden, placeholder: this.placeholder, inputLabel: this.label, identifier: this.identifier, buttonRef: element => (this.datePickerButton = element), inputRef: element => (this.datePickerInput = element), accessibleActiveDescendant: this.accessibleActiveDescendant, accessibleControls: this.accessibleControls, accessibleOwns: this.accessibleOwns, accessibleDescribedBy: this.accessibleDescribedBy, accessibleLiveError: this.accessibleLiveError, echoPlaceholder: this.echoPlaceholder, caption: this.caption })), hAsync("div", { key: '868801785eb752e7c988273787ba367463f0d2c0', class: {
|
|
10865
10894
|
"duet-theme-turva": this.theme === "turva",
|
|
10866
10895
|
"duet-date-dialog": true,
|
|
10867
10896
|
left: this.direction === "left",
|
|
10868
10897
|
error: !!this.error,
|
|
10869
10898
|
active: this.open,
|
|
10870
|
-
}, role: "dialog", "aria-modal": "true", "aria-hidden": this.open ? "false" : "true", "aria-labelledby": this.dialogLabelId, onTouchMove: this.handleTouchMove, onTouchStart: this.handleTouchStart, onTouchEnd: this.handleTouchEnd }, hAsync("duet-overlay", { key: '
|
|
10899
|
+
}, role: "dialog", "aria-modal": "true", "aria-hidden": this.open ? "false" : "true", "aria-labelledby": this.dialogLabelId, onTouchMove: this.handleTouchMove, onTouchStart: this.handleTouchStart, onTouchEnd: this.handleTouchEnd }, hAsync("duet-overlay", { key: 'ff3ca44007f17949b16824685e55d4b52304a635', visible: this.open, "display-device": "x-small" }), hAsync(FocusGuard, { key: '52415f73958c302f54ed9ed1d2fc4f4d4d8c2413', moveFocusTo: this.focusedDayNode }), hAsync("div", { key: '0dd696ad1ac07902f07f483907d28056a7a53875', class: "duet-date-dialog-wrapper", onKeyDown: this.handleEscKey, ref: element => (this.dialogWrapperNode = element) }, hAsync("duet-visually-hidden", { key: 'e2a7f570483f794aa9f69367e6d5d264e382704d', "aria-live": "polite" }, text.keyboardInstruction), hAsync("div", { key: '5fba9ce2d01e722cef8125759dc2ca476a1b75ac', class: "duet-date-dialog-mobile-header" }, hAsync(DuetInternalLabel, { key: '1e06e95abf149f493566476b91a8a5478e7978e1', margin: "none" }, this.label), hAsync("button", { key: 'f0d02d5c156532cbcd62a941a3624b7e97f0ffed', class: "duet-date-picker-close", ref: element => (this.closeButtonNode = element), onClick: () => this.hide(), type: "button" }, hAsync("duet-icon", { key: '7ddaf28a52153f0d7c2f514fe4d657a108d8cefb', name: "navigation-close-small", margin: "none", color: "currentColor", size: "xx-small" }), hAsync("duet-visually-hidden", { key: 'db236821d951de7fec7f33b55841538d9fe5f796' }, text.closeLabel))), hAsync("div", { key: 'bf259e202dd64c21a95dd24ba47b7c0776811b4b', class: "duet-date-dialog-header" }, hAsync("div", { key: '9d833d152a1f2d7f594d5c47e28d18363c8910d7', class: "duet-date-dialog-dropdowns" }, hAsync("duet-visually-hidden", { key: 'f00f0ff852c76fff5bae02ab2915127b105c4d63' }, hAsync("h2", { key: '028369aad6a32055c14ecf6c0b06334e2e54a9bb', id: this.dialogLabelId, "aria-live": "polite", "aria-atomic": "true" }, text.monthLabels[focusedMonth], " ", this.focusedDay.getFullYear())), hAsync("duet-visually-hidden", { key: '73d126ea4d199f59eb55df5113e06c54a4222dc3' }, hAsync("label", { key: '22f1038fdc4e65bf77d0e888f1e4f4e714b70bbc', htmlFor: this.monthSelectId }, text.monthSelectLabel)), hAsync("div", { key: '6770d474539174a57fcd109545e693cae6894f77', class: "duet-date-dialog-select" }, hAsync("select", { key: '8a8d5005e81c8ba1838d298599d074b82d2e0197', id: this.monthSelectId, class: "duet-date-month-select", ref: element => (this.monthSelectNode = element), onChange: this.handleMonthSelect }, text.monthLabels.map((month, i) => (hAsync("option", { key: month, value: i, selected: i === focusedMonth, disabled: !inRange(new Date(focusedYear, i, 1), minDate ? startOfMonth(minDate) : null, maxDate ? endOfMonth(maxDate) : null) }, month)))), hAsync("div", { key: '8144b70f64ab6f3dd4361ad61e489912c38e02d8', class: "duet-date-dialog-select-label", "aria-hidden": "true" }, hAsync("span", { key: '4e0172c58f7771d0f84ef9fa7ae5bebd7d7b5036' }, text.monthLabelsShort[focusedMonth]), hAsync("duet-icon", { key: '025b0e895b95983de955fbbda9f793ad7b52fb80', name: "action-arrow-down-small", color: "currentColor", margin: "none", size: "xxx-small" }))), hAsync("duet-visually-hidden", { key: 'e0323ecb8e50e0d40dd93b0269dd8dcc07ad6435' }, hAsync("label", { key: '4072da35b9fd966b01d8b49d4c396f66f3c5485a', htmlFor: this.yearSelectId }, text.yearSelectLabel)), hAsync("div", { key: '781da9cd4ee79d9e64cb9c76926859d4d819434e', class: "duet-date-dialog-select" }, hAsync("select", { key: '75f150c29f8bc931d36cd02e2a354d89b7f2761b', id: this.yearSelectId, class: "duet-date-year-select", onChange: this.handleYearSelect }, range(minYear, maxYear).map(year => (hAsync("option", { key: year, selected: year === focusedYear }, year)))), hAsync("div", { key: '96384ab271288677c40cae8d26b7e3d732ac6986', class: "duet-date-dialog-select-label", "aria-hidden": "true" }, hAsync("span", { key: '6f5068e75adf6ccb8dd62e9e3495278130b8406e' }, this.focusedDay.getFullYear()), hAsync("duet-icon", { key: 'ca880dd653adc64184a8804ffeb45b2bad8da968', name: "action-arrow-down-small", color: "currentColor", margin: "none", size: "xxx-small" })))), hAsync("div", { key: '5dd36177b3b2e383e8879dc5fc05eaaa554fc22e', class: "duet-date-dialog-buttons" }, hAsync("duet-action-button", { key: 'ee701d60f8510cf00e34042bd9693ae47f99d6a0', accessibleLabel: i18n$2[this.language].prevMonthLabel, actionName: i18n$2[this.language].prevMonthLabel, class: "duet-date-dialog-prev", onClick: this.handlePreviousMonthClick, disabled: prevMonthDisabled, "icon-name": "action-arrow-left-small" }, text.prevMonthLabel), hAsync("duet-action-button", { key: 'c6da5355e47cd7d1fd4402650b019b9a6e36d150', accessibleLabel: i18n$2[this.language].nextMonthLabel, actionName: i18n$2[this.language].nextMonthLabel, class: "duet-date-dialog-next", onClick: this.handleNextMonthClick, disabled: nextMonthDisabled, "icon-name": "action-arrow-right-small" }, text.nextMonthLabel))), hAsync(DatePickerMonth, { key: 'b6a5540ec6e095f556c761b2e7784b7004568156', selectedDate: valueAsDate, focusedDate: this.focusedDay, onDateSelect: this.handleDaySelect, onKeyboardNavigation: this.handleKeyboardNavigation, labelledById: this.dialogLabelId, language: this.language, theme: this.theme, min: minDate, max: maxDate, disallowWeekends: this.disallowWeekends, disallowBankHolidays: this.disallowBankHolidays, disallowedDates: this.disallowedDates, focusedDayRef: element => (this.focusedDayNode = element), onFocusEnter: this.enableActiveFocus, onFocusExit: this.disableActiveFocus })), hAsync(FocusGuard, { key: 'ff93eaf35841d06eb93e2125254f8f801631bd88', moveFocusTo: this.closeButtonNode }))));
|
|
10871
10900
|
}
|
|
10872
10901
|
get element() { return getElement(this); }
|
|
10873
10902
|
static get watchers() { return {
|
|
@@ -10899,6 +10928,7 @@ class DuetDatePicker {
|
|
|
10899
10928
|
"disabled": [516],
|
|
10900
10929
|
"error": [1537],
|
|
10901
10930
|
"disableBuiltInErrors": [4, "disable-built-in-errors"],
|
|
10931
|
+
"enableBuiltInErrors": [4, "enable-built-in-errors"],
|
|
10902
10932
|
"labelHidden": [4, "label-hidden"],
|
|
10903
10933
|
"role": [1],
|
|
10904
10934
|
"accessibleActiveDescendant": [1, "accessible-active-descendant"],
|
|
@@ -11394,20 +11424,20 @@ class DuetFieldset {
|
|
|
11394
11424
|
* Always the last one in the class.
|
|
11395
11425
|
*/
|
|
11396
11426
|
render() {
|
|
11397
|
-
return (hAsync(Host, { key: '
|
|
11427
|
+
return (hAsync(Host, { key: 'e2c6cc99f8d6e3fcf85ee4a774b61e8a138fe2cb', class: { "duet-m-0": this.margin === "none" } }, hAsync("fieldset", { key: '1e382d523fb124212f4475c59f660566b22cac4a', "aria-labelledby": this.labelId, "aria-describedby": this.error ? this.errorId : null,
|
|
11398
11428
|
// NVDA and VoiceOver do not yet support aria-errormessage
|
|
11399
11429
|
// once they do, we can remove errors from the aria-describedby
|
|
11400
11430
|
// aria-errormessage={this.error ? this.errorId : null}
|
|
11401
11431
|
class: {
|
|
11402
11432
|
"duet-fieldset": true,
|
|
11403
11433
|
"duet-theme-turva": this.theme === "turva",
|
|
11404
|
-
} }, hAsync("legend", { key: '
|
|
11434
|
+
} }, hAsync("legend", { key: '4af73da9eecbdef957d0d9f9fbbde218082cd94b', id: this.labelId }, hAsync(this.labelHeadingLevel, { key: '5b52e382eecc29c2bd709765592e2b9e6fe0fd60' }, this.label), this.caption && hAsync("span", { key: 'ce5feca713eeddbfafb5ab03576e6026e588ac63' }, this.caption)), hAsync("div", { key: '29f85072f52ccc650302586b79d334d2aa686706', class: {
|
|
11405
11435
|
"duet-legend-wrapper": true,
|
|
11406
11436
|
"duet-legend-has-caption": !!this.caption,
|
|
11407
11437
|
"duet-legend-has-tooltip": this.hasTooltip,
|
|
11408
11438
|
"duet-legend-hidden": this.labelHidden,
|
|
11409
11439
|
"duet-legend-compact": this.compactLabel,
|
|
11410
|
-
} }, hAsync("div", { key: '
|
|
11440
|
+
} }, hAsync("div", { key: '78421d08367b6a7e158fb3cc461767cd34eb4dad', class: "duet-fieldset-label" }, hAsync("span", { key: '4df48d5fb01b4cdc199ee36b034f0b54c7ad2039', "aria-hidden": "true" }, this.label), hAsync("slot", { key: 'c4e9d3107c5d62aaadb594e9fa41e455159693cb', onSlotchange: this.checkHasTooltip, name: "tooltip" })), this.caption && (hAsync("div", { key: '1777e78c69d940f110b1ae7bbe33a257197b1229', class: "duet-fieldset-caption", "aria-hidden": "true" }, hAsync("duet-caption", { key: '0ded2be735ec605ecd5451e37a0941db8b9cb7ce', theme: this.theme, margin: "none" }, this.caption)))), hAsync("slot", { key: '2c2acbb1a507fcef25618366d958cbe494d0929c' }), hAsync("span", { key: 'acd99ed8f4ce567b424bb0097df9d4fccca103c3', class: "duet-fieldset-help duet-fieldset-error", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: '4bbba6d24a221081cc559fec9cfca914109b1aac', class: { "duet-m-0": this.lastItemIsChip } }, this.error)))));
|
|
11411
11441
|
}
|
|
11412
11442
|
get element() { return getElement(this); }
|
|
11413
11443
|
static get style() { return duetFieldsetCss; }
|
|
@@ -11647,11 +11677,12 @@ class DuetFooter {
|
|
|
11647
11677
|
}; }
|
|
11648
11678
|
}
|
|
11649
11679
|
|
|
11650
|
-
const duetGridCss = ":host {\n box-sizing: border-box;\n padding: 0;\n margin: 0;\n -moz-appearance: none;\n -webkit-appearance: none;\n appearance: none;\n background: transparent;\n border: 0;\n}\n\n:host(.duet-grid-variation-flex) {\n display: flex !important;\n flex-direction: column !important;\n align-items: flex-start !important;\n justify-content: flex-start !important;\n width: 100%;\n max-width: 100%;\n height: auto;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-breakpoint-x-small) {\n flex-direction: row !important;\n}\n@media (max-width: 22.5em) {\n :host(.duet-grid-variation-flex.duet-grid-breakpoint-x-small) {\n flex-direction: column !important;\n }\n}\n\n:host(.duet-grid-variation-flex.duet-grid-breakpoint-x-small.duet-grid-row-reverse) {\n flex-direction: row-reverse !important;\n}\n\n@media (min-width: 36em) {\n :host(.duet-grid-variation-flex.duet-grid-breakpoint-small) {\n flex-direction: row !important;\n }\n}\n\n@media (min-width: 36em) {\n :host(.duet-grid-variation-flex.duet-grid-breakpoint-small.duet-grid-row-reverse) {\n flex-direction: row-reverse !important;\n }\n}\n\n@media (min-width: 48em) {\n :host(.duet-grid-variation-flex.duet-grid-breakpoint-medium) {\n flex-direction: row !important;\n }\n}\n\n@media (min-width: 48em) {\n :host(.duet-grid-variation-flex.duet-grid-breakpoint-medium.duet-grid-row-reverse) {\n flex-direction: row-reverse !important;\n }\n}\n\n@media (min-width: 62em) {\n :host(.duet-grid-variation-flex.duet-grid-breakpoint-large) {\n flex-direction: row !important;\n }\n}\n\n@media (min-width: 62em) {\n :host(.duet-grid-variation-flex.duet-grid-breakpoint-large.duet-grid-row-reverse) {\n flex-direction: row-reverse !important;\n }\n}\n\n@media (min-width: 64.0625em) {\n :host(.duet-grid-variation-flex.duet-grid-breakpoint-x-large) {\n flex-direction: row !important;\n }\n}\n\n@media (min-width: 64.0625em) {\n :host(.duet-grid-variation-flex.duet-grid-breakpoint-x-large.duet-grid-row-reverse) {\n flex-direction: row-reverse !important;\n }\n}\n\n:host(.duet-grid-variation-flex.duet-grid-wrap) {\n flex-wrap: wrap !important;\n}\n\n:host(.duet-grid-variation-flex.duet-no-stacking) {\n flex-direction: row !important;\n}\n\n:host(.duet-grid-variation-flex.duet-no-stacking.duet-grid-row-reverse) {\n flex-direction: row-reverse !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-x-small) {\n flex-direction: column !important;\n}\n@media (max-width: 35.9375em) {\n :host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-x-small) {\n flex-direction: column !important;\n }\n}\n\n:host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-small) {\n flex-direction: column !important;\n}\n@media (min-width: 36em) {\n :host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-small) {\n flex-direction: column !important;\n }\n}\n\n:host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-medium) {\n flex-direction: column !important;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-medium) {\n flex-direction: column !important;\n }\n}\n\n:host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-large) {\n flex-direction: column !important;\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-large) {\n flex-direction: column !important;\n }\n}\n\n:host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-x-large) {\n flex-direction: column !important;\n}\n@media (min-width: 64.0625em) {\n :host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-x-large) {\n flex-direction: column !important;\n }\n}\n\n:host(.duet-grid-variation-flex.duet-grid-align-top.duet-no-stacking) {\n align-items: flex-start !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-align-bottom.duet-no-stacking) {\n align-items: flex-end !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-align-center.duet-no-stacking) {\n align-items: center !important;\n}\n\n.duet-grid-align-stretch.duet-no-stacking {\n align-items: stretch !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-align-baseline.duet-no-stacking) {\n align-items: baseline !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-align-top.duet-grid-breakpoint-x-small) {\n align-items: flex-start !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-align-bottom.duet-grid-breakpoint-x-small) {\n align-items: flex-end !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-align-center.duet-grid-breakpoint-x-small) {\n align-items: center !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-align-stretch.duet-grid-breakpoint-x-small) {\n align-items: stretch !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-align-baseline.duet-grid-breakpoint-x-small) {\n align-items: baseline !important;\n}\n\n@media (min-width: 36em) {\n :host(.duet-grid-variation-flex.duet-grid-align-top.duet-grid-breakpoint-small) {\n align-items: flex-start !important;\n }\n}\n\n@media (min-width: 36em) {\n :host(.duet-grid-variation-flex.duet-grid-align-bottom.duet-grid-breakpoint-small) {\n align-items: flex-end !important;\n }\n}\n\n@media (min-width: 36em) {\n :host(.duet-grid-variation-flex.duet-grid-align-center.duet-grid-breakpoint-small) {\n align-items: center !important;\n }\n}\n\n@media (min-width: 36em) {\n :host(.duet-grid-variation-flex.duet-grid-align-stretch.duet-grid-breakpoint-small) {\n align-items: stretch !important;\n }\n}\n\n@media (min-width: 36em) {\n :host(.duet-grid-variation-flex.duet-grid-align-baseline.duet-grid-breakpoint-small) {\n align-items: baseline !important;\n }\n}\n\n@media (min-width: 48em) {\n :host(.duet-grid-variation-flex.duet-grid-align-top.duet-grid-breakpoint-medium) {\n align-items: flex-start !important;\n }\n}\n\n@media (min-width: 48em) {\n :host(.duet-grid-variation-flex.duet-grid-align-bottom.duet-grid-breakpoint-medium) {\n align-items: flex-end !important;\n }\n}\n\n@media (min-width: 48em) {\n :host(.duet-grid-variation-flex.duet-grid-align-center.duet-grid-breakpoint-medium) {\n align-items: center !important;\n }\n}\n\n@media (min-width: 48em) {\n :host(.duet-grid-variation-flex.duet-grid-align-stretch.duet-grid-breakpoint-medium) {\n align-items: stretch !important;\n }\n}\n\n@media (min-width: 48em) {\n :host(.duet-grid-variation-flex.duet-grid-align-baseline.duet-grid-breakpoint-medium) {\n align-items: baseline !important;\n }\n}\n\n@media (min-width: 62em) {\n :host(.duet-grid-variation-flex.duet-grid-align-top.duet-grid-breakpoint-large) {\n align-items: flex-start !important;\n }\n}\n\n@media (min-width: 62em) {\n :host(.duet-grid-variation-flex.duet-grid-align-bottom.duet-grid-breakpoint-large) {\n align-items: flex-end !important;\n }\n}\n\n@media (min-width: 62em) {\n :host(.duet-grid-variation-flex.duet-grid-align-center.duet-grid-breakpoint-large) {\n align-items: center !important;\n }\n}\n\n@media (min-width: 62em) {\n :host(.duet-grid-variation-flex.duet-grid-align-stretch.duet-grid-breakpoint-large) {\n align-items: stretch !important;\n }\n}\n\n@media (min-width: 62em) {\n :host(.duet-grid-variation-flex.duet-grid-align-baseline.duet-grid-breakpoint-large) {\n align-items: baseline !important;\n }\n}\n\n@media (min-width: 64.0625em) {\n :host(.duet-grid-variation-flex.duet-grid-align-top.duet-grid-breakpoint-x-large) {\n align-items: flex-start !important;\n }\n}\n\n@media (min-width: 64.0625em) {\n :host(.duet-grid-variation-flex.duet-grid-align-bottom.duet-grid-breakpoint-x-large) {\n align-items: flex-end !important;\n }\n}\n\n@media (min-width: 64.0625em) {\n :host(.duet-grid-variation-flex.duet-grid-align-center.duet-grid-breakpoint-x-large) {\n align-items: center !important;\n }\n}\n\n@media (min-width: 64.0625em) {\n :host(.duet-grid-variation-flex.duet-grid-align-stretch.duet-grid-breakpoint-x-large) {\n align-items: stretch !important;\n }\n}\n\n@media (min-width: 64.0625em) {\n :host(.duet-grid-variation-flex.duet-grid-align-baseline.duet-grid-breakpoint-x-large) {\n align-items: baseline !important;\n }\n}\n\n:host(.duet-grid-variation-flex.duet-grid-distribution-left) {\n justify-content: flex-start !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-distribution-right) {\n justify-content: flex-end !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-distribution-center) {\n justify-content: center !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-distribution-between) {\n justify-content: space-between !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-distribution-around) {\n justify-content: space-around !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-distribution-evenly) {\n justify-content: space-evenly !important;\n}\n\n@media (max-width: 35.9375em) {\n :host(.duet-grid-variation-flex.duet-grid-mobile-left) {\n align-items: flex-start !important;\n justify-content: flex-start !important;\n text-align: left !important;\n }\n}\n\n@media (max-width: 35.9375em) {\n :host(.duet-grid-variation-flex.duet-grid-mobile-center) {\n align-items: center !important;\n justify-content: center !important;\n text-align: center !important;\n }\n :host(.duet-grid-variation-flex.duet-grid-mobile-center) * {\n text-align: center !important;\n }\n}\n\n@media (max-width: 35.9375em) {\n :host(.duet-grid-variation-flex.duet-grid-mobile-right) {\n align-items: flex-end !important;\n justify-content: flex-end !important;\n text-align: right !important;\n }\n :host(.duet-grid-variation-flex.duet-grid-mobile-right) * {\n text-align: right !important;\n }\n}\n\n:host(.duet-grid-variation-grid) {\n display: grid;\n grid-template-rows: repeat(1, 1fr);\n grid-template-columns: repeat(4, minmax(0, 1fr));\n gap: 16px;\n align-items: flex-start;\n justify-content: center;\n padding: 0 20px;\n container-type: inline-size;\n overflow-x: clip;\n}\n@media (min-width: 36em) {\n :host(.duet-grid-variation-grid) {\n gap: 24px;\n padding: 0 40px;\n }\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid) {\n grid-template-columns: repeat(8, 55px);\n gap: 24px 32px;\n padding: 0;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid) {\n grid-template-columns: repeat(12, minmax(0, 1fr));\n padding: 0 64px;\n }\n}\n@media (min-width: 76.25em) {\n :host(.duet-grid-variation-grid) {\n grid-template-columns: repeat(12, 55px);\n gap: 40px;\n padding: 0;\n }\n}\n\n:host(.duet-grid-variation-grid.duet-grid-no-row-gap) {\n row-gap: 0;\n}\n\n:host(.duet-grid-variation-grid.duet-grid-no-column-gap) {\n column-gap: 0;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-no-column-gap) {\n grid-template-columns: repeat(8, 83px);\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-no-column-gap) {\n grid-template-columns: repeat(12, minmax(0, 1fr));\n }\n}\n@media (min-width: 76.25em) {\n :host(.duet-grid-variation-grid.duet-grid-no-column-gap) {\n grid-template-columns: repeat(12, 91.6666666667px);\n }\n}\n\n:host(.duet-grid-variation-grid.duet-grid-template-small) ::slotted(*) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-small) ::slotted(*) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-small) ::slotted(*) {\n grid-column: 3/span 8;\n }\n}\n\n:host(.duet-grid-variation-grid.duet-grid-template-medium) ::slotted(*) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-medium) ::slotted(*) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-medium) ::slotted(*) {\n grid-column: 2/span 10;\n }\n}\n\n:host(.duet-grid-variation-grid.duet-grid-template-large) ::slotted(*) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-large) ::slotted(*) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-large) ::slotted(*) {\n grid-column: 1/span 12;\n }\n}\n\n:host(.duet-grid-variation-grid.duet-grid-template-sidebar-right) ::slotted(:nth-child(odd)) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-sidebar-right) ::slotted(:nth-child(odd)) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-sidebar-right) ::slotted(:nth-child(odd)) {\n grid-column: 1/span 8;\n }\n}\n:host(.duet-grid-variation-grid.duet-grid-template-sidebar-right) ::slotted(:nth-child(even)) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-sidebar-right) ::slotted(:nth-child(even)) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-sidebar-right) ::slotted(:nth-child(even)) {\n grid-column: 9/span 4;\n }\n}\n\n:host(.duet-grid-variation-grid.duet-grid-template-sidebar-left) ::slotted(:nth-child(odd)) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-sidebar-left) ::slotted(:nth-child(odd)) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-sidebar-left) ::slotted(:nth-child(odd)) {\n grid-column: 1/span 4;\n }\n}\n:host(.duet-grid-variation-grid.duet-grid-template-sidebar-left) ::slotted(:nth-child(even)) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-sidebar-left) ::slotted(:nth-child(even)) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-sidebar-left) ::slotted(:nth-child(even)) {\n grid-column: 5/span 8;\n }\n}\n\n:host(.duet-grid-variation-grid.duet-grid-template-two-columns) ::slotted(:nth-child(odd)) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-two-columns) ::slotted(:nth-child(odd)) {\n grid-column: 1/span 4;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-two-columns) ::slotted(:nth-child(odd)) {\n grid-column: 1/span 6;\n }\n}\n:host(.duet-grid-variation-grid.duet-grid-template-two-columns) ::slotted(:nth-child(even)) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-two-columns) ::slotted(:nth-child(even)) {\n grid-column: 5/span 4;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-two-columns) ::slotted(:nth-child(even)) {\n grid-column: 7/span 6;\n }\n}\n\n:host(.duet-grid-variation-grid.duet-grid-template-three-columns) ::slotted(:nth-child(3n+1)) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-three-columns) ::slotted(:nth-child(3n+1)) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-three-columns) ::slotted(:nth-child(3n+1)) {\n grid-column: 1/span 4;\n }\n}\n:host(.duet-grid-variation-grid.duet-grid-template-three-columns) ::slotted(:nth-child(3n+2)) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-three-columns) ::slotted(:nth-child(3n+2)) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-three-columns) ::slotted(:nth-child(3n+2)) {\n grid-column: 5/span 4;\n }\n}\n:host(.duet-grid-variation-grid.duet-grid-template-three-columns) ::slotted(:nth-child(3n+3)) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-three-columns) ::slotted(:nth-child(3n+3)) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-three-columns) ::slotted(:nth-child(3n+3)) {\n grid-column: 9/span 4;\n }\n}\n\n:host(.duet-grid-variation-grid.duet-grid-template-button-grid) {\n grid-template-columns: minmax(0, 1fr);\n gap: 12px;\n padding: 0;\n}\n@media (min-width: 36em) {\n :host(.duet-grid-variation-grid.duet-grid-template-button-grid) {\n gap: 16px;\n }\n}\n@container (min-width: 664px) {\n :host(.duet-grid-variation-grid.duet-grid-template-button-grid) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n@container (min-width: 1100px) {\n :host(.duet-grid-variation-grid.duet-grid-template-button-grid) {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n}";
|
|
11680
|
+
const duetGridCss = ":host {\n box-sizing: border-box;\n padding: 0;\n margin: 0;\n -moz-appearance: none;\n -webkit-appearance: none;\n appearance: none;\n background: transparent;\n border: 0;\n}\n\n:host(.duet-grid-variation-flex) {\n display: flex !important;\n flex-direction: column !important;\n align-items: flex-start !important;\n justify-content: flex-start !important;\n width: 100%;\n max-width: 100%;\n height: auto;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-breakpoint-x-small) {\n flex-direction: row !important;\n}\n@media (max-width: 22.5em) {\n :host(.duet-grid-variation-flex.duet-grid-breakpoint-x-small) {\n flex-direction: column !important;\n }\n}\n\n:host(.duet-grid-variation-flex.duet-grid-breakpoint-x-small.duet-grid-row-reverse) {\n flex-direction: row-reverse !important;\n}\n\n@media (min-width: 36em) {\n :host(.duet-grid-variation-flex.duet-grid-breakpoint-small) {\n flex-direction: row !important;\n }\n}\n\n@media (min-width: 36em) {\n :host(.duet-grid-variation-flex.duet-grid-breakpoint-small.duet-grid-row-reverse) {\n flex-direction: row-reverse !important;\n }\n}\n\n@media (min-width: 48em) {\n :host(.duet-grid-variation-flex.duet-grid-breakpoint-medium) {\n flex-direction: row !important;\n }\n}\n\n@media (min-width: 48em) {\n :host(.duet-grid-variation-flex.duet-grid-breakpoint-medium.duet-grid-row-reverse) {\n flex-direction: row-reverse !important;\n }\n}\n\n@media (min-width: 62em) {\n :host(.duet-grid-variation-flex.duet-grid-breakpoint-large) {\n flex-direction: row !important;\n }\n}\n\n@media (min-width: 62em) {\n :host(.duet-grid-variation-flex.duet-grid-breakpoint-large.duet-grid-row-reverse) {\n flex-direction: row-reverse !important;\n }\n}\n\n@media (min-width: 64.0625em) {\n :host(.duet-grid-variation-flex.duet-grid-breakpoint-x-large) {\n flex-direction: row !important;\n }\n}\n\n@media (min-width: 64.0625em) {\n :host(.duet-grid-variation-flex.duet-grid-breakpoint-x-large.duet-grid-row-reverse) {\n flex-direction: row-reverse !important;\n }\n}\n\n:host(.duet-grid-variation-flex.duet-grid-wrap) {\n flex-wrap: wrap !important;\n}\n\n:host(.duet-grid-variation-flex.duet-no-stacking) {\n flex-direction: row !important;\n}\n\n:host(.duet-grid-variation-flex.duet-no-stacking.duet-grid-row-reverse) {\n flex-direction: row-reverse !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-x-small) {\n flex-direction: column !important;\n}\n@media (max-width: 35.9375em) {\n :host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-x-small) {\n flex-direction: column !important;\n }\n}\n\n:host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-small) {\n flex-direction: column !important;\n}\n@media (min-width: 36em) {\n :host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-small) {\n flex-direction: column !important;\n }\n}\n\n:host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-medium) {\n flex-direction: column !important;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-medium) {\n flex-direction: column !important;\n }\n}\n\n:host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-large) {\n flex-direction: column !important;\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-large) {\n flex-direction: column !important;\n }\n}\n\n:host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-x-large) {\n flex-direction: column !important;\n}\n@media (min-width: 64.0625em) {\n :host(.duet-grid-variation-flex.duet-grid-direction-vertical.duet-grid-breakpoint-x-large) {\n flex-direction: column !important;\n }\n}\n\n:host(.duet-grid-variation-flex.duet-grid-align-top.duet-no-stacking) {\n align-items: flex-start !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-align-bottom.duet-no-stacking) {\n align-items: flex-end !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-align-center.duet-no-stacking) {\n align-items: center !important;\n}\n\n.duet-grid-align-stretch.duet-no-stacking {\n align-items: stretch !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-align-baseline.duet-no-stacking) {\n align-items: baseline !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-align-top.duet-grid-breakpoint-x-small) {\n align-items: flex-start !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-align-bottom.duet-grid-breakpoint-x-small) {\n align-items: flex-end !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-align-center.duet-grid-breakpoint-x-small) {\n align-items: center !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-align-stretch.duet-grid-breakpoint-x-small) {\n align-items: stretch !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-align-baseline.duet-grid-breakpoint-x-small) {\n align-items: baseline !important;\n}\n\n@media (min-width: 36em) {\n :host(.duet-grid-variation-flex.duet-grid-align-top.duet-grid-breakpoint-small) {\n align-items: flex-start !important;\n }\n}\n\n@media (min-width: 36em) {\n :host(.duet-grid-variation-flex.duet-grid-align-bottom.duet-grid-breakpoint-small) {\n align-items: flex-end !important;\n }\n}\n\n@media (min-width: 36em) {\n :host(.duet-grid-variation-flex.duet-grid-align-center.duet-grid-breakpoint-small) {\n align-items: center !important;\n }\n}\n\n@media (min-width: 36em) {\n :host(.duet-grid-variation-flex.duet-grid-align-stretch.duet-grid-breakpoint-small) {\n align-items: stretch !important;\n }\n}\n\n@media (min-width: 36em) {\n :host(.duet-grid-variation-flex.duet-grid-align-baseline.duet-grid-breakpoint-small) {\n align-items: baseline !important;\n }\n}\n\n@media (min-width: 48em) {\n :host(.duet-grid-variation-flex.duet-grid-align-top.duet-grid-breakpoint-medium) {\n align-items: flex-start !important;\n }\n}\n\n@media (min-width: 48em) {\n :host(.duet-grid-variation-flex.duet-grid-align-bottom.duet-grid-breakpoint-medium) {\n align-items: flex-end !important;\n }\n}\n\n@media (min-width: 48em) {\n :host(.duet-grid-variation-flex.duet-grid-align-center.duet-grid-breakpoint-medium) {\n align-items: center !important;\n }\n}\n\n@media (min-width: 48em) {\n :host(.duet-grid-variation-flex.duet-grid-align-stretch.duet-grid-breakpoint-medium) {\n align-items: stretch !important;\n }\n}\n\n@media (min-width: 48em) {\n :host(.duet-grid-variation-flex.duet-grid-align-baseline.duet-grid-breakpoint-medium) {\n align-items: baseline !important;\n }\n}\n\n@media (min-width: 62em) {\n :host(.duet-grid-variation-flex.duet-grid-align-top.duet-grid-breakpoint-large) {\n align-items: flex-start !important;\n }\n}\n\n@media (min-width: 62em) {\n :host(.duet-grid-variation-flex.duet-grid-align-bottom.duet-grid-breakpoint-large) {\n align-items: flex-end !important;\n }\n}\n\n@media (min-width: 62em) {\n :host(.duet-grid-variation-flex.duet-grid-align-center.duet-grid-breakpoint-large) {\n align-items: center !important;\n }\n}\n\n@media (min-width: 62em) {\n :host(.duet-grid-variation-flex.duet-grid-align-stretch.duet-grid-breakpoint-large) {\n align-items: stretch !important;\n }\n}\n\n@media (min-width: 62em) {\n :host(.duet-grid-variation-flex.duet-grid-align-baseline.duet-grid-breakpoint-large) {\n align-items: baseline !important;\n }\n}\n\n@media (min-width: 64.0625em) {\n :host(.duet-grid-variation-flex.duet-grid-align-top.duet-grid-breakpoint-x-large) {\n align-items: flex-start !important;\n }\n}\n\n@media (min-width: 64.0625em) {\n :host(.duet-grid-variation-flex.duet-grid-align-bottom.duet-grid-breakpoint-x-large) {\n align-items: flex-end !important;\n }\n}\n\n@media (min-width: 64.0625em) {\n :host(.duet-grid-variation-flex.duet-grid-align-center.duet-grid-breakpoint-x-large) {\n align-items: center !important;\n }\n}\n\n@media (min-width: 64.0625em) {\n :host(.duet-grid-variation-flex.duet-grid-align-stretch.duet-grid-breakpoint-x-large) {\n align-items: stretch !important;\n }\n}\n\n@media (min-width: 64.0625em) {\n :host(.duet-grid-variation-flex.duet-grid-align-baseline.duet-grid-breakpoint-x-large) {\n align-items: baseline !important;\n }\n}\n\n:host(.duet-grid-variation-flex.duet-grid-distribution-left) {\n justify-content: flex-start !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-distribution-right) {\n justify-content: flex-end !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-distribution-center) {\n justify-content: center !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-distribution-between) {\n justify-content: space-between !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-distribution-around) {\n justify-content: space-around !important;\n}\n\n:host(.duet-grid-variation-flex.duet-grid-distribution-evenly) {\n justify-content: space-evenly !important;\n}\n\n@media (max-width: 35.9375em) {\n :host(.duet-grid-variation-flex.duet-grid-mobile-left) {\n align-items: flex-start !important;\n justify-content: flex-start !important;\n text-align: left !important;\n }\n}\n\n@media (max-width: 35.9375em) {\n :host(.duet-grid-variation-flex.duet-grid-mobile-center) {\n align-items: center !important;\n justify-content: center !important;\n text-align: center !important;\n }\n :host(.duet-grid-variation-flex.duet-grid-mobile-center) * {\n text-align: center !important;\n }\n}\n\n@media (max-width: 35.9375em) {\n :host(.duet-grid-variation-flex.duet-grid-mobile-right) {\n align-items: flex-end !important;\n justify-content: flex-end !important;\n text-align: right !important;\n }\n :host(.duet-grid-variation-flex.duet-grid-mobile-right) * {\n text-align: right !important;\n }\n}\n\n:host(.duet-grid-variation-grid) {\n display: grid;\n grid-template-rows: repeat(1, 1fr);\n grid-template-columns: repeat(4, minmax(0, 1fr));\n gap: 16px;\n align-items: flex-start;\n justify-content: center;\n padding: 0 20px;\n container-type: inline-size;\n overflow-x: clip;\n}\n@media (min-width: 36em) {\n :host(.duet-grid-variation-grid) {\n gap: 24px;\n padding: 0 40px;\n }\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid) {\n grid-template-columns: repeat(8, 55px);\n gap: 24px 32px;\n padding: 0;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid) {\n grid-template-columns: repeat(12, minmax(0, 1fr));\n padding: 0 64px;\n }\n}\n@media (min-width: 76.25em) {\n :host(.duet-grid-variation-grid) {\n grid-template-columns: repeat(12, 55px);\n gap: 40px;\n padding: 0;\n }\n}\n\n:host(.duet-grid-variation-grid.duet-grid-no-row-gap) {\n row-gap: 0;\n}\n\n:host(.duet-grid-variation-grid.duet-grid-no-column-gap) {\n column-gap: 0;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-no-column-gap) {\n grid-template-columns: repeat(8, 83px);\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-no-column-gap) {\n grid-template-columns: repeat(12, minmax(0, 1fr));\n }\n}\n@media (min-width: 76.25em) {\n :host(.duet-grid-variation-grid.duet-grid-no-column-gap) {\n grid-template-columns: repeat(12, 91.6666666667px);\n }\n}\n\n:host(.duet-grid-variation-grid.duet-grid-template-small) ::slotted(*) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-small) ::slotted(*) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-small) ::slotted(*) {\n grid-column: 3/span 8;\n }\n}\n\n:host(.duet-grid-variation-grid.duet-grid-template-medium) ::slotted(*) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-medium) ::slotted(*) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-medium) ::slotted(*) {\n grid-column: 2/span 10;\n }\n}\n\n:host(.duet-grid-variation-grid.duet-grid-template-large) ::slotted(*) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-large) ::slotted(*) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-large) ::slotted(*) {\n grid-column: 1/span 12;\n }\n}\n\n:host(.duet-grid-variation-grid.duet-grid-template-sidebar-right) ::slotted(:nth-child(odd)) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-sidebar-right) ::slotted(:nth-child(odd)) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-sidebar-right) ::slotted(:nth-child(odd)) {\n grid-column: 1/span 8;\n }\n}\n:host(.duet-grid-variation-grid.duet-grid-template-sidebar-right) ::slotted(:nth-child(even)) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-sidebar-right) ::slotted(:nth-child(even)) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-sidebar-right) ::slotted(:nth-child(even)) {\n grid-column: 9/span 4;\n }\n}\n\n:host(.duet-grid-variation-grid.duet-grid-template-sidebar-left) ::slotted(:nth-child(odd)) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-sidebar-left) ::slotted(:nth-child(odd)) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-sidebar-left) ::slotted(:nth-child(odd)) {\n grid-column: 1/span 4;\n }\n}\n:host(.duet-grid-variation-grid.duet-grid-template-sidebar-left) ::slotted(:nth-child(even)) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-sidebar-left) ::slotted(:nth-child(even)) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-sidebar-left) ::slotted(:nth-child(even)) {\n grid-column: 5/span 8;\n }\n}\n\n:host(.duet-grid-variation-grid.duet-grid-template-two-columns) ::slotted(:nth-child(odd)) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-two-columns) ::slotted(:nth-child(odd)) {\n grid-column: 1/span 4;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-two-columns) ::slotted(:nth-child(odd)) {\n grid-column: 1/span 6;\n }\n}\n:host(.duet-grid-variation-grid.duet-grid-template-two-columns) ::slotted(:nth-child(even)) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-two-columns) ::slotted(:nth-child(even)) {\n grid-column: 5/span 4;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-two-columns) ::slotted(:nth-child(even)) {\n grid-column: 7/span 6;\n }\n}\n\n:host(.duet-grid-variation-grid.duet-grid-template-three-columns) ::slotted(:nth-child(3n+1)) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-three-columns) ::slotted(:nth-child(3n+1)) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-three-columns) ::slotted(:nth-child(3n+1)) {\n grid-column: 1/span 4;\n }\n}\n:host(.duet-grid-variation-grid.duet-grid-template-three-columns) ::slotted(:nth-child(3n+2)) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-three-columns) ::slotted(:nth-child(3n+2)) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-three-columns) ::slotted(:nth-child(3n+2)) {\n grid-column: 5/span 4;\n }\n}\n:host(.duet-grid-variation-grid.duet-grid-template-three-columns) ::slotted(:nth-child(3n+3)) {\n grid-column: 1/span 4;\n}\n@media (min-width: 48em) {\n :host(.duet-grid-variation-grid.duet-grid-template-three-columns) ::slotted(:nth-child(3n+3)) {\n grid-column: 1/span 8;\n }\n}\n@media (min-width: 62em) {\n :host(.duet-grid-variation-grid.duet-grid-template-three-columns) ::slotted(:nth-child(3n+3)) {\n grid-column: 9/span 4;\n }\n}\n\n:host(.duet-grid-variation-grid.duet-grid-template-button-grid) {\n grid-template-columns: minmax(0, 1fr);\n gap: 12px;\n padding: 0;\n}\n@media (min-width: 36em) {\n :host(.duet-grid-variation-grid.duet-grid-template-button-grid) {\n gap: 16px;\n }\n}\n@container (min-width: 664px) {\n :host(.duet-grid-variation-grid.duet-grid-template-button-grid) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n@container (min-width: 1100px) {\n :host(.duet-grid-variation-grid.duet-grid-template-button-grid) {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n}\n\n:host(.duet-grid-variation-grid.duet-grid-template-teaser) {\n grid-template-columns: minmax(0, 540px);\n gap: 40px;\n padding: 0;\n}\n@container (min-width: 720px) {\n :host(.duet-grid-variation-grid.duet-grid-template-teaser) {\n grid-template-columns: repeat(2, minmax(0, 540px));\n }\n}\n@container (min-width: 1100px) {\n :host(.duet-grid-variation-grid.duet-grid-template-teaser) {\n grid-template-columns: repeat(3, minmax(0, 540px));\n }\n}\n\n@container (min-width: 1100px) {\n :host(.duet-grid-variation-grid.duet-grid-template-teaser.duet-grid-direct-children-4) {\n grid-template-columns: repeat(2, minmax(0, 540px));\n }\n}";
|
|
11651
11681
|
|
|
11652
11682
|
class DuetGrid {
|
|
11653
11683
|
constructor(hostRef) {
|
|
11654
11684
|
registerInstance(this, hostRef);
|
|
11685
|
+
this.directChildCount = 0;
|
|
11655
11686
|
/**
|
|
11656
11687
|
* Enable or disable the automatic responsive behaviour of the grid component.
|
|
11657
11688
|
* Setting this option to "true" makes sure that contents are stacked vertically
|
|
@@ -11750,7 +11781,9 @@ class DuetGrid {
|
|
|
11750
11781
|
return Array.from(this.element.children );
|
|
11751
11782
|
}
|
|
11752
11783
|
async updateGridItems() {
|
|
11753
|
-
const
|
|
11784
|
+
const children = this.getDirectChildren();
|
|
11785
|
+
this.directChildCount = children.length;
|
|
11786
|
+
const items = children.filter(child => child.tagName.toLowerCase() === "duet-grid-item");
|
|
11754
11787
|
items.forEach(item => {
|
|
11755
11788
|
item.responsive = this.responsive;
|
|
11756
11789
|
item.breakpoint = this.breakpoint;
|
|
@@ -11837,7 +11870,7 @@ class DuetGrid {
|
|
|
11837
11870
|
* Always the last one in the class.
|
|
11838
11871
|
*/
|
|
11839
11872
|
render() {
|
|
11840
|
-
return (hAsync(Host, { key: '
|
|
11873
|
+
return (hAsync(Host, { key: 'af6ceb11c84216f03b1dda1c12f3ae224b5c4874', class: {
|
|
11841
11874
|
"duet-grid": true,
|
|
11842
11875
|
"duet-no-stacking": !this.responsive,
|
|
11843
11876
|
"duet-grid-align-top": this.alignment === "top", // flex-start
|
|
@@ -11864,9 +11897,10 @@ class DuetGrid {
|
|
|
11864
11897
|
"duet-grid-row-reverse": this.rowReverse,
|
|
11865
11898
|
[`duet-grid-variation-${this.gridTemplate ? "grid" : "flex"}`]: true,
|
|
11866
11899
|
[`duet-grid-template-${this.gridTemplate}`]: true,
|
|
11900
|
+
[`duet-grid-direct-children-${this.directChildCount}`]: true,
|
|
11867
11901
|
"duet-grid-no-row-gap": this.gridTemplateGap.startsWith("none") && this.gridTemplate !== "button-grid",
|
|
11868
11902
|
"duet-grid-no-column-gap": this.gridTemplateGap.endsWith("none") && this.gridTemplate !== "button-grid",
|
|
11869
|
-
} }, hAsync("slot", { key: '
|
|
11903
|
+
} }, hAsync("slot", { key: 'c000cfdac55f96a2f4698668e48b13f1e6829ccc' })));
|
|
11870
11904
|
}
|
|
11871
11905
|
get element() { return getElement(this); }
|
|
11872
11906
|
static get watchers() { return {
|
|
@@ -11888,7 +11922,8 @@ class DuetGrid {
|
|
|
11888
11922
|
"distribution": [1],
|
|
11889
11923
|
"mobile": [1],
|
|
11890
11924
|
"gridTemplate": [1, "grid-template"],
|
|
11891
|
-
"gridTemplateGap": [1, "grid-template-gap"]
|
|
11925
|
+
"gridTemplateGap": [1, "grid-template-gap"],
|
|
11926
|
+
"directChildCount": [32]
|
|
11892
11927
|
},
|
|
11893
11928
|
"$listeners$": undefined,
|
|
11894
11929
|
"$lazyBundleId$": "-",
|
|
@@ -11949,7 +11984,7 @@ class DuetGridItem {
|
|
|
11949
11984
|
* Always the last one in the class.
|
|
11950
11985
|
*/
|
|
11951
11986
|
render() {
|
|
11952
|
-
return (hAsync(Host, { key: '
|
|
11987
|
+
return (hAsync(Host, { key: '12dce875bc953154224e96f783fbbc66ecc28884', style: {
|
|
11953
11988
|
"min-width": this.minWidth,
|
|
11954
11989
|
"max-width": this.maxWidth,
|
|
11955
11990
|
}, class: {
|
|
@@ -11966,7 +12001,7 @@ class DuetGridItem {
|
|
|
11966
12001
|
"duet-grid-item-br-medium": this.breakpoint === "medium",
|
|
11967
12002
|
"duet-grid-item-br-large": this.breakpoint === "large",
|
|
11968
12003
|
"duet-grid-item-br-x-large": this.breakpoint === "x-large",
|
|
11969
|
-
} }, hAsync("slot", { key: '
|
|
12004
|
+
} }, hAsync("slot", { key: '51f9a6b4ce1898cf60071a5d527a3c542c761051' })));
|
|
11970
12005
|
}
|
|
11971
12006
|
get element() { return getElement(this); }
|
|
11972
12007
|
static get style() { return duetGridItemCss; }
|
|
@@ -13045,7 +13080,7 @@ class DuetHeading {
|
|
|
13045
13080
|
}; }
|
|
13046
13081
|
}
|
|
13047
13082
|
|
|
13048
|
-
const duetHeroCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;display:block;width:100%}.duet-hero{position:relative;display:block;width:100%;padding:48px 28px;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-style:normal;font-weight:400;line-height:1.5;text-transform:none;text-decoration:none;text-shadow:none;background:rgb(8, 42, 77)}.duet-hero.duet-p-0{padding:0 !important}.duet-hero.duet-m-0{margin:0 !important}.duet-hero.duet-hero-text-center{text-align:center !important}.duet-hero.duet-hero-light{padding-bottom:0 !important}@media (min-width: 62em){.duet-hero.duet-hero-light{padding-bottom:28px !important}}.duet-hero.duet-hero-with-image{padding-bottom:20px !important;margin-bottom:-36px}@media (min-width: 48em){.duet-hero.duet-hero-with-image{padding-bottom:28px !important}}@media (min-width: 62em){.duet-hero.duet-hero-with-image{padding-bottom:36px !important;margin-bottom:-20px}}.duet-hero.duet-hero-light,.duet-hero.duet-hero-with-image{color:rgb(8, 42, 77);background-color:rgb(255, 255, 255);background-image:linear-gradient(rgb(240, 247, 250), #f8fbfd)}.duet-hero.duet-hero-light::before,.duet-hero.duet-hero-with-image::before{position:absolute;top:100%;left:0;z-index:-1;width:100%;height:400px;content:\"\";background-image:linear-gradient(#f8fbfd, rgb(255, 255, 255))}.duet-hero.duet-hero-gray{color:rgb(8, 42, 77);background:rgb(245, 248, 250)}@media (min-width: 62em){.duet-hero.duet-hero-gray .duet-hero-text{display:inline-block;vertical-align:top}.duet-hero.duet-hero-gray .duet-hero-icon+.duet-hero-text{margin-left:28px}}@media (min-width: 62em){.duet-hero.duet-hero-gray-with-actions{padding-bottom:65.4545454545px}}@media (min-width: 62em){.duet-hero.duet-hero-gray-with-back{padding-top:72px}}.duet-hero.duet-hero-campaign,.duet-hero.duet-hero-section{padding:0 0 48px;margin:0;background:none}@media (min-width: 48em){.duet-hero.duet-hero-campaign,.duet-hero.duet-hero-section{min-height:490px}}@media (min-width: 62em){.duet-hero.duet-hero-campaign,.duet-hero.duet-hero-section{min-height:540px}}@media (min-width: 76.25em){.duet-hero.duet-hero-campaign,.duet-hero.duet-hero-section{min-height:620px}}.duet-hero.duet-hero-campaign .background-area,.duet-hero.duet-hero-section .background-area{height:1px;margin-bottom:-1px}.duet-hero.duet-hero-campaign .background-container,.duet-hero.duet-hero-section .background-container{position:absolute;right:0;left:0;display:grid;align-items:flex-start;justify-content:center;overflow:hidden}.duet-hero.duet-hero-campaign .background,.duet-hero.duet-hero-section .background{display:flex;align-items:flex-start;justify-content:center;height:220px;margin:0 auto}.duet-hero.duet-hero-campaign .background picture,.duet-hero.duet-hero-section .background picture{display:block;height:100%}@media (min-width: 1440px){.duet-hero.duet-hero-campaign .background picture,.duet-hero.duet-hero-section .background picture{height:auto}}.duet-hero.duet-hero-campaign .background img,.duet-hero.duet-hero-section .background img{display:block;height:100%}.duet-hero.duet-hero-campaign .background img.cover,.duet-hero.duet-hero-section .background img.cover{object-fit:cover}.duet-hero.duet-hero-campaign .background img.center,.duet-hero.duet-hero-section .background img.center{object-position:center}@media (min-width: 1440px){.duet-hero.duet-hero-campaign .background img,.duet-hero.duet-hero-section .background img{width:100%;height:auto}}@media (min-width: 36em){.duet-hero.duet-hero-campaign .background,.duet-hero.duet-hero-section .background{height:300px}}@media (min-width: 48em){.duet-hero.duet-hero-campaign .background,.duet-hero.duet-hero-section .background{height:450px}}@media (min-width: 62em){.duet-hero.duet-hero-campaign .background,.duet-hero.duet-hero-section .background{height:500px}}@media (min-width: 76.25em){.duet-hero.duet-hero-campaign .background,.duet-hero.duet-hero-section .background{height:580px}}@media (min-width: 1600px){.duet-hero.duet-hero-campaign .background,.duet-hero.duet-hero-section .background{width:1600px;overflow:hidden}}.duet-hero.duet-hero-campaign .background .brand-container,.duet-hero.duet-hero-section .background .brand-container{position:relative;width:100%;height:100%;min-height:220px;overflow:hidden}.duet-hero.duet-hero-campaign .background .brand,.duet-hero.duet-hero-section .background .brand{position:absolute;width:100%;height:220px;background-repeat:no-repeat;background-position:center center;background-size:cover}@media (min-width: 36em){.duet-hero.duet-hero-campaign .background .brand,.duet-hero.duet-hero-section .background .brand{left:-200px}}@media (min-width: 62em){.duet-hero.duet-hero-campaign .background .brand,.duet-hero.duet-hero-section .background .brand{left:auto;height:1100px;background-position:140% -200%}}@media (min-width: 76.25em){.duet-hero.duet-hero-campaign .background .brand,.duet-hero.duet-hero-section .background .brand{background-position:right -200%}}.duet-hero.duet-hero-campaign .brand-shape,.duet-hero.duet-hero-section .brand-shape{position:absolute;top:143px;right:0;left:-30px;width:340px;height:340px;margin-right:auto;margin-left:auto;background:rgb(255, 255, 255);border-radius:20%;mix-blend-mode:normal;transform:rotate(8deg)}@media (min-width: 22.5em){.duet-hero.duet-hero-campaign .brand-shape,.duet-hero.duet-hero-section .brand-shape{top:160px;width:450px;height:450px}}@media (min-width: 36em){.duet-hero.duet-hero-campaign .brand-shape,.duet-hero.duet-hero-section .brand-shape{top:215px;left:-50px;width:550px;height:550px}}@media (min-width: 48em){.duet-hero.duet-hero-campaign .brand-shape,.duet-hero.duet-hero-section .brand-shape{top:250px;left:0;width:712.18px;height:712.18px}}@media (min-width: 62em){.duet-hero.duet-hero-campaign .brand-shape,.duet-hero.duet-hero-section .brand-shape{top:240px}}@media (min-width: 76.25em){.duet-hero.duet-hero-campaign .brand-shape,.duet-hero.duet-hero-section .brand-shape{top:280px}}@media (min-width: 76.25em){.duet-hero.duet-hero-campaign .brand-shape,.duet-hero.duet-hero-section .brand-shape{top:310px}}.duet-hero.duet-hero-campaign ::slotted(.duet-heading),.duet-hero.duet-hero-section ::slotted(.duet-heading){font-size:inherit !important;color:inherit !important}.duet-hero.duet-hero-campaign .duet-hero-text,.duet-hero.duet-hero-section .duet-hero-text{width:100%}.duet-hero.duet-hero-campaign .duet-hero-text .duet-hero-heading::part(duet-heading),.duet-hero.duet-hero-section .duet-hero-text .duet-hero-heading::part(duet-heading){font-size:36px}@media (min-width: 36em){.duet-hero.duet-hero-campaign .duet-hero-text .duet-hero-heading::part(duet-heading),.duet-hero.duet-hero-section .duet-hero-text .duet-hero-heading::part(duet-heading){font-size:48px}}@media (min-width: 62em){.duet-hero.duet-hero-campaign .duet-hero-text .duet-hero-heading::part(duet-heading),.duet-hero.duet-hero-section .duet-hero-text .duet-hero-heading::part(duet-heading){font-size:64px}}.duet-hero.duet-hero-campaign .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-campaign .duet-hero-text duet-paragraph,.duet-hero.duet-hero-section .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-section .duet-hero-text duet-paragraph{margin:0 auto}@media (min-width: 22.5em){.duet-hero.duet-hero-campaign .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-campaign .duet-hero-text duet-paragraph,.duet-hero.duet-hero-section .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-section .duet-hero-text duet-paragraph{width:90%}}@media (min-width: 25em){.duet-hero.duet-hero-campaign .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-campaign .duet-hero-text duet-paragraph,.duet-hero.duet-hero-section .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-section .duet-hero-text duet-paragraph{width:80%}}@media (min-width: 30em){.duet-hero.duet-hero-campaign .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-campaign .duet-hero-text duet-paragraph,.duet-hero.duet-hero-section .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-section .duet-hero-text duet-paragraph{width:70%}}@media (min-width: 36em){.duet-hero.duet-hero-campaign .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-campaign .duet-hero-text duet-paragraph,.duet-hero.duet-hero-section .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-section .duet-hero-text duet-paragraph{width:70%}}@media (min-width: 62em){.duet-hero.duet-hero-campaign .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-campaign .duet-hero-text duet-paragraph,.duet-hero.duet-hero-section .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-section .duet-hero-text duet-paragraph{width:52%}}.duet-hero.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-hero-section .duet-hero-heading{display:flex;align-items:center;height:6rem;padding:0 1rem;margin:1rem 0 4.5rem}@media (min-width: 22.5em){.duet-hero.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-hero-section .duet-hero-heading{margin:2rem 0 4rem}}@media (min-width: 36em){.duet-hero.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-hero-section .duet-hero-heading{margin:3rem 0 8rem}}@media (min-width: 48em){.duet-hero.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-hero-section .duet-hero-heading{margin:4rem 0 10rem}}@media (min-width: 62em){.duet-hero.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-hero-section .duet-hero-heading{margin:5rem 0 10rem}}@media (min-width: 76.25em){.duet-hero.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-hero-section .duet-hero-heading{margin:6rem 0 10rem}}@media (min-width: 76.25em){.duet-hero.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-hero-section .duet-hero-heading{margin:8rem 0 11rem}}.duet-hero.duet-hero-campaign .duet-hero-wrapper.fluid,.duet-hero.duet-hero-campaign .duet-hero-wrapper.narrow,.duet-hero.duet-hero-section .duet-hero-wrapper.fluid,.duet-hero.duet-hero-section .duet-hero-wrapper.narrow{padding:0 16px}@media (min-width: 48em){.duet-hero.duet-hero-section{min-height:490px}}@media (min-width: 62em){.duet-hero.duet-hero-section{min-height:auto}}@media (min-width: 76.25em){.duet-hero.duet-hero-section{min-height:560px}}@media (min-width: 62em){.duet-hero.duet-hero-section .background img{width:100%;height:auto}}@media (min-width: 62em){.duet-hero.duet-hero-section .background{width:1400px;height:436px;overflow:hidden}}@media (min-width: 76.25em){.duet-hero.duet-hero-section .background{width:1536px;height:516px}}@media (min-width: 106.25em){.duet-hero.duet-hero-section .background{width:1536px}}.duet-hero.duet-hero-product{position:relative;padding:0 0 48px;margin:0;background:rgb(255, 255, 255)}@media (max-width: 35.9375em){.duet-hero.duet-hero-product{padding-top:240px}}@media (max-width: 22.5em){.duet-hero.duet-hero-product{padding-top:200px}}@media (min-width: 36em){.duet-hero.duet-hero-product{padding-top:260px}}@media (min-width: 48em){.duet-hero.duet-hero-product{padding-top:250px}}@media (min-width: 48em){.duet-hero.duet-hero-product{min-height:400px;padding:72px 0}}@media (min-width: 62em){.duet-hero.duet-hero-product{min-height:500px;padding:96px 0}}@media (min-width: 76.25em){.duet-hero.duet-hero-product{min-height:575px;padding:120px 0}}.duet-hero.duet-hero-product .background-area{position:absolute;top:0;width:100%;height:600px;overflow:hidden;pointer-events:none}.duet-hero.duet-hero-product .background-area *{pointer-events:auto}.duet-hero.duet-hero-product .background-container{position:absolute;top:-150px;width:100%;height:600px;overflow:hidden;pointer-events:none}.duet-hero.duet-hero-product .background-container *{pointer-events:auto}@media (min-width: 62em){.duet-hero.duet-hero-product .background-container{top:-48px}}.duet-hero.duet-hero-product .background{position:absolute;top:145px;width:100%;overflow:visible}.duet-hero.duet-hero-product .background .background-mask{display:none}@media (min-width: 48em){.duet-hero.duet-hero-product .background{top:130px}}@media (min-width: 62em){.duet-hero.duet-hero-product .background{top:35px}}@media (min-width: 62em){.duet-hero.duet-hero-product .background{position:absolute;right:0;left:0;max-width:1440px;height:100%;margin:0 auto}}.duet-hero.duet-hero-product .background .brand-shaped-image{position:absolute;top:-160px;right:-15%;z-index:0;width:375px;height:375px;overflow:hidden;border-radius:20%;transform:rotate(7deg)}@media (max-width: 35.9375em){.duet-hero.duet-hero-product .background .brand-shaped-image{top:-160px;right:-60px;width:360px;height:360px}}@media (max-width: 22.5em){.duet-hero.duet-hero-product .background .brand-shaped-image{top:-120px;right:-14px;width:290px;height:290px}}@media (min-width: 36em){.duet-hero.duet-hero-product .background .brand-shaped-image{top:-175px;right:-20px;width:400px;height:400px}}@media (min-width: 48em){.duet-hero.duet-hero-product .background .brand-shaped-image{top:-145px;right:-150px;width:414px;height:414px}}@media (min-width: 860px){.duet-hero.duet-hero-product .background .brand-shaped-image{right:-105px}}@media (min-width: 960px){.duet-hero.duet-hero-product .background .brand-shaped-image{right:-45px}}@media (min-width: 62em){.duet-hero.duet-hero-product .background .brand-shaped-image{top:-190px;right:-150px;width:552px;height:552px}}@media (min-width: 1100px){.duet-hero.duet-hero-product .background .brand-shaped-image{right:-35px}}@media (min-width: 76.25em){.duet-hero.duet-hero-product .background .brand-shaped-image{top:-300px;right:-128px;width:736px;height:736px}.duet-hero.duet-hero-product .background .brand-shaped-image.narrow{right:-160px}}@media (min-width: 1300px){.duet-hero.duet-hero-product .background .brand-shaped-image.narrow{right:-128px}}.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-wrapper{position:relative;width:100%;height:100%}.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-bg{position:absolute;bottom:0;left:50%;z-index:1;width:600px;height:256px;transform:rotate(-7deg) translate(-50%, 0)}.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-bg picture{display:block}.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-bg img{position:absolute;top:50%;left:40px;width:100%;height:auto;transform:translateY(-50%)}@media (max-width: 35.9375em){.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-bg{width:520px;height:240px}}@media (max-width: 22.5em){.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-bg{width:440px;height:200px}}@media (min-width: 36em){.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-bg{width:600px;height:260px}}@media (min-width: 48em){.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-bg{width:500px;height:292px}}@media (min-width: 62em){.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-bg{width:720px;height:420px}}@media (min-width: 76.25em){.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-bg{width:950px;height:540px}}.duet-hero.duet-hero-product .background .brand-shape{position:absolute;background:rgb(228, 241, 247);border-radius:25%;mix-blend-mode:normal;transform:rotate(7deg)}@media (max-width: 35.9375em){.duet-hero.duet-hero-product .background .brand-shape{top:20px;right:210px;width:200px;height:200px}}@media (max-width: 22.5em){.duet-hero.duet-hero-product .background .brand-shape{top:24px;right:199px;width:162px;height:162px}}@media (min-width: 36em){.duet-hero.duet-hero-product .background .brand-shape{top:25px;right:290px;width:220px;height:220px}}@media (min-width: 48em){.duet-hero.duet-hero-product .background .brand-shape{top:90px;right:145px;width:225px;height:225px}}@media (min-width: 860px){.duet-hero.duet-hero-product .background .brand-shape{right:195px}}@media (min-width: 960px){.duet-hero.duet-hero-product .background .brand-shape{right:245px}}@media (min-width: 62em){.duet-hero.duet-hero-product .background .brand-shape{top:115px;right:228px;width:300px;height:300px}}@media (min-width: 1100px){.duet-hero.duet-hero-product .background .brand-shape{right:343px}}@media (min-width: 76.25em){.duet-hero.duet-hero-product .background .brand-shape{right:394px;width:400px;height:400px}}.duet-hero.duet-hero-product .background .brand-shaped-icon{position:absolute;display:flex;align-items:center;justify-content:center;background:rgba(0, 119, 179, 0.85);border-radius:25%;mix-blend-mode:normal;transform:rotate(7deg)}@media (max-width: 35.9375em){.duet-hero.duet-hero-product .background .brand-shaped-icon{top:165px;right:25px;width:69px;height:69px}}@media (max-width: 22.5em){.duet-hero.duet-hero-product .background .brand-shaped-icon{top:138px;right:50px;width:57px;height:57px}}@media (min-width: 36em){.duet-hero.duet-hero-product .background .brand-shaped-icon{top:175px;right:125px;width:78px;height:78px}}@media (min-width: 48em){.duet-hero.duet-hero-product .background .brand-shaped-icon{top:220px;right:60px}}@media (min-width: 860px){.duet-hero.duet-hero-product .background .brand-shaped-icon{right:110px}}@media (min-width: 960px){.duet-hero.duet-hero-product .background .brand-shaped-icon{right:160px}}@media (min-width: 62em){.duet-hero.duet-hero-product .background .brand-shaped-icon{top:296px;right:120px;width:105px;height:105px}}@media (min-width: 1100px){.duet-hero.duet-hero-product .background .brand-shaped-icon{right:235px}}@media (min-width: 76.25em){.duet-hero.duet-hero-product .background .brand-shaped-icon{top:345px;right:245px;width:140px;height:140px}}.duet-hero.duet-hero-product .background .brand-shaped-icon duet-icon{transform:rotate(-7deg)}@media (max-width: 35.9375em){.duet-hero.duet-hero-product .background .brand-shaped-icon duet-icon{width:100%;height:100%}}@media (min-width: 36em){.duet-hero.duet-hero-product .background .brand-shaped-icon duet-icon{width:72px;height:72px}}@media (min-width: 48em){.duet-hero.duet-hero-product .background .brand-shaped-icon duet-icon{width:72px;height:72px}}@media (min-width: 62em){.duet-hero.duet-hero-product .background .brand-shaped-icon duet-icon{width:86px;height:86px}}@media (min-width: 76.25em){.duet-hero.duet-hero-product .background .brand-shaped-icon duet-icon{width:104px;height:104px}}.duet-hero.duet-hero-product .duet-hero-wrapper{max-width:100%;margin:0 auto}.duet-hero.duet-hero-product .duet-hero-wrapper .duet-hero-text{margin-top:0}@media (min-width: 62em){.duet-hero.duet-hero-product .duet-hero-wrapper .duet-hero-heading{margin-top:0}}.duet-hero.duet-hero-product .duet-hero-wrapper.fluid,.duet-hero.duet-hero-product .duet-hero-wrapper.narrow{padding:0 16px}@media (min-width: 36em){.duet-hero.duet-hero-product .duet-hero-wrapper.fluid{padding:0 28px}}@media (min-width: 62em){.duet-hero.duet-hero-product .duet-hero-wrapper.fluid{padding:0 56px}}@media (min-width: 76.25em){.duet-hero.duet-hero-product .duet-hero-wrapper.fluid{max-width:1110px;padding:0}}@media (min-width: 48em){.duet-hero.duet-hero-product .duet-hero-wrapper.fluid .duet-hero-text{width:60%}}@media (min-width: 62em){.duet-hero.duet-hero-product .duet-hero-wrapper.fluid .duet-hero-text{width:50%}}@media (min-width: 76.25em){.duet-hero.duet-hero-product .duet-hero-wrapper.fluid .duet-hero-text{width:47%}}.duet-hero.duet-hero-product .duet-hero-wrapper.narrow{max-width:888px}@media (min-width: 36em){.duet-hero.duet-hero-product .duet-hero-wrapper.narrow{padding:0 48px}}@media (min-width: 48em){.duet-hero.duet-hero-product .duet-hero-wrapper.narrow{padding:0 72px}}@media (min-width: 48em){.duet-hero.duet-hero-product .duet-hero-wrapper.narrow .duet-hero-text{width:60%}}@media (min-width: 62em){.duet-hero.duet-hero-product .duet-hero-wrapper.narrow .duet-hero-text{width:47%}}.duet-hero.duet-hero-product.duet-theme-turva{background:rgb(255, 255, 255)}.duet-hero.duet-hero-product.duet-theme-turva .background .background-mask{position:absolute;top:0;left:0;display:block;width:721px;height:256.85px;pointer-events:none;background-image:url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNzIxIiBoZWlnaHQ9IjI1NyIgdmlld0JveD0iMCAwIDcyMSAyNTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMF8yODIwXzY5OTkxKSI+CjxwYXRoIGQ9Ik04MC4xNzA1IDIzLjE4MTVDOTEuOTY5OSAxOC44NjU5IDEwMi44NyAxMS42NTU5IDExMi45MDkgMS41NjQ0OEMxMjMuNzcgLTguMzA1MjcgMTM0LjM4MiAtMTguMjAxMSAxNDQuODI2IC0yOC4xODgyQzE1NS4yNDMgLTM4LjE2MjIgMTY1LjkwOCAtNDguMDg0MSAxNzYuNzQzIC01Ny45Mjc4QzE3OC44MTYgLTU5LjA0OSAxODAuNDk4IC02MC4yODc3IDE4MS43ODggLTYxLjY1NjdDMTgzLjA2NiAtNjMuMDEyNiAxODUuNDY1IC02Mi4yODI1IDE4OS4wMTIgLTU5LjQ3OTNDMTg0LjczNSAtNTEuMTM1IDE4MC43NTkgLTQyLjk2MDIgMTc3LjAxNyAtMzQuOTAyN0MxNzMuMjg4IC0yNi44NDUyIDE2Ny42ODEgLTE5LjEyNjggMTYwLjIxMSAtMTEuNzYwM0MxNTIuNzUzIC00LjM4MDgzIDE0NC45NTYgMy4zMTE1MiAxMzYuODQ3IDExLjM2OUMxMjguNzI0IDE5LjQyNjUgMTIwLjk2NiAyNy4xNDUgMTEzLjQ4MyAzNC40OTg0Qzk3LjQ5OCA0OS44MTggNzkuNjYyIDU2LjAyNDEgNjAuMDAwOCA1My4xNjg4QzQwLjI4NzQgNTAuMzEzNSAyNS41NDE0IDM5LjA3NDcgMTUuNjk3NyAxOS40Nzg2QzMuOTI0NDUgLTIuMzcyOTkgLTEuMjI1NTUgLTI0LjQ3MjQgMC4yNDc3NDMgLTQ2Ljc4MDNDMS4yNTE2NyAtNjcuNDg0NiAzLjQwMjkzIC04Ny43OTc4IDYuODA1ODQgLTEwNy43NzJDMTAuMTk1NyAtMTI3LjczMyAxNS43MTA4IC0xNDcuNDg2IDIzLjMzOCAtMTY3LjA0M0MyNi4zMTA3IC0xNzQuMDMxIDI5LjAwOTUgLTE4MC44NSAzMS40NzM3IC0xODcuNTY0QzMzLjkxMTggLTE5NC4yMjcgMzYuNTMyNCAtMjAwLjY2OCAzOS4yNTc0IC0yMDYuODQ4QzQxLjgxMjggLTIwOS41NzIgNDMuNDY4NiAtMjEyLjEyOCA0NC4xODU3IC0yMTQuNTRDNTMuMDI1NSAtMjI5LjM3NyA2Mi44MyAtMjM3Ljk5NSA3My42Mzg1IC0yNDAuNDMzQzg0LjM5NDggLTI0Mi44NzEgOTguMTM2OSAtMjM5LjgyMSAxMTQuODEyIC0yMzEuMzJDMTI3Ljk0MiAtMjI1LjYwOSAxMzMuMzkyIC0yMTYuMTA1IDEzMS4xNDkgLTIwMi43OTNDMTMwLjE3MSAtMTkwLjgzNyAxMjcuOTk0IC0xNzkuMjU5IDEyNC42MTcgLTE2OC4wMkMxMjAuMDQxIC0xNTIuNzc5IDExNS40MzggLTEzNy41NTEgMTEwLjg0OSAtMTIyLjMyMkMxMDYuMjczIC0xMDcuMDgxIDEwMS4yNzkgLTkxLjk2OTkgOTUuODk0MyAtNzcuMDAyM0M4NS41OTQzIC00OC42MDU3IDc5LjQyNzQgLTE5LjQyNjcgNzcuNDA2NSAxMC41NjA2Qzc3LjcxOTQgMTIuNDEyIDc4LjA0NTMgMTQuMjYzNSA3OC4zNTgzIDE2LjA4ODhDNzguNjcxMiAxNy45NDAyIDc5LjI3MDkgMjAuMyA4MC4xNzA1IDIzLjE5NDRNMTEwLjkxNCAtMjk2Ljc1N0MxMDkuNTQ1IC0yOTguMDM1IDEwNy4zMTYgLTI5OS4zNTIgMTA0LjIzOSAtMzAwLjczNEMxMDEuMTYyIC0zMDIuMDkgOTguMjQxMiAtMzA0LjA1OSA5NS41NDIzIC0zMDYuNjI3QzkwLjA3OTQgLTMxMS43NzcgODYuOTc2MyAtMzE4LjE2NiA4Ni4yMzMyIC0zMjUuODE5Qzg1LjQ2NCAtMzMzLjQ3MiA4Ny4zODA1IC0zNDAuNTUyIDkxLjk2OTkgLTM0Ny4wNThDOTMuMjIxNSAtMzQ4LjQxNCA5NC4xNDcyIC0zNDkuMjM1IDk0LjY4MTggLTM0OS41MjJDOTUuMTkwMyAtMzQ5Ljc5NiA5Ni4xMDI5IC0zNTAuNjA0IDk3LjM5MzcgLTM1MS45OTlDMTA5LjY3NSAtMzU3LjkwNiAxMjIuNDE0IC0zNTYuNjkzIDEzNS42MzQgLTM0OC4zMzZDMTQ2Ljk1MSAtMzQyLjMyNSAxNTIuMDg4IC0zMzMuMzE2IDE1MS4xMzYgLTMyMS4zNkwxNDguMjI5IC0zMTEuNzM4QzE0NC42NjkgLTI5Ny4wNyAxMzUuNTY5IC0yOTEuNTAzIDEyMC45MTQgLTI5NS4wNjJDMTE5LjA1IC0yOTQuNzIzIDExNS43MzggLTI5NS4yOTcgMTEwLjkxNCAtMjk2Ljc0NCIgZmlsbD0iI0Y1RjVGNyIvPgo8cGF0aCBkPSJNMjQyLjc2NyAyMTUuNTE4QzI0NS4wODggMjEzLjU4OCAyNDcuMjc4IDIxMi4xMDIgMjQ5LjM3NyAyMTAuOTY4QzI1MS40NSAyMDkuODU5IDI1My41MzYgMjA4Ljc1MSAyNTUuNjIyIDIwNy42MDRDMjc0LjIyNyAxOTIuMjg0IDI5MC41NzcgMTc3LjE2IDMwNC43MjMgMTYyLjE5M0MzMTUuNjg4IDE0OC45NDYgMzI2LjYxNCAxMzUuODU2IDMzNy40ODggMTIyLjk4N0MzNDguMzYxIDExMC4xMTkgMzU4Ljg4MyA5Ni45Mzc1IDM2OS4wNjYgODMuNDE3MUMzNzYuNDQ1IDczLjQzMDEgMzg0LjU4MSA2My44NjAyIDM5My40NDcgNTQuNzQ2NkM0MDIuMyA0NS42NDYxIDQxMC44MjYgMzYuMjMyNyA0MTkuMDAxIDI2LjQ4MDNDNDIxLjgwNCAyMi45NzMxIDQyNC4yMjkgMjAuMDAwNCA0MjYuMjg5IDE3LjU0OTNDNDI4LjMyMyAxNS4xMjQzIDQzMC41MDEgMTIuOTMzOCA0MzIuODM1IDExLjAxNzNDNDM0LjkwOCA5LjkwOTA2IDQzNi43NDYgOS41ODMwMSA0MzguMzYzIDEwLjA2NTRDNDM5Ljk1MyAxMC41NDc5IDQ0MS43OTIgMTAuMjQ4IDQ0My45MDQgOS4xMTM3MUM0NDMuMTg3IDExLjUxMjcgNDQyLjgyMiAxMy4zOTAzIDQ0Mi44ODcgMTQuNjk0QzQ0Mi45MjYgMTYuMDIzOSA0NDIuMjg3IDE3LjM2NjggNDQxLjAwOSAxOC43MjI3QzQyNC42NDcgNDYuOTYzIDQwNy42ODQgNzIuODE3MyAzOTAuMTIyIDk2LjMxMTdDMzc2LjY0MSAxMTQuOTU2IDM2My4xNDcgMTMyLjkwOSAzNDkuNjM5IDE1MC4yMjRDMzM2LjEwNiAxNjcuNTI1IDMyMi4yMiAxODUuMzYxIDMwNy45NDQgMjAzLjc1OEMzMDEuNTI5IDIxMC41MzcgMjk1LjM4OCAyMTcuMiAyODkuNDk1IDIyMy43MTlDMjgzLjU4OSAyMzAuMjI1IDI3Ny40MzUgMjM2LjkgMjcxLjAyIDI0My42NjdDMjU4LjkyMSAyNTQuODggMjQ0LjQ4OCAyNTkuMjM0IDIyNy43MzQgMjU2Ljc5NkMxOTYuODYgMjUxLjg4MSAxNzYuMDI1IDIzNi44NzQgMTY1LjIxNyAyMTEuNzg5QzE1NC42OTUgMTg4LjU2OCAxNDkuNTMyIDE2Ni41MDggMTQ5LjcwMiAxNDUuNjA4QzE0Ny45NDIgMTEzLjY3OCAxNDguMzA3IDgxLjk0MzggMTUwLjgxIDUwLjQxOEMxNTMuMyAxOC44NzkyIDE1OC4zMiAtMTIuMzIwNyAxNjUuODY5IC00My4yMDc3QzE4MC4xNzIgLTEwNS4yMDMgMTk4LjU2OCAtMTY2LjQwMyAyMjEuMTExIC0yMjYuODA4QzIzMi4wODkgLTI1Ny41MjYgMjQ0LjQyMyAtMjg3LjYxOCAyNTguMSAtMzE3LjA5NkMyNzEuNzc2IC0zNDYuNTc1IDI4Ni4zNzkgLTM3NS41MDcgMzAxLjk3MiAtNDA0LjAwOEMzMTIuOTUgLTQyNS45OSAzMjQuNjMyIC00NDcuMzQ2IDMzNi45NzkgLTQ2OC4wNjNDMzQ5LjMxMyAtNDg4Ljc1NCAzNjIuNDk1IC01MDkuMjI0IDM3Ni40MzIgLTUyOS40NTlDNDAzLjg2NCAtNTY4LjI5OSA0MzQuMTkgLTYwMy42NzEgNDY3LjM5OCAtNjM1LjU3NUM0NzUuNjM4IC02NDIuNjgxIDQ4My45OTUgLTY0OS4zMTcgNDkyLjQwNSAtNjU1LjUxQzUwMC44MjggLTY2MS42NzcgNTEwLjM5NyAtNjY2LjY1OCA1MjEuMTU0IC02NzAuMzk5QzU0NS4yNzQgLTY3Ny45NjEgNTY3LjcxMiAtNjc2Ljg3OSA1ODguMzkxIC02NjcuMTY2QzYwNC43MjcgLTY2MC40NzggNjEzLjY3MSAtNjQ5LjUxMyA2MTUuMjEgLTYzNC4yMTlDNjE3LjU5NiAtNjI0Ljc1NCA2MTguMTk1IC02MTMuNjcxIDYxNi45ODMgLTYwMC45NTlDNjEwLjMyIC01NTguNDgxIDU5Ny44NTYgLTUxNS41MzQgNTc5LjU1MSAtNDcyLjE5NkM1NjUuNDMxIC00MzkuODIzIDU0OS4wODEgLTQwOC43NTMgNTMwLjUyOCAtMzc5LjAwMUM1MTEuOTM2IC0zNDkuMjYxIDQ5Mi42MTQgLTMxOS45NTIgNDcyLjYgLTI5MS4wOTlDNDY1LjQ1NiAtMjgxLjkyIDQ1Ny45NDYgLTI3MS41MDMgNDUwLjEyMyAtMjU5LjkxMkM0MzMuNTc4IC0yMzYuOTc4IDQxNS42MzcgLTIxNS4xMjYgMzk2LjI4OSAtMTk0LjM1N0MzNzYuOTAyIC0xNzMuNTYxIDM1NS44NDUgLTE1NC4zOTYgMzMzLjA2OCAtMTM2LjgyQzMyMC4zODIgLTEyNi42OSAzMTIuNTMzIC0xMTUuMDg2IDMwOS40ODIgLTEwMi4wNDhDMzA0LjE4OSAtODQuNDQ2OCAyOTguOTc0IC02Ny4wNDExIDI5My43OTggLTQ5Ljg0NEMyODguNjIxIC0zMi42NDY5IDI4My43NzEgLTE1LjExMDggMjc5LjI4NiAyLjcxMjFDMjc1LjI3MSAxOC45NzA1IDI3MS4zMDcgMzQuOTgxIDI2Ny40MjIgNTAuODM1MkMyNjMuNTIzIDY2LjY2MzMgMjU5Ljk2NCA4Mi44NDM0IDI1Ni43NyA5OS4zMzY1QzI1My41NDkgMTE1LjgwMyAyNTAuNjgxIDEzMi42MjIgMjQ4LjE1MiAxNDkuNzQxQzI0NS42MDkgMTY2Ljg2IDI0My4xMzIgMTgzLjc5NyAyNDAuNzQ2IDIwMC40OThDMjQxLjA0NiAyMDIuMzM3IDI0MS4zMDcgMjA0LjM5NiAyNDEuNTE1IDIwNi42MTNDMjQxLjY5OCAyMDguODY4IDI0Mi4xMjggMjExLjg0MSAyNDIuNzggMjE1LjUxOE01NjQuMzIyIC02MjIuMDgxQzU2MS43MjggLTYxOS4zNDMgNTU4LjExNiAtNjE2LjA4MyA1NTMuNDg4IC02MTIuMjM3QzU0Mi4yMzYgLTU5OC4xNjkgNTMwLjk1OCAtNTgzLjkwNiA1MTkuNjI4IC01NjkuNDU5QzUwOC4yNTkgLTU1NC45ODcgNDk4LjA1IC01MzkuOTQxIDQ4OS4wMTUgLTUyNC4zNzRDNDU5LjIzNiAtNDc0Ljg2OSA0MzIuNzY5IC00MjMuOTU2IDQwOS42MDEgLTM3MS42MDhDMzg2LjQxOSAtMzE5LjI0OCAzNjUuMTkzIC0yNjUuNDQgMzQ1LjkzNiAtMjEwLjE3MkMzNDUuNzAyIC0yMDkuMzc3IDM0NS43MDIgLTIwOC43MTIgMzQ2LjAxNSAtMjA4LjE5QzM0Ni4yNjIgLTIwNy42NTYgMzQ2LjE4NCAtMjA2LjU4NyAzNDUuNzE1IC0yMDUuMDA5QzM0OS4zNzggLTIwNS42MjIgMzUxLjM2IC0yMDYuMzM5IDM1MS42MDggLTIwNy4xNDdDMzU1LjQ2NyAtMjExLjIxNSAzNTkuNTA5IC0yMTUuMjMxIDM2My43NDYgLTIxOS4xOTRDMzY3Ljk5NyAtMjIzLjE0NSAzNzEuNzY1IC0yMjcuNjgyIDM3NS4wNzYgLTIzMi44MTlDNDAyLjg4NiAtMjY3LjE2MSA0MjguNzE0IC0zMDIuMTQyIDQ1Mi41MzUgLTMzNy43MzZDNDc2LjM2OCAtMzczLjMwMyA0OTguNTMzIC00MTAuNjk2IDUxOS4wNjggLTQ0OS44ODhDNTQzLjg1MyAtNDk3LjM3MiA1NTkuNTc3IC01NDYuNzM0IDU2Ni4yNTIgLTU5Ny45MzRDNTY2LjY0MyAtNjAyLjE4NSA1NjYuOTE3IC02MDYuMDE4IDU2Ny4xIC02MDkuNDZDNTY3LjI0MyAtNjEyLjkwMiA1NjYuMzE3IC02MTcuMSA1NjQuMzM2IC02MjIuMDgxIiBmaWxsPSIjRjVGNUY3Ii8+CjxwYXRoIGQ9Ik02OTYuNTE1IDE4OS4wNjRDNzA0LjYzOCAxODQuMzk2IDcxMi42ODIgMTc5LjYxMSA3MjAuNjg4IDE3NC43MzVWMTM0LjA1N0M2OTcuODE5IDE0OC41MDMgNjczLjgwMyAxNTkuNjM3IDY0OC42MDEgMTY3LjQyMUM2MjIuMDgyIDE3NS42MzUgNTk0LjU1OCAxODAuNjY3IDU2Ni4wMTggMTgyLjU1OEM1NTAuOTIgMTgzLjI2MiA1NDEuMjk4IDE4MS44OTMgNTM3LjEgMTc4LjQzOEM1MzIuODc2IDE3NS4wMDkgNTI5LjA5NSAxNjUuNzUyIDUyNS43NTcgMTUwLjc0NUw1MjMuOTU4IDEzMC41NDlDNTIzLjMzMiAxMTguMTI0IDUyNC43NjYgMTA2Ljc1NSA1MjguMzM5IDk2LjQyODlDNTMxLjg1OSA4Ni4xNTUgNTM2LjEyMiA3NS42MjAzIDU0MS4xMTYgNjQuODc3QzU0NS42MTQgNjQuNDg1OSA1NDkuNTY0IDY0LjM2ODUgNTUzLjAzMiA2NC41MzhDNTU2LjQ3NSA2NC42OTQ1IDU2MC40MzggNjQuNTc3MSA1NjQuOTQ5IDY0LjE3MjlDNTg1Ljg3NSA2NC4zNjg1IDYwNy42MzYgNjEuNzQ3OSA2MzAuMjY5IDU2LjI4NDlDNjUyLjA4MiA1MC42MjY1IDY3MC40IDQxLjI3ODIgNjg1LjI3NyAyOC4yNTMzQzY5NC45MzggMTkuNzc4NiA3MDQuMDI1IDEwLjM3ODMgNzEyLjU2NSAwLjA5MTMwODZINjM5LjUyNkM2MjAuMjU2IDE2Ljk4ODUgNTk2Ljk0NCAyNy40ODQxIDU2OS41MzkgMzEuNDYwN0M1NjcuNjYxIDMxLjc3MzYgNTY2LjM1NyAzMS44MTI3IDU2NS41NzUgMzEuNTY1QzU2NC43NTQgMzEuMzMwMyA1NjMuODI4IDMxLjUxMjggNTYyLjgxMSAzMi4wNDc0QzU2MS45OSAzMS44MTI3IDU2MS42NTEgMzEuNDk5OCA1NjEuNzgxIDMxLjA4MjZDNTYxLjg5OCAzMC42OTE1IDU2MS41NDYgMzAuMzY1NSA1NjAuNzUxIDMwLjEzMDhDNTYwLjk5OSAyOS4zMzU1IDU2MC45MDcgMjguODY2MSA1NjAuNTE2IDI4Ljc2MThDNTYwLjA5OSAyOC42MTg0IDU2MC4wMzQgMjguMTYyIDU2MC4yOTUgMjcuMzUzN0M1NjUuMzc5IDE4LjE3NDkgNTcwLjc3NyA5LjEwMDU1IDU3Ni40MzYgMC4wOTEzMDg2SDQzMC4xNzZDNDI0LjIwNCAxMi42NzMgNDE5LjA1NCAyNS45NDU2IDQxNC44MyAzOS45ODc1QzQwNi40NzMgNjEuOTU2NSA0MDQuMjgyIDgyLjI2OTcgNDA4LjI4NSAxMDAuOTY2QzQxMi4wMTQgMTIwLjQ1OCA0MTguODMzIDEzOC40NjMgNDI4LjcyOCAxNTQuOTgyQzQzOC42MTEgMTcxLjUyOCA0NTIuNDU4IDE4NS4wODcgNDcwLjI1NCAxOTUuN0M0OTAuNzM3IDIwOC44ODEgNTEyLjE0NSAyMTcuNzIxIDUzNC40MDEgMjIyLjI0NUM1NTYuNjQ0IDIyNi43NTcgNTc5Ljg2NSAyMjYuNTA5IDYwNC4xMTUgMjIxLjU2N0M2MDkuNjQzIDIyMC42MTYgNjE1LjI2MyAyMTkuNDY4IDYyMC45MjEgMjE4LjA5OUM2MjYuNTY3IDIxNi43NTYgNjMyLjI3NyAyMTUuMTkyIDYzOC4wNTMgMjEzLjQxOUM2NTkuMDU3IDIwNy41MjUgNjc4LjU2MiAxOTkuMzkgNjk2LjU0MSAxODkuMDc3IiBmaWxsPSIjRjVGNUY3Ii8+CjwvZz4KPGRlZnM+CjxjbGlwUGF0aCBpZD0iY2xpcDBfMjgyMF82OTk5MSI+CjxyZWN0IHdpZHRoPSI3MjEiIGhlaWdodD0iMjU2Ljg0OCIgZmlsbD0id2hpdGUiLz4KPC9jbGlwUGF0aD4KPC9kZWZzPgo8L3N2Zz4K\");background-repeat:no-repeat}@media (min-width: 48em){.duet-hero.duet-hero-product.duet-theme-turva .background .background-mask{left:181px}}.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{margin:0 auto;border-radius:0;-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;transform:none}@media (max-width: 35.9375em){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{top:-120px;width:385px}}@media (max-width: 22.5em){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{top:-95px;width:320px}}@media (min-width: 36em){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{top:-135px;width:420px}}@media (min-width: 48em){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{top:-110px;right:-110px;width:418px}}@media (min-width: 860px){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{right:-75px}}@media (min-width: 960px){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{right:-40px}}@media (min-width: 62em){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{top:-130px;right:-100px;width:552px}}@media (min-width: 1100px){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{right:-35px}}@media (min-width: 76.25em){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{top:-215px;width:736px}.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image.narrow{right:-115px}}@media (min-width: 1300px){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image.narrow{right:-50px}}@media (min-width: 1400px){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image.narrow{right:-35px}}.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image .brand-shaped-image-bg{transform:translate(-50%, 0)}.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-icon{background:rgba(230, 23, 64, 0.9);-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;transform:rotate(0deg)}.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-icon duet-icon{position:relative;top:-6px;transform:rotate(0deg)}@media (min-width: 48em){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-icon duet-icon{top:-8px}}@media (min-width: 62em){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-icon duet-icon{top:-12px}}.duet-hero.duet-hero-content{padding:0 0 48px;padding-top:236px;background:rgb(255, 255, 255)}@media (min-width: 48em){.duet-hero.duet-hero-content{padding-top:384px}}.duet-hero.duet-hero-content:not(.duet-hero-has-image){padding:72px 0 48px}.duet-hero.duet-hero-content .background-area{position:absolute;width:100%}.duet-hero.duet-hero-content .background{position:absolute;top:-236px;width:100%;height:600px;overflow:hidden;pointer-events:none}.duet-hero.duet-hero-content .background *{pointer-events:auto}.duet-hero.duet-hero-content .background .background-mask{display:none}@media (min-width: 48em){.duet-hero.duet-hero-content .background{top:-384px}}.duet-hero.duet-hero-content .background .brand-shaped-image{position:absolute;top:-165px;right:0;left:30px;z-index:0;width:375px;height:375px;margin:0 auto;overflow:hidden;border-radius:20%;transform:rotate(7deg)}@media (min-width: 48em){.duet-hero.duet-hero-content .background .brand-shaped-image{top:-325px;left:250px;width:687px;height:687px}}.duet-hero.duet-hero-content .background .brand-shaped-image .brand-shaped-image-wrapper{position:relative;width:100%;height:100%}.duet-hero.duet-hero-content .background .brand-shaped-image .brand-shaped-image-bg{position:absolute;bottom:0;left:50%;z-index:1;width:600px;height:256px;transform:rotate(-7deg) translate(-50%, 0)}.duet-hero.duet-hero-content .background .brand-shaped-image .brand-shaped-image-bg picture{display:block}.duet-hero.duet-hero-content .background .brand-shaped-image .brand-shaped-image-bg img{position:absolute;top:0;left:0;width:100%;height:auto}@media (min-width: 48em){.duet-hero.duet-hero-content .background .brand-shaped-image .brand-shaped-image-bg{width:733px;height:413px}}.duet-hero.duet-hero-content .background .brand-shape{position:absolute;top:-25px;right:0;left:-300px;width:240px;height:240px;margin-right:auto;margin-left:auto;background:rgb(0, 119, 179);border-radius:20%;mix-blend-mode:normal;opacity:0.07;transform:rotate(7deg)}@media (min-width: 48em){.duet-hero.duet-hero-content .background .brand-shape{top:80px;left:-400px;width:373px;height:373px}}.duet-hero.duet-hero-content .duet-hero-wrapper{max-width:100%;margin:0 auto}.duet-hero.duet-hero-content .duet-hero-wrapper.fluid,.duet-hero.duet-hero-content .duet-hero-wrapper.narrow{padding:0 16px}@media (min-width: 36em){.duet-hero.duet-hero-content .duet-hero-wrapper.fluid{padding:0 28px}}@media (min-width: 62em){.duet-hero.duet-hero-content .duet-hero-wrapper.fluid{padding:0 56px}}@media (min-width: 76.25em){.duet-hero.duet-hero-content .duet-hero-wrapper.fluid{max-width:1110px;padding:0}}.duet-hero.duet-hero-content .duet-hero-wrapper.narrow{max-width:888px}@media (min-width: 36em){.duet-hero.duet-hero-content .duet-hero-wrapper.narrow{padding:0 48px}}@media (min-width: 48em){.duet-hero.duet-hero-content .duet-hero-wrapper.narrow{padding:0 72px}}.duet-hero.duet-hero-content .duet-hero-text{max-width:100%}@media (min-width: 62em){.duet-hero.duet-hero-content .duet-hero-text{width:80%}}.duet-hero.duet-hero-content .duet-hero-text .duet-hero-pre{margin-top:1rem;margin-bottom:0.5rem}@media (min-width: 62em){.duet-hero.duet-hero-content .duet-hero-text .duet-hero-pre{margin-top:1.5rem;margin-bottom:0}}@media (min-width: 62em){.duet-hero{min-height:290px;padding:111.6px 56px;overflow:visible}}.duet-hero-icon{display:inline-block;vertical-align:top}@media (min-width: 62em){.duet-hero-icon{margin-top:-8px}}@media (min-width: 62em){.duet-hero-heading{margin-top:12px}}@media (min-width: 62em){.duet-hero-heading-has-pre{margin-top:0}}.duet-hero-wrapper{position:relative;width:100%;max-width:1110px;margin:0 auto;text-align:center}.duet-hero-left-align .duet-hero-wrapper{text-align:left}.duet-hero-with-image .duet-hero-wrapper{position:static}@media (min-width: 62em){.duet-hero-wrapper{text-align:left}}.duet-hero-text{max-width:50rem;margin:0 auto}.duet-hero-text-center .duet-hero-text{text-align:center !important}@media (min-width: 48em){.duet-hero-text{width:80%}.duet-hero-left-align .duet-hero-text{margin:0}}@media (min-width: 62em){.duet-hero-text{width:52%;max-width:none;margin-top:-10px;margin-left:0}.duet-hero-text-center .duet-hero-text{margin-left:auto}}.duet-hero:not(.duet-hero-with-image) .duet-hero-image{position:relative;width:100%;max-width:400px;height:0;padding-bottom:50%;margin:28px auto 0}.duet-hero:not(.duet-hero-with-image) .duet-hero-image picture{display:block}.duet-hero:not(.duet-hero-with-image) .duet-hero-image img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;object-position:50% 50%}.duet-hero:not(.duet-hero-with-image) .duet-hero-image img.cover{object-fit:cover}.duet-hero:not(.duet-hero-with-image) .duet-hero-image img.center{object-position:center}@media (min-width: 36em){.duet-hero:not(.duet-hero-with-image) .duet-hero-image{padding-bottom:40%}}@media (min-width: 48em){.duet-hero:not(.duet-hero-with-image) .duet-hero-image{max-width:420px;padding-bottom:34%}.duet-hero-light .duet-hero:not(.duet-hero-with-image) .duet-hero-image{max-width:540px}}@media (min-width: 62em){.duet-hero:not(.duet-hero-with-image) .duet-hero-image{position:absolute;top:50%;right:0;padding-bottom:30%;margin:0;transform:translateY(-50%)}.duet-hero-light .duet-hero:not(.duet-hero-with-image) .duet-hero-image{right:-60px;padding-bottom:26%}.duet-hero-gray .duet-hero:not(.duet-hero-with-image) .duet-hero-image{right:-34px;padding-bottom:20%}}@media (min-width: 62em){.duet-hero-gray:not(.duet-hero-with-image) .duet-hero-image{right:-34px;padding-bottom:20%}}.duet-hero-image-wrapper{position:relative;width:80%;height:0;padding-bottom:80%;margin:-30px auto 36px;overflow:hidden;border-radius:28%;box-shadow:0 0 20px rgba(255, 255, 255, 0.5);transform:rotate(10deg)}@media screen and (min-width: 440px){.duet-hero-image-wrapper{width:300px;padding-bottom:300px}}@media (min-width: 62em){.duet-hero-image-wrapper{position:absolute;top:-60px;right:-50px;width:470px;padding-bottom:470px;margin:0}}@media (min-width: 76.25em){.duet-hero-image-wrapper{top:-70px;right:-60px;width:600px;padding-bottom:600px}}@media screen and (min-width: 1450px){.duet-hero-image-wrapper{top:-70px;right:25px}}.duet-hero-image-wrapper .duet-hero-image{position:absolute;top:-5%;left:-5%;width:110%;height:110%;transform:rotate(-10deg)}.duet-hero-image-wrapper .duet-hero-image picture{display:block}.duet-hero-image-wrapper .duet-hero-image img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%}.duet-hero-image-mask{position:relative;margin:-48px auto 0;overflow:hidden}@media (min-width: 62em){.duet-hero-image-mask{position:absolute;top:0;right:0;width:470px;height:460px;margin:0}}@media (min-width: 76.25em){.duet-hero-image-mask{width:650px;height:580px}}@media screen and (min-width: 1450px){.duet-hero-image-mask{right:50%;transform:translateX(110%)}}duet-heading+duet-button{margin-top:12px !important}.duet-hero-links{width:calc(100% + 56px);margin-top:48px;margin-left:-28px}.duet-hero-minimal .duet-hero-links{margin-top:28px}@media (min-width: 36em){.duet-hero-links{margin-top:72px}.duet-hero-minimal .duet-hero-links{margin-top:28px}}@media (min-width: 62em){.duet-hero-links{width:auto;margin:36px 0 0}.duet-hero-minimal .duet-hero-links{margin-top:28px}}.duet-hero-link{display:flex;align-items:center;width:100%;padding:16px 16px 8px;font-weight:600;line-height:1.25;color:rgb(0, 119, 179);text-align:left;-webkit-hyphens:auto;hyphens:auto;text-decoration:none;border-bottom:1px solid rgb(212, 223, 229);transition:background-color 300ms ease}.duet-hero-link:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-hero-link:focus,.duet-hero-link:focus.duet-theme-turva{outline:2px solid;outline-offset:2px;outline-color:rgba(53, 79, 101, 0.8)}.duet-hero-link:hover,.duet-hero-link:hover .duet-hero-action-arrow{color:rgb(0, 75, 129) !important;background:transparent !important}@media (min-width: 36em){.duet-hero-link{padding:16px 16px 16px 28px}}@media (min-width: 62em){.duet-hero-link{display:inline-flex;width:auto;max-width:350px;padding:0;margin:0 28px 16px 0;border:0;border-radius:4px}}.duet-hero-link:hover{background:rgba(0, 0, 0, 0.02)}@media (min-width: 62em){.duet-hero-link:hover{background:transparent}}.duet-hero-link:first-of-type{border-top:1px solid rgb(212, 223, 229)}@media (min-width: 62em){.duet-hero-link:first-of-type{margin-top:0;border:0}}.duet-hero-link:last-of-type{margin-bottom:-48px}@media (min-width: 62em){.duet-hero-link:last-of-type{margin-right:0;margin-bottom:0}}.duet-hero-link span{margin-top:-8px}@media (min-width: 36em){.duet-hero-link span{margin:0}}.duet-hero-action-icon{margin-right:8px}@media (min-width: 36em){.duet-hero-action-icon{margin-right:12px}}.duet-hero-action-arrow{margin:0 0 0 8px;color:rgb(0, 119, 179)}@media (max-width: 35.9375em){.duet-hero-action-arrow{margin-top:-9px}}.duet-hero-back{margin-bottom:28px !important;display:flex;align-items:center;justify-content:center}.duet-hero-left-align .duet-hero-back{align-items:self-start;justify-content:flex-start}@media (min-width: 36em){.duet-hero-back{margin-bottom:36px !important}.duet-hero-minimal .duet-hero-back{margin-bottom:28px !important}}@media (min-width: 62em){.duet-hero-back{display:block}}.duet-hero-pre{display:inline-block;width:auto;margin-right:8px}.duet-hero-pre+duet-heading{margin-top:0 !important}.duet-hero.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\";background:rgb(230, 23, 64)}.duet-hero.duet-hero-light.duet-theme-turva,.duet-hero.duet-hero-with-image.duet-theme-turva{color:rgb(23, 42, 59);background-image:linear-gradient(rgb(253, 247, 242), #fefbf9)}.duet-hero.duet-hero-light.duet-theme-turva::before,.duet-hero.duet-hero-with-image.duet-theme-turva::before{background-image:linear-gradient(#fefbf9, rgb(255, 255, 255))}.duet-hero.duet-hero-gray.duet-theme-turva{background:rgb(245, 246, 247)}.duet-hero.duet-hero-campaign.duet-theme-turva,.duet-hero.duet-hero-section.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\";background:none}.duet-hero.duet-hero-campaign.duet-theme-turva .brand-shape,.duet-hero.duet-hero-section.duet-theme-turva .brand-shape{top:125px;left:-10px;width:350px;height:350px;background:rgb(255, 255, 255);-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;transform:none}@media (min-width: 22.5em){.duet-hero.duet-hero-campaign.duet-theme-turva .brand-shape,.duet-hero.duet-hero-section.duet-theme-turva .brand-shape{top:143px;left:-30px;width:450px;height:450px}}@media (min-width: 36em){.duet-hero.duet-hero-campaign.duet-theme-turva .brand-shape,.duet-hero.duet-hero-section.duet-theme-turva .brand-shape{top:180px;left:0;width:550px;height:550px}}@media (min-width: 48em){.duet-hero.duet-hero-campaign.duet-theme-turva .brand-shape,.duet-hero.duet-hero-section.duet-theme-turva .brand-shape{top:220px;width:712.18px;height:712.18px}}@media (min-width: 62em){.duet-hero.duet-hero-campaign.duet-theme-turva .brand-shape,.duet-hero.duet-hero-section.duet-theme-turva .brand-shape{top:230px}}@media (min-width: 76.25em){.duet-hero.duet-hero-campaign.duet-theme-turva .brand-shape,.duet-hero.duet-hero-section.duet-theme-turva .brand-shape{top:260px}}@media (min-width: 106.25em){.duet-hero.duet-hero-campaign.duet-theme-turva .brand-shape,.duet-hero.duet-hero-section.duet-theme-turva .brand-shape{top:290px}}.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-text duet-paragraph,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-text duet-paragraph{width:98%}@media (min-width: 22.5em){.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-text duet-paragraph,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-text duet-paragraph{width:90%}}@media (min-width: 25em){.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-text duet-paragraph,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-text duet-paragraph{width:78%}}@media (min-width: 30em){.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-text duet-paragraph,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-text duet-paragraph{width:66%}}@media (min-width: 36em){.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-text duet-paragraph,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-text duet-paragraph{width:65%}}@media (min-width: 48em){.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-text duet-paragraph,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-text duet-paragraph{width:70%}}@media (min-width: 62em){.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-text duet-paragraph,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-text duet-paragraph{width:52%}}.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-heading,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-heading{margin-bottom:2rem}@media (min-width: 22.5em){.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-heading,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-heading{margin-bottom:2rem}}@media (min-width: 36em){.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-heading,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-heading{margin-bottom:4rem}}@media (min-width: 48em){.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-heading,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-heading{margin-bottom:6rem}}@media (min-width: 62em){.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-heading,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-heading{margin-bottom:7rem}}@media (min-width: 76.25em){.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-heading,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-heading{margin-bottom:8rem}}@media (min-width: 106.25em){.duet-hero.duet-hero-campaign.duet-theme-turva .duet-hero-heading,.duet-hero.duet-hero-section.duet-theme-turva .duet-hero-heading{margin-botton:9rem}}.duet-hero.duet-hero-campaign.duet-theme-turva .background-area .brand-shape,.duet-hero.duet-hero-section.duet-theme-turva .background-area .brand-shape{left:0;background-color:rgb(255, 255, 255);border-radius:24px;mask-image:none}.duet-hero.duet-hero-product.duet-theme-turva{display:flex;flex-direction:column;gap:20px;min-height:auto;padding-top:0;padding-bottom:72px;margin:0 auto}@media (min-width: 62em){.duet-hero.duet-hero-product.duet-theme-turva{flex-direction:row-reverse;gap:40px;padding-top:72px;padding-right:56px;padding-left:56px}}@media (min-width: 76.25em){.duet-hero.duet-hero-product.duet-theme-turva{max-width:1110px;padding-right:0;padding-left:0}}.duet-hero.duet-hero-product.duet-theme-turva .background-area{position:relative;height:auto;overflow:visible}.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.narrow,.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.fluid{position:relative;top:0;width:100%;height:auto;aspect-ratio:576/250;padding:0;overflow:visible;}@media (min-width: 36em){.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.narrow,.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.fluid{height:250px;aspect-ratio:auto}}@media (min-width: 48em){.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.narrow,.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.fluid{padding-right:28px;padding-left:28px}}@media (min-width: 62em){.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.narrow,.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.fluid{height:auto;aspect-ratio:53/32;padding-right:0;padding-left:0}}.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.narrow .background,.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.fluid .background{position:relative;top:auto;height:100%}.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.narrow .background .background-mask,.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.fluid .background .background-mask{display:none;background-image:none}.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.narrow .background .brand-shaped-image,.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.fluid .background .brand-shaped-image{position:static;width:100%;height:100%;border-radius:0;mask-image:none}.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.narrow .background .brand-shaped-image .brand-shaped-image-bg,.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.fluid .background .brand-shaped-image .brand-shaped-image-bg{position:static;width:100%;height:100%;transform:none}.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.narrow .background .brand-shaped-image .brand-shaped-image-bg picture,.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.fluid .background .brand-shaped-image .brand-shaped-image-bg picture{display:block;width:100%;height:100%}.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.narrow .background .brand-shaped-image .brand-shaped-image-bg img,.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.fluid .background .brand-shaped-image .brand-shaped-image-bg img{position:static;width:100%;height:100%;object-fit:cover;object-position:0 50%}@media (min-width: 48em){.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.narrow .background .brand-shaped-image,.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.fluid .background .brand-shaped-image{border-radius:0 0 12px 12px}}@media (min-width: 62em){.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.narrow .background .brand-shaped-image,.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.fluid .background .brand-shaped-image{border-radius:12px}}.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.narrow .background .brand-shaped-icon,.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.fluid .background .brand-shaped-icon{top:auto;right:20px;bottom:-16px;width:auto;height:auto;padding:0;background-color:rgb(23, 42, 59);border-radius:8px;mask-image:none}.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.narrow .background .brand-shaped-icon duet-icon,.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.fluid .background .brand-shaped-icon duet-icon{top:0;width:62px;height:62px}@media (min-width: 36em){.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.narrow .background .brand-shaped-icon,.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.fluid .background .brand-shaped-icon{right:40px;bottom:-24px;padding:8px}.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.narrow .background .brand-shaped-icon duet-icon,.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.fluid .background .brand-shaped-icon duet-icon{width:80px;height:80px}}@media (min-width: 48em){.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.narrow .background .brand-shaped-icon,.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.fluid .background .brand-shaped-icon{right:68px}}@media (min-width: 62em){.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.narrow .background .brand-shaped-icon,.duet-hero.duet-hero-product.duet-theme-turva .background-area .background-container.fluid .background .brand-shaped-icon{right:40px}}.duet-hero.duet-hero-product.duet-theme-turva .duet-hero-wrapper .duet-hero-text{width:100%}@media (min-width: 48em){.duet-hero.duet-hero-product.duet-theme-turva .duet-hero-wrapper{margin-top:28px}}@media (min-width: 62em){.duet-hero.duet-hero-product.duet-theme-turva .duet-hero-wrapper{padding:0}}.duet-hero.duet-hero-content.duet-theme-turva{padding:0;margin:20px auto;background:rgb(255, 255, 255)}.duet-hero.duet-hero-content.duet-theme-turva .background-mask{position:absolute;top:0;left:0;display:block;width:721px;height:256.85px;pointer-events:none;background-image:url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNzIxIiBoZWlnaHQ9IjI1NyIgdmlld0JveD0iMCAwIDcyMSAyNTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMF8yODIwXzY5OTkxKSI+CjxwYXRoIGQ9Ik04MC4xNzA1IDIzLjE4MTVDOTEuOTY5OSAxOC44NjU5IDEwMi44NyAxMS42NTU5IDExMi45MDkgMS41NjQ0OEMxMjMuNzcgLTguMzA1MjcgMTM0LjM4MiAtMTguMjAxMSAxNDQuODI2IC0yOC4xODgyQzE1NS4yNDMgLTM4LjE2MjIgMTY1LjkwOCAtNDguMDg0MSAxNzYuNzQzIC01Ny45Mjc4QzE3OC44MTYgLTU5LjA0OSAxODAuNDk4IC02MC4yODc3IDE4MS43ODggLTYxLjY1NjdDMTgzLjA2NiAtNjMuMDEyNiAxODUuNDY1IC02Mi4yODI1IDE4OS4wMTIgLTU5LjQ3OTNDMTg0LjczNSAtNTEuMTM1IDE4MC43NTkgLTQyLjk2MDIgMTc3LjAxNyAtMzQuOTAyN0MxNzMuMjg4IC0yNi44NDUyIDE2Ny42ODEgLTE5LjEyNjggMTYwLjIxMSAtMTEuNzYwM0MxNTIuNzUzIC00LjM4MDgzIDE0NC45NTYgMy4zMTE1MiAxMzYuODQ3IDExLjM2OUMxMjguNzI0IDE5LjQyNjUgMTIwLjk2NiAyNy4xNDUgMTEzLjQ4MyAzNC40OTg0Qzk3LjQ5OCA0OS44MTggNzkuNjYyIDU2LjAyNDEgNjAuMDAwOCA1My4xNjg4QzQwLjI4NzQgNTAuMzEzNSAyNS41NDE0IDM5LjA3NDcgMTUuNjk3NyAxOS40Nzg2QzMuOTI0NDUgLTIuMzcyOTkgLTEuMjI1NTUgLTI0LjQ3MjQgMC4yNDc3NDMgLTQ2Ljc4MDNDMS4yNTE2NyAtNjcuNDg0NiAzLjQwMjkzIC04Ny43OTc4IDYuODA1ODQgLTEwNy43NzJDMTAuMTk1NyAtMTI3LjczMyAxNS43MTA4IC0xNDcuNDg2IDIzLjMzOCAtMTY3LjA0M0MyNi4zMTA3IC0xNzQuMDMxIDI5LjAwOTUgLTE4MC44NSAzMS40NzM3IC0xODcuNTY0QzMzLjkxMTggLTE5NC4yMjcgMzYuNTMyNCAtMjAwLjY2OCAzOS4yNTc0IC0yMDYuODQ4QzQxLjgxMjggLTIwOS41NzIgNDMuNDY4NiAtMjEyLjEyOCA0NC4xODU3IC0yMTQuNTRDNTMuMDI1NSAtMjI5LjM3NyA2Mi44MyAtMjM3Ljk5NSA3My42Mzg1IC0yNDAuNDMzQzg0LjM5NDggLTI0Mi44NzEgOTguMTM2OSAtMjM5LjgyMSAxMTQuODEyIC0yMzEuMzJDMTI3Ljk0MiAtMjI1LjYwOSAxMzMuMzkyIC0yMTYuMTA1IDEzMS4xNDkgLTIwMi43OTNDMTMwLjE3MSAtMTkwLjgzNyAxMjcuOTk0IC0xNzkuMjU5IDEyNC42MTcgLTE2OC4wMkMxMjAuMDQxIC0xNTIuNzc5IDExNS40MzggLTEzNy41NTEgMTEwLjg0OSAtMTIyLjMyMkMxMDYuMjczIC0xMDcuMDgxIDEwMS4yNzkgLTkxLjk2OTkgOTUuODk0MyAtNzcuMDAyM0M4NS41OTQzIC00OC42MDU3IDc5LjQyNzQgLTE5LjQyNjcgNzcuNDA2NSAxMC41NjA2Qzc3LjcxOTQgMTIuNDEyIDc4LjA0NTMgMTQuMjYzNSA3OC4zNTgzIDE2LjA4ODhDNzguNjcxMiAxNy45NDAyIDc5LjI3MDkgMjAuMyA4MC4xNzA1IDIzLjE5NDRNMTEwLjkxNCAtMjk2Ljc1N0MxMDkuNTQ1IC0yOTguMDM1IDEwNy4zMTYgLTI5OS4zNTIgMTA0LjIzOSAtMzAwLjczNEMxMDEuMTYyIC0zMDIuMDkgOTguMjQxMiAtMzA0LjA1OSA5NS41NDIzIC0zMDYuNjI3QzkwLjA3OTQgLTMxMS43NzcgODYuOTc2MyAtMzE4LjE2NiA4Ni4yMzMyIC0zMjUuODE5Qzg1LjQ2NCAtMzMzLjQ3MiA4Ny4zODA1IC0zNDAuNTUyIDkxLjk2OTkgLTM0Ny4wNThDOTMuMjIxNSAtMzQ4LjQxNCA5NC4xNDcyIC0zNDkuMjM1IDk0LjY4MTggLTM0OS41MjJDOTUuMTkwMyAtMzQ5Ljc5NiA5Ni4xMDI5IC0zNTAuNjA0IDk3LjM5MzcgLTM1MS45OTlDMTA5LjY3NSAtMzU3LjkwNiAxMjIuNDE0IC0zNTYuNjkzIDEzNS42MzQgLTM0OC4zMzZDMTQ2Ljk1MSAtMzQyLjMyNSAxNTIuMDg4IC0zMzMuMzE2IDE1MS4xMzYgLTMyMS4zNkwxNDguMjI5IC0zMTEuNzM4QzE0NC42NjkgLTI5Ny4wNyAxMzUuNTY5IC0yOTEuNTAzIDEyMC45MTQgLTI5NS4wNjJDMTE5LjA1IC0yOTQuNzIzIDExNS43MzggLTI5NS4yOTcgMTEwLjkxNCAtMjk2Ljc0NCIgZmlsbD0iI0Y1RjVGNyIvPgo8cGF0aCBkPSJNMjQyLjc2NyAyMTUuNTE4QzI0NS4wODggMjEzLjU4OCAyNDcuMjc4IDIxMi4xMDIgMjQ5LjM3NyAyMTAuOTY4QzI1MS40NSAyMDkuODU5IDI1My41MzYgMjA4Ljc1MSAyNTUuNjIyIDIwNy42MDRDMjc0LjIyNyAxOTIuMjg0IDI5MC41NzcgMTc3LjE2IDMwNC43MjMgMTYyLjE5M0MzMTUuNjg4IDE0OC45NDYgMzI2LjYxNCAxMzUuODU2IDMzNy40ODggMTIyLjk4N0MzNDguMzYxIDExMC4xMTkgMzU4Ljg4MyA5Ni45Mzc1IDM2OS4wNjYgODMuNDE3MUMzNzYuNDQ1IDczLjQzMDEgMzg0LjU4MSA2My44NjAyIDM5My40NDcgNTQuNzQ2NkM0MDIuMyA0NS42NDYxIDQxMC44MjYgMzYuMjMyNyA0MTkuMDAxIDI2LjQ4MDNDNDIxLjgwNCAyMi45NzMxIDQyNC4yMjkgMjAuMDAwNCA0MjYuMjg5IDE3LjU0OTNDNDI4LjMyMyAxNS4xMjQzIDQzMC41MDEgMTIuOTMzOCA0MzIuODM1IDExLjAxNzNDNDM0LjkwOCA5LjkwOTA2IDQzNi43NDYgOS41ODMwMSA0MzguMzYzIDEwLjA2NTRDNDM5Ljk1MyAxMC41NDc5IDQ0MS43OTIgMTAuMjQ4IDQ0My45MDQgOS4xMTM3MUM0NDMuMTg3IDExLjUxMjcgNDQyLjgyMiAxMy4zOTAzIDQ0Mi44ODcgMTQuNjk0QzQ0Mi45MjYgMTYuMDIzOSA0NDIuMjg3IDE3LjM2NjggNDQxLjAwOSAxOC43MjI3QzQyNC42NDcgNDYuOTYzIDQwNy42ODQgNzIuODE3MyAzOTAuMTIyIDk2LjMxMTdDMzc2LjY0MSAxMTQuOTU2IDM2My4xNDcgMTMyLjkwOSAzNDkuNjM5IDE1MC4yMjRDMzM2LjEwNiAxNjcuNTI1IDMyMi4yMiAxODUuMzYxIDMwNy45NDQgMjAzLjc1OEMzMDEuNTI5IDIxMC41MzcgMjk1LjM4OCAyMTcuMiAyODkuNDk1IDIyMy43MTlDMjgzLjU4OSAyMzAuMjI1IDI3Ny40MzUgMjM2LjkgMjcxLjAyIDI0My42NjdDMjU4LjkyMSAyNTQuODggMjQ0LjQ4OCAyNTkuMjM0IDIyNy43MzQgMjU2Ljc5NkMxOTYuODYgMjUxLjg4MSAxNzYuMDI1IDIzNi44NzQgMTY1LjIxNyAyMTEuNzg5QzE1NC42OTUgMTg4LjU2OCAxNDkuNTMyIDE2Ni41MDggMTQ5LjcwMiAxNDUuNjA4QzE0Ny45NDIgMTEzLjY3OCAxNDguMzA3IDgxLjk0MzggMTUwLjgxIDUwLjQxOEMxNTMuMyAxOC44NzkyIDE1OC4zMiAtMTIuMzIwNyAxNjUuODY5IC00My4yMDc3QzE4MC4xNzIgLTEwNS4yMDMgMTk4LjU2OCAtMTY2LjQwMyAyMjEuMTExIC0yMjYuODA4QzIzMi4wODkgLTI1Ny41MjYgMjQ0LjQyMyAtMjg3LjYxOCAyNTguMSAtMzE3LjA5NkMyNzEuNzc2IC0zNDYuNTc1IDI4Ni4zNzkgLTM3NS41MDcgMzAxLjk3MiAtNDA0LjAwOEMzMTIuOTUgLTQyNS45OSAzMjQuNjMyIC00NDcuMzQ2IDMzNi45NzkgLTQ2OC4wNjNDMzQ5LjMxMyAtNDg4Ljc1NCAzNjIuNDk1IC01MDkuMjI0IDM3Ni40MzIgLTUyOS40NTlDNDAzLjg2NCAtNTY4LjI5OSA0MzQuMTkgLTYwMy42NzEgNDY3LjM5OCAtNjM1LjU3NUM0NzUuNjM4IC02NDIuNjgxIDQ4My45OTUgLTY0OS4zMTcgNDkyLjQwNSAtNjU1LjUxQzUwMC44MjggLTY2MS42NzcgNTEwLjM5NyAtNjY2LjY1OCA1MjEuMTU0IC02NzAuMzk5QzU0NS4yNzQgLTY3Ny45NjEgNTY3LjcxMiAtNjc2Ljg3OSA1ODguMzkxIC02NjcuMTY2QzYwNC43MjcgLTY2MC40NzggNjEzLjY3MSAtNjQ5LjUxMyA2MTUuMjEgLTYzNC4yMTlDNjE3LjU5NiAtNjI0Ljc1NCA2MTguMTk1IC02MTMuNjcxIDYxNi45ODMgLTYwMC45NTlDNjEwLjMyIC01NTguNDgxIDU5Ny44NTYgLTUxNS41MzQgNTc5LjU1MSAtNDcyLjE5NkM1NjUuNDMxIC00MzkuODIzIDU0OS4wODEgLTQwOC43NTMgNTMwLjUyOCAtMzc5LjAwMUM1MTEuOTM2IC0zNDkuMjYxIDQ5Mi42MTQgLTMxOS45NTIgNDcyLjYgLTI5MS4wOTlDNDY1LjQ1NiAtMjgxLjkyIDQ1Ny45NDYgLTI3MS41MDMgNDUwLjEyMyAtMjU5LjkxMkM0MzMuNTc4IC0yMzYuOTc4IDQxNS42MzcgLTIxNS4xMjYgMzk2LjI4OSAtMTk0LjM1N0MzNzYuOTAyIC0xNzMuNTYxIDM1NS44NDUgLTE1NC4zOTYgMzMzLjA2OCAtMTM2LjgyQzMyMC4zODIgLTEyNi42OSAzMTIuNTMzIC0xMTUuMDg2IDMwOS40ODIgLTEwMi4wNDhDMzA0LjE4OSAtODQuNDQ2OCAyOTguOTc0IC02Ny4wNDExIDI5My43OTggLTQ5Ljg0NEMyODguNjIxIC0zMi42NDY5IDI4My43NzEgLTE1LjExMDggMjc5LjI4NiAyLjcxMjFDMjc1LjI3MSAxOC45NzA1IDI3MS4zMDcgMzQuOTgxIDI2Ny40MjIgNTAuODM1MkMyNjMuNTIzIDY2LjY2MzMgMjU5Ljk2NCA4Mi44NDM0IDI1Ni43NyA5OS4zMzY1QzI1My41NDkgMTE1LjgwMyAyNTAuNjgxIDEzMi42MjIgMjQ4LjE1MiAxNDkuNzQxQzI0NS42MDkgMTY2Ljg2IDI0My4xMzIgMTgzLjc5NyAyNDAuNzQ2IDIwMC40OThDMjQxLjA0NiAyMDIuMzM3IDI0MS4zMDcgMjA0LjM5NiAyNDEuNTE1IDIwNi42MTNDMjQxLjY5OCAyMDguODY4IDI0Mi4xMjggMjExLjg0MSAyNDIuNzggMjE1LjUxOE01NjQuMzIyIC02MjIuMDgxQzU2MS43MjggLTYxOS4zNDMgNTU4LjExNiAtNjE2LjA4MyA1NTMuNDg4IC02MTIuMjM3QzU0Mi4yMzYgLTU5OC4xNjkgNTMwLjk1OCAtNTgzLjkwNiA1MTkuNjI4IC01NjkuNDU5QzUwOC4yNTkgLTU1NC45ODcgNDk4LjA1IC01MzkuOTQxIDQ4OS4wMTUgLTUyNC4zNzRDNDU5LjIzNiAtNDc0Ljg2OSA0MzIuNzY5IC00MjMuOTU2IDQwOS42MDEgLTM3MS42MDhDMzg2LjQxOSAtMzE5LjI0OCAzNjUuMTkzIC0yNjUuNDQgMzQ1LjkzNiAtMjEwLjE3MkMzNDUuNzAyIC0yMDkuMzc3IDM0NS43MDIgLTIwOC43MTIgMzQ2LjAxNSAtMjA4LjE5QzM0Ni4yNjIgLTIwNy42NTYgMzQ2LjE4NCAtMjA2LjU4NyAzNDUuNzE1IC0yMDUuMDA5QzM0OS4zNzggLTIwNS42MjIgMzUxLjM2IC0yMDYuMzM5IDM1MS42MDggLTIwNy4xNDdDMzU1LjQ2NyAtMjExLjIxNSAzNTkuNTA5IC0yMTUuMjMxIDM2My43NDYgLTIxOS4xOTRDMzY3Ljk5NyAtMjIzLjE0NSAzNzEuNzY1IC0yMjcuNjgyIDM3NS4wNzYgLTIzMi44MTlDNDAyLjg4NiAtMjY3LjE2MSA0MjguNzE0IC0zMDIuMTQyIDQ1Mi41MzUgLTMzNy43MzZDNDc2LjM2OCAtMzczLjMwMyA0OTguNTMzIC00MTAuNjk2IDUxOS4wNjggLTQ0OS44ODhDNTQzLjg1MyAtNDk3LjM3MiA1NTkuNTc3IC01NDYuNzM0IDU2Ni4yNTIgLTU5Ny45MzRDNTY2LjY0MyAtNjAyLjE4NSA1NjYuOTE3IC02MDYuMDE4IDU2Ny4xIC02MDkuNDZDNTY3LjI0MyAtNjEyLjkwMiA1NjYuMzE3IC02MTcuMSA1NjQuMzM2IC02MjIuMDgxIiBmaWxsPSIjRjVGNUY3Ii8+CjxwYXRoIGQ9Ik02OTYuNTE1IDE4OS4wNjRDNzA0LjYzOCAxODQuMzk2IDcxMi42ODIgMTc5LjYxMSA3MjAuNjg4IDE3NC43MzVWMTM0LjA1N0M2OTcuODE5IDE0OC41MDMgNjczLjgwMyAxNTkuNjM3IDY0OC42MDEgMTY3LjQyMUM2MjIuMDgyIDE3NS42MzUgNTk0LjU1OCAxODAuNjY3IDU2Ni4wMTggMTgyLjU1OEM1NTAuOTIgMTgzLjI2MiA1NDEuMjk4IDE4MS44OTMgNTM3LjEgMTc4LjQzOEM1MzIuODc2IDE3NS4wMDkgNTI5LjA5NSAxNjUuNzUyIDUyNS43NTcgMTUwLjc0NUw1MjMuOTU4IDEzMC41NDlDNTIzLjMzMiAxMTguMTI0IDUyNC43NjYgMTA2Ljc1NSA1MjguMzM5IDk2LjQyODlDNTMxLjg1OSA4Ni4xNTUgNTM2LjEyMiA3NS42MjAzIDU0MS4xMTYgNjQuODc3QzU0NS42MTQgNjQuNDg1OSA1NDkuNTY0IDY0LjM2ODUgNTUzLjAzMiA2NC41MzhDNTU2LjQ3NSA2NC42OTQ1IDU2MC40MzggNjQuNTc3MSA1NjQuOTQ5IDY0LjE3MjlDNTg1Ljg3NSA2NC4zNjg1IDYwNy42MzYgNjEuNzQ3OSA2MzAuMjY5IDU2LjI4NDlDNjUyLjA4MiA1MC42MjY1IDY3MC40IDQxLjI3ODIgNjg1LjI3NyAyOC4yNTMzQzY5NC45MzggMTkuNzc4NiA3MDQuMDI1IDEwLjM3ODMgNzEyLjU2NSAwLjA5MTMwODZINjM5LjUyNkM2MjAuMjU2IDE2Ljk4ODUgNTk2Ljk0NCAyNy40ODQxIDU2OS41MzkgMzEuNDYwN0M1NjcuNjYxIDMxLjc3MzYgNTY2LjM1NyAzMS44MTI3IDU2NS41NzUgMzEuNTY1QzU2NC43NTQgMzEuMzMwMyA1NjMuODI4IDMxLjUxMjggNTYyLjgxMSAzMi4wNDc0QzU2MS45OSAzMS44MTI3IDU2MS42NTEgMzEuNDk5OCA1NjEuNzgxIDMxLjA4MjZDNTYxLjg5OCAzMC42OTE1IDU2MS41NDYgMzAuMzY1NSA1NjAuNzUxIDMwLjEzMDhDNTYwLjk5OSAyOS4zMzU1IDU2MC45MDcgMjguODY2MSA1NjAuNTE2IDI4Ljc2MThDNTYwLjA5OSAyOC42MTg0IDU2MC4wMzQgMjguMTYyIDU2MC4yOTUgMjcuMzUzN0M1NjUuMzc5IDE4LjE3NDkgNTcwLjc3NyA5LjEwMDU1IDU3Ni40MzYgMC4wOTEzMDg2SDQzMC4xNzZDNDI0LjIwNCAxMi42NzMgNDE5LjA1NCAyNS45NDU2IDQxNC44MyAzOS45ODc1QzQwNi40NzMgNjEuOTU2NSA0MDQuMjgyIDgyLjI2OTcgNDA4LjI4NSAxMDAuOTY2QzQxMi4wMTQgMTIwLjQ1OCA0MTguODMzIDEzOC40NjMgNDI4LjcyOCAxNTQuOTgyQzQzOC42MTEgMTcxLjUyOCA0NTIuNDU4IDE4NS4wODcgNDcwLjI1NCAxOTUuN0M0OTAuNzM3IDIwOC44ODEgNTEyLjE0NSAyMTcuNzIxIDUzNC40MDEgMjIyLjI0NUM1NTYuNjQ0IDIyNi43NTcgNTc5Ljg2NSAyMjYuNTA5IDYwNC4xMTUgMjIxLjU2N0M2MDkuNjQzIDIyMC42MTYgNjE1LjI2MyAyMTkuNDY4IDYyMC45MjEgMjE4LjA5OUM2MjYuNTY3IDIxNi43NTYgNjMyLjI3NyAyMTUuMTkyIDYzOC4wNTMgMjEzLjQxOUM2NTkuMDU3IDIwNy41MjUgNjc4LjU2MiAxOTkuMzkgNjk2LjU0MSAxODkuMDc3IiBmaWxsPSIjRjVGNUY3Ii8+CjwvZz4KPGRlZnM+CjxjbGlwUGF0aCBpZD0iY2xpcDBfMjgyMF82OTk5MSI+CjxyZWN0IHdpZHRoPSI3MjEiIGhlaWdodD0iMjU2Ljg0OCIgZmlsbD0id2hpdGUiLz4KPC9jbGlwUGF0aD4KPC9kZWZzPgo8L3N2Zz4K\");background-repeat:no-repeat}@media (min-width: 48em){.duet-hero.duet-hero-content.duet-theme-turva .background-mask{left:181px}}.duet-hero.duet-hero-content.duet-theme-turva .brand-shaped-image{top:-155px;right:0;left:0;width:420px;height:420px;margin:0 auto;border-radius:0;-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;transform:none}@media (min-width: 48em){.duet-hero.duet-hero-content.duet-theme-turva .brand-shaped-image{top:-230px;width:687px;height:637px}}.duet-hero.duet-hero-content.duet-theme-turva .brand-shaped-image .brand-shaped-image-bg{width:600px;height:280px;transform:translate(-50%, 0)}@media (min-width: 48em){.duet-hero.duet-hero-content.duet-theme-turva .brand-shaped-image .brand-shaped-image-bg{width:733px;height:413px}}.duet-hero.duet-hero-content.duet-theme-turva.duet-hero-narrow .background-area{max-width:888px}@media (min-width: 36em){.duet-hero.duet-hero-content.duet-theme-turva.duet-hero-narrow .background-area{padding:0 48px}}@media (min-width: 48em){.duet-hero.duet-hero-content.duet-theme-turva.duet-hero-narrow .background-area{padding:0 72px}}.duet-hero.duet-hero-content.duet-theme-turva .background-area{position:static;padding:0 16px;margin:0 auto}@media (min-width: 36em){.duet-hero.duet-hero-content.duet-theme-turva .background-area{padding:0 28px}}@media (min-width: 62em){.duet-hero.duet-hero-content.duet-theme-turva .background-area{padding:0 56px}}@media (min-width: 76.25em){.duet-hero.duet-hero-content.duet-theme-turva .background-area{max-width:1110px;padding:0}}.duet-hero.duet-hero-content.duet-theme-turva .background-area .background{position:static;height:auto}.duet-hero.duet-hero-content.duet-theme-turva .background-area .background .background-mask{display:none;background-image:none}.duet-hero.duet-hero-content.duet-theme-turva .background-area .background .brand-shaped-image{position:static;width:auto;height:auto}.duet-hero.duet-hero-content.duet-theme-turva .background-area .background .brand-shaped-image .brand-shaped-image-wrapper{width:auto;height:auto}.duet-hero.duet-hero-content.duet-theme-turva .background-area .background .brand-shaped-image .brand-shaped-image-bg{position:static;width:100%;height:auto;aspect-ratio:5/2;transform:none}.duet-hero.duet-hero-content.duet-theme-turva .background-area .background .brand-shaped-image .brand-shaped-image-bg picture{display:block;width:100%;height:100%}.duet-hero.duet-hero-content.duet-theme-turva .background-area .background .brand-shaped-image .brand-shaped-image-bg img{position:static;width:100%;height:100%;object-fit:cover;object-position:50% 50%}.duet-hero.duet-hero-content.duet-theme-turva .brand-shaped-image{border-radius:12px;mask-image:none}.duet-hero.duet-hero-content.duet-theme-turva .duet-hero-wrapper{margin-top:28px}@media (min-width: 48em){.duet-hero.duet-hero-content.duet-theme-turva .duet-hero-wrapper{margin-top:36px}}.duet-hero.duet-theme-turva .duet-hero-wrapper{position:static;margin-top:16px}@media (min-width: 48em){.duet-hero.duet-theme-turva .duet-hero-wrapper{margin-top:0}}.duet-theme-turva .duet-hero-image-wrapper{padding-bottom:68%;border-radius:44% 47% 38% 54%;transform:none}@media screen and (min-width: 440px){.duet-theme-turva .duet-hero-image-wrapper{width:80%;padding-bottom:68%}}@media (min-width: 62em){.duet-theme-turva .duet-hero-image-wrapper{top:-40px;right:-80px;width:536px;padding-bottom:470px}}@media (min-width: 76.25em){.duet-theme-turva .duet-hero-image-wrapper{top:-70px;right:-60px;width:650px;padding-bottom:600px}}@media screen and (min-width: 1450px){.duet-theme-turva .duet-hero-image-wrapper{right:0}}.duet-theme-turva .duet-hero-image-wrapper .duet-hero-image{top:0;left:0;width:100%;height:100%;transform:none}@media screen and (min-width: 1450px){.duet-theme-turva .duet-hero-image-mask{transform:translateX(108%)}}.duet-theme-turva .duet-hero-link{color:rgb(230, 23, 64)}.duet-theme-turva .duet-hero-link:hover .duet-hero-action-arrow{color:rgb(140, 0, 30) !important}.duet-theme-turva .duet-hero-action-arrow{color:rgb(230, 23, 64)}";
|
|
13083
|
+
const duetHeroCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;display:block;width:100%}.duet-hero{position:relative;display:block;width:100%;padding:48px 28px;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-style:normal;font-weight:400;line-height:1.5;text-transform:none;text-decoration:none;text-shadow:none;background:rgb(8, 42, 77)}.duet-hero.duet-p-0{padding:0 !important}.duet-hero.duet-m-0{margin:0 !important}.duet-hero.duet-hero-text-center{text-align:center !important}.duet-hero.duet-hero-light{padding-bottom:0 !important}@media (min-width: 62em){.duet-hero.duet-hero-light{padding-bottom:28px !important}}.duet-hero.duet-hero-with-image{padding-bottom:20px !important;margin-bottom:-36px}@media (min-width: 48em){.duet-hero.duet-hero-with-image{padding-bottom:28px !important}}@media (min-width: 62em){.duet-hero.duet-hero-with-image{padding-bottom:36px !important;margin-bottom:-20px}}.duet-hero.duet-hero-light,.duet-hero.duet-hero-with-image{color:rgb(8, 42, 77);background-color:rgb(255, 255, 255);background-image:linear-gradient(rgb(240, 247, 250), #f8fbfd)}.duet-hero.duet-hero-light::before,.duet-hero.duet-hero-with-image::before{position:absolute;top:100%;left:0;z-index:-1;width:100%;height:400px;content:\"\";background-image:linear-gradient(#f8fbfd, rgb(255, 255, 255))}.duet-hero.duet-hero-gray{color:rgb(8, 42, 77);background:rgb(245, 248, 250)}@media (min-width: 62em){.duet-hero.duet-hero-gray .duet-hero-text{display:inline-block;vertical-align:top}.duet-hero.duet-hero-gray .duet-hero-icon+.duet-hero-text{margin-left:28px}}@media (min-width: 62em){.duet-hero.duet-hero-gray-with-actions{padding-bottom:65.4545454545px}}@media (min-width: 62em){.duet-hero.duet-hero-gray-with-back{padding-top:72px}}.duet-hero.duet-hero-campaign,.duet-hero.duet-hero-section{padding:0 0 48px;margin:0;background:none}@media (min-width: 48em){.duet-hero.duet-hero-campaign,.duet-hero.duet-hero-section{min-height:490px}}@media (min-width: 62em){.duet-hero.duet-hero-campaign,.duet-hero.duet-hero-section{min-height:540px}}@media (min-width: 76.25em){.duet-hero.duet-hero-campaign,.duet-hero.duet-hero-section{min-height:620px}}.duet-hero.duet-hero-campaign .background-area,.duet-hero.duet-hero-section .background-area{height:1px;margin-bottom:-1px}.duet-hero.duet-hero-campaign .background-container,.duet-hero.duet-hero-section .background-container{position:absolute;right:0;left:0;display:grid;align-items:flex-start;justify-content:center;overflow:hidden}.duet-hero.duet-hero-campaign .background,.duet-hero.duet-hero-section .background{display:flex;align-items:flex-start;justify-content:center;height:220px;margin:0 auto}.duet-hero.duet-hero-campaign .background picture,.duet-hero.duet-hero-section .background picture{display:block;height:100%}@media (min-width: 1440px){.duet-hero.duet-hero-campaign .background picture,.duet-hero.duet-hero-section .background picture{height:auto}}.duet-hero.duet-hero-campaign .background img,.duet-hero.duet-hero-section .background img{display:block;height:100%}.duet-hero.duet-hero-campaign .background img.cover,.duet-hero.duet-hero-section .background img.cover{object-fit:cover}.duet-hero.duet-hero-campaign .background img.center,.duet-hero.duet-hero-section .background img.center{object-position:center}@media (min-width: 1440px){.duet-hero.duet-hero-campaign .background img,.duet-hero.duet-hero-section .background img{width:100%;height:auto}}@media (min-width: 36em){.duet-hero.duet-hero-campaign .background,.duet-hero.duet-hero-section .background{height:300px}}@media (min-width: 48em){.duet-hero.duet-hero-campaign .background,.duet-hero.duet-hero-section .background{height:450px}}@media (min-width: 62em){.duet-hero.duet-hero-campaign .background,.duet-hero.duet-hero-section .background{height:500px}}@media (min-width: 76.25em){.duet-hero.duet-hero-campaign .background,.duet-hero.duet-hero-section .background{height:580px}}@media (min-width: 1600px){.duet-hero.duet-hero-campaign .background,.duet-hero.duet-hero-section .background{width:1600px;overflow:hidden}}.duet-hero.duet-hero-campaign .background .brand-container,.duet-hero.duet-hero-section .background .brand-container{position:relative;width:100%;height:100%;min-height:220px;overflow:hidden}.duet-hero.duet-hero-campaign .background .brand,.duet-hero.duet-hero-section .background .brand{position:absolute;width:100%;height:220px;background-repeat:no-repeat;background-position:center center;background-size:cover}@media (min-width: 36em){.duet-hero.duet-hero-campaign .background .brand,.duet-hero.duet-hero-section .background .brand{left:-200px}}@media (min-width: 62em){.duet-hero.duet-hero-campaign .background .brand,.duet-hero.duet-hero-section .background .brand{left:auto;height:1100px;background-position:140% -200%}}@media (min-width: 76.25em){.duet-hero.duet-hero-campaign .background .brand,.duet-hero.duet-hero-section .background .brand{background-position:right -200%}}.duet-hero.duet-hero-campaign .brand-shape,.duet-hero.duet-hero-section .brand-shape{position:absolute;top:143px;right:0;left:-30px;width:340px;height:340px;margin-right:auto;margin-left:auto;background:rgb(255, 255, 255);border-radius:20%;mix-blend-mode:normal;transform:rotate(8deg)}@media (min-width: 22.5em){.duet-hero.duet-hero-campaign .brand-shape,.duet-hero.duet-hero-section .brand-shape{top:160px;width:450px;height:450px}}@media (min-width: 36em){.duet-hero.duet-hero-campaign .brand-shape,.duet-hero.duet-hero-section .brand-shape{top:215px;left:-50px;width:550px;height:550px}}@media (min-width: 48em){.duet-hero.duet-hero-campaign .brand-shape,.duet-hero.duet-hero-section .brand-shape{top:250px;left:0;width:712.18px;height:712.18px}}@media (min-width: 62em){.duet-hero.duet-hero-campaign .brand-shape,.duet-hero.duet-hero-section .brand-shape{top:240px}}@media (min-width: 76.25em){.duet-hero.duet-hero-campaign .brand-shape,.duet-hero.duet-hero-section .brand-shape{top:280px}}@media (min-width: 76.25em){.duet-hero.duet-hero-campaign .brand-shape,.duet-hero.duet-hero-section .brand-shape{top:310px}}.duet-hero.duet-hero-campaign ::slotted(.duet-heading),.duet-hero.duet-hero-section ::slotted(.duet-heading){font-size:inherit !important;color:inherit !important}.duet-hero.duet-hero-campaign .duet-hero-text,.duet-hero.duet-hero-section .duet-hero-text{width:100%}.duet-hero.duet-hero-campaign .duet-hero-text .duet-hero-heading::part(duet-heading),.duet-hero.duet-hero-section .duet-hero-text .duet-hero-heading::part(duet-heading){font-size:36px}@media (min-width: 36em){.duet-hero.duet-hero-campaign .duet-hero-text .duet-hero-heading::part(duet-heading),.duet-hero.duet-hero-section .duet-hero-text .duet-hero-heading::part(duet-heading){font-size:48px}}@media (min-width: 62em){.duet-hero.duet-hero-campaign .duet-hero-text .duet-hero-heading::part(duet-heading),.duet-hero.duet-hero-section .duet-hero-text .duet-hero-heading::part(duet-heading){font-size:64px}}.duet-hero.duet-hero-campaign .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-campaign .duet-hero-text duet-paragraph,.duet-hero.duet-hero-section .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-section .duet-hero-text duet-paragraph{margin:0 auto}@media (min-width: 22.5em){.duet-hero.duet-hero-campaign .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-campaign .duet-hero-text duet-paragraph,.duet-hero.duet-hero-section .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-section .duet-hero-text duet-paragraph{width:90%}}@media (min-width: 25em){.duet-hero.duet-hero-campaign .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-campaign .duet-hero-text duet-paragraph,.duet-hero.duet-hero-section .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-section .duet-hero-text duet-paragraph{width:80%}}@media (min-width: 30em){.duet-hero.duet-hero-campaign .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-campaign .duet-hero-text duet-paragraph,.duet-hero.duet-hero-section .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-section .duet-hero-text duet-paragraph{width:70%}}@media (min-width: 36em){.duet-hero.duet-hero-campaign .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-campaign .duet-hero-text duet-paragraph,.duet-hero.duet-hero-section .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-section .duet-hero-text duet-paragraph{width:70%}}@media (min-width: 62em){.duet-hero.duet-hero-campaign .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-campaign .duet-hero-text duet-paragraph,.duet-hero.duet-hero-section .duet-hero-text .duet-hero-subheading,.duet-hero.duet-hero-section .duet-hero-text duet-paragraph{width:52%}}.duet-hero.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-hero-section .duet-hero-heading{display:flex;align-items:center;height:6rem;padding:0 1rem;margin:1rem 0 4.5rem}@media (min-width: 22.5em){.duet-hero.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-hero-section .duet-hero-heading{margin:2rem 0 4rem}}@media (min-width: 36em){.duet-hero.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-hero-section .duet-hero-heading{margin:3rem 0 8rem}}@media (min-width: 48em){.duet-hero.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-hero-section .duet-hero-heading{margin:4rem 0 10rem}}@media (min-width: 62em){.duet-hero.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-hero-section .duet-hero-heading{margin:5rem 0 10rem}}@media (min-width: 76.25em){.duet-hero.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-hero-section .duet-hero-heading{margin:6rem 0 10rem}}@media (min-width: 76.25em){.duet-hero.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-hero-section .duet-hero-heading{margin:8rem 0 11rem}}.duet-hero.duet-hero-campaign .duet-hero-wrapper.fluid,.duet-hero.duet-hero-campaign .duet-hero-wrapper.narrow,.duet-hero.duet-hero-section .duet-hero-wrapper.fluid,.duet-hero.duet-hero-section .duet-hero-wrapper.narrow{padding:0 16px}@media (min-width: 48em){.duet-hero.duet-hero-section{min-height:490px}}@media (min-width: 62em){.duet-hero.duet-hero-section{min-height:auto}}@media (min-width: 76.25em){.duet-hero.duet-hero-section{min-height:560px}}@media (min-width: 62em){.duet-hero.duet-hero-section .background img{width:100%;height:auto}}@media (min-width: 62em){.duet-hero.duet-hero-section .background{width:1400px;height:436px;overflow:hidden}}@media (min-width: 76.25em){.duet-hero.duet-hero-section .background{width:1536px;height:516px}}@media (min-width: 106.25em){.duet-hero.duet-hero-section .background{width:1536px}}.duet-hero.duet-hero-product{position:relative;padding:0 0 48px;margin:0;background:rgb(255, 255, 255)}@media (max-width: 35.9375em){.duet-hero.duet-hero-product{padding-top:240px}}@media (max-width: 22.5em){.duet-hero.duet-hero-product{padding-top:200px}}@media (min-width: 36em){.duet-hero.duet-hero-product{padding-top:260px}}@media (min-width: 48em){.duet-hero.duet-hero-product{padding-top:250px}}@media (min-width: 48em){.duet-hero.duet-hero-product{min-height:400px;padding:72px 0}}@media (min-width: 62em){.duet-hero.duet-hero-product{min-height:500px;padding:96px 0}}@media (min-width: 76.25em){.duet-hero.duet-hero-product{min-height:575px;padding:120px 0}}.duet-hero.duet-hero-product .background-area{position:absolute;top:0;width:100%;height:600px;overflow:hidden;pointer-events:none}.duet-hero.duet-hero-product .background-area *{pointer-events:auto}.duet-hero.duet-hero-product .background-container{position:absolute;top:-150px;width:100%;height:600px;overflow:hidden;pointer-events:none}.duet-hero.duet-hero-product .background-container *{pointer-events:auto}@media (min-width: 62em){.duet-hero.duet-hero-product .background-container{top:-48px}}.duet-hero.duet-hero-product .background{position:absolute;top:145px;width:100%;overflow:visible}.duet-hero.duet-hero-product .background .background-mask{display:none}@media (min-width: 48em){.duet-hero.duet-hero-product .background{top:130px}}@media (min-width: 62em){.duet-hero.duet-hero-product .background{top:35px}}@media (min-width: 62em){.duet-hero.duet-hero-product .background{position:absolute;right:0;left:0;max-width:1440px;height:100%;margin:0 auto}}.duet-hero.duet-hero-product .background .brand-shaped-image{position:absolute;top:-160px;right:-15%;z-index:0;width:375px;height:375px;overflow:hidden;border-radius:20%;transform:rotate(7deg)}@media (max-width: 35.9375em){.duet-hero.duet-hero-product .background .brand-shaped-image{top:-160px;right:-60px;width:360px;height:360px}}@media (max-width: 22.5em){.duet-hero.duet-hero-product .background .brand-shaped-image{top:-120px;right:-14px;width:290px;height:290px}}@media (min-width: 36em){.duet-hero.duet-hero-product .background .brand-shaped-image{top:-175px;right:-20px;width:400px;height:400px}}@media (min-width: 48em){.duet-hero.duet-hero-product .background .brand-shaped-image{top:-145px;right:-150px;width:414px;height:414px}}@media (min-width: 860px){.duet-hero.duet-hero-product .background .brand-shaped-image{right:-105px}}@media (min-width: 960px){.duet-hero.duet-hero-product .background .brand-shaped-image{right:-45px}}@media (min-width: 62em){.duet-hero.duet-hero-product .background .brand-shaped-image{top:-190px;right:-150px;width:552px;height:552px}}@media (min-width: 1100px){.duet-hero.duet-hero-product .background .brand-shaped-image{right:-35px}}@media (min-width: 76.25em){.duet-hero.duet-hero-product .background .brand-shaped-image{top:-300px;right:-128px;width:736px;height:736px}.duet-hero.duet-hero-product .background .brand-shaped-image.narrow{right:-160px}}@media (min-width: 1300px){.duet-hero.duet-hero-product .background .brand-shaped-image.narrow{right:-128px}}.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-wrapper{position:relative;width:100%;height:100%}.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-bg{position:absolute;bottom:0;left:50%;z-index:1;width:600px;height:256px;transform:rotate(-7deg) translate(-50%, 0)}.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-bg picture{display:block}.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-bg img{position:absolute;top:50%;left:40px;width:100%;height:auto;transform:translateY(-50%)}@media (max-width: 35.9375em){.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-bg{width:520px;height:240px}}@media (max-width: 22.5em){.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-bg{width:440px;height:200px}}@media (min-width: 36em){.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-bg{width:600px;height:260px}}@media (min-width: 48em){.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-bg{width:500px;height:292px}}@media (min-width: 62em){.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-bg{width:720px;height:420px}}@media (min-width: 76.25em){.duet-hero.duet-hero-product .background .brand-shaped-image .brand-shaped-image-bg{width:950px;height:540px}}.duet-hero.duet-hero-product .background .brand-shape{position:absolute;background:rgb(228, 241, 247);border-radius:25%;mix-blend-mode:normal;transform:rotate(7deg)}@media (max-width: 35.9375em){.duet-hero.duet-hero-product .background .brand-shape{top:20px;right:210px;width:200px;height:200px}}@media (max-width: 22.5em){.duet-hero.duet-hero-product .background .brand-shape{top:24px;right:199px;width:162px;height:162px}}@media (min-width: 36em){.duet-hero.duet-hero-product .background .brand-shape{top:25px;right:290px;width:220px;height:220px}}@media (min-width: 48em){.duet-hero.duet-hero-product .background .brand-shape{top:90px;right:145px;width:225px;height:225px}}@media (min-width: 860px){.duet-hero.duet-hero-product .background .brand-shape{right:195px}}@media (min-width: 960px){.duet-hero.duet-hero-product .background .brand-shape{right:245px}}@media (min-width: 62em){.duet-hero.duet-hero-product .background .brand-shape{top:115px;right:228px;width:300px;height:300px}}@media (min-width: 1100px){.duet-hero.duet-hero-product .background .brand-shape{right:343px}}@media (min-width: 76.25em){.duet-hero.duet-hero-product .background .brand-shape{right:394px;width:400px;height:400px}}.duet-hero.duet-hero-product .background .brand-shaped-icon{position:absolute;display:flex;align-items:center;justify-content:center;background:rgba(0, 119, 179, 0.85);border-radius:25%;mix-blend-mode:normal;transform:rotate(7deg)}@media (max-width: 35.9375em){.duet-hero.duet-hero-product .background .brand-shaped-icon{top:165px;right:25px;width:69px;height:69px}}@media (max-width: 22.5em){.duet-hero.duet-hero-product .background .brand-shaped-icon{top:138px;right:50px;width:57px;height:57px}}@media (min-width: 36em){.duet-hero.duet-hero-product .background .brand-shaped-icon{top:175px;right:125px;width:78px;height:78px}}@media (min-width: 48em){.duet-hero.duet-hero-product .background .brand-shaped-icon{top:220px;right:60px}}@media (min-width: 860px){.duet-hero.duet-hero-product .background .brand-shaped-icon{right:110px}}@media (min-width: 960px){.duet-hero.duet-hero-product .background .brand-shaped-icon{right:160px}}@media (min-width: 62em){.duet-hero.duet-hero-product .background .brand-shaped-icon{top:296px;right:120px;width:105px;height:105px}}@media (min-width: 1100px){.duet-hero.duet-hero-product .background .brand-shaped-icon{right:235px}}@media (min-width: 76.25em){.duet-hero.duet-hero-product .background .brand-shaped-icon{top:345px;right:245px;width:140px;height:140px}}.duet-hero.duet-hero-product .background .brand-shaped-icon duet-icon{transform:rotate(-7deg)}@media (max-width: 35.9375em){.duet-hero.duet-hero-product .background .brand-shaped-icon duet-icon{width:100%;height:100%}}@media (min-width: 36em){.duet-hero.duet-hero-product .background .brand-shaped-icon duet-icon{width:72px;height:72px}}@media (min-width: 48em){.duet-hero.duet-hero-product .background .brand-shaped-icon duet-icon{width:72px;height:72px}}@media (min-width: 62em){.duet-hero.duet-hero-product .background .brand-shaped-icon duet-icon{width:86px;height:86px}}@media (min-width: 76.25em){.duet-hero.duet-hero-product .background .brand-shaped-icon duet-icon{width:104px;height:104px}}.duet-hero.duet-hero-product .duet-hero-wrapper{max-width:100%;margin:0 auto}.duet-hero.duet-hero-product .duet-hero-wrapper .duet-hero-text{margin-top:0}@media (min-width: 62em){.duet-hero.duet-hero-product .duet-hero-wrapper .duet-hero-heading{margin-top:0}}.duet-hero.duet-hero-product .duet-hero-wrapper.fluid,.duet-hero.duet-hero-product .duet-hero-wrapper.narrow{padding:0 16px}@media (min-width: 36em){.duet-hero.duet-hero-product .duet-hero-wrapper.fluid{padding:0 28px}}@media (min-width: 62em){.duet-hero.duet-hero-product .duet-hero-wrapper.fluid{padding:0 56px}}@media (min-width: 76.25em){.duet-hero.duet-hero-product .duet-hero-wrapper.fluid{max-width:1110px;padding:0}}@media (min-width: 48em){.duet-hero.duet-hero-product .duet-hero-wrapper.fluid .duet-hero-text{width:60%}}@media (min-width: 62em){.duet-hero.duet-hero-product .duet-hero-wrapper.fluid .duet-hero-text{width:50%}}@media (min-width: 76.25em){.duet-hero.duet-hero-product .duet-hero-wrapper.fluid .duet-hero-text{width:47%}}.duet-hero.duet-hero-product .duet-hero-wrapper.narrow{max-width:888px}@media (min-width: 36em){.duet-hero.duet-hero-product .duet-hero-wrapper.narrow{padding:0 48px}}@media (min-width: 48em){.duet-hero.duet-hero-product .duet-hero-wrapper.narrow{padding:0 72px}}@media (min-width: 48em){.duet-hero.duet-hero-product .duet-hero-wrapper.narrow .duet-hero-text{width:60%}}@media (min-width: 62em){.duet-hero.duet-hero-product .duet-hero-wrapper.narrow .duet-hero-text{width:47%}}.duet-hero.duet-hero-product.duet-theme-turva{background:rgb(255, 255, 255)}.duet-hero.duet-hero-product.duet-theme-turva .background .background-mask{position:absolute;top:0;left:0;display:block;width:721px;height:256.85px;pointer-events:none;background-image:url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNzIxIiBoZWlnaHQ9IjI1NyIgdmlld0JveD0iMCAwIDcyMSAyNTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMF8yODIwXzY5OTkxKSI+CjxwYXRoIGQ9Ik04MC4xNzA1IDIzLjE4MTVDOTEuOTY5OSAxOC44NjU5IDEwMi44NyAxMS42NTU5IDExMi45MDkgMS41NjQ0OEMxMjMuNzcgLTguMzA1MjcgMTM0LjM4MiAtMTguMjAxMSAxNDQuODI2IC0yOC4xODgyQzE1NS4yNDMgLTM4LjE2MjIgMTY1LjkwOCAtNDguMDg0MSAxNzYuNzQzIC01Ny45Mjc4QzE3OC44MTYgLTU5LjA0OSAxODAuNDk4IC02MC4yODc3IDE4MS43ODggLTYxLjY1NjdDMTgzLjA2NiAtNjMuMDEyNiAxODUuNDY1IC02Mi4yODI1IDE4OS4wMTIgLTU5LjQ3OTNDMTg0LjczNSAtNTEuMTM1IDE4MC43NTkgLTQyLjk2MDIgMTc3LjAxNyAtMzQuOTAyN0MxNzMuMjg4IC0yNi44NDUyIDE2Ny42ODEgLTE5LjEyNjggMTYwLjIxMSAtMTEuNzYwM0MxNTIuNzUzIC00LjM4MDgzIDE0NC45NTYgMy4zMTE1MiAxMzYuODQ3IDExLjM2OUMxMjguNzI0IDE5LjQyNjUgMTIwLjk2NiAyNy4xNDUgMTEzLjQ4MyAzNC40OTg0Qzk3LjQ5OCA0OS44MTggNzkuNjYyIDU2LjAyNDEgNjAuMDAwOCA1My4xNjg4QzQwLjI4NzQgNTAuMzEzNSAyNS41NDE0IDM5LjA3NDcgMTUuNjk3NyAxOS40Nzg2QzMuOTI0NDUgLTIuMzcyOTkgLTEuMjI1NTUgLTI0LjQ3MjQgMC4yNDc3NDMgLTQ2Ljc4MDNDMS4yNTE2NyAtNjcuNDg0NiAzLjQwMjkzIC04Ny43OTc4IDYuODA1ODQgLTEwNy43NzJDMTAuMTk1NyAtMTI3LjczMyAxNS43MTA4IC0xNDcuNDg2IDIzLjMzOCAtMTY3LjA0M0MyNi4zMTA3IC0xNzQuMDMxIDI5LjAwOTUgLTE4MC44NSAzMS40NzM3IC0xODcuNTY0QzMzLjkxMTggLTE5NC4yMjcgMzYuNTMyNCAtMjAwLjY2OCAzOS4yNTc0IC0yMDYuODQ4QzQxLjgxMjggLTIwOS41NzIgNDMuNDY4NiAtMjEyLjEyOCA0NC4xODU3IC0yMTQuNTRDNTMuMDI1NSAtMjI5LjM3NyA2Mi44MyAtMjM3Ljk5NSA3My42Mzg1IC0yNDAuNDMzQzg0LjM5NDggLTI0Mi44NzEgOTguMTM2OSAtMjM5LjgyMSAxMTQuODEyIC0yMzEuMzJDMTI3Ljk0MiAtMjI1LjYwOSAxMzMuMzkyIC0yMTYuMTA1IDEzMS4xNDkgLTIwMi43OTNDMTMwLjE3MSAtMTkwLjgzNyAxMjcuOTk0IC0xNzkuMjU5IDEyNC42MTcgLTE2OC4wMkMxMjAuMDQxIC0xNTIuNzc5IDExNS40MzggLTEzNy41NTEgMTEwLjg0OSAtMTIyLjMyMkMxMDYuMjczIC0xMDcuMDgxIDEwMS4yNzkgLTkxLjk2OTkgOTUuODk0MyAtNzcuMDAyM0M4NS41OTQzIC00OC42MDU3IDc5LjQyNzQgLTE5LjQyNjcgNzcuNDA2NSAxMC41NjA2Qzc3LjcxOTQgMTIuNDEyIDc4LjA0NTMgMTQuMjYzNSA3OC4zNTgzIDE2LjA4ODhDNzguNjcxMiAxNy45NDAyIDc5LjI3MDkgMjAuMyA4MC4xNzA1IDIzLjE5NDRNMTEwLjkxNCAtMjk2Ljc1N0MxMDkuNTQ1IC0yOTguMDM1IDEwNy4zMTYgLTI5OS4zNTIgMTA0LjIzOSAtMzAwLjczNEMxMDEuMTYyIC0zMDIuMDkgOTguMjQxMiAtMzA0LjA1OSA5NS41NDIzIC0zMDYuNjI3QzkwLjA3OTQgLTMxMS43NzcgODYuOTc2MyAtMzE4LjE2NiA4Ni4yMzMyIC0zMjUuODE5Qzg1LjQ2NCAtMzMzLjQ3MiA4Ny4zODA1IC0zNDAuNTUyIDkxLjk2OTkgLTM0Ny4wNThDOTMuMjIxNSAtMzQ4LjQxNCA5NC4xNDcyIC0zNDkuMjM1IDk0LjY4MTggLTM0OS41MjJDOTUuMTkwMyAtMzQ5Ljc5NiA5Ni4xMDI5IC0zNTAuNjA0IDk3LjM5MzcgLTM1MS45OTlDMTA5LjY3NSAtMzU3LjkwNiAxMjIuNDE0IC0zNTYuNjkzIDEzNS42MzQgLTM0OC4zMzZDMTQ2Ljk1MSAtMzQyLjMyNSAxNTIuMDg4IC0zMzMuMzE2IDE1MS4xMzYgLTMyMS4zNkwxNDguMjI5IC0zMTEuNzM4QzE0NC42NjkgLTI5Ny4wNyAxMzUuNTY5IC0yOTEuNTAzIDEyMC45MTQgLTI5NS4wNjJDMTE5LjA1IC0yOTQuNzIzIDExNS43MzggLTI5NS4yOTcgMTEwLjkxNCAtMjk2Ljc0NCIgZmlsbD0iI0Y1RjVGNyIvPgo8cGF0aCBkPSJNMjQyLjc2NyAyMTUuNTE4QzI0NS4wODggMjEzLjU4OCAyNDcuMjc4IDIxMi4xMDIgMjQ5LjM3NyAyMTAuOTY4QzI1MS40NSAyMDkuODU5IDI1My41MzYgMjA4Ljc1MSAyNTUuNjIyIDIwNy42MDRDMjc0LjIyNyAxOTIuMjg0IDI5MC41NzcgMTc3LjE2IDMwNC43MjMgMTYyLjE5M0MzMTUuNjg4IDE0OC45NDYgMzI2LjYxNCAxMzUuODU2IDMzNy40ODggMTIyLjk4N0MzNDguMzYxIDExMC4xMTkgMzU4Ljg4MyA5Ni45Mzc1IDM2OS4wNjYgODMuNDE3MUMzNzYuNDQ1IDczLjQzMDEgMzg0LjU4MSA2My44NjAyIDM5My40NDcgNTQuNzQ2NkM0MDIuMyA0NS42NDYxIDQxMC44MjYgMzYuMjMyNyA0MTkuMDAxIDI2LjQ4MDNDNDIxLjgwNCAyMi45NzMxIDQyNC4yMjkgMjAuMDAwNCA0MjYuMjg5IDE3LjU0OTNDNDI4LjMyMyAxNS4xMjQzIDQzMC41MDEgMTIuOTMzOCA0MzIuODM1IDExLjAxNzNDNDM0LjkwOCA5LjkwOTA2IDQzNi43NDYgOS41ODMwMSA0MzguMzYzIDEwLjA2NTRDNDM5Ljk1MyAxMC41NDc5IDQ0MS43OTIgMTAuMjQ4IDQ0My45MDQgOS4xMTM3MUM0NDMuMTg3IDExLjUxMjcgNDQyLjgyMiAxMy4zOTAzIDQ0Mi44ODcgMTQuNjk0QzQ0Mi45MjYgMTYuMDIzOSA0NDIuMjg3IDE3LjM2NjggNDQxLjAwOSAxOC43MjI3QzQyNC42NDcgNDYuOTYzIDQwNy42ODQgNzIuODE3MyAzOTAuMTIyIDk2LjMxMTdDMzc2LjY0MSAxMTQuOTU2IDM2My4xNDcgMTMyLjkwOSAzNDkuNjM5IDE1MC4yMjRDMzM2LjEwNiAxNjcuNTI1IDMyMi4yMiAxODUuMzYxIDMwNy45NDQgMjAzLjc1OEMzMDEuNTI5IDIxMC41MzcgMjk1LjM4OCAyMTcuMiAyODkuNDk1IDIyMy43MTlDMjgzLjU4OSAyMzAuMjI1IDI3Ny40MzUgMjM2LjkgMjcxLjAyIDI0My42NjdDMjU4LjkyMSAyNTQuODggMjQ0LjQ4OCAyNTkuMjM0IDIyNy43MzQgMjU2Ljc5NkMxOTYuODYgMjUxLjg4MSAxNzYuMDI1IDIzNi44NzQgMTY1LjIxNyAyMTEuNzg5QzE1NC42OTUgMTg4LjU2OCAxNDkuNTMyIDE2Ni41MDggMTQ5LjcwMiAxNDUuNjA4QzE0Ny45NDIgMTEzLjY3OCAxNDguMzA3IDgxLjk0MzggMTUwLjgxIDUwLjQxOEMxNTMuMyAxOC44NzkyIDE1OC4zMiAtMTIuMzIwNyAxNjUuODY5IC00My4yMDc3QzE4MC4xNzIgLTEwNS4yMDMgMTk4LjU2OCAtMTY2LjQwMyAyMjEuMTExIC0yMjYuODA4QzIzMi4wODkgLTI1Ny41MjYgMjQ0LjQyMyAtMjg3LjYxOCAyNTguMSAtMzE3LjA5NkMyNzEuNzc2IC0zNDYuNTc1IDI4Ni4zNzkgLTM3NS41MDcgMzAxLjk3MiAtNDA0LjAwOEMzMTIuOTUgLTQyNS45OSAzMjQuNjMyIC00NDcuMzQ2IDMzNi45NzkgLTQ2OC4wNjNDMzQ5LjMxMyAtNDg4Ljc1NCAzNjIuNDk1IC01MDkuMjI0IDM3Ni40MzIgLTUyOS40NTlDNDAzLjg2NCAtNTY4LjI5OSA0MzQuMTkgLTYwMy42NzEgNDY3LjM5OCAtNjM1LjU3NUM0NzUuNjM4IC02NDIuNjgxIDQ4My45OTUgLTY0OS4zMTcgNDkyLjQwNSAtNjU1LjUxQzUwMC44MjggLTY2MS42NzcgNTEwLjM5NyAtNjY2LjY1OCA1MjEuMTU0IC02NzAuMzk5QzU0NS4yNzQgLTY3Ny45NjEgNTY3LjcxMiAtNjc2Ljg3OSA1ODguMzkxIC02NjcuMTY2QzYwNC43MjcgLTY2MC40NzggNjEzLjY3MSAtNjQ5LjUxMyA2MTUuMjEgLTYzNC4yMTlDNjE3LjU5NiAtNjI0Ljc1NCA2MTguMTk1IC02MTMuNjcxIDYxNi45ODMgLTYwMC45NTlDNjEwLjMyIC01NTguNDgxIDU5Ny44NTYgLTUxNS41MzQgNTc5LjU1MSAtNDcyLjE5NkM1NjUuNDMxIC00MzkuODIzIDU0OS4wODEgLTQwOC43NTMgNTMwLjUyOCAtMzc5LjAwMUM1MTEuOTM2IC0zNDkuMjYxIDQ5Mi42MTQgLTMxOS45NTIgNDcyLjYgLTI5MS4wOTlDNDY1LjQ1NiAtMjgxLjkyIDQ1Ny45NDYgLTI3MS41MDMgNDUwLjEyMyAtMjU5LjkxMkM0MzMuNTc4IC0yMzYuOTc4IDQxNS42MzcgLTIxNS4xMjYgMzk2LjI4OSAtMTk0LjM1N0MzNzYuOTAyIC0xNzMuNTYxIDM1NS44NDUgLTE1NC4zOTYgMzMzLjA2OCAtMTM2LjgyQzMyMC4zODIgLTEyNi42OSAzMTIuNTMzIC0xMTUuMDg2IDMwOS40ODIgLTEwMi4wNDhDMzA0LjE4OSAtODQuNDQ2OCAyOTguOTc0IC02Ny4wNDExIDI5My43OTggLTQ5Ljg0NEMyODguNjIxIC0zMi42NDY5IDI4My43NzEgLTE1LjExMDggMjc5LjI4NiAyLjcxMjFDMjc1LjI3MSAxOC45NzA1IDI3MS4zMDcgMzQuOTgxIDI2Ny40MjIgNTAuODM1MkMyNjMuNTIzIDY2LjY2MzMgMjU5Ljk2NCA4Mi44NDM0IDI1Ni43NyA5OS4zMzY1QzI1My41NDkgMTE1LjgwMyAyNTAuNjgxIDEzMi42MjIgMjQ4LjE1MiAxNDkuNzQxQzI0NS42MDkgMTY2Ljg2IDI0My4xMzIgMTgzLjc5NyAyNDAuNzQ2IDIwMC40OThDMjQxLjA0NiAyMDIuMzM3IDI0MS4zMDcgMjA0LjM5NiAyNDEuNTE1IDIwNi42MTNDMjQxLjY5OCAyMDguODY4IDI0Mi4xMjggMjExLjg0MSAyNDIuNzggMjE1LjUxOE01NjQuMzIyIC02MjIuMDgxQzU2MS43MjggLTYxOS4zNDMgNTU4LjExNiAtNjE2LjA4MyA1NTMuNDg4IC02MTIuMjM3QzU0Mi4yMzYgLTU5OC4xNjkgNTMwLjk1OCAtNTgzLjkwNiA1MTkuNjI4IC01NjkuNDU5QzUwOC4yNTkgLTU1NC45ODcgNDk4LjA1IC01MzkuOTQxIDQ4OS4wMTUgLTUyNC4zNzRDNDU5LjIzNiAtNDc0Ljg2OSA0MzIuNzY5IC00MjMuOTU2IDQwOS42MDEgLTM3MS42MDhDMzg2LjQxOSAtMzE5LjI0OCAzNjUuMTkzIC0yNjUuNDQgMzQ1LjkzNiAtMjEwLjE3MkMzNDUuNzAyIC0yMDkuMzc3IDM0NS43MDIgLTIwOC43MTIgMzQ2LjAxNSAtMjA4LjE5QzM0Ni4yNjIgLTIwNy42NTYgMzQ2LjE4NCAtMjA2LjU4NyAzNDUuNzE1IC0yMDUuMDA5QzM0OS4zNzggLTIwNS42MjIgMzUxLjM2IC0yMDYuMzM5IDM1MS42MDggLTIwNy4xNDdDMzU1LjQ2NyAtMjExLjIxNSAzNTkuNTA5IC0yMTUuMjMxIDM2My43NDYgLTIxOS4xOTRDMzY3Ljk5NyAtMjIzLjE0NSAzNzEuNzY1IC0yMjcuNjgyIDM3NS4wNzYgLTIzMi44MTlDNDAyLjg4NiAtMjY3LjE2MSA0MjguNzE0IC0zMDIuMTQyIDQ1Mi41MzUgLTMzNy43MzZDNDc2LjM2OCAtMzczLjMwMyA0OTguNTMzIC00MTAuNjk2IDUxOS4wNjggLTQ0OS44ODhDNTQzLjg1MyAtNDk3LjM3MiA1NTkuNTc3IC01NDYuNzM0IDU2Ni4yNTIgLTU5Ny45MzRDNTY2LjY0MyAtNjAyLjE4NSA1NjYuOTE3IC02MDYuMDE4IDU2Ny4xIC02MDkuNDZDNTY3LjI0MyAtNjEyLjkwMiA1NjYuMzE3IC02MTcuMSA1NjQuMzM2IC02MjIuMDgxIiBmaWxsPSIjRjVGNUY3Ii8+CjxwYXRoIGQ9Ik02OTYuNTE1IDE4OS4wNjRDNzA0LjYzOCAxODQuMzk2IDcxMi42ODIgMTc5LjYxMSA3MjAuNjg4IDE3NC43MzVWMTM0LjA1N0M2OTcuODE5IDE0OC41MDMgNjczLjgwMyAxNTkuNjM3IDY0OC42MDEgMTY3LjQyMUM2MjIuMDgyIDE3NS42MzUgNTk0LjU1OCAxODAuNjY3IDU2Ni4wMTggMTgyLjU1OEM1NTAuOTIgMTgzLjI2MiA1NDEuMjk4IDE4MS44OTMgNTM3LjEgMTc4LjQzOEM1MzIuODc2IDE3NS4wMDkgNTI5LjA5NSAxNjUuNzUyIDUyNS43NTcgMTUwLjc0NUw1MjMuOTU4IDEzMC41NDlDNTIzLjMzMiAxMTguMTI0IDUyNC43NjYgMTA2Ljc1NSA1MjguMzM5IDk2LjQyODlDNTMxLjg1OSA4Ni4xNTUgNTM2LjEyMiA3NS42MjAzIDU0MS4xMTYgNjQuODc3QzU0NS42MTQgNjQuNDg1OSA1NDkuNTY0IDY0LjM2ODUgNTUzLjAzMiA2NC41MzhDNTU2LjQ3NSA2NC42OTQ1IDU2MC40MzggNjQuNTc3MSA1NjQuOTQ5IDY0LjE3MjlDNTg1Ljg3NSA2NC4zNjg1IDYwNy42MzYgNjEuNzQ3OSA2MzAuMjY5IDU2LjI4NDlDNjUyLjA4MiA1MC42MjY1IDY3MC40IDQxLjI3ODIgNjg1LjI3NyAyOC4yNTMzQzY5NC45MzggMTkuNzc4NiA3MDQuMDI1IDEwLjM3ODMgNzEyLjU2NSAwLjA5MTMwODZINjM5LjUyNkM2MjAuMjU2IDE2Ljk4ODUgNTk2Ljk0NCAyNy40ODQxIDU2OS41MzkgMzEuNDYwN0M1NjcuNjYxIDMxLjc3MzYgNTY2LjM1NyAzMS44MTI3IDU2NS41NzUgMzEuNTY1QzU2NC43NTQgMzEuMzMwMyA1NjMuODI4IDMxLjUxMjggNTYyLjgxMSAzMi4wNDc0QzU2MS45OSAzMS44MTI3IDU2MS42NTEgMzEuNDk5OCA1NjEuNzgxIDMxLjA4MjZDNTYxLjg5OCAzMC42OTE1IDU2MS41NDYgMzAuMzY1NSA1NjAuNzUxIDMwLjEzMDhDNTYwLjk5OSAyOS4zMzU1IDU2MC45MDcgMjguODY2MSA1NjAuNTE2IDI4Ljc2MThDNTYwLjA5OSAyOC42MTg0IDU2MC4wMzQgMjguMTYyIDU2MC4yOTUgMjcuMzUzN0M1NjUuMzc5IDE4LjE3NDkgNTcwLjc3NyA5LjEwMDU1IDU3Ni40MzYgMC4wOTEzMDg2SDQzMC4xNzZDNDI0LjIwNCAxMi42NzMgNDE5LjA1NCAyNS45NDU2IDQxNC44MyAzOS45ODc1QzQwNi40NzMgNjEuOTU2NSA0MDQuMjgyIDgyLjI2OTcgNDA4LjI4NSAxMDAuOTY2QzQxMi4wMTQgMTIwLjQ1OCA0MTguODMzIDEzOC40NjMgNDI4LjcyOCAxNTQuOTgyQzQzOC42MTEgMTcxLjUyOCA0NTIuNDU4IDE4NS4wODcgNDcwLjI1NCAxOTUuN0M0OTAuNzM3IDIwOC44ODEgNTEyLjE0NSAyMTcuNzIxIDUzNC40MDEgMjIyLjI0NUM1NTYuNjQ0IDIyNi43NTcgNTc5Ljg2NSAyMjYuNTA5IDYwNC4xMTUgMjIxLjU2N0M2MDkuNjQzIDIyMC42MTYgNjE1LjI2MyAyMTkuNDY4IDYyMC45MjEgMjE4LjA5OUM2MjYuNTY3IDIxNi43NTYgNjMyLjI3NyAyMTUuMTkyIDYzOC4wNTMgMjEzLjQxOUM2NTkuMDU3IDIwNy41MjUgNjc4LjU2MiAxOTkuMzkgNjk2LjU0MSAxODkuMDc3IiBmaWxsPSIjRjVGNUY3Ii8+CjwvZz4KPGRlZnM+CjxjbGlwUGF0aCBpZD0iY2xpcDBfMjgyMF82OTk5MSI+CjxyZWN0IHdpZHRoPSI3MjEiIGhlaWdodD0iMjU2Ljg0OCIgZmlsbD0id2hpdGUiLz4KPC9jbGlwUGF0aD4KPC9kZWZzPgo8L3N2Zz4K\");background-repeat:no-repeat}@media (min-width: 48em){.duet-hero.duet-hero-product.duet-theme-turva .background .background-mask{left:181px}}.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{margin:0 auto;border-radius:0;-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;transform:none}@media (max-width: 35.9375em){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{top:-120px;width:385px}}@media (max-width: 22.5em){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{top:-95px;width:320px}}@media (min-width: 36em){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{top:-135px;width:420px}}@media (min-width: 48em){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{top:-110px;right:-110px;width:418px}}@media (min-width: 860px){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{right:-75px}}@media (min-width: 960px){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{right:-40px}}@media (min-width: 62em){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{top:-130px;right:-100px;width:552px}}@media (min-width: 1100px){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{right:-35px}}@media (min-width: 76.25em){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image{top:-215px;width:736px}.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image.narrow{right:-115px}}@media (min-width: 1300px){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image.narrow{right:-50px}}@media (min-width: 1400px){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image.narrow{right:-35px}}.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-image .brand-shaped-image-bg{transform:translate(-50%, 0)}.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-icon{background:rgba(230, 23, 64, 0.9);-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;transform:rotate(0deg)}.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-icon duet-icon{position:relative;top:-6px;transform:rotate(0deg)}@media (min-width: 48em){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-icon duet-icon{top:-8px}}@media (min-width: 62em){.duet-hero.duet-hero-product.duet-theme-turva .background .brand-shaped-icon duet-icon{top:-12px}}.duet-hero.duet-hero-content{padding:0 0 48px;padding-top:236px;background:rgb(255, 255, 255)}@media (min-width: 48em){.duet-hero.duet-hero-content{padding-top:384px}}.duet-hero.duet-hero-content:not(.duet-hero-has-image){padding:72px 0 48px}.duet-hero.duet-hero-content .background-area{position:absolute;width:100%}.duet-hero.duet-hero-content .background{position:absolute;top:-236px;width:100%;height:600px;overflow:hidden;pointer-events:none}.duet-hero.duet-hero-content .background *{pointer-events:auto}.duet-hero.duet-hero-content .background .background-mask{display:none}@media (min-width: 48em){.duet-hero.duet-hero-content .background{top:-384px}}.duet-hero.duet-hero-content .background .brand-shaped-image{position:absolute;top:-165px;right:0;left:30px;z-index:0;width:375px;height:375px;margin:0 auto;overflow:hidden;border-radius:20%;transform:rotate(7deg)}@media (min-width: 48em){.duet-hero.duet-hero-content .background .brand-shaped-image{top:-325px;left:250px;width:687px;height:687px}}.duet-hero.duet-hero-content .background .brand-shaped-image .brand-shaped-image-wrapper{position:relative;width:100%;height:100%}.duet-hero.duet-hero-content .background .brand-shaped-image .brand-shaped-image-bg{position:absolute;bottom:0;left:50%;z-index:1;width:600px;height:256px;transform:rotate(-7deg) translate(-50%, 0)}.duet-hero.duet-hero-content .background .brand-shaped-image .brand-shaped-image-bg picture{display:block}.duet-hero.duet-hero-content .background .brand-shaped-image .brand-shaped-image-bg img{position:absolute;top:0;left:0;width:100%;height:auto}@media (min-width: 48em){.duet-hero.duet-hero-content .background .brand-shaped-image .brand-shaped-image-bg{width:733px;height:413px}}.duet-hero.duet-hero-content .background .brand-shape{position:absolute;top:-25px;right:0;left:-300px;width:240px;height:240px;margin-right:auto;margin-left:auto;background:rgb(0, 119, 179);border-radius:20%;mix-blend-mode:normal;opacity:0.07;transform:rotate(7deg)}@media (min-width: 48em){.duet-hero.duet-hero-content .background .brand-shape{top:80px;left:-400px;width:373px;height:373px}}.duet-hero.duet-hero-content .duet-hero-wrapper{max-width:100%;margin:0 auto}.duet-hero.duet-hero-content .duet-hero-wrapper.fluid,.duet-hero.duet-hero-content .duet-hero-wrapper.narrow{padding:0 16px}@media (min-width: 36em){.duet-hero.duet-hero-content .duet-hero-wrapper.fluid{padding:0 28px}}@media (min-width: 62em){.duet-hero.duet-hero-content .duet-hero-wrapper.fluid{padding:0 56px}}@media (min-width: 76.25em){.duet-hero.duet-hero-content .duet-hero-wrapper.fluid{max-width:1110px;padding:0}}.duet-hero.duet-hero-content .duet-hero-wrapper.narrow{max-width:888px}@media (min-width: 36em){.duet-hero.duet-hero-content .duet-hero-wrapper.narrow{padding:0 48px}}@media (min-width: 48em){.duet-hero.duet-hero-content .duet-hero-wrapper.narrow{padding:0 72px}}.duet-hero.duet-hero-content .duet-hero-text{max-width:100%}@media (min-width: 62em){.duet-hero.duet-hero-content .duet-hero-text{width:80%}}.duet-hero.duet-hero-content .duet-hero-text .duet-hero-pre{margin-top:1rem;margin-bottom:0.5rem}@media (min-width: 62em){.duet-hero.duet-hero-content .duet-hero-text .duet-hero-pre{margin-top:1.5rem;margin-bottom:0}}@media (min-width: 62em){.duet-hero{min-height:290px;padding:111.6px 56px;overflow:visible}}.duet-hero-icon{display:inline-block;vertical-align:top}@media (min-width: 62em){.duet-hero-icon{margin-top:-8px}}@media (min-width: 62em){.duet-hero-heading{margin-top:12px}}@media (min-width: 62em){.duet-hero-heading-has-pre{margin-top:0}}.duet-hero-wrapper{position:relative;width:100%;max-width:1110px;margin:0 auto;text-align:center}.duet-hero-left-align .duet-hero-wrapper{text-align:left}.duet-hero-with-image .duet-hero-wrapper{position:static}@media (min-width: 62em){.duet-hero-wrapper{text-align:left}}.duet-hero-text{max-width:50rem;margin:0 auto}.duet-hero-text-center .duet-hero-text{text-align:center !important}@media (min-width: 48em){.duet-hero-text{width:80%}.duet-hero-left-align .duet-hero-text{margin:0}}@media (min-width: 62em){.duet-hero-text{width:52%;max-width:none;margin-top:-10px;margin-left:0}.duet-hero-text-center .duet-hero-text{margin-left:auto}}.duet-hero:not(.duet-hero-with-image) .duet-hero-image{position:relative;width:100%;max-width:400px;height:0;padding-bottom:50%;margin:28px auto 0}.duet-hero:not(.duet-hero-with-image) .duet-hero-image picture{display:block}.duet-hero:not(.duet-hero-with-image) .duet-hero-image img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;object-position:50% 50%}.duet-hero:not(.duet-hero-with-image) .duet-hero-image img.cover{object-fit:cover}.duet-hero:not(.duet-hero-with-image) .duet-hero-image img.center{object-position:center}@media (min-width: 36em){.duet-hero:not(.duet-hero-with-image) .duet-hero-image{padding-bottom:40%}}@media (min-width: 48em){.duet-hero:not(.duet-hero-with-image) .duet-hero-image{max-width:420px;padding-bottom:34%}.duet-hero-light .duet-hero:not(.duet-hero-with-image) .duet-hero-image{max-width:540px}}@media (min-width: 62em){.duet-hero:not(.duet-hero-with-image) .duet-hero-image{position:absolute;top:50%;right:0;padding-bottom:30%;margin:0;transform:translateY(-50%)}.duet-hero-light .duet-hero:not(.duet-hero-with-image) .duet-hero-image{right:-60px;padding-bottom:26%}.duet-hero-gray .duet-hero:not(.duet-hero-with-image) .duet-hero-image{right:-34px;padding-bottom:20%}}@media (min-width: 62em){.duet-hero-gray:not(.duet-hero-with-image) .duet-hero-image{right:-34px;padding-bottom:20%}}.duet-hero-image-wrapper{position:relative;width:80%;height:0;padding-bottom:80%;margin:-30px auto 36px;overflow:hidden;border-radius:28%;box-shadow:0 0 20px rgba(255, 255, 255, 0.5);transform:rotate(10deg)}@media screen and (min-width: 440px){.duet-hero-image-wrapper{width:300px;padding-bottom:300px}}@media (min-width: 62em){.duet-hero-image-wrapper{position:absolute;top:-60px;right:-50px;width:470px;padding-bottom:470px;margin:0}}@media (min-width: 76.25em){.duet-hero-image-wrapper{top:-70px;right:-60px;width:600px;padding-bottom:600px}}@media screen and (min-width: 1450px){.duet-hero-image-wrapper{top:-70px;right:25px}}.duet-hero-image-wrapper .duet-hero-image{position:absolute;top:-5%;left:-5%;width:110%;height:110%;transform:rotate(-10deg)}.duet-hero-image-wrapper .duet-hero-image picture{display:block}.duet-hero-image-wrapper .duet-hero-image img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%}.duet-hero-image-mask{position:relative;margin:-48px auto 0;overflow:hidden}@media (min-width: 62em){.duet-hero-image-mask{position:absolute;top:0;right:0;width:470px;height:460px;margin:0}}@media (min-width: 76.25em){.duet-hero-image-mask{width:650px;height:580px}}@media screen and (min-width: 1450px){.duet-hero-image-mask{right:50%;transform:translateX(110%)}}duet-heading+duet-button{margin-top:12px !important}.duet-hero-links{width:calc(100% + 56px);margin-top:48px;margin-left:-28px}.duet-hero-minimal .duet-hero-links{margin-top:28px}@media (min-width: 36em){.duet-hero-links{margin-top:72px}.duet-hero-minimal .duet-hero-links{margin-top:28px}}@media (min-width: 62em){.duet-hero-links{width:auto;margin:36px 0 0}.duet-hero-minimal .duet-hero-links{margin-top:28px}}.duet-hero-link{display:flex;align-items:center;width:100%;padding:16px 16px 8px;font-weight:600;line-height:1.25;color:rgb(0, 119, 179);text-align:left;-webkit-hyphens:auto;hyphens:auto;text-decoration:none;border-bottom:1px solid rgb(212, 223, 229);transition:background-color 300ms ease}.duet-hero-link:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-hero-link:focus,.duet-hero-link:focus.duet-theme-turva{outline:2px solid;outline-offset:2px;outline-color:rgba(53, 79, 101, 0.8)}.duet-hero-link:hover,.duet-hero-link:hover .duet-hero-action-arrow{color:rgb(0, 75, 129) !important;background:transparent !important}@media (min-width: 36em){.duet-hero-link{padding:16px 16px 16px 28px}}@media (min-width: 62em){.duet-hero-link{display:inline-flex;width:auto;max-width:350px;padding:0;margin:0 28px 16px 0;border:0;border-radius:4px}}.duet-hero-link:hover{background:rgba(0, 0, 0, 0.02)}@media (min-width: 62em){.duet-hero-link:hover{background:transparent}}.duet-hero-link:first-of-type{border-top:1px solid rgb(212, 223, 229)}@media (min-width: 62em){.duet-hero-link:first-of-type{margin-top:0;border:0}}.duet-hero-link:last-of-type{margin-bottom:-48px}@media (min-width: 62em){.duet-hero-link:last-of-type{margin-right:0;margin-bottom:0}}.duet-hero-link span{margin-top:-8px}@media (min-width: 36em){.duet-hero-link span{margin:0}}.duet-hero-action-icon{margin-right:8px}@media (min-width: 36em){.duet-hero-action-icon{margin-right:12px}}.duet-hero-action-arrow{margin:0 0 0 8px;color:rgb(0, 119, 179)}@media (max-width: 35.9375em){.duet-hero-action-arrow{margin-top:-9px}}.duet-hero-back{margin-bottom:28px !important;display:flex;align-items:center;justify-content:center}.duet-hero-left-align .duet-hero-back{align-items:self-start;justify-content:flex-start}@media (min-width: 36em){.duet-hero-back{margin-bottom:36px !important}.duet-hero-minimal .duet-hero-back{margin-bottom:28px !important}}@media (min-width: 62em){.duet-hero-back{display:block}}.duet-hero-pre{display:inline-block;width:auto;margin-right:8px}.duet-hero-pre+duet-heading{margin-top:0 !important}.duet-hero.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\";background:rgb(230, 23, 64)}.duet-hero.duet-theme-turva.duet-hero-light,.duet-hero.duet-theme-turva.duet-hero-with-image{color:rgb(23, 42, 59);background-image:linear-gradient(rgb(253, 247, 242), #fefbf9)}.duet-hero.duet-theme-turva.duet-hero-light::before,.duet-hero.duet-theme-turva.duet-hero-with-image::before{background-image:linear-gradient(#fefbf9, rgb(255, 255, 255))}.duet-hero.duet-theme-turva.duet-hero-gray{background:rgb(245, 246, 247)}.duet-hero.duet-theme-turva.duet-hero-campaign,.duet-hero.duet-theme-turva.duet-hero-section{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";background:none}.duet-hero.duet-theme-turva.duet-hero-campaign .brand-shape,.duet-hero.duet-theme-turva.duet-hero-section .brand-shape{top:125px;left:-10px;width:350px;height:350px;background:rgb(255, 255, 255);-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;transform:none}@media (min-width: 22.5em){.duet-hero.duet-theme-turva.duet-hero-campaign .brand-shape,.duet-hero.duet-theme-turva.duet-hero-section .brand-shape{top:143px;left:-30px;width:450px;height:450px}}@media (min-width: 36em){.duet-hero.duet-theme-turva.duet-hero-campaign .brand-shape,.duet-hero.duet-theme-turva.duet-hero-section .brand-shape{top:180px;left:0;width:550px;height:550px}}@media (min-width: 48em){.duet-hero.duet-theme-turva.duet-hero-campaign .brand-shape,.duet-hero.duet-theme-turva.duet-hero-section .brand-shape{top:220px;width:712.18px;height:712.18px}}@media (min-width: 62em){.duet-hero.duet-theme-turva.duet-hero-campaign .brand-shape,.duet-hero.duet-theme-turva.duet-hero-section .brand-shape{top:230px}}@media (min-width: 76.25em){.duet-hero.duet-theme-turva.duet-hero-campaign .brand-shape,.duet-hero.duet-theme-turva.duet-hero-section .brand-shape{top:260px}}@media (min-width: 106.25em){.duet-hero.duet-theme-turva.duet-hero-campaign .brand-shape,.duet-hero.duet-theme-turva.duet-hero-section .brand-shape{top:290px}}.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-text .duet-hero-subheading,.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-text duet-paragraph,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-text .duet-hero-subheading,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-text duet-paragraph{width:98%}@media (min-width: 22.5em){.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-text .duet-hero-subheading,.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-text duet-paragraph,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-text .duet-hero-subheading,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-text duet-paragraph{width:90%}}@media (min-width: 25em){.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-text .duet-hero-subheading,.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-text duet-paragraph,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-text .duet-hero-subheading,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-text duet-paragraph{width:78%}}@media (min-width: 30em){.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-text .duet-hero-subheading,.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-text duet-paragraph,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-text .duet-hero-subheading,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-text duet-paragraph{width:66%}}@media (min-width: 36em){.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-text .duet-hero-subheading,.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-text duet-paragraph,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-text .duet-hero-subheading,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-text duet-paragraph{width:65%}}@media (min-width: 48em){.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-text .duet-hero-subheading,.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-text duet-paragraph,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-text .duet-hero-subheading,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-text duet-paragraph{width:70%}}@media (min-width: 62em){.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-text .duet-hero-subheading,.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-text duet-paragraph,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-text .duet-hero-subheading,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-text duet-paragraph{width:52%}}.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-heading{margin-bottom:2rem}@media (min-width: 22.5em){.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-heading{margin-bottom:2rem}}@media (min-width: 36em){.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-heading{margin-bottom:4rem}}@media (min-width: 48em){.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-heading{margin-bottom:6rem}}@media (min-width: 62em){.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-heading{margin-bottom:7rem}}@media (min-width: 76.25em){.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-heading{margin-bottom:8rem}}@media (min-width: 106.25em){.duet-hero.duet-theme-turva.duet-hero-campaign .duet-hero-heading,.duet-hero.duet-theme-turva.duet-hero-section .duet-hero-heading{margin-botton:9rem}}.duet-hero.duet-theme-turva.duet-hero-campaign .background-area .brand-shape,.duet-hero.duet-theme-turva.duet-hero-section .background-area .brand-shape{left:0;background-color:rgb(255, 255, 255);border-radius:24px;mask-image:none}.duet-hero.duet-theme-turva.duet-hero-product{display:flex;flex-direction:column;gap:20px;min-height:auto;padding-top:0;padding-bottom:72px;margin:0 auto}@media (min-width: 62em){.duet-hero.duet-theme-turva.duet-hero-product{flex-direction:row-reverse;gap:40px;padding-top:72px;padding-right:56px;padding-left:56px}}@media (min-width: 76.25em){.duet-hero.duet-theme-turva.duet-hero-product{max-width:1110px;padding-right:0;padding-left:0}}.duet-hero.duet-theme-turva.duet-hero-product .background-area{position:relative;height:auto;overflow:visible}.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.narrow,.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.fluid{position:relative;top:0;width:100%;height:auto;aspect-ratio:576/250;padding:0;overflow:visible;}@media (min-width: 36em){.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.narrow,.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.fluid{height:250px;aspect-ratio:auto}}@media (min-width: 48em){.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.narrow,.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.fluid{padding-right:28px;padding-left:28px}}@media (min-width: 62em){.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.narrow,.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.fluid{height:auto;aspect-ratio:53/32;padding-right:0;padding-left:0}}.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.narrow .background,.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.fluid .background{position:relative;top:auto;height:100%}.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.narrow .background .background-mask,.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.fluid .background .background-mask{display:none;background-image:none}.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.narrow .background .brand-shaped-image,.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.fluid .background .brand-shaped-image{position:static;width:100%;height:100%;border-radius:0;mask-image:none}.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.narrow .background .brand-shaped-image .brand-shaped-image-bg,.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.fluid .background .brand-shaped-image .brand-shaped-image-bg{position:static;width:100%;height:100%;transform:none}.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.narrow .background .brand-shaped-image .brand-shaped-image-bg picture,.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.fluid .background .brand-shaped-image .brand-shaped-image-bg picture{display:block;width:100%;height:100%}.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.narrow .background .brand-shaped-image .brand-shaped-image-bg img,.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.fluid .background .brand-shaped-image .brand-shaped-image-bg img{position:static;width:100%;height:100%;object-fit:cover;object-position:0 50%;transform:none}@media (min-width: 48em){.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.narrow .background .brand-shaped-image,.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.fluid .background .brand-shaped-image{border-radius:0 0 12px 12px}}@media (min-width: 62em){.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.narrow .background .brand-shaped-image,.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.fluid .background .brand-shaped-image{border-radius:12px}}.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.narrow .background .brand-shaped-icon,.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.fluid .background .brand-shaped-icon{top:auto;right:20px;bottom:-16px;width:auto;height:auto;padding:0;background-color:rgb(23, 42, 59);border-radius:8px;mask-image:none}.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.narrow .background .brand-shaped-icon duet-icon,.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.fluid .background .brand-shaped-icon duet-icon{top:0;width:62px;height:62px}@media (min-width: 36em){.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.narrow .background .brand-shaped-icon,.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.fluid .background .brand-shaped-icon{right:40px;bottom:-24px;padding:8px}.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.narrow .background .brand-shaped-icon duet-icon,.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.fluid .background .brand-shaped-icon duet-icon{width:80px;height:80px}}@media (min-width: 48em){.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.narrow .background .brand-shaped-icon,.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.fluid .background .brand-shaped-icon{right:68px}}@media (min-width: 62em){.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.narrow .background .brand-shaped-icon,.duet-hero.duet-theme-turva.duet-hero-product .background-area .background-container.fluid .background .brand-shaped-icon{right:40px}}.duet-hero.duet-theme-turva.duet-hero-product .duet-hero-wrapper .duet-hero-text{width:100%}@media (min-width: 48em){.duet-hero.duet-theme-turva.duet-hero-product .duet-hero-wrapper{margin-top:28px}}@media (min-width: 62em){.duet-hero.duet-theme-turva.duet-hero-product .duet-hero-wrapper{padding:0}}.duet-hero.duet-theme-turva.duet-hero-content{padding:0;margin:20px auto;background:rgb(255, 255, 255)}.duet-hero.duet-theme-turva.duet-hero-content .background-mask{position:absolute;top:0;left:0;display:block;width:721px;height:256.85px;pointer-events:none;background-image:url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNzIxIiBoZWlnaHQ9IjI1NyIgdmlld0JveD0iMCAwIDcyMSAyNTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMF8yODIwXzY5OTkxKSI+CjxwYXRoIGQ9Ik04MC4xNzA1IDIzLjE4MTVDOTEuOTY5OSAxOC44NjU5IDEwMi44NyAxMS42NTU5IDExMi45MDkgMS41NjQ0OEMxMjMuNzcgLTguMzA1MjcgMTM0LjM4MiAtMTguMjAxMSAxNDQuODI2IC0yOC4xODgyQzE1NS4yNDMgLTM4LjE2MjIgMTY1LjkwOCAtNDguMDg0MSAxNzYuNzQzIC01Ny45Mjc4QzE3OC44MTYgLTU5LjA0OSAxODAuNDk4IC02MC4yODc3IDE4MS43ODggLTYxLjY1NjdDMTgzLjA2NiAtNjMuMDEyNiAxODUuNDY1IC02Mi4yODI1IDE4OS4wMTIgLTU5LjQ3OTNDMTg0LjczNSAtNTEuMTM1IDE4MC43NTkgLTQyLjk2MDIgMTc3LjAxNyAtMzQuOTAyN0MxNzMuMjg4IC0yNi44NDUyIDE2Ny42ODEgLTE5LjEyNjggMTYwLjIxMSAtMTEuNzYwM0MxNTIuNzUzIC00LjM4MDgzIDE0NC45NTYgMy4zMTE1MiAxMzYuODQ3IDExLjM2OUMxMjguNzI0IDE5LjQyNjUgMTIwLjk2NiAyNy4xNDUgMTEzLjQ4MyAzNC40OTg0Qzk3LjQ5OCA0OS44MTggNzkuNjYyIDU2LjAyNDEgNjAuMDAwOCA1My4xNjg4QzQwLjI4NzQgNTAuMzEzNSAyNS41NDE0IDM5LjA3NDcgMTUuNjk3NyAxOS40Nzg2QzMuOTI0NDUgLTIuMzcyOTkgLTEuMjI1NTUgLTI0LjQ3MjQgMC4yNDc3NDMgLTQ2Ljc4MDNDMS4yNTE2NyAtNjcuNDg0NiAzLjQwMjkzIC04Ny43OTc4IDYuODA1ODQgLTEwNy43NzJDMTAuMTk1NyAtMTI3LjczMyAxNS43MTA4IC0xNDcuNDg2IDIzLjMzOCAtMTY3LjA0M0MyNi4zMTA3IC0xNzQuMDMxIDI5LjAwOTUgLTE4MC44NSAzMS40NzM3IC0xODcuNTY0QzMzLjkxMTggLTE5NC4yMjcgMzYuNTMyNCAtMjAwLjY2OCAzOS4yNTc0IC0yMDYuODQ4QzQxLjgxMjggLTIwOS41NzIgNDMuNDY4NiAtMjEyLjEyOCA0NC4xODU3IC0yMTQuNTRDNTMuMDI1NSAtMjI5LjM3NyA2Mi44MyAtMjM3Ljk5NSA3My42Mzg1IC0yNDAuNDMzQzg0LjM5NDggLTI0Mi44NzEgOTguMTM2OSAtMjM5LjgyMSAxMTQuODEyIC0yMzEuMzJDMTI3Ljk0MiAtMjI1LjYwOSAxMzMuMzkyIC0yMTYuMTA1IDEzMS4xNDkgLTIwMi43OTNDMTMwLjE3MSAtMTkwLjgzNyAxMjcuOTk0IC0xNzkuMjU5IDEyNC42MTcgLTE2OC4wMkMxMjAuMDQxIC0xNTIuNzc5IDExNS40MzggLTEzNy41NTEgMTEwLjg0OSAtMTIyLjMyMkMxMDYuMjczIC0xMDcuMDgxIDEwMS4yNzkgLTkxLjk2OTkgOTUuODk0MyAtNzcuMDAyM0M4NS41OTQzIC00OC42MDU3IDc5LjQyNzQgLTE5LjQyNjcgNzcuNDA2NSAxMC41NjA2Qzc3LjcxOTQgMTIuNDEyIDc4LjA0NTMgMTQuMjYzNSA3OC4zNTgzIDE2LjA4ODhDNzguNjcxMiAxNy45NDAyIDc5LjI3MDkgMjAuMyA4MC4xNzA1IDIzLjE5NDRNMTEwLjkxNCAtMjk2Ljc1N0MxMDkuNTQ1IC0yOTguMDM1IDEwNy4zMTYgLTI5OS4zNTIgMTA0LjIzOSAtMzAwLjczNEMxMDEuMTYyIC0zMDIuMDkgOTguMjQxMiAtMzA0LjA1OSA5NS41NDIzIC0zMDYuNjI3QzkwLjA3OTQgLTMxMS43NzcgODYuOTc2MyAtMzE4LjE2NiA4Ni4yMzMyIC0zMjUuODE5Qzg1LjQ2NCAtMzMzLjQ3MiA4Ny4zODA1IC0zNDAuNTUyIDkxLjk2OTkgLTM0Ny4wNThDOTMuMjIxNSAtMzQ4LjQxNCA5NC4xNDcyIC0zNDkuMjM1IDk0LjY4MTggLTM0OS41MjJDOTUuMTkwMyAtMzQ5Ljc5NiA5Ni4xMDI5IC0zNTAuNjA0IDk3LjM5MzcgLTM1MS45OTlDMTA5LjY3NSAtMzU3LjkwNiAxMjIuNDE0IC0zNTYuNjkzIDEzNS42MzQgLTM0OC4zMzZDMTQ2Ljk1MSAtMzQyLjMyNSAxNTIuMDg4IC0zMzMuMzE2IDE1MS4xMzYgLTMyMS4zNkwxNDguMjI5IC0zMTEuNzM4QzE0NC42NjkgLTI5Ny4wNyAxMzUuNTY5IC0yOTEuNTAzIDEyMC45MTQgLTI5NS4wNjJDMTE5LjA1IC0yOTQuNzIzIDExNS43MzggLTI5NS4yOTcgMTEwLjkxNCAtMjk2Ljc0NCIgZmlsbD0iI0Y1RjVGNyIvPgo8cGF0aCBkPSJNMjQyLjc2NyAyMTUuNTE4QzI0NS4wODggMjEzLjU4OCAyNDcuMjc4IDIxMi4xMDIgMjQ5LjM3NyAyMTAuOTY4QzI1MS40NSAyMDkuODU5IDI1My41MzYgMjA4Ljc1MSAyNTUuNjIyIDIwNy42MDRDMjc0LjIyNyAxOTIuMjg0IDI5MC41NzcgMTc3LjE2IDMwNC43MjMgMTYyLjE5M0MzMTUuNjg4IDE0OC45NDYgMzI2LjYxNCAxMzUuODU2IDMzNy40ODggMTIyLjk4N0MzNDguMzYxIDExMC4xMTkgMzU4Ljg4MyA5Ni45Mzc1IDM2OS4wNjYgODMuNDE3MUMzNzYuNDQ1IDczLjQzMDEgMzg0LjU4MSA2My44NjAyIDM5My40NDcgNTQuNzQ2NkM0MDIuMyA0NS42NDYxIDQxMC44MjYgMzYuMjMyNyA0MTkuMDAxIDI2LjQ4MDNDNDIxLjgwNCAyMi45NzMxIDQyNC4yMjkgMjAuMDAwNCA0MjYuMjg5IDE3LjU0OTNDNDI4LjMyMyAxNS4xMjQzIDQzMC41MDEgMTIuOTMzOCA0MzIuODM1IDExLjAxNzNDNDM0LjkwOCA5LjkwOTA2IDQzNi43NDYgOS41ODMwMSA0MzguMzYzIDEwLjA2NTRDNDM5Ljk1MyAxMC41NDc5IDQ0MS43OTIgMTAuMjQ4IDQ0My45MDQgOS4xMTM3MUM0NDMuMTg3IDExLjUxMjcgNDQyLjgyMiAxMy4zOTAzIDQ0Mi44ODcgMTQuNjk0QzQ0Mi45MjYgMTYuMDIzOSA0NDIuMjg3IDE3LjM2NjggNDQxLjAwOSAxOC43MjI3QzQyNC42NDcgNDYuOTYzIDQwNy42ODQgNzIuODE3MyAzOTAuMTIyIDk2LjMxMTdDMzc2LjY0MSAxMTQuOTU2IDM2My4xNDcgMTMyLjkwOSAzNDkuNjM5IDE1MC4yMjRDMzM2LjEwNiAxNjcuNTI1IDMyMi4yMiAxODUuMzYxIDMwNy45NDQgMjAzLjc1OEMzMDEuNTI5IDIxMC41MzcgMjk1LjM4OCAyMTcuMiAyODkuNDk1IDIyMy43MTlDMjgzLjU4OSAyMzAuMjI1IDI3Ny40MzUgMjM2LjkgMjcxLjAyIDI0My42NjdDMjU4LjkyMSAyNTQuODggMjQ0LjQ4OCAyNTkuMjM0IDIyNy43MzQgMjU2Ljc5NkMxOTYuODYgMjUxLjg4MSAxNzYuMDI1IDIzNi44NzQgMTY1LjIxNyAyMTEuNzg5QzE1NC42OTUgMTg4LjU2OCAxNDkuNTMyIDE2Ni41MDggMTQ5LjcwMiAxNDUuNjA4QzE0Ny45NDIgMTEzLjY3OCAxNDguMzA3IDgxLjk0MzggMTUwLjgxIDUwLjQxOEMxNTMuMyAxOC44NzkyIDE1OC4zMiAtMTIuMzIwNyAxNjUuODY5IC00My4yMDc3QzE4MC4xNzIgLTEwNS4yMDMgMTk4LjU2OCAtMTY2LjQwMyAyMjEuMTExIC0yMjYuODA4QzIzMi4wODkgLTI1Ny41MjYgMjQ0LjQyMyAtMjg3LjYxOCAyNTguMSAtMzE3LjA5NkMyNzEuNzc2IC0zNDYuNTc1IDI4Ni4zNzkgLTM3NS41MDcgMzAxLjk3MiAtNDA0LjAwOEMzMTIuOTUgLTQyNS45OSAzMjQuNjMyIC00NDcuMzQ2IDMzNi45NzkgLTQ2OC4wNjNDMzQ5LjMxMyAtNDg4Ljc1NCAzNjIuNDk1IC01MDkuMjI0IDM3Ni40MzIgLTUyOS40NTlDNDAzLjg2NCAtNTY4LjI5OSA0MzQuMTkgLTYwMy42NzEgNDY3LjM5OCAtNjM1LjU3NUM0NzUuNjM4IC02NDIuNjgxIDQ4My45OTUgLTY0OS4zMTcgNDkyLjQwNSAtNjU1LjUxQzUwMC44MjggLTY2MS42NzcgNTEwLjM5NyAtNjY2LjY1OCA1MjEuMTU0IC02NzAuMzk5QzU0NS4yNzQgLTY3Ny45NjEgNTY3LjcxMiAtNjc2Ljg3OSA1ODguMzkxIC02NjcuMTY2QzYwNC43MjcgLTY2MC40NzggNjEzLjY3MSAtNjQ5LjUxMyA2MTUuMjEgLTYzNC4yMTlDNjE3LjU5NiAtNjI0Ljc1NCA2MTguMTk1IC02MTMuNjcxIDYxNi45ODMgLTYwMC45NTlDNjEwLjMyIC01NTguNDgxIDU5Ny44NTYgLTUxNS41MzQgNTc5LjU1MSAtNDcyLjE5NkM1NjUuNDMxIC00MzkuODIzIDU0OS4wODEgLTQwOC43NTMgNTMwLjUyOCAtMzc5LjAwMUM1MTEuOTM2IC0zNDkuMjYxIDQ5Mi42MTQgLTMxOS45NTIgNDcyLjYgLTI5MS4wOTlDNDY1LjQ1NiAtMjgxLjkyIDQ1Ny45NDYgLTI3MS41MDMgNDUwLjEyMyAtMjU5LjkxMkM0MzMuNTc4IC0yMzYuOTc4IDQxNS42MzcgLTIxNS4xMjYgMzk2LjI4OSAtMTk0LjM1N0MzNzYuOTAyIC0xNzMuNTYxIDM1NS44NDUgLTE1NC4zOTYgMzMzLjA2OCAtMTM2LjgyQzMyMC4zODIgLTEyNi42OSAzMTIuNTMzIC0xMTUuMDg2IDMwOS40ODIgLTEwMi4wNDhDMzA0LjE4OSAtODQuNDQ2OCAyOTguOTc0IC02Ny4wNDExIDI5My43OTggLTQ5Ljg0NEMyODguNjIxIC0zMi42NDY5IDI4My43NzEgLTE1LjExMDggMjc5LjI4NiAyLjcxMjFDMjc1LjI3MSAxOC45NzA1IDI3MS4zMDcgMzQuOTgxIDI2Ny40MjIgNTAuODM1MkMyNjMuNTIzIDY2LjY2MzMgMjU5Ljk2NCA4Mi44NDM0IDI1Ni43NyA5OS4zMzY1QzI1My41NDkgMTE1LjgwMyAyNTAuNjgxIDEzMi42MjIgMjQ4LjE1MiAxNDkuNzQxQzI0NS42MDkgMTY2Ljg2IDI0My4xMzIgMTgzLjc5NyAyNDAuNzQ2IDIwMC40OThDMjQxLjA0NiAyMDIuMzM3IDI0MS4zMDcgMjA0LjM5NiAyNDEuNTE1IDIwNi42MTNDMjQxLjY5OCAyMDguODY4IDI0Mi4xMjggMjExLjg0MSAyNDIuNzggMjE1LjUxOE01NjQuMzIyIC02MjIuMDgxQzU2MS43MjggLTYxOS4zNDMgNTU4LjExNiAtNjE2LjA4MyA1NTMuNDg4IC02MTIuMjM3QzU0Mi4yMzYgLTU5OC4xNjkgNTMwLjk1OCAtNTgzLjkwNiA1MTkuNjI4IC01NjkuNDU5QzUwOC4yNTkgLTU1NC45ODcgNDk4LjA1IC01MzkuOTQxIDQ4OS4wMTUgLTUyNC4zNzRDNDU5LjIzNiAtNDc0Ljg2OSA0MzIuNzY5IC00MjMuOTU2IDQwOS42MDEgLTM3MS42MDhDMzg2LjQxOSAtMzE5LjI0OCAzNjUuMTkzIC0yNjUuNDQgMzQ1LjkzNiAtMjEwLjE3MkMzNDUuNzAyIC0yMDkuMzc3IDM0NS43MDIgLTIwOC43MTIgMzQ2LjAxNSAtMjA4LjE5QzM0Ni4yNjIgLTIwNy42NTYgMzQ2LjE4NCAtMjA2LjU4NyAzNDUuNzE1IC0yMDUuMDA5QzM0OS4zNzggLTIwNS42MjIgMzUxLjM2IC0yMDYuMzM5IDM1MS42MDggLTIwNy4xNDdDMzU1LjQ2NyAtMjExLjIxNSAzNTkuNTA5IC0yMTUuMjMxIDM2My43NDYgLTIxOS4xOTRDMzY3Ljk5NyAtMjIzLjE0NSAzNzEuNzY1IC0yMjcuNjgyIDM3NS4wNzYgLTIzMi44MTlDNDAyLjg4NiAtMjY3LjE2MSA0MjguNzE0IC0zMDIuMTQyIDQ1Mi41MzUgLTMzNy43MzZDNDc2LjM2OCAtMzczLjMwMyA0OTguNTMzIC00MTAuNjk2IDUxOS4wNjggLTQ0OS44ODhDNTQzLjg1MyAtNDk3LjM3MiA1NTkuNTc3IC01NDYuNzM0IDU2Ni4yNTIgLTU5Ny45MzRDNTY2LjY0MyAtNjAyLjE4NSA1NjYuOTE3IC02MDYuMDE4IDU2Ny4xIC02MDkuNDZDNTY3LjI0MyAtNjEyLjkwMiA1NjYuMzE3IC02MTcuMSA1NjQuMzM2IC02MjIuMDgxIiBmaWxsPSIjRjVGNUY3Ii8+CjxwYXRoIGQ9Ik02OTYuNTE1IDE4OS4wNjRDNzA0LjYzOCAxODQuMzk2IDcxMi42ODIgMTc5LjYxMSA3MjAuNjg4IDE3NC43MzVWMTM0LjA1N0M2OTcuODE5IDE0OC41MDMgNjczLjgwMyAxNTkuNjM3IDY0OC42MDEgMTY3LjQyMUM2MjIuMDgyIDE3NS42MzUgNTk0LjU1OCAxODAuNjY3IDU2Ni4wMTggMTgyLjU1OEM1NTAuOTIgMTgzLjI2MiA1NDEuMjk4IDE4MS44OTMgNTM3LjEgMTc4LjQzOEM1MzIuODc2IDE3NS4wMDkgNTI5LjA5NSAxNjUuNzUyIDUyNS43NTcgMTUwLjc0NUw1MjMuOTU4IDEzMC41NDlDNTIzLjMzMiAxMTguMTI0IDUyNC43NjYgMTA2Ljc1NSA1MjguMzM5IDk2LjQyODlDNTMxLjg1OSA4Ni4xNTUgNTM2LjEyMiA3NS42MjAzIDU0MS4xMTYgNjQuODc3QzU0NS42MTQgNjQuNDg1OSA1NDkuNTY0IDY0LjM2ODUgNTUzLjAzMiA2NC41MzhDNTU2LjQ3NSA2NC42OTQ1IDU2MC40MzggNjQuNTc3MSA1NjQuOTQ5IDY0LjE3MjlDNTg1Ljg3NSA2NC4zNjg1IDYwNy42MzYgNjEuNzQ3OSA2MzAuMjY5IDU2LjI4NDlDNjUyLjA4MiA1MC42MjY1IDY3MC40IDQxLjI3ODIgNjg1LjI3NyAyOC4yNTMzQzY5NC45MzggMTkuNzc4NiA3MDQuMDI1IDEwLjM3ODMgNzEyLjU2NSAwLjA5MTMwODZINjM5LjUyNkM2MjAuMjU2IDE2Ljk4ODUgNTk2Ljk0NCAyNy40ODQxIDU2OS41MzkgMzEuNDYwN0M1NjcuNjYxIDMxLjc3MzYgNTY2LjM1NyAzMS44MTI3IDU2NS41NzUgMzEuNTY1QzU2NC43NTQgMzEuMzMwMyA1NjMuODI4IDMxLjUxMjggNTYyLjgxMSAzMi4wNDc0QzU2MS45OSAzMS44MTI3IDU2MS42NTEgMzEuNDk5OCA1NjEuNzgxIDMxLjA4MjZDNTYxLjg5OCAzMC42OTE1IDU2MS41NDYgMzAuMzY1NSA1NjAuNzUxIDMwLjEzMDhDNTYwLjk5OSAyOS4zMzU1IDU2MC45MDcgMjguODY2MSA1NjAuNTE2IDI4Ljc2MThDNTYwLjA5OSAyOC42MTg0IDU2MC4wMzQgMjguMTYyIDU2MC4yOTUgMjcuMzUzN0M1NjUuMzc5IDE4LjE3NDkgNTcwLjc3NyA5LjEwMDU1IDU3Ni40MzYgMC4wOTEzMDg2SDQzMC4xNzZDNDI0LjIwNCAxMi42NzMgNDE5LjA1NCAyNS45NDU2IDQxNC44MyAzOS45ODc1QzQwNi40NzMgNjEuOTU2NSA0MDQuMjgyIDgyLjI2OTcgNDA4LjI4NSAxMDAuOTY2QzQxMi4wMTQgMTIwLjQ1OCA0MTguODMzIDEzOC40NjMgNDI4LjcyOCAxNTQuOTgyQzQzOC42MTEgMTcxLjUyOCA0NTIuNDU4IDE4NS4wODcgNDcwLjI1NCAxOTUuN0M0OTAuNzM3IDIwOC44ODEgNTEyLjE0NSAyMTcuNzIxIDUzNC40MDEgMjIyLjI0NUM1NTYuNjQ0IDIyNi43NTcgNTc5Ljg2NSAyMjYuNTA5IDYwNC4xMTUgMjIxLjU2N0M2MDkuNjQzIDIyMC42MTYgNjE1LjI2MyAyMTkuNDY4IDYyMC45MjEgMjE4LjA5OUM2MjYuNTY3IDIxNi43NTYgNjMyLjI3NyAyMTUuMTkyIDYzOC4wNTMgMjEzLjQxOUM2NTkuMDU3IDIwNy41MjUgNjc4LjU2MiAxOTkuMzkgNjk2LjU0MSAxODkuMDc3IiBmaWxsPSIjRjVGNUY3Ii8+CjwvZz4KPGRlZnM+CjxjbGlwUGF0aCBpZD0iY2xpcDBfMjgyMF82OTk5MSI+CjxyZWN0IHdpZHRoPSI3MjEiIGhlaWdodD0iMjU2Ljg0OCIgZmlsbD0id2hpdGUiLz4KPC9jbGlwUGF0aD4KPC9kZWZzPgo8L3N2Zz4K\");background-repeat:no-repeat}@media (min-width: 48em){.duet-hero.duet-theme-turva.duet-hero-content .background-mask{left:181px}}.duet-hero.duet-theme-turva.duet-hero-content .brand-shaped-image{top:-155px;right:0;left:0;width:420px;height:420px;margin:0 auto;border-radius:0;-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;transform:none}@media (min-width: 48em){.duet-hero.duet-theme-turva.duet-hero-content .brand-shaped-image{top:-230px;width:687px;height:637px}}.duet-hero.duet-theme-turva.duet-hero-content .brand-shaped-image .brand-shaped-image-bg{width:600px;height:280px;transform:translate(-50%, 0)}@media (min-width: 48em){.duet-hero.duet-theme-turva.duet-hero-content .brand-shaped-image .brand-shaped-image-bg{width:733px;height:413px}}.duet-hero.duet-theme-turva.duet-hero-content.duet-hero-narrow .background-area{max-width:888px}@media (min-width: 36em){.duet-hero.duet-theme-turva.duet-hero-content.duet-hero-narrow .background-area{padding:0 48px}}@media (min-width: 48em){.duet-hero.duet-theme-turva.duet-hero-content.duet-hero-narrow .background-area{padding:0 72px}}.duet-hero.duet-theme-turva.duet-hero-content .background-area{position:static;padding:0 16px;margin:0 auto}@media (min-width: 36em){.duet-hero.duet-theme-turva.duet-hero-content .background-area{padding:0 28px}}@media (min-width: 62em){.duet-hero.duet-theme-turva.duet-hero-content .background-area{padding:0 56px}}@media (min-width: 76.25em){.duet-hero.duet-theme-turva.duet-hero-content .background-area{max-width:1110px;padding:0}}.duet-hero.duet-theme-turva.duet-hero-content .background-area .background{position:static;height:auto}.duet-hero.duet-theme-turva.duet-hero-content .background-area .background .background-mask{display:none;background-image:none}.duet-hero.duet-theme-turva.duet-hero-content .background-area .background .brand-shaped-image{position:static;width:auto;height:auto}.duet-hero.duet-theme-turva.duet-hero-content .background-area .background .brand-shaped-image .brand-shaped-image-wrapper{width:auto;height:auto}.duet-hero.duet-theme-turva.duet-hero-content .background-area .background .brand-shaped-image .brand-shaped-image-bg{position:static;width:100%;height:auto;aspect-ratio:5/2;transform:none}.duet-hero.duet-theme-turva.duet-hero-content .background-area .background .brand-shaped-image .brand-shaped-image-bg picture{display:block;width:100%;height:100%}.duet-hero.duet-theme-turva.duet-hero-content .background-area .background .brand-shaped-image .brand-shaped-image-bg img{position:static;width:100%;height:100%;object-fit:cover;object-position:50% 50%}.duet-hero.duet-theme-turva.duet-hero-content .brand-shaped-image{border-radius:12px;mask-image:none}.duet-hero.duet-theme-turva.duet-hero-content .duet-hero-wrapper{margin-top:28px}@media (min-width: 48em){.duet-hero.duet-theme-turva.duet-hero-content .duet-hero-wrapper{margin-top:36px}}.duet-hero.duet-theme-turva.duet-hero-with-image{padding-top:0}.duet-hero.duet-theme-turva.duet-hero-with-image .duet-hero-image-mask{margin:0}@media screen and (min-width: 1450px){.duet-hero.duet-theme-turva.duet-hero-with-image .duet-hero-image-mask{transform:translateX(108%)}}@media (min-width: 48em){.duet-hero.duet-theme-turva.duet-hero-with-image{padding-top:48px}}@media (min-width: 62em){.duet-hero.duet-theme-turva.duet-hero-with-image{padding-top:72px}}.duet-hero.duet-theme-turva.duet-hero-with-image .duet-hero-image-wrapper{top:0;height:auto;aspect-ratio:16/10;padding-bottom:0;margin:36px auto;border-radius:16px;transform:none}@media screen and (min-width: 440px){.duet-hero.duet-theme-turva.duet-hero-with-image .duet-hero-image-wrapper{width:80%}}@media (min-width: 48em){.duet-hero.duet-theme-turva.duet-hero-with-image .duet-hero-image-wrapper{margin-top:0}}@media (min-width: 62em){.duet-hero.duet-theme-turva.duet-hero-with-image .duet-hero-image-wrapper{top:72px;right:-80px;width:536px}}@media (min-width: 76.25em){.duet-hero.duet-theme-turva.duet-hero-with-image .duet-hero-image-wrapper{right:-60px;width:650px}}@media screen and (min-width: 1450px){.duet-hero.duet-theme-turva.duet-hero-with-image .duet-hero-image-wrapper{right:0}}.duet-hero.duet-theme-turva.duet-hero-with-image .duet-hero-image-wrapper .duet-hero-image{top:0;left:0;width:100%;height:100%;transform:none}.duet-hero.duet-theme-turva .duet-hero-wrapper{position:static;margin-top:0}.duet-hero.duet-theme-turva .duet-hero-link{color:rgb(230, 23, 64)}.duet-hero.duet-theme-turva .duet-hero-link:hover .duet-hero-action-arrow{color:rgb(140, 0, 30) !important}.duet-hero.duet-theme-turva .duet-hero-action-arrow{color:rgb(230, 23, 64)}";
|
|
13049
13084
|
|
|
13050
13085
|
/**
|
|
13051
13086
|
* @part duet-hero - piercing selector for styling the hero container
|
|
@@ -13171,6 +13206,11 @@ class DuetHero {
|
|
|
13171
13206
|
* Image position.
|
|
13172
13207
|
*/
|
|
13173
13208
|
this.imagePosition = "auto";
|
|
13209
|
+
/**
|
|
13210
|
+
* Make the image load with higher or lower priority. Value "high" sets the img's attributes fetchpriority and loading to
|
|
13211
|
+
* "high" and "eager", while value "low" sets those attributes to "low" and "lazy"
|
|
13212
|
+
*/
|
|
13213
|
+
this.imagePriority = "high";
|
|
13174
13214
|
/**
|
|
13175
13215
|
* Style variation of the hero area.
|
|
13176
13216
|
*/
|
|
@@ -13284,9 +13324,9 @@ class DuetHero {
|
|
|
13284
13324
|
img: {
|
|
13285
13325
|
src: this.image,
|
|
13286
13326
|
alt: this.imageAlt || "",
|
|
13287
|
-
loading: "lazy",
|
|
13327
|
+
loading: this.imagePriority === "low" ? "lazy" : "eager",
|
|
13328
|
+
fetchpriority: this.imagePriority,
|
|
13288
13329
|
class: className || "",
|
|
13289
|
-
role: this.imageAlt ? undefined : "presentation",
|
|
13290
13330
|
},
|
|
13291
13331
|
sources: parsePossibleJSON(this.sources),
|
|
13292
13332
|
});
|
|
@@ -13326,7 +13366,7 @@ class DuetHero {
|
|
|
13326
13366
|
outlineColor = "color-primary-turva";
|
|
13327
13367
|
}
|
|
13328
13368
|
}
|
|
13329
|
-
return (hAsync("div", { key: '
|
|
13369
|
+
return (hAsync("div", { key: 'dfdf7ff48804ea8afc843f2901dae041929c9266', role: "region", class: {
|
|
13330
13370
|
"duet-hero": true,
|
|
13331
13371
|
"duet-theme-turva": this.theme === "turva",
|
|
13332
13372
|
"duet-has-category-icon": !!this.categoryIcon,
|
|
@@ -13344,17 +13384,17 @@ class DuetHero {
|
|
|
13344
13384
|
"duet-hero-text-center": this.variation !== "product" && ((this.textCenter && !this.leftAlign) || campaignOrSection),
|
|
13345
13385
|
"duet-hero-left-align": this.variation === "product" || (this.leftAlign && !campaignOrSection),
|
|
13346
13386
|
"duet-hero-narrow": this.layout === "narrow",
|
|
13347
|
-
}, part: "duet-hero" }, campaignOrSection && this.image && (hAsync("div", { key: '
|
|
13348
|
-
this.processedBack && (hAsync("div", { key: '
|
|
13387
|
+
}, part: "duet-hero" }, campaignOrSection && this.image && (hAsync("div", { key: '38e648e7447b8db00a773ff4025d68500401f7bc', class: "background-area" }, hAsync("div", { key: '803534bf55dc7737cd41ec1d75fbed052334a19a', class: "background-container" }, hAsync("div", { key: '27d0577a3993d7eaa767812700ff290986535b20', class: "background" }, hAsync(DuetPicture, Object.assign({ key: '6cc4a5648f7466ed44125cd22e35a6eeb725b18a' }, getPictureSource(imageClass)))), hAsync("div", { key: '76a95c713cd90761ea2d670389183e2c04a97a80', class: "brand-shape" })))), this.variation === "product" && this.image && (hAsync("div", { key: 'c436973c44f7d497a70a96a51eb0f96be6eda95a', class: { "background-area": true, [this.layout]: true } }, hAsync("div", { key: 'e5a17290d952644ba521a4b3976387456f650cd4', class: { "background-container": true, [this.layout]: true } }, hAsync("div", { key: '8fdf828e65411a86393e096d8f3b6415076d97e0', class: { background: true, [this.layout]: true } }, hAsync("div", { key: '0ada9a2b55d78b2774063d099cb03a8e09693584', class: { "background-mask": true, [this.layout]: true } }), this.theme !== "turva" && hAsync("div", { key: 'b24d91804b31920da022285d0565667c8e92997e', class: { "brand-shape": true, [this.layout]: true } }), hAsync("div", { key: '226619d3d283b31fa7e8caadaf49473a170abb3a', class: { "brand-shaped-image": true, [this.layout]: true } }, hAsync("div", { key: '0a0415ca70e98b277bf151f28e1f4f1639338fa6', class: { "brand-shaped-image-wrapper": true, [this.layout]: true } }, hAsync("div", { key: 'c866eb1fa36ab6cc43e8839669069046c2faae60', class: { "brand-shaped-image-bg": true, [this.layout]: true } }, hAsync(DuetPicture, Object.assign({ key: 'a98b41e51c70043f55128a19718911f321b7527f' }, getPictureSource()))))), this.categoryIcon && (hAsync("div", { key: '0d3b0c0428a32d2df977a6ac63be04ed6a7f72c6', class: { "brand-shaped-icon": true, [this.layout]: true } }, hAsync("duet-icon", { key: '7af6dee3ca69df4b1d8e87830636ec18ad3a40b7', class: { [this.layout]: true }, background: "none", name: this.categoryIcon, margin: "none", size: "auto", responsive: false }))))))), this.variation === "content" && this.image && (hAsync("div", { key: '20bd7ce2aca1d5062f0f0e1f4889a97ec308b1d9', class: "background-area" }, hAsync("div", { key: '1847e876158decc257b4445501d1bb8e208ddb0e', class: "background" }, hAsync("div", { key: '236489bc1fff1be4cf44d267dfbb5c3bcb119dad', class: "background-mask" }), this.theme !== "turva" && hAsync("div", { key: '3c1e73a037c1ec3b129caaac2a689bf60ce62710', class: "brand-shape" }), hAsync("div", { key: '9cfc2c3b6f5022d863fd6c869ffda7e0df51e013', class: "brand-shaped-image" }, hAsync("div", { key: '8471e4f399016fb37f5f5e46f8bab0865179c6a3', class: "brand-shaped-image-wrapper" }, hAsync("div", { key: '68bfcd1b748c5f7d0b3661152a489707f12024ac', class: "brand-shaped-image-bg" }, hAsync(DuetPicture, Object.assign({ key: '78a267d0198018669353675e01ad0ca70491b36f' }, getPictureSource())))))))), hAsync("div", { key: '4ab0bf9e9dee5b6889db6cc396cd304eda1bd870', class: { "duet-hero-wrapper": true, [this.layout]: true } }, this.image && this.variation === "image" && (hAsync("div", { key: '208c46264f1ea0ce04845324a68cf5848ad95535', class: "duet-hero-image-mask" }, hAsync("div", { key: 'b95a0b0a8840c5835a4e9668bd9481fcd9bfa87b', class: "duet-hero-image-wrapper" }, hAsync("div", { key: '04633cc8d3020b921c42551a5e065bc942540fcc', class: "duet-hero-image" }, hAsync(DuetPicture, Object.assign({ key: '7415ca53535a1295d42eb2b29cc6dbe7a93a04ae' }, getPictureSource(imageClass))))))), (this.variation === "gray" || this.variation === "light" || this.variation === "minimal") &&
|
|
13388
|
+
this.processedBack && (hAsync("div", { key: '59cbdb9c4195074e03310b65a88b4bafd74f9916', class: "duet-hero-back" }, hAsync("duet-button", { key: 'ce17a681e39b9ad5c21edec2472175919f68b02f', style: buttonStyles, variation: "plain", icon: "action-arrow-left-small", theme: this.theme, iconSize: "small", color: buttonColor, padding: "none", margin: "none", fixed: true, url: this.processedBack.href, identifier: this.processedBack.id, onClick: event => this.handleClick(event, {
|
|
13349
13389
|
label: this.processedBack.label,
|
|
13350
13390
|
href: this.processedBack.href,
|
|
13351
13391
|
id: this.processedBack.id,
|
|
13352
13392
|
analyticsId: this.processedBack.analyticsId,
|
|
13353
|
-
}) }, this.processedBack.label))), (this.variation === "gray" || this.variation === "minimal") && this.categoryIcon && (hAsync("duet-icon", { key: '
|
|
13393
|
+
}) }, this.processedBack.label))), (this.variation === "gray" || this.variation === "minimal") && this.categoryIcon && (hAsync("duet-icon", { key: '191763dfcef22bcd3ccd7b8ac096ae6446de2d98', class: { "duet-hero-icon": true, "duet-hero-icon-has-heading": this.preHeading !== "" }, size: "x-large", background: this.categoryIconColor, name: this.categoryIcon })), hAsync("div", { key: '7ee11a778839f281ce31673e60f4923ff223e3ac', class: { "duet-hero-text": true }, part: "duet-hero-text" }, (this.preHeading || this.hasPreHeadingSlot) && (hAsync("duet-paragraph", { key: '7d7f43ba3e592cbad30f8f28000ff361209bf443', margin: "none", class: "duet-hero-pre", size: this.variation === "content" ? "small" : "medium", "aria-hidden": "true" }, this.preHeading ? (this.preHeading) : (hAsync("span", null, hAsync("slot", { name: "pre-heading" }))))), hAsync("slot", { key: 'e73727e5aa7fad6aaaceabcf6f81c6572f0a15a9', name: "badge" }), (this.heading || this.hasHeadingSlot) && (hAsync("duet-heading", { key: '5884aecc75704d8dccc6c709a6768ddd578c4dde', theme: this.theme, level: this.hasHeadingSlotNative ? "div" : this.level, class: { "duet-hero-heading": true, "duet-hero-heading-has-pre": this.preHeading !== "" }, color: headingColor, visualLevel: headingVisualLevel, margin: campaignOrSection ? "none" : "auto", accessibleLabel: this.getAccessibleHeading() }, this.heading ? this.heading : hAsync("slot", { name: "heading" }))), campaignOrSection && this.hasSubHeadingSlot && (hAsync("duet-heading", { key: '763778e5026dbfa90ef3e68f0f1b7d037043b88d', theme: this.theme, level: this.hasSubHeadingSlotNative ? "div" : this.subHeadingLevel, class: { "duet-hero-subheading": true }, color: this.theme === "turva" ? "secondary-turva" : "secondary", visualLevel: "h2" }, hAsync("slot", { key: '9588038687bc9dfcb10a04b5e5cdaa6e3ef253de', name: "subheading" }))), this.description && (hAsync("duet-paragraph", { key: 'f0d60545403dfcc453d79aa1bfdd5582b876ae49', theme: this.theme, color: textColor, variation: "intro" }, this.description)), (this.variation === "gray" || this.variation === "minimal") && this.processedListItems && (hAsync("duet-list", { key: '7006a276c36ca7001df5c93d6fc3e792f8a07169', theme: this.theme, "label-width": "30", breakpoint: "large", mobile: this.leftAlign ? undefined : "center" }, this.processedListItems.map(item => (hAsync("duet-list-item", null, hAsync("span", { slot: "label" }, item.label), hAsync("span", { slot: "value" }, item.value)))))), this.buttonLabel && (hAsync("duet-button", { key: '2954e77b3dde7b49573c25f1566d5f820c1dea3b', url: this.buttonUrl, icon: this.icon, iconRight: this.iconRight, iconSize: this.iconSize, variation: buttonVariation, theme: this.theme, identifier: this.buttonId, onClick: event => this.handleClick(event, this.buttonData), fixed: true }, this.buttonLabel)), hAsync("slot", { key: '87703efb26e4376a71a692aa444988dacbf45d68' })), (this.variation === "gray" || this.variation === "minimal") && this.processedActions && (hAsync("div", { key: '92123389406d8b37e76d0305fb7a2e1d194ce1d4', class: "duet-hero-links" }, this.processedActions.map(item => (hAsync("a", { class: "duet-hero-link", href: item.href, id: item.id, target: item.external ? "_blank" : "_self", onClick: event => this.handleClick(event, item) }, hAsync("div", { class: "duet-hero-action-icon" }, hAsync("duet-icon", { size: "small", margin: "none", name: item.icon, color: "currentColor", outline: outlineColor })), hAsync("span", null, item.label), item.external && hAsync("duet-visually-hidden", null, ", ", this.accessibleLabelExternal), item.external && (hAsync("div", { class: "duet-hero-action-arrow" }, hAsync("duet-icon", { icon: newWindowIcon.svg, size: "xx-small", margin: "none", color: "currentColor" })))))))), this.image &&
|
|
13354
13394
|
this.variation !== "image" &&
|
|
13355
13395
|
!campaignOrSection &&
|
|
13356
13396
|
this.variation !== "product" &&
|
|
13357
|
-
this.variation !== "content" && (hAsync("div", { key: '
|
|
13397
|
+
this.variation !== "content" && (hAsync("div", { key: 'cd09b6b83414a647857f014ddd08f9b49b4d122a', class: "duet-hero-image" }, hAsync(DuetPicture, Object.assign({ key: '68b91f0d9db476f3aa31c63b2a04465705e61658' }, getPictureSource(imageClass))))), hAsync("slot", { key: '8f23feb29e40591b85303a1864fb5736274b7596', name: "bottom" }))));
|
|
13358
13398
|
}
|
|
13359
13399
|
get element() { return getElement(this); }
|
|
13360
13400
|
static get watchers() { return {
|
|
@@ -13391,6 +13431,7 @@ class DuetHero {
|
|
|
13391
13431
|
"imageSize": [1, "image-size"],
|
|
13392
13432
|
"imagePosition": [1, "image-position"],
|
|
13393
13433
|
"imageAlt": [1, "image-alt"],
|
|
13434
|
+
"imagePriority": [1, "image-priority"],
|
|
13394
13435
|
"sources": [1],
|
|
13395
13436
|
"variation": [1],
|
|
13396
13437
|
"back": [8],
|
|
@@ -13523,11 +13564,11 @@ class DuetIcon {
|
|
|
13523
13564
|
: {};
|
|
13524
13565
|
const iconStyles = Object.assign({}, iconRotationStyles);
|
|
13525
13566
|
const shapeStyle = this.shape === "brand-rotated" ? "duet-icon-shape-brand" : `duet-icon-shape-${this.shape}`;
|
|
13526
|
-
return (hAsync(Host, { key: '
|
|
13567
|
+
return (hAsync(Host, { key: 'fc3baf3fd1c385e8841cb935f5ea4781fed66367', class: {
|
|
13527
13568
|
"duet-m-0": this.margin === "none",
|
|
13528
13569
|
"duet-icon-has-outline": !!this.outline,
|
|
13529
13570
|
"duet-icon-has-background": !!this.background,
|
|
13530
|
-
} }, hAsync("span", { key: '
|
|
13571
|
+
} }, hAsync("span", { key: '5c8edb2e88c8214bb38753dd019c9d24a1421dad', "aria-hidden": "true", style: styles, class: {
|
|
13531
13572
|
"duet-icon": true,
|
|
13532
13573
|
"duet-theme-turva": this.theme === "turva",
|
|
13533
13574
|
"duet-theme-default": this.theme === "default",
|
|
@@ -13536,7 +13577,7 @@ class DuetIcon {
|
|
|
13536
13577
|
[shapeStyle]: true,
|
|
13537
13578
|
rotated: this.shape === "brand-rotated" && this.theme !== "turva",
|
|
13538
13579
|
"duet-icon-not-responsive": !this.responsive,
|
|
13539
|
-
} }, hAsync("span", { key: '
|
|
13580
|
+
} }, hAsync("span", { key: '93836d0a46c0293fc59790869a0c0732b055c191', "aria-hidden": "true", class: { "duet-icon-svg": true, rotated: this.shape === "brand-rotated" && this.theme !== "turva" }, "data-name": this.name, innerHTML: this.svgContent, style: iconStyles }))));
|
|
13540
13581
|
}
|
|
13541
13582
|
get element() { return getElement(this); }
|
|
13542
13583
|
static get watchers() { return {
|
|
@@ -13698,7 +13739,7 @@ function cleanValue(input, regex) {
|
|
|
13698
13739
|
return newValue;
|
|
13699
13740
|
}
|
|
13700
13741
|
|
|
13701
|
-
const duetInputCss = ".duet-internal-label{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;margin-bottom:12px !important;position:relative;z-index:100;display:inline-flex;width:auto;margin-top:8px !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:600 !important;line-height:1.25;line-height:1.25;color:rgb(8, 42, 77);text-align:left;word-break:break-word;cursor:default}.duet-internal-label.duet-p-0{padding:0 !important}.duet-internal-label.duet-m-0{margin:0 !important}.duet-internal-label span{font-size:1rem;font-weight:600 !important;word-break:break-word}.duet-internal-label.duet-m-0{margin-bottom:0 !important}.duet-internal-label.duet-small-margin{margin-top:8px !important;margin-bottom:4px !important}.duet-internal-label.duet-has-tooltip{padding-right:48px}@media (min-width: 48em){.duet-internal-label.duet-has-tooltip{padding-right:0}}.duet-internal-label.duet-internal-label-small{font-size:0.875rem}.duet-internal-label.duet-internal-label-small span{font-size:0.875rem}.duet-internal-label.duet-weight-normal{font-weight:400 !important}.duet-internal-label.duet-weight-normal span{font-weight:400 !important}.duet-internal-label.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:rgb(23, 42, 59)}*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{margin-right:16px !important}:host(:last-child),:host(:last-of-type){margin-right:0 !important}:host(.form-distribute:last-of-type:not(:last-child)){margin-right:16px !important}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;margin-bottom:12px !important;display:inline-flex;width:100%;min-width:calc(33.333% - 8px);max-width:100%;vertical-align:bottom;text-align:left}@media (min-width: 36em){:host{width:calc(50% - 16px - 3px)}}:host(.duet-expand){width:100% !important}:host(.duet-m-0){margin:0 !important}input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none}input[type=time]::-webkit-datetime-edit-fields-wrapper{padding:0}input[type=time]::-webkit-calendar-picker-indicator{display:none}duet-tooltip,::slotted(duet-tooltip){position:relative;top:12px;right:0}@media (min-width: 48em){duet-tooltip,::slotted(duet-tooltip){right:auto}}duet-caption:not(:last-of-type){margin-bottom:0}.duet-input-placeholder{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:rgb(255, 255, 255)}.duet-input-icon{position:absolute;top:50%;right:16px;z-index:200;width:20px;height:20px;font-size:0;line-height:normal;color:rgb(8, 42, 77);pointer-events:none;transform:translateY(-50%)}.duet-input-container{position:relative;width:100%;height:100%}.duet-input-container.has-clear .duet-input-clear-icon{position:relative;z-index:250}.duet-input-container.has-clear .duet-input-clear-icon button{position:absolute;top:-24px;right:-24px;min-width:48px;min-height:48px;color:rgb(0, 75, 129)}.duet-input-container.has-clear .duet-input-clear-icon button:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-input-container.has-clear .duet-input-clear-icon button:focus,.duet-input-container.has-clear .duet-input-clear-icon button:focus.duet-theme-turva{outline:2px solid;outline-offset:2px;outline-color:rgba(53, 79, 101, 0.8)}.duet-input-container.has-clear .duet-input-clear-icon button:active{opacity:0.75;transition:none}.duet-input-container.has-clear .duet-input-clear-icon.input-padding-xx-small button{top:-12px}.duet-input-container.has-clear .duet-input-clear-icon.input-padding-x-small button{top:-16px}.duet-input-container.has-clear .duet-input-clear-icon.input-padding-small button{top:-20px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-single button{top:-48px;right:0}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-single.input-padding-xx-small button{top:-36px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-single.input-padding-x-small button{top:-40px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-single.input-padding-small button{top:-44px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-double button{top:-24px;right:12px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-double.input-padding-xx-small button{top:-12px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-double.input-padding-x-small button{top:-16px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-double.input-padding-small button{top:-20px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-button button{top:-24px;right:0}.duet-input-container.has-clear.has-icon .duet-input-clear-icon{top:-24px;right:24px}.duet-input-label-container{display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between}@media (min-width: 48em){.duet-input-label-container{justify-content:flex-start}}.duet-input{position:relative;z-index:100;display:block !important;width:100% !important;min-width:8rem;max-width:initial !important;height:auto !important;padding:12px 14px !important;margin:initial !important;margin-bottom:initial !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 !important;font-variant-numeric:tabular-nums;line-height:1.5 !important;color:rgb(8, 42, 77) !important;cursor:initial !important;outline-color:initial !important;background:rgb(255, 255, 255) !important;background-clip:initial !important;border:1px solid rgb(127, 150, 165) !important;border-radius:4px !important;transition:border 150ms ease !important}.duet-input.input-padding-small{padding:8px 10px !important}.duet-input.input-padding-x-small{padding:4px 6px !important}.duet-input.input-padding-xx-small{padding:0px 2px !important}.duet-input.is-number{padding-right:112px !important}.duet-input.is-date{padding-right:64px !important}.duet-input.after-chip{padding-left:8px !important}.has-error .duet-input{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important}.has-error .duet-input+.duet-input-icon{color:rgb(214, 28, 82) !important}.has-icon .duet-input{padding-right:48px !important}.duet-input.align-right{text-align:right}.duet-input::-ms-clear{display:none}.duet-input::-webkit-contacts-auto-fill-button{display:none !important}.duet-input::placeholder{color:rgb(98, 121, 138);opacity:1 !important;transition:color 300ms ease}.duet-input:focus::placeholder{color:rgb(181, 198, 208)}.duet-input[disabled]{color:rgb(98, 121, 138) !important;cursor:not-allowed !important;outline:none !important;background:rgb(228, 236, 239) !important;border-color:rgb(181, 198, 208) !important;opacity:1 !important;-webkit-text-fill-color:rgb(8, 42, 77) !important}.duet-input:hover:not(:disabled):not(:focus){outline:2px solid;outline-color:rgb(127, 150, 165) !important;outline-offset:-1px}.duet-theme-turva .duet-input:hover:not(:disabled):not(:focus),.duet-input:hover:not(:disabled):not(:focus).duet-theme-turva{outline-color:rgb(120, 145, 164) !important}.has-error .duet-input:hover:not(:disabled):not(:focus){outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important;outline-width:2px;outline-color:rgb(214, 28, 82) !important}.duet-input:focus{outline:2px solid;outline-color:rgb(0, 119, 179) !important;outline-offset:-1px}.duet-theme-turva .duet-input:focus,.duet-input:focus.duet-theme-turva{outline-color:rgb(23, 42, 59) !important}.has-error .duet-input:focus{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important;outline-width:2px;outline-color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255) !important}.duet-input:focus+.duet-input-icon{color:rgb(0, 119, 179)}.duet-input[type=search]:not(:placeholder-shown):focus+.duet-input-icon{display:none}.duet-input:not(:focus):not(:hover):invalid{outline:none !important}.duet-input[type=number]::-webkit-inner-spin-button,.duet-input[type=number]::-webkit-outer-spin-button,.duet-input[type=time]::-webkit-inner-spin-button,.duet-input[type=time]::-webkit-outer-spin-button{display:none;margin:0;-webkit-appearance:none}.duet-input::-webkit-search-cancel-button{margin-right:-28px}.duet-input-help{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:rgb(98, 121, 138);border-radius:4px}.duet-input-help span{display:block;margin-top:8px}.has-error .duet-input-help{color:rgb(214, 28, 82)}.duet-label-hidden label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;border:0;clip:rect(0 0 0 0)}.duet-input-relative{position:relative;width:100%}.duet-input-variation-button,.duet-input-variation-button-left{position:relative;width:100%}.duet-input-variation-button .duet-input-relative,.duet-input-variation-button-left .duet-input-relative{display:flex;flex-direction:row;flex-wrap:nowrap;align-content:center;align-items:center;justify-content:flex-start;width:auto}.duet-input-variation-button .duet-input-relative duet-button,.duet-input-variation-button-left .duet-input-relative duet-button{z-index:250;margin-bottom:0}.duet-input-variation-button-left .duet-input-relative{border-radius:4px}.duet-input-variation-button .duet-input-relative .duet-input{border-right-width:0 !important;border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}.duet-input-variation-button-left .duet-input-relative .duet-input{border-left-width:0 !important;border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}.duet-input-variation-revealable{position:relative;width:100%}.duet-input-variation-revealable ::-ms-reveal{display:none}.duet-input-variation-revealable .duet-input-relative{display:flex;flex-direction:row;flex-wrap:nowrap;align-content:center;align-items:center;justify-content:flex-start;width:auto;outline:initial;border:1px solid rgb(127, 150, 165);border-radius:4px;transition:border 150ms ease}.duet-input-variation-revealable .duet-input-relative duet-button{z-index:250;margin-bottom:0}.duet-input-variation-revealable .duet-input-relative .duet-input{border-width:0 !important}.duet-input-variation-revealable .duet-input-relative .duet-input:focus,.duet-input-variation-revealable .duet-input-relative .duet-input:hover{outline:none !important;border-width:0 !important}.duet-input-variation-revealable.disabled .duet-input-relative{outline:none;background:rgb(245, 248, 250);border-color:rgb(212, 223, 229)}.duet-input-variation-revealable.has-error .duet-input-relative{border-color:rgb(214, 28, 82)}.duet-input-variation-revealable.has-focus .duet-input-relative{outline:2px solid;outline-offset:-1px;outline-color:rgb(62, 84, 102);border-color:rgb(0, 119, 179)}.duet-input-variation-revealable:hover:not(.disabled):not(.has-focus) .duet-input-relative{outline:2px solid;outline-color:rgb(127, 150, 165) !important;outline-offset:-1px}.duet-theme-turva .duet-input-variation-revealable:hover:not(.disabled):not(.has-focus) .duet-input-relative,.duet-input-variation-revealable:hover:not(.disabled):not(.has-focus) .duet-input-relative.duet-theme-turva{outline-color:rgb(120, 145, 164) !important}.duet-input-variation-revealable.has-error:hover:not(.disabled) .duet-input-relative{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important}.duet-input-container.has-adornment.has-focus .duet-input-relative,.duet-input-container.has-chips.has-focus .duet-input-relative{outline:2px solid;outline-color:rgb(0, 119, 179) !important;outline-offset:-1px}.duet-theme-turva .duet-input-container.has-adornment.has-focus .duet-input-relative,.duet-input-container.has-adornment.has-focus .duet-input-relative.duet-theme-turva,.duet-theme-turva .duet-input-container.has-chips.has-focus .duet-input-relative,.duet-input-container.has-chips.has-focus .duet-input-relative.duet-theme-turva{outline-color:rgb(23, 42, 59) !important}.duet-input-container.has-adornment:hover:not(:disabled):not(.has-focus) .duet-input-relative,.duet-input-container.has-chips:hover:not(:disabled):not(.has-focus) .duet-input-relative{outline:2px solid;outline-color:rgb(127, 150, 165) !important;outline-offset:-1px}.duet-theme-turva .duet-input-container.has-adornment:hover:not(:disabled):not(.has-focus) .duet-input-relative,.duet-input-container.has-adornment:hover:not(:disabled):not(.has-focus) .duet-input-relative.duet-theme-turva,.duet-theme-turva .duet-input-container.has-chips:hover:not(:disabled):not(.has-focus) .duet-input-relative,.duet-input-container.has-chips:hover:not(:disabled):not(.has-focus) .duet-input-relative.duet-theme-turva{outline-color:rgb(120, 145, 164) !important}.duet-input-container.has-adornment.has-error .duet-input-relative,.duet-input-container.has-chips.has-error .duet-input-relative{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important}.duet-input-container.has-adornment.has-error.has-focus .duet-input-relative,.duet-input-container.has-chips.has-error.has-focus .duet-input-relative{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important;outline-width:2px;outline-color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255) !important}.duet-input-container.has-adornment.has-error:hover:not(:disabled):not(.has-focus) .duet-input-relative,.duet-input-container.has-chips.has-error:hover:not(:disabled):not(.has-focus) .duet-input-relative{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important;outline-width:2px;outline-color:rgb(214, 28, 82) !important}.duet-input-container.has-adornment .duet-input-relative,.duet-input-container.has-chips .duet-input-relative{display:flex;flex-direction:row;flex-wrap:wrap;align-content:center;align-items:center;justify-content:flex-start;width:auto;padding-right:2px;border:1px solid rgb(127, 150, 165);border-radius:4px;transition:border 150ms ease}.duet-input-container.has-adornment .duet-input-relative .duet-input,.duet-input-container.has-chips .duet-input-relative .duet-input{flex-grow:1;flex-basis:4rem;padding-left:0 !important;margin-left:12px !important;border-width:0 !important}.duet-input-container.has-adornment .duet-input-relative .duet-input:focus,.duet-input-container.has-adornment .duet-input-relative .duet-input:hover,.duet-input-container.has-chips .duet-input-relative .duet-input:focus,.duet-input-container.has-chips .duet-input-relative .duet-input:hover{outline:none !important;border-width:0 !important}.duet-input-container.has-adornment .duet-input-relative .duet-input{padding:12px 14px !important;margin:initial !important}.duet-input-container.has-adornment .duet-input-relative .input-adornment{color:rgb(98, 121, 138)}.duet-input-container.has-adornment .duet-input-relative .input-adornment.prefix{padding-left:14px}.duet-input-container.has-adornment .duet-input-relative .input-adornment.suffix{padding-right:14px}.duet-input-container.has-prefix .duet-input-relative .duet-input{padding-left:8px !important}.duet-input-container.has-suffix .duet-input-relative .duet-input{padding-right:8px !important}.duet-theme-turva .duet-input-icon{color:rgb(23, 42, 59)}.duet-theme-turva.duet-input-container.has-clear .duet-input-clear-icon button{color:rgb(8, 42, 77)}.duet-theme-turva.has-error .duet-input+.duet-input-icon{color:rgb(214, 28, 82) !important}.duet-theme-turva:not(.has-error) .duet-input{border-color:rgb(120, 145, 164) !important}.duet-theme-turva .duet-input{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 42, 59) !important}.duet-theme-turva .duet-input[disabled]{color:rgb(95, 122, 143) !important;cursor:not-allowed !important;outline:none !important;background:rgb(228, 233, 237) !important;border-color:rgb(178, 194, 205) !important;opacity:1 !important;-webkit-text-fill-color:rgb(23, 42, 59) !important}.duet-theme-turva .duet-input::placeholder{color:rgb(120, 145, 164)}.duet-theme-turva .duet-input:focus::placeholder{color:rgb(178, 194, 205)}.duet-theme-turva .duet-input:focus+.duet-input-icon{color:rgb(23, 42, 59)}.duet-theme-turva .duet-input-variation-button-left.has-focus .duet-input-relative{border-color:rgb(23, 42, 59)}.duet-theme-turva .duet-input-variation-revealable.has-focus .duet-input-relative{border-color:rgb(23, 42, 59)}.duet-theme-turva .duet-input-help{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(120, 145, 164)}.duet-theme-turva.has-error .duet-input-help{color:rgb(214, 28, 82)}.duet-theme-turva .duet-input-variation-revealable .duet-input-relative{border-color:rgb(120, 145, 164)}.duet-theme-turva.duet-input-variation-revealable.has-error .duet-input-relative{border-color:rgb(214, 28, 82)}.duet-theme-turva.duet-input-variation-revealable.has-focus .duet-input-relative{outline:2px solid;outline-offset:-1px;outline-color:rgb(53, 79, 101);border-color:rgb(23, 42, 59)}.duet-theme-turva .duet-input-container.has-chips.has-focus .duet-input-relative{outline:2px solid;outline-offset:2px;outline-color:rgb(53, 79, 101)}.duet-theme-turva .duet-input-container.has-chips .duet-input-relative{border-color:rgb(120, 145, 164)}";
|
|
13742
|
+
const duetInputCss = ".duet-internal-label{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;margin-bottom:12px !important;position:relative;z-index:100;display:inline-flex;width:auto;margin-top:8px !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:600 !important;line-height:1.25;line-height:1.25;color:rgb(8, 42, 77);text-align:left;word-break:break-word;cursor:default}.duet-internal-label.duet-p-0{padding:0 !important}.duet-internal-label.duet-m-0{margin:0 !important}.duet-internal-label span{font-size:1rem;font-weight:600 !important;word-break:break-word}.duet-internal-label.duet-m-0{margin-bottom:0 !important}.duet-internal-label.duet-small-margin{margin-top:8px !important;margin-bottom:4px !important}.duet-internal-label.duet-has-tooltip{padding-right:48px}@media (min-width: 48em){.duet-internal-label.duet-has-tooltip{padding-right:0}}.duet-internal-label.duet-internal-label-small{font-size:0.875rem}.duet-internal-label.duet-internal-label-small span{font-size:0.875rem}.duet-internal-label.duet-weight-normal{font-weight:400 !important}.duet-internal-label.duet-weight-normal span{font-weight:400 !important}.duet-internal-label.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:rgb(23, 42, 59)}*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{margin-right:16px !important}:host(:last-child),:host(:last-of-type){margin-right:0 !important}:host(.form-distribute:last-of-type:not(:last-child)){margin-right:16px !important}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;margin-bottom:12px !important;display:inline-flex;width:100%;min-width:calc(33.333% - 8px);max-width:100%;vertical-align:bottom;text-align:left}@media (min-width: 36em){:host{width:calc(50% - 16px - 3px)}}:host(.duet-expand){width:100% !important}:host(.duet-m-0){margin:0 !important}input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none}input[type=time]::-webkit-datetime-edit-fields-wrapper{padding:0}input[type=time]::-webkit-calendar-picker-indicator{display:none}duet-tooltip,::slotted(duet-tooltip){position:relative;top:12px;right:0}@media (min-width: 48em){duet-tooltip,::slotted(duet-tooltip){right:auto}}duet-caption:not(:last-of-type){margin-bottom:0}.duet-input-placeholder{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:rgb(255, 255, 255)}.duet-input-icon{position:absolute;top:50%;right:16px;z-index:200;width:20px;height:20px;font-size:0;line-height:normal;color:rgb(8, 42, 77);pointer-events:none;transform:translateY(-50%)}.duet-input-container{position:relative;width:100%;height:100%}.duet-input-container.has-clear .duet-input-clear-icon{position:relative;z-index:250}.duet-input-container.has-clear .duet-input-clear-icon button{position:absolute;top:-24px;right:-24px;min-width:48px;min-height:48px;color:rgb(0, 75, 129)}.duet-input-container.has-clear .duet-input-clear-icon button:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-input-container.has-clear .duet-input-clear-icon button:focus,.duet-input-container.has-clear .duet-input-clear-icon button:focus.duet-theme-turva{outline:2px solid;outline-offset:2px;outline-color:rgba(53, 79, 101, 0.8)}.duet-input-container.has-clear .duet-input-clear-icon button:active{opacity:0.75;transition:none}.duet-input-container.has-clear .duet-input-clear-icon.input-padding-xx-small button{top:-12px}.duet-input-container.has-clear .duet-input-clear-icon.input-padding-x-small button{top:-16px}.duet-input-container.has-clear .duet-input-clear-icon.input-padding-small button{top:-20px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-single button{top:-48px;right:0}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-single.input-padding-xx-small button{top:-36px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-single.input-padding-x-small button{top:-40px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-single.input-padding-small button{top:-44px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-double button{top:-24px;right:12px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-double.input-padding-xx-small button{top:-12px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-double.input-padding-x-small button{top:-16px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-double.input-padding-small button{top:-20px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-button button{top:-24px;right:0}.duet-input-container.has-clear.has-icon .duet-input-clear-icon{top:-24px;right:24px}.duet-input-label-container{display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between}@media (min-width: 48em){.duet-input-label-container{justify-content:flex-start}}.duet-input{position:relative;z-index:100;display:block !important;width:100% !important;min-width:8rem;max-width:initial !important;height:auto !important;padding:12px 14px !important;margin:initial !important;margin-bottom:initial !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 !important;font-variant-numeric:tabular-nums;line-height:1.5 !important;color:rgb(8, 42, 77) !important;cursor:initial !important;outline-color:initial !important;background:rgb(255, 255, 255) !important;background-clip:initial !important;border:1px solid rgb(127, 150, 165) !important;border-radius:4px !important;transition:border 150ms ease !important}.duet-input.input-padding-small{padding:8px 10px !important}.duet-input.input-padding-x-small{padding:4px 6px !important}.duet-input.input-padding-xx-small{padding:0px 2px !important}.duet-input.is-number{padding-right:112px !important}.duet-input.is-date{padding-right:64px !important}.duet-input.after-chip{padding-left:8px !important}.duet-input[readonly]{color:rgb(62, 84, 102) !important;border-color:rgb(212, 223, 229)}.has-error .duet-input{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important}.has-error .duet-input+.duet-input-icon{color:rgb(214, 28, 82) !important}.has-icon .duet-input{padding-right:48px !important}.duet-input.align-right{text-align:right}.duet-input::-ms-clear{display:none}.duet-input::-webkit-contacts-auto-fill-button{display:none !important}.duet-input::placeholder{color:rgb(98, 121, 138);opacity:1 !important;transition:color 300ms ease}.duet-input:focus::placeholder{color:rgb(181, 198, 208)}.duet-input[disabled]{color:rgb(98, 121, 138) !important;cursor:not-allowed !important;outline:none !important;background:rgb(228, 236, 239) !important;border-color:rgb(181, 198, 208) !important;opacity:1 !important;-webkit-text-fill-color:rgb(8, 42, 77) !important}.duet-input:hover:not(:disabled):not(:focus){outline:2px solid;outline-color:rgb(127, 150, 165) !important;outline-offset:-1px}.duet-theme-turva .duet-input:hover:not(:disabled):not(:focus),.duet-input:hover:not(:disabled):not(:focus).duet-theme-turva{outline-color:rgb(120, 145, 164) !important}.has-error .duet-input:hover:not(:disabled):not(:focus){outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important;outline-width:2px;outline-color:rgb(214, 28, 82) !important}.duet-input:focus{outline:2px solid;outline-color:rgb(0, 119, 179) !important;outline-offset:-1px}.duet-theme-turva .duet-input:focus,.duet-input:focus.duet-theme-turva{outline-color:rgb(23, 42, 59) !important}.has-error .duet-input:focus{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important;outline-width:2px;outline-color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255) !important}.duet-input:focus+.duet-input-icon{color:rgb(0, 119, 179)}.duet-input[type=search]:not(:placeholder-shown):focus+.duet-input-icon{display:none}.duet-input:not(:focus):not(:hover):invalid{outline:none !important}.duet-input[type=number]::-webkit-inner-spin-button,.duet-input[type=number]::-webkit-outer-spin-button,.duet-input[type=time]::-webkit-inner-spin-button,.duet-input[type=time]::-webkit-outer-spin-button{display:none;margin:0;-webkit-appearance:none}.duet-input::-webkit-search-cancel-button{margin-right:-28px}.duet-input-help{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:rgb(98, 121, 138);border-radius:4px}.duet-input-help span{display:block;margin-top:8px}.has-error .duet-input-help{color:rgb(214, 28, 82)}.duet-label-hidden label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;border:0;clip:rect(0 0 0 0)}.duet-input-relative{position:relative;width:100%}.duet-input-variation-button,.duet-input-variation-button-left{position:relative;width:100%}.duet-input-variation-button .duet-input-relative,.duet-input-variation-button-left .duet-input-relative{display:flex;flex-direction:row;flex-wrap:nowrap;align-content:center;align-items:center;justify-content:flex-start;width:auto}.duet-input-variation-button .duet-input-relative duet-button,.duet-input-variation-button-left .duet-input-relative duet-button{z-index:250;margin-bottom:0}.duet-input-variation-button-left .duet-input-relative{border-radius:4px}.duet-input-variation-button .duet-input-relative .duet-input{border-right-width:0 !important;border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}.duet-input-variation-button-left .duet-input-relative .duet-input{border-left-width:0 !important;border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}.duet-input-variation-revealable{position:relative;width:100%}.duet-input-variation-revealable ::-ms-reveal{display:none}.duet-input-variation-revealable .duet-input-relative{display:flex;flex-direction:row;flex-wrap:nowrap;align-content:center;align-items:center;justify-content:flex-start;width:auto;outline:initial;border:1px solid rgb(127, 150, 165);border-radius:4px;transition:border 150ms ease}.duet-input-variation-revealable .duet-input-relative duet-button{z-index:250;margin-bottom:0}.duet-input-variation-revealable .duet-input-relative .duet-input{border-width:0 !important}.duet-input-variation-revealable .duet-input-relative .duet-input:focus,.duet-input-variation-revealable .duet-input-relative .duet-input:hover{outline:none !important;border-width:0 !important}.duet-input-variation-revealable.disabled .duet-input-relative{outline:none;background:rgb(245, 248, 250);border-color:rgb(181, 198, 208)}.duet-input-variation-revealable.readonly .duet-input-relative{border-color:rgb(212, 223, 229)}.duet-input-variation-revealable.has-error .duet-input-relative{border-color:rgb(214, 28, 82)}.duet-input-variation-revealable.has-focus .duet-input-relative{outline:2px solid;outline-offset:-1px;outline-color:rgb(62, 84, 102);border-color:rgb(0, 119, 179)}.duet-input-variation-revealable:hover:not(.disabled):not(.has-focus) .duet-input-relative{outline:2px solid;outline-color:rgb(127, 150, 165) !important;outline-offset:-1px}.duet-theme-turva .duet-input-variation-revealable:hover:not(.disabled):not(.has-focus) .duet-input-relative,.duet-input-variation-revealable:hover:not(.disabled):not(.has-focus) .duet-input-relative.duet-theme-turva{outline-color:rgb(120, 145, 164) !important}.duet-input-variation-revealable.has-error:hover:not(.disabled) .duet-input-relative{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important}.duet-input-container.has-adornment.disabled .duet-input-relative,.duet-input-container.has-chips.disabled .duet-input-relative{border-color:rgb(181, 198, 208)}.duet-input-container.has-adornment.readonly .duet-input-relative,.duet-input-container.has-chips.readonly .duet-input-relative{border-color:rgb(212, 223, 229)}.duet-input-container.has-adornment.has-focus .duet-input-relative,.duet-input-container.has-chips.has-focus .duet-input-relative{outline:2px solid;outline-color:rgb(0, 119, 179) !important;outline-offset:-1px}.duet-theme-turva .duet-input-container.has-adornment.has-focus .duet-input-relative,.duet-input-container.has-adornment.has-focus .duet-input-relative.duet-theme-turva,.duet-theme-turva .duet-input-container.has-chips.has-focus .duet-input-relative,.duet-input-container.has-chips.has-focus .duet-input-relative.duet-theme-turva{outline-color:rgb(23, 42, 59) !important}.duet-input-container.has-adornment:hover:not(:disabled):not(.has-focus) .duet-input-relative,.duet-input-container.has-chips:hover:not(:disabled):not(.has-focus) .duet-input-relative{outline:2px solid;outline-color:rgb(127, 150, 165) !important;outline-offset:-1px}.duet-theme-turva .duet-input-container.has-adornment:hover:not(:disabled):not(.has-focus) .duet-input-relative,.duet-input-container.has-adornment:hover:not(:disabled):not(.has-focus) .duet-input-relative.duet-theme-turva,.duet-theme-turva .duet-input-container.has-chips:hover:not(:disabled):not(.has-focus) .duet-input-relative,.duet-input-container.has-chips:hover:not(:disabled):not(.has-focus) .duet-input-relative.duet-theme-turva{outline-color:rgb(120, 145, 164) !important}.duet-input-container.has-adornment.has-error .duet-input-relative,.duet-input-container.has-chips.has-error .duet-input-relative{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important}.duet-input-container.has-adornment.has-error.has-focus .duet-input-relative,.duet-input-container.has-chips.has-error.has-focus .duet-input-relative{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important;outline-width:2px;outline-color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255) !important}.duet-input-container.has-adornment.has-error:hover:not(:disabled):not(.has-focus) .duet-input-relative,.duet-input-container.has-chips.has-error:hover:not(:disabled):not(.has-focus) .duet-input-relative{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important;outline-width:2px;outline-color:rgb(214, 28, 82) !important}.duet-input-container.has-adornment .duet-input-relative,.duet-input-container.has-chips .duet-input-relative{display:flex;flex-direction:row;flex-wrap:wrap;align-content:center;align-items:center;justify-content:flex-start;width:auto;padding-right:2px;border:1px solid rgb(127, 150, 165);border-radius:4px;transition:border 150ms ease}.duet-input-container.has-adornment .duet-input-relative .duet-input,.duet-input-container.has-chips .duet-input-relative .duet-input{flex-grow:1;flex-basis:4rem;padding-left:0 !important;margin-left:12px !important;border-width:0 !important}.duet-input-container.has-adornment .duet-input-relative .duet-input:focus,.duet-input-container.has-adornment .duet-input-relative .duet-input:hover,.duet-input-container.has-chips .duet-input-relative .duet-input:focus,.duet-input-container.has-chips .duet-input-relative .duet-input:hover{outline:none !important;border-width:0 !important}.duet-input-container.has-adornment .duet-input-relative .duet-input{padding:12px 14px !important;margin:initial !important}.duet-input-container.has-adornment .duet-input-relative .input-adornment{color:rgb(98, 121, 138)}.duet-input-container.has-adornment .duet-input-relative .input-adornment.prefix{padding-left:14px}.duet-input-container.has-adornment .duet-input-relative .input-adornment.suffix{padding-right:14px}.duet-input-container.has-prefix .duet-input-relative .duet-input{padding-left:8px !important}.duet-input-container.has-suffix .duet-input-relative .duet-input{padding-right:8px !important}.duet-theme-turva .duet-input-icon{color:rgb(23, 42, 59)}.duet-theme-turva.duet-input-container.has-clear .duet-input-clear-icon button{color:rgb(8, 42, 77)}.duet-theme-turva.has-error .duet-input+.duet-input-icon{color:rgb(214, 28, 82) !important}.duet-theme-turva:not(.has-error) .duet-input{border-color:rgb(120, 145, 164) !important}.duet-theme-turva .duet-input{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 42, 59) !important}.duet-theme-turva .duet-input[readonly]{color:rgb(53, 79, 101) !important;border-color:rgb(212, 221, 226)}.duet-theme-turva .duet-input[disabled]{color:rgb(95, 122, 143) !important;cursor:not-allowed !important;outline:none !important;background:rgb(228, 233, 237) !important;border-color:rgb(178, 194, 205) !important;opacity:1 !important;-webkit-text-fill-color:rgb(23, 42, 59) !important}.duet-theme-turva .duet-input::placeholder{color:rgb(120, 145, 164)}.duet-theme-turva .duet-input:focus::placeholder{color:rgb(178, 194, 205)}.duet-theme-turva .duet-input:focus+.duet-input-icon{color:rgb(23, 42, 59)}.duet-theme-turva .duet-input-variation-button-left.has-focus .duet-input-relative{border-color:rgb(23, 42, 59)}.duet-theme-turva .duet-input-variation-revealable.has-focus .duet-input-relative{border-color:rgb(23, 42, 59)}.duet-theme-turva .duet-input-help{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(120, 145, 164)}.duet-theme-turva.has-error .duet-input-help{color:rgb(214, 28, 82)}.duet-theme-turva .duet-input-variation-revealable .duet-input-relative{border-color:rgb(120, 145, 164)}.duet-theme-turva.duet-input-variation-revealable.disabled .duet-input-relative{border-color:rgb(178, 194, 205)}.duet-theme-turva.duet-input-variation-revealable.readonly .duet-input-relative{border-color:rgb(212, 221, 226)}.duet-theme-turva.duet-input-variation-revealable.has-error .duet-input-relative{border-color:rgb(214, 28, 82)}.duet-theme-turva.duet-input-variation-revealable.has-focus .duet-input-relative{outline:2px solid;outline-offset:-1px;outline-color:rgb(53, 79, 101);border-color:rgb(23, 42, 59)}.duet-theme-turva .duet-input-container.has-chips.has-focus .duet-input-relative{outline:2px solid;outline-offset:2px;outline-color:rgb(53, 79, 101)}.duet-theme-turva .duet-input-container.has-chips .duet-input-relative{border-color:rgb(120, 145, 164)}.duet-theme-turva .duet-input-container.has-chips.disabled .duet-input-relative{border-color:rgb(178, 194, 205)}.duet-theme-turva .duet-input-container.has-chips.readonly .duet-input-relative{border-color:rgb(212, 221, 226)}";
|
|
13702
13743
|
|
|
13703
13744
|
const icons = {
|
|
13704
13745
|
search: searchIcon,
|
|
@@ -13833,6 +13874,13 @@ class DuetInput {
|
|
|
13833
13874
|
* interact with the input, and conveys its inactive state to assistive technologies.
|
|
13834
13875
|
*/
|
|
13835
13876
|
this.disabled = false;
|
|
13877
|
+
/**
|
|
13878
|
+
* Makes the input component not mutable, meaning the user cannot edit the control.
|
|
13879
|
+
* The user can otherwise interact, e.g. by selecting the content and copying it.
|
|
13880
|
+
* Due to differences in different browsers' and screen readers' implementations it
|
|
13881
|
+
* is strongly advisable to use this only with type="text".
|
|
13882
|
+
*/
|
|
13883
|
+
this.readonly = false;
|
|
13836
13884
|
/**
|
|
13837
13885
|
* Controls the margin of the component.
|
|
13838
13886
|
*/
|
|
@@ -13872,7 +13920,8 @@ class DuetInput {
|
|
|
13872
13920
|
*/
|
|
13873
13921
|
this.label = "Label";
|
|
13874
13922
|
/**
|
|
13875
|
-
* Display the input in error state along with an error message.
|
|
13923
|
+
* Display the input in error state along with an error message. If input is disabled or readonly,
|
|
13924
|
+
* error is ignored.
|
|
13876
13925
|
*/
|
|
13877
13926
|
this.error = "";
|
|
13878
13927
|
/**
|
|
@@ -14042,7 +14091,7 @@ class DuetInput {
|
|
|
14042
14091
|
return clearing;
|
|
14043
14092
|
};
|
|
14044
14093
|
this.keyHandler = (event) => {
|
|
14045
|
-
if (isEscapeKey(event) && this.clear) {
|
|
14094
|
+
if (isEscapeKey(event) && this.clear && this.writable) {
|
|
14046
14095
|
this.handleClearClick(event);
|
|
14047
14096
|
}
|
|
14048
14097
|
if (isEnterKey(event) && this.variation === "revealable") {
|
|
@@ -14055,7 +14104,7 @@ class DuetInput {
|
|
|
14055
14104
|
}
|
|
14056
14105
|
if (this.chips && this.nativeInput.value.length === 0) {
|
|
14057
14106
|
if (isBackspaceKey(event)) {
|
|
14058
|
-
if (this.isChipSelected()) {
|
|
14107
|
+
if (this.isChipSelected() && this.writable) {
|
|
14059
14108
|
this.getSelectedChip().removeChip();
|
|
14060
14109
|
setTimeout(() => this.selectLastChip());
|
|
14061
14110
|
}
|
|
@@ -14164,7 +14213,6 @@ class DuetInput {
|
|
|
14164
14213
|
componentWillLoad() {
|
|
14165
14214
|
inheritGlobalTheme(this);
|
|
14166
14215
|
this.disallowedPatternChange();
|
|
14167
|
-
this.isCaptionVisible = !!this.caption;
|
|
14168
14216
|
// Accept also slot element so that other components using duet-input can pass their tooltip slots here.
|
|
14169
14217
|
checkNamedSlotElement(this.element, "tooltip", "duet-tooltip, slot", 1, true);
|
|
14170
14218
|
}
|
|
@@ -14181,8 +14229,14 @@ class DuetInput {
|
|
|
14181
14229
|
disconnectedCallback() {
|
|
14182
14230
|
disconnectLanguageChangeObserver(this);
|
|
14183
14231
|
}
|
|
14232
|
+
componentWillRender() {
|
|
14233
|
+
this.isCaptionVisible = !!this.caption;
|
|
14234
|
+
}
|
|
14184
14235
|
componentDidRender() {
|
|
14185
14236
|
}
|
|
14237
|
+
get writable() {
|
|
14238
|
+
return !this.disabled && !this.readonly;
|
|
14239
|
+
}
|
|
14186
14240
|
/**
|
|
14187
14241
|
* Sets focus on the specified `duet-input`. Use this method instead of the global
|
|
14188
14242
|
* `input.focus()`.
|
|
@@ -14352,7 +14406,7 @@ class DuetInput {
|
|
|
14352
14406
|
this.type !== "password" &&
|
|
14353
14407
|
this.type !== "time" &&
|
|
14354
14408
|
this.variation !== "button";
|
|
14355
|
-
return (hAsync(Host, { key: '
|
|
14409
|
+
return (hAsync(Host, { key: 'a859732fa2ed3e36d5564c93e08d4bd4cb501188', class: { "duet-expand": this.expand, "duet-m-0": this.margin === "none" }, onKeyUp: e => this.keyHandler(e) }, this.type === "time" && (hAsync("duet-visually-hidden", { key: 'ce15aa89693e557f5abd16e8111db759be70c89d', "aria-live": "polite", "aria-atomic": "true" }, selectedTime ? `${this.timeAnnouncement[this.language]} ${selectedTime.toLocaleTimeString()}` : "")), hAsync("div", { key: '58f44c874cc78e07b6ea9f9b07502f46830d389f', class: {
|
|
14356
14410
|
"duet-input-container": true,
|
|
14357
14411
|
"duet-theme-turva": this.theme === "turva",
|
|
14358
14412
|
[`duet-input-variation-${this.variation}`]: true,
|
|
@@ -14361,7 +14415,7 @@ class DuetInput {
|
|
|
14361
14415
|
"has-icon": this.variation !== "button" &&
|
|
14362
14416
|
(!!this.icon ||
|
|
14363
14417
|
(this.type !== "text" && this.type !== "tel" && this.type !== "password" && this.type !== "time")),
|
|
14364
|
-
"has-error": !!this.error,
|
|
14418
|
+
"has-error": !!this.error && this.writable,
|
|
14365
14419
|
"has-chips": this.chips,
|
|
14366
14420
|
"has-clear": this.clear,
|
|
14367
14421
|
"has-focus": this.isFocused,
|
|
@@ -14369,11 +14423,12 @@ class DuetInput {
|
|
|
14369
14423
|
"has-prefix": !!this.fieldPrefix,
|
|
14370
14424
|
"has-suffix": !!this.fieldSuffix,
|
|
14371
14425
|
disabled: this.disabled,
|
|
14372
|
-
|
|
14426
|
+
readonly: this.readonly,
|
|
14427
|
+
} }, hAsync("div", { key: '285821770ae823d73eaaeff2f2c88996778f8b69', class: "duet-input-label-container" }, hAsync(DuetInternalLabel, { key: '3fa55f1f4bd918ba022ecf233e9aff5b972a72db', theme: this.theme === "turva" ? "turva" : "default", margin: this.isCaptionVisible ? "small" : "auto", color: this.labelColor, weight: this.labelWeight, id: this.labelId, for: identifier }, this.label), this.tooltip && (hAsync("duet-tooltip", { key: '2e08a75002784f2269629dce2ae232fa768d0906', class: "duet-input-tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label, theme: this.theme === "turva" ? "turva" : "default" }, this.tooltip)), hAsync("slot", { key: '4125f60b2ae5f69cf6e33ad5485f6d9633b6ea47', name: "tooltip" })), this.caption && (hAsync("duet-caption", { key: 'e7c72af17640691b585f81ac5c9c838ebb8c36b0', id: this.topCaptionId, size: "medium" }, this.caption)), hAsync("div", { key: 'f7228488fa060e6b0344fd86ac487aed1c76a418', class: {
|
|
14373
14428
|
"duet-input-relative": true,
|
|
14374
14429
|
"duet-theme-turva": this.theme === "turva",
|
|
14375
|
-
"has-error": !!this.error,
|
|
14376
|
-
} }, this.placeholder && this.echoPlaceholder && (this.value || this.type === "time") && (hAsync("duet-caption", { key: '
|
|
14430
|
+
"has-error": !!this.error && this.writable,
|
|
14431
|
+
} }, this.placeholder && this.echoPlaceholder && (this.value || this.type === "time") && (hAsync("duet-caption", { key: 'b9f16783722dd5eceffa4c680f735d0a967e2cb1', id: this.topCaptionPlaceholderId, class: "duet-input-placeholder", margin: "none", size: "small" }, this.placeholder)), this.chips && (hAsync("duet-visually-hidden", { key: 'ceeb27c775ffc161915f98aaeeb0cf0a61b56b95', id: this.chipCountId }, ", ", `${this.getAllChips().length} ${getLocaleString(this.chipsSelectedDesriptionLabel)}`, ",")), this.variation === "button-left" && hAsync("slot", { key: '8cccc4fde3d2315b69a9212e2f1bacf627fefa0b', name: "button-left" }), this.fieldPrefix && (hAsync("span", { key: 'cdc1574242d2921e79c871330b4e058e8a7219cb', class: "input-adornment prefix", id: this.prefixId }, this.fieldPrefix)), hAsync("input", Object.assign({ key: '707a06f6db287db4753feafcf24f5d4d1e34d01a', ref: input => (this.nativeInput = input), onInput: this.onInput, onKeyDown: this.onInputKeyDown, onPaste: this.onInputPaste, onBlur: this.onBlur, onFocus: this.onFocus, type: this.getInputType(), class: {
|
|
14377
14432
|
"duet-input": true,
|
|
14378
14433
|
disabled: this.disabled,
|
|
14379
14434
|
"is-number": this.component === "number",
|
|
@@ -14381,17 +14436,17 @@ class DuetInput {
|
|
|
14381
14436
|
"after-chip": this.getAllChips().length > 0,
|
|
14382
14437
|
"align-right": this.inputAlign === "right",
|
|
14383
14438
|
[`input-padding-${this.inputPadding}`]: true,
|
|
14384
|
-
}, value: this.value, disabled: this.disabled, "aria-invalid": this.error ? "true" : "false", "aria-labelledby": this.getAriaLabelledBy(), "aria-controls": this.accessibleControls, "aria-autocomplete": this.accessibleAutocomplete, "aria-activedescendant": this.accessibleActiveDescendant, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-expanded": this.accessibleExpanded, "aria-haspopup": this.accessibleHasPopup, "aria-owns": this.accessibleOwns, "aria-describedby": this.getAriaDescribedBy(), placeholder: this.placeholder, spellcheck: "false", minlength: this.minlength, maxlength: this.maxlength, autocomplete: this.getAutocomplete(), required: this.required, role: this.role, name: this.name, id: identifier }, inputProps)), this.maxlength && (hAsync("duet-visually-hidden", { key: `maxlength-announcement-${this.maxlengthAnnouncementKey}`, "aria-live": "polite", "aria-atomic": "true" }, this.maxlengthAnnouncement)), this.fieldSuffix && (hAsync("span", { key: '
|
|
14439
|
+
}, value: this.value, disabled: this.disabled, readonly: this.readonly, "aria-invalid": this.error && this.writable ? "true" : "false", "aria-labelledby": this.getAriaLabelledBy(), "aria-controls": this.accessibleControls, "aria-autocomplete": this.accessibleAutocomplete, "aria-activedescendant": this.accessibleActiveDescendant, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-expanded": this.accessibleExpanded, "aria-haspopup": this.accessibleHasPopup, "aria-owns": this.accessibleOwns, "aria-describedby": this.getAriaDescribedBy(), placeholder: this.placeholder, spellcheck: "false", minlength: this.minlength, maxlength: this.maxlength, autocomplete: this.getAutocomplete(), required: this.required, role: this.role, name: this.name, id: identifier }, inputProps)), this.maxlength && (hAsync("duet-visually-hidden", { key: `maxlength-announcement-${this.maxlengthAnnouncementKey}`, "aria-live": "polite", "aria-atomic": "true" }, this.maxlengthAnnouncement)), this.fieldSuffix && (hAsync("span", { key: 'b75739603d5e5ad093db7a2440c0b8abc217dcf6', class: "input-adornment suffix", id: this.suffixId }, this.fieldSuffix)), !this.value && hasInputIcon && (hAsync("div", { key: '404d988da35d4387e0eda7e1d343e6d98df86be7', class: "duet-input-icon" }, hAsync("duet-icon", { key: '917289116b7c97efb8f384353f44f02c7fd07205', margin: "none", size: "small", icon: icons[this.type].svg, color: "currentColor" }))), this.clear && this.value && this.writable && (hAsync("div", { key: 'b7b38ab40d68c5092bc82672308572134a033168', class: {
|
|
14385
14440
|
"duet-input-clear-icon": true,
|
|
14386
14441
|
"duet-input-clear-icon-single": !hasInputIcon,
|
|
14387
14442
|
"duet-input-clear-icon-double": !!this.icon,
|
|
14388
14443
|
"duet-input-clear-icon-button": this.variation === "button",
|
|
14389
14444
|
[`input-padding-${this.inputPadding}`]: true,
|
|
14390
|
-
} }, hAsync("button", { key: '
|
|
14445
|
+
} }, hAsync("button", { key: 'ea77d45ff7dde685c5f35e0b33d1c75189d2d6c4', onClick: this.handleClearClick, id: this.clearId, "aria-label": this.clearLabel[this.language], "aria-keyshortcuts": "Escape" }, hAsync("duet-icon", { key: '7807be8fb14c59731458e17b7ceecb99cda77545', margin: "none", size: "medium", name: "action-clear-input", color: "currentColor" })))), this.icon && this.variation !== "button" && (hAsync("div", { key: 'c6a744f0be1c484f051980f70d0a0deed5fcd9c0', class: "duet-input-icon" }, hAsync("duet-icon", { key: '9d33dac97ba817f3bfa11e82097b95499727c885', margin: "none", size: "small", name: this.icon, color: "currentColor" }))), this.variation === "button" && hAsync("slot", { key: '435f5d3927a55c4ce2c17e4483305b4f47afef8b', name: "button" }), this.variation === "revealable" && (hAsync("duet-button", { key: 'a1074a0cfe211da5cdebdf9a81c82d6200de6961', ref: button => (this.togglePasswordRevealedButton = button), onBlur: this.onBlur, onFocus: this.onFocus, onClick: this.togglePasswordRevealed, icon: this.isPasswordRevealed ? "action-hide" : "action-show", accessibleLabel: this.isPasswordRevealed
|
|
14391
14446
|
? this.hidePasswordLabel[this.language]
|
|
14392
|
-
: this.showPasswordLabel[this.language], margin: "none", variation: "input-button-embedded", fixed: true, iconOnly: true })), this.variation === "revealable" && this.isPasswordRevealed !== undefined && (hAsync("duet-visually-hidden", { key: '
|
|
14447
|
+
: this.showPasswordLabel[this.language], margin: "none", variation: "input-button-embedded", fixed: true, iconOnly: true })), this.variation === "revealable" && this.isPasswordRevealed !== undefined && (hAsync("duet-visually-hidden", { key: '0a8bbe5ec03d73b5e673c42a7031c6b097bd8681' }, hAsync("span", { key: 'cf080989a3e7b86369904921249a95fe1cb3bc19', "aria-live": "polite" }, this.isPasswordRevealed
|
|
14393
14448
|
? this.passwordShownAriaAnnouncement[this.language]
|
|
14394
|
-
: this.passwordHiddenAriaAnnouncement[this.language]))), hAsync("slot", { key: '
|
|
14449
|
+
: this.passwordHiddenAriaAnnouncement[this.language]))), hAsync("slot", { key: '32c4cb54404e67cf564c60e555f7aee3437f0282' })), hAsync("span", { key: 'a860619ce4d528dcb8d714ef3680629640c08461', class: "duet-input-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && this.writable && hAsync("span", { key: '3dfc64f27935e571630a215cbd69bcd2c0d8e1f1', class: "duet-input-error" }, this.error)))));
|
|
14395
14450
|
}
|
|
14396
14451
|
get element() { return getElement(this); }
|
|
14397
14452
|
static get watchers() { return {
|
|
@@ -14422,6 +14477,7 @@ class DuetInput {
|
|
|
14422
14477
|
"theme": [1025],
|
|
14423
14478
|
"expand": [4],
|
|
14424
14479
|
"disabled": [516],
|
|
14480
|
+
"readonly": [516],
|
|
14425
14481
|
"identifier": [1],
|
|
14426
14482
|
"margin": [1],
|
|
14427
14483
|
"inputAlign": [1, "input-align"],
|
|
@@ -14470,7 +14526,7 @@ class DuetInput {
|
|
|
14470
14526
|
},
|
|
14471
14527
|
"$listeners$": undefined,
|
|
14472
14528
|
"$lazyBundleId$": "-",
|
|
14473
|
-
"$attrsToReflect$": [["disabled", "disabled"], ["error", "error"]]
|
|
14529
|
+
"$attrsToReflect$": [["disabled", "disabled"], ["readonly", "readonly"], ["error", "error"]]
|
|
14474
14530
|
}; }
|
|
14475
14531
|
}
|
|
14476
14532
|
|
|
@@ -14707,7 +14763,7 @@ function setOpenerExpanded(el, expanded, popup = "true") {
|
|
|
14707
14763
|
}
|
|
14708
14764
|
}
|
|
14709
14765
|
|
|
14710
|
-
const duetLinkCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;display:inline}:host(.duet-link-block){display:block}:host(.duet-link-button){margin-right:8px !important;margin-bottom:12px !important;display:inline-block;width:100%}:host(.duet-link-button):last-child,:host(.duet-link-button):last-of-type{margin-right:0 !important}[alignment=form-distribute]>:host(.duet-link-button):last-of-type:not(:last-child){margin-right:8px !important}:host(.duet-m-0){margin:0 !important}.duet-link{display:inline;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-style:normal;font-weight:400;color:rgb(0, 97, 155);text-decoration:underline;border-radius:4px;transition:300ms ease}.duet-link:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-link:focus,.duet-link:focus.duet-theme-turva{outline:2px solid;outline-offset:2px;outline-color:rgba(53, 79, 101, 0.8)}.duet-link:hover{color:rgb(0, 75, 129);text-decoration:none}.duet-link:active{opacity:0.75;transition:none}button{font-size:inherit;cursor:pointer}.duet-link-is-external.duet-link:not(.block,.button,.card,.article-list),.duet-link-is-download.duet-link:not(.block,.button,.card,.article-list){text-decoration:none}.duet-link-is-external.duet-link:not(.block,.button,.card,.article-list) .duet-link-content,.duet-link-is-download.duet-link:not(.block,.button,.card,.article-list) .duet-link-content{text-decoration:underline}.duet-link-is-external.duet-link:not(.block,.button,.card,.article-list):hover>.duet-link-content,.duet-link-is-download.duet-link:not(.block,.button,.card,.article-list):hover>.duet-link-content{text-decoration:none}.duet-link-is-external.duet-link:not(.block,.button,.card,.article-list) .duet-link-icon-tail,.duet-link-is-download.duet-link:not(.block,.button,.card,.article-list) .duet-link-icon-tail{white-space:nowrap;text-decoration:none}.duet-tab-to-link{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:rgb(0, 119, 179);text-align:center;text-decoration:none;background:rgb(255, 255, 255);border-radius:4px;opacity:0;transition:none}@media (min-width: 106.25em){.duet-tab-to-link{margin-left:20px}}.duet-tab-to-link:focus{top:12px;left:20px;width:auto;height:auto;opacity:1}.block.duet-link,.block-center.duet-link{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:start;padding:16px;font-weight:600;color:rgb(8, 42, 77);text-decoration:none}.block.duet-link.duet-link-has-icon,.block-center.duet-link.duet-link-has-icon{grid-template-columns:auto 1fr auto}.block.duet-link.none,.block-center.duet-link.none{padding:0}.block.duet-link:hover .duet-link-content,.block-center.duet-link:hover .duet-link-content{color:rgb(0, 97, 155)}.block .block__icon,.block-center .block__icon{display:flex}.block .block__icon duet-icon,.block-center .block__icon duet-icon{width:16px;height:16px}.block .block__icon duet-icon.icon-responsive,.block-center .block__icon duet-icon.icon-responsive{width:30px;height:30px}@media (max-width: 22.5em){.block .block__icon duet-icon.icon-responsive,.block-center .block__icon duet-icon.icon-responsive{width:24px;height:24px}}.block .block__content,.block-center .block__content{position:relative;bottom:2px}.block .block__chevron,.block-center .block__chevron{align-self:center}.block .block__chevron-icon,.block-center .block__chevron-icon{transition:300ms ease}.block:not(.duet-link-is-external):hover .block__chevron-icon,.block-center:not(.duet-link-is-external):hover .block__chevron-icon{transform:translateX(4px)}.block-center.duet-link{align-items:center}.block-center .block__content{position:static}.block-center .block__chevron{display:flex;align-items:center}.duet-link.button:not(.duet-link-has-icon-background) .icon-wrap duet-icon{width:20px;height:20px}.duet-link.button.duet-link-has-icon-background .icon-wrap duet-icon{width:20px;height:20px}@media (min-width: 48em){.duet-link.button.duet-link-has-icon-background .icon-wrap duet-icon{width:24px;height:24px}}.duet-link.button,.duet-link.list-button,.duet-link.card{display:flex;gap:12px;align-items:center;width:100%;min-height:48px;padding:14px 16px;line-height:1.25;text-decoration:none;background-color:rgb(255, 255, 255);border:solid 1px rgb(181, 198, 208);border-radius:12px;transition:all 300ms ease}.duet-link.button>*,.duet-link.list-button>*,.duet-link.card>*{flex-shrink:0}.duet-link.button .duet-link-content,.duet-link.list-button .duet-link-content,.duet-link.card .duet-link-content{flex-grow:1;flex-shrink:1;font-size:1rem;font-weight:600;color:rgb(8, 42, 77);text-align:left}.duet-link.button .icon-wrap,.duet-link.list-button .icon-wrap,.duet-link.card .icon-wrap{display:flex;align-items:center;justify-content:center}.duet-link.button .icon-wrap duet-icon,.duet-link.list-button .icon-wrap duet-icon,.duet-link.card .icon-wrap duet-icon{width:24px;height:24px}@media (min-width: 48em){.duet-link.button .icon-wrap duet-icon,.duet-link.list-button .icon-wrap duet-icon,.duet-link.card .icon-wrap duet-icon{width:30px;height:30px}}.duet-link.button .chevron-wrap,.duet-link.list-button .chevron-wrap,.duet-link.card .chevron-wrap{height:16px}.duet-link.button.duet-link-has-icon-background,.duet-link.list-button.duet-link-has-icon-background,.duet-link.card.duet-link-has-icon-background{min-height:60px;padding:12px;padding-right:20px;line-height:1.5}.duet-link.button.duet-link-has-icon-background .icon-wrap,.duet-link.list-button.duet-link-has-icon-background .icon-wrap,.duet-link.card.duet-link-has-icon-background .icon-wrap{width:36px;height:36px;border-radius:8px}.duet-link.button:hover,.duet-link.list-button:hover,.duet-link.card:hover{outline:2px solid rgb(0, 119, 179);border-color:rgb(0, 119, 179)}@media (min-width: 48em){.duet-link.button,.duet-link.list-button,.duet-link.card{min-height:50px}.duet-link.button.duet-link-has-icon-background,.duet-link.list-button.duet-link-has-icon-background,.duet-link.card.duet-link-has-icon-background{gap:16px;min-height:72px;border-radius:16px}.duet-link.button.duet-link-has-icon-background .icon-wrap,.duet-link.list-button.duet-link-has-icon-background .icon-wrap,.duet-link.card.duet-link-has-icon-background .icon-wrap{width:48px;height:48px;border-radius:12px}.duet-link.button.duet-link-has-icon-background .duet-link-content,.duet-link.list-button.duet-link-has-icon-background .duet-link-content,.duet-link.card.duet-link-has-icon-background .duet-link-content{font-size:1.1rem}}.duet-link.button .block__chevron-icon,.duet-link.list-button .block__chevron-icon,.duet-link.card .block__chevron-icon{transition:300ms ease}.duet-link.button:not(.duet-link-is-external):hover .block__chevron-icon,.duet-link.list-button:not(.duet-link-is-external):hover .block__chevron-icon,.duet-link.card:not(.duet-link-is-external):hover .block__chevron-icon{transform:translateX(4px)}.duet-link.list-button{padding:20px 12px 20px 4px;margin-top:-1px;border:solid 1px rgb(181, 198, 208);border-width:1px 0;border-radius:0}.duet-link.list-button .icon-wrap duet-icon{width:20px;height:20px}@media (min-width: 48em){.duet-link.list-button .icon-wrap duet-icon{width:24px;height:24px}}.duet-link.list-button:hover{outline:0;border-color:rgb(181, 198, 208)}.duet-link.list-button:hover .duet-link-content{color:rgb(0, 119, 179)}.duet-link.card{border-color:rgb(228, 236, 239);box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07)}.duet-link.card:not(.duet-link-has-icon){gap:12px;padding:16px}.duet-link.card .chevron-wrap{display:flex;align-items:center;height:100%}.duet-link.card.duet-link-has-icon{gap:12px;align-items:flex-start;padding:16px}.duet-link.card.duet-link-has-icon .icon-wrap{width:48px;height:48px;border-radius:12px}.duet-link.card.duet-link-has-icon .chevron-wrap{height:48px}@media (min-width: 48em){.duet-link.card:not(.duet-link-has-icon){gap:20px;padding:24px}.duet-link.card.duet-link-has-icon{gap:20px;padding:24px}.duet-link.card.duet-link-has-icon .icon-wrap{width:62px;height:62px;border-radius:16px}.duet-link.card.duet-link-has-icon .chevron-wrap{height:62px}}.duet-link.article-list{display:block;padding:20px 0;margin-bottom:-1px;text-decoration:none;border:solid rgb(212, 223, 229);border-width:1px 0;border-radius:0}.duet-link.article-list .duet-link-content{font-weight:600;color:rgb(0, 75, 129)}.duet-link.article-list .duet-link-content-wrap{display:flex}.duet-link.article-list .duet-link-bullet{flex-shrink:0;width:8px;height:8px;margin-top:8px;margin-right:16px;border-radius:2px}.duet-link.article-list .duet-link-meta{display:block;margin-top:4px;font-weight:400;color:rgb(81, 105, 123)}.duet-link.article-list:focus .duet-link-content,.duet-link.article-list:hover .duet-link-content{color:rgb(0, 97, 155);text-decoration:underline}.duet-theme-turva.duet-link{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(185, 3, 41)}.duet-theme-turva.duet-link:hover{color:rgb(140, 0, 30)}.duet-theme-turva.duet-link.button,.duet-theme-turva.duet-link.list-button{border-color:rgb(178, 194, 205)}.duet-theme-turva.duet-link.button .duet-link-content,.duet-theme-turva.duet-link.list-button .duet-link-content{color:rgb(23, 42, 59)}.duet-theme-turva.duet-link.button:hover{outline-color:rgb(230, 23, 64);border-color:rgb(230, 23, 64)}.duet-theme-turva.duet-link.list-button:hover{border-color:rgb(178, 194, 205)}.duet-theme-turva.duet-link.list-button:hover .duet-link-content{color:rgb(230, 23, 64)}.duet-theme-turva.duet-link.card{border-color:rgb(228, 233, 237);box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13)}.duet-theme-turva.duet-link.block,.duet-theme-turva.duet-link.block-center{color:rgb(23, 42, 59)}.duet-theme-turva.duet-link.block .duet-link-content,.duet-theme-turva.duet-link.block-center .duet-link-content{color:rgb(23, 42, 59)}.duet-theme-turva.duet-link.block:hover,.duet-theme-turva.duet-link.block-center:hover{color:rgb(185, 3, 41)}.duet-theme-turva.duet-link.block:hover .duet-link-content,.duet-theme-turva.duet-link.block-center:hover .duet-link-content{color:rgb(185, 3, 41)}.duet-theme-turva.duet-tab-to-link{min-width:120px;color:rgb(23, 42, 59)}";
|
|
14766
|
+
const duetLinkCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;display:inline}:host(.duet-link-block){display:block}:host(.duet-link-button){margin-right:8px !important;margin-bottom:12px !important;display:inline-block;width:100%}:host(.duet-link-button):last-child,:host(.duet-link-button):last-of-type{margin-right:0 !important}[alignment=form-distribute]>:host(.duet-link-button):last-of-type:not(:last-child){margin-right:8px !important}:host(.duet-m-0){margin:0 !important}.duet-link{display:inline;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-style:normal;font-weight:400;color:rgb(0, 97, 155);text-decoration:underline;border-radius:4px;transition:300ms ease}.duet-link:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-link:focus,.duet-link:focus.duet-theme-turva{outline:2px solid;outline-offset:2px;outline-color:rgba(53, 79, 101, 0.8)}.duet-link:hover{color:rgb(0, 75, 129);text-decoration:none}.duet-link:active{opacity:0.75;transition:none}button{font-size:inherit;cursor:pointer}.duet-link-is-external.duet-link:not(.block,.button,.card,.article-list),.duet-link-is-download.duet-link:not(.block,.button,.card,.article-list){text-decoration:none}.duet-link-is-external.duet-link:not(.block,.button,.card,.article-list) .duet-link-content,.duet-link-is-download.duet-link:not(.block,.button,.card,.article-list) .duet-link-content{text-decoration:underline}.duet-link-is-external.duet-link:not(.block,.button,.card,.article-list):hover>.duet-link-content,.duet-link-is-download.duet-link:not(.block,.button,.card,.article-list):hover>.duet-link-content{text-decoration:none}.duet-link-is-external.duet-link:not(.block,.button,.card,.article-list) .duet-link-icon-tail,.duet-link-is-download.duet-link:not(.block,.button,.card,.article-list) .duet-link-icon-tail{white-space:nowrap;text-decoration:none}.duet-tab-to-link{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:rgb(0, 119, 179);text-align:center;text-decoration:none;background:rgb(255, 255, 255);border-radius:4px;opacity:0;transition:none}@media (min-width: 106.25em){.duet-tab-to-link{margin-left:20px}}.duet-tab-to-link:focus{top:12px;left:20px;width:auto;height:auto;opacity:1}.block.duet-link,.block-center.duet-link{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:start;padding:16px;font-weight:600;color:rgb(8, 42, 77);text-decoration:none}.block.duet-link.duet-link-has-icon,.block-center.duet-link.duet-link-has-icon{grid-template-columns:auto 1fr auto}.block.duet-link.none,.block-center.duet-link.none{padding:0}.block.duet-link:hover .duet-link-content,.block-center.duet-link:hover .duet-link-content{color:rgb(0, 97, 155)}.block .block__icon,.block-center .block__icon{display:flex}.block .block__icon duet-icon,.block-center .block__icon duet-icon{width:16px;height:16px}.block .block__icon duet-icon.icon-responsive,.block-center .block__icon duet-icon.icon-responsive{width:30px;height:30px}@media (max-width: 22.5em){.block .block__icon duet-icon.icon-responsive,.block-center .block__icon duet-icon.icon-responsive{width:24px;height:24px}}.block .block__content,.block-center .block__content{position:relative;bottom:2px}.block .block__chevron,.block-center .block__chevron{align-self:center}.block .block__chevron-icon,.block-center .block__chevron-icon{transition:300ms ease}.block:not(.duet-link-is-external):hover .block__chevron-icon,.block-center:not(.duet-link-is-external):hover .block__chevron-icon{transform:translateX(4px)}.block-center.duet-link{align-items:center}.block-center .block__content{position:static}.block-center .block__chevron{display:flex;align-items:center}.duet-link.button:not(.duet-link-has-icon-background) .icon-wrap duet-icon{width:20px;height:20px}.duet-link.button.duet-link-has-icon-background .icon-wrap duet-icon{width:20px;height:20px}@media (min-width: 48em){.duet-link.button.duet-link-has-icon-background .icon-wrap duet-icon{width:24px;height:24px}}.duet-link.button,.duet-link.list-button,.duet-link.card{display:flex;gap:12px;align-items:center;width:100%;min-height:48px;padding:14px 16px;line-height:1.25;text-decoration:none;background-color:rgb(255, 255, 255);border:solid 1px rgb(181, 198, 208);border-radius:12px;transition:all 300ms ease}.duet-link.button>*,.duet-link.list-button>*,.duet-link.card>*{flex-shrink:0}.duet-link.button .duet-link-content,.duet-link.list-button .duet-link-content,.duet-link.card .duet-link-content{flex-grow:1;flex-shrink:1;font-size:1rem;font-weight:600;color:rgb(8, 42, 77);text-align:left}.duet-link.button .icon-wrap,.duet-link.list-button .icon-wrap,.duet-link.card .icon-wrap{display:flex;align-items:center;justify-content:center}.duet-link.button .icon-wrap duet-icon,.duet-link.list-button .icon-wrap duet-icon,.duet-link.card .icon-wrap duet-icon{width:24px;height:24px}@media (min-width: 48em){.duet-link.button .icon-wrap duet-icon,.duet-link.list-button .icon-wrap duet-icon,.duet-link.card .icon-wrap duet-icon{width:30px;height:30px}}.duet-link.button .chevron-wrap,.duet-link.list-button .chevron-wrap,.duet-link.card .chevron-wrap{height:16px}.duet-link.button.duet-link-has-icon-background,.duet-link.list-button.duet-link-has-icon-background,.duet-link.card.duet-link-has-icon-background{min-height:60px;padding:12px;padding-right:20px;line-height:1.5}.duet-link.button.duet-link-has-icon-background .icon-wrap,.duet-link.list-button.duet-link-has-icon-background .icon-wrap,.duet-link.card.duet-link-has-icon-background .icon-wrap{width:36px;height:36px;border-radius:8px}.duet-link.button:hover,.duet-link.list-button:hover,.duet-link.card:hover{outline:2px solid rgb(0, 119, 179);border-color:rgb(0, 119, 179)}@media (min-width: 48em){.duet-link.button,.duet-link.list-button,.duet-link.card{min-height:50px}.duet-link.button.duet-link-has-icon-background,.duet-link.list-button.duet-link-has-icon-background,.duet-link.card.duet-link-has-icon-background{gap:16px;min-height:72px;border-radius:16px}.duet-link.button.duet-link-has-icon-background .icon-wrap,.duet-link.list-button.duet-link-has-icon-background .icon-wrap,.duet-link.card.duet-link-has-icon-background .icon-wrap{width:48px;height:48px;border-radius:12px}.duet-link.button.duet-link-has-icon-background .duet-link-content,.duet-link.list-button.duet-link-has-icon-background .duet-link-content,.duet-link.card.duet-link-has-icon-background .duet-link-content{font-size:1.1rem}}.duet-link.button .block__chevron-icon,.duet-link.list-button .block__chevron-icon,.duet-link.card .block__chevron-icon{transition:300ms ease}.duet-link.button:not(.duet-link-is-external):hover .block__chevron-icon,.duet-link.list-button:not(.duet-link-is-external):hover .block__chevron-icon,.duet-link.card:not(.duet-link-is-external):hover .block__chevron-icon{transform:translateX(4px)}.duet-link.list-button{padding:20px 12px 20px 4px;margin-top:-1px;border:solid 1px rgb(181, 198, 208);border-width:1px 0;border-radius:0}.duet-link.list-button .icon-wrap duet-icon{width:20px;height:20px}@media (min-width: 48em){.duet-link.list-button .icon-wrap duet-icon{width:24px;height:24px}}.duet-link.list-button:hover{outline:0;border-color:rgb(181, 198, 208)}.duet-link.list-button:hover .duet-link-content{color:rgb(0, 119, 179)}.duet-link.card{border-color:rgb(228, 236, 239);box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07)}.duet-link.card:not(.duet-link-has-icon){gap:12px;padding:16px}.duet-link.card .chevron-wrap{display:flex;align-items:center;height:100%}.duet-link.card.duet-link-has-icon{gap:12px;align-items:flex-start;padding:16px}.duet-link.card.duet-link-has-icon .icon-wrap{width:48px;height:48px;border-radius:12px}.duet-link.card.duet-link-has-icon .chevron-wrap{height:48px}@media (min-width: 48em){.duet-link.card:not(.duet-link-has-icon){gap:20px;padding:24px}.duet-link.card.duet-link-has-icon{gap:20px;padding:24px}.duet-link.card.duet-link-has-icon .icon-wrap{width:62px;height:62px;border-radius:16px}.duet-link.card.duet-link-has-icon .chevron-wrap{height:62px}}.duet-link.article-list{display:block;padding:20px 0;margin-bottom:-1px;text-decoration:none;border:solid rgb(212, 223, 229);border-width:1px 0;border-radius:0}.duet-link.article-list .duet-link-content{font-weight:600;color:rgb(0, 75, 129)}.duet-link.article-list .duet-link-content-wrap{display:flex}.duet-link.article-list .duet-link-bullet{flex-shrink:0;width:8px;height:8px;margin-top:8px;margin-right:16px;border-radius:2px}.duet-link.article-list .duet-link-meta{display:block;margin-top:4px;font-weight:400;color:rgb(81, 105, 123)}.duet-link.article-list:focus .duet-link-content,.duet-link.article-list:hover .duet-link-content{color:rgb(0, 97, 155);text-decoration:underline}.duet-theme-turva.duet-link{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(185, 3, 41)}.duet-theme-turva.duet-link:hover{color:rgb(140, 0, 30)}.duet-theme-turva.duet-link.button,.duet-theme-turva.duet-link.list-button{border-color:rgb(178, 194, 205)}.duet-theme-turva.duet-link.button .duet-link-content,.duet-theme-turva.duet-link.list-button .duet-link-content{color:rgb(23, 42, 59)}.duet-theme-turva.duet-link.button:hover{outline-color:rgb(230, 23, 64);border-color:rgb(230, 23, 64)}.duet-theme-turva.duet-link.list-button:hover{border-color:rgb(178, 194, 205)}.duet-theme-turva.duet-link.list-button:hover .duet-link-content{color:rgb(230, 23, 64)}.duet-theme-turva.duet-link.card{border-color:rgb(228, 233, 237);box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13)}.duet-theme-turva.duet-link.card:hover{outline-color:rgb(230, 23, 64);border-color:rgb(230, 23, 64)}.duet-theme-turva.duet-link.block,.duet-theme-turva.duet-link.block-center{color:rgb(23, 42, 59)}.duet-theme-turva.duet-link.block .duet-link-content,.duet-theme-turva.duet-link.block-center .duet-link-content{color:rgb(23, 42, 59)}.duet-theme-turva.duet-link.block:hover,.duet-theme-turva.duet-link.block-center:hover{color:rgb(185, 3, 41)}.duet-theme-turva.duet-link.block:hover .duet-link-content,.duet-theme-turva.duet-link.block-center:hover .duet-link-content{color:rgb(185, 3, 41)}.duet-theme-turva.duet-link.article-list{border-color:rgb(212, 221, 226)}.duet-theme-turva.duet-link.article-list .duet-link-content{color:rgb(23, 42, 59)}.duet-theme-turva.duet-link.article-list .duet-link-meta{color:rgb(72, 100, 122)}.duet-theme-turva.duet-link.article-list:focus .duet-link-content,.duet-theme-turva.duet-link.article-list:hover .duet-link-content{color:rgb(230, 23, 64)}.duet-theme-turva.duet-tab-to-link{min-width:120px;color:rgb(23, 42, 59)}";
|
|
14711
14767
|
|
|
14712
14768
|
/**
|
|
14713
14769
|
* @part duet-link - piercing selector for styling the link
|
|
@@ -14882,10 +14938,10 @@ class DuetLink {
|
|
|
14882
14938
|
const Tag = !this.url && this.variation !== "default" ? "button" : "a";
|
|
14883
14939
|
const role = !this.url && this.variation === "default" ? "button" : null;
|
|
14884
14940
|
const isButton = Tag === "button";
|
|
14885
|
-
return (hAsync(Host, { key: '
|
|
14941
|
+
return (hAsync(Host, { key: '0a7c2de12ea320f4fcf5d73e60200af11254f8c3', class: {
|
|
14886
14942
|
[`duet-link-${this.variation}`]: true,
|
|
14887
14943
|
"duet-m-0": this.margin === "none",
|
|
14888
|
-
} }, hAsync(Tag, { key: '
|
|
14944
|
+
} }, hAsync(Tag, { key: '6351d938da19503fa7c0e3526700729a9f2c054e', href: this.url, class: {
|
|
14889
14945
|
"duet-link": true,
|
|
14890
14946
|
"duet-link-is-external": this.external,
|
|
14891
14947
|
"duet-link-is-download": !!this.download,
|
|
@@ -15141,7 +15197,7 @@ class DuetListItem {
|
|
|
15141
15197
|
* Always the last one in the class.
|
|
15142
15198
|
*/
|
|
15143
15199
|
render() {
|
|
15144
|
-
return (hAsync(Host, { key: '
|
|
15200
|
+
return (hAsync(Host, { key: '93429c86b018cb9924bb270b97c4cc6ea77e15e2', class: {
|
|
15145
15201
|
"duet-theme-turva": this.theme === "turva",
|
|
15146
15202
|
"duet-no-stacking": !this.responsive,
|
|
15147
15203
|
"duet-list-item-breakpoint-x-small": this.breakpoint === "x-small",
|
|
@@ -15149,7 +15205,7 @@ class DuetListItem {
|
|
|
15149
15205
|
"duet-list-item-breakpoint-medium": this.breakpoint === "medium",
|
|
15150
15206
|
"duet-list-item-breakpoint-large": this.breakpoint === "large",
|
|
15151
15207
|
"duet-list-item-breakpoint-x-large": this.breakpoint === "x-large",
|
|
15152
|
-
} }, hAsync("dt", { key: '
|
|
15208
|
+
} }, hAsync("dt", { key: '0cecfd17dc6b92affc741ef0acd7bd0711458349' }, hAsync("slot", { key: '697172f2c68302fa10188e2b403d3cddbd00e87e', name: "label" })), hAsync("dd", { key: 'd9fd6244ee03c35c91e8b22a4ddce2daf7e97c0e' }, hAsync("slot", { key: '52593380dc62cbb4245718eaf4093fa9e1faa45c', name: "value" }))));
|
|
15153
15209
|
}
|
|
15154
15210
|
get element() { return getElement(this); }
|
|
15155
15211
|
static get style() { return duetListItemCss; }
|
|
@@ -15536,10 +15592,10 @@ class DuetMenuBarButton {
|
|
|
15536
15592
|
* Always the last one in the class.
|
|
15537
15593
|
*/
|
|
15538
15594
|
render() {
|
|
15539
|
-
return (hAsync(Host, { key: '
|
|
15595
|
+
return (hAsync(Host, { key: '88f40e311573b2d27899805495afd382b2aad3fb', role: "listitem", onfocus: () => this.setFocus() }, hAsync("button", { key: '08b48017ee3ecd55f15950dfaae5d3ad1793c903', ref: button => (this.nativeButton = button), class: {
|
|
15540
15596
|
"duet-menu-bar-button": true,
|
|
15541
15597
|
"duet-theme-turva": this.theme === "turva",
|
|
15542
|
-
}, "aria-controls": this.accessibleControls, "aria-label": this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-pressed": this.accessiblePressed != null ? this.accessiblePressed.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined }, this.icon && (hAsync("duet-icon", { key: '
|
|
15598
|
+
}, "aria-controls": this.accessibleControls, "aria-label": this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-pressed": this.accessiblePressed != null ? this.accessiblePressed.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined }, this.icon && (hAsync("duet-icon", { key: 'd976b8e93df053c47a8a9eb29f110032af9c5296', class: "menu-bar-button-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: 'ca7e1fdd2f0076481571c6e68dbbf502b07a6eac' }))));
|
|
15543
15599
|
}
|
|
15544
15600
|
get element() { return getElement(this); }
|
|
15545
15601
|
static get style() { return duetMenuBarButtonCss; }
|
|
@@ -15629,17 +15685,17 @@ class DuetMenuBarDropdown {
|
|
|
15629
15685
|
* Always the last one in the class.
|
|
15630
15686
|
*/
|
|
15631
15687
|
render() {
|
|
15632
|
-
return (hAsync(Host, { key: '
|
|
15688
|
+
return (hAsync(Host, { key: 'ff056c7f9b32fc195dce24533ee8630abfeaaf3a', role: "listitem" }, hAsync("div", { key: '60e89230ad26c406f88ac6f97b0aa6c6ba3d375e', class: {
|
|
15633
15689
|
"duet-menu-bar-dropdown": true,
|
|
15634
15690
|
"duet-theme-turva": this.theme === "turva",
|
|
15635
15691
|
active: this.open,
|
|
15636
15692
|
[`duet-menu-bar-dropdown--slot-${this.getVariant()}`]: true,
|
|
15637
|
-
} }, hAsync("button", { key: '
|
|
15693
|
+
} }, hAsync("button", { key: 'f17715296f5d32580c607489aa7af48e86f08d76', ref: element => (this.button = element), "aria-label": this.accessibleLabel, "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", id: "button", type: "button", class: {
|
|
15638
15694
|
active: this.open,
|
|
15639
|
-
}, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: '
|
|
15695
|
+
}, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: 'f8c1548339d36aac26609301b610e0f06970d3f4', class: "menu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: '8c9b33f5e4963f0a44ebfd8c2153e67273e220fe', class: "label" }, hAsync("slot", { key: '384f003e1c584084aa93a1419370fb90ee1dd12b', name: "label" }), hAsync("duet-icon", { key: '09e840b30922276af41659768e0ccdbc2dfd6bfd', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: 'fe85298a3a0c0bdffba6571a62a4946b884aaca1', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
|
|
15640
15696
|
items: true,
|
|
15641
15697
|
hidden: !this.open,
|
|
15642
|
-
} }, hAsync("slot", { key: '
|
|
15698
|
+
} }, hAsync("slot", { key: '826246d0e8db1cc67ad2549613e8ae6dc6a6a6b0' })))));
|
|
15643
15699
|
}
|
|
15644
15700
|
get element() { return getElement(this); }
|
|
15645
15701
|
static get style() { return duetMenuBarDropdownCss; }
|
|
@@ -15706,11 +15762,11 @@ class DuetMenuBarDropdownLink {
|
|
|
15706
15762
|
* Always the last one in the class.
|
|
15707
15763
|
*/
|
|
15708
15764
|
render() {
|
|
15709
|
-
return (hAsync(Host, { key: '
|
|
15765
|
+
return (hAsync(Host, { key: 'd38d954b553c14935519a49e02698a1bd32428b4' }, hAsync("a", { key: '2476410fa261eb67053dbd56f01bc335bdbcbd7d', class: {
|
|
15710
15766
|
"duet-menu-bar-dropdown-link": true,
|
|
15711
15767
|
[`duet-menu-bar-dropdown-link--slot-${this.getVariant()}`]: true,
|
|
15712
15768
|
"duet-theme-turva": this.theme === "turva",
|
|
15713
|
-
}, href: this.href, role: "menuitem", onKeyUp: e => this.handleEscape(e), "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '
|
|
15769
|
+
}, href: this.href, role: "menuitem", onKeyUp: e => this.handleEscape(e), "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: 'ba2417251a7dbd8bc7148c65d0aae529f728b274', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("slot", { key: '257327a6af0a87c8565bf75cace2b5657580783a' }))));
|
|
15714
15770
|
}
|
|
15715
15771
|
get element() { return getElement(this); }
|
|
15716
15772
|
static get style() { return duetMenuBarDropdownLinkCss; }
|
|
@@ -15796,11 +15852,11 @@ class DuetMenuBarItem {
|
|
|
15796
15852
|
*/
|
|
15797
15853
|
render() {
|
|
15798
15854
|
const TagName = this.url ? "a" : "button";
|
|
15799
|
-
return (hAsync(Host, { key: '
|
|
15855
|
+
return (hAsync(Host, { key: 'e9d6de396865bf28beb5717950467d4b0d1f519c', role: "listitem" }, hAsync(TagName, { key: 'f7cbfca8d2781170838b37dfa65714ddbf932145', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: {
|
|
15800
15856
|
"duet-menu-bar-item": true,
|
|
15801
15857
|
"duet-theme-turva": this.theme === "turva",
|
|
15802
15858
|
active: this.active,
|
|
15803
|
-
}, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: '
|
|
15859
|
+
}, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: '934988ad9b43c8e3691c02a698c0677ea2629faa', class: "leading-icon", size: "auto", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: '50cbb5cdd4a117936eea719c9f176667688e74dc' }), (this.trailingIcon || this.external) && (hAsync("duet-icon", { key: 'cfe3ea2669e9d8eb1f14ffa88eacd1c08548f55c', class: {
|
|
15804
15860
|
"trailing-icon": !!this.trailingIcon,
|
|
15805
15861
|
"trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
|
|
15806
15862
|
"external-icon": !!this.external,
|
|
@@ -15865,11 +15921,11 @@ class DuetMenuBarLink {
|
|
|
15865
15921
|
* Always the last one in the class.
|
|
15866
15922
|
*/
|
|
15867
15923
|
render() {
|
|
15868
|
-
return (hAsync(Host, { key: '
|
|
15924
|
+
return (hAsync(Host, { key: '8c3490151abb08fa0f203abfa0d7376b26df086f', role: "listitem" }, hAsync("a", { key: '6b285bf13edb937dc1e7a6e5e6479ae58c9e2578', class: {
|
|
15869
15925
|
"duet-menu-bar-link": true,
|
|
15870
15926
|
"duet-theme-turva": this.theme === "turva",
|
|
15871
15927
|
active: this.active,
|
|
15872
|
-
}, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '
|
|
15928
|
+
}, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '551b1bb669f59a9db03276cc4bfdebd3c42a8929', class: "menu-bar-link-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: '271053e138876c15abe304dcb141122d5d313f1f' }))));
|
|
15873
15929
|
}
|
|
15874
15930
|
get element() { return getElement(this); }
|
|
15875
15931
|
static get style() { return duetMenuBarLinkCss; }
|
|
@@ -15889,7 +15945,7 @@ class DuetMenuBarLink {
|
|
|
15889
15945
|
}; }
|
|
15890
15946
|
}
|
|
15891
15947
|
|
|
15892
|
-
const duetModalCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}.duet-modal-container{position:fixed;top:0;right:0;bottom:0;left:0;z-index:900;visibility:hidden;max-height:100vh;overflow-y:auto;opacity:0;transition:300ms ease;transition-delay:200ms}.duet-modal-container.duet-modal-active{visibility:visible;opacity:1;transition:300ms ease;transition-delay:0s}.duet-modal-container.duet-disable-transitions{transition:none}.duet-modal-container.duet-modal-slide-up{overflow:hidden}::slotted(img){width:100%}.duet-modal-inner{display:flex;align-items:center;width:100%;min-height:100%;padding:20px 16px}@media (min-width: 36em){.duet-modal-inner{padding:48px 16px}}.duet-modal-inner.duet-modal-slide-up{align-items:stretch;justify-content:center;height:100%;padding-top:48px;padding-bottom:0;overflow:hidden}.duet-modal-inner.duet-modal-slide-up::after{position:absolute;bottom:0;z-index:300;display:block;width:100%;max-width:686px;height:48px;margin:auto;pointer-events:none;content:\"\";background:linear-gradient(rgba(255, 255, 255, 0), rgb(255, 255, 255))}.duet-modal-inner.duet-modal-slide-up::after.small{max-width:545px}.duet-modal-inner.duet-modal-slide-up::after.large{max-width:100%}@media (min-width: 36em){.duet-modal-inner.duet-modal-slide-up::after.large{max-width:1110px}}@media (max-width: 35.9375em){.duet-modal-inner.large{padding-right:0;padding-left:0}.duet-modal-inner.duet-modal-slide-up{padding:0;padding-top:28px}}.duet-modal{position:relative;width:100%;max-width:686px;margin:auto;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-weight:400;font-variant-numeric:tabular-nums;line-height:1.5;color:rgb(8, 42, 77);background:rgb(255, 255, 255);border-radius:16px;opacity:0;transform:scale(0.96);transition:300ms ease;transition-delay:0ms}.duet-modal-active .duet-modal{opacity:1;transform:none;transition:300ms ease;transition-delay:200ms}.duet-modal-active .duet-modal.slide-up{top:0;transition:top 600ms ease}.duet-modal.loader{text-align:center;background:transparent}.duet-modal.loader .duet-modal-close{display:none}.duet-modal.loader .duet-modal-spinner{position:relative;height:120px}.duet-modal.loader .duet-modal-inner-slot-default{position:relative;backdrop-filter:blur(10px)}.duet-modal.loader duet-paragraph.duet-loader-message{position:absolute;opacity:0;transform:scaleY(0);transform-origin:top;transition:all 300ms ease}.duet-modal.loader duet-paragraph.duet-loader-message.show{opacity:1;transform:scaleY(1);transform-origin:bottom}.duet-modal.loader duet-paragraph.duet-loader-message.show::part(duet-paragraph){backdrop-filter:blur(10px)}.duet-disable-transitions .duet-modal{transition:none}.duet-modal.small{max-width:545px}.duet-modal.large{max-width:100%}@media (min-width: 36em){.duet-modal.large{max-width:1110px}}.duet-modal.slide-up{top:100vh;margin:0;overflow:auto;border-radius:16px 16px 0 0;opacity:1;transition:top 600ms ease}.duet-modal.duet-modal-has-sticky-header{height:100%;overflow:auto}.duet-modal:focus{outline:0}.duet-modal-body,.duet-modal-sticky-header{width:100%;padding:36px 28px}.duet-modal-body.duet-modal-gutter-none,.duet-modal-sticky-header.duet-modal-gutter-none{padding:0 !important}.duet-modal-body.duet-modal-gutter-small,.duet-modal-sticky-header.duet-modal-gutter-small{padding:36px 20px}.duet-modal-body.duet-modal-gutter-large,.duet-modal-sticky-header.duet-modal-gutter-large{padding:48px 36px}@media (max-width: 22.5em){.duet-modal-body,.duet-modal-sticky-header{padding:36px 20px}.duet-modal-body.duet-modal-gutter-large,.duet-modal-sticky-header.duet-modal-gutter-large{padding:48px 28px}}@media (max-width: 35.9375em){.duet-modal-body,.duet-modal-sticky-header{padding:36px 20px}.duet-modal-body.duet-modal-gutter-large,.duet-modal-sticky-header.duet-modal-gutter-large{padding:48px 36px}}@media (min-width: 36em){.duet-modal-body,.duet-modal-sticky-header{padding:36px}.duet-modal-body.duet-modal-gutter-large,.duet-modal-sticky-header.duet-modal-gutter-large{padding:28px 72px}}@media (min-width: 48em){.duet-modal-body,.duet-modal-sticky-header{padding:36px 72px}.duet-modal-body.duet-modal-gutter-large,.duet-modal-sticky-header.duet-modal-gutter-large{padding:36px 72px}}@media (min-width: 76.25em){.duet-modal-body,.duet-modal-sticky-header{padding:36px 48px 48px}.duet-modal-body.duet-modal-gutter-large,.duet-modal-sticky-header.duet-modal-gutter-large{padding:48px 94px}.small .duet-modal-body,.small .duet-modal-sticky-header{padding:36px 48px}}.duet-modal-header{text-align:center}.duet-modal-sticky-header{position:sticky;top:0;z-index:300;display:block;padding-bottom:12px;text-align:left;background:rgb(240, 247, 250);border-bottom:1px solid rgb(212, 223, 229);border-radius:16px 16px 0 0}.duet-modal-close{position:
|
|
15948
|
+
const duetModalCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}.duet-modal-container{position:fixed;top:0;right:0;bottom:0;left:0;z-index:900;visibility:hidden;max-height:100vh;overflow-y:auto;opacity:0;transition:300ms ease;transition-delay:200ms}.duet-modal-container.duet-modal-active{visibility:visible;opacity:1;transition:300ms ease;transition-delay:0s}.duet-modal-container.duet-disable-transitions{transition:none}.duet-modal-container.duet-modal-slide-up{overflow:hidden}::slotted(img){width:100%}.duet-modal-inner{display:flex;align-items:center;width:100%;min-height:100%;padding:20px 16px}@media (min-width: 36em){.duet-modal-inner{padding:48px 16px}}.duet-modal-inner.duet-modal-slide-up{align-items:stretch;justify-content:center;height:100%;padding-top:48px;padding-bottom:0;overflow:hidden}.duet-modal-inner.duet-modal-slide-up::after{position:absolute;bottom:0;z-index:300;display:block;width:100%;max-width:686px;height:48px;margin:auto;pointer-events:none;content:\"\";background:linear-gradient(rgba(255, 255, 255, 0), rgb(255, 255, 255))}.duet-modal-inner.duet-modal-slide-up::after.small{max-width:545px}.duet-modal-inner.duet-modal-slide-up::after.large{max-width:100%}@media (min-width: 36em){.duet-modal-inner.duet-modal-slide-up::after.large{max-width:1110px}}@media (max-width: 35.9375em){.duet-modal-inner.large{padding-right:0;padding-left:0}.duet-modal-inner.duet-modal-slide-up{padding:0;padding-top:28px}}.duet-modal{position:relative;width:100%;max-width:686px;margin:auto;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-weight:400;font-variant-numeric:tabular-nums;line-height:1.5;color:rgb(8, 42, 77);background:rgb(255, 255, 255);border-radius:16px;opacity:0;transform:scale(0.96);transition:300ms ease;transition-delay:0ms}.duet-modal-active .duet-modal{opacity:1;transform:none;transition:300ms ease;transition-delay:200ms}.duet-modal-active .duet-modal.slide-up{top:0;transition:top 600ms ease}.duet-modal.loader{text-align:center;background:transparent}.duet-modal.loader .duet-modal-close{display:none}.duet-modal.loader .duet-modal-spinner{position:relative;height:120px}.duet-modal.loader .duet-modal-inner-slot-default{position:relative;backdrop-filter:blur(10px)}.duet-modal.loader duet-paragraph.duet-loader-message{position:absolute;opacity:0;transform:scaleY(0);transform-origin:top;transition:all 300ms ease}.duet-modal.loader duet-paragraph.duet-loader-message.show{opacity:1;transform:scaleY(1);transform-origin:bottom}.duet-modal.loader duet-paragraph.duet-loader-message.show::part(duet-paragraph){backdrop-filter:blur(10px)}.duet-disable-transitions .duet-modal{transition:none}.duet-modal.small{max-width:545px}.duet-modal.large{max-width:100%}@media (min-width: 36em){.duet-modal.large{max-width:1110px}}.duet-modal.slide-up{top:100vh;margin:0;overflow:auto;border-radius:16px 16px 0 0;opacity:1;transition:top 600ms ease}.duet-modal.duet-modal-has-sticky-header{height:100%;overflow:auto}.duet-modal:focus{outline:0}.duet-modal-body,.duet-modal-sticky-header{width:100%;padding:36px 28px}.duet-modal-body.duet-modal-gutter-none,.duet-modal-sticky-header.duet-modal-gutter-none{padding:0 !important}.duet-modal-body.duet-modal-gutter-small,.duet-modal-sticky-header.duet-modal-gutter-small{padding:36px 20px}.duet-modal-body.duet-modal-gutter-large,.duet-modal-sticky-header.duet-modal-gutter-large{padding:48px 36px}@media (max-width: 22.5em){.duet-modal-body,.duet-modal-sticky-header{padding:36px 20px}.duet-modal-body.duet-modal-gutter-large,.duet-modal-sticky-header.duet-modal-gutter-large{padding:48px 28px}}@media (max-width: 35.9375em){.duet-modal-body,.duet-modal-sticky-header{padding:36px 20px}.duet-modal-body.duet-modal-gutter-large,.duet-modal-sticky-header.duet-modal-gutter-large{padding:48px 36px}}@media (min-width: 36em){.duet-modal-body,.duet-modal-sticky-header{padding:36px}.duet-modal-body.duet-modal-gutter-large,.duet-modal-sticky-header.duet-modal-gutter-large{padding:28px 72px}}@media (min-width: 48em){.duet-modal-body,.duet-modal-sticky-header{padding:36px 72px}.duet-modal-body.duet-modal-gutter-large,.duet-modal-sticky-header.duet-modal-gutter-large{padding:36px 72px}}@media (min-width: 76.25em){.duet-modal-body,.duet-modal-sticky-header{padding:36px 48px 48px}.duet-modal-body.duet-modal-gutter-large,.duet-modal-sticky-header.duet-modal-gutter-large{padding:48px 94px}.small .duet-modal-body,.small .duet-modal-sticky-header{padding:36px 48px}}.duet-modal-header{text-align:center}.duet-modal-sticky-header{position:sticky;top:0;z-index:300;display:block;padding-bottom:12px;text-align:left;background:rgb(240, 247, 250);border-bottom:1px solid rgb(212, 223, 229);border-radius:16px 16px 0 0}.duet-modal-close{position:relative;z-index:301;float:right;margin:8px}.duet-modal-slide-up .duet-modal-close{position:sticky;top:8px;right:8px}.duet-modal-heading{width:100%;padding-right:60px;overflow:hidden;text-overflow:ellipsis;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:1.25rem;font-style:normal;font-weight:600;font-variant-numeric:tabular-nums;line-height:1.25;color:rgb(8, 42, 77);letter-spacing:-0.01rem;white-space:nowrap;text-decoration:none}.duet-modal-heading.duet-p-0{padding:0 !important}.duet-modal-heading.duet-m-0{margin:0 !important}.duet-theme-turva .duet-modal{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 42, 59)}.duet-theme-turva .duet-modal-sticky-header{background:rgb(253, 247, 242);border-bottom:1px solid rgb(212, 221, 226)}";
|
|
15893
15949
|
|
|
15894
15950
|
// The transition below is slightly higher than the actual CSS transition as VoiceOver on
|
|
15895
15951
|
// iOS has otherwise problems moving the focus from modal back to the original element.
|
|
@@ -16205,14 +16261,13 @@ class DuetModal {
|
|
|
16205
16261
|
var _a, _b;
|
|
16206
16262
|
const iconColor = postfixTheme("primary", this.theme);
|
|
16207
16263
|
const closeColor = postfixTheme("secondary", this.theme);
|
|
16208
|
-
|
|
16209
|
-
return (hAsync("div", { key: '44ad4e8bf6516da0e6350649f8e4cae009f7cf07', ref: modal => (this.modalEl = modal), "aria-label": (_a = this.accessibleLabel) !== null && _a !== void 0 ? _a : this.heading, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-describedby": this.accessibleDescribedBy, role: this.variation === "loader" ? "alert" : "dialog", "aria-modal": this.isSafariBrowser ? false : true, tabindex: "-1", class: {
|
|
16264
|
+
return (hAsync("div", { key: 'b2154a3b1549e84c7bdbc822f5ac8a38e8504a35', ref: modal => (this.modalEl = modal), "aria-label": (_a = this.accessibleLabel) !== null && _a !== void 0 ? _a : this.heading, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-describedby": this.accessibleDescribedBy, role: this.variation === "loader" ? "alert" : "dialog", "aria-modal": this.isSafariBrowser ? undefined : "true", tabindex: "-1", class: {
|
|
16210
16265
|
"duet-modal-container": true,
|
|
16211
16266
|
"duet-theme-turva": this.theme === "turva",
|
|
16212
16267
|
"duet-modal-active": this.open,
|
|
16213
16268
|
"duet-modal-slide-up": this.variation === "slide-up",
|
|
16214
16269
|
"duet-modal-has-sticky-header": this.hasStickyHeader,
|
|
16215
|
-
} }, hAsync("duet-overlay", { key: '
|
|
16270
|
+
} }, hAsync("duet-overlay", { key: '36662031598a265fddec54ebcdd7d4d94e7b8625', "z-index": "-1", visible: this.open, variation: this.variation === "loader" ? "white" : "default" }), hAsync("div", { key: '68c59b43722015abb8936e559cdac7dd6aef6fe7', ref: modalInner => (this.modalInnerEl = modalInner), class: {
|
|
16216
16271
|
"duet-modal-inner": true,
|
|
16217
16272
|
[this.size]: true,
|
|
16218
16273
|
"duet-modal-slide-up": this.variation === "slide-up",
|
|
@@ -16223,22 +16278,22 @@ class DuetModal {
|
|
|
16223
16278
|
this.closeModal(e);
|
|
16224
16279
|
}
|
|
16225
16280
|
}
|
|
16226
|
-
} }, hAsync("div", { key: '
|
|
16281
|
+
} }, hAsync("div", { key: '01ea6b1e9120c277f00937fdbcd41f8b7c956700', ref: modalContentEl => (this.modalContentEl = modalContentEl), "aria-live": this.accessibleAnnounceChanges === "all" ? "polite" : null, "aria-atomic": this.accessibleAnnounceChanges === "all" ? "true" : null, class: {
|
|
16227
16282
|
"duet-modal": true,
|
|
16228
16283
|
"duet-modal-has-sticky-header": this.hasStickyHeader,
|
|
16229
16284
|
[this.size]: true,
|
|
16230
16285
|
[this.variation]: true,
|
|
16231
|
-
} },
|
|
16286
|
+
} }, hAsync("div", { key: '485e05e90114ba206285807ef6e5b0b704137254', class: "duet-modal-close" }, hAsync("duet-button", { key: 'add58ae26c95fe8d4f1f1f9b1320de78e4a08c02', 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 })), this.hasStickyHeader && (hAsync("div", { key: 'a00dc00eca76a103b3b8e144beac8df904bd2a27', class: "duet-modal-sticky-header" }, hAsync("slot", { key: 'd199b48814c854359c3792f967e6e9187bf9d2db', name: "sticky-header" }))), this.gutterSize !== "none" && !this.hasStickyHeader && hAsync("duet-spacer", { key: 'b175ca528a46801e52bbf75a7fb35c4736a986ba' }), hAsync("div", { key: '524aa776ad9bb4bbf48e921d0c71ca25eb71e28d', class: {
|
|
16232
16287
|
"duet-modal-body": true,
|
|
16233
16288
|
"duet-modal-gutter-none": this.gutterSize === "none",
|
|
16234
16289
|
"duet-modal-gutter-small": this.gutterSize === "small",
|
|
16235
16290
|
"duet-modal-gutter-medium": this.gutterSize === "medium",
|
|
16236
16291
|
"duet-modal-gutter-large": this.gutterSize === "large",
|
|
16237
|
-
}, "aria-live": this.accessibleAnnounceChanges === "heading" ? "polite" : null, "aria-atomic": this.accessibleAnnounceChanges === "heading" ? "true" : null }, hAsync("div", { key: '
|
|
16292
|
+
}, "aria-live": this.accessibleAnnounceChanges === "heading" ? "polite" : null, "aria-atomic": this.accessibleAnnounceChanges === "heading" ? "true" : null }, hAsync("div", { key: '90be2af349ec10c2d5ae55be8e74e50cd8032e30', class: "duet-modal-header" }, hAsync("span", { key: '6150e88c970678165ee100eedad0938196b5e0f3', class: "duet-modal-inner-slot-top" }, hAsync("slot", { key: '171a28abe15da7ae258d411b1a552b181b825749', name: "top" })), this.icon && hAsync("duet-icon", { key: 'cf52aeafd15ebfc0e71eb8573a08330bfafd6cbc', name: this.icon, size: "xx-large", color: this.color || iconColor }), this.heading && (hAsync("duet-heading", { key: '706973f2ff5fa09a241907a48ec001fb6df3efe2', "visual-level": (_b = this.headingVisualLevel) !== null && _b !== void 0 ? _b : this.headingLevel, level: this.headingLevel, theme: this.theme }, this.heading))), this.variation === "loader" && (hAsync("div", { key: '8670545fd3e1ada7916a39dd3617ebf7797fa6ce', class: "duet-modal-spinner" }, hAsync("duet-spinner", { key: 'ae2f19a4913255f1ce6263e0003482bb72b6bfae', size: "large", color: postfixTheme("primary", this.theme) }))), hAsync("div", { key: '8e1a2ca420d09f50e2cea2104aade7d9e7062ff9', "aria-live": this.variation === "loader"
|
|
16238
16293
|
? "assertive"
|
|
16239
16294
|
: this.accessibleAnnounceChanges === "body"
|
|
16240
16295
|
? "polite"
|
|
16241
|
-
: null, "aria-atomic": this.accessibleAnnounceChanges === "body" ? "true" : null, class: "duet-modal-inner-slot-default", ref: el => (this.slotContainerEl = el) }, hAsync("slot", { key: '
|
|
16296
|
+
: null, "aria-atomic": this.accessibleAnnounceChanges === "body" ? "true" : null, class: "duet-modal-inner-slot-default", ref: el => (this.slotContainerEl = el) }, hAsync("slot", { key: '07830d94eeb317030caaa0cd706ebf1ef6a8e578' })))))));
|
|
16242
16297
|
}
|
|
16243
16298
|
get element() { return getElement(this); }
|
|
16244
16299
|
static get watchers() { return {
|
|
@@ -16554,23 +16609,23 @@ class DuetMultiselect {
|
|
|
16554
16609
|
*/
|
|
16555
16610
|
render() {
|
|
16556
16611
|
var _a;
|
|
16557
|
-
return (hAsync(Host, { key: '
|
|
16612
|
+
return (hAsync(Host, { key: '0710656376962142671b6c65a3d0c8fa0bfdde17', class: {
|
|
16558
16613
|
"duet-m-0": this.margin === "none",
|
|
16559
16614
|
"duet-expand": this.expand,
|
|
16560
|
-
} }, hAsync("div", { key: '
|
|
16615
|
+
} }, hAsync("div", { key: '690b2414fdae1630e4a55a9ce2e9f5dc540cc435', class: {
|
|
16561
16616
|
"duet-multiselect-container": true,
|
|
16562
16617
|
"duet-label-hidden": this.labelHidden,
|
|
16563
16618
|
"duet-theme-turva": this.theme === "turva",
|
|
16564
16619
|
"duet-input-top-caption-shown": this.isCaptionVisible,
|
|
16565
16620
|
"has-error": !!this.error,
|
|
16566
|
-
}, onKeyDown: (e) => this.onMultiselectKeyDown(e) }, hAsync(DuetInternalLabel, { key: '
|
|
16621
|
+
}, onKeyDown: (e) => this.onMultiselectKeyDown(e) }, hAsync(DuetInternalLabel, { key: 'c469c416d065e20353425c33cc235e356a9a9ac0', theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, color: this.labelColor, weight: this.labelWeight, id: this.labelId, for: this.identifier }, this.label), this.tooltip && (hAsync("duet-tooltip", { key: 'e586ad708e105267607b2e41b36937c4df33bdf4', class: "duet-multiselect-tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), hAsync("slot", { key: '86ac648e522c69ed6f761940c536cbc8c6d89c37', name: "tooltip" }), this.caption && (hAsync("duet-caption", { key: '084247996400fa2100ec5aae3ccf81e46a95488b', id: this.topCaptionId, size: "medium" }, this.caption)), hAsync("div", { key: '2e769d052bb05ed162c5a4d5c855b71ec543aa22', class: "duet-multiselect-wrapper" }, hAsync("button", { key: '221b22293ebe302ae76087c3808a13240bab1bae', id: this.identifier, ref: el => (this.multiselectElement = el), class: { "duet-multiselect": true, "duet-multiselect-active": this.checkboxesVisible }, tabindex: "0", onClick: () => this.toggleCheckboxes(), onFocus: e => this.onFocus(e), onBlur: e => this.onBlur(e), role: "combobox", "aria-expanded": this.checkboxesVisible ? "true" : "false", "aria-haspopup": "listbox", "aria-labelledby": this.labelId, "aria-describedby": this.getDescribedBy(), "aria-owns": `${this.identifier}-checkboxes`, onKeyDown: (e) => this.onMultiselectInputKeyDown(e), disabled: this.disabled }, hAsync("span", { key: '8d39dc569c01d388470dd25e1e51099add2b7bdc', role: "textbox", "aria-readonly": "true", "aria-multiline": "false", "aria-autocomplete": "none", "aria-controls": `${this.identifier}-checkboxes`, "aria-label": this.placeholderLabel[this.language], class: "duet-multiselect-label" }, this.placeholder), this.value && this.value.length > 0 && (hAsync("span", { key: '6b646cb3cb2d53c003ab4bd0fb12373784bcff15', class: "duet-multiselect-badge" }, this.value.length, hAsync("duet-visually-hidden", { key: '2f19ae5e9cef683c2c776e3a52cc6308ee25fe22' }, this.selectedLangObject[this.language], ",", " ", Array.isArray(this.value) ? this.value.map(item => item.label).join(", ") : ""))), hAsync("svg", { key: 'f6731917540f67b11f344b7858feae85a2a40ef9', class: { "duet-multiselect-icon": true, "duet-multiselect-icon--rotate": this.checkboxesVisible }, fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: '48f40a7f7d0c45d6f11f1eb4ae609aa111f40c22', d: "m12 18.999c-.4 0-.776-.156-1.059-.438l-10.721-10.72c-.142-.142-.22-.33-.22-.531 0-.2.078-.389.22-.53.142-.142.33-.22.53-.22s.389.078.53.22l10.72 10.719 10.72-10.719c.142-.142.33-.22.53-.22s.389.078.53.22c.142.142.22.33.22.53s-.078.389-.22.53l-10.72 10.72c-.282.283-.659.439-1.06.439z" }))), hAsync("div", { key: '8edf93a17bb06302959feaa6f37dace7ff6310d6', id: `${this.identifier}-checkboxes`, role: "listbox", class: {
|
|
16567
16622
|
"duet-multiselect-checkboxes": true,
|
|
16568
16623
|
"duet-multiselect-checkboxes-active": this.checkboxesVisible,
|
|
16569
|
-
}, "aria-activedescendant": this.activeDescendant, "aria-multiselectable": "true" }, ((_a = this.processedItems) === null || _a === void 0 ? void 0 : _a.length) && this.allControls && (hAsync("div", { key: '
|
|
16624
|
+
}, "aria-activedescendant": this.activeDescendant, "aria-multiselectable": "true" }, ((_a = this.processedItems) === null || _a === void 0 ? void 0 : _a.length) && this.allControls && (hAsync("div", { key: '54ec6623e55b9282483a4217aa635d8c26f5e54e', class: "duet-multiselect-all-control-buttons" }, hAsync("button", { key: 'ab167f22d9064dd059c36e115b069813894c2985', class: "duet-multiselect-select-all", onClick: this.handleSelectAllClick, id: this.getOptionIdentifier(-2), onKeyDown: (e) => this.onCheckboxKeyDown(e, -2) }, this.selectAllLabel[this.language]), hAsync("button", { key: 'a3f5536268c911481c9330135467a32489fe74cb', class: "duet-multiselect-clear-all", onClick: this.handleClearAllClick, id: this.getOptionIdentifier(-1), onKeyDown: (e) => this.onCheckboxKeyDown(e, -1) }, this.clearAllLabel[this.language]))), this.processedItems &&
|
|
16570
16625
|
this.processedGroups.map(group => (hAsync("fieldset", null, group.label && hAsync("legend", null, group.label), group.items.map((item, key) => {
|
|
16571
16626
|
var _a, _b;
|
|
16572
16627
|
return (hAsync("duet-checkbox", { identifier: this.getOptionIdentifier(key), role: "option", label: item.label, value: item.value, key: item.value, checked: (_a = this.value) === null || _a === void 0 ? void 0 : _a.includes(item), "accessible-selected": ((_b = this.value) === null || _b === void 0 ? void 0 : _b.includes(item)) ? "true" : undefined, disabled: !this.checkboxesVisible || item.disabled, onDuetChange: e => this.toggleCheckbox(e, item), onKeyDown: (e) => this.onCheckboxKeyDown(e, key), theme: this.theme }));
|
|
16573
|
-
})))))), hAsync("span", { key: '
|
|
16628
|
+
})))))), hAsync("span", { key: 'f669eea3585579caeba9b0549367509f85db35ad', class: "duet-multiselect-help duet-multiselect-error", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: '32a00ccdd2e45db427a87dbabb707960b734df4d' }, this.error)))));
|
|
16574
16629
|
}
|
|
16575
16630
|
get element() { return getElement(this); }
|
|
16576
16631
|
static get watchers() { return {
|
|
@@ -16645,7 +16700,7 @@ class DuetNav {
|
|
|
16645
16700
|
* Always the last one in the class.
|
|
16646
16701
|
*/
|
|
16647
16702
|
render() {
|
|
16648
|
-
return (hAsync(Host, { key: '
|
|
16703
|
+
return (hAsync(Host, { key: '328e6c0b204e81ba8492e09f3c99e51ccf54b3c9' }, hAsync("div", { key: 'edbf3c6c3e7e66ba961ef76306be8e57bb379c82', class: { container: true, sticky: this.sticky } }, hAsync("slot", { key: 'beecebafa68e4eecf50fed6d2f66161fcf9ad4f9' }), hAsync("slot", { key: 'e86611d1f874f7fecef786352fb2485465fea16c', name: "mobile" }), hAsync("slot", { key: '614a8c925539ca4fb8820a5dbcea8a17ec0326ae', name: "desktop" }))));
|
|
16649
16704
|
}
|
|
16650
16705
|
get element() { return getElement(this); }
|
|
16651
16706
|
static get style() { return duetNavCss; }
|
|
@@ -16738,11 +16793,11 @@ class DuetNotification {
|
|
|
16738
16793
|
return `${indicatorText}${slottedText}${slottedText.endsWith(".") ? "" : "."} ${this.date}`;
|
|
16739
16794
|
}
|
|
16740
16795
|
render() {
|
|
16741
|
-
return (hAsync("div", { key: '
|
|
16796
|
+
return (hAsync("div", { key: '0755007d365b224053afc86e8ffedecc29f6de2b', role: "listitem", class: {
|
|
16742
16797
|
"duet-notification": true,
|
|
16743
16798
|
"duet-notification-highlight": this.highlight,
|
|
16744
16799
|
"duet-theme-turva": this.theme === "turva",
|
|
16745
|
-
} }, hAsync("a", { key: '
|
|
16800
|
+
} }, hAsync("a", { key: '97d9d1acc01c8cf58e0e668785678cd019b1dd74', ref: element => (this.linkElement = element), href: this.url, target: this.external ? "_blank" : "_self", "aria-label": this.getAriaLabelText() }, hAsync("div", { key: 'faa07470a724ec22d342404194c16acb4e8b4cb9', class: "duet-notification-container" }, hAsync("div", { key: '1d39f1cfafc46c55a644524fc510b26fdb6e6ebd', class: "duet-indicator-container" }, this.highlight && (hAsync("duet-indicator", { key: 'bc0b9e295f7c6915e5199c46ecaa86df05fd5d5a', variation: "new", "accessible-label": this.accessibleLabelUnread }))), hAsync("div", { key: '46714b76ca2114f2c17cabae75faf1cf50729ada', class: "duet-notification-content" }, hAsync("slot", { key: 'c8b0b56c6c9dc513634ac81f5607b4a7c9ef57ef' })), hAsync("div", { key: '1266253fe3753d8f8a652e0cbc35615743ed026d', class: "duet-notification-date" }, this.date)))));
|
|
16746
16801
|
}
|
|
16747
16802
|
get element() { return getElement(this); }
|
|
16748
16803
|
static get style() { return duetNotificationCss; }
|
|
@@ -16889,13 +16944,13 @@ class DuetNotificationDrawer {
|
|
|
16889
16944
|
* Always the last one in the class.
|
|
16890
16945
|
*/
|
|
16891
16946
|
render() {
|
|
16892
|
-
return (hAsync("div", { key: '
|
|
16947
|
+
return (hAsync("div", { key: 'f64474d7b1fc293f9f84b46af781474adc8e4e12', class: {
|
|
16893
16948
|
"duet-drawer": true,
|
|
16894
16949
|
"duet-theme-turva": this.theme === "turva",
|
|
16895
|
-
}, onKeyDown: this.handleKeyDown }, hAsync("button", { key: '
|
|
16950
|
+
}, onKeyDown: this.handleKeyDown }, hAsync("button", { key: '3a50f54565c35db0bcef5b227c931f476ead3aef', ref: el => (this.drawerButtonEl = el), type: "button", class: {
|
|
16896
16951
|
"duet-drawer-toggle": true,
|
|
16897
16952
|
"duet-theme-turva": this.theme === "turva",
|
|
16898
|
-
}, id: "duet-drawer-toggle", "aria-controls": "duet-drawer-content", "aria-expanded": this.isOpen ? "true" : "false", onClick: this.toggleMenu }, this.icon && (hAsync("div", { key: '
|
|
16953
|
+
}, id: "duet-drawer-toggle", "aria-controls": "duet-drawer-content", "aria-expanded": this.isOpen ? "true" : "false", onClick: this.toggleMenu }, this.icon && (hAsync("div", { key: 'cb9054a5811f6bb303959c289fa7b05598f80a9b', class: "duet-drawer-icon" }, hAsync("duet-icon", { key: 'ea93e752d5e5fa5151c358243b3d0f21c3398ea8', margin: "none", size: "x-small", name: this.icon, color: "currentColor" }), this.badge && hAsync("duet-indicator", { key: '2fa021b5e7ca70fc63211f03e648cff1af6a6681', variation: "change" }))), hAsync("span", { key: '517bbd72489ea86aaf16740f5e76057a0905a633', class: "duet-drawer-label" }, this.label), hAsync("div", { key: '35018504fde6cafc82064c1ac372866843b0851b', class: "duet-drawer-caret" }, hAsync("duet-icon", { key: '83ef07800bb0117286b89a88f923003cf4ca7841', margin: "none", size: "auto", icon: arrowDownIcon.svg, color: "currentColor" }))), hAsync("div", { key: 'ffc7ff35e445368c50fc98555f4147b541efd0d0', id: "duet-drawer-content", class: {
|
|
16899
16954
|
"duet-drawer-content": true,
|
|
16900
16955
|
"duet-drawer-right": this.direction === "right",
|
|
16901
16956
|
"duet-drawer-left": this.direction === "left",
|
|
@@ -17402,15 +17457,15 @@ class DuetNumberInput {
|
|
|
17402
17457
|
const identifier = this.identifier || this.inputId;
|
|
17403
17458
|
const maxlength = `${this.localizeValue(this.max)}${this.getUnitString()}`.length;
|
|
17404
17459
|
const cleanedValue = !!this.value ? SafeParseFloat(this.value, this.locale) : null;
|
|
17405
|
-
return (hAsync(Host, { key: '
|
|
17460
|
+
return (hAsync(Host, { key: 'dd6481f3c9a5c1db3d4e4edf06120a79f015d33d', class: {
|
|
17406
17461
|
"duet-theme-turva": this.theme === "turva",
|
|
17407
17462
|
"duet-expand": this.expand,
|
|
17408
17463
|
"duet-m-0": this.margin === "none",
|
|
17409
|
-
} }, hAsync("div", { key: '
|
|
17464
|
+
} }, hAsync("div", { key: 'd6c82f4b745801cd2ae8f256c7bb3f7442bd6949', class: "duet-number-container" }, hAsync("duet-input", { key: 'e4de66a5437265772070627b0cf72ad92218dba9', ref: input => (this.duetInputElement = input), onDuetChange: event => this.handleChange(event), onDuetFocus: this.handleFocus, onDuetBlur: event => this.handleBlur(event), onKeyDown: event => this.handleKeyDown(event), label: this.label, caption: this.caption, value: this.value ? `${this.value}${this.getUnitString()}` : "", error: this.error, "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": cleanedValue != null ? cleanedValue : "", maxlength: maxlength, name: this.name, component: "number", required: this.required, disabled: this.disabled, role: this.role, labelHidden: this.labelHidden, tooltip: this.tooltip, identifier: identifier, theme: this.theme, margin: "none", expand: true, numericKeyboard: true, autoComplete: "off", type: "text", accessibleActiveDescendant: this.accessibleActiveDescendant, accessibleLabelledBy: this.accessibleLabelledBy, accessibleDescription: this.accessibleDescription, accessibleDetails: this.accessibleDetails, accessibleControls: this.accessibleControls, accessibleOwns: this.accessibleOwns, accessibleDescribedBy: this.accessibleDescribedBy }, hAsync("slot", { key: 'e1ebed47dbb766a2b12d71650327e1071f776f97', name: "tooltip", slot: "tooltip" }), hAsync("div", { key: 'b5d814557b3cb9ab4d14afd5afca0d2e7b583a5e', class: { "duet-number-buttons": true, "duet-no-label": this.labelHidden } }, hAsync("button", { key: '1f0d70579892176f9785c6954e9e8c937864b4b2', disabled: this.disabled, "aria-disabled": cleanedValue == null || cleanedValue === this.min ? "true" : "false", class: "duet-number-button duet-number-button-subtract", onClick: this.subtract, type: "button" }, hAsync("duet-visually-hidden", { key: 'ef5fc7aa7e3d4aa2780eac64dd6794488af62d51' }, this.accessibleSubtract
|
|
17410
17465
|
.replace(/\{\s*step\s*\}/, `${this.step}`)
|
|
17411
|
-
.replace(/\{\s*unit\s*\}/, `${this.unit}`)), hAsync("duet-icon", { key: '
|
|
17466
|
+
.replace(/\{\s*unit\s*\}/, `${this.unit}`)), hAsync("duet-icon", { key: '3c5d74395785f44aaf71b2390a30158865d27ad5', icon: subtractIcon.svg, size: "small", margin: "none", color: this.theme === "turva" ? "secondary-turva" : "secondary" })), hAsync("button", { key: '5e0fd58cc1ea01f45694f26f14616e22b5984cf7', disabled: this.disabled, "aria-disabled": cleanedValue === this.max ? "true" : "false", class: "duet-number-button duet-number-button-add", onClick: this.add, type: "button" }, hAsync("duet-visually-hidden", { key: 'b952bdea56d58c9948847ad27d0890e543b5cee8' }, this.accessibleAdd
|
|
17412
17467
|
.replace(/\{\s*step\s*\}/, `${this.step}`)
|
|
17413
|
-
.replace(/\{\s*unit\s*\}/, `${this.unit}`)), hAsync("duet-icon", { key: '
|
|
17468
|
+
.replace(/\{\s*unit\s*\}/, `${this.unit}`)), hAsync("duet-icon", { key: 'e5c4f242dfdb36d1935be12d716f622e6d5a7570', icon: addIcon.svg, size: "small", margin: "none", color: this.theme === "turva" ? "secondary-turva" : "secondary" })))), this.accessibleLiveEnabled && (hAsync("duet-visually-hidden", { key: '2e82bb69f5103762366ebc7d600820849c56ba08', "aria-live": "polite", "aria-atomic": "true", "aria-relevant": "all" }, this.formatAnnouncement())))));
|
|
17414
17469
|
}
|
|
17415
17470
|
get element() { return getElement(this); }
|
|
17416
17471
|
static get style() { return duetNumberInputCss; }
|
|
@@ -17443,6 +17498,7 @@ class DuetNumberInput {
|
|
|
17443
17498
|
"labelDefaults": [1, "label-default"],
|
|
17444
17499
|
"label": [1025],
|
|
17445
17500
|
"labelHidden": [4, "label-hidden"],
|
|
17501
|
+
"caption": [1],
|
|
17446
17502
|
"max": [2],
|
|
17447
17503
|
"name": [1],
|
|
17448
17504
|
"error": [513],
|
|
@@ -17522,7 +17578,7 @@ class DuetOverlay {
|
|
|
17522
17578
|
* Always the last one in the class.
|
|
17523
17579
|
*/
|
|
17524
17580
|
render() {
|
|
17525
|
-
return (hAsync(Host, { key: '
|
|
17581
|
+
return (hAsync(Host, { key: 'ede75e9192a5cc0ae1db5e70f9f1e1623654b5c7', "aria-hidden": "true" }, hAsync("div", { key: '12684840f86edbf45b811415a637a7c26101ae31', style: { zIndex: this.zIndex }, class: {
|
|
17526
17582
|
"duet-overlay": true,
|
|
17527
17583
|
"duet-theme-turva": this.theme === "turva",
|
|
17528
17584
|
"keep-stacking-context": this.keepStackingContext,
|
|
@@ -17612,15 +17668,15 @@ class DuetPageHeading {
|
|
|
17612
17668
|
*/
|
|
17613
17669
|
render() {
|
|
17614
17670
|
const layout = this.layout === "narrow" ? "narrow" : this.layout === "fluid" ? "fluid" : "auto";
|
|
17615
|
-
return (hAsync("div", { key: '
|
|
17671
|
+
return (hAsync("div", { key: '59dfd679550b20ce3934cff294d548fc975c1c25', class: {
|
|
17616
17672
|
"duet-page-heading": true,
|
|
17617
17673
|
"duet-theme-turva": this.theme === "turva",
|
|
17618
17674
|
"has-icon": !!this.icon,
|
|
17619
17675
|
[layout]: true,
|
|
17620
|
-
} }, hAsync("div", { key: '
|
|
17676
|
+
} }, hAsync("div", { key: '258eb3656ba0059840c72bd7806a0439ca52a415', class: "background" }, this.theme === "turva" && hAsync("div", { key: '99ded3829d56deddf33a2fc806d9dd0d72600574', class: "background-mask" }), this.theme !== "turva" && this.shape !== "none" && hAsync("div", { key: '3ba1c95200692d41c5504b61201e8509e3b6a054', class: "brand-shape" }), this.theme !== "turva" && this.shape !== "none" && hAsync("div", { key: '8887d09accb487a364fd18dfeb1184ecb92cc6c3', class: "brand-shape second-shape" }), this.icon && (hAsync("div", { key: '3177e2e35c05cb053c96928e3b0d47378e6da68e', class: {
|
|
17621
17677
|
"brand-shaped-icon": true,
|
|
17622
17678
|
"secondary-background": this.iconBackground === "secondary" && this.theme !== "turva",
|
|
17623
|
-
} }, hAsync("duet-icon", { key: '
|
|
17679
|
+
} }, hAsync("duet-icon", { key: '61898fc2452a5c18f7c259de4dc07d75cf7f8c75', background: "none", name: this.icon, margin: "none", size: "auto", responsive: false })))), hAsync("div", { key: 'ecdede2a7eecfdc568ae7ccbb0614f88c189b143', class: { heading: true, "has-back-button": this.hasButtonSlot } }, hAsync("slot", { key: '319cf123e63319a630230536b32f6157d0ee2aff', name: "heading" }), this.hasButtonSlot && (hAsync("div", { key: 'c6a4b5e6128c6da9a023d6ad2e3c06b206fc83c4', class: "button-container" }, hAsync("slot", { key: 'c78cd05232a91bf956da92477d246d4b31aadabd', name: "button" }))), this.progressCurrentStep !== undefined && this.progressTotalSteps > 0 && (hAsync("div", { key: 'd92c68af2e209cc28656d8e9817e756faa39fa29' }, hAsync("duet-spacer", { key: 'd05f4b7cb5ca7b61417bcc8423e5cf0690a5b40b', size: "large" }), hAsync("div", { key: 'c59a33d2a43f6960c6fd3bd6d8e99b078e8b1281', role: "presentation" }, this.progressIndicator()))))));
|
|
17624
17680
|
}
|
|
17625
17681
|
get element() { return getElement(this); }
|
|
17626
17682
|
static get style() { return duetPageHeadingCss; }
|
|
@@ -18027,32 +18083,32 @@ class DuetPagination {
|
|
|
18027
18083
|
* Always the last one in the class.
|
|
18028
18084
|
*/
|
|
18029
18085
|
render() {
|
|
18030
|
-
return (hAsync(Host, { key: '
|
|
18086
|
+
return (hAsync(Host, { key: 'd4335699dfa6e3335dfcafed3de2cc0b2d0e0267', onKeyDown: e => this.onKeyboardDown(e), class: { "duet-theme-turva": this.theme === "turva" } }, hAsync("nav", { key: '08b38d39cdd61be664e02d24ab6c518ce4e652ce', role: "navigation", "aria-labelledby": this.accessibleLabelledBy ? `${this.accessibleLabelledBy} ${this.listId}` : this.listId, "aria-describedby": this.accessibleDescribedBy ? `${this.accessibleDescribedBy} ${this.listId}` : this.listId, "aria-descriptions": this.accessibleDescription, "aria-details": this.accessibleDetails, ref: el => (this.nativeNav = el), "aria-controls": this.ariaControls, class: {
|
|
18031
18087
|
"duet-pagination-nav": true,
|
|
18032
18088
|
[`duet-pagination-variation-${this.variation}`]: true,
|
|
18033
|
-
} }, this.numbersStore !== "" && (hAsync("div", { key: '
|
|
18089
|
+
} }, this.numbersStore !== "" && (hAsync("div", { key: 'd0dace3644fb466ba455012c04624c2a24b0ff9f', "aria-live": "assertive", "aria-relevant": "text", class: "duet-pagination-overlay", "aria-label": `${this.accessibleLabels.jump_to} ${this.numbersStore}`, part: "navigation-overlay" }, hAsync("duet-badge", { key: '99fced562563224ca9667ddc0c2a3d0cc46604f6', theme: this.theme }, "jump to page : ", this.numbersStore))), hAsync("ol", { key: '392854e8ea2b19e6f7c28434d930db4f733b6485', id: this.listId, class: {
|
|
18034
18090
|
"duet-pagination": true,
|
|
18035
18091
|
"duet-pagination-is-dimmed": this.numbersStore !== "",
|
|
18036
|
-
}, role: "menubar", "aria-label": this.accessibleLabels.pagination_label, "aria-description": this.accessibleLabels.description }, (this.variation === "compact" || this.matchesCompactBreakpoint) && (hAsync("li", { key: '
|
|
18092
|
+
}, role: "menubar", "aria-label": this.accessibleLabels.pagination_label, "aria-description": this.accessibleLabels.description }, (this.variation === "compact" || this.matchesCompactBreakpoint) && (hAsync("li", { key: 'de374f4e19bc9a7dea35fda71123e18c040d3cd6', class: {
|
|
18037
18093
|
"duet-pagination-page-button": true,
|
|
18038
18094
|
"duet-pagination-button-first": true,
|
|
18039
|
-
}, role: "menuitem", part: "navigation-arrow" }, hAsync("duet-action-button", { key: '
|
|
18095
|
+
}, role: "menuitem", part: "navigation-arrow" }, hAsync("duet-action-button", { key: '7d0bf05653e187650b301293c8b48ecf7c19775a', disabled: (this.internalSectionIndex === 0 && this.current <= 1) || this.disabled, "data-direction": "back", accessibleLabel: this.accessibleLabels.first_page, title: this.accessibleLabels.first_page, onClick: e => this.jumpToStart(e), "icon-name": "action-move-to-first", theme: this.theme, url: this.processedPageLinks ? this.processedPageLinks[0] : undefined }))), hAsync("li", { key: '90d13a9f2c13fcca364cc126b01ad46ce8b6f1e9', class: {
|
|
18040
18096
|
"duet-pagination-page-button": true,
|
|
18041
18097
|
"duet-pagination-button-first": true,
|
|
18042
|
-
}, role: "menuitem", part: "navigation-arrow" }, hAsync("duet-action-button", { key: '
|
|
18098
|
+
}, role: "menuitem", part: "navigation-arrow" }, hAsync("duet-action-button", { key: '0e1f27295e8d57233da5e99e921deb0acc40bdf5', disabled: !!((this.internalSectionIndex === 0 && this.current <= 1) ||
|
|
18043
18099
|
(this.current <= 1 && this.processedPageLinks) ||
|
|
18044
|
-
this.disabled), "data-direction": "back", onClick: e => this.onMouseHandler(e, -1), "accessible-label": this.accessibleLabels.previous_page, title: this.accessibleLabels.previous_page, "icon-name": "action-arrow-left-small", theme: this.theme, url: this.processedPageLinks ? this.processedPageLinks[this.current - 2] : undefined })), this.internalSectionIndex !== 0 && this.shouldDisplayNavigation() && (hAsync(Fragment, { key: '
|
|
18045
|
-
this.shouldDisplayNavigation() && (hAsync(Fragment, { key: '
|
|
18100
|
+
this.disabled), "data-direction": "back", onClick: e => this.onMouseHandler(e, -1), "accessible-label": this.accessibleLabels.previous_page, title: this.accessibleLabels.previous_page, "icon-name": "action-arrow-left-small", theme: this.theme, url: this.processedPageLinks ? this.processedPageLinks[this.current - 2] : undefined })), this.internalSectionIndex !== 0 && this.shouldDisplayNavigation() && (hAsync(Fragment, { key: '3fa13a5d834e8c4a9a8a3abe93ef7466955fb3c3' }, hAsync("li", { key: '48750614360629d752ef5338feee64d26ee14070', class: "duet-pagination-item", role: "menuitem", part: "navigation-jump" }, hAsync("duet-button", { key: '851ea5271176c28b4182c932df5420296360a660', disabled: this.disabled, class: "duet-pagination-link duet-pagination-link-jump-back", "center-text": "true", variation: "plain", color: this.theme !== "turva" ? "secondary" : "secondary-turva", margin: "none", accessibleLabel: this.accessibleLabels.first_page, onClick: e => this.jumpToStart(e), theme: this.theme, url: this.processedPageLinks ? this.processedPageLinks[0] : undefined }, hAsync("div", { key: '3577f7013764aaa16cfe26677f0b517d637a55dc', class: "duet-pagination-page-number" }, "1"))), hAsync("li", { key: 'affed7955f766520ba5ab4cbbb2927c31f2e3a7b', class: "duet-pagination-item", role: "menuitem", part: "navigation-section" }, hAsync("duet-button", { key: 'a5c04fd07e5c086c458a50943ea23f8cdd65f136', disabled: this.disabled, class: "duet-pagination-link duet-pagination-link-dots-back", "center-text": "true", color: this.theme !== "turva" ? "secondary" : "secondary-turva", variation: "plain", margin: "none", accessibleLabel: this.accessibleLabels.prev_section.replace("{0}", `${this.visibleItems}`), onClick: e => this.sectionClickHandler(e, -1), theme: this.theme }, hAsync("div", { key: '5af97877da74ed4b46d77eda227d2c20ab045be3', class: "duet-pagination-page-number", "aria-hidden": "true" }, "\u2026"))))), (this.shouldDisplayNavigation() && this.renderPageNumbers()) || this.renderSelect(), (this.internalSectionIndex + 1) * this.visibleItems < this.totalPages &&
|
|
18101
|
+
this.shouldDisplayNavigation() && (hAsync(Fragment, { key: '8480cff4e6aa59cebc295fee8ee08523d87ef5ec' }, (this.internalSectionIndex + 1) * this.visibleItems !== this.totalPages - 1 && (hAsync("li", { key: '0d0af2a75256c727c8fc1e362b5c8628e164d51e', class: "duet-pagination-item", role: "menuitem", part: "navigation-section" }, hAsync("duet-button", { key: 'b9009792ab06fed817fa435c1434c0a73fa1b9ec', disabled: this.disabled, class: "duet-pagination-link duet-pagination-link-dots-forward", "center-text": "true", color: this.theme !== "turva" ? "secondary" : "secondary-turva", variation: "plain", margin: "none", accessibleLabel: this.accessibleLabels.next_section.replace("{0}", `${this.visibleItems}`), onClick: e => this.sectionClickHandler(e, 1), theme: this.theme }, hAsync("div", { key: '268a3e0ba7d800dacc323398a00b970a72cf1cd7', class: "duet-pagination-page-number", "aria-hidden": "true" }, "\u2026")))), hAsync("li", { key: 'edaa7c3c5522faf40e84cff469b09a05138ffccb', class: "duet-pagination-item", role: "menuitem", part: "navigation-jump" }, hAsync("duet-button", { key: 'ced4311041090c7cc3351403e24247e0c5c154b5', disabled: this.disabled, class: "duet-pagination-link duet-pagination-link-jump-forward", "center-text": "true", color: this.theme !== "turva" ? "secondary" : "secondary-turva", variation: "plain", margin: "none", accessibleLabel: this.accessibleLabels.last_page, onClick: e => this.jumpToEnd(e), theme: this.theme, url: this.processedPageLinks
|
|
18046
18102
|
? this.processedPageLinks[this.processedPageLinks.length - 1]
|
|
18047
|
-
: undefined }, hAsync("div", { key: '
|
|
18103
|
+
: undefined }, hAsync("div", { key: '9c6a910c389d177383641955b31555b814df5694', class: "duet-pagination-page-number" }, this.totalPages))))), hAsync("li", { key: 'df2ef26b5062b14d09f74e6bf165673834d89d98', class: {
|
|
18048
18104
|
"duet-pagination-page-button": true,
|
|
18049
18105
|
"duet-pagination-button-last": true,
|
|
18050
|
-
}, role: "menuitem", part: "navigation-arrow" }, hAsync("duet-action-button", { key: '
|
|
18106
|
+
}, role: "menuitem", part: "navigation-arrow" }, hAsync("duet-action-button", { key: 'ef49bbd3a02a2938e5d96cf667078e999051c49e', disabled: !!((this.current === this.totalPages &&
|
|
18051
18107
|
this.internalSectionIndex === Math.ceil(this.totalPages / this.visibleItems) - 1) ||
|
|
18052
|
-
(this.current === this.totalPages && this.processedPageLinks)) || this.disabled, class: "duet-date-dialog-next", "accessible-label": this.accessibleLabels.next_page, title: this.accessibleLabels.next_page, onClick: e => this.onMouseHandler(e, 1), "icon-name": "action-move-to-next", theme: this.theme, url: this.processedPageLinks ? this.processedPageLinks[this.current] : undefined })), (this.variation === "compact" || this.matchesCompactBreakpoint) && (hAsync("li", { key: '
|
|
18108
|
+
(this.current === this.totalPages && this.processedPageLinks)) || this.disabled, class: "duet-date-dialog-next", "accessible-label": this.accessibleLabels.next_page, title: this.accessibleLabels.next_page, onClick: e => this.onMouseHandler(e, 1), "icon-name": "action-move-to-next", theme: this.theme, url: this.processedPageLinks ? this.processedPageLinks[this.current] : undefined })), (this.variation === "compact" || this.matchesCompactBreakpoint) && (hAsync("li", { key: 'bcc8fc11ffaf043e45579c55efc07afc16fe9347', class: {
|
|
18053
18109
|
"duet-pagination-page-button": true,
|
|
18054
18110
|
"duet-pagination-button-last": true,
|
|
18055
|
-
}, role: "menuitem", part: "navigation-arrow" }, hAsync("duet-action-button", { key: '
|
|
18111
|
+
}, role: "menuitem", part: "navigation-arrow" }, hAsync("duet-action-button", { key: 'fb6f817b26e12d521918dafb1bf356d8ea75d9b5', disabled: (this.current === this.totalPages &&
|
|
18056
18112
|
this.internalSectionIndex === Math.ceil(this.totalPages / this.visibleItems) - 1) ||
|
|
18057
18113
|
this.disabled, accessibleLabel: this.accessibleLabels.last_page, title: this.accessibleLabels.last_page, onClick: e => this.jumpToEnd(e), "icon-name": "action-move-to-last", theme: this.theme, url: this.processedPageLinks ? this.processedPageLinks[this.totalPages - 1] : undefined })))))));
|
|
18058
18114
|
}
|
|
@@ -18125,14 +18181,14 @@ class DuetPanel {
|
|
|
18125
18181
|
inheritGlobalTheme(this);
|
|
18126
18182
|
}
|
|
18127
18183
|
render() {
|
|
18128
|
-
return (hAsync(Host, { key: '
|
|
18184
|
+
return (hAsync(Host, { key: 'f37216ed42183b04d0adc65eaa6e83562dd6cde5', class: { "duet-m-0": this.margin === "none" } }, hAsync("section", { key: '6be8f932e02e034eb5dedcd260162d19c53377d6', "aria-label": this.accessibleLabel, "aria-labelledby": this.accessibleLabelledBy, "aria-describedby": this.accessibleDescribedBy, class: {
|
|
18129
18185
|
"duet-panel": true,
|
|
18130
18186
|
"duet-theme-turva": this.theme === "turva",
|
|
18131
18187
|
[this.variation.split("-")[0]]: true,
|
|
18132
18188
|
[this.variation.split("-")[1]]: true,
|
|
18133
18189
|
[`padding-${this.padding}`]: true,
|
|
18134
18190
|
border: this.border,
|
|
18135
|
-
} }, hAsync("slot", { key: '
|
|
18191
|
+
} }, hAsync("slot", { key: 'ce0682b4b1c4a663c5f58f12c5e92d5bca0da715' }))));
|
|
18136
18192
|
}
|
|
18137
18193
|
get element() { return getElement(this); }
|
|
18138
18194
|
static get style() { return duetPanelCss; }
|
|
@@ -18205,7 +18261,7 @@ class DuetParagraph {
|
|
|
18205
18261
|
const color = getColorByName(this.color);
|
|
18206
18262
|
// aria-describedby is to fix accessibility issue in Chrome where duet-paragraphs
|
|
18207
18263
|
// are not announced when placed inside duet-modal
|
|
18208
|
-
return (hAsync(Host, { key: '
|
|
18264
|
+
return (hAsync(Host, { key: '1fcdbc323b600e21f69c2b1f91343aacdc8c6552', "aria-describedby": this.id }, hAsync("p", { key: '0d8f3bd22932b3520707fb4f1013816bc88bd779', id: this.id, class: {
|
|
18209
18265
|
"duet-paragraph": true,
|
|
18210
18266
|
"duet-paragraph-small": this.size === "small",
|
|
18211
18267
|
"duet-paragraph-semi-bold": this.weight === "semi-bold",
|
|
@@ -18214,7 +18270,7 @@ class DuetParagraph {
|
|
|
18214
18270
|
[this.variation]: true,
|
|
18215
18271
|
"duet-theme-turva": this.theme === "turva",
|
|
18216
18272
|
"duet-inherit-color": !this.color && this.inheritingParents.some(p => this.element.closest(p)),
|
|
18217
|
-
}, style: { color }, part: "duet-paragraph" }, hAsync("slot", { key: '
|
|
18273
|
+
}, style: { color }, part: "duet-paragraph" }, hAsync("slot", { key: '3ab49870546786d333d5e1d2c4d2271d129d990e' }))));
|
|
18218
18274
|
}
|
|
18219
18275
|
get element() { return getElement(this); }
|
|
18220
18276
|
static get style() { return duetParagraphCss; }
|
|
@@ -20110,6 +20166,7 @@ class DuetPhoneInput {
|
|
|
20110
20166
|
this.handleBlur = () => {
|
|
20111
20167
|
//console.log(ev)
|
|
20112
20168
|
};
|
|
20169
|
+
this.setPopupMenuWidth = () => (this.countryCodePopup.shadowRoot.querySelector("div").style.width = `${this.element.clientWidth}px`);
|
|
20113
20170
|
this.handleInput = () => {
|
|
20114
20171
|
var _a, _b, _c;
|
|
20115
20172
|
const currentValue = (_b = (_a = this.duetInputElement) === null || _a === void 0 ? void 0 : _a.value) === null || _b === void 0 ? void 0 : _b.trim();
|
|
@@ -20136,6 +20193,7 @@ class DuetPhoneInput {
|
|
|
20136
20193
|
this.handleCountryCodeSelectorOpen = () => {
|
|
20137
20194
|
this.countryCodePopup.controller = this.countryCodeButton;
|
|
20138
20195
|
this.countryCodePopup.show();
|
|
20196
|
+
this.setPopupMenuWidth();
|
|
20139
20197
|
};
|
|
20140
20198
|
this.handleCountryCodeSelectorSelect = (ev) => {
|
|
20141
20199
|
const item = ev.target.closest("duet-popup-menu-item");
|
|
@@ -21036,6 +21094,88 @@ const shift = function (options) {
|
|
|
21036
21094
|
};
|
|
21037
21095
|
};
|
|
21038
21096
|
|
|
21097
|
+
/**
|
|
21098
|
+
* Provides data that allows you to change the size of the floating element —
|
|
21099
|
+
* for instance, prevent it from overflowing the clipping boundary or match the
|
|
21100
|
+
* width of the reference element.
|
|
21101
|
+
* @see https://floating-ui.com/docs/size
|
|
21102
|
+
*/
|
|
21103
|
+
const size = function (options) {
|
|
21104
|
+
if (options === void 0) {
|
|
21105
|
+
options = {};
|
|
21106
|
+
}
|
|
21107
|
+
return {
|
|
21108
|
+
name: 'size',
|
|
21109
|
+
options,
|
|
21110
|
+
async fn(state) {
|
|
21111
|
+
const {
|
|
21112
|
+
placement,
|
|
21113
|
+
rects,
|
|
21114
|
+
platform,
|
|
21115
|
+
elements
|
|
21116
|
+
} = state;
|
|
21117
|
+
const {
|
|
21118
|
+
apply = () => {},
|
|
21119
|
+
...detectOverflowOptions
|
|
21120
|
+
} = evaluate(options, state);
|
|
21121
|
+
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
21122
|
+
const side = getSide(placement);
|
|
21123
|
+
const alignment = getAlignment(placement);
|
|
21124
|
+
const isYAxis = getSideAxis(placement) === 'y';
|
|
21125
|
+
const {
|
|
21126
|
+
width,
|
|
21127
|
+
height
|
|
21128
|
+
} = rects.floating;
|
|
21129
|
+
let heightSide;
|
|
21130
|
+
let widthSide;
|
|
21131
|
+
if (side === 'top' || side === 'bottom') {
|
|
21132
|
+
heightSide = side;
|
|
21133
|
+
widthSide = alignment === ((await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating))) ? 'start' : 'end') ? 'left' : 'right';
|
|
21134
|
+
} else {
|
|
21135
|
+
widthSide = side;
|
|
21136
|
+
heightSide = alignment === 'end' ? 'top' : 'bottom';
|
|
21137
|
+
}
|
|
21138
|
+
const overflowAvailableHeight = height - overflow[heightSide];
|
|
21139
|
+
const overflowAvailableWidth = width - overflow[widthSide];
|
|
21140
|
+
const noShift = !state.middlewareData.shift;
|
|
21141
|
+
let availableHeight = overflowAvailableHeight;
|
|
21142
|
+
let availableWidth = overflowAvailableWidth;
|
|
21143
|
+
if (isYAxis) {
|
|
21144
|
+
const maximumClippingWidth = width - overflow.left - overflow.right;
|
|
21145
|
+
availableWidth = alignment || noShift ? min$1(overflowAvailableWidth, maximumClippingWidth) : maximumClippingWidth;
|
|
21146
|
+
} else {
|
|
21147
|
+
const maximumClippingHeight = height - overflow.top - overflow.bottom;
|
|
21148
|
+
availableHeight = alignment || noShift ? min$1(overflowAvailableHeight, maximumClippingHeight) : maximumClippingHeight;
|
|
21149
|
+
}
|
|
21150
|
+
if (noShift && !alignment) {
|
|
21151
|
+
const xMin = max$1(overflow.left, 0);
|
|
21152
|
+
const xMax = max$1(overflow.right, 0);
|
|
21153
|
+
const yMin = max$1(overflow.top, 0);
|
|
21154
|
+
const yMax = max$1(overflow.bottom, 0);
|
|
21155
|
+
if (isYAxis) {
|
|
21156
|
+
availableWidth = width - 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : max$1(overflow.left, overflow.right));
|
|
21157
|
+
} else {
|
|
21158
|
+
availableHeight = height - 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : max$1(overflow.top, overflow.bottom));
|
|
21159
|
+
}
|
|
21160
|
+
}
|
|
21161
|
+
await apply({
|
|
21162
|
+
...state,
|
|
21163
|
+
availableWidth,
|
|
21164
|
+
availableHeight
|
|
21165
|
+
});
|
|
21166
|
+
const nextDimensions = await platform.getDimensions(elements.floating);
|
|
21167
|
+
if (width !== nextDimensions.width || height !== nextDimensions.height) {
|
|
21168
|
+
return {
|
|
21169
|
+
reset: {
|
|
21170
|
+
rects: true
|
|
21171
|
+
}
|
|
21172
|
+
};
|
|
21173
|
+
}
|
|
21174
|
+
return {};
|
|
21175
|
+
}
|
|
21176
|
+
};
|
|
21177
|
+
};
|
|
21178
|
+
|
|
21039
21179
|
function getWindow(node) {
|
|
21040
21180
|
var _node$ownerDocument;
|
|
21041
21181
|
return ((_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
|
|
@@ -21796,10 +21936,19 @@ class DuetPopupMenu {
|
|
|
21796
21936
|
if (!this.openButton) {
|
|
21797
21937
|
return;
|
|
21798
21938
|
}
|
|
21939
|
+
if (this.menuElement) {
|
|
21940
|
+
this.menuElement.style.maxHeight = "";
|
|
21941
|
+
}
|
|
21799
21942
|
const middleware = [
|
|
21800
21943
|
offset({ mainAxis: this.mainAxisOffset, crossAxis: this.crossAxisOffset }),
|
|
21801
21944
|
this.allowVerticalFlip && flip(),
|
|
21802
21945
|
shift({ padding: 5 }),
|
|
21946
|
+
size({
|
|
21947
|
+
padding: 5,
|
|
21948
|
+
apply: ({ availableHeight, elements }) => {
|
|
21949
|
+
elements.floating.style.maxHeight = `${availableHeight}px`;
|
|
21950
|
+
},
|
|
21951
|
+
}),
|
|
21803
21952
|
].filter(Boolean);
|
|
21804
21953
|
const coordinates = await computePosition(this.openButton, this.menuElement, {
|
|
21805
21954
|
middleware,
|
|
@@ -22075,17 +22224,17 @@ class DuetPopupMenu {
|
|
|
22075
22224
|
overflowY: "auto",
|
|
22076
22225
|
height: this.popupMenuStyleHeight,
|
|
22077
22226
|
};
|
|
22078
|
-
return (hAsync(Host, { key: '
|
|
22227
|
+
return (hAsync(Host, { key: '719d2a7e1c11ff9163309781fec512cc4e37fa4a', role: this.accessibleRole === "menu" ? "application" : null }, hAsync("div", { key: 'a8dfefb0508a16c814d88e2fecc32409011f90db', ref: element => {
|
|
22079
22228
|
this.menuElement = element;
|
|
22080
22229
|
}, style: styles, class: {
|
|
22081
22230
|
open: this.open,
|
|
22082
22231
|
"duet-popup-menu-list": true,
|
|
22083
22232
|
"duet-theme-turva": this.theme === "turva",
|
|
22084
22233
|
"scroll-visible": this.scrollLimit < this.itemElements.length,
|
|
22085
|
-
}, role: this.accessibleRole, "aria-label": this.accessibleLabel }, this.showFilterInput && (hAsync("div", { key: '
|
|
22234
|
+
}, role: this.accessibleRole, "aria-label": this.accessibleLabel }, this.showFilterInput && (hAsync("div", { key: 'd8332f24330773e5d0be9adcde515d949c95c08d' }, hAsync("duet-input", { key: 'e2754d948c53aa5b1af9752bd8705b32b3a93bcb', ref: el => (this.filterInput = el), label: this.filterLabel[this.language], "label-hidden": true, expand: true, margin: "none", type: "search", onDuetInput: this.filterItems, onKeyDown: this.handleKeyDownOnFilter }), hAsync("duet-visually-hidden", { key: 'f8fe6c8dacb340d88c4896ce56c2ccecd38f655e' }, hAsync("span", { key: 'ccca6cce4b4c5852c2bbb50954c002505a6d2872', role: "status" }, `
|
|
22086
22235
|
${this.filterResultCount}/${this.itemElements.length}
|
|
22087
22236
|
${this.filterResultCountLabel[this.language]}
|
|
22088
|
-
`)), hAsync("duet-spacer", { key: '
|
|
22237
|
+
`)), hAsync("duet-spacer", { key: '843f6111e7484d49e20e528e95e090678812d819', size: "xx-small" }))), hAsync("slot", { key: 'f5c3eb16c8bc812f982ec6c2e0b95f5cbbe643cc' }))));
|
|
22089
22238
|
}
|
|
22090
22239
|
get element() { return getElement(this); }
|
|
22091
22240
|
static get watchers() { return {
|
|
@@ -22128,7 +22277,7 @@ class DuetPopupMenu {
|
|
|
22128
22277
|
}; }
|
|
22129
22278
|
}
|
|
22130
22279
|
|
|
22131
|
-
const duetPopupMenuItemCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;display:flex;flex-direction:row;gap:8px;align-items:center;justify-content:flex-start}.duet-popup-menu-item{position:relative;z-index:1;display:flex;flex-grow:1;gap:12px;align-items:center;height:100%;padding:8px;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:rgb(8, 42, 77);text-align:left;text-decoration:none;cursor:pointer;border-radius:4px}.duet-popup-menu-item:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-popup-menu-item:focus,.duet-popup-menu-item:focus.duet-theme-turva{outline:2px solid;outline-offset:2px;outline-color:rgba(53, 79, 101, 0.8)}.duet-popup-menu-item.active{z-index:0;background:rgb(240, 247, 250)}.duet-popup-menu-item:hover{background:rgb(228, 241, 247)}.duet-popup-menu-item .duet-popup-menu-item-label{flex-grow:1}.duet-popup-menu-item .duet-popup-menu-item-trailing{padding-left:20px}.active-descendant{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .active-descendant,.active-descendant.duet-theme-turva{outline-color:rgba(53, 79, 101, 0.8)}.duet-popup-menu-item.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:rgb(23, 42, 59)}.duet-popup-menu-item.active.duet-theme-turva{background:rgb(253, 247, 242)}.duet-popup-menu-item:hover.duet-theme-turva{background:rgb(251, 235, 225)}";
|
|
22280
|
+
const duetPopupMenuItemCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;display:flex;flex-direction:row;gap:8px;align-items:center;justify-content:flex-start}.duet-popup-menu-item{position:relative;z-index:1;display:flex;flex-grow:1;gap:12px;align-items:center;min-width:0;height:100%;padding:8px;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:rgb(8, 42, 77);text-align:left;text-decoration:none;cursor:pointer;border-radius:4px}.duet-popup-menu-item:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-popup-menu-item:focus,.duet-popup-menu-item:focus.duet-theme-turva{outline:2px solid;outline-offset:2px;outline-color:rgba(53, 79, 101, 0.8)}.duet-popup-menu-item.active{z-index:0;background:rgb(240, 247, 250)}.duet-popup-menu-item:hover{background:rgb(228, 241, 247)}.duet-popup-menu-item .duet-popup-menu-item-label{flex-grow:1;min-width:0}.duet-popup-menu-item .duet-popup-menu-item-trailing{padding-left:20px}.active-descendant{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .active-descendant,.active-descendant.duet-theme-turva{outline-color:rgba(53, 79, 101, 0.8)}.duet-popup-menu-item.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:rgb(23, 42, 59)}.duet-popup-menu-item.active.duet-theme-turva{background:rgb(253, 247, 242)}.duet-popup-menu-item:hover.duet-theme-turva{background:rgb(251, 235, 225)}";
|
|
22132
22281
|
|
|
22133
22282
|
class DuetPopupMenuItem {
|
|
22134
22283
|
constructor(hostRef) {
|
|
@@ -22230,11 +22379,11 @@ class DuetPopupMenuItem {
|
|
|
22230
22379
|
};
|
|
22231
22380
|
// Without the role ternary Safari/iPhone wouldn't announce the label for role menuitem.
|
|
22232
22381
|
// This is a tradeoff and now Safari announces these items as buttons and links with the label.
|
|
22233
|
-
return (hAsync(Host, { key: '
|
|
22382
|
+
return (hAsync(Host, { key: '5a9f85c614eb0525860c91e07dac83db868b26ff', role: this.accessibleRole === "menuitem" && this.isSafariBrowser ? null : this.accessibleRole }, hAsync(TagName, { key: 'a7362c89ea53df72a450570693052218434c1cb3', ref: element => (this.itemElement = element), tabIndex: this.accessibleRole === "listitem" ? 0 : -1, onFocus: this.onFocus, onBlur: this.onBlur, role: `${TagName === "a" ? "link" : "button"}`, "aria-label": this.accessibleLabel, class: classes, value: this.value, href: this.url, target: this.external ? "_blank" : undefined, rel: this.external ? "noopener" : undefined, lang: TagName === "button" ? undefined : this.targetLanguage, hreflang: TagName === "button" ? undefined : this.targetLanguage, "aria-current": this.active ? "true" : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: '4c19fb2ac64438dc692a6c81cf8d51b48114cca7', name: this.leadingIcon, size: "x-small", color: this.leadingIconColor ? this.leadingIconColor : "currentColor", class: "duet-popup-menu-item-leading", margin: "none" })), hAsync("span", { key: 'e5ae676e11f424cae135d54b5bab02d2de476eb8', class: "duet-popup-menu-item-label" }, hAsync("slot", { key: '42cc85d521d8515ce3d5e413c117a98d41f008ff' })), (this.trailingIcon || this.active || (this.url && this.external)) && (hAsync("duet-icon", { key: '2a675b18dc0e1162df79ae87fab5ebeda3477959', name: this.url && this.external
|
|
22234
22383
|
? newWindowIcon.title
|
|
22235
22384
|
: this.active
|
|
22236
22385
|
? "messaging-checked-small"
|
|
22237
|
-
: this.trailingIcon, size: (this.url && this.external) || this.active ? "xx-small" : "x-small", color: "currentColor", class: "duet-popup-menu-item-trailing", margin: "none" })), this.trailingText && hAsync("span", { key: '
|
|
22386
|
+
: this.trailingIcon, size: (this.url && this.external) || this.active ? "xx-small" : "x-small", color: "currentColor", class: "duet-popup-menu-item-trailing", margin: "none" })), this.trailingText && hAsync("span", { key: '2d23cea5ab743b54774fbda5a252153d11e1ddf5', class: "duet-popup-menu-item-trailing" }, this.trailingText))));
|
|
22238
22387
|
}
|
|
22239
22388
|
get element() { return getElement(this); }
|
|
22240
22389
|
static get style() { return duetPopupMenuItemCss; }
|
|
@@ -22434,18 +22583,18 @@ class DuetPromoCard {
|
|
|
22434
22583
|
img: {
|
|
22435
22584
|
src: this.image,
|
|
22436
22585
|
alt: this.imageAlt || "",
|
|
22437
|
-
loading: "lazy",
|
|
22586
|
+
loading: this.imagePriority === "high" ? "eager" : "lazy",
|
|
22587
|
+
fetchpriority: this.imagePriority,
|
|
22438
22588
|
class: "image",
|
|
22439
|
-
role: this.imageAlt ? undefined : "presentation",
|
|
22440
22589
|
},
|
|
22441
22590
|
sources: parsePossibleJSON(this.sources),
|
|
22442
22591
|
};
|
|
22443
|
-
return (hAsync(Host, { key: '
|
|
22592
|
+
return (hAsync(Host, { key: 'a11868d1112419d418d0e9ed0fb62d5cfad351e4', class: { "duet-m-0": this.margin === "none" } }, hAsync("aside", { key: '15a7d5bbf45eb253980ec7d5a9d1a0ab22567eb5', class: {
|
|
22444
22593
|
"duet-promo-card": true,
|
|
22445
22594
|
"duet-theme-turva": this.theme === "turva",
|
|
22446
22595
|
"no-bg-color": !this.backgroundColor,
|
|
22447
22596
|
"duet-promo-card-link": !!this.url,
|
|
22448
|
-
}, style: bannerStyles }, hAsync(TagName, { key: '
|
|
22597
|
+
}, style: bannerStyles }, hAsync(TagName, { key: '74cafd91fd84b708b39d04ab2ff76e80f040c6cd', href: this.url, class: { "content-wrapper": true, "duet-theme-turva": this.theme === "turva" }, ref: element => (this.aOrDivElement = element) }, hAsync(DuetPicture, Object.assign({ key: '455e032e836d10caf961d1b7e9e9f5927ee2110c' }, pictureSource)), hAsync("div", { key: '8b8d9f4df668c52eed6d356a5713474760d38f0c', class: "content" }, this.hasPreHeadingSlot && (hAsync("div", { key: '30c8391d3082c4f13fd5fe15688078834b1d33b6', class: "pre-heading" }, hAsync("slot", { key: 'e1f9aff9e5943734f31af4a79d826eec45fed120', name: "pre-heading" }))), this.hasHeadingSlot && (hAsync("div", { key: 'b540f06b51e05fefadd176294331c5333977fa45', class: "heading" }, hAsync("duet-heading", { key: 'fce865ee3ea25de126bc75c4f2b96daacf2470d3', theme: this.theme, level: this.hasHeadingSlotNative ? "div" : this.headingLevel, "visual-level": "h3", margin: "none", color: postfixTheme(this.textColor, this.theme) }, hAsync("span", { key: '46225638ad07ce667b2cb7d8a341e404fa091b1f' }, hAsync("slot", { key: 'd8d502652a8163b0437669aa07f2b933eb3f630d', name: "heading" }))))), this.hasDescriptionSlot && (hAsync("div", { key: '4d3ce20fc62961f6b9ebd4a1846bf55db3d33b2e', class: "description" }, hAsync("duet-paragraph", { key: '058e06c452f4cdaeb9954f44dfa2dc48c15841a1', theme: this.theme, margin: "none", color: postfixTheme(this.textColor, this.theme) }, hAsync("span", { key: 'f74e2644fdfbba489502f98ff4e4a9e2b20d06eb' }, hAsync("slot", { key: '1a570c3b1db0b4964069fc8b9f3a5bd56a8de326', name: "description" }))))), this.hasActionSlot && (hAsync("div", { key: '2ab71f64f6bbccf208b4281a096df0488c34d580', class: "action" }, hAsync("slot", { key: '120257629db8b69ee16078f519e55a163c16687d', name: "action" }))))))));
|
|
22449
22598
|
}
|
|
22450
22599
|
get element() { return getElement(this); }
|
|
22451
22600
|
static get style() { return duetPromoCardCss; }
|
|
@@ -22459,6 +22608,7 @@ class DuetPromoCard {
|
|
|
22459
22608
|
"textColor": [1, "text-color"],
|
|
22460
22609
|
"image": [1],
|
|
22461
22610
|
"imageAlt": [1, "image-alt"],
|
|
22611
|
+
"imagePriority": [1, "image-priority"],
|
|
22462
22612
|
"sources": [1],
|
|
22463
22613
|
"headingLevel": [1, "heading-level"],
|
|
22464
22614
|
"url": [1],
|
|
@@ -22652,17 +22802,17 @@ class DuetRadio {
|
|
|
22652
22802
|
* Always the last one in the class.
|
|
22653
22803
|
*/
|
|
22654
22804
|
render() {
|
|
22655
|
-
return (hAsync(Host, { key: '
|
|
22805
|
+
return (hAsync(Host, { key: '29c7e9f14ff4c754ebba4120c003a837a0ac32f0', class: {
|
|
22656
22806
|
vertical: this.groupDirection === "vertical",
|
|
22657
22807
|
horizontal: this.groupDirection === "horizontal" && !this.groupResponsive,
|
|
22658
22808
|
"horizontal-responsive": this.groupDirection === "horizontal" && this.groupResponsive,
|
|
22659
22809
|
"duet-m-0": this.margin === "none",
|
|
22660
|
-
} }, hAsync("div", { key: '
|
|
22810
|
+
} }, hAsync("div", { key: 'd2408d28b5d18fd9f039e12263dfea29aebe3b00', class: { "duet-radio-container": true, "duet-theme-turva": this.theme === "turva" } }, hAsync("slot", { key: '73c0247859265711e30f1b2aa9a6d88e8fec2d65', name: "input" }), hAsync("label", { key: '03196671dde4b1ec067e049f1d9a10715fa48cda', inert: true, ref: element => (this.labelElement = element), class: {
|
|
22661
22811
|
"duet-label": true,
|
|
22662
22812
|
checked: this.checked,
|
|
22663
22813
|
focus: this.focus,
|
|
22664
22814
|
disabled: this.disabled || this.groupDisabled,
|
|
22665
|
-
} }, hAsync("div", { key: '
|
|
22815
|
+
} }, hAsync("div", { key: '49caed7ab06483a88f1ec6e13b42d58bbd6d0c49', class: "duet-label-content" }, this.hasLabel ? hAsync("slot", { name: "label" }) : this.label)))));
|
|
22666
22816
|
}
|
|
22667
22817
|
get element() { return getElement(this); }
|
|
22668
22818
|
static get style() { return duetRadioCss; }
|
|
@@ -22857,7 +23007,7 @@ class DuetRadioGroup {
|
|
|
22857
23007
|
* Always the last one in the class.
|
|
22858
23008
|
*/
|
|
22859
23009
|
render() {
|
|
22860
|
-
return (hAsync(Host, { key: '
|
|
23010
|
+
return (hAsync(Host, { key: 'b2b6d23b32ce0192c2793ac76f8178b4658abf78', onDuetChange: this.onSelect, class: { horizontal: this.direction === "horizontal" } }, hAsync("duet-fieldset", { key: '51275fe0f808f32e82bda0389f306546f006eb9d', label: this.label, labelHidden: this.labelHidden, caption: this.caption, error: this.error, margin: this.margin, theme: this.theme, "accessible-live-error": this.accessibleLiveError }, this.tooltip && (hAsync("duet-tooltip", { key: 'f12dac2f01fd32293e7d075e70ecedad6695709e', slot: "tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), hAsync("slot", { key: 'bb8d90fd7e329d57129fc7594ad6cd13e142fe3c', name: "tooltip", slot: "tooltip" }), hAsync("div", { key: 'c49b8642d476b6b3a43d286481523adf573d5232', class: { "duet-radio-group": true, "duet-no-stacking": !this.responsive } }, hAsync("slot", { key: '7a0f2eb3f85a4ac1803ae0be898aadc1360a98ea' })))));
|
|
22861
23011
|
}
|
|
22862
23012
|
get element() { return getElement(this); }
|
|
22863
23013
|
static get watchers() { return {
|
|
@@ -23045,13 +23195,13 @@ class DuetRangeSlider {
|
|
|
23045
23195
|
const rangeStyles = {
|
|
23046
23196
|
background: `-webkit-linear-gradient(left,${active} 0%,${active} ${percentage}%,${inactive} ${percentage}%)`,
|
|
23047
23197
|
};
|
|
23048
|
-
return (hAsync(Host, { key: '
|
|
23198
|
+
return (hAsync(Host, { key: '740ff7d06f193b8bfe148e68702228b0e969e177', class: { "duet-m-0": this.margin === "none", "duet-expand": this.expand } }, hAsync("div", { key: 'd401cbcaed967a4f946771a878893bbdf5b8b765', class: {
|
|
23049
23199
|
"duet-range-container": true,
|
|
23050
23200
|
"duet-label-hidden": this.labelHidden,
|
|
23051
23201
|
"duet-theme-turva": this.theme === "turva",
|
|
23052
23202
|
"duet-ie": isInternetExplorer(),
|
|
23053
23203
|
"duet-range-disabled": this.disabled,
|
|
23054
|
-
} }, hAsync(DuetInternalLabel, { key: '
|
|
23204
|
+
} }, hAsync(DuetInternalLabel, { key: 'd19d2ae90fe8aba1b8894566f9cd1c445c56df7a', theme: theme, color: this.labelColor, weight: this.labelWeight, margin: "small", for: identifier }, this.label), hAsync("output", { key: 'c596df8a741761dd493cf18adf08f7f0f1f4b94f', "aria-hidden": "true", htmlFor: identifier, class: "duet-output" }, this.value.toLocaleString(this.locale), this.unit), hAsync("input", { key: 'de318d3817d8f23921312361fe2f35fa9b79dc88', onInput: this.onInput, onChange: this.onChange, ref: input => (this.nativeInput = input), type: "range", min: this.min, max: this.max, step: this.step, value: this.value, style: rangeStyles, "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": this.value, "aria-valuetext": `${this.value} ${this.unit}`, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, id: identifier, name: this.name, disabled: this.disabled, required: this.required, class: "duet-range" }))));
|
|
23055
23205
|
}
|
|
23056
23206
|
get element() { return getElement(this); }
|
|
23057
23207
|
static get style() { return duetRangeSliderCss; }
|
|
@@ -23280,10 +23430,10 @@ class DuetRangeStepper {
|
|
|
23280
23430
|
* Always the last one in the class.
|
|
23281
23431
|
*/
|
|
23282
23432
|
render() {
|
|
23283
|
-
return (hAsync("div", { key: '
|
|
23433
|
+
return (hAsync("div", { key: 'ee60a3b8c9a38eef22d54525e2173980f4471a80', class: {
|
|
23284
23434
|
"duet-range-stepper": true,
|
|
23285
23435
|
"duet-theme-turva": this.theme === "turva",
|
|
23286
|
-
}, onKeyDown: e => this.onKeyboardDown(e), "aria-controls": this.ariaControls }, hAsync("span", { key: '
|
|
23436
|
+
}, onKeyDown: e => this.onKeyboardDown(e), "aria-controls": this.ariaControls }, hAsync("span", { key: '802f99d51d6cab2ed946337466def72d9fdad351', class: "duet-range-step-counter", part: "range-numbers" }, this.generateStepSize()), hAsync("duet-action-button", { key: '396ccc56f5b5617029313bc1ade243103a5b1a2a', disabled: this.disabled || this.buttonLeftDisabled, class: "duet-range-step-button duet-range-step-minus", onClick: e => this.handleClick(e, -1), id: this.leftBn, "accessible-label": `${this.ariaLabels.previous_increment} ${this.generatePreviousIncrementLabel()}`, ref: el => (this.leftBnRef = el), part: "navigation-arrow", iconName: "action-arrow-left-small", title: "" }), hAsync("duet-action-button", { key: '90f158af1224b99186b4b24b6089b37afa9264f0', disabled: this.disabled || this.buttonRightDisabled, class: "duet-range-step-button duet-range-step-plus", onClick: e => this.handleClick(e, 1), "accessible-label": `${this.ariaLabels.next_increment} ${this.generateNextIncrementLabel()}`, id: this.rightBn, ref: el => (this.rightBnRef = el), part: "navigation-arrow", iconName: "action-arrow-right-small", title: "" })));
|
|
23287
23437
|
}
|
|
23288
23438
|
get element() { return getElement(this); }
|
|
23289
23439
|
static get watchers() { return {
|
|
@@ -23594,18 +23744,18 @@ class DuetScrollable {
|
|
|
23594
23744
|
* Always the last one in the class.
|
|
23595
23745
|
*/
|
|
23596
23746
|
render() {
|
|
23597
|
-
return (hAsync(Host, { key: '
|
|
23747
|
+
return (hAsync(Host, { key: '8c26c49fa79b5ae44744540e1910fc5cd23e2280', class: {
|
|
23598
23748
|
"duet-theme-turva": this.theme === "turva",
|
|
23599
23749
|
"duet-theme-default": this.theme === "default",
|
|
23600
|
-
} }, this.hasCollapseButtonLabelSlot && (hAsync("div", { key: '
|
|
23750
|
+
} }, this.hasCollapseButtonLabelSlot && (hAsync("div", { key: 'a56b751635fce29f6cd1838c696267913e1a8bb7', class: {
|
|
23601
23751
|
collapse: true,
|
|
23602
23752
|
hide: !this.needsScrolling && !this.collapsed,
|
|
23603
|
-
} }, hAsync("duet-button", { key: '
|
|
23753
|
+
} }, hAsync("duet-button", { key: '5dbff0b7fbcdc5be8d30276efc1d537e14715133', variation: "plain", margin: "none", "center-text": true, onClick: () => this.collapsedOnClick() }, hAsync("slot", { key: 'eba374d5ac518957c878f5c8b7610cc749776908', name: "collapse-button-label" })))), hAsync("div", { key: '3aa49b4cc6c52939d07e56f53aa02f915cc94dfd', class: {
|
|
23604
23754
|
"duet-scrollable-items": true,
|
|
23605
23755
|
buttons: this.buttons,
|
|
23606
23756
|
center: this.center,
|
|
23607
23757
|
"duet-theme-turva": this.theme === "turva",
|
|
23608
|
-
} }, this.buttons && this.renderButton("left"), hAsync("div", { key: '
|
|
23758
|
+
} }, this.buttons && this.renderButton("left"), hAsync("div", { key: 'c85bf3929c372cbea0b8be43f5e9aa912ef0df2e', class: {
|
|
23609
23759
|
"duet-scrollable-list": true,
|
|
23610
23760
|
[`duet-scrollable-list--${this.buttonPosition}`]: true,
|
|
23611
23761
|
[`gap-${this.gap}`]: true,
|
|
@@ -23613,7 +23763,7 @@ class DuetScrollable {
|
|
|
23613
23763
|
[`duet-overflow-padding--${this.padding}`]: this.padding !== "none",
|
|
23614
23764
|
[`duet-scrollable-list--${this.buttonPosition}`]: this.buttonPosition === "absolute",
|
|
23615
23765
|
"duet-scrollable-stretch": this.stretch,
|
|
23616
|
-
}, onScroll: () => this.updateScrollButtons(), ref: element => (this.scrollPaneElement = element) }, hAsync("slot", { key: '
|
|
23766
|
+
}, onScroll: () => this.updateScrollButtons(), ref: element => (this.scrollPaneElement = element) }, hAsync("slot", { key: 'a5b51ed3a159ce2b580850e8973800c75af4b3d5' })), this.buttons && this.renderButton("right"))));
|
|
23617
23767
|
}
|
|
23618
23768
|
get element() { return getElement(this); }
|
|
23619
23769
|
static get watchers() { return {
|
|
@@ -23673,13 +23823,13 @@ class DuetSectionLayout {
|
|
|
23673
23823
|
* Always the last one in the class.
|
|
23674
23824
|
*/
|
|
23675
23825
|
render() {
|
|
23676
|
-
return (hAsync(Host, { key: '
|
|
23826
|
+
return (hAsync(Host, { key: 'b94e0fb95034731dd6fa96fd68011589fef87858', class: {
|
|
23677
23827
|
"duet-middle": this.middle,
|
|
23678
23828
|
"duet-ie": isInternetExplorer(),
|
|
23679
|
-
} }, hAsync("div", { key: '
|
|
23829
|
+
} }, hAsync("div", { key: '12e1c3868a43482d02a1e9103593015035dfce3d', class: { "duet-layout-wrapper": true, "duet-m-0": this.margin === "none" } }, hAsync("div", { key: '058f4850f071237d9fa1eb4eec97f760b8113a25', class: {
|
|
23680
23830
|
"duet-layout": true,
|
|
23681
23831
|
[`padding-${this.paddingBreakpoint}`]: !!this.paddingBreakpoint,
|
|
23682
|
-
} }, hAsync("section", { key: '
|
|
23832
|
+
} }, hAsync("section", { key: '6138f2dda261d7823a9b6b5db4e0c8c7d7e0a335', class: "duet-main" }, hAsync("slot", { key: '3d190b45ea4e7c773c4c74c12486c802d8067536' }))))));
|
|
23683
23833
|
}
|
|
23684
23834
|
get element() { return getElement(this); }
|
|
23685
23835
|
static get style() { return duetSectionLayoutCss; }
|
|
@@ -23892,23 +24042,23 @@ class DuetSelect {
|
|
|
23892
24042
|
*/
|
|
23893
24043
|
render() {
|
|
23894
24044
|
const identifier = this.identifier || this.selectId;
|
|
23895
|
-
return (hAsync(Host, { key: '
|
|
24045
|
+
return (hAsync(Host, { key: '05edeb2d61b86141dafcb6a3a124497b41bb0242', class: {
|
|
23896
24046
|
"duet-m-0": this.margin === "none",
|
|
23897
24047
|
"duet-expand": this.expand,
|
|
23898
24048
|
[`duet-select-variation-${this.variation}`]: true,
|
|
23899
|
-
} }, hAsync("div", { key: '
|
|
24049
|
+
} }, hAsync("div", { key: '897d4e5471ec22b463adb6629b2d3c7ed2e4c8e1', class: {
|
|
23900
24050
|
"duet-select-container": true,
|
|
23901
24051
|
"duet-label-hidden": this.labelHidden,
|
|
23902
24052
|
"duet-theme-turva": this.theme === "turva",
|
|
23903
24053
|
[`duet-select-variation-${this.variation}`]: true,
|
|
23904
24054
|
"duet-input-top-caption-shown": this.isCaptionVisible,
|
|
23905
24055
|
"has-error": !!this.error,
|
|
23906
|
-
} }, hAsync(DuetInternalLabel, { key: '
|
|
24056
|
+
} }, hAsync(DuetInternalLabel, { key: '50c26fd239285a6a168f54f0974c94fa4d5ccc5e', theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, color: this.labelColor, weight: this.labelWeight, id: this.labelId, for: identifier }, this.label), this.tooltip && (hAsync("duet-tooltip", { key: '3337a7a9d80314cd7bd69816200ea8adc9ed64cc', direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), hAsync("slot", { key: 'e59013542be31c7f564f347ac36c6c58716c1fad', name: "tooltip" }), this.caption && (hAsync("duet-caption", { key: '6f9a2f7d3b1891be67ef2d99320466d6b89d4945', id: this.topCaptionId, size: "medium" }, this.caption)), hAsync("div", { key: '856cb3b0e207b4c440b9542c3aed96f5d35b3c3b', class: "duet-select-wrapper" }, this.placeholder && this.echoPlaceholder && this.value && (hAsync("duet-caption", { key: '20ca49020566bd26705715a12279ad043ea0d40d', id: this.topCaptionPlaceholderId, class: "duet-select-placeholder", size: "small" }, this.placeholder)), hAsync("slot", { key: '5d2dd785db740afbe15e754d2080f39fb93534fb' }), hAsync("select", { key: '2e2f8e99ae58d570c4756ae8801ce5d1293ae806', ref: select => (this.nativeSelect = select), disabled: this.disabled, name: this.name, id: identifier, role: this.role, "aria-labelledby": this.labelId, "aria-describedby": this.getDescribedBy(), "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.onChange, required: this.required }, this.placeholder && (hAsync("option", { key: 'a6b868ec1eefe2c508c38a73a97d1e19f1e04f14', disabled: true, selected: true, value: "" }, this.placeholder)), !this.processedItems ? (hAsync("option", null, "Virhe valintoja ladattaessa. P\u00E4ivit\u00E4 sivu ja kokeile uusiksi.")) : (this.processedItems.map(item => {
|
|
23907
24057
|
return isOptionGroup(item) ? this.renderOptionGroup(item) : this.renderOption(item);
|
|
23908
|
-
}))), hAsync("div", { key: '
|
|
24058
|
+
}))), hAsync("div", { key: 'bb4b1ce4fcc1ced68464eb4e89e65b2f31d9c489', class: {
|
|
23909
24059
|
"duet-select": true,
|
|
23910
24060
|
[`duet-select-variation-${this.variation}`]: true,
|
|
23911
|
-
}, "aria-hidden": "true" }, hAsync("span", { key: this.value, class: "duet-select-selected-value" }, this.getSelectedItemLabel()), (this.variation === "default" && (hAsync("svg", { key: '
|
|
24061
|
+
}, "aria-hidden": "true" }, hAsync("span", { key: this.value, class: "duet-select-selected-value" }, this.getSelectedItemLabel()), (this.variation === "default" && (hAsync("svg", { key: 'dd8a6f6455d08d562c17bc41295567fbf6c2b756', role: "img", class: "duet-select-icon", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: 'efc3261cede3e5ec10932481cd2a2415bb4ff6b3', d: "m12 18.999c-.4 0-.776-.156-1.059-.438l-10.721-10.72c-.142-.142-.22-.33-.22-.531 0-.2.078-.389.22-.53.142-.142.33-.22.53-.22s.389.078.53.22l10.72 10.719 10.72-10.719c.142-.142.33-.22.53-.22s.389.078.53.22c.142.142.22.33.22.53s-.078.389-.22.53l-10.72 10.72c-.282.283-.659.439-1.06.439z" })))) || (hAsync("duet-icon", { key: '973409781026e93c2b343a47895c2051152ccf66', theme: this.theme, name: "action-arrow-down-small", color: "currentColor", margin: "none", size: this.variation === "compact" ? "xxx-small" : "xx-small" }))), hAsync("span", { key: '8c4375727be85a26ebc724cefb69600193a5a3af', class: "duet-keep-container-height", role: "presention", "aria-hidden": "true" }, "_")), hAsync("span", { key: '184737a1361d67fc58be1e54e92ce17b1e9b9d9b', class: "duet-select-help", id: this.errorId, "aria-live": this.accessibleLiveError, "aria-atomic": "true", "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: '20bb85898431127cd66bc9b71ac18b99d9075ae7', class: "duet-select-error" }, this.error)))));
|
|
23912
24062
|
}
|
|
23913
24063
|
get element() { return getElement(this); }
|
|
23914
24064
|
static get watchers() { return {
|
|
@@ -23988,9 +24138,9 @@ class DuetShapedImage {
|
|
|
23988
24138
|
const style = {
|
|
23989
24139
|
"--rotation": `${this.rotation}deg`,
|
|
23990
24140
|
};
|
|
23991
|
-
return (hAsync(Host, { key: '
|
|
24141
|
+
return (hAsync(Host, { key: '7b1d056821d3a87f329524519264ae42642f79b2', class: { "duet-theme-turva": this.theme === "turva", "duet-m-0": this.margin === "none" } }, hAsync("span", { key: 'cfee37d6e11b4c774057f6e93efc6b4411b4535c', class: {
|
|
23992
24142
|
"shaped-image": true,
|
|
23993
|
-
}, role: "img", "aria-label": this.accessibleLabel, style: style }, hAsync("span", { key: '
|
|
24143
|
+
}, role: "img", "aria-label": this.accessibleLabel, style: style }, hAsync("span", { key: '1b81306ffb9c9c34a2301b952ed6894705f2cb03', class: "shaped-image-mask", role: "presentation" }, hAsync("span", { key: 'de6e0992fec3395802b4ed7863e969b26405a329', class: "shaped-image-img", role: "presentation", style: { backgroundImage: `url("${this.src}")` } })))));
|
|
23994
24144
|
}
|
|
23995
24145
|
static get style() { return duetShapedImageCss; }
|
|
23996
24146
|
static get cmpMeta() { return {
|
|
@@ -24060,12 +24210,12 @@ class DuetShareChart {
|
|
|
24060
24210
|
this.itemsTotalValue = this.items.reduce((total, { value }) => total + value, 0);
|
|
24061
24211
|
}
|
|
24062
24212
|
render() {
|
|
24063
|
-
return (hAsync(Host, { key: '
|
|
24213
|
+
return (hAsync(Host, { key: 'cbf28a10c67b0f2b45f925b2fc1e3307eb28b417' }, hAsync("div", { key: '5d21486e2571bf894d01ff990a144334a1c54690', class: "duet-share-chart-horizontal-bar", role: "presentation" }, this.items
|
|
24064
24214
|
.filter(i => !!i.value)
|
|
24065
24215
|
.map(item => (hAsync("span", { class: "duet-share-chart-share", style: {
|
|
24066
24216
|
width: `${(item.value / this.itemsTotalValue) * 100}%`,
|
|
24067
24217
|
backgroundColor: getColorByName(item.color, this.theme),
|
|
24068
|
-
} })))), hAsync("ul", { key: '
|
|
24218
|
+
} })))), hAsync("ul", { key: 'd292d9aecfdbc152d1c2cc8beb81abb295580fe7', class: "duet-share-chart-item-list" }, this.items.map(item => (hAsync("li", { class: { "duet-theme-turva": this.theme === "turva" } }, hAsync("span", { class: "duet-share-chart-item-color", style: { background: getColorByName(item.color, this.theme) } }), hAsync("span", { class: "duet-share-chart-item-text" }, item.text, ":"), hAsync("span", { class: "duet-share-chart-item-value" }, "\u00A0", formatNumber(item.value), "\u00A0", this.unit), this.unit !== "%" && (hAsync("duet-visually-hidden", null, `${formatNumber((item.value / this.itemsTotalValue) * 100, 0)} %`)))))), hAsync("slot", { key: '12967cf08700fdf0fee3741b3ba552c6eb89d565' })));
|
|
24069
24219
|
}
|
|
24070
24220
|
get element() { return getElement(this); }
|
|
24071
24221
|
static get style() { return duetShareChartCss; }
|
|
@@ -24092,7 +24242,7 @@ class DuetShareChartItem {
|
|
|
24092
24242
|
this.value = 0;
|
|
24093
24243
|
}
|
|
24094
24244
|
render() {
|
|
24095
|
-
return (hAsync(Host, { key: '
|
|
24245
|
+
return (hAsync(Host, { key: 'a4f958f8110b3d7c6c18999ab4c96346923715e6' }, hAsync("div", { key: 'e0253794e39235b6e3f93d475c7a84a21f9ae8ef', hidden: true }, hAsync("slot", { key: '8ce6f29e00278febb2225437385987fcfac48eb7' }))));
|
|
24096
24246
|
}
|
|
24097
24247
|
get element() { return getElement(this); }
|
|
24098
24248
|
static get cmpMeta() { return {
|
|
@@ -24242,12 +24392,12 @@ class DuetShowMore {
|
|
|
24242
24392
|
* Always the last one of the class.
|
|
24243
24393
|
*/
|
|
24244
24394
|
render() {
|
|
24245
|
-
return (hAsync(Host, { key: '
|
|
24395
|
+
return (hAsync(Host, { key: '9afe7d7d486b0149b0d7d0f2f565ebed0a06125b' }, hAsync("div", { key: '68e86cab291190cd4e56871e3dbb8456a8e67a8e', class: {
|
|
24246
24396
|
"duet-show-more": true,
|
|
24247
24397
|
"duet-theme-turva": this.theme === "turva",
|
|
24248
24398
|
"duet-m-0": this.margin === "none",
|
|
24249
24399
|
open: this.open,
|
|
24250
|
-
} }, hAsync("div", { key: '
|
|
24400
|
+
} }, hAsync("div", { key: '3e95652047d8e72819869f278ae30a1c2c387f6c', ref: ref => (this.contentElement = ref), class: { content: true, "duet-theme-turva": this.theme === "turva" }, id: this.contentId, tabindex: this.open ? "-1" : "" }, hAsync("div", { key: 'be27b4b6e37c644fc4022ab4b628adb4f220a08d', class: { "slotted-content": true } }, hAsync("slot", { key: 'f0f1bb220a099f21340da94176c281667a8a5287' }))), hAsync("duet-button", { key: '04759c15d2218db3332056e41d1ee5725237aba0', id: this.buttonId, variation: "plain", "accessible-label": this.buttonAriaOpen ? this.showLessAccessibleLabel : this.showMoreAccessibleLabel, "accessible-expanded": this.buttonAriaOpen ? "true" : "false", "accessible-controls": this.contentId, accessiblePressed: this.isSafariBrowser ? this.open : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown, "icon-right": true, icon: this.open ? "action-arrow-up-small" : "action-arrow-down-small", "icon-size": "medium-small", size: "small", margin: this.buttonMargin, padding: this.buttonPadding, theme: this.theme === "turva" ? "turva" : "default" }, hAsync("span", { key: '6219f2cd6af88b56a9e829bf667e00565b7a8109' }, this.open ? this.showLessLabel : this.showMoreLabel)))));
|
|
24251
24401
|
}
|
|
24252
24402
|
get element() { return getElement(this); }
|
|
24253
24403
|
static get style() { return duetShowMoreCss; }
|
|
@@ -24774,17 +24924,17 @@ class DuetSlideout {
|
|
|
24774
24924
|
};
|
|
24775
24925
|
const topLevelOpenMenuBarTranslation = getLocaleString(this.topLevelOpenMenuBarLangObject);
|
|
24776
24926
|
const exitTranslation = getLocaleString(this.exitLangObject);
|
|
24777
|
-
return (hAsync(Host, { key: '
|
|
24927
|
+
return (hAsync(Host, { key: 'c5298a04c706d21901c666657d022fbf6ac2ccbf' }, hAsync("div", { key: 'f449518506a39eb2112fe07828e9d345b225cb39', class: { "duet-slideout": true, "duet-theme-turva": this.theme === "turva" } }, this.modal && hAsync("duet-overlay", { key: 'b6e2a80e4cf4e73870a108661bf73a29b41e7e85', visible: this.open, zIndex: "600" }), hAsync("div", { key: '53b4cf1cef91b08e31c8c1a39d98a327c6d6f409', ref: element => (this.dialog = element), tabindex: "-1", role: "dialog", id: "dialog", "aria-labelledby": "button", "aria-modal": this.isSafariBrowser ? false : true, "aria-flowto": "slot-container", class: {
|
|
24778
24928
|
dialog: true,
|
|
24779
24929
|
hidden: !this.open,
|
|
24780
24930
|
modal: this.modal,
|
|
24781
|
-
}, style: styles }, hAsync(FocusGuard, { key: '
|
|
24931
|
+
}, style: styles }, hAsync(FocusGuard, { key: 'babca49248ba28d1e2811593058ee32742712507', moveFocusTo: this.closeButton }), hAsync("div", { key: '75123b9e195240e64ad91ca08d38f2b8333ae8fc', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, hAsync("div", { key: '4d8806dd671066b064e4f7176332b756d654080b', class: "top" }, hAsync("button", { key: 'f4aee0f201feb52d93f93d9a52a28912860c7614', ref: element => (this.closeButton = element), "aria-haspopup": "dialog", "aria-controls": "dialog", "aria-expanded": this.open ? "true" : "false", "aria-label": `${exitTranslation}`, type: "button", class: {
|
|
24782
24932
|
"slideout-close": true,
|
|
24783
24933
|
active: this.open,
|
|
24784
24934
|
"duet-theme-turva": this.theme === "turva",
|
|
24785
|
-
}, onClick: this.onClick, inert: this.openPanel }, hAsync("duet-icon", { key: '
|
|
24935
|
+
}, onClick: this.onClick, inert: this.openPanel }, hAsync("duet-icon", { key: '548f982fcbb29297168b949fdeb169765ad3615a', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), hAsync("div", { key: '22bc0ca96855476ea148c016e7434be2beee9823', class: "sticky-header" }, hAsync("slot", { key: 'ab6575d6303c56291d08d6276f150216de2e17d5', name: "sticky-header" }))), hAsync("div", { key: 'cb6c393cb05fd8be1d487755cc123786e93ccfb6', id: "slot-container", role: this.accessibleRole, "aria-label": this.openPanel ? topLevelOpenMenuBarTranslation : null, class: {
|
|
24786
24936
|
items: true,
|
|
24787
|
-
} }, hAsync("slot", { key: '
|
|
24937
|
+
} }, hAsync("slot", { key: 'efd0a4ced368a63a52de97e6ca0416461d4e0dfc' })), hAsync(FocusGuard, { key: '395ee2fb97043653972a9082f82f6a423abfcbfe', moveFocusTo: this.closeButton })))));
|
|
24788
24938
|
}
|
|
24789
24939
|
get element() { return getElement(this); }
|
|
24790
24940
|
static get watchers() { return {
|
|
@@ -24854,7 +25004,7 @@ class DuetSlideoutLang {
|
|
|
24854
25004
|
*/
|
|
24855
25005
|
render() {
|
|
24856
25006
|
const langTranslation = getLocaleString(this.chooseLangObject);
|
|
24857
|
-
return (hAsync(Host, { key: '
|
|
25007
|
+
return (hAsync(Host, { key: '4553d896b4bfdb640ba3d098ea57128d964a19b6' }, hAsync("div", { key: 'e296a886f0cb3243458c937866a41f2b4be3a538', class: "duet-slideout-lang", role: "group", "aria-label": langTranslation }, hAsync("duet-icon", { key: 'bb80517845c1ee6384be27ed48efc598befb18b3', name: "navigation-language", margin: "none", color: "secondary", size: "small" }), hAsync("slot", { key: '8bd61a2b46aa5d6f488d1ef61d260ca1f2d6c698' }))));
|
|
24858
25008
|
}
|
|
24859
25009
|
get element() { return getElement(this); }
|
|
24860
25010
|
static get style() { return duetSlideoutLangCss; }
|
|
@@ -24944,12 +25094,12 @@ class DuetSlideoutLink {
|
|
|
24944
25094
|
* Always the last one in the class.
|
|
24945
25095
|
*/
|
|
24946
25096
|
render() {
|
|
24947
|
-
return (hAsync(Host, { key: '
|
|
25097
|
+
return (hAsync(Host, { key: '0fa4145e0ed6826a49aafd34c4ca247e7f2960e8' }, hAsync("a", { key: '8b44ab4f3639e42c46dd9868586eb42a6066f808', target: !this.href ? null : this.external ? "_blank" : "_self", class: {
|
|
24948
25098
|
"duet-slideout-link": true,
|
|
24949
25099
|
"duet-theme-turva": this.theme === "turva",
|
|
24950
25100
|
active: this.active,
|
|
24951
25101
|
[this.size]: true,
|
|
24952
|
-
}, href: this.href, "aria-current": this.active ? "true" : "false", lang: this.targetLanguage, hreflang: this.targetLanguage, "aria-label": (this.href && getAccessibleLinkLabel(this)) || this.accessibleLabel, rel: this.external ? "noopener" : undefined }, this.icon && (hAsync("duet-icon", { key: '
|
|
25102
|
+
}, href: this.href, "aria-current": this.active ? "true" : "false", lang: this.targetLanguage, hreflang: this.targetLanguage, "aria-label": (this.href && getAccessibleLinkLabel(this)) || this.accessibleLabel, rel: this.external ? "noopener" : undefined }, this.icon && (hAsync("duet-icon", { key: '7de46db5dc6aee8706a63e96c136aa36b3092716', name: this.icon, color: "secondary", size: this.menuItem ? "x-small" : "small", margin: "none" })), hAsync("div", { key: 'edf5b92481f2c7678b5e8d74dd08f62c60875593', class: "label" }, hAsync("span", { key: 'df63061c436078c2decf3ebaabb2e7909ec6df2b' }, hAsync("span", { key: '79e134bfc5b40595760793751a4dfde4b4895638', class: "label-container" }, hAsync("span", { key: 'a69d00a9b25e5ff0a709c27bd5418691a20eb1e3', class: "label-content" }, hAsync("slot", { key: 'abf04341872118d105d8703dca1566d6aa33f6ea' })), this.external && (hAsync("duet-icon", { key: '695eb8fbfe860d0dc19475a255139f9c042ad9e9', class: "external-icon", theme: this.theme, name: newWindowIcon.title, margin: "none", size: "auto", color: "currentColor" }))), hAsync("slot", { key: '1587bcc9a12db87d4c4c153d6e938ca136acfedc', name: "description" })), this.caret && (hAsync("duet-icon", { key: 'd40e0716e4dfa8a6b20fbeebb8c19b6868c11087', name: "action-arrow-right", color: "secondary", size: "x-small", margin: "none" }))))));
|
|
24953
25103
|
}
|
|
24954
25104
|
get element() { return getElement(this); }
|
|
24955
25105
|
static get style() { return duetSlideoutLinkCss; }
|
|
@@ -25126,25 +25276,25 @@ class DuetSlideoutPanel {
|
|
|
25126
25276
|
};
|
|
25127
25277
|
const exitTranslation = getLocaleString(this.exitLangObject);
|
|
25128
25278
|
const backTranslation = getLocaleString(this.backLangObject);
|
|
25129
|
-
return (hAsync(Host, { key: '
|
|
25279
|
+
return (hAsync(Host, { key: 'd6f887a4066a57a089fbb66e8dcf9738025fcf32' }, hAsync("div", { key: '9e4366a8bf2394467c60c58d9c6e28d3a73eeb70', class: {
|
|
25130
25280
|
"duet-slideout-panel": true,
|
|
25131
25281
|
"duet-theme-turva": this.theme === "turva",
|
|
25132
25282
|
active: this.open,
|
|
25133
|
-
} }, this.badge && hAsync("duet-indicator", { key: '
|
|
25283
|
+
} }, this.badge && hAsync("duet-indicator", { key: '8653c304ca1073549efb1b3b1e530c1d44a414de', variation: "change" }), hAsync("button", { key: 'b5597ee44dfd1e7cd694670e16a6c89cfbac979d', ref: element => (this.openButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
|
|
25134
25284
|
link: true,
|
|
25135
25285
|
active: this.active,
|
|
25136
25286
|
"duet-theme-turva": this.theme === "turva",
|
|
25137
|
-
}, onClick: this.onClick, inert: this.open }, this.icon && (hAsync("div", { key: '
|
|
25287
|
+
}, onClick: this.onClick, inert: this.open }, this.icon && (hAsync("div", { key: '72c123b4d7dafd5c7f390c38422ec80206d0f2c1', class: "duet-slideout-icon" }, hAsync("duet-icon", { key: '28a9b256bb5d354e8da1c5f7221781e727d800e8', name: this.icon, size: "small", margin: "none", color: "secondary" }))), hAsync("span", { key: '202044837e321fbacb1ff3cee181a7bef41d0119', class: "label" }, hAsync("span", { key: 'f638d3d0ef1668cf7d427de10ac54e74b39011db', class: { "label-text": true, [this.labelSize]: true } }, hAsync("slot", { key: '3c854c284b0b9efb93e849ca20595949f8436e58', name: "label" })), hAsync("duet-icon", { key: '05ab8ab345187d418d2e847ea7b9fb95b9df48ac', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), hAsync("div", { key: '4997c8cf6f2f442211a671c1f996e7f0a5bad5b0', ref: element => (this.dialog = element), class: {
|
|
25138
25288
|
dialog: true,
|
|
25139
25289
|
hidden: !this.open,
|
|
25140
|
-
}, style: styles }, hAsync(FocusGuard, { key: '
|
|
25290
|
+
}, style: styles }, hAsync(FocusGuard, { key: '3d7fbcc1526cc861f8b8ed25cd150cd0776e41e2', moveFocusTo: this.closeButton }), hAsync("div", { key: '6263ee14fb4ed01b3882fd5aee6072085b4d2673', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, hAsync("div", { key: '7129481501bde51cde421266fa427feb71d60e96', class: "top" }, hAsync("button", { key: '9c9b4a36175962ecfd9d4d55315a6f7387dd83fb', ref: element => (this.closeButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-label": `${backTranslation}`, type: "button", class: {
|
|
25141
25291
|
back: true,
|
|
25142
25292
|
"duet-theme-turva": this.theme === "turva",
|
|
25143
|
-
}, onClick: this.onClick }, hAsync("duet-icon", { key: '
|
|
25293
|
+
}, onClick: this.onClick }, hAsync("duet-icon", { key: 'd993b8b1ca9f1dd5246c09d0aa6c1e2af14f8404', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), hAsync("span", { key: '7548145c9fefcb76a430cc3ab53c4dce08c0e244' }, this.label.innerHTML), hAsync("button", { key: '05f09bf1036ae0db17edd1f0dccbc3e67a0d3e78', class: { close: true, "duet-theme-turva": this.theme === "turva" }, type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, hAsync("duet-icon", { key: 'eb271988b011397d50d77fb303e0902d987ea717', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), hAsync("div", { key: '14aa2af7d6c1c6671056fed4a92d1982a24da715', class: "sticky-header" }, hAsync("slot", { key: 'ceace8c522d5236bc7814d85aed1fefb88645c63', name: "sticky-header" }))), hAsync("div", { key: 'a21d4a36e5a0d09ec6d2352c78a40ab9b7d26b94', tabindex: "-1", role: "menu",
|
|
25144
25294
|
//TODO: slideout menu fades out, needs to be instant
|
|
25145
25295
|
id: "menu", "aria-labelledby": "button", class: {
|
|
25146
25296
|
items: true,
|
|
25147
|
-
} }, hAsync("slot", { key: '
|
|
25297
|
+
} }, hAsync("slot", { key: '59691db3416b43696ca5620275e7be271cc84595' })), hAsync(FocusGuard, { key: 'd1840ad6416502b10cd8bfe89c091c5265fc89ac', moveFocusTo: this.closeButton })))));
|
|
25148
25298
|
}
|
|
25149
25299
|
get element() { return getElement(this); }
|
|
25150
25300
|
static get watchers() { return {
|
|
@@ -25225,18 +25375,18 @@ class DuetSlideoutPanelDropdown {
|
|
|
25225
25375
|
* Always the last one in the class.
|
|
25226
25376
|
*/
|
|
25227
25377
|
render() {
|
|
25228
|
-
return (hAsync(Host, { key: '
|
|
25378
|
+
return (hAsync(Host, { key: 'b8179a5080947725342d197344710fbb8c99fee2' }, hAsync("div", { key: 'dfb6f63b98b77618b5f556d2008bb2745c5164ac', class: {
|
|
25229
25379
|
"duet-slideout-panel-dropdown": true,
|
|
25230
25380
|
"duet-theme-turva": this.theme === "turva",
|
|
25231
25381
|
active: this.open,
|
|
25232
|
-
} }, hAsync("button", { key: '
|
|
25382
|
+
} }, hAsync("button", { key: '6a31f384af8ec340aa0d26d3fb18efe76855d18b', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
|
|
25233
25383
|
active: this.active,
|
|
25234
25384
|
"duet-theme-turva": this.theme === "turva",
|
|
25235
|
-
}, onClick: this.onClick }, this.icon && hAsync("duet-icon", { key: '
|
|
25385
|
+
}, onClick: this.onClick }, this.icon && hAsync("duet-icon", { key: '10ffc7f65f631843ec04d4a016061155033d633e', name: this.icon, size: "small", margin: "none", color: "secondary" }), hAsync("span", { key: 'de2ae3fe7a4de7974c3b839d245449d8b7268abc', class: "label" }, hAsync("slot", { key: 'e2f3a31a59d5baf185f7a49076b5fa47d2a9eba2', name: "label" }), hAsync("duet-icon", { key: '654ec9b0d065f01e1f144c3de8838ccd9a16a38c', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), hAsync("div", { key: 'e14ff7d4a35724a16e4463d19c7ac7abfa1e2aa7', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
|
|
25236
25386
|
items: true,
|
|
25237
25387
|
hidden: !this.open,
|
|
25238
25388
|
"duet-theme-turva": this.theme === "turva",
|
|
25239
|
-
} }, hAsync("slot", { key: '
|
|
25389
|
+
} }, hAsync("slot", { key: 'd2ccb0322e0d7b4a2bb757bd5d23cebfe60db960' })))));
|
|
25240
25390
|
}
|
|
25241
25391
|
get element() { return getElement(this); }
|
|
25242
25392
|
static get style() { return duetSlideoutPanelDropdownCss; }
|
|
@@ -25280,7 +25430,7 @@ class DuetSpacer {
|
|
|
25280
25430
|
* Always the last one in the class.
|
|
25281
25431
|
*/
|
|
25282
25432
|
render() {
|
|
25283
|
-
return (hAsync(Host, { key: '
|
|
25433
|
+
return (hAsync(Host, { key: 'd6cd3738f2f7e8184419c36dab8844ba5bbb5e1e', class: {
|
|
25284
25434
|
"duet-spacer": true,
|
|
25285
25435
|
"duet-spacer-xx-small": this.breakpoint === "xx-small",
|
|
25286
25436
|
"duet-spacer-x-small": this.breakpoint === "x-small",
|
|
@@ -25335,7 +25485,7 @@ class DuetSpinner {
|
|
|
25335
25485
|
*/
|
|
25336
25486
|
render() {
|
|
25337
25487
|
const color = !!this.color && this.color === "currentColor" ? "currentColor" : getColorByName(this.color, this.theme);
|
|
25338
|
-
return (hAsync(Host, { key: '
|
|
25488
|
+
return (hAsync(Host, { key: '2bc7c46f85e5bc998bdacbd35c9c1446f69cbafb' }, hAsync("div", { key: '7d7f56f381399e446b907acf07560819c0cbe769', class: {
|
|
25339
25489
|
"duet-spinner": true,
|
|
25340
25490
|
[this.size]: true,
|
|
25341
25491
|
"duet-theme-turva": this.theme === "turva",
|
|
@@ -25443,11 +25593,11 @@ class DuetStatusIcon {
|
|
|
25443
25593
|
}
|
|
25444
25594
|
}
|
|
25445
25595
|
render() {
|
|
25446
|
-
return (hAsync(Host, { key: '
|
|
25596
|
+
return (hAsync(Host, { key: '1ca69dd10d6b02ca1861ed79ca6893995846297a', class: {
|
|
25447
25597
|
[`duet-status-icon-${this.getVariation()}`]: true,
|
|
25448
25598
|
"duet-strong-bg": this.strong,
|
|
25449
25599
|
"duet-m-0": this.margin === "none",
|
|
25450
|
-
} }, hAsync("duet-icon", { key: '
|
|
25600
|
+
} }, hAsync("duet-icon", { key: 'fa7ba272523dad56aca0e17ce988da0f737ba2dd', icon: this.getIcon(), size: this.size, margin: "none" })));
|
|
25451
25601
|
}
|
|
25452
25602
|
static get style() { return duetStatusIconCss; }
|
|
25453
25603
|
static get cmpMeta() { return {
|
|
@@ -25569,13 +25719,13 @@ class DuetStep {
|
|
|
25569
25719
|
* Always the last one in the class.
|
|
25570
25720
|
*/
|
|
25571
25721
|
render() {
|
|
25572
|
-
return (hAsync("div", { key: '
|
|
25722
|
+
return (hAsync("div", { key: '410f3ba5a4c08c17e565dca5914c6397a8b4a9bb', class: {
|
|
25573
25723
|
"duet-step": true,
|
|
25574
25724
|
[`is-${this.state}`]: true,
|
|
25575
25725
|
"rounded-top": this.roundedTop,
|
|
25576
25726
|
"rounded-bottom": this.roundedBottom,
|
|
25577
25727
|
"duet-theme-turva": this.theme === "turva",
|
|
25578
|
-
} }, hAsync("div", { key: '
|
|
25728
|
+
} }, hAsync("div", { key: 'c32f962589b722dd4cdff4570236e5461844d9f2', class: "duet-step-heading", id: this.buttonId, role: this.state !== "current" ? "button" : "region", "aria-current": this.state === "current" ? "step" : undefined, tabindex: this.state !== "current" ? "0" : undefined, "aria-disabled": this.isClickDisabled().toString(), "aria-expanded": (this.state === "current").toString(), "aria-controls": this.contentId, "aria-selected": (this.state === "current").toString(), onClick: this.handleClick, onKeyDown: this.handleKeyDown, ref: element => (this.buttonElement = element) }, hAsync("div", { key: '534b449b0149f14c71c8a255e97f438f1fb534b3', "aria-hidden": "true" }, hAsync("div", { key: '83026292f5ad4c4fd49cfb3eabd2788af1fd4780', class: "duet-step-counter" }, this.renderStepCounter())), hAsync("duet-spacer", { key: '40bd8de5bb73973ce94b92840593dfa62db9652d', direction: "horizontal", size: "large", breakpoint: "small" }), hAsync("duet-spacer", { key: 'e821c6539548079ca25a9bf9fb2a23c3514933de', direction: "horizontal", size: "medium", breakpoint: "x-small" }), hAsync("div", { key: 'a30345d3bc25835f4f949a35cc5f904dddd23d89' }, hAsync("duet-heading", { key: '5bff2f4ba60be7e1fc9055a5768e9833185ab3aa', theme: this.theme, level: this.headingLevel, visualLevel: "h4", color: this.headingColor(), margin: "none" }, this.heading)), hAsync("duet-spacer", { key: '975fd245cc2446e5e5512e14d2321c52e14fb956', direction: "horizontal", size: "large" }), hAsync("div", { key: '3fcc998e525a6466b3e3145ff3761785e90ec3b8', class: "duet-step-heading-slot" }, hAsync("slot", { key: 'e9d50a730784ed9bd962dca7d877ad087fa4609d', name: "heading-content" }))), hAsync("div", { key: '55ac85266d0d99b8395ea4767eb4ac2286803ec5', class: "duet-step-content-wrapper" }, hAsync("div", { key: 'aba80e085e8739ac8c87c4e1ead392b3d1965017', class: "duet-step-content", role: "region", "aria-labelledby": this.buttonId, id: this.contentId }, hAsync("slot", { key: 'e45dc448e50cc6a3a025de1c1869e1dca0591caa' })))));
|
|
25579
25729
|
}
|
|
25580
25730
|
get element() { return getElement(this); }
|
|
25581
25731
|
static get style() { return duetStepCss; }
|
|
@@ -25722,7 +25872,7 @@ class DuetStepper {
|
|
|
25722
25872
|
* Always the last one in the class.
|
|
25723
25873
|
*/
|
|
25724
25874
|
render() {
|
|
25725
|
-
return (hAsync(Host, { key: '
|
|
25875
|
+
return (hAsync(Host, { key: 'ad7496622f65e7ea3efc00cd1d5cde5f83bee8de', class: { "duet-m-0": this.margin === "none" } }, hAsync("div", { key: '6a48c6be81c8b46c82d4b3004b28ce5c7b50c345', class: { "duet-stepper": true, "duet-theme-turva": this.theme === "turva" } }, hAsync("duet-visually-hidden", { key: 'b121f34975d226d3dc3bfc78c30507d0d8ad359f', "aria-live": "polite", "aria-atomic": "true", "aria-relevant": "all" }, this.formatAnnouncement()), hAsync("slot", { key: '6cc98ee6e6fde161ec959cceee943d8e13e9054d' }))));
|
|
25726
25876
|
}
|
|
25727
25877
|
get element() { return getElement(this); }
|
|
25728
25878
|
static get watchers() { return {
|
|
@@ -25876,19 +26026,19 @@ class DuetSubmenuBar {
|
|
|
25876
26026
|
* Always the last one in the class.
|
|
25877
26027
|
*/
|
|
25878
26028
|
render() {
|
|
25879
|
-
return (hAsync(Host, { key: '
|
|
26029
|
+
return (hAsync(Host, { key: '816ecf621e240e3cf6a2288aab18767528ef10b0' }, hAsync("nav", { key: 'aee92ffb8c65faaa013ddfdf10c40ec4f467030f', class: {
|
|
25880
26030
|
"duet-submenu-bar": true,
|
|
25881
26031
|
"duet-theme-turva": this.theme === "turva",
|
|
25882
26032
|
hidden: this.hidden,
|
|
25883
|
-
}, "aria-label": this.accessibleLabel }, this.hasItems && (hAsync("button", { key: '
|
|
26033
|
+
}, "aria-label": this.accessibleLabel }, this.hasItems && (hAsync("button", { key: 'c6d43080e7c320cfb23321f04aaf242a00d08a0d', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", id: "button", type: "button", class: {
|
|
25884
26034
|
active: this.open,
|
|
25885
|
-
}, onClick: this.onClick }, hAsync("span", { key: '
|
|
26035
|
+
}, onClick: this.onClick }, hAsync("span", { key: '724fe14b534bb7275701c6ee57f6eba306ed21ce', class: "label" }, hAsync("slot", { key: '1e761ff10257510e5a44b581d3c6bbae8e3fd1f2', name: "label" }), hAsync("duet-icon", { key: 'ca72a4a98873e59b5dfd602408c05913de7b7070', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), hAsync("div", { key: 'beed4388ee3ff813baa6c1fe93c8bfddb6c7529f', class: {
|
|
25886
26036
|
"menu-container": true,
|
|
25887
26037
|
hidden: !this.open,
|
|
25888
|
-
}, role: "presentation" }, hAsync("div", { key: '
|
|
26038
|
+
}, role: "presentation" }, hAsync("div", { key: 'e294e75a427015c1cbbde13893a39ea85f1f7835', role: this.mobile ? "menu" : null, id: "menu", "aria-labelledby": this.mobile ? "button" : null, "aria-expanded": this.mobile ? (this.open ? "true" : "false") : null, class: {
|
|
25889
26039
|
items: true,
|
|
25890
26040
|
hidden: !this.open,
|
|
25891
|
-
}, ref: element => (this.itemsContainer = element) }, hAsync("div", { key: '
|
|
26041
|
+
}, ref: element => (this.itemsContainer = element) }, hAsync("div", { key: '99cf2dbeac35681c212fa459d303036f74c6e66e', class: "list", role: this.mobile ? "presentation" : "list" }, hAsync("slot", { key: 'fb30bed27a6b2d3dc7289043e4814b5aa076e210' }), hAsync("div", { key: '09ccbcb5e99b2579ea961dddbdda729420d0f43f', class: "list-padding" }))), hAsync("duet-overlay", { key: 'c95ed4b5f791d6c6cab6ade6fb4269a00dc4af1d', "keep-stacking-context": true, visible: this.open, "display-device": "not-large", transition: "immediate" })))));
|
|
25892
26042
|
}
|
|
25893
26043
|
get element() { return getElement(this); }
|
|
25894
26044
|
static get watchers() { return {
|
|
@@ -26020,18 +26170,18 @@ class DuetSubmenuBarDropdown {
|
|
|
26020
26170
|
* Always the last one in the class.
|
|
26021
26171
|
*/
|
|
26022
26172
|
render() {
|
|
26023
|
-
return (hAsync(Host, { key: '
|
|
26173
|
+
return (hAsync(Host, { key: 'b51e8416e33625711e381e53bec0724889b3d4a1', role: "listitem" }, hAsync("div", { key: '44c9b2f36c4579b75175240b1ab037d48fabed5d', class: {
|
|
26024
26174
|
"duet-submenu-bar-dropdown": true,
|
|
26025
26175
|
"duet-theme-turva": this.theme === "turva",
|
|
26026
26176
|
open: this.open,
|
|
26027
26177
|
active: this.active,
|
|
26028
|
-
} }, hAsync("button", { key: '
|
|
26178
|
+
} }, hAsync("button", { key: '9142786ada48453874be341a2409d16c83e91347', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
|
|
26029
26179
|
open: this.open,
|
|
26030
26180
|
active: this.active,
|
|
26031
|
-
}, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: '
|
|
26181
|
+
}, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: 'e0dba09b06d16f60131bf1ac7744e7867e77a9c3', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: 'da38470a493fbbae28f1e9ab1217f63fa8106937', class: "label" }, hAsync("span", { key: '64980453db932e88d8dfe8f88f28e1aa5eb14c66', class: "label-text" }, hAsync("slot", { key: 'f8dc584414a25bd7ab46519ebc01e0b9f1892db0', name: "label" })), hAsync("duet-icon", { key: '1ede41bfa5de2236c4f2d1dbfc3c470864710fca', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: '18aec6f6c56e6b784c2e74fe652e9cce530b675f', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
|
|
26032
26182
|
items: true,
|
|
26033
26183
|
hidden: !this.open,
|
|
26034
|
-
} }, hAsync("slot", { key: '
|
|
26184
|
+
} }, hAsync("slot", { key: '8dc7c90b3bf98db886ad26d888b54899eb399a29' })))));
|
|
26035
26185
|
}
|
|
26036
26186
|
get element() { return getElement(this); }
|
|
26037
26187
|
static get style() { return duetSubmenuBarDropdownCss; }
|
|
@@ -26100,12 +26250,12 @@ class DuetSubmenuBarDropdownLink {
|
|
|
26100
26250
|
* Always the last one in the class.
|
|
26101
26251
|
*/
|
|
26102
26252
|
render() {
|
|
26103
|
-
return (hAsync(Host, { key: '
|
|
26253
|
+
return (hAsync(Host, { key: '46fc9ecd76bd0715d98c22b8e9b0fc81fa13b151' }, hAsync("a", { key: '3bd490d3d6485f2a2aa481cbcd294c76f18670ec', class: {
|
|
26104
26254
|
"duet-submenu-bar-dropdown-link": true,
|
|
26105
26255
|
"duet-theme-turva": this.theme === "turva",
|
|
26106
26256
|
highlight: this.highlight,
|
|
26107
26257
|
active: this.active,
|
|
26108
|
-
}, "aria-current": this.active ? "true" : "false", href: this.href, onKeyUp: e => this.handleEscape(e) }, this.icon && hAsync("duet-icon", { key: '
|
|
26258
|
+
}, "aria-current": this.active ? "true" : "false", href: this.href, onKeyUp: e => this.handleEscape(e) }, this.icon && hAsync("duet-icon", { key: 'ad47b72b28599ba487f8c98ed70b01514e3e1086', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), hAsync("span", { key: 'df8c68c67625c6c7c4ef9363225bdddc13946d6f', class: "label-container" }, hAsync("span", { key: '2befba9fc4edcedfc11cd3554439fa795d8baaf3', class: "label" }, hAsync("slot", { key: '0ff3ae9e9ea866cc6bf02cf51ef3c157101164b5' })), this.caret && hAsync("duet-icon", { key: '5206b89fd11d42de2c5072746c8a0de5d01e8236', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (hAsync("duet-icon", { key: '4ef4476f43c827135b27937299b87b29e8026412', class: "active-check", name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
|
|
26109
26259
|
}
|
|
26110
26260
|
get element() { return getElement(this); }
|
|
26111
26261
|
static get style() { return duetSubmenuBarDropdownLinkCss; }
|
|
@@ -26201,7 +26351,7 @@ class DuetSubmenuBarItem {
|
|
|
26201
26351
|
render() {
|
|
26202
26352
|
const TagName = this.url ? "a" : "button";
|
|
26203
26353
|
const role = this.url ? "link" : "button";
|
|
26204
|
-
return (hAsync(Host, { key: '
|
|
26354
|
+
return (hAsync(Host, { key: 'a6d866946b9ba85265cc7df4d98403697d619606', role: "listitem" }, hAsync(TagName, { key: '32a6f64535cfb4468e4df774b840203265d183d8', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: { "duet-submenu-bar-item": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.url, onKeyUp: e => this.handleEscape(e), "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, role: role, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: '49ecd11776943249f4563c1131a9f76dff3914e9', class: "leading-icon", theme: this.theme, name: this.leadingIcon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: 'b129913e594e27a973bd72edcb1cde1eb5cb3e1e', class: "label" }, hAsync("span", { key: '0f6a39e368b2e40b6ba401586fc4daa9442cf8f0', class: "label-text" }, hAsync("slot", { key: '00bfacd528e419c0e68e6d9c8040d36f0cc0b71c' })), (this.trailingIcon || this.external) && (hAsync("duet-icon", { key: 'e44a9f410642e5acd3f79250bf80844393789527', class: {
|
|
26205
26355
|
"trailing-icon": !!this.trailingIcon,
|
|
26206
26356
|
"trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
|
|
26207
26357
|
"external-icon": !!this.external,
|
|
@@ -26273,7 +26423,7 @@ class DuetSubmenuBarLink {
|
|
|
26273
26423
|
* Always the last one in the class.
|
|
26274
26424
|
*/
|
|
26275
26425
|
render() {
|
|
26276
|
-
return (hAsync(Host, { key: '
|
|
26426
|
+
return (hAsync(Host, { key: '61a7e1fc2b326138c7cfc134690d1c4f190fe946', role: "listitem" }, hAsync("a", { key: 'd5322e03b0df04c31a0937d405679c24674b35d6', class: { "duet-submenu-bar-link": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.href, onKeyUp: e => this.handleEscape(e), "aria-current": this.active ? "true" : "false" }, this.icon && (hAsync("duet-icon", { key: '5f5def1255fed4d06a745760805a4d5305165c2e', class: "submenu-bar-link-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("span", { key: '5c0f68184f743f8252c0a05efa52fbd7b6bcd5c0', class: "label" }, hAsync("slot", { key: 'd372e57f8d53c24773f8f0583e73194abeab8601' })))));
|
|
26277
26427
|
}
|
|
26278
26428
|
get element() { return getElement(this); }
|
|
26279
26429
|
static get style() { return duetSubmenuBarLinkCss; }
|
|
@@ -26399,7 +26549,7 @@ class DuetTab {
|
|
|
26399
26549
|
* Always the last one in the class.
|
|
26400
26550
|
*/
|
|
26401
26551
|
render() {
|
|
26402
|
-
return (hAsync("div", { key: '
|
|
26552
|
+
return (hAsync("div", { key: '52685c26793f37570debd51c11fd6d9c0eacb7a1', ref: element => {
|
|
26403
26553
|
if (!this.contentId) {
|
|
26404
26554
|
this.tabpanelElement = element;
|
|
26405
26555
|
}
|
|
@@ -26408,7 +26558,7 @@ class DuetTab {
|
|
|
26408
26558
|
"duet-tab": true,
|
|
26409
26559
|
selected: this.selected,
|
|
26410
26560
|
"has-content-id": !!this.contentId,
|
|
26411
|
-
}, "aria-description": this.accessibleDescription, "aria-labelledby": this.accessibleLabelledBy, tabindex: "-1" }, hAsync("slot", { key: '
|
|
26561
|
+
}, "aria-description": this.accessibleDescription, "aria-labelledby": this.accessibleLabelledBy, tabindex: "-1" }, hAsync("slot", { key: 'bc08f9d93e9cb6653bfb2a97f5cc5fb9f67a1fe9' })));
|
|
26412
26562
|
}
|
|
26413
26563
|
get element() { return getElement(this); }
|
|
26414
26564
|
static get watchers() { return {
|
|
@@ -26719,13 +26869,13 @@ class DuetTabGroup {
|
|
|
26719
26869
|
[largeBreakpoint]: ["default", "plain", "plain-scrolling"].includes(this.variation) ? true : false,
|
|
26720
26870
|
"duet-theme-turva": this.theme === "turva",
|
|
26721
26871
|
}, onClick: () => this.onTabSelect(index), onKeyDown: ev => this.handleKeyDown(ev) }, this.variation === "checked" ? (hAsync("div", { class: { "checked-tab-content": true, "stackable-checked-tab-content": this.tabs.length <= 3 } }, hAsync("div", { class: { "checked-tab-description": true, "stackable-description": this.tabs.length <= 3 } }, hAsync("p", null, element.label), hAsync("p", { class: { "tab-caption": true, selected: element.selected } }, element.caption)), hAsync("div", { class: { "stackable-checkmark": this.tabs.length <= 3 } }, hAsync("duet-checkmark", { theme: this.theme, checked: element.selected, type: "radio", "presentation-only": true, center: true })))) : (element.label), element.indicator && (hAsync("duet-indicator", { variation: element.indicator, "accessible-label": element.indicatorAccessibleLabel })))));
|
|
26722
|
-
return (hAsync("div", { key: '
|
|
26872
|
+
return (hAsync("div", { key: '494ac1333a13dd37b390174ca79a3a90e89f13d0', class: {
|
|
26723
26873
|
"duet-tab-group": true,
|
|
26724
26874
|
"duet-theme-turva": this.theme === "turva",
|
|
26725
26875
|
[variationClass]: true,
|
|
26726
26876
|
"duet-tab-plain-scrolling": this.variation === "plain-scrolling",
|
|
26727
26877
|
"duet-tab-group-scrolls": true,
|
|
26728
|
-
}, "aria-label": this.accessibleLabel }, hAsync("div", { key: '
|
|
26878
|
+
}, "aria-label": this.accessibleLabel }, hAsync("div", { key: 'eb4e340563793bfda1941a66200f6d07929bccb2', role: "tablist", class: {
|
|
26729
26879
|
"duet-m-0": this.margin === "none" || this.variation === "checked",
|
|
26730
26880
|
"duet-tab-group-tabs": true,
|
|
26731
26881
|
"duet-tab-group-hidden": this.tabs.length > 3 && !isSwipeScrollable,
|
|
@@ -26736,11 +26886,11 @@ class DuetTabGroup {
|
|
|
26736
26886
|
} }, this.variation === "checked" ? (buttons) : (hAsync("div", { class: {
|
|
26737
26887
|
"duet-tab-group-scrollable-wrapper": true,
|
|
26738
26888
|
"duet-tab-group-fill-space-wrapper": this.fillSpace && this.variation === "default",
|
|
26739
|
-
} }, this.fillSpace && !this.stretch && this.variation === "default" && (hAsync("div", { class: "duet-scrollable-stretch-overlay" }, hAsync("div", { class: "background" }), hAsync("div", { class: "border" }))), hAsync("duet-scrollable", { selected: this.selected, identifier: this.identifier, gap: ["default", "plain", "plain-scrolling"].includes(this.variation) ? "none" : "large", buttonPosition: this.variation === "default" ? "absolute" : "relative", center: this.isCentered() ? this.isCentered() : this.element.style.textAlign == "center", theme: this.theme, stretch: this.stretch }, buttons)))), hAsync("div", { key: '
|
|
26889
|
+
} }, this.fillSpace && !this.stretch && this.variation === "default" && (hAsync("div", { class: "duet-scrollable-stretch-overlay" }, hAsync("div", { class: "background" }), hAsync("div", { class: "border" }))), hAsync("duet-scrollable", { selected: this.selected, identifier: this.identifier, gap: ["default", "plain", "plain-scrolling"].includes(this.variation) ? "none" : "large", buttonPosition: this.variation === "default" ? "absolute" : "relative", center: this.isCentered() ? this.isCentered() : this.element.style.textAlign == "center", theme: this.theme, stretch: this.stretch }, buttons)))), hAsync("div", { key: 'fc769c72a4f684dc6f6cf0e893b93215b98b2d87', class: {
|
|
26740
26890
|
"duet-tab-group-content": true,
|
|
26741
26891
|
"duet-m-0": this.margin === "none",
|
|
26742
26892
|
"checked-group-content": this.variation === "checked",
|
|
26743
|
-
} }, hAsync("slot", { key: '
|
|
26893
|
+
} }, hAsync("slot", { key: '20db6ecc342cbd347bdf35885289259106a07442' }))));
|
|
26744
26894
|
}
|
|
26745
26895
|
get element() { return getElement(this); }
|
|
26746
26896
|
static get style() { return duetTabGroupCss; }
|
|
@@ -27390,7 +27540,7 @@ class DuetTable {
|
|
|
27390
27540
|
}
|
|
27391
27541
|
}
|
|
27392
27542
|
render() {
|
|
27393
|
-
return (hAsync(Host, { key: '
|
|
27543
|
+
return (hAsync(Host, { key: '5416b5f7a33d4e5c30e826f1f41c03005bf5511b', class: {
|
|
27394
27544
|
[`duet-table-${this.variation}`]: true,
|
|
27395
27545
|
"duet-table-flattened": !this.matchesBreakpoint,
|
|
27396
27546
|
// sticky only valid when in regular table layout
|
|
@@ -27399,7 +27549,7 @@ class DuetTable {
|
|
|
27399
27549
|
"duet-m-0": this.margin === "none",
|
|
27400
27550
|
"duet-theme-turva": this.theme === "turva",
|
|
27401
27551
|
"duet-table-hide-head-visually": this.hideHeadVisually,
|
|
27402
|
-
} }, hAsync("slot", { key: '
|
|
27552
|
+
} }, hAsync("slot", { key: '517ff1c0cda9e306cb0ea05f1e56a1d74e9a74d3' })));
|
|
27403
27553
|
}
|
|
27404
27554
|
get element() { return getElement(this); }
|
|
27405
27555
|
static get watchers() { return {
|
|
@@ -27425,7 +27575,132 @@ class DuetTable {
|
|
|
27425
27575
|
}; }
|
|
27426
27576
|
}
|
|
27427
27577
|
|
|
27428
|
-
const
|
|
27578
|
+
const duetTeaserCss = "*,\n*::after,\n*::before {\n box-sizing: border-box;\n padding: 0;\n margin: 0;\n -moz-appearance: none;\n -webkit-appearance: none;\n appearance: none;\n background: transparent;\n border: 0;\n}\n\n:host {\n box-sizing: border-box;\n padding: 0;\n margin: 0;\n -moz-appearance: none;\n -webkit-appearance: none;\n appearance: none;\n background: transparent;\n border: 0;\n display: block;\n width: auto;\n container-type: inline-size;\n}\n\n.duet-teaser {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n border-radius: 16px;\n}\n.duet-teaser .image-wrap,\n.duet-teaser .icon-wrap {\n margin-bottom: 16px;\n}\n.duet-teaser .image-wrap {\n display: inline-block;\n overflow: hidden;\n border-radius: 16px;\n}\n.duet-teaser .image-wrap .duet-teaser-image {\n display: block;\n width: 100%;\n aspect-ratio: 16/10;\n object-fit: cover;\n}\n.duet-teaser .icon-wrap .duet-teaser-icon {\n display: block;\n width: 30px;\n width: 62px;\n height: 30px;\n height: 62px;\n}\n@container (width > 450px) {\n .duet-teaser .icon-wrap .duet-teaser-icon {\n width: 36px;\n width: 76px;\n height: 36px;\n height: 76px;\n }\n}\n.duet-teaser ::slotted(.teaser-heading) {\n margin: 0 0 1rem 0;\n font-size: 1.5rem;\n font-weight: 700;\n line-height: 1.25;\n}\n.duet-teaser ::slotted(.teaser-heading-h5) {\n font-size: 1.25rem;\n font-weight: 600;\n line-height: 1.25;\n}\n.duet-teaser .duet-teaser-body {\n display: flex;\n flex-direction: column;\n}\n.duet-teaser .duet-teaser-body .duet-teaser-meta {\n order: -1;\n padding-top: 8px;\n}\n.duet-teaser.duet-teaser-link {\n text-decoration: none;\n}\n.duet-teaser.duet-teaser-link:focus {\n outline: 2px solid;\n outline-offset: 2px;\n outline-color: rgba(0, 119, 179, 0.8);\n}\n.duet-theme-turva .duet-teaser.duet-teaser-link:focus, .duet-teaser.duet-teaser-link:focus.duet-theme-turva {\n outline: 2px solid;\n outline-offset: 2px;\n outline-color: rgba(53, 79, 101, 0.8);\n}\n.duet-teaser.duet-teaser-link .image-wrap {\n display: inline-block;\n overflow: hidden;\n}\n.duet-teaser.duet-teaser-link .image-wrap img {\n transition: transform 300ms ease;\n}\n.duet-teaser.duet-teaser-link ::slotted(.teaser-heading) {\n color: rgb(0, 75, 129);\n}\n.duet-teaser.duet-teaser-link:hover .teaser-heading {\n color: rgb(0, 97, 155);\n}\n.duet-teaser.duet-teaser-link:hover .image-wrap img {\n transform: scale(1.1);\n transition: transform 300ms ease;\n}\n.duet-teaser.duet-teaser-link:hover ::slotted(.teaser-heading) {\n color: rgb(0, 97, 155);\n text-decoration: underline;\n}\n\n.duet-theme-turva.duet-teaser {\n font-family: \"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n}\n.duet-theme-turva.duet-teaser-link ::slotted(.teaser-heading) {\n color: rgb(140, 0, 30);\n}\n.duet-theme-turva.duet-teaser-link:hover ::slotted(.teaser-heading) {\n color: rgb(185, 3, 41);\n}";
|
|
27579
|
+
|
|
27580
|
+
const LONG_HEADING_LENGTH = 60;
|
|
27581
|
+
/**
|
|
27582
|
+
* @slot links - Slot for links or buttons related to the teaser. Only default duet-link and plain duet-button components should be used in this slot. Not rendered when the `url` property is set.
|
|
27583
|
+
*/
|
|
27584
|
+
class DuetTeaser {
|
|
27585
|
+
constructor(hostRef) {
|
|
27586
|
+
registerInstance(this, hostRef);
|
|
27587
|
+
/**
|
|
27588
|
+
* Theme.
|
|
27589
|
+
*/
|
|
27590
|
+
this.theme = "";
|
|
27591
|
+
/**
|
|
27592
|
+
* The actual heading level used in the HTML markup.
|
|
27593
|
+
*/
|
|
27594
|
+
this.headingLevel = "h3";
|
|
27595
|
+
/**
|
|
27596
|
+
* Controls the visual size of the heading. Headings longer than 60 characters
|
|
27597
|
+
* always use "h5" visually, regardless of this setting.
|
|
27598
|
+
*/
|
|
27599
|
+
this.headingVisualLevel = "h3";
|
|
27600
|
+
/**
|
|
27601
|
+
* Background color for the icon
|
|
27602
|
+
*/
|
|
27603
|
+
this.iconBackground = "color-background-accent-secondary";
|
|
27604
|
+
/**
|
|
27605
|
+
* Color for the icon
|
|
27606
|
+
*/
|
|
27607
|
+
this.iconColor = "color-foreground-accent-secondary";
|
|
27608
|
+
/**
|
|
27609
|
+
* Creates/updates the actual heading element as a light DOM child of the
|
|
27610
|
+
* host, slotted into the "heading" slot.
|
|
27611
|
+
*/
|
|
27612
|
+
this.headingSetUp = () => {
|
|
27613
|
+
const existing = this.element.querySelector(":scope > [slot='heading']");
|
|
27614
|
+
if (!this.heading) {
|
|
27615
|
+
existing === null || existing === void 0 ? void 0 : existing.remove();
|
|
27616
|
+
return;
|
|
27617
|
+
}
|
|
27618
|
+
const tagMatches = (existing === null || existing === void 0 ? void 0 : existing.tagName.toLowerCase()) === this.headingLevel;
|
|
27619
|
+
const headingElement = tagMatches ? existing : document.createElement(this.headingLevel);
|
|
27620
|
+
headingElement.slot = "heading";
|
|
27621
|
+
headingElement.textContent = this.heading;
|
|
27622
|
+
headingElement.className = `teaser-heading teaser-heading-${this.getHeadingVisualLevel()}`;
|
|
27623
|
+
if (!tagMatches) {
|
|
27624
|
+
existing === null || existing === void 0 ? void 0 : existing.remove();
|
|
27625
|
+
this.element.appendChild(headingElement);
|
|
27626
|
+
}
|
|
27627
|
+
};
|
|
27628
|
+
}
|
|
27629
|
+
/**
|
|
27630
|
+
* Component lifecycle events.
|
|
27631
|
+
*/
|
|
27632
|
+
componentWillLoad() {
|
|
27633
|
+
inheritGlobalTheme(this);
|
|
27634
|
+
this.hasLinksSlot = hasSlot(this.element, "links");
|
|
27635
|
+
checkNamedSlotElement(this.element, "links", "duet-link[variation=default],duet-link:not([variation]),duet-button[variation=plain]", 0, true);
|
|
27636
|
+
}
|
|
27637
|
+
componentDidRender() {
|
|
27638
|
+
this.headingSetUp();
|
|
27639
|
+
}
|
|
27640
|
+
/**
|
|
27641
|
+
* Sets focus on underlying a element.
|
|
27642
|
+
* Available only when url attribute is used.
|
|
27643
|
+
* Use this method instead of the native `focus()`.
|
|
27644
|
+
*/
|
|
27645
|
+
async setFocus(options) {
|
|
27646
|
+
if (this.url && this.aOrDivElement) {
|
|
27647
|
+
this.aOrDivElement.focus(options);
|
|
27648
|
+
}
|
|
27649
|
+
}
|
|
27650
|
+
getHeadingVisualLevel() {
|
|
27651
|
+
return this.heading && this.heading.length > LONG_HEADING_LENGTH ? "h5" : this.headingVisualLevel;
|
|
27652
|
+
}
|
|
27653
|
+
/**
|
|
27654
|
+
* render() function
|
|
27655
|
+
* Always the last one of the class.
|
|
27656
|
+
*/
|
|
27657
|
+
render() {
|
|
27658
|
+
const TagName = this.url ? "a" : "div";
|
|
27659
|
+
const pictureSource = {
|
|
27660
|
+
img: {
|
|
27661
|
+
src: this.image,
|
|
27662
|
+
alt: this.imageAlt || "",
|
|
27663
|
+
loading: this.imagePriority === "high" ? "eager" : "lazy",
|
|
27664
|
+
fetchpriority: this.imagePriority,
|
|
27665
|
+
class: "duet-teaser-image",
|
|
27666
|
+
},
|
|
27667
|
+
sources: parsePossibleJSON(this.sources),
|
|
27668
|
+
};
|
|
27669
|
+
return (hAsync(Host, { key: '2177fb25347d6718b106ee8ae29a47da6ae543b2' }, hAsync(TagName, { key: '4485125a5e29b14c00da4a7ff1ab55ae30ae03fd', href: this.url, class: {
|
|
27670
|
+
"duet-teaser": true,
|
|
27671
|
+
"duet-theme-turva": this.theme === "turva",
|
|
27672
|
+
"duet-teaser-link": !!this.url,
|
|
27673
|
+
}, ref: element => (this.aOrDivElement = element) }, this.image ? (hAsync("div", { class: "image-wrap" }, hAsync(DuetPicture, Object.assign({}, pictureSource)))) : (this.icon && (hAsync("div", { class: "icon-wrap" }, hAsync("duet-icon", { class: "duet-teaser-icon", shape: "brand", color: this.iconColor, background: this.iconBackground, name: this.icon, margin: "none" })))), hAsync("div", { key: 'c1bf8197236423d2c89e927609b46bf541f2ff2c', class: "duet-teaser-body" }, this.heading && (hAsync("div", { key: 'f217f4e9e0ef3304743f40e2fff01054ca029f70' }, hAsync("slot", { key: '4a57d8a71a89df56fff5f1be801425a26cac3e54', name: "heading" }))), this.meta && (hAsync("duet-paragraph", { key: 'cacaa63522817218386da1de2ef6ab41dcf7927e', class: "duet-teaser-meta", margin: "none" }, this.meta)), this.description && hAsync("duet-paragraph", { key: '575cb467ffd41ab0a5fb5f71f8995a4a8db15d48' }, this.description), !this.url && this.hasLinksSlot && (hAsync("duet-grid", { key: '02c90e874e6c2b45b5e43194d161b30045effd31', direction: "vertical" }, hAsync("slot", { key: 'fd2c221a55bbb1433355d189632eaf7795576561', name: "links" })))))));
|
|
27674
|
+
}
|
|
27675
|
+
get element() { return getElement(this); }
|
|
27676
|
+
static get style() { return duetTeaserCss; }
|
|
27677
|
+
static get cmpMeta() { return {
|
|
27678
|
+
"$flags$": 265,
|
|
27679
|
+
"$tagName$": "duet-teaser",
|
|
27680
|
+
"$members$": {
|
|
27681
|
+
"theme": [1025],
|
|
27682
|
+
"heading": [1],
|
|
27683
|
+
"headingLevel": [1, "heading-level"],
|
|
27684
|
+
"headingVisualLevel": [1, "heading-visual-level"],
|
|
27685
|
+
"description": [1],
|
|
27686
|
+
"meta": [1],
|
|
27687
|
+
"url": [1],
|
|
27688
|
+
"image": [1],
|
|
27689
|
+
"imageAlt": [1, "image-alt"],
|
|
27690
|
+
"imagePriority": [1, "image-priority"],
|
|
27691
|
+
"sources": [1],
|
|
27692
|
+
"icon": [1],
|
|
27693
|
+
"iconBackground": [1, "icon-background"],
|
|
27694
|
+
"iconColor": [1, "icon-color"],
|
|
27695
|
+
"setFocus": [64]
|
|
27696
|
+
},
|
|
27697
|
+
"$listeners$": undefined,
|
|
27698
|
+
"$lazyBundleId$": "-",
|
|
27699
|
+
"$attrsToReflect$": []
|
|
27700
|
+
}; }
|
|
27701
|
+
}
|
|
27702
|
+
|
|
27703
|
+
const duetTextareaCss = ".duet-internal-label{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;margin-bottom:12px !important;position:relative;z-index:100;display:inline-flex;width:auto;margin-top:8px !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:600 !important;line-height:1.25;line-height:1.25;color:rgb(8, 42, 77);text-align:left;word-break:break-word;cursor:default}.duet-internal-label.duet-p-0{padding:0 !important}.duet-internal-label.duet-m-0{margin:0 !important}.duet-internal-label span{font-size:1rem;font-weight:600 !important;word-break:break-word}.duet-internal-label.duet-m-0{margin-bottom:0 !important}.duet-internal-label.duet-small-margin{margin-top:8px !important;margin-bottom:4px !important}.duet-internal-label.duet-has-tooltip{padding-right:48px}@media (min-width: 48em){.duet-internal-label.duet-has-tooltip{padding-right:0}}.duet-internal-label.duet-internal-label-small{font-size:0.875rem}.duet-internal-label.duet-internal-label-small span{font-size:0.875rem}.duet-internal-label.duet-weight-normal{font-weight:400 !important}.duet-internal-label.duet-weight-normal span{font-weight:400 !important}.duet-internal-label.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:rgb(23, 42, 59)}*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;margin-right:16px !important;margin-bottom:12px !important;display:block;width:100%;max-width:100%;text-align:left}:host:last-child,:host:last-of-type{margin-right:0 !important}[alignment=form-distribute]>:host:last-of-type:not(:last-child){margin-right:16px !important}@media (min-width: 36em){:host{width:calc(50% - 16px - 3px)}:host.duet-expand{width:100% !important}}:host(.duet-m-0){margin:0 !important}duet-tooltip,::slotted(duet-tooltip){position:absolute;top:12px;right:0}@media (min-width: 48em){duet-tooltip,::slotted(duet-tooltip){position:relative;top:4px;right:auto}}.duet-textarea-container{position:relative;width:100%;height:100%}.duet-textarea-container .duet-input-top-caption{display:none}.duet-textarea-container.duet-input-top-caption-shown .duet-input-top-caption{display:flex !important}.duet-textarea-wrapper{position:relative}.duet-textarea-placeholder{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:rgb(255, 255, 255)}.duet-textarea{padding:15px !important;position:relative;z-index:100;display:block;width:100%;min-width:8rem;min-height:160px;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.25;color:rgb(8, 42, 77);resize:vertical;background:rgb(255, 255, 255);border:1px solid rgb(127, 150, 165);border-radius:4px}.duet-textarea:focus{outline:2px solid;outline-offset:0;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-textarea:focus,.duet-textarea:focus.duet-theme-turva{outline:2px solid;outline-offset:0;outline-color:rgba(53, 79, 101, 0.8)}.has-error .duet-textarea{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important}.duet-textarea[rows]{min-height:auto}.duet-textarea::placeholder{color:rgb(98, 121, 138);opacity:1 !important}.duet-textarea:focus::placeholder{color:rgb(181, 198, 208)}.duet-textarea[disabled]{color:rgb(98, 121, 138) !important;cursor:not-allowed !important;outline:none !important;background:rgb(228, 236, 239) !important;border-color:rgb(181, 198, 208) !important;opacity:1 !important;-webkit-text-fill-color:rgb(8, 42, 77) !important}.duet-textarea[disabled]::placeholder{color:rgb(8, 42, 77);opacity:1 !important}.duet-textarea[readonly]{color:rgb(62, 84, 102) !important;border-color:rgb(212, 223, 229)}.duet-textarea:hover:not(:disabled):not(:focus){outline:2px solid;outline-color:rgb(127, 150, 165) !important;outline-offset:-1px}.duet-theme-turva .duet-textarea:hover:not(:disabled):not(:focus),.duet-textarea:hover:not(:disabled):not(:focus).duet-theme-turva{outline-color:rgb(120, 145, 164) !important}.has-error .duet-textarea:hover:not(:disabled):not(:focus){outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important;outline-width:2px;outline-color:rgb(214, 28, 82) !important}.duet-textarea:focus{outline:2px solid;outline-color:rgb(0, 119, 179) !important;outline-offset:-1px}.duet-theme-turva .duet-textarea:focus,.duet-textarea:focus.duet-theme-turva{outline-color:rgb(23, 42, 59) !important}.has-error .duet-textarea:focus{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important;outline-width:2px;outline-color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255) !important}.duet-textarea:not(:focus):not(:hover):invalid{outline:none}.duet-textarea-help{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;line-height:1.25}.duet-textarea-help span{display:block;margin-top:8px}.has-error .duet-textarea-help{color:rgb(214, 28, 82)}.duet-label-hidden .duet-internal-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;border:0;clip:rect(0 0 0 0)}.duet-character-count{display:block;margin:8px 0 0 auto}.duet-theme-turva .duet-textarea{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 42, 59);border-color:rgb(120, 145, 164)}.duet-theme-turva .duet-textarea::placeholder{color:rgb(120, 145, 164)}.duet-theme-turva .duet-textarea:focus{border-color:rgb(23, 42, 59)}.duet-theme-turva .duet-textarea:focus::placeholder{color:rgb(178, 194, 205)}.duet-theme-turva .duet-textarea[disabled]::placeholder{color:rgb(23, 42, 59)}.duet-theme-turva .duet-textarea[disabled]{color:rgb(95, 122, 143) !important;cursor:not-allowed !important;outline:none !important;background:rgb(228, 233, 237) !important;border-color:rgb(178, 194, 205) !important;opacity:1 !important;-webkit-text-fill-color:rgb(23, 42, 59) !important}.duet-theme-turva .duet-textarea[readonly]{color:rgb(53, 79, 101) !important;border-color:rgb(212, 221, 226)}.duet-theme-turva.has-error .duet-textarea-help{color:rgb(214, 28, 82)}.duet-theme-turva .duet-textarea-help{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(120, 145, 164)}";
|
|
27429
27704
|
|
|
27430
27705
|
const CharacterCount = ({ value, maxlength, theme }) => {
|
|
27431
27706
|
if (maxlength == null) {
|
|
@@ -27500,6 +27775,11 @@ class DuetTextarea {
|
|
|
27500
27775
|
* technologies.
|
|
27501
27776
|
*/
|
|
27502
27777
|
this.disabled = false;
|
|
27778
|
+
/**
|
|
27779
|
+
* Makes the textarea component not mutable, meaning the user cannot edit the control.
|
|
27780
|
+
* The user can otherwise interact, e.g. by selecting the content and copying it.
|
|
27781
|
+
*/
|
|
27782
|
+
this.readonly = false;
|
|
27503
27783
|
/**
|
|
27504
27784
|
* Set whether the textarea is required or not. Please note that this is required for
|
|
27505
27785
|
* accessible inputs when the user is required to fill them. When using this property
|
|
@@ -27521,7 +27801,8 @@ class DuetTextarea {
|
|
|
27521
27801
|
*/
|
|
27522
27802
|
this.echoPlaceholder = false;
|
|
27523
27803
|
/**
|
|
27524
|
-
* Display the textarea in error state along with an error message.
|
|
27804
|
+
* Display the textarea in error state along with an error message. If the textarea is disabled
|
|
27805
|
+
* or readonly, the error is ignored.
|
|
27525
27806
|
*/
|
|
27526
27807
|
this.error = "";
|
|
27527
27808
|
/**
|
|
@@ -27656,23 +27937,26 @@ class DuetTextarea {
|
|
|
27656
27937
|
async setFocus(options) {
|
|
27657
27938
|
this.nativeInput.focus(options);
|
|
27658
27939
|
}
|
|
27940
|
+
get writable() {
|
|
27941
|
+
return !this.disabled && !this.readonly;
|
|
27942
|
+
}
|
|
27659
27943
|
/**
|
|
27660
27944
|
* render() function
|
|
27661
27945
|
* Always the last one in the class.
|
|
27662
27946
|
*/
|
|
27663
27947
|
render() {
|
|
27664
27948
|
const identifier = this.identifier || this.textareaId;
|
|
27665
|
-
return (hAsync(Host, { key: '
|
|
27949
|
+
return (hAsync(Host, { key: 'f667e15959599e11fba7779a062513b430c237f4', class: {
|
|
27666
27950
|
"duet-m-0": this.margin === "none",
|
|
27667
27951
|
"duet-has-counter": this.counter && !this.error,
|
|
27668
27952
|
"duet-expand": this.expand,
|
|
27669
|
-
} }, hAsync("div", { key: '
|
|
27953
|
+
} }, hAsync("div", { key: '3017c39ed8485d0c4cd5cbff373e5795b315e239', class: {
|
|
27670
27954
|
"duet-textarea-container": true,
|
|
27671
27955
|
"duet-theme-turva": this.theme === "turva",
|
|
27672
27956
|
"duet-label-hidden": this.labelHidden,
|
|
27673
27957
|
"duet-input-top-caption-shown": this.isCaptionVisible,
|
|
27674
|
-
"has-error": !!this.error,
|
|
27675
|
-
} }, hAsync(DuetInternalLabel, { key: '
|
|
27958
|
+
"has-error": !!this.error && this.writable,
|
|
27959
|
+
} }, hAsync(DuetInternalLabel, { key: 'b62e9c27cf13789036b04f320bda685083796517', theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, margin: this.isCaptionVisible ? "small" : "auto", color: this.labelColor, weight: this.labelWeight, id: this.labelId, for: identifier }, this.label), this.tooltip && (hAsync("duet-tooltip", { key: '24dcec9860bfc8bbfb0547e924f8d4319cd18064', direction: this.tooltipDirection, accessibleInputLabel: this.label, theme: this.theme === "turva" ? "turva" : "default" }, this.tooltip)), hAsync("slot", { key: '5a197f095df7dd625df5b6f9b0b40a2f8d61bb52', name: "tooltip" }), this.caption && (hAsync("duet-caption", { key: '08a5a97579b9614b1e1e059f0975885c8ff4030f', id: this.topCaptionId, size: "medium", theme: this.theme === "turva" ? "turva" : "default" }, this.caption)), hAsync("div", { key: '78ece66c1cfdbe778fe3e3293ddf5343842dcc21', class: "duet-textarea-wrapper" }, this.placeholder && this.echoPlaceholder && this.value && (hAsync("duet-caption", { key: '326ce34b3e142f2a7676067fc13452d02cd63d05', id: this.topCaptionPlaceholderId, class: "duet-textarea-placeholder", size: "small" }, this.placeholder)), hAsync("textarea", { key: '994ac4a61ba288bd72d73a504f8a7721fa1c0389', onInput: this.handleInput, onChange: this.handleChange, onBlur: this.handleBlur, onFocus: this.handleFocus, ref: input => (this.nativeInput = input), class: { "duet-textarea": true, disabled: this.disabled }, value: this.value, disabled: this.disabled, readonly: this.readonly, "aria-labelledby": this.accessibleLabelledBy ? `${this.labelId} ${this.accessibleLabelledBy}` : this.labelId, "aria-controls": this.accessibleControls, "aria-autocomplete": this.accessibleAutocomplete, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.getDescribedBy(), "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, placeholder: this.placeholder, spellcheck: "false", required: this.required, rows: this.rows, minlength: this.minlength, maxlength: this.maxlength, role: this.role, name: this.name, id: identifier })), hAsync("duet-grid", { key: '0b61766a90b3b6e76cab85dfd55b81cc487e77c9', alignment: "stretch" }, hAsync("duet-grid-item", { key: '9bc9ee00a5268f80e0b9c01cb99099f98ea59fde', margin: "none", fill: true }, hAsync("div", { key: '18eb1c48ea7cf5a44ab21477b6a68bc7b7baccc5', class: "duet-textarea-help duet-textarea-error", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && this.writable && hAsync("span", { key: 'a76db4119e297a2451e2c6ffa6894cf044a1aeaa' }, this.error))), hAsync("duet-grid-item", { key: '020dc157342b1572a54c82726d88d14ef17c6dcb', margin: "none", class: "duet-character-count-caption" }, this.counter && hAsync(CharacterCount, { key: '495d71bfc1a80ce1709014843a81cb2e96fb6021', theme: this.theme, value: this.value, maxlength: this.maxlength }))), this.counter && this.maxlength && (hAsync("duet-visually-hidden", { key: 'b682416e87e7ad792b67cc3b6d754495f94b351f', id: this.characterCountId, class: "visually-hidden-counter", "aria-live": "polite" }, this.visuallyHiddenCounterText)))));
|
|
27676
27960
|
}
|
|
27677
27961
|
get element() { return getElement(this); }
|
|
27678
27962
|
static get watchers() { return {
|
|
@@ -27697,6 +27981,7 @@ class DuetTextarea {
|
|
|
27697
27981
|
"theme": [1025],
|
|
27698
27982
|
"expand": [4],
|
|
27699
27983
|
"disabled": [516],
|
|
27984
|
+
"readonly": [516],
|
|
27700
27985
|
"identifier": [1],
|
|
27701
27986
|
"required": [4],
|
|
27702
27987
|
"label": [1],
|
|
@@ -27725,7 +28010,7 @@ class DuetTextarea {
|
|
|
27725
28010
|
},
|
|
27726
28011
|
"$listeners$": undefined,
|
|
27727
28012
|
"$lazyBundleId$": "-",
|
|
27728
|
-
"$attrsToReflect$": [["disabled", "disabled"], ["error", "error"]]
|
|
28013
|
+
"$attrsToReflect$": [["disabled", "disabled"], ["readonly", "readonly"], ["error", "error"]]
|
|
27729
28014
|
}; }
|
|
27730
28015
|
}
|
|
27731
28016
|
|
|
@@ -27841,11 +28126,11 @@ class DuetToggle {
|
|
|
27841
28126
|
*/
|
|
27842
28127
|
render() {
|
|
27843
28128
|
const identifier = this.identifier || this.toggleId;
|
|
27844
|
-
return (hAsync(Host, { key: '
|
|
28129
|
+
return (hAsync(Host, { key: 'c1f8b026ca2f0eaf39a54127c1f69d22694a46d2', onClick: this.disabled || this.loading ? undefined : this.onClick, class: {
|
|
27845
28130
|
"duet-m-0": this.margin === "none",
|
|
27846
28131
|
"duet-toggle-is-disabled": this.disabled,
|
|
27847
28132
|
"duet-toggle-is-loading": this.loading,
|
|
27848
|
-
} }, hAsync("div", { key: '
|
|
28133
|
+
} }, hAsync("div", { key: '13c89c2abc235e07e99e671d73e4561eb0f83cc8', class: {
|
|
27849
28134
|
"duet-toggle": true,
|
|
27850
28135
|
"duet-theme-turva": this.theme === "turva",
|
|
27851
28136
|
"duet-side-label": this.labelPosition !== "top",
|
|
@@ -27853,7 +28138,7 @@ class DuetToggle {
|
|
|
27853
28138
|
"duet-label-hidden": this.labelHidden,
|
|
27854
28139
|
"duet-toggle-is-disabled": this.disabled,
|
|
27855
28140
|
"duet-toggle-is-loading": this.loading,
|
|
27856
|
-
} }, hAsync(DuetInternalLabel, { key: '
|
|
28141
|
+
} }, hAsync(DuetInternalLabel, { key: 'ee03e1def14f4be0d469081e28e6dd34f622ff29', theme: this.theme, color: this.labelColor, weight: this.labelWeight, for: identifier, margin: this.labelPosition === "top" ? "auto" : "none" }, this.label), hAsync("div", { key: '46af0389473f5f8d9f509472b24b92eef985b98e', class: "duet-switch" }, hAsync("input", { key: '864dbbeaffc9cea78be34939de9c6d349c88cae2', type: "checkbox", value: this.value, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, id: identifier, role: this.role, name: this.name, checked: this.checked, required: this.required, disabled: this.disabled || this.loading, ref: input => (this.nativeInput = input) }), hAsync("div", { key: '0493bd3ec7da36a97706b3950c28d98b723d1979', class: { "duet-slider": true, "duet-theme-turva": this.theme === "turva" } }), this.loading && hAsync("duet-spinner", { key: 'd484ef05401a121a7ed665c35cc466ad06ed933b', color: "primary" }))), this.loading && (hAsync("duet-visually-hidden", { key: '489d5f94a8f46f6c1acefece45eda231d9c786c9', "aria-live": "polite" }, this.accessibleLabelLoading || DuetStringsLoadingDefaults[getLanguage()])), this.loadingComplete && (hAsync("duet-visually-hidden", { key: '7c3d367d72ff5cecae77d9ca0e8a9d5ed43e0a39', "aria-live": "polite" }, this.accessibleLabelComplete || DuetStringsCompleteDefaults[getLanguage()]))));
|
|
27857
28142
|
}
|
|
27858
28143
|
get element() { return getElement(this); }
|
|
27859
28144
|
static get watchers() { return {
|
|
@@ -27934,11 +28219,11 @@ class DuetToolbar {
|
|
|
27934
28219
|
: this.variation === "secondary"
|
|
27935
28220
|
? "secondary"
|
|
27936
28221
|
: "default";
|
|
27937
|
-
return (hAsync(Host, { key: '
|
|
28222
|
+
return (hAsync(Host, { key: 'a37f1935a900c25d98ec68adf41051ba262b8382' }, hAsync("nav", { key: '2902f5f92017c5d24c9d402f1e15a987e015ee39', class: {
|
|
27938
28223
|
"duet-toolbar": true,
|
|
27939
28224
|
"duet-theme-turva": this.theme === "turva",
|
|
27940
28225
|
[variation]: true,
|
|
27941
|
-
}, "aria-label": this.accessibleLabel }, hAsync("div", { key: '
|
|
28226
|
+
}, "aria-label": this.accessibleLabel }, hAsync("div", { key: '83f64d72ba0fb5f452c002eaf87c5fe549665730', class: "container" }, hAsync("div", { key: '81ca721a0ef1c7f5251611645bb4bd1bad34c154', class: "list", role: "list" }, hAsync("slot", { key: '67dc75314e0816f603cd8a377641f353d809f35d', name: "left" })), hAsync("div", { key: 'd4d812cb4a537406f4bd1763df1ecb1dbcc4c36d', class: "list", role: "list" }, hAsync("slot", { key: 'fd698d64dcd063a8aac4d85a89100a35108ae52d', name: "right" }))))));
|
|
27942
28227
|
}
|
|
27943
28228
|
get element() { return getElement(this); }
|
|
27944
28229
|
static get style() { return duetToolbarCss; }
|
|
@@ -28019,18 +28304,18 @@ class DuetToolbarDropdown {
|
|
|
28019
28304
|
itemsAlign = this.element.parentElement.getAttribute("slot") === "left" ? "right" : "left";
|
|
28020
28305
|
}
|
|
28021
28306
|
const variation = this.variation === "negative" ? "negative" : "white";
|
|
28022
|
-
return (hAsync(Host, { key: '
|
|
28307
|
+
return (hAsync(Host, { key: 'aafd01e336e6bc1037a016fbffba1ae619434b15', role: "listitem" }, hAsync("div", { key: '8620d663e3c022d08b0daa55dda118d493244188', class: {
|
|
28023
28308
|
"duet-toolbar-dropdown": true,
|
|
28024
28309
|
"duet-theme-turva": this.theme === "turva",
|
|
28025
28310
|
[itemsAlign]: true,
|
|
28026
28311
|
[variation]: true,
|
|
28027
|
-
} }, hAsync("button", { key: '
|
|
28312
|
+
} }, hAsync("button", { key: '1bcde327fae00ec8f8dcdbc34bd2af817394901a', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel, id: "button", type: "button", class: {
|
|
28028
28313
|
active: this.active,
|
|
28029
28314
|
open: this.open,
|
|
28030
|
-
}, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: '
|
|
28315
|
+
}, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: '1b7b369f990d99d15c37ce70162d3148bca43324', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("span", { key: 'bc284f69d58f2e4c4dc426aafe9e6f0683752d32', class: "label" }, hAsync("slot", { key: '1a2892fad84bce88372d8217504315d0d268d3ed', name: "label" }), hAsync("duet-icon", { key: 'd3ba7796bcf62e9a1bafc0d69fbe77f7b5efc031', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: 'e81d20d35970fd47f5e0999a48746863a282a980', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
|
|
28031
28316
|
items: true,
|
|
28032
28317
|
hidden: !this.open,
|
|
28033
|
-
} }, hAsync("slot", { key: '
|
|
28318
|
+
} }, hAsync("slot", { key: '4e1918ec2fe0c4c33248f10ffca23c9fa12a175a' })))));
|
|
28034
28319
|
}
|
|
28035
28320
|
get element() { return getElement(this); }
|
|
28036
28321
|
static get style() { return duetToolbarDropdownCss; }
|
|
@@ -28096,11 +28381,11 @@ class DuetToolbarDropdownLink {
|
|
|
28096
28381
|
* Always the last one in the class.
|
|
28097
28382
|
*/
|
|
28098
28383
|
render() {
|
|
28099
|
-
return (hAsync(Host, { key: '
|
|
28384
|
+
return (hAsync(Host, { key: '8afa16142be5af1ab49de317f14695be29cb76a7' }, hAsync("a", { key: '17139e958d8b5bd8b2c9a8b272e8faaf844b3b6b', class: {
|
|
28100
28385
|
"duet-toolbar-dropdown-link": true,
|
|
28101
28386
|
"duet-theme-turva": this.theme === "turva",
|
|
28102
28387
|
active: this.active,
|
|
28103
|
-
}, href: this.href, lang: this.targetLanguage, hreflang: this.targetLanguage, role: "link menuitem", "aria-label": this.accessibleLabel, "aria-current": this.active ? "true" : "false", onKeyUp: e => this.handleEscape(e) }, this.icon && hAsync("duet-icon", { key: '
|
|
28388
|
+
}, href: this.href, lang: this.targetLanguage, hreflang: this.targetLanguage, role: "link menuitem", "aria-label": this.accessibleLabel, "aria-current": this.active ? "true" : "false", onKeyUp: e => this.handleEscape(e) }, this.icon && hAsync("duet-icon", { key: '0953a2ad108b8f7c7705bff8b946cc065ae64369', name: this.icon, size: "x-small", margin: "none" }), hAsync("span", { key: '4187f1ee1ec2f028643715c47719354d45842ffe', class: "label" }, hAsync("slot", { key: '35b9dc036dba71cda8d9f25077fa638fd2e15e86' })), this.active && (hAsync("duet-icon", { key: '00cc11661aa635747fe4d1029c0fbac4f96c8dea', name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
|
|
28104
28389
|
}
|
|
28105
28390
|
get element() { return getElement(this); }
|
|
28106
28391
|
static get style() { return duetToolbarDropdownLinkCss; }
|
|
@@ -28203,17 +28488,17 @@ class DuetToolbarItem {
|
|
|
28203
28488
|
: this.variation === "secondary"
|
|
28204
28489
|
? "secondary"
|
|
28205
28490
|
: "default";
|
|
28206
|
-
return (hAsync(Host, { key: '
|
|
28491
|
+
return (hAsync(Host, { key: '73b6913f425eb535964ae3ae588815d7d69548f5', role: "listitem" }, this.badge && hAsync("duet-indicator", { key: 'fb04ed3b79c12c89dce6c4cc42e53ffc6a25b9a7', variation: "change" }), hAsync(TagName, { key: '34f42a96b15efdd18605a81134d12790585b1b5d', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: {
|
|
28207
28492
|
"duet-toolbar-item": true,
|
|
28208
28493
|
"duet-theme-turva": this.theme === "turva",
|
|
28209
28494
|
active: this.active,
|
|
28210
28495
|
[variation]: true,
|
|
28211
|
-
}, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("div", { key: '
|
|
28496
|
+
}, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("div", { key: '9289fe0fd7d3cba9769923352564e54ccd6bdb15', class: "duet-toolbar-icon" }, hAsync("duet-icon", { key: '7a68a52ec75a0cb94658292ec2888a41cfe6af55', size: "x-small", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" }), this.badge && hAsync("div", { key: '5dd3b5ede328e883a64141fde15a1dd6eca5fe4c', class: "duet-toolbar-badge" }))), hAsync("slot", { key: '3a7913d7f34b57b85720813018e2b122ef38b9d7' }), (this.trailingIcon || (this.url && this.external)) && (hAsync("div", { key: '62a9d4853e8b77c6197624c58edd4aed4a60748f', class: "duet-toolbar-icon" }, hAsync("duet-icon", { key: '48819424506ca2fbde8b1510c4f68bdc323b7a99', class: {
|
|
28212
28497
|
"trailing-icon": !!this.trailingIcon,
|
|
28213
28498
|
"trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
|
|
28214
28499
|
"external-icon": !!(this.url && this.external),
|
|
28215
28500
|
rotate: this.trailingIcon === "action-arrow-down-small" && this.accessibleExpanded,
|
|
28216
|
-
}, theme: this.theme, name: this.trailingIcon ? this.trailingIcon : this.url && this.external ? newWindowIcon.title : "", margin: "none", size: "auto", color: "currentColor" }), this.badge && this.trailingIcon !== "action-arrow-down-small" && hAsync("div", { key: '
|
|
28501
|
+
}, theme: this.theme, name: this.trailingIcon ? this.trailingIcon : this.url && this.external ? newWindowIcon.title : "", margin: "none", size: "auto", color: "currentColor" }), this.badge && this.trailingIcon !== "action-arrow-down-small" && hAsync("div", { key: 'fa960663370b85e48492736a9cd6cba8c62b5732', class: "duet-toolbar-badge" }))))));
|
|
28217
28502
|
}
|
|
28218
28503
|
get element() { return getElement(this); }
|
|
28219
28504
|
static get style() { return duetToolbarItemCss; }
|
|
@@ -28280,12 +28565,12 @@ class DuetToolbarLink {
|
|
|
28280
28565
|
*/
|
|
28281
28566
|
render() {
|
|
28282
28567
|
const variation = this.variation === "negative" ? "negative" : "white";
|
|
28283
|
-
return (hAsync(Host, { key: '
|
|
28568
|
+
return (hAsync(Host, { key: '05a4f64c0670e5cd2739b4c48604b3b66f4f66f6', role: "listitem" }, hAsync("a", { key: '3c7e34e171e59a1d33a5f38f130b76305da9d838', class: {
|
|
28284
28569
|
"duet-toolbar-link": true,
|
|
28285
28570
|
"duet-theme-turva": this.theme === "turva",
|
|
28286
28571
|
active: this.active,
|
|
28287
28572
|
[variation]: true,
|
|
28288
|
-
}, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '
|
|
28573
|
+
}, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '091c6f6380417c2580fd39ea6a75a1ca84c3f62d', size: "x-small", name: this.icon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: '734f21e042064ae86b54ddeb767a58909a5af1f7' }))));
|
|
28289
28574
|
}
|
|
28290
28575
|
get element() { return getElement(this); }
|
|
28291
28576
|
static get style() { return duetToolbarLinkCss; }
|
|
@@ -28602,7 +28887,7 @@ class DuetTooltip {
|
|
|
28602
28887
|
}; }
|
|
28603
28888
|
}
|
|
28604
28889
|
|
|
28605
|
-
const duetTooltipButtonCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}.duet-tooltip-button{z-index:100;display:inline-block;align-items:center;justify-content:center;min-width:48px;height:48px;padding:0 !important;margin-right:-12px;line-height:normal !important;color:rgb(0, 119, 179);white-space:nowrap;cursor:pointer;background:transparent !important;border-radius:4px}.duet-tooltip-button:focus{outline:0}:host(.user-is-tabbing) .duet-tooltip-button:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva :host(.user-is-tabbing) .duet-tooltip-button:focus,:host(.user-is-tabbing) .duet-tooltip-button:focus.duet-theme-turva{outline-color:rgba(53, 79, 101, 0.8)}.duet-tooltip-button.duet-tooltip-button-negative{color:rgb(255, 255, 255)}.duet-tooltip-button:hover{color:rgb(0, 75, 129)}.duet-tooltip-button:hover.duet-tooltip-button-negative{color:rgb(255, 255, 255)}.duet-tooltip-button:focus,:host(.user-is-tabbing) .duet-tooltip-button:focus{background:transparent !important}.duet-tooltip-button svg{width:20px;height:20px;pointer-events:none}.duet-tooltip-button.duet-tooltip-button-in-badge{width:16px;min-width:16px;height:16px;color:inherit}.duet-tooltip-button.duet-tooltip-button-in-badge:focus{outline:0 !important}.duet-tooltip-button.duet-tooltip-button-in-badge svg{width:12px;height:12px}.duet-tooltip-button-has-label{margin-right:0}.duet-tooltip-label{position:relative;z-index:100;display:inline-block;max-width:calc(100% - 30px);margin-left:12px !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:600;line-height:1.25;vertical-align:top;text-align:left;white-space:normal}.duet-theme-turva.duet-tooltip-button{color:rgb(230, 23, 64)}.duet-theme-turva.duet-tooltip-button:hover{color:rgb(230, 23, 64)}.duet-theme-turva.duet-tooltip-button.duet-tooltip-button-in-badge{color:inherit}.duet-theme-turva .duet-tooltip-label{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}";
|
|
28890
|
+
const duetTooltipButtonCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}.duet-tooltip-button{z-index:100;display:inline-block;align-items:center;justify-content:center;min-width:48px;height:48px;padding:0 !important;margin-right:-12px;line-height:normal !important;color:rgb(0, 119, 179);white-space:nowrap;cursor:pointer;background:transparent !important;border-radius:4px}.duet-tooltip-button:focus{outline:0}:host(.user-is-tabbing) .duet-tooltip-button:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva :host(.user-is-tabbing) .duet-tooltip-button:focus,:host(.user-is-tabbing) .duet-tooltip-button:focus.duet-theme-turva{outline-color:rgba(53, 79, 101, 0.8)}.duet-tooltip-button.duet-tooltip-button-negative{color:rgb(255, 255, 255)}.duet-tooltip-button:hover{color:rgb(0, 75, 129)}.duet-tooltip-button:hover.duet-tooltip-button-negative{color:rgb(255, 255, 255)}.duet-tooltip-button:focus,:host(.user-is-tabbing) .duet-tooltip-button:focus{background:transparent !important}.duet-tooltip-button svg{width:20px;height:20px;pointer-events:none}.duet-tooltip-button.duet-tooltip-button-in-badge{width:16px;min-width:16px;height:16px;color:inherit}.duet-tooltip-button.duet-tooltip-button-in-badge:focus{outline:0 !important}.duet-tooltip-button.duet-tooltip-button-in-badge svg{width:12px;height:12px}.duet-tooltip-button-has-label{margin-right:0}.duet-tooltip-label{position:relative;z-index:100;display:inline-block;max-width:calc(100% - 30px);margin-left:12px !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:600;line-height:1.25;vertical-align:top;text-align:left;white-space:normal}.duet-theme-turva.duet-tooltip-button{color:rgb(230, 23, 64)}.duet-theme-turva.duet-tooltip-button:hover{color:rgb(230, 23, 64)}.duet-theme-turva.duet-tooltip-button.duet-tooltip-button-in-badge{color:inherit}.duet-theme-turva.duet-tooltip-button.duet-tooltip-button-negative{color:rgb(255, 255, 255)}.duet-theme-turva.duet-tooltip-button.duet-tooltip-button-negative:hover{color:rgb(255, 255, 255)}.duet-theme-turva .duet-tooltip-label{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}";
|
|
28606
28891
|
|
|
28607
28892
|
/**
|
|
28608
28893
|
* @internal
|
|
@@ -28638,14 +28923,14 @@ class DuetTooltipButton {
|
|
|
28638
28923
|
* Always the last one in the class.
|
|
28639
28924
|
*/
|
|
28640
28925
|
render() {
|
|
28641
|
-
const visuallyHidden = hAsync("duet-visually-hidden", { key: '
|
|
28642
|
-
return (hAsync(Host, { key: '
|
|
28926
|
+
const visuallyHidden = hAsync("duet-visually-hidden", { key: '635d9f636534191031bbefe82d1efe3bb0ca1be3' }, this.accessibleLabel);
|
|
28927
|
+
return (hAsync(Host, { key: 'f4ac65122f13177047aeb77c0861d58738546509' }, hAsync("button", { key: 'e6b356569faeb652df1aa80feb023ab4cff1e621', ref: el => (this.buttonElement = el), "aria-controls": this.tooltipId, "aria-expanded": this.active ? "true" : "false", type: "button", class: {
|
|
28643
28928
|
"duet-tooltip-button": true,
|
|
28644
28929
|
"duet-tooltip-button-has-label": !!this.label,
|
|
28645
28930
|
"duet-theme-turva": this.theme === "turva",
|
|
28646
28931
|
"duet-tooltip-button-negative": this.negative,
|
|
28647
28932
|
"duet-tooltip-button-in-badge": this.inBadge,
|
|
28648
|
-
} }, hAsync("svg", { key: '
|
|
28933
|
+
} }, hAsync("svg", { key: '78594fe2105d48e470ea27e1c776e3be260d05a3', "aria-hidden": "true", role: "img", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: '889a195a1409d4bc11fee456c8bedd3cc9c9f104', d: "m13.5 17.25c-1.241 0-2.25-1.009-2.25-2.25v-3.75h-.75c-.414 0-.75-.336-.75-.75s.336-.75.75-.75h.75c.827 0 1.5.673 1.5 1.5v3.75c0 .414.336.75.75.75h.75c.414 0 .75.336.75.75s-.336.75-.75.75z" }), hAsync("circle", { key: '6b321e4d4880ac85bf1c4a4cdbb9578cd8ed3637', cx: "11.625", cy: "7.125", r: "1.125" }), hAsync("path", { key: '1a13066394a6acb5b62cf8fae650a79104b91a21', d: "m12 24c-6.617 0-12-5.383-12-12s5.383-12 12-12 12 5.383 12 12-5.383 12-12 12zm0-22.5c-5.79 0-10.5 4.71-10.5 10.5s4.71 10.5 10.5 10.5 10.5-4.71 10.5-10.5-4.71-10.5-10.5-10.5z" })), this.label ? (hAsync("span", { class: "duet-tooltip-label" }, this.label, visuallyHidden)) : (visuallyHidden))));
|
|
28649
28934
|
}
|
|
28650
28935
|
get element() { return getElement(this); }
|
|
28651
28936
|
static get style() { return duetTooltipButtonCss; }
|
|
@@ -28711,14 +28996,14 @@ class DuetTooltipPopup {
|
|
|
28711
28996
|
this.contentEl.focus();
|
|
28712
28997
|
}
|
|
28713
28998
|
render() {
|
|
28714
|
-
return (hAsync(Host, { key: '
|
|
28999
|
+
return (hAsync(Host, { key: '778391de6847a5b7b639a09443e9dec0621a8796' }, hAsync("div", { key: '9b0d4cb9978cf2d304de748b9a87828379ea12b1', class: {
|
|
28715
29000
|
"duet-tooltip": true,
|
|
28716
29001
|
"duet-theme-turva": this.theme === "turva",
|
|
28717
29002
|
"duet-tooltip-active": this.active === true,
|
|
28718
|
-
} }, hAsync(FocusGuard, { key: '
|
|
29003
|
+
} }, hAsync(FocusGuard, { key: '71184f23e8382d5825458029532f2a405f218110', moveFocusTo: this.buttonEl }), hAsync("div", { key: 'a401f946fc3c88268557b0ce35eae3d839179ee6', ref: element => (this.contentEl = element), class: {
|
|
28719
29004
|
"duet-tooltip-content-area": true,
|
|
28720
29005
|
"duet-theme-turva": this.theme === "turva",
|
|
28721
|
-
}, tabindex: -1, id: this.tooltipId }, hAsync("slot", { key: '
|
|
29006
|
+
}, tabindex: -1, id: this.tooltipId }, hAsync("slot", { key: '26863da248c5b4a88ccc62322feb440cd3b0c1b0' })), hAsync("div", { key: 'cd0499889d2a77c78accd98e43c779d094763621', ref: element => (this.arrowEl = element), class: { arrow: true, [this.placement]: true }, style: this.arrowStyles }, hAsync("div", { key: 'cec22b52e115faf80fc4fe5e718194adc703b186', class: { "arrow-container": true, [this.placement]: true } })), hAsync("button", { key: 'e94d9ea886d69e78317113bd1cbdee3b4c384b5e', type: "button", class: "duet-tooltip-close", onClick: this.handleCloseClick, ref: el => (this.buttonEl = el) }, hAsync("duet-icon", { key: 'cb959efca9b977153343d3f1fc94eed0b08c71d6', name: "navigation-close-small", margin: "none", color: "currentColor", size: "xxx-small" }), hAsync("duet-visually-hidden", { key: '7ddb28ae6bac6673c73b92378d2298746f2f2631' }, this.accessibleCloseLabel)), hAsync(FocusGuard, { key: '707fc931ad2d467dc590b8752b939d8a854af30c', moveFocusTo: this.contentEl }))));
|
|
28722
29007
|
}
|
|
28723
29008
|
get element() { return getElement(this); }
|
|
28724
29009
|
static get style() { return duetTooltipPopupCss; }
|
|
@@ -28867,14 +29152,14 @@ class DuetTray {
|
|
|
28867
29152
|
* Always the last one in the class.
|
|
28868
29153
|
*/
|
|
28869
29154
|
render() {
|
|
28870
|
-
return (hAsync("div", { key: '
|
|
29155
|
+
return (hAsync("div", { key: 'fd50cc2b8b3ef5655eea859837b7d777e643ed8b', class: {
|
|
28871
29156
|
"duet-tray": true,
|
|
28872
29157
|
"duet-tray-is-active": this.active,
|
|
28873
29158
|
"duet-tray-is-hidden": this.hiddenState,
|
|
28874
29159
|
"duet-tray-is-responsive": this.responsive,
|
|
28875
29160
|
"duet-theme-turva": this.theme === "turva",
|
|
28876
29161
|
"duet-tray-is-expandable": this.hasAdditionalContent,
|
|
28877
|
-
} }, hAsync("div", { key: '
|
|
29162
|
+
} }, hAsync("div", { key: '6f4920fc46ec9ca16fffde76491332f8c4347ca1', class: "duet-tray-default-content", role: "status" }, hAsync("slot", { key: '86015d1b7a5c5f2fa233def31e8f827d7d087e16' })), this.hasAdditionalContent && (hAsync(Fragment, { key: '8a60cf5da72a7a7c5fe879a616d71c82381c4585' }, hAsync("button", { key: 'b1276c9c3c7758191345196f93f17edbae8b1b0f', "aria-expanded": this.expanded ? "true" : "false", "aria-controls": this.expandableId, onClick: ev => this.toggleExpandable(ev), class: { "duet-tray-button": true, "duet-tray-is-expanded": this.expanded } }, hAsync("duet-icon", { key: '24fcfa99098667d6e75caaa51e77032cf8dc9ad1', name: "action-arrow-down", size: "small", color: "currentColor", margin: "none" }), hAsync("duet-visually-hidden", { key: '423a4e0bc8d2ca2984f406f2f392f88bd9602dc2' }, this.expanded ? this.accessibleCloseLabel : this.accessibleOpenLabel)), hAsync("div", { key: '8f3e1506edebd49b0c7f867bdc4aa109ed8f0f2e', id: this.expandableId, class: { "duet-tray-expandable": true, active: this.expanded } }, hAsync("div", { key: 'd904e8635cc16b23ce73280b6df8db7254f4256e', class: "duet-tray-expandable-content" }, hAsync("slot", { key: 'e18df7f7b85e8d19c5910c76b026535a5d478dd7', name: "additional" })))))));
|
|
28878
29163
|
}
|
|
28879
29164
|
get element() { return getElement(this); }
|
|
28880
29165
|
static get style() { return duetTrayCss; }
|
|
@@ -30189,10 +30474,10 @@ class DuetUpload {
|
|
|
30189
30474
|
this.externalUploadButton.accessibleLabel = `${this.externalUploadButton.innerText}. ${caption}`;
|
|
30190
30475
|
}
|
|
30191
30476
|
// @ts-ignore
|
|
30192
|
-
return (hAsync(Host, { key: '
|
|
30477
|
+
return (hAsync(Host, { key: '7a152217f20a5952f3fb56a19e7a023ee4d819cd', class: { "duet-m-0": this.margin === "none" } }, hAsync("duet-fieldset", { key: '795450ef207fe4bdcb4a20420dab7a31157b9212', "label-heading-level": this.headerHeadingLevel, "label-hidden": this.hideHeader, label: this.label }, hAsync("slot", { key: 'bd126d24ef5606b3679f71efd8050269ec03df54', name: "header" }), !this.files.size && (hAsync("duet-empty-state", { key: '3792437017508549add030634c569b1244900b7d', id: this.labelId, part: this.identifier ? `${this.identifier}-empty-state` : "duet-upload-empty-state", icon: "messaging-attachment" }, hAsync("duet-paragraph", { key: '3ea6db36be8d73603e76f60edace6861cbd5744c', margin: "none" }, this.fileListEmpty))), !!this.files.size && hAsync("slot", { key: '53028d4e767022b6f6b3febf0d5df6e7d32a00a9', name: "fileheader" }), !!this.files.size && (hAsync("duet-upload-aria-status", { key: 'e3ac3ea0554fef9c565d5b4c1836c6a8d065f38a', invalid: this.getFilesAsArray().invalid.length, valid: this.getFilesAsArray().valid.length, inprogress: this.filesInProgress.size, total: this.files.size, statusMessageLabel: this.internalStatusMessageLabel })), !!this.files.size && this.renderUploadedItems(), !!this.files.size && hAsync("slot", { key: 'cb5adc8146b9e74da3605a0d14a8804f82596a4e', name: "filefooter" }), hAsync("slot", { key: '7abf37dd8db76b7c9f4d8912903f5dbe5b12ec3e', name: "uploadfooter" }), this.captionOnBottom && (hAsync("duet-caption", { key: '57a1b68a1fd251dc605854edd693adf797ca49ea', margin: "none", size: "small" }, hAsync("div", { key: '284d2854de5ab0e07c1745ba505964506644a162', class: "upload-bottom-caption" }, caption))), hAsync("slot", { key: 'f61599602e2867e2d4d99f2d651f5a59f6a1b69d', name: "afterfooter" }), !this.hideButton && (hAsync(Fragment, { key: '4aa652f38046eba11567fcaab4afb284b7663d0c' }, hAsync("duet-spacer", { key: '61b878fca646add83750e7f5443e83641404c73a', size: "large" }), hAsync("duet-button", { key: '51dd54c0c592bcc16ad74e30cbce94b4410c152d', id: this.buttonId, onClick: this.startUpload, "accessible-controls": identifier, disabled: this.fileMaxReached, "accessible-label": this.accessibleButtonLabel || `${this.buttonLabel}. ${caption}`, "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))), (this.fileMaxReached ||
|
|
30193
30478
|
this.bytesMaxReached ||
|
|
30194
30479
|
this.filesToUploadExceedsLimit ||
|
|
30195
|
-
this.filesToUploadTotalSizeIsAboveMax) && (hAsync(Fragment, { key: '
|
|
30480
|
+
this.filesToUploadTotalSizeIsAboveMax) && (hAsync(Fragment, { key: 'bc998642add4334e430abac07ab486962e549bce' }, hAsync("duet-spacer", { key: '007476fd81b90e2cbf53c30801159e3b418a02f2', size: "medium" }), hAsync("duet-alert", { key: 'be4c38fd16bbd10e02a084c978b5f18e66e69d4b', part: this.identifier ? `${this.identifier}-error-notification` : "duet-upload-error-notification" }, this.fileMaxReached && getI18nError("duet-upload-301", this.errorCodes), this.bytesMaxReached && getI18nError("duet-upload-202", this.errorCodes), this.filesToUploadExceedsLimit && getI18nError("duet-upload-302", this.errorCodes), this.filesToUploadTotalSizeIsAboveMax && getI18nError("duet-upload-203", this.errorCodes)))), hAsync("duet-visually-hidden", { key: '479c3dbc81d4d0105339b0139884681b519e9350', "aria-hidden": "true" }, hAsync("input", { key: 'f48b8a20c1cf9f97251fa02eaba68731f18ec909', ref: input => {
|
|
30196
30481
|
this.nativeInput = input;
|
|
30197
30482
|
}, accept: !this.limitSelection ? undefined : `${this.allowedMimetypes},${this.allowedExtensions}`, onBlur: this.onBlur, onFocus: this.onFocus, onChange: e => this.onChange(e), type: "file", class: {
|
|
30198
30483
|
"duet-upload": true,
|
|
@@ -30534,7 +30819,7 @@ class DuetUploadAriaStatus {
|
|
|
30534
30819
|
* Always the last one in the class.
|
|
30535
30820
|
*/
|
|
30536
30821
|
render() {
|
|
30537
|
-
return (hAsync(Host, { key: '
|
|
30822
|
+
return (hAsync(Host, { key: '4fca4f32ff28bded94b942cc2b8f148e0d95fd29', role: "status", "aria-live": "assertive", "aria-atomic": "true", "aria-relevant": "all" }, hAsync("duet-visually-hidden", { key: '5af42f3e8747936597131b1bcca491dfd3e244bb' }, this.statusMessage)));
|
|
30538
30823
|
}
|
|
30539
30824
|
get element() { return getElement(this); }
|
|
30540
30825
|
static get watchers() { return {
|
|
@@ -30714,9 +30999,9 @@ class DuetUploadItem {
|
|
|
30714
30999
|
const { uid, meta, item } = this.data;
|
|
30715
31000
|
const Badges = meta && meta.badges ? (hAsync("span", null, meta.badges.map(badgeText => (hAsync("duet-badge", { color: "primary" }, badgeText))))) : undefined;
|
|
30716
31001
|
const actionDescription = `${meta && meta.badges ? meta.badges.join(",") : ""} ${item.name}`;
|
|
30717
|
-
return (hAsync("div", { key: '
|
|
31002
|
+
return (hAsync("div", { key: 'c2b1fa02e7a76fcbdd4007dffed433137c10e7fe', class: {
|
|
30718
31003
|
"upload-item-row": true,
|
|
30719
|
-
} }, this.showCategory && (hAsync("div", { key: '
|
|
31004
|
+
} }, this.showCategory && (hAsync("div", { key: '5dcff0e0c23116550d6a6f45329bf4d4a0e2fa8f', class: "item-categories" }, hAsync("duet-heading", { key: '1f2ead94635bc38a7d2aadb863d8f98d63cb1afc', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.categoryLabel)), Badges)), hAsync("div", { key: 'e018839c73a7e879b643560f026c9a0a7ceb8181', class: { "item-name": true, "no-category": !this.showCategory } }, !!this.label && (hAsync("duet-heading", { key: '128801bc7d77a9b0f8e6d116306d9cd0c4ec8a6c', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.label))), this.getFileNameLine()), hAsync("div", { key: '18a62c6ba81fc952b6aa0b397e6287460abb2b39', class: "item-actions" }, this.actions.map(actionItem => {
|
|
30720
31005
|
return (hAsync("duet-action-button", { actionMeta: Object.assign({}, meta || {}), actionId: uid || null, actionName: actionItem.name, theme: this.theme, iconName: actionItem.icon, iconColor: actionItem.color, iconSize: actionItem.size, background: actionItem.background, "accessible-label": `${actionDescription} ${getLocaleString(actionItem.label)} `, accessibleTitle: this.getActionButtonTitle(actionItem), ref: button => (this.actionButton = button) }));
|
|
30721
31006
|
}))));
|
|
30722
31007
|
}
|
|
@@ -30756,7 +31041,7 @@ class DuetVisuallyHidden {
|
|
|
30756
31041
|
* Always the last one in the class.
|
|
30757
31042
|
*/
|
|
30758
31043
|
render() {
|
|
30759
|
-
return (hAsync(Host, { key: '
|
|
31044
|
+
return (hAsync(Host, { key: '3b08520661ce7817a247cdc1574d2e17934a7e17', class: "duet-visually-hidden" }, hAsync("slot", { key: 'fb9e14e593da0a47c7946ed385c3cbd711dc2ce7' })));
|
|
30760
31045
|
}
|
|
30761
31046
|
get element() { return getElement(this); }
|
|
30762
31047
|
static get style() { return duetVisuallyHiddenCss; }
|
|
@@ -30861,6 +31146,7 @@ registerComponents([
|
|
|
30861
31146
|
DuetTab,
|
|
30862
31147
|
DuetTabGroup,
|
|
30863
31148
|
DuetTable,
|
|
31149
|
+
DuetTeaser,
|
|
30864
31150
|
DuetTextarea,
|
|
30865
31151
|
DuetToggle,
|
|
30866
31152
|
DuetToolbar,
|