@duetds/components 8.5.5 → 8.6.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 +289 -113
- package/lib/cjs/duet-alert.cjs.entry.js +1 -1
- package/lib/cjs/duet-banner.cjs.entry.js +1 -1
- package/lib/cjs/duet-callout.cjs.entry.js +1 -1
- package/lib/cjs/duet-chip.cjs.entry.js +9 -2
- package/lib/cjs/duet-choice_2.cjs.entry.js +1 -1
- package/lib/cjs/duet-collapsible.cjs.entry.js +1 -1
- package/lib/cjs/duet-combobox.cjs.entry.js +260 -127
- package/lib/cjs/duet-date-picker.cjs.entry.js +1 -1
- package/lib/cjs/duet-fieldset.cjs.entry.js +1 -1
- package/lib/cjs/duet-hero.cjs.entry.js +1 -1
- package/lib/cjs/duet-input_2.cjs.entry.js +39 -3
- package/lib/cjs/duet-modal.cjs.entry.js +1 -1
- package/lib/cjs/duet-multiselect.cjs.entry.js +1 -1
- package/lib/cjs/duet-number-input.cjs.entry.js +1 -1
- package/lib/cjs/duet-promo-card.cjs.entry.js +1 -1
- package/lib/cjs/duet-radio_2.cjs.entry.js +1 -1
- package/lib/cjs/duet-scrollable_3.cjs.entry.js +1 -1
- package/lib/cjs/duet-select.cjs.entry.js +1 -1
- package/lib/cjs/duet-slideout-panel.cjs.entry.js +1 -1
- package/lib/cjs/duet-slideout.cjs.entry.js +1 -1
- package/lib/cjs/duet-textarea.cjs.entry.js +1 -1
- package/lib/cjs/duet.cjs.js +1 -1
- package/lib/cjs/loader.cjs.js +1 -1
- package/lib/cjs/{slot-utils-f5073417.js → slot-utils-03a40c78.js} +3 -1
- package/lib/collection/components/duet-chip/duet-chip.css +7 -0
- package/lib/collection/components/duet-chip/duet-chip.js +29 -2
- package/lib/collection/components/duet-combobox/duet-combobox-select-single.js +2 -2
- package/lib/collection/components/duet-combobox/duet-combobox.css +10 -2
- package/lib/collection/components/duet-combobox/duet-combobox.e2e.js +81 -51
- package/lib/collection/components/duet-combobox/duet-combobox.js +321 -142
- package/lib/collection/components/duet-input/duet-input.css +29 -0
- package/lib/collection/components/duet-input/duet-input.js +159 -3
- package/lib/collection/utils/slot-utils.js +3 -1
- package/lib/dist-custom-elements/duet-action-button.js +1 -1
- package/lib/dist-custom-elements/duet-alert.js +1 -1
- package/lib/dist-custom-elements/duet-banner.js +1 -1
- package/lib/dist-custom-elements/duet-breadcrumb.js +1 -1
- package/lib/dist-custom-elements/duet-callout.js +1 -1
- package/lib/dist-custom-elements/duet-card.js +1 -1
- package/lib/dist-custom-elements/duet-chip.js +1 -273
- package/lib/dist-custom-elements/duet-choice-group.js +5 -5
- package/lib/dist-custom-elements/duet-choice.js +2 -2
- package/lib/dist-custom-elements/duet-collapsible.js +2 -2
- package/lib/dist-custom-elements/duet-combobox.js +326 -132
- package/lib/dist-custom-elements/duet-cookie-consent.js +1 -1
- package/lib/dist-custom-elements/duet-date-picker.js +6 -6
- package/lib/dist-custom-elements/duet-editable-table.js +2 -2
- package/lib/dist-custom-elements/duet-fieldset.js +1 -1
- package/lib/dist-custom-elements/duet-footer.js +1 -1
- package/lib/dist-custom-elements/duet-header.js +1 -1
- package/lib/dist-custom-elements/duet-hero.js +1 -1
- package/lib/dist-custom-elements/duet-input.js +1 -1
- package/lib/dist-custom-elements/duet-menu-bar-dropdown-link.js +1 -1
- package/lib/dist-custom-elements/duet-menu-bar-dropdown.js +1 -1
- package/lib/dist-custom-elements/duet-modal.js +2 -2
- package/lib/dist-custom-elements/duet-multiselect.js +5 -5
- package/lib/dist-custom-elements/duet-notification-drawer.js +1 -1
- package/lib/dist-custom-elements/duet-notification.js +1 -1
- package/lib/dist-custom-elements/duet-number-input.js +6 -6
- package/lib/dist-custom-elements/duet-pagination.js +6 -6
- package/lib/dist-custom-elements/duet-popup-menu.js +1 -1
- package/lib/dist-custom-elements/duet-promo-card.js +1 -1
- package/lib/dist-custom-elements/duet-radio-group.js +5 -5
- package/lib/dist-custom-elements/duet-range-slider.js +1 -1
- package/lib/dist-custom-elements/duet-range-stepper.js +2 -2
- package/lib/dist-custom-elements/duet-scrollable.js +1 -1
- package/lib/dist-custom-elements/duet-select.js +1 -1
- package/lib/dist-custom-elements/duet-show-more.js +1 -1
- package/lib/dist-custom-elements/duet-slideout-panel.js +1 -1
- package/lib/dist-custom-elements/duet-slideout.js +2 -2
- package/lib/dist-custom-elements/duet-step.js +1 -1
- package/lib/dist-custom-elements/duet-submenu-bar-dropdown-link.js +1 -1
- package/lib/dist-custom-elements/duet-submenu-bar-dropdown.js +1 -1
- package/lib/dist-custom-elements/duet-submenu-bar-item.js +1 -1
- package/lib/dist-custom-elements/duet-submenu-bar-link.js +1 -1
- package/lib/dist-custom-elements/duet-tab-group.js +6 -6
- package/lib/dist-custom-elements/duet-tab.js +1 -1
- package/lib/dist-custom-elements/duet-textarea.js +4 -4
- package/lib/dist-custom-elements/duet-toggle.js +1 -1
- package/lib/dist-custom-elements/duet-toolbar-dropdown-link.js +1 -1
- package/lib/dist-custom-elements/duet-toolbar-dropdown.js +1 -1
- package/lib/dist-custom-elements/duet-tooltip-button.js +1 -1
- package/lib/dist-custom-elements/duet-tooltip-popup.js +1 -1
- package/lib/dist-custom-elements/duet-tooltip.js +1 -1
- package/lib/dist-custom-elements/duet-tray.js +1 -1
- package/lib/dist-custom-elements/duet-upload-item.js +1 -1
- package/lib/dist-custom-elements/duet-upload.js +5 -5
- package/lib/dist-custom-elements/{p-cff358b0.js → p-014c1177.js} +49 -8
- package/lib/dist-custom-elements/{p-c3d02eb2.js → p-03152b20.js} +1 -1
- package/lib/dist-custom-elements/{p-d87f6dd5.js → p-06e608ae.js} +3 -1
- package/lib/dist-custom-elements/{p-9cdbc360.js → p-0cee8a12.js} +1 -1
- package/lib/dist-custom-elements/{p-12a0876b.js → p-24693e9a.js} +1 -1
- package/lib/dist-custom-elements/{p-9a833e56.js → p-28ec3461.js} +1 -1
- package/lib/dist-custom-elements/{p-d191ba9e.js → p-45fd4d84.js} +1 -1
- package/lib/dist-custom-elements/{p-89d58b60.js → p-6d366100.js} +3 -3
- package/lib/dist-custom-elements/p-755dd68f.js +285 -0
- package/lib/dist-custom-elements/{p-e44c0eff.js → p-785686e3.js} +1 -1
- package/lib/dist-custom-elements/{p-e00d43f3.js → p-92a16064.js} +1 -1
- package/lib/dist-custom-elements/{p-f9f9e33d.js → p-a02e62f3.js} +3 -3
- package/lib/dist-custom-elements/{p-0d5c0a22.js → p-c8415e2f.js} +1 -1
- package/lib/dist-custom-elements/{p-d848b48d.js → p-e702eb52.js} +4 -4
- package/lib/duet/duet.esm.js +1 -1
- package/lib/duet/{p-88a46585.system.entry.js → p-061f4be0.system.entry.js} +1 -1
- package/lib/duet/p-06e608ae.js +4 -0
- package/lib/duet/{p-8ca813cb.system.entry.js → p-0778ccde.system.entry.js} +1 -1
- package/lib/duet/p-07ac7f3e.system.entry.js +4 -0
- package/lib/duet/p-15e24bf0.entry.js +4 -0
- package/lib/duet/{p-0dac34a4.system.entry.js → p-1ef0e5ca.system.entry.js} +1 -1
- package/lib/duet/{p-c9781f22.entry.js → p-2084a65f.entry.js} +1 -1
- package/lib/duet/{p-fd0bb0bf.entry.js → p-23cecf9f.entry.js} +1 -1
- package/lib/duet/{p-09e4195f.system.entry.js → p-257800b7.system.entry.js} +1 -1
- package/lib/duet/{p-1afd901a.entry.js → p-29491f9f.entry.js} +1 -1
- package/lib/duet/{p-3b5ff822.entry.js → p-3302d75d.entry.js} +1 -1
- package/lib/duet/{p-7629cd0a.entry.js → p-40375e30.entry.js} +1 -1
- package/lib/duet/{p-ba4445cf.system.entry.js → p-45bb3cd0.system.entry.js} +1 -1
- package/lib/duet/p-4781cd58.entry.js +4 -0
- package/lib/duet/p-4cb5943c.entry.js +4 -0
- package/lib/duet/{p-b2f2992f.system.entry.js → p-4de910bd.system.entry.js} +1 -1
- package/lib/duet/p-6151635f.system.js +1 -1
- package/lib/duet/{p-d349dd93.entry.js → p-67382632.entry.js} +1 -1
- package/lib/duet/{p-699a98b4.entry.js → p-76e54ff5.entry.js} +1 -1
- package/lib/duet/{p-4d2ef0e2.entry.js → p-7a161455.entry.js} +1 -1
- package/lib/duet/{p-3d38079c.entry.js → p-7ca15c93.entry.js} +1 -1
- package/lib/duet/{p-bb09fff0.system.entry.js → p-7de614df.system.entry.js} +1 -1
- package/lib/duet/{p-480f37b6.entry.js → p-83238fe7.entry.js} +1 -1
- package/lib/duet/{p-7c1db591.system.entry.js → p-8a4ba903.system.entry.js} +1 -1
- package/lib/duet/{p-4f32a7ee.entry.js → p-8ba91848.entry.js} +1 -1
- package/lib/duet/{p-708359ec.system.entry.js → p-999fff8d.system.entry.js} +1 -1
- package/lib/duet/{p-9d91a1dd.system.entry.js → p-9e75e5d8.system.entry.js} +1 -1
- package/lib/duet/{p-343d037e.entry.js → p-a3afb1af.entry.js} +1 -1
- package/lib/duet/{p-2ca6a8a0.system.entry.js → p-a3e90064.system.entry.js} +1 -1
- package/lib/duet/{p-892a5644.system.entry.js → p-aba91113.system.entry.js} +1 -1
- package/lib/duet/p-ae21ad57.system.js +4 -0
- package/lib/duet/{p-ce05fe6d.system.entry.js → p-b2fc4b72.system.entry.js} +1 -1
- package/lib/duet/{p-84778369.entry.js → p-b5595969.entry.js} +1 -1
- package/lib/duet/{p-bf51f8a5.system.entry.js → p-c68602c9.system.entry.js} +1 -1
- package/lib/duet/{p-f6530332.system.entry.js → p-d5721f0d.system.entry.js} +1 -1
- package/lib/duet/{p-c00fe4ed.entry.js → p-dc133655.entry.js} +1 -1
- package/lib/duet/p-de5054b6.system.entry.js +4 -0
- package/lib/duet/{p-61feb701.entry.js → p-df345202.entry.js} +1 -1
- package/lib/duet/{p-2628a322.entry.js → p-e0907f29.entry.js} +1 -1
- package/lib/duet/p-e333b9fc.system.entry.js +4 -0
- package/lib/duet/p-e411627f.entry.js +4 -0
- package/lib/duet/{p-da51c71f.system.entry.js → p-eafed149.system.entry.js} +1 -1
- package/lib/duet/p-f2279e1e.entry.js +4 -0
- package/lib/duet/{p-b1ab1664.system.entry.js → p-fa311641.system.entry.js} +1 -1
- package/lib/duet/{p-320318de.system.entry.js → p-fa72c79b.system.entry.js} +1 -1
- package/lib/esm/duet-alert.entry.js +1 -1
- package/lib/esm/duet-banner.entry.js +1 -1
- package/lib/esm/duet-callout.entry.js +1 -1
- package/lib/esm/duet-chip.entry.js +9 -2
- package/lib/esm/duet-choice_2.entry.js +1 -1
- package/lib/esm/duet-collapsible.entry.js +1 -1
- package/lib/esm/duet-combobox.entry.js +261 -128
- package/lib/esm/duet-date-picker.entry.js +1 -1
- package/lib/esm/duet-fieldset.entry.js +1 -1
- package/lib/esm/duet-hero.entry.js +1 -1
- package/lib/esm/duet-input_2.entry.js +39 -3
- package/lib/esm/duet-modal.entry.js +1 -1
- package/lib/esm/duet-multiselect.entry.js +1 -1
- package/lib/esm/duet-number-input.entry.js +1 -1
- package/lib/esm/duet-promo-card.entry.js +1 -1
- package/lib/esm/duet-radio_2.entry.js +1 -1
- package/lib/esm/duet-scrollable_3.entry.js +1 -1
- package/lib/esm/duet-select.entry.js +1 -1
- package/lib/esm/duet-slideout-panel.entry.js +1 -1
- package/lib/esm/duet-slideout.entry.js +1 -1
- package/lib/esm/duet-textarea.entry.js +1 -1
- package/lib/esm/duet.js +1 -1
- package/lib/esm/loader.js +1 -1
- package/lib/esm/{slot-utils-1115a819.js → slot-utils-b50aaef5.js} +3 -1
- package/lib/esm-es5/duet-alert.entry.js +1 -1
- package/lib/esm-es5/duet-banner.entry.js +1 -1
- package/lib/esm-es5/duet-callout.entry.js +1 -1
- package/lib/esm-es5/duet-chip.entry.js +1 -1
- package/lib/esm-es5/duet-choice_2.entry.js +1 -1
- package/lib/esm-es5/duet-collapsible.entry.js +1 -1
- package/lib/esm-es5/duet-combobox.entry.js +2 -2
- package/lib/esm-es5/duet-date-picker.entry.js +1 -1
- package/lib/esm-es5/duet-fieldset.entry.js +1 -1
- package/lib/esm-es5/duet-hero.entry.js +1 -1
- package/lib/esm-es5/duet-input_2.entry.js +2 -2
- package/lib/esm-es5/duet-modal.entry.js +1 -1
- package/lib/esm-es5/duet-multiselect.entry.js +1 -1
- package/lib/esm-es5/duet-number-input.entry.js +2 -2
- package/lib/esm-es5/duet-promo-card.entry.js +2 -2
- package/lib/esm-es5/duet-radio_2.entry.js +1 -1
- package/lib/esm-es5/duet-scrollable_3.entry.js +1 -1
- package/lib/esm-es5/duet-select.entry.js +1 -1
- package/lib/esm-es5/duet-slideout-panel.entry.js +1 -1
- package/lib/esm-es5/duet-slideout.entry.js +1 -1
- package/lib/esm-es5/duet-textarea.entry.js +1 -1
- package/lib/esm-es5/duet.js +1 -1
- package/lib/esm-es5/loader.js +1 -1
- package/lib/esm-es5/slot-utils-b50aaef5.js +4 -0
- package/lib/types/components/duet-chip/duet-chip.d.ts +4 -0
- package/lib/types/components/duet-combobox/duet-combobox.d.ts +49 -35
- package/lib/types/components/duet-input/duet-input.d.ts +30 -0
- package/lib/types/components.d.ts +44 -21
- package/package.json +2 -2
- package/lib/duet/p-7cf03aa8.system.js +0 -4
- package/lib/duet/p-92e1181c.entry.js +0 -4
- package/lib/duet/p-985c0c67.system.entry.js +0 -4
- package/lib/duet/p-9d27bc65.entry.js +0 -4
- package/lib/duet/p-afe29a3e.entry.js +0 -4
- package/lib/duet/p-cc4a8964.entry.js +0 -4
- package/lib/duet/p-d50ad3ed.entry.js +0 -4
- package/lib/duet/p-d87f6dd5.js +0 -4
- package/lib/duet/p-f1b01db9.system.entry.js +0 -4
- package/lib/duet/p-fa21a3b6.system.entry.js +0 -4
- package/lib/esm-es5/slot-utils-1115a819.js +0 -4
|
@@ -0,0 +1,285 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* Built with Duet Design System
|
|
3
|
+
*/
|
|
4
|
+
import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-e98f9bb0.js';
|
|
5
|
+
import { i as inheritGlobalTheme } from './p-a58bd561.js';
|
|
6
|
+
import { c as createID } from './p-5e59e970.js';
|
|
7
|
+
import { s as subscribeTabbingChange, u as unsubscribeTabbingChange } from './p-785686e3.js';
|
|
8
|
+
import { d as defineCustomElement$1 } from './p-667579b0.js';
|
|
9
|
+
|
|
10
|
+
const duetChipCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:8px !important;margin-bottom:12px !important;position:relative;display:inline-block;width:auto;max-width:100%;vertical-align:bottom;-webkit-tap-highlight-color:transparent}:host:last-child,:host:last-of-type{margin-right:0 !important}:host(.input){margin-top:6px !important;margin-right:0 !important;margin-bottom:6px !important;margin-left:4px !important}.duet-chip-container{-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:block;width:100%;padding:1px;hyphens:none;line-height:1.1;color:rgb(0, 41, 77) !important;text-align:center;cursor:pointer;background:rgb(255, 255, 255);border-color:rgb(207, 210, 212);border-style:solid;border-width:1px;border-radius:8px;transition:background-color 300ms ease, color 300ms ease, border-color 300ms ease}.duet-chip-container.duet-p-0{padding:0 !important}.duet-chip-container.duet-m-0{margin:0 !important}.duet-chip-container.duet-theme-turva{color:rgb(23, 28, 58) !important;background:rgb(255, 255, 255);border-color:rgb(207, 207, 209)}.duet-chip-container.duet-theme-turva:hover{border-color:rgb(198, 12, 48)}.duet-chip-container:hover{padding:0 !important;border-color:rgb(0, 119, 179);border-width:2px}.duet-chip-container.duet-chip-disabled{color:rgb(101, 119, 135) !important;cursor:default;background:rgb(245, 248, 250) !important;border-color:rgb(245, 248, 250) !important}.duet-chip-container.duet-chip-disabled.duet-theme-turva{color:rgb(116, 116, 117) !important;background:rgb(245, 245, 247);border-color:rgb(245, 245, 247)}.duet-chip-container.duet-chip-disabled:hover{background:rgb(245, 248, 250);border-color:rgb(245, 248, 250)}.duet-chip-container.duet-chip-disabled:hover.duet-theme-turva{background:rgb(245, 245, 247);border-color:rgb(245, 245, 247)}.duet-chip-container.duet-chip-disabled button,.duet-chip-container.duet-chip-disabled label{cursor:default}.duet-chip-container button,.duet-chip-container label{display:flex;align-items:center;width:100%;height:100%;padding:8px 14px;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:600;line-height:1rem;color:rgb(0, 41, 77) !important;cursor:pointer}.duet-chip-container button:focus,.duet-chip-container label:focus{outline:none}.duet-chip-container .duet-chip-icon-container{display:flex;align-items:center;height:16px;padding:0;transition:padding 300ms ease}.duet-chip-container.duet-chip-has-icon .duet-chip-icon-container{width:24px;height:16px;padding-right:10px}.duet-chip-container.duet-chip-has-icon.duet-chip-filter-checked .duet-chip-icon-container,.duet-chip-container.duet-chip-has-icon.duet-chip-radio-checked .duet-chip-icon-container{padding-right:11px;padding-left:3px}.duet-chip-container.duet-chip-has-icon button,.duet-chip-container.duet-chip-has-icon label{padding-left:10px}.duet-chip-container.duet-chip-has-popup button,.duet-chip-container.duet-chip-has-popup label{padding-right:8px}.duet-chip-container duet-icon:not(.check-mark){width:auto;visibility:visible;transition:width 300ms ease, transform 300ms ease;transform:scaleX(1)}.duet-chip-container duet-icon.check-mark{width:0;overflow:hidden;visibility:hidden;transition:width 300ms ease, transform 300ms ease;transform:scaleX(0)}.duet-chip-container.duet-chip-filter-checked,.duet-chip-container.duet-chip-radio-checked{padding:0 !important;background:rgb(230, 242, 248);border-color:rgb(0, 119, 179);border-width:2px}.duet-chip-container.duet-chip-filter-checked:hover,.duet-chip-container.duet-chip-radio-checked:hover{background:rgb(205, 229, 241)}.duet-chip-container.duet-chip-filter-checked.chip-has-icon button,.duet-chip-container.duet-chip-filter-checked.chip-has-icon label,.duet-chip-container.duet-chip-radio-checked.chip-has-icon button,.duet-chip-container.duet-chip-radio-checked.chip-has-icon label{padding-left:10px}.duet-chip-container.duet-chip-filter-checked .duet-chip-icon-container,.duet-chip-container.duet-chip-radio-checked .duet-chip-icon-container{padding-right:10px}.duet-chip-container.duet-chip-filter-checked .duet-chip-icon-container duet-icon:not(.check-mark),.duet-chip-container.duet-chip-radio-checked .duet-chip-icon-container duet-icon:not(.check-mark){width:0;overflow:hidden;visibility:hidden;transition:width 300ms ease, transform 300ms ease;transform:scaleX(0)}.duet-chip-container.duet-chip-filter-checked .duet-chip-icon-container duet-icon.check-mark,.duet-chip-container.duet-chip-radio-checked .duet-chip-icon-container duet-icon.check-mark{width:auto;visibility:visible;transition:width 300ms ease, transform 300ms ease;transform:scaleX(1)}.duet-chip-container.duet-chip-filter-checked.duet-theme-turva,.duet-chip-container.duet-chip-radio-checked.duet-theme-turva{background:rgb(245, 245, 247);border-color:rgb(198, 12, 48)}.duet-chip-container.duet-chip-filter-checked.duet-theme-turva:hover,.duet-chip-container.duet-chip-radio-checked.duet-theme-turva:hover{background:rgb(228, 228, 230)}.duet-chip-container .duet-chip-popup-disclosure{padding-right:4.5px;padding-left:12.5px}.duet-chip-container .duet-chip-popup-disclosure duet-icon{transition:transform 300ms ease}.duet-chip-container.duet-chip-filter-popup-open{background:rgb(243, 249, 252);border-color:rgb(243, 249, 252)}.duet-chip-container.duet-chip-filter-popup-open.duet-theme-turva{background:rgb(245, 245, 247);border-color:rgb(245, 245, 247)}.duet-chip-container.duet-chip-filter-popup-open .duet-chip-popup-disclosure duet-icon{transform:rotate(180deg)}.duet-chip-container.duet-chip-input{display:flex;align-items:center;padding-right:0 !important}.duet-chip-container.duet-chip-input .duet-chip-input-button{flex-grow:1}.duet-chip-container.duet-chip-input .duet-chip-remove-button{width:26px;padding:8px 16px 8px 0;margin:-8px 0}.duet-chip-container.large button,.duet-chip-container.large label{padding:15px 22px}:host(.user-is-tabbing) .duet-chip-focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing) .duet-chip-focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-chip-container input{position:absolute !important;top:0;left:0;z-index:-1;width:100%;height:100%;cursor:pointer;opacity:0}";
|
|
11
|
+
|
|
12
|
+
const DuetChip = /*@__PURE__*/ proxyCustomElement(class DuetChip extends H {
|
|
13
|
+
constructor() {
|
|
14
|
+
super();
|
|
15
|
+
this.__registerHost();
|
|
16
|
+
this.__attachShadow();
|
|
17
|
+
this.duetChange = createEvent(this, "duetChange", 3);
|
|
18
|
+
this.duetRemove = createEvent(this, "duetRemove", 3);
|
|
19
|
+
this.duetFocus = createEvent(this, "duetFocus", 7);
|
|
20
|
+
this.duetBlur = createEvent(this, "duetBlur", 7);
|
|
21
|
+
/**
|
|
22
|
+
* Own Properties.
|
|
23
|
+
*/
|
|
24
|
+
this.chipId = createID("DuetChip");
|
|
25
|
+
this.enforceNoDisabledSelected = () => {
|
|
26
|
+
if (this.disabled && this.checked) {
|
|
27
|
+
console.error("Duet error: pre-selected chip may not be disabled");
|
|
28
|
+
this.disabled = false;
|
|
29
|
+
}
|
|
30
|
+
};
|
|
31
|
+
this.popupSetUp = () => {
|
|
32
|
+
const popup = document.querySelector(`duet-popup-menu#${this.popup}`);
|
|
33
|
+
if (popup) {
|
|
34
|
+
this.popupElement = popup;
|
|
35
|
+
popup.controller = this.element;
|
|
36
|
+
const originalText = this.element.textContent;
|
|
37
|
+
const originalValue = this.value;
|
|
38
|
+
if (!popup.id) {
|
|
39
|
+
popup.id = "popup-menu";
|
|
40
|
+
}
|
|
41
|
+
popup.addEventListener("duetToggle", (evt) => {
|
|
42
|
+
this.popupOpen = evt.detail.open;
|
|
43
|
+
});
|
|
44
|
+
const clearActive = () => {
|
|
45
|
+
popup.querySelectorAll("duet-popup-menu-item").forEach(item => {
|
|
46
|
+
item.active = false;
|
|
47
|
+
});
|
|
48
|
+
};
|
|
49
|
+
popup.querySelectorAll("duet-popup-menu-item").forEach(item => {
|
|
50
|
+
item.addEventListener("click", evt => {
|
|
51
|
+
var _a;
|
|
52
|
+
const value = (_a = item.value) !== null && _a !== void 0 ? _a : item.innerText;
|
|
53
|
+
if (!item.active) {
|
|
54
|
+
clearActive();
|
|
55
|
+
item.active = true;
|
|
56
|
+
this.element.textContent = item.innerText;
|
|
57
|
+
this.value = value;
|
|
58
|
+
this.checked = true;
|
|
59
|
+
}
|
|
60
|
+
else {
|
|
61
|
+
clearActive();
|
|
62
|
+
this.element.textContent = originalText;
|
|
63
|
+
this.value = originalValue;
|
|
64
|
+
this.checked = false;
|
|
65
|
+
}
|
|
66
|
+
this.emitChange(evt);
|
|
67
|
+
// A workaround to the difference of event handling between the browers.
|
|
68
|
+
// Chrome will emit a separate click event on the chip after the popup is closed, resulting popup.toggle() to
|
|
69
|
+
// open the popup again. Firefox does not have this behavior.
|
|
70
|
+
setTimeout(() => {
|
|
71
|
+
if (this.popupElement.isOpen()) {
|
|
72
|
+
this.popupElement.hide();
|
|
73
|
+
}
|
|
74
|
+
});
|
|
75
|
+
});
|
|
76
|
+
});
|
|
77
|
+
}
|
|
78
|
+
};
|
|
79
|
+
/**
|
|
80
|
+
* Component event handling.
|
|
81
|
+
*/
|
|
82
|
+
this.onFocus = (ev) => {
|
|
83
|
+
this.focus = true;
|
|
84
|
+
this.duetFocus.emit({
|
|
85
|
+
originalEvent: ev,
|
|
86
|
+
checked: this.checked,
|
|
87
|
+
value: this.value,
|
|
88
|
+
component: "duet-chip",
|
|
89
|
+
});
|
|
90
|
+
};
|
|
91
|
+
this.onBlur = (ev) => {
|
|
92
|
+
this.focus = false;
|
|
93
|
+
this.duetBlur.emit({
|
|
94
|
+
originalEvent: ev,
|
|
95
|
+
checked: this.checked,
|
|
96
|
+
value: this.value,
|
|
97
|
+
component: "duet-chip",
|
|
98
|
+
});
|
|
99
|
+
};
|
|
100
|
+
this.emitChange = originalEvent => {
|
|
101
|
+
this.duetChange.emit({
|
|
102
|
+
originalEvent,
|
|
103
|
+
checked: this.checked,
|
|
104
|
+
value: this.value,
|
|
105
|
+
component: "duet-chip",
|
|
106
|
+
});
|
|
107
|
+
};
|
|
108
|
+
/**
|
|
109
|
+
* Change checked state and emit duetChange event.
|
|
110
|
+
*/
|
|
111
|
+
this.onFilterChange = (evt) => {
|
|
112
|
+
this.checked = !this.checked;
|
|
113
|
+
this.emitChange(evt);
|
|
114
|
+
};
|
|
115
|
+
/**
|
|
116
|
+
* Change checked state and emit duetChange event.
|
|
117
|
+
*/
|
|
118
|
+
this.onRadioChange = (evt) => {
|
|
119
|
+
const input = this.focusableElement;
|
|
120
|
+
const inputChecked = input.checked;
|
|
121
|
+
this.checked = inputChecked;
|
|
122
|
+
this.emitChange(evt);
|
|
123
|
+
};
|
|
124
|
+
/**
|
|
125
|
+
* Stop propagation and prevent default if popup is present, as the popup controls value and checked state.
|
|
126
|
+
*/
|
|
127
|
+
this.onFilterClick = (evt) => {
|
|
128
|
+
if (this.disabled) {
|
|
129
|
+
evt.stopPropagation();
|
|
130
|
+
evt.preventDefault();
|
|
131
|
+
return;
|
|
132
|
+
}
|
|
133
|
+
if (this.popupElement) {
|
|
134
|
+
evt.stopPropagation();
|
|
135
|
+
evt.preventDefault();
|
|
136
|
+
this.popupElement.toggle();
|
|
137
|
+
}
|
|
138
|
+
};
|
|
139
|
+
/**
|
|
140
|
+
* Remove input chip
|
|
141
|
+
*/
|
|
142
|
+
this.onRemoveClick = (evt) => {
|
|
143
|
+
evt.stopPropagation();
|
|
144
|
+
evt.preventDefault();
|
|
145
|
+
this.duetRemove.emit({
|
|
146
|
+
originalEvent: evt,
|
|
147
|
+
checked: this.checked,
|
|
148
|
+
value: this.value,
|
|
149
|
+
component: "duet-chip",
|
|
150
|
+
});
|
|
151
|
+
this.element.remove();
|
|
152
|
+
};
|
|
153
|
+
this.focus = false;
|
|
154
|
+
this.popupElement = undefined;
|
|
155
|
+
this.popupOpen = undefined;
|
|
156
|
+
this.accessibleLabel = undefined;
|
|
157
|
+
this.variation = "button";
|
|
158
|
+
this.size = "medium";
|
|
159
|
+
this.popup = undefined;
|
|
160
|
+
this.icon = "";
|
|
161
|
+
this.theme = "";
|
|
162
|
+
this.identifier = undefined;
|
|
163
|
+
this.value = undefined;
|
|
164
|
+
this.name = undefined;
|
|
165
|
+
this.checked = false;
|
|
166
|
+
this.disabled = false;
|
|
167
|
+
this.accessibleExpanded = undefined;
|
|
168
|
+
this.accessiblePopup = "false";
|
|
169
|
+
}
|
|
170
|
+
clearOtherRadioButtons() {
|
|
171
|
+
if (this.variation === "radio" && this.checked) {
|
|
172
|
+
const chips = document.querySelectorAll(`duet-chip[variation="radio"][name="${this.name}"]`);
|
|
173
|
+
chips.forEach(chip => {
|
|
174
|
+
if (chip !== this.element) {
|
|
175
|
+
chip.checked = false;
|
|
176
|
+
}
|
|
177
|
+
});
|
|
178
|
+
}
|
|
179
|
+
}
|
|
180
|
+
/**
|
|
181
|
+
* Component lifecycle events.
|
|
182
|
+
*/
|
|
183
|
+
componentWillLoad() {
|
|
184
|
+
inheritGlobalTheme(this);
|
|
185
|
+
this.popupSetUp();
|
|
186
|
+
this.enforceNoDisabledSelected();
|
|
187
|
+
}
|
|
188
|
+
connectedCallback() {
|
|
189
|
+
subscribeTabbingChange(this);
|
|
190
|
+
}
|
|
191
|
+
disconnectedCallback() {
|
|
192
|
+
unsubscribeTabbingChange(this);
|
|
193
|
+
}
|
|
194
|
+
getAccessibleExpanded() {
|
|
195
|
+
if (this.accessibleExpanded != null) {
|
|
196
|
+
return (!!this.accessibleExpanded).toString();
|
|
197
|
+
}
|
|
198
|
+
if (this.popupElement) {
|
|
199
|
+
return this.popupOpen ? "true" : "false";
|
|
200
|
+
}
|
|
201
|
+
return undefined;
|
|
202
|
+
}
|
|
203
|
+
getAccessiblePopup() {
|
|
204
|
+
if (this.popupElement) {
|
|
205
|
+
return "true";
|
|
206
|
+
}
|
|
207
|
+
else {
|
|
208
|
+
return this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined;
|
|
209
|
+
}
|
|
210
|
+
}
|
|
211
|
+
/**
|
|
212
|
+
* Sets focus. Use this method instead of the global focus().
|
|
213
|
+
*/
|
|
214
|
+
async setFocus(options) {
|
|
215
|
+
setTimeout(() => this.focusableElement.focus(options), 200);
|
|
216
|
+
}
|
|
217
|
+
render() {
|
|
218
|
+
var _a;
|
|
219
|
+
const identifier = this.identifier || this.chipId;
|
|
220
|
+
const classes = {
|
|
221
|
+
"duet-chip-container": true,
|
|
222
|
+
[`duet-chip-${this.variation}`]: true,
|
|
223
|
+
"duet-chip-focus": this.focus,
|
|
224
|
+
"duet-chip-has-icon": !!this.icon,
|
|
225
|
+
"duet-chip-has-popup": this.variation === "filter" && !!this.popupElement,
|
|
226
|
+
"duet-theme-turva": this.theme === "turva",
|
|
227
|
+
"duet-chip-filter-checked": this.variation === "filter" && this.checked,
|
|
228
|
+
"duet-chip-radio-checked": this.variation === "radio" && this.checked,
|
|
229
|
+
"duet-chip-filter-popup-open": this.popupOpen,
|
|
230
|
+
"duet-chip-disabled": this.disabled,
|
|
231
|
+
[this.size]: true,
|
|
232
|
+
};
|
|
233
|
+
const focusHandlers = {
|
|
234
|
+
onFocus: this.onFocus,
|
|
235
|
+
onBlur: this.onBlur,
|
|
236
|
+
ref: el => (this.focusableElement = el),
|
|
237
|
+
};
|
|
238
|
+
return (h(Host, { class: { [this.variation]: true } }, this.variation === "button" && (h("span", { class: classes }, h("button", Object.assign({ id: identifier, "aria-label": this.accessibleLabel, "aria-disabled": this.disabled ? "true" : undefined, name: this.name, value: this.value, onClick: this.disabled ? evt => evt.stopPropagation() : undefined }, focusHandlers), h("span", { class: "duet-chip-icon-container" }, this.icon && (h("duet-icon", { name: this.icon, size: "x-small", margin: "none", color: "currentColor" }))), h("slot", null)))), this.variation === "input" && (h("span", { class: classes }, h("button", Object.assign({ id: identifier, class: "duet-chip-input-button", value: this.value, "aria-label": this.accessibleLabel }, focusHandlers), h("span", { class: "duet-chip-icon-container" }, this.icon && (h("duet-icon", { name: this.icon, size: "x-small", margin: "none", color: "currentColor" }))), h("slot", null)), h("button", { class: "duet-chip-remove-button", onClick: this.onRemoveClick }, h("duet-icon", { name: "activity-close", size: "xx-small", margin: "none", color: "currentColor" })))), this.variation === "filter" && (h("span", { class: classes }, h("input", Object.assign({ "aria-haspopup": this.getAccessiblePopup(), "aria-controls": (_a = this.popupElement) === null || _a === void 0 ? void 0 : _a.id, "aria-expanded": this.getAccessibleExpanded(), "aria-disabled": this.disabled ? "true" : undefined, id: identifier, type: "checkbox", name: this.name, value: this.value, checked: this.checked, onClick: this.onFilterClick, onChange: this.onFilterChange }, focusHandlers)), h("label", { htmlFor: identifier }, this.icon && (h("span", { class: "duet-chip-icon-container" }, h("duet-icon", { name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), h("duet-icon", { name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor", class: "check-mark" }))), h("slot", null), this.popupElement && (h("span", { class: "duet-chip-popup-disclosure" }, h("duet-icon", { name: "action-arrow-down-small", size: "xxx-small", margin: "none", color: "currentColor" })))))), this.variation === "radio" && (h("span", { class: classes }, h("input", Object.assign({ "aria-disabled": this.disabled ? "true" : undefined, id: identifier, type: "radio", name: this.name, value: this.value, checked: this.checked, onChange: this.onRadioChange, onClick: this.disabled ? evt => evt.preventDefault() : undefined }, focusHandlers)), h("label", { htmlFor: identifier }, this.icon && (h("span", { class: "duet-chip-icon-container" }, h("duet-icon", { name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), h("duet-icon", { name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor", class: "check-mark" }))), h("slot", null))))));
|
|
239
|
+
}
|
|
240
|
+
get element() { return this; }
|
|
241
|
+
static get watchers() { return {
|
|
242
|
+
"checked": ["clearOtherRadioButtons"]
|
|
243
|
+
}; }
|
|
244
|
+
static get style() { return duetChipCss; }
|
|
245
|
+
}, [1, "duet-chip", {
|
|
246
|
+
"accessibleLabel": [1, "accessible-label"],
|
|
247
|
+
"variation": [1],
|
|
248
|
+
"size": [1],
|
|
249
|
+
"popup": [1],
|
|
250
|
+
"icon": [1],
|
|
251
|
+
"theme": [1025],
|
|
252
|
+
"identifier": [1],
|
|
253
|
+
"value": [1537],
|
|
254
|
+
"name": [1],
|
|
255
|
+
"checked": [1540],
|
|
256
|
+
"disabled": [4],
|
|
257
|
+
"accessibleExpanded": [1540, "accessible-expanded"],
|
|
258
|
+
"accessiblePopup": [1537, "accessible-popup"],
|
|
259
|
+
"focus": [32],
|
|
260
|
+
"popupElement": [32],
|
|
261
|
+
"popupOpen": [32],
|
|
262
|
+
"setFocus": [64]
|
|
263
|
+
}, undefined, {
|
|
264
|
+
"checked": ["clearOtherRadioButtons"]
|
|
265
|
+
}]);
|
|
266
|
+
function defineCustomElement() {
|
|
267
|
+
if (typeof customElements === "undefined") {
|
|
268
|
+
return;
|
|
269
|
+
}
|
|
270
|
+
const components = ["duet-chip", "duet-icon"];
|
|
271
|
+
components.forEach(tagName => { switch (tagName) {
|
|
272
|
+
case "duet-chip":
|
|
273
|
+
if (!customElements.get(tagName)) {
|
|
274
|
+
customElements.define(tagName, DuetChip);
|
|
275
|
+
}
|
|
276
|
+
break;
|
|
277
|
+
case "duet-icon":
|
|
278
|
+
if (!customElements.get(tagName)) {
|
|
279
|
+
defineCustomElement$1();
|
|
280
|
+
}
|
|
281
|
+
break;
|
|
282
|
+
} });
|
|
283
|
+
}
|
|
284
|
+
|
|
285
|
+
export { DuetChip as D, defineCustomElement as d };
|
|
@@ -52,4 +52,4 @@ const unsubscribeTabbingChange = component => {
|
|
|
52
52
|
tabbingChangeSubscribers.delete(component);
|
|
53
53
|
};
|
|
54
54
|
|
|
55
|
-
export { isQuestionKey as a, isEscapeKey as b, isEnterKey as c, isTabKey as d,
|
|
55
|
+
export { isQuestionKey as a, isEscapeKey as b, isEnterKey as c, isTabKey as d, isBackspaceKey as e, isArrowUpKey as f, isArrowDownKey as g, isSpaceKey as h, isKeyboardClick as i, isArrowLeftKey as j, isArrowRightKey as k, isArrowKey as l, isNumber as m, isMinusKey as n, isPlusKey as o, isShiftTabKey as p, subscribeTabbingChange as s, unsubscribeTabbingChange as u };
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-e98f9bb0.js';
|
|
5
5
|
import { i as inheritGlobalTheme } from './p-a58bd561.js';
|
|
6
6
|
import { c as createID } from './p-5e59e970.js';
|
|
7
|
-
import { i as isKeyboardClick } from './p-
|
|
7
|
+
import { i as isKeyboardClick } from './p-785686e3.js';
|
|
8
8
|
import { a as getLanguage, g as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './p-2e36d5bf.js';
|
|
9
9
|
import { d as defineCustomElement$4 } from './p-83231ea8.js';
|
|
10
10
|
import { d as defineCustomElement$3 } from './p-667579b0.js';
|
|
@@ -6,11 +6,11 @@ import { m as media_query_medium, a as media_query_large } from './p-f9a8d356.js
|
|
|
6
6
|
import { c as computePosition, a as autoUpdate, f as flip, s as shift, b as arrow } from './p-31ed51c3.js';
|
|
7
7
|
import { i as inheritGlobalTheme } from './p-a58bd561.js';
|
|
8
8
|
import { c as createID } from './p-5e59e970.js';
|
|
9
|
-
import { b as isEscapeKey } from './p-
|
|
9
|
+
import { b as isEscapeKey } from './p-785686e3.js';
|
|
10
10
|
import { a as getLanguage, g as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './p-2e36d5bf.js';
|
|
11
11
|
import { d as defineCustomElement$4 } from './p-667579b0.js';
|
|
12
|
-
import { d as defineCustomElement$3 } from './p-
|
|
13
|
-
import { d as defineCustomElement$2 } from './p-
|
|
12
|
+
import { d as defineCustomElement$3 } from './p-c8415e2f.js';
|
|
13
|
+
import { d as defineCustomElement$2 } from './p-0cee8a12.js';
|
|
14
14
|
import { d as defineCustomElement$1 } from './p-d1815d2a.js';
|
|
15
15
|
|
|
16
16
|
const duetTooltipCss = "*.sc-duet-tooltip,*.sc-duet-tooltip::after,*.sc-duet-tooltip::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-tooltip-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;z-index:200;display:inline-flex;width:auto;margin-top:-16px !important;margin-left:-3px !important;-webkit-tap-highlight-color:transparent}duet-tooltip-button.sc-duet-tooltip{position:relative}duet-tooltip-popup.sc-duet-tooltip{position:absolute}";
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
*/
|
|
4
4
|
import { p as proxyCustomElement, H, h, d as Host } from './p-e98f9bb0.js';
|
|
5
5
|
import { i as inheritGlobalTheme } from './p-a58bd561.js';
|
|
6
|
-
import { s as subscribeTabbingChange, u as unsubscribeTabbingChange } from './p-
|
|
6
|
+
import { s as subscribeTabbingChange, u as unsubscribeTabbingChange } from './p-785686e3.js';
|
|
7
7
|
import { d as defineCustomElement$1 } from './p-d1815d2a.js';
|
|
8
8
|
|
|
9
9
|
const duetTooltipButtonCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.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.duet-theme-turva{color:rgb(198, 12, 48)}.duet-tooltip-button:hover{color:rgb(0, 77, 128)}.duet-tooltip-button:hover.duet-theme-turva{color:rgb(148, 9, 37)}.duet-tooltip-button:focus{background:transparent !important;outline:0}:host(.user-is-tabbing) .duet-tooltip-button:focus{background:transparent !important;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3 !important}:host(.user-is-tabbing) .duet-tooltip-button.duet-theme-turva:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a !important}.duet-tooltip-button svg{width:20px;height:20px;pointer-events:none}.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;text-align:left;white-space:normal;vertical-align:top}.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\"}";
|
|
@@ -4,14 +4,14 @@
|
|
|
4
4
|
import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-e98f9bb0.js';
|
|
5
5
|
import { i as inheritGlobalTheme } from './p-a58bd561.js';
|
|
6
6
|
import { c as createID } from './p-5e59e970.js';
|
|
7
|
-
import { c as checkNamedSlotElement } from './p-
|
|
7
|
+
import { c as checkNamedSlotElement } from './p-06e608ae.js';
|
|
8
8
|
import { p as parsePossibleJSON } from './p-0e052642.js';
|
|
9
9
|
import { d as defineCustomElement$7 } from './p-b6322d8d.js';
|
|
10
10
|
import { d as defineCustomElement$6 } from './p-667579b0.js';
|
|
11
11
|
import { d as defineCustomElement$5 } from './p-e3d597b6.js';
|
|
12
|
-
import { d as defineCustomElement$4 } from './p-
|
|
13
|
-
import { d as defineCustomElement$3 } from './p-
|
|
14
|
-
import { d as defineCustomElement$2 } from './p-
|
|
12
|
+
import { d as defineCustomElement$4 } from './p-a02e62f3.js';
|
|
13
|
+
import { d as defineCustomElement$3 } from './p-c8415e2f.js';
|
|
14
|
+
import { d as defineCustomElement$2 } from './p-0cee8a12.js';
|
|
15
15
|
import { d as defineCustomElement$1 } from './p-d1815d2a.js';
|
|
16
16
|
|
|
17
17
|
const duetSelectCss = "*.sc-duet-select,*.sc-duet-select::after,*.sc-duet-select::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-select-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:16px !important;margin-bottom:12px !important;display:inline-flex;width:100%;max-width:100%;vertical-align:bottom}.sc-duet-select-h:last-child,.sc-duet-select-h:last-of-type{margin-right:0 !important}@media (min-width: 36em){.sc-duet-select-h{width:calc(50% - 16px - 3px)}.duet-expand.sc-duet-select-h{width:100% !important}}.duet-select-variation-tiny.sc-duet-select-h,.duet-select-variation-compact.sc-duet-select-h{position:relative;top:-2px;width:72px;margin:0 !important;vertical-align:baseline}.duet-select-variation-compact.sc-duet-select-h{width:auto}.duet-m-0.sc-duet-select-h{margin:0 !important}duet-tooltip.sc-duet-select,.sc-duet-select-s>duet-tooltip{position:absolute;top:12px;right:0}@media (min-width: 48em){duet-tooltip.sc-duet-select,.sc-duet-select-s>duet-tooltip{position:relative;top:4px;right:auto}}.duet-select-placeholder.sc-duet-select{position:absolute;top:-9px;left:9px;z-index:200;display:block;width:auto;max-width:60%;padding:0 0.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:rgb(255, 255, 255)}.duet-select-container.sc-duet-select{position:relative;width:100%}.duet-select-container.duet-select-variation-tiny.sc-duet-select{width:72px}.duet-select-wrapper.sc-duet-select{position:relative;width:100%;padding:15px 14px !important;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;line-height:1.25}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-select-variation-tiny.sc-duet-select .duet-select-wrapper.sc-duet-select{width:81px;padding:0 !important}.duet-select-variation-compact.sc-duet-select .duet-select-wrapper.sc-duet-select{padding:0 !important;line-height:1}.duet-select-wrapper.sc-duet-select select.sc-duet-select{position:absolute;top:0;right:0;bottom:0;left:0;z-index:200;width:100%;height:100%;padding:0;margin:0;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;cursor:pointer;border:0;outline:none;opacity:0}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{border-color:rgb(144, 149, 153);box-shadow:0 0 0 1px #909599}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{border-color:rgb(116, 116, 117);box-shadow:0 0 0 1px #747475}.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{box-shadow:0 0 0 1px #e55039}.duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{border-color:rgb(0, 119, 179);outline:0;box-shadow:0 0 0 1px #0077b3 !important;transition:none}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{border-color:rgb(23, 28, 58);box-shadow:0 0 0 1px #171c3a !important}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:rgb(23, 28, 58)}.duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:rgb(0, 119, 179)}.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{box-shadow:0 0 0 1px #e55039}.duet-select-wrapper.sc-duet-select select[disabled].sc-duet-select{cursor:default !important}.duet-select-wrapper.sc-duet-select select[disabled].sc-duet-select+.duet-select.sc-duet-select{color:rgb(0, 41, 77) !important;cursor:default !important;background:rgb(245, 248, 250) !important;border-color:rgb(245, 248, 250) !important;box-shadow:none !important;opacity:1 !important;-webkit-text-fill-color:rgb(0, 41, 77) !important}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select[disabled].sc-duet-select+.duet-select.sc-duet-select{color:rgb(23, 28, 58) !important;background:rgb(245, 245, 247) !important;border-color:rgb(245, 245, 247) !important;-webkit-text-fill-color:rgb(23, 28, 58) !important}.duet-select-wrapper.sc-duet-select span.duet-keep-container-height.sc-duet-select{opacity:0}.duet-select-variation-compact.sc-duet-select .duet-select-wrapper.sc-duet-select span.duet-keep-container-height.sc-duet-select{display:none}.duet-select.sc-duet-select{position:absolute;top:0;right:0;bottom:0;left:0;z-index:100;display:block;width:100%;min-width:8rem;padding:12px 14px !important;padding-right:48px !important;overflow:hidden;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;font-variant-numeric:tabular-nums;line-height:1.5;color:rgb(0, 41, 77);text-align:left;text-overflow:ellipsis;white-space:nowrap;background:rgb(255, 255, 255);border:1px solid rgb(144, 149, 153);border-radius:4px;transition:150ms ease}.has-error.sc-duet-select .duet-select.sc-duet-select{border-color:rgb(222, 35, 98) !important}.has-error.sc-duet-select .duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:rgb(222, 35, 98) !important}.duet-theme-turva.has-error.sc-duet-select .duet-select.sc-duet-select{border-color:rgb(224, 42, 13) !important}.duet-theme-turva.has-error.sc-duet-select .duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:rgb(224, 42, 13) !important}.duet-theme-turva.sc-duet-select .duet-select.sc-duet-select{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58);border-color:rgb(116, 116, 117)}.duet-select.sc-duet-select svg.sc-duet-select{position:absolute;top:50%;right:16px;z-index:200;width:20px;height:20px;color:rgb(0, 41, 77);pointer-events:none;transform:translateY(-50%)}.duet-theme-turva.sc-duet-select .duet-select.sc-duet-select svg.sc-duet-select{color:rgb(23, 28, 58)}.duet-select-variation-tiny.sc-duet-select .duet-select.sc-duet-select,.duet-select-variation-compact.sc-duet-select .duet-select.sc-duet-select{width:72px;min-width:inherit;padding:0 !important;margin-bottom:-4px;overflow:visible;font-weight:600;text-align:center}.duet-select-variation-tiny.sc-duet-select .duet-select.sc-duet-select duet-icon.sc-duet-select,.duet-select-variation-compact.sc-duet-select .duet-select.sc-duet-select duet-icon.sc-duet-select{padding-left:10px}.duet-select-variation-compact.sc-duet-select .duet-select.sc-duet-select{position:relative;width:fit-content;padding:7px 16px !important;font-size:0.875rem;line-height:1.1;text-align:right;border-radius:8px}.duet-select-help.sc-duet-select{display:block;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:0.875rem;font-weight:400;line-height:1.25;color:rgb(101, 119, 135);border-radius:4px}.duet-select-help.sc-duet-select span.sc-duet-select{display:block;margin-top:8px}.duet-theme-turva.sc-duet-select .duet-select-help.sc-duet-select{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(116, 116, 117)}.has-error.sc-duet-select .duet-select-help.sc-duet-select{color:rgb(222, 35, 98)}.duet-theme-turva.has-error.sc-duet-select .duet-select-help.sc-duet-select{color:rgb(224, 42, 13)}.duet-label-hidden.sc-duet-select duet-label.sc-duet-select{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}";
|