@luzmo/lucero 1.0.1-alpha.20 → 1.0.1-alpha.22
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/components/accordion/index.cjs +6 -6
- package/components/accordion/index.js +8 -7
- package/components/action-bar/index.cjs +4 -4
- package/components/action-bar/index.js +10 -8
- package/components/action-button/index.cjs +3 -3
- package/components/action-button/index.js +5 -4
- package/components/action-group/index.cjs +1 -1
- package/components/action-group/index.js +1 -1
- package/components/action-group-D6rV7sfq.cjs +20 -0
- package/components/{action-group-C9dsPJg-.js → action-group-DS7x8jfJ.js} +10 -9
- package/components/action-menu/index.cjs +9 -9
- package/components/action-menu/index.js +9 -9
- package/components/{async-directive-BwIAw5tB.js → async-directive-CDQoI4mS.js} +18 -19
- package/components/async-directive-CddlkYlZ.cjs +22 -0
- package/components/avatar/index.cjs +3 -3
- package/components/avatar/index.js +6 -6
- package/components/base-5nDSSNeT.cjs +18 -0
- package/components/base-CdYjmV_8.js +96 -0
- package/components/button/button-base.d.ts +16 -0
- package/components/button/button.d.ts +37 -1
- package/components/button/index.cjs +2 -2
- package/components/button/index.js +15 -11
- package/components/{button-base-B8bWcklV.js → button-base-BGAqeDTT.js} +21 -6
- package/components/button-base-CShsEDFM.cjs +25 -0
- package/components/button-group/index.cjs +1 -1
- package/components/button-group/index.js +10 -8
- package/components/calendar/index.cjs +96 -1
- package/components/calendar/index.js +538 -6
- package/components/checkbox/index.cjs +4 -4
- package/components/checkbox/index.js +6 -4
- package/components/{checkbox-mixin-BOTvuPEu.js → checkbox-mixin-DUbGDm7f.js} +9 -9
- package/components/{checkbox-mixin-BVPpXtsq.cjs → checkbox-mixin-DhN8CIXY.cjs} +3 -3
- package/components/clear-button-BWJrTbkk.cjs +18 -0
- package/components/{clear-button-DzZ5ulBW.js → clear-button-CMhq1QsA.js} +14 -13
- package/components/{close-button-CuQdsez5.js → close-button-BiJwFZyW.js} +13 -12
- package/components/close-button-DrMdfzPW.cjs +18 -0
- package/components/color-area/index.cjs +5 -5
- package/components/color-area/index.js +10 -9
- package/components/color-controller-7sNUf7SP.js +386 -0
- package/components/color-controller-ChN-A9Ft.cjs +18 -0
- package/components/color-field/index.cjs +2 -2
- package/components/color-field/index.js +4 -3
- package/components/color-handle/index.cjs +2 -2
- package/components/color-handle/index.js +7 -5
- package/components/color-loupe/index.cjs +1 -1
- package/components/color-loupe/index.js +1 -1
- package/components/color-loupe-CIEFp7ln.cjs +56 -0
- package/components/{color-loupe-DmQe3SpP.js → color-loupe-CLPX6xVb.js} +6 -4
- package/components/color-menu/index.cjs +7 -7
- package/components/color-menu/index.js +7 -7
- package/components/color-palette/index.cjs +1 -1
- package/components/color-palette/index.js +4 -3
- package/components/color-palette-group/index.cjs +3 -3
- package/components/color-palette-group/index.js +33 -32
- package/components/color-picker/index.cjs +4 -4
- package/components/color-picker/index.js +11 -11
- package/components/color-slider/index.cjs +40 -1
- package/components/color-slider/index.js +452 -6
- package/components/date-time-picker/index.cjs +16 -16
- package/components/date-time-picker/index.js +103 -104
- package/components/directive-DrvvqO47.cjs +32 -0
- package/components/directive-OK_Jd_xx.js +314 -0
- package/components/divider/index.cjs +1 -1
- package/components/divider/index.js +10 -8
- package/components/field-group/index.cjs +1 -1
- package/components/field-group/index.js +1 -1
- package/components/field-group-BYHNJmv0.cjs +23 -0
- package/components/{field-group-D4B0IOdA.js → field-group-CHmw159R.js} +7 -5
- package/components/field-label/index.cjs +1 -1
- package/components/field-label/index.js +1 -1
- package/components/{field-label-DxmPiC5p.js → field-label-Cy3xMWZ-.js} +9 -8
- package/components/field-label-DZoeqJJX.cjs +25 -0
- package/components/{focusable-C5JjRZmT.js → focusable-BjvsvVam.js} +2 -1
- package/components/focusable-CbVKgGfS.cjs +18 -0
- package/components/icon/index.cjs +1 -1
- package/components/icon/index.js +20 -18
- package/components/index.cjs +1 -1
- package/components/index.js +18 -18
- package/components/infield-button/index.cjs +2 -2
- package/components/infield-button/index.js +4 -3
- package/components/label/index.cjs +1 -1
- package/components/label/index.js +6 -4
- package/components/like-anchor-B2EqJPdw.cjs +32 -0
- package/components/{like-anchor-DCFJN0LV.js → like-anchor-CgqCU210.js} +23 -22
- package/components/{manage-help-text-DNqdEkTA.cjs → manage-help-text-Bat9yGvF.cjs} +3 -3
- package/components/{manage-help-text-CHfMLzSa.js → manage-help-text-C9sCHK3R.js} +8 -8
- package/components/menu/index.cjs +16 -16
- package/components/menu/index.js +15 -16
- package/components/multi-language-field/index.cjs +2 -2
- package/components/multi-language-field/index.js +8 -6
- package/components/number-field/index.cjs +6 -6
- package/components/number-field/index.js +34 -35
- package/components/observe-slot-text-ByPG1Lqw.cjs +18 -0
- package/components/{observe-slot-text-C3moTjwy.js → observe-slot-text-CugmOzNZ.js} +20 -21
- package/components/options/index.cjs +27 -55
- package/components/options/index.js +210 -800
- package/components/overlay/index.cjs +6 -6
- package/components/overlay/index.js +9 -9
- package/components/overlay-DpWon1Rp.js +1736 -0
- package/components/overlay-nUwFClQq.cjs +47 -0
- package/components/{pending-state-bJr-nEJl.cjs → pending-state-DQctFHI8.cjs} +2 -2
- package/components/{pending-state-B2wWssTo.js → pending-state-Dx1u3EXA.js} +2 -2
- package/components/picker/index.cjs +1 -1
- package/components/picker/index.js +2 -2
- package/components/{picker-BsQJBF9j.js → picker-Cm6_didQ.js} +19 -20
- package/components/picker-DxYgh4LR.cjs +123 -0
- package/components/picker-button/index.cjs +4 -4
- package/components/picker-button/index.js +6 -5
- package/components/{platform-BiXhwqk3.cjs → platform-BJnOJJag.cjs} +1 -1
- package/components/{platform-BM-uMWpX.js → platform-CqwNrovd.js} +12 -12
- package/components/popover/index.cjs +1 -1
- package/components/popover/index.js +1 -1
- package/components/popover-lcZnODPK.cjs +30 -0
- package/components/{popover-iD8f5Jkp.js → popover-ucIgjbQs.js} +8 -7
- package/components/progress-circle/index.cjs +1 -1
- package/components/progress-circle/index.js +1 -1
- package/components/{progress-circle-USIIU1up.js → progress-circle-D5J0ZwY0.js} +8 -7
- package/components/progress-circle-DgMbqrzG.cjs +33 -0
- package/components/radio/index.cjs +2 -2
- package/components/radio/index.js +10 -9
- package/components/search/index.cjs +6 -6
- package/components/search/index.js +5 -5
- package/components/select/index.cjs +43 -43
- package/components/select/index.js +33 -33
- package/components/{directive-C7oCP5Bh.cjs → sized-mixin-DcvJLFeo.cjs} +1 -5
- package/components/{sized-mixin-CJbBHWRQ.js → sized-mixin-cJbo3PKR.js} +5 -5
- package/components/slider/index.cjs +1 -1
- package/components/slider/index.js +48 -1101
- package/components/{streaming-listener-BQ68fKMa.js → streaming-listener-BgU36S1Z.js} +3 -3
- package/components/streaming-listener-CfUtuELp.cjs +18 -0
- package/components/swatch/index.cjs +5 -5
- package/components/swatch/index.js +11 -10
- package/components/switch/index.cjs +2 -2
- package/components/switch/index.js +5 -4
- package/components/tabs/index.cjs +31 -23
- package/components/tabs/index.js +497 -230
- package/components/tags/index.cjs +4 -4
- package/components/tags/index.js +13 -12
- package/components/text-field/index.cjs +3 -3
- package/components/text-field/index.js +12 -10
- package/components/{text-field-C2n3rzCK.js → text-field-BTEpwGFu.js} +73 -99
- package/components/text-field-JMrsh-zo.cjs +81 -0
- package/components/toast/index.cjs +11 -11
- package/components/toast/index.js +9 -7
- package/components/tooltip/index.cjs +4 -4
- package/components/tooltip/index.js +8 -7
- package/components/unit-input/index.cjs +6 -6
- package/components/unit-input/index.js +27 -26
- package/components/utils.cjs +1 -1
- package/components/utils.js +5 -5
- package/custom-elements.json +1 -1
- package/package.json +62 -1
- package/components/NumberFormatter-DewVDY5w.cjs +0 -18
- package/components/NumberFormatter-DgOUVrge.js +0 -136
- package/components/NumberParser-Dik4a0h-.cjs +0 -18
- package/components/NumberParser-ci9J5EKv.js +0 -173
- package/components/action-group-C54IxNZk.cjs +0 -20
- package/components/async-directive-DLz6JB0v.cjs +0 -22
- package/components/base-BjTwmyRF.cjs +0 -22
- package/components/base-CFWO09N1.js +0 -684
- package/components/base-Cy0MQrPT.cjs +0 -40
- package/components/base-D76d76ww.js +0 -26
- package/components/button-base-tf95Lyl4.cjs +0 -25
- package/components/class-map-CGfNk3Ee.js +0 -51
- package/components/class-map-D-Y-hsN5.cjs +0 -22
- package/components/clear-button-CuPbWwZY.cjs +0 -18
- package/components/close-button-BTo4yrFR.cjs +0 -18
- package/components/color-controller-B0uX6Zso.js +0 -3230
- package/components/color-controller-CoUL5f9K.cjs +0 -18
- package/components/color-loupe-CrM2DVY3.cjs +0 -56
- package/components/directive-helpers-D4KMv2dC.js +0 -62
- package/components/directive-helpers-t-TVum7J.cjs +0 -22
- package/components/directive-oAbCiebi.js +0 -44
- package/components/field-group-5WQMBOk4.cjs +0 -23
- package/components/field-label-Dz9kisdW.cjs +0 -25
- package/components/flow-D-0MTYCm.js +0 -527
- package/components/flow-DM3dNAKs.cjs +0 -30
- package/components/focusable-B_KwfEec.cjs +0 -18
- package/components/if-defined-DULpqYwi.js +0 -27
- package/components/if-defined-DaXWqfzc.cjs +0 -22
- package/components/index-CNK8wHXu.cjs +0 -57
- package/components/index-Cf6G4q52.js +0 -1490
- package/components/index-D3ICqC7S.js +0 -1174
- package/components/index-hqVbNKYy.cjs +0 -113
- package/components/like-anchor-Bu3pXbjT.cjs +0 -32
- package/components/luzmo-icons-CiSek5iM.js +0 -229
- package/components/luzmo-icons-CtA-TJPd.cjs +0 -29
- package/components/observe-slot-text-D2VAEFSd.cjs +0 -18
- package/components/overlay-B3ajDLLq.cjs +0 -47
- package/components/overlay-CUKs69yr.js +0 -2745
- package/components/picker-X96xmLAw.cjs +0 -123
- package/components/popover-fwJeZHMQ.cjs +0 -30
- package/components/progress-circle-DZxaMe8L.cjs +0 -33
- package/components/query-BL-TJj7K.cjs +0 -22
- package/components/query-D_KR_GUc.js +0 -51
- package/components/query-assigned-elements-DjfhL1cl.js +0 -36
- package/components/query-assigned-elements-DsKsfk7G.cjs +0 -22
- package/components/query-assigned-nodes-BcKWmGzy.cjs +0 -22
- package/components/query-assigned-nodes-C76XVPWY.js +0 -36
- package/components/sized-mixin-WPHH0a_D.cjs +0 -18
- package/components/state-DwIwYPvt.js +0 -29
- package/components/state-vf0PJN3_.cjs +0 -22
- package/components/streaming-listener-DeGQYM-9.cjs +0 -18
- package/components/style-map-Bnhf_mVZ.js +0 -53
- package/components/style-map-DuMd5xlY.cjs +0 -22
- package/components/text-field-BkFPYo7S.cjs +0 -85
|
@@ -15,71 +15,59 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import { s as
|
|
19
|
-
import {
|
|
20
|
-
import {
|
|
21
|
-
import { F as
|
|
22
|
-
import { L as
|
|
23
|
-
import { O as
|
|
24
|
-
import { O as
|
|
25
|
-
import { r as
|
|
26
|
-
import {
|
|
27
|
-
import
|
|
28
|
-
import {
|
|
29
|
-
import {
|
|
30
|
-
import {
|
|
31
|
-
import { S as G } from "../sized-mixin-CJbBHWRQ.js";
|
|
18
|
+
import { s as F } from "../mutation-controller-DH7YOCyj.js";
|
|
19
|
+
import { html as g, unsafeCSS as C, nothing as I } from "lit";
|
|
20
|
+
import { property as f, query as S, queryAll as j } from "lit/decorators.js";
|
|
21
|
+
import { F as P } from "../focusable-BjvsvVam.js";
|
|
22
|
+
import { L as T } from "../like-anchor-CgqCU210.js";
|
|
23
|
+
import { O as B } from "../observe-slot-presence-CmVi0zTc.js";
|
|
24
|
+
import { O as H } from "../observe-slot-text-CugmOzNZ.js";
|
|
25
|
+
import { r as V } from "../random-id-ByCz1xaq.js";
|
|
26
|
+
import { luzmoIcon as _, luzmoCheckboxChecked as K, luzmoCheckbox as q, luzmoCheck as N } from "@luzmo/icons";
|
|
27
|
+
import "@lit-labs/virtualizer";
|
|
28
|
+
import { e as M, i as W, t as R, p as G, v as y, r as O, M as E, T as Z, m as J } from "../directive-OK_Jd_xx.js";
|
|
29
|
+
import { a as U } from "../base-CdYjmV_8.js";
|
|
30
|
+
import { S as L } from "../sized-mixin-cJbo3PKR.js";
|
|
32
31
|
import "../progress-circle/index.js";
|
|
33
|
-
import { d as
|
|
34
|
-
const
|
|
32
|
+
import { d as Q } from "../divider.module-DoQWQEIJ.js";
|
|
33
|
+
const D = () => {
|
|
35
34
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
36
|
-
const
|
|
37
|
-
|
|
35
|
+
const a = document.createElement("style");
|
|
36
|
+
a.setAttribute("data-luzmo-vars", ""), a.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-disabled-color);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-negative-color: #ca221c;--luzmo-negative-color-hover: #b3241f;--luzmo-negative-color-down: #9f231f;--luzmo-negative-color-focus: #b3241f;--luzmo-negative-color-rgb: 202, 34, 28;--luzmo-positive-color: rgb(20, 150, 101);--luzmo-positive-color-hover: rgb(17, 128, 86);--luzmo-positive-color-down: rgb(16, 105, 71);--luzmo-positive-color-focus: rgb(17, 128, 86);--luzmo-positive-color-rgb: 20, 150, 101;--luzmo-selected-color: rgb(110, 110, 110);--luzmo-selected-color-hover: rgb(70, 70, 70);--luzmo-selected-color-down: rgb(40, 40, 40);--luzmo-selected-color-focus: rgb(70, 70, 70);--luzmo-selected-color-hard: #1e1e1e;--luzmo-selected-color-hard-hover: rgb(0, 0, 0);--luzmo-selected-color-hard-down: rgb(0, 0, 0);--luzmo-selected-color-hard-focus: rgb(0, 0, 0);--luzmo-informative-color: #1a77e9;--luzmo-informative-color-rgb: 26, 119, 233;--luzmo-disabled-color: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(a);
|
|
38
37
|
}
|
|
39
38
|
};
|
|
40
|
-
|
|
41
|
-
/**
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
let fo;
|
|
47
|
-
function go(n) {
|
|
48
|
-
return (o, t) => mo(o, t, { get() {
|
|
49
|
-
return (this.renderRoot ?? fo ?? (fo = document.createDocumentFragment())).querySelectorAll(n);
|
|
50
|
-
} });
|
|
51
|
-
}
|
|
52
|
-
const bo = '#icon{grid-area:iconArea;align-self:start;height:var(--luzmo-option-icon-container-height, var(--option-icon-container-height));display:flex;align-items:center;justify-content:center;color:var(--highcontrast-option-color-default, var(--luzmo-option-label-icon-color-default, var(--option-label-icon-color-default)))}::slotted([slot=icon]){fill:var(--highcontrast-option-color-default, var(--luzmo-option-label-icon-color-default, var(--option-label-icon-color-default)));margin-inline-end:var(--luzmo-option-label-text-to-visual, var(--option-label-text-to-visual));block-size:var(--luzmo-option-icon-size, var(--option-icon-height));inline-size:var(--luzmo-option-icon-width, var(--option-icon-height));font-size:var(--luzmo-option-icon-size, var(--option-icon-height));text-align:center;--luzmo-icon-vertical-align: 0}:host{cursor:pointer;box-sizing:border-box;background-color:var(--highcontrast-option-background-color-default, var(--luzmo-option-background-color-default, var(--option-background-color-default)));line-height:var(--luzmo-option-label-line-height, var(--option-label-line-height));min-block-size:var(--luzmo-option-min-height, var(--option-min-height));padding-block-start:var(--luzmo-option-top-edge-to-text, var(--option-top-edge-to-text));padding-block-end:var(--luzmo-option-bottom-edge-to-text, var(--option-bottom-edge-to-text));padding-inline:var(--luzmo-option-label-inline-edge-to-content, var(--option-label-inline-edge-to-content));grid-template:". . headingIconArea sectionHeadingArea . ." "selectedArea checkArea iconArea labelArea valueArea actionsArea" 1fr ". . . descriptionArea . ." ". . . . . ."/auto auto auto 1fr auto auto;justify-content:start;margin:0;-webkit-text-decoration:none;text-decoration:none;display:grid;outline:none;align-items:center;position:relative;flex-shrink:0}:host:focus-visible{outline:none}#label{grid-area:submenuItemLabelArea}.checkmark,.checkbox{opacity:1;grid-area:checkArea;align-self:start;display:block}.checkmark{font-size:var(--luzmo-option-checkmark-size, var(--option-checkmark-size));fill:var(--highcontrast-options-checkmark-icon-color-default, var(--luzmo-options-checkmark-icon-color-default, var(--options-checkmark-icon-color-default)));color:var(--highcontrast-options-checkmark-icon-color-default, var(--luzmo-options-checkmark-icon-color-default, var(--options-checkmark-icon-color-default)));margin-block-start:calc(var(--luzmo-option-top-to-checkmark, var(--option-top-to-checkmark)) - var(--luzmo-option-top-edge-to-text, var(--option-top-edge-to-text)));margin-inline-end:var(--luzmo-option-text-to-control, var(--option-label-text-to-control))}.checkbox{font-size:var(--luzmo-option-checkbox-size, var(--option-checkbox-size));fill:var(--highcontrast-options-checkbox-icon-color-default, var(--luzmo-options-checkbox-icon-color-default, var(--options-checkbox-icon-color-default)));color:var(--highcontrast-options-checkbox-icon-color-default, var(--luzmo-options-checkbox-icon-color-default, var(--options-checkbox-icon-color-default)));margin-block-start:calc(var(--luzmo-option-top-to-checkbox, var(--option-top-to-checkbox)) - var(--luzmo-option-top-edge-to-text, var(--option-top-edge-to-text)));margin-inline-end:var(--luzmo-option-text-to-control, var(--option-label-text-to-control))}::slotted([slot=value]){grid-area:submenuItemValueArea}:host([focused]){background-color:var(--highcontrast-option-background-color-focus, var(--luzmo-option-background-color-key-focus, var(--option-background-color-key-focus)));outline:none}:host([focused])>#label,:host(:focus)>#label{color:var(--highcontrast-option-color-focus, var(--luzmo-option-label-content-color-focus, var(--option-label-content-color-focus)))}:host([focused])>[name=description]::slotted(*),:host(:focus)>[name=description]::slotted(*){color:var(--highcontrast-option-color-focus, var(--luzmo-option-description-color-focus, var(--option-description-color-focus)))}:host([focused])>::slotted([slot=value]),:host(:focus)>::slotted([slot=value]){color:var(--highcontrast-option-color-focus, var(--luzmo-option-value-color-focus, var(--option-value-color-focus)))}:host([focused])>.icon:not(.checkmark,.checkbox),:host(:focus)>.icon:not(.checkmark,.checkbox){fill:var(--highcontrast-option-color-focus, var(--luzmo-option-label-icon-color-focus, var(--option-label-icon-color-focus)));color:var(--highcontrast-option-color-focus, var(--luzmo-option-label-icon-color-focus, var(--option-label-icon-color-focus)))}:host([focused])>.checkmark,:host(:focus)>.checkmark{fill:var(--highcontrast-option-color-focus, var(--luzmo-options-checkmark-icon-color-focus, var(--options-checkmark-icon-color-focus)));color:var(--highcontrast-option-color-focus, var(--luzmo-options-checkmark-icon-color-focus, var(--options-checkmark-icon-color-focus)))}:host([focused])>.checkbox,:host(:focus)>.checkbox{fill:var(--highcontrast-option-color-focus, var(--luzmo-options-checkbox-icon-color-focus, var(--options-checkbox-icon-color-focus)));color:var(--highcontrast-option-color-focus, var(--luzmo-options-checkbox-icon-color-focus, var(--options-checkbox-icon-color-focus)))}:host:dir(rtl),:host([dir=rtl]){--option-focus-indicator-direction-scalar: -1}:host(:is(:active,[active])){background-color:var(--highcontrast-option-background-color-focus, var(--luzmo-option-background-color-down, var(--option-background-color-down)))}:host(:is(:active,[active]))>#label{color:var(--highcontrast-option-color-focus, var(--luzmo-option-label-content-color-down, var(--option-label-content-color-down)))}:host(:is(:active,[active]))>[name=description]::slotted(*){color:var(--highcontrast-option-color-focus, var(--luzmo-option-description-color-down, var(--option-description-color-down)))}:host(:is(:active,[active]))>::slotted([slot=value]){color:var(--highcontrast-option-color-focus, var(--luzmo-option-value-color-down, var(--option-value-color-down)))}:host(:is(:active,[active]))>.icon:not(.checkmark,.checkbox){fill:var(--highcontrast-option-color-focus, var(--luzmo-option-label-icon-color-down, var(--option-label-icon-color-down)));color:var(--highcontrast-option-color-focus, var(--luzmo-option-label-icon-color-down, var(--option-label-icon-color-down)))}:host(:is(:active,[active]))>.checkmark{fill:var(--highcontrast-option-color-focus, var(--luzmo-options-checkmark-icon-color-down, var(--options-checkmark-icon-color-down)));color:var(--highcontrast-option-color-focus, var(--luzmo-options-checkmark-icon-color-down, var(--options-checkmark-icon-color-down)))}:host(:is(:active,[active]))>.checkbox{fill:var(--highcontrast-option-color-focus, var(--luzmo-options-checkbox-icon-color-down, var(--options-checkbox-icon-color-down)));color:var(--highcontrast-option-color-focus, var(--luzmo-options-checkbox-icon-color-down, var(--options-checkbox-icon-color-down)))}:host([disabled]),:host([aria-disabled=true]){background-color:initial}:host([disabled]) #label,:host([disabled]) ::slotted([slot=value]),:host([aria-disabled=true]) #label,:host([aria-disabled=true]) ::slotted([slot=value]){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-label-content-color-disabled, var(--option-label-content-color-disabled)))}:host([disabled]) [name=description]::slotted(*),:host([aria-disabled=true]) [name=description]::slotted(*){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-description-color-disabled, var(--option-description-color-disabled)))}:host([disabled]) ::slotted([slot=icon]),:host([aria-disabled=true]) ::slotted([slot=icon]){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-label-icon-color-disabled, var(--option-label-icon-color-disabled)));fill:var(--highcontrast-option-color-disabled, var(--luzmo-option-label-icon-color-disabled, var(--option-label-icon-color-disabled)))}:host([focused]){box-shadow:inset calc(var(--luzmo-option-focus-indicator-width, var(--option-focus-indicator-width)) * 1) 0 0 0 var(--highcontrast-option-focus-indicator-color, var(--luzmo-option-focus-indicator-color, var(--option-focus-indicator-color)));box-shadow:inset calc(var(--luzmo-option-focus-indicator-width, var(--option-focus-indicator-width)) * var(--option-focus-indicator-direction-scalar, 1)) 0 0 0 var(--highcontrast-option-focus-indicator-color, var(--luzmo-option-focus-indicator-color, var(--option-focus-indicator-color)))}#label{font-size:var(--luzmo-option-label-font-size, var(--option-label-font-size));color:var(--highcontrast-option-color-default, var(--luzmo-option-label-content-color-default, var(--option-label-content-color-default)));-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;grid-area:labelArea}:host([variant=highlight][selected]){background-color:var(--luzmo-option-highlight-selected-label-background-color, var(--option-highlight-selected-label-background-color))}:host([variant=highlight][selected]) #label{color:var(--luzmo-option-highlight-selected-label-content-color, var(--option-highlight-selected-label-content-color))}:host([variant=highlight][selected]):hover #label{color:var(--luzmo-option-highlight-selected-label-content-color-hover, var(--option-highlight-selected-label-content-color-hover))}:host([variant=highlight][selected]):active #label{color:var(--luzmo-option-highlight-selected-label-content-color-down, var(--option-highlight-selected-label-content-color-down))}:host([variant=highlight][selected]):focus #label{color:var(--luzmo-option-highlight-selected-label-content-color-focus, var(--option-highlight-selected-label-content-color-focus))}:host([variant=highlight][selected]) ::slotted([slot=icon]){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-highlight-selected-label-content-color, var(--option-highlight-selected-label-content-color)));fill:var(--highcontrast-option-color-disabled, var(--luzmo-option-highlight-selected-label-content-color, var(--option-highlight-selected-label-content-color)))}::slotted([slot=value]){color:var(--highcontrast-option-color-default, var(--luzmo-option-value-color-default, var(--option-value-color-default)));font-size:var(--luzmo-option-label-font-size, var(--option-label-font-size));grid-area:valueArea;justify-self:end}[name=description]::slotted(*){color:var(--highcontrast-option-color-default, var(--luzmo-option-description-color-default, var(--option-description-color-default)));font-size:var(--luzmo-option-description-font-size, var(--option-description-font-size));-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;line-height:var(--luzmo-option-description-line-height, var(--option-description-line-height));grid-area:descriptionArea;margin-block-start:var(--luzmo-option-label-to-description-spacing, var(--option-label-to-description-spacing))}:host([no-wrap]) #label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}@media (hover: hover){:host(:hover){background-color:var(--highcontrast-option-background-color-focus, var(--luzmo-option-background-color-hover, var(--option-background-color-hover)))}:host(:hover)>#label{color:var(--highcontrast-option-color-focus, var(--luzmo-option-label-content-color-hover, var(--option-label-content-color-hover)))}:host([variant=highlight][selected]:hover)>#label{color:var(--luzmo-option-highlight-selected-label-content-color-hover, var(--option-highlight-selected-label-content-color-hover))}:host(:hover)>[name=description]::slotted(*){color:var(--highcontrast-option-color-focus, var(--luzmo-option-description-color-hover, var(--option-description-color-hover)))}:host(:hover)>::slotted([slot=value]){color:var(--highcontrast-option-color-focus, var(--luzmo-option-value-color-hover, var(--option-value-color-hover)))}:host(:hover)>.icon:not(.checkmark,.checkbox){fill:var(--highcontrast-option-color-focus, var(--luzmo-option-label-icon-color-hover, var(--option-label-icon-color-hover)));color:var(--highcontrast-option-color-focus, var(--luzmo-option-label-icon-color-hover, var(--option-label-icon-color-hover)))}:host([variant=highlight][selected]:hover)>.icon:not(.checkmark,.checkbox){fill:var(--luzmo-option-highlight-selected-label-icon-color-hover, var(--option-highlight-selected-label-icon-color-hover))}:host(:hover)>.checkmark{fill:var(--highcontrast-option-color-focus, var(--luzmo-options-checkmark-icon-color-hover, var(--options-checkmark-icon-color-hover)));color:var(--highcontrast-option-color-focus, var(--luzmo-options-checkmark-icon-color-hover, var(--options-checkmark-icon-color-hover)))}:host(:hover)>.checkbox{fill:var(--highcontrast-option-color-focus, var(--luzmo-options-checkbox-icon-color-hover, var(--options-checkbox-icon-color-hover)));color:var(--highcontrast-option-color-focus, var(--luzmo-options-checkbox-icon-color-hover, var(--options-checkbox-icon-color-hover)))}:host([disabled]:hover),:host([aria-disabled=true]:hover){cursor:default;background-color:initial}:host([disabled]:hover) #label,:host([disabled]:hover) ::slotted([slot=value]),:host([aria-disabled=true]:hover) #label,:host([aria-disabled=true]:hover) ::slotted([slot=value]){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-label-content-color-disabled, var(--option-label-content-color-disabled)))}:host([disabled]:hover) [name=description]::slotted(*),:host([aria-disabled=true]:hover) [name=description]::slotted(*){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-description-color-disabled, var(--option-description-color-disabled)))}:host([disabled]:hover) ::slotted([slot=icon]),:host([aria-disabled=true]:hover) ::slotted([slot=icon]){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-label-icon-color-disabled, var(--option-label-icon-color-disabled)));fill:var(--highcontrast-option-color-disabled, var(--luzmo-option-label-icon-color-disabled, var(--option-label-icon-color-disabled)))}}:host([emphasized]){--options-checkmark-icon-color-default: var(--luzmo-primary);--options-checkmark-icon-color-hover: var(--luzmo-primary-hover);--options-checkmark-icon-color-down: var(--luzmo-primary-down);--options-checkmark-icon-color-focus: var(--luzmo-primary-focus);--options-checkbox-icon-color-default: var(--luzmo-primary);--options-checkbox-icon-color-hover: var(--luzmo-primary-hover);--options-checkbox-icon-color-down: var(--luzmo-primary-down);--options-checkbox-icon-color-focus: var(--luzmo-primary-focus)}:host{text-align:initial;font-family:var(--luzmo-option-font-family, var(--luzmo-font-family))}:host([hidden]){display:none}:host([disabled]){pointer-events:none}:host([disabled]) [name=value]::slotted(*){color:var(--luzmo-option-label-icon-color-disabled, var(--luzmo-disabled-color))}#button{position:absolute;top:0;right:0;bottom:0;left:0}.icon-container>svg{vertical-align:top}:host([dir=ltr]) [icon-only]::slotted(:last-of-type){margin-right:auto}:host([dir=rtl]) [icon-only]::slotted(:last-of-type){margin-left:auto}@media (forced-colors: active){:host{forced-color-adjust:none}}:host([no-wrap]) #label{display:block}';
|
|
53
|
-
var zo = Object.defineProperty, _o = Object.getOwnPropertyDescriptor, _ = (n, o, t, e) => {
|
|
54
|
-
for (var i = e > 1 ? void 0 : e ? _o(o, t) : o, l = n.length - 1, s; l >= 0; l--)
|
|
55
|
-
(s = n[l]) && (i = (e ? s(o, t, i) : s(i)) || i);
|
|
56
|
-
return e && i && zo(o, t, i), i;
|
|
39
|
+
D();
|
|
40
|
+
const X = '#icon{grid-area:iconArea;align-self:start;height:var(--luzmo-option-icon-container-height, var(--option-icon-container-height));display:flex;align-items:center;justify-content:center;color:var(--highcontrast-option-color-default, var(--luzmo-option-label-icon-color-default, var(--option-label-icon-color-default)))}::slotted([slot=icon]){fill:var(--highcontrast-option-color-default, var(--luzmo-option-label-icon-color-default, var(--option-label-icon-color-default)));margin-inline-end:var(--luzmo-option-label-text-to-visual, var(--option-label-text-to-visual));block-size:var(--luzmo-option-icon-size, var(--option-icon-height));inline-size:var(--luzmo-option-icon-width, var(--option-icon-height));font-size:var(--luzmo-option-icon-size, var(--option-icon-height));text-align:center;--luzmo-icon-vertical-align: 0}:host{cursor:pointer;box-sizing:border-box;background-color:var(--highcontrast-option-background-color-default, var(--luzmo-option-background-color-default, var(--option-background-color-default)));line-height:var(--luzmo-option-label-line-height, var(--option-label-line-height));min-block-size:var(--luzmo-option-min-height, var(--option-min-height));padding-block-start:var(--luzmo-option-top-edge-to-text, var(--option-top-edge-to-text));padding-block-end:var(--luzmo-option-bottom-edge-to-text, var(--option-bottom-edge-to-text));padding-inline:var(--luzmo-option-label-inline-edge-to-content, var(--option-label-inline-edge-to-content));grid-template:". . headingIconArea sectionHeadingArea . ." "selectedArea checkArea iconArea labelArea valueArea actionsArea" 1fr ". . . descriptionArea . ." ". . . . . ."/auto auto auto 1fr auto auto;justify-content:start;margin:0;-webkit-text-decoration:none;text-decoration:none;display:grid;outline:none;align-items:center;position:relative;flex-shrink:0}:host:focus-visible{outline:none}#label{grid-area:submenuItemLabelArea}.checkmark,.checkbox{opacity:1;grid-area:checkArea;align-self:start;display:block}.checkmark{font-size:var(--luzmo-option-checkmark-size, var(--option-checkmark-size));fill:var(--highcontrast-options-checkmark-icon-color-default, var(--luzmo-options-checkmark-icon-color-default, var(--options-checkmark-icon-color-default)));color:var(--highcontrast-options-checkmark-icon-color-default, var(--luzmo-options-checkmark-icon-color-default, var(--options-checkmark-icon-color-default)));margin-block-start:calc(var(--luzmo-option-top-to-checkmark, var(--option-top-to-checkmark)) - var(--luzmo-option-top-edge-to-text, var(--option-top-edge-to-text)));margin-inline-end:var(--luzmo-option-text-to-control, var(--option-label-text-to-control))}.checkbox{font-size:var(--luzmo-option-checkbox-size, var(--option-checkbox-size));fill:var(--highcontrast-options-checkbox-icon-color-default, var(--luzmo-options-checkbox-icon-color-default, var(--options-checkbox-icon-color-default)));color:var(--highcontrast-options-checkbox-icon-color-default, var(--luzmo-options-checkbox-icon-color-default, var(--options-checkbox-icon-color-default)));margin-block-start:calc(var(--luzmo-option-top-to-checkbox, var(--option-top-to-checkbox)) - var(--luzmo-option-top-edge-to-text, var(--option-top-edge-to-text)));margin-inline-end:var(--luzmo-option-text-to-control, var(--option-label-text-to-control))}::slotted([slot=value]){grid-area:submenuItemValueArea}:host([focused]){background-color:var(--highcontrast-option-background-color-focus, var(--luzmo-option-background-color-key-focus, var(--option-background-color-key-focus)));outline:none}:host([focused])>#label,:host(:focus)>#label{color:var(--highcontrast-option-color-focus, var(--luzmo-option-label-content-color-focus, var(--option-label-content-color-focus)))}:host([focused])>[name=description]::slotted(*),:host(:focus)>[name=description]::slotted(*){color:var(--highcontrast-option-color-focus, var(--luzmo-option-description-color-focus, var(--option-description-color-focus)))}:host([focused])>::slotted([slot=value]),:host(:focus)>::slotted([slot=value]){color:var(--highcontrast-option-color-focus, var(--luzmo-option-value-color-focus, var(--option-value-color-focus)))}:host([focused])>.icon:not(.checkmark,.checkbox),:host(:focus)>.icon:not(.checkmark,.checkbox){fill:var(--highcontrast-option-color-focus, var(--luzmo-option-label-icon-color-focus, var(--option-label-icon-color-focus)));color:var(--highcontrast-option-color-focus, var(--luzmo-option-label-icon-color-focus, var(--option-label-icon-color-focus)))}:host([focused])>.checkmark,:host(:focus)>.checkmark{fill:var(--highcontrast-option-color-focus, var(--luzmo-options-checkmark-icon-color-focus, var(--options-checkmark-icon-color-focus)));color:var(--highcontrast-option-color-focus, var(--luzmo-options-checkmark-icon-color-focus, var(--options-checkmark-icon-color-focus)))}:host([focused])>.checkbox,:host(:focus)>.checkbox{fill:var(--highcontrast-option-color-focus, var(--luzmo-options-checkbox-icon-color-focus, var(--options-checkbox-icon-color-focus)));color:var(--highcontrast-option-color-focus, var(--luzmo-options-checkbox-icon-color-focus, var(--options-checkbox-icon-color-focus)))}:host:dir(rtl),:host([dir=rtl]){--option-focus-indicator-direction-scalar: -1}:host(:is(:active,[active])){background-color:var(--highcontrast-option-background-color-focus, var(--luzmo-option-background-color-down, var(--option-background-color-down)))}:host(:is(:active,[active]))>#label{color:var(--highcontrast-option-color-focus, var(--luzmo-option-label-content-color-down, var(--option-label-content-color-down)))}:host(:is(:active,[active]))>[name=description]::slotted(*){color:var(--highcontrast-option-color-focus, var(--luzmo-option-description-color-down, var(--option-description-color-down)))}:host(:is(:active,[active]))>::slotted([slot=value]){color:var(--highcontrast-option-color-focus, var(--luzmo-option-value-color-down, var(--option-value-color-down)))}:host(:is(:active,[active]))>.icon:not(.checkmark,.checkbox){fill:var(--highcontrast-option-color-focus, var(--luzmo-option-label-icon-color-down, var(--option-label-icon-color-down)));color:var(--highcontrast-option-color-focus, var(--luzmo-option-label-icon-color-down, var(--option-label-icon-color-down)))}:host(:is(:active,[active]))>.checkmark{fill:var(--highcontrast-option-color-focus, var(--luzmo-options-checkmark-icon-color-down, var(--options-checkmark-icon-color-down)));color:var(--highcontrast-option-color-focus, var(--luzmo-options-checkmark-icon-color-down, var(--options-checkmark-icon-color-down)))}:host(:is(:active,[active]))>.checkbox{fill:var(--highcontrast-option-color-focus, var(--luzmo-options-checkbox-icon-color-down, var(--options-checkbox-icon-color-down)));color:var(--highcontrast-option-color-focus, var(--luzmo-options-checkbox-icon-color-down, var(--options-checkbox-icon-color-down)))}:host([disabled]),:host([aria-disabled=true]){background-color:initial}:host([disabled]) #label,:host([disabled]) ::slotted([slot=value]),:host([aria-disabled=true]) #label,:host([aria-disabled=true]) ::slotted([slot=value]){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-label-content-color-disabled, var(--option-label-content-color-disabled)))}:host([disabled]) [name=description]::slotted(*),:host([aria-disabled=true]) [name=description]::slotted(*){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-description-color-disabled, var(--option-description-color-disabled)))}:host([disabled]) ::slotted([slot=icon]),:host([aria-disabled=true]) ::slotted([slot=icon]){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-label-icon-color-disabled, var(--option-label-icon-color-disabled)));fill:var(--highcontrast-option-color-disabled, var(--luzmo-option-label-icon-color-disabled, var(--option-label-icon-color-disabled)))}:host([focused]){box-shadow:inset calc(var(--luzmo-option-focus-indicator-width, var(--option-focus-indicator-width)) * 1) 0 0 0 var(--highcontrast-option-focus-indicator-color, var(--luzmo-option-focus-indicator-color, var(--option-focus-indicator-color)));box-shadow:inset calc(var(--luzmo-option-focus-indicator-width, var(--option-focus-indicator-width)) * var(--option-focus-indicator-direction-scalar, 1)) 0 0 0 var(--highcontrast-option-focus-indicator-color, var(--luzmo-option-focus-indicator-color, var(--option-focus-indicator-color)))}#label{font-size:var(--luzmo-option-label-font-size, var(--option-label-font-size));color:var(--highcontrast-option-color-default, var(--luzmo-option-label-content-color-default, var(--option-label-content-color-default)));-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;grid-area:labelArea}:host([variant=highlight][selected]){background-color:var(--luzmo-option-highlight-selected-label-background-color, var(--option-highlight-selected-label-background-color))}:host([variant=highlight][selected]) #label{color:var(--luzmo-option-highlight-selected-label-content-color, var(--option-highlight-selected-label-content-color))}:host([variant=highlight][selected]):hover #label{color:var(--luzmo-option-highlight-selected-label-content-color-hover, var(--option-highlight-selected-label-content-color-hover))}:host([variant=highlight][selected]):active #label{color:var(--luzmo-option-highlight-selected-label-content-color-down, var(--option-highlight-selected-label-content-color-down))}:host([variant=highlight][selected]):focus #label{color:var(--luzmo-option-highlight-selected-label-content-color-focus, var(--option-highlight-selected-label-content-color-focus))}:host([variant=highlight][selected]) ::slotted([slot=icon]){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-highlight-selected-label-content-color, var(--option-highlight-selected-label-content-color)));fill:var(--highcontrast-option-color-disabled, var(--luzmo-option-highlight-selected-label-content-color, var(--option-highlight-selected-label-content-color)))}::slotted([slot=value]){color:var(--highcontrast-option-color-default, var(--luzmo-option-value-color-default, var(--option-value-color-default)));font-size:var(--luzmo-option-label-font-size, var(--option-label-font-size));grid-area:valueArea;justify-self:end}[name=description]::slotted(*){color:var(--highcontrast-option-color-default, var(--luzmo-option-description-color-default, var(--option-description-color-default)));font-size:var(--luzmo-option-description-font-size, var(--option-description-font-size));-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;line-height:var(--luzmo-option-description-line-height, var(--option-description-line-height));grid-area:descriptionArea;margin-block-start:var(--luzmo-option-label-to-description-spacing, var(--option-label-to-description-spacing))}:host([no-wrap]) #label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}@media (hover: hover){:host(:hover){background-color:var(--highcontrast-option-background-color-focus, var(--luzmo-option-background-color-hover, var(--option-background-color-hover)))}:host(:hover)>#label{color:var(--highcontrast-option-color-focus, var(--luzmo-option-label-content-color-hover, var(--option-label-content-color-hover)))}:host([variant=highlight][selected]:hover)>#label{color:var(--luzmo-option-highlight-selected-label-content-color-hover, var(--option-highlight-selected-label-content-color-hover))}:host(:hover)>[name=description]::slotted(*){color:var(--highcontrast-option-color-focus, var(--luzmo-option-description-color-hover, var(--option-description-color-hover)))}:host(:hover)>::slotted([slot=value]){color:var(--highcontrast-option-color-focus, var(--luzmo-option-value-color-hover, var(--option-value-color-hover)))}:host(:hover)>.icon:not(.checkmark,.checkbox){fill:var(--highcontrast-option-color-focus, var(--luzmo-option-label-icon-color-hover, var(--option-label-icon-color-hover)));color:var(--highcontrast-option-color-focus, var(--luzmo-option-label-icon-color-hover, var(--option-label-icon-color-hover)))}:host([variant=highlight][selected]:hover)>.icon:not(.checkmark,.checkbox){fill:var(--luzmo-option-highlight-selected-label-icon-color-hover, var(--option-highlight-selected-label-icon-color-hover))}:host(:hover)>.checkmark{fill:var(--highcontrast-option-color-focus, var(--luzmo-options-checkmark-icon-color-hover, var(--options-checkmark-icon-color-hover)));color:var(--highcontrast-option-color-focus, var(--luzmo-options-checkmark-icon-color-hover, var(--options-checkmark-icon-color-hover)))}:host(:hover)>.checkbox{fill:var(--highcontrast-option-color-focus, var(--luzmo-options-checkbox-icon-color-hover, var(--options-checkbox-icon-color-hover)));color:var(--highcontrast-option-color-focus, var(--luzmo-options-checkbox-icon-color-hover, var(--options-checkbox-icon-color-hover)))}:host([disabled]:hover),:host([aria-disabled=true]:hover){cursor:default;background-color:initial}:host([disabled]:hover) #label,:host([disabled]:hover) ::slotted([slot=value]),:host([aria-disabled=true]:hover) #label,:host([aria-disabled=true]:hover) ::slotted([slot=value]){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-label-content-color-disabled, var(--option-label-content-color-disabled)))}:host([disabled]:hover) [name=description]::slotted(*),:host([aria-disabled=true]:hover) [name=description]::slotted(*){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-description-color-disabled, var(--option-description-color-disabled)))}:host([disabled]:hover) ::slotted([slot=icon]),:host([aria-disabled=true]:hover) ::slotted([slot=icon]){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-label-icon-color-disabled, var(--option-label-icon-color-disabled)));fill:var(--highcontrast-option-color-disabled, var(--luzmo-option-label-icon-color-disabled, var(--option-label-icon-color-disabled)))}}:host([emphasized]){--options-checkmark-icon-color-default: var(--luzmo-primary);--options-checkmark-icon-color-hover: var(--luzmo-primary-hover);--options-checkmark-icon-color-down: var(--luzmo-primary-down);--options-checkmark-icon-color-focus: var(--luzmo-primary-focus);--options-checkbox-icon-color-default: var(--luzmo-primary);--options-checkbox-icon-color-hover: var(--luzmo-primary-hover);--options-checkbox-icon-color-down: var(--luzmo-primary-down);--options-checkbox-icon-color-focus: var(--luzmo-primary-focus)}:host{text-align:initial;font-family:var(--luzmo-option-font-family, var(--luzmo-font-family))}:host([hidden]){display:none}:host([disabled]){pointer-events:none}:host([disabled]) [name=value]::slotted(*){color:var(--luzmo-option-label-icon-color-disabled, var(--luzmo-disabled-color))}#button{position:absolute;top:0;right:0;bottom:0;left:0}.icon-container>svg{vertical-align:top}:host([dir=ltr]) [icon-only]::slotted(:last-of-type){margin-right:auto}:host([dir=rtl]) [icon-only]::slotted(:last-of-type){margin-left:auto}@media (forced-colors: active){:host{forced-color-adjust:none}}:host([no-wrap]) #label{display:block}';
|
|
41
|
+
var Y = Object.defineProperty, oo = Object.getOwnPropertyDescriptor, k = (a, o, t, l) => {
|
|
42
|
+
for (var e = l > 1 ? void 0 : l ? oo(o, t) : o, n = a.length - 1, r; n >= 0; n--)
|
|
43
|
+
(r = a[n]) && (e = (l ? r(o, t, e) : r(e)) || e);
|
|
44
|
+
return l && e && Y(o, t, e), e;
|
|
57
45
|
};
|
|
58
|
-
const
|
|
59
|
-
<span class="icon-container icon checkmark ${
|
|
60
|
-
${
|
|
46
|
+
const to = (a) => g`
|
|
47
|
+
<span class="icon-container icon checkmark ${a.join(" ")}">
|
|
48
|
+
${_(N)}
|
|
61
49
|
</span>
|
|
62
|
-
`,
|
|
63
|
-
<span class="icon-container icon checkbox ${
|
|
64
|
-
${
|
|
50
|
+
`, eo = (a) => g`
|
|
51
|
+
<span class="icon-container icon checkbox ${a.join(" ")}">
|
|
52
|
+
${_(q)}
|
|
65
53
|
</span>
|
|
66
|
-
`,
|
|
67
|
-
<span class="icon-container icon checkbox ${
|
|
68
|
-
${
|
|
54
|
+
`, io = (a) => g`
|
|
55
|
+
<span class="icon-container icon checkbox ${a.join(" ")}">
|
|
56
|
+
${_(K)}
|
|
69
57
|
</span>
|
|
70
58
|
`;
|
|
71
|
-
class b extends
|
|
72
|
-
|
|
59
|
+
class b extends T(
|
|
60
|
+
H(B(P, '[slot="icon"]'))
|
|
73
61
|
) {
|
|
74
62
|
constructor() {
|
|
75
63
|
super(), this.active = !1, this.focused = !1, this.selected = !1, this.emphasized = !1, this.variant = "checkmarks", this._value = "", this.noWrap = !1, this.renderCheckIcon = (o, t) => {
|
|
76
|
-
const
|
|
77
|
-
return this.variant === "checkboxes" ? o ?
|
|
64
|
+
const l = t ? ["check-icon--with-adjacent-icon"] : [];
|
|
65
|
+
return this.variant === "checkboxes" ? o ? io(l) : eo(l) : o && this.variant !== "highlight" ? to(l) : g``;
|
|
78
66
|
}, this.proxyFocus = () => {
|
|
79
67
|
this.focus();
|
|
80
68
|
}, this.willDispatchUpdate = !1, this.addEventListener("click", this.handleClickCapture, {
|
|
81
69
|
capture: !0
|
|
82
|
-
}), new
|
|
70
|
+
}), new F(this, {
|
|
83
71
|
config: {
|
|
84
72
|
characterData: !0,
|
|
85
73
|
childList: !0,
|
|
@@ -91,7 +79,7 @@ class b extends eo(
|
|
|
91
79
|
});
|
|
92
80
|
}
|
|
93
81
|
static get styles() {
|
|
94
|
-
return [
|
|
82
|
+
return [C(X)];
|
|
95
83
|
}
|
|
96
84
|
get value() {
|
|
97
85
|
return this._value || this.itemText;
|
|
@@ -122,10 +110,10 @@ class b extends eo(
|
|
|
122
110
|
};
|
|
123
111
|
if (this._itemChildren)
|
|
124
112
|
return this._itemChildren;
|
|
125
|
-
const o = this.iconSlot.assignedElements().map((
|
|
126
|
-
const
|
|
127
|
-
return
|
|
128
|
-
}), t = this.contentSlot.assignedNodes().map((
|
|
113
|
+
const o = this.iconSlot.assignedElements().map((l) => {
|
|
114
|
+
const e = l.cloneNode(!0);
|
|
115
|
+
return e.removeAttribute("slot"), e.classList.toggle("icon"), e;
|
|
116
|
+
}), t = this.contentSlot.assignedNodes().map((l) => l.cloneNode(!0));
|
|
129
117
|
return this._itemChildren = { icon: o, content: t }, this._itemChildren;
|
|
130
118
|
}
|
|
131
119
|
click() {
|
|
@@ -157,13 +145,13 @@ class b extends eo(
|
|
|
157
145
|
id: "button",
|
|
158
146
|
ariaHidden: !0,
|
|
159
147
|
className: "button anchor hidden"
|
|
160
|
-
}) :
|
|
148
|
+
}) : I}
|
|
161
149
|
`;
|
|
162
150
|
}
|
|
163
151
|
handlePointerdown() {
|
|
164
152
|
}
|
|
165
153
|
firstUpdated(o) {
|
|
166
|
-
super.firstUpdated(o), this.setAttribute("tabindex", "-1"), this.addEventListener("pointerdown", this.handlePointerdown), this.hasAttribute("id") || (this.id = `luzmo-option-${
|
|
154
|
+
super.firstUpdated(o), this.setAttribute("tabindex", "-1"), this.addEventListener("pointerdown", this.handlePointerdown), this.hasAttribute("id") || (this.id = `luzmo-option-${V()}`);
|
|
167
155
|
}
|
|
168
156
|
updateAriaSelected() {
|
|
169
157
|
const o = this.getAttribute("role");
|
|
@@ -185,31 +173,31 @@ class b extends eo(
|
|
|
185
173
|
this.isConnected && (this.willDispatchUpdate = !1);
|
|
186
174
|
}
|
|
187
175
|
}
|
|
188
|
-
|
|
176
|
+
k([
|
|
189
177
|
f({ type: Boolean, reflect: !0 })
|
|
190
178
|
], b.prototype, "active", 2);
|
|
191
|
-
|
|
179
|
+
k([
|
|
192
180
|
f({ type: Boolean, reflect: !0 })
|
|
193
181
|
], b.prototype, "focused", 2);
|
|
194
|
-
|
|
182
|
+
k([
|
|
195
183
|
f({ type: Boolean, reflect: !0 })
|
|
196
184
|
], b.prototype, "selected", 2);
|
|
197
|
-
|
|
185
|
+
k([
|
|
198
186
|
f({ type: Boolean, reflect: !0 })
|
|
199
187
|
], b.prototype, "emphasized", 2);
|
|
200
|
-
|
|
188
|
+
k([
|
|
201
189
|
f({ type: String, reflect: !0 })
|
|
202
190
|
], b.prototype, "variant", 2);
|
|
203
|
-
|
|
191
|
+
k([
|
|
204
192
|
f({ type: String })
|
|
205
193
|
], b.prototype, "value", 1);
|
|
206
|
-
|
|
207
|
-
|
|
194
|
+
k([
|
|
195
|
+
S("slot:not([name])")
|
|
208
196
|
], b.prototype, "contentSlot", 2);
|
|
209
|
-
|
|
210
|
-
|
|
197
|
+
k([
|
|
198
|
+
S('slot[name="icon"]')
|
|
211
199
|
], b.prototype, "iconSlot", 2);
|
|
212
|
-
|
|
200
|
+
k([
|
|
213
201
|
f({
|
|
214
202
|
type: Boolean,
|
|
215
203
|
reflect: !0,
|
|
@@ -219,663 +207,85 @@ _([
|
|
|
219
207
|
}
|
|
220
208
|
})
|
|
221
209
|
], b.prototype, "noWrap", 2);
|
|
222
|
-
|
|
223
|
-
|
|
210
|
+
k([
|
|
211
|
+
S(".anchor")
|
|
224
212
|
], b.prototype, "anchorElement", 2);
|
|
225
|
-
function O(n, o, t, e) {
|
|
226
|
-
var i = arguments.length, l = i < 3 ? o : e === null ? e = Object.getOwnPropertyDescriptor(o, t) : e, s;
|
|
227
|
-
if (typeof Reflect == "object" && typeof Reflect.decorate == "function") l = Reflect.decorate(n, o, t, e);
|
|
228
|
-
else for (var r = n.length - 1; r >= 0; r--) (s = n[r]) && (l = (i < 3 ? s(l) : i > 3 ? s(o, t, l) : s(o, t)) || l);
|
|
229
|
-
return i > 3 && l && Object.defineProperty(o, t, l), l;
|
|
230
|
-
}
|
|
231
213
|
/**
|
|
232
214
|
* @license
|
|
233
215
|
* Copyright 2017 Google LLC
|
|
234
216
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
235
217
|
*/
|
|
236
|
-
const
|
|
237
|
-
const
|
|
238
|
-
for (let
|
|
239
|
-
return
|
|
240
|
-
},
|
|
241
|
-
constructor(
|
|
242
|
-
if (super(
|
|
243
|
-
}
|
|
244
|
-
dt(
|
|
245
|
-
let
|
|
246
|
-
t === void 0 ? t = o : o !== void 0 && (
|
|
247
|
-
const
|
|
248
|
-
let
|
|
249
|
-
for (const
|
|
250
|
-
return { values:
|
|
251
|
-
}
|
|
252
|
-
render(
|
|
253
|
-
return this.dt(
|
|
254
|
-
}
|
|
255
|
-
update(
|
|
256
|
-
const
|
|
257
|
-
if (!Array.isArray(
|
|
258
|
-
const
|
|
259
|
-
let
|
|
260
|
-
for (;
|
|
261
|
-
else if (
|
|
262
|
-
else if (
|
|
263
|
-
else if (
|
|
264
|
-
else if (
|
|
265
|
-
else if (
|
|
266
|
-
else if (
|
|
267
|
-
const v =
|
|
268
|
-
if (
|
|
269
|
-
const
|
|
270
|
-
|
|
271
|
-
} else
|
|
272
|
-
|
|
273
|
-
} else
|
|
274
|
-
else
|
|
275
|
-
for (;
|
|
276
|
-
const v =
|
|
277
|
-
|
|
278
|
-
}
|
|
279
|
-
for (; u <= d; ) {
|
|
280
|
-
const v = i[u++];
|
|
281
|
-
v !== null && M(v);
|
|
282
|
-
}
|
|
283
|
-
return this.ut = s, po(n, a), H;
|
|
284
|
-
}
|
|
285
|
-
});
|
|
286
|
-
/**
|
|
287
|
-
* @license
|
|
288
|
-
* Copyright 2021 Google LLC
|
|
289
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
290
|
-
*/
|
|
291
|
-
class R extends Event {
|
|
292
|
-
constructor(o) {
|
|
293
|
-
super(R.eventName, { bubbles: !1 }), this.first = o.first, this.last = o.last;
|
|
294
|
-
}
|
|
295
|
-
}
|
|
296
|
-
R.eventName = "rangeChanged";
|
|
297
|
-
class $ extends Event {
|
|
298
|
-
constructor(o) {
|
|
299
|
-
super($.eventName, { bubbles: !1 }), this.first = o.first, this.last = o.last;
|
|
300
|
-
}
|
|
301
|
-
}
|
|
302
|
-
$.eventName = "visibilityChanged";
|
|
303
|
-
class F extends Event {
|
|
304
|
-
constructor() {
|
|
305
|
-
super(F.eventName, { bubbles: !1 });
|
|
306
|
-
}
|
|
307
|
-
}
|
|
308
|
-
F.eventName = "unpinned";
|
|
309
|
-
/**
|
|
310
|
-
* @license
|
|
311
|
-
* Copyright 2021 Google LLC
|
|
312
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
313
|
-
*/
|
|
314
|
-
class wo {
|
|
315
|
-
constructor(o) {
|
|
316
|
-
this._element = null;
|
|
317
|
-
const t = o ?? window;
|
|
318
|
-
this._node = t, o && (this._element = o);
|
|
319
|
-
}
|
|
320
|
-
get element() {
|
|
321
|
-
return this._element || document.scrollingElement || document.documentElement;
|
|
322
|
-
}
|
|
323
|
-
get scrollTop() {
|
|
324
|
-
return this.element.scrollTop || window.scrollY;
|
|
325
|
-
}
|
|
326
|
-
get scrollLeft() {
|
|
327
|
-
return this.element.scrollLeft || window.scrollX;
|
|
328
|
-
}
|
|
329
|
-
get scrollHeight() {
|
|
330
|
-
return this.element.scrollHeight;
|
|
331
|
-
}
|
|
332
|
-
get scrollWidth() {
|
|
333
|
-
return this.element.scrollWidth;
|
|
334
|
-
}
|
|
335
|
-
get viewportHeight() {
|
|
336
|
-
return this._element ? this._element.getBoundingClientRect().height : window.innerHeight;
|
|
337
|
-
}
|
|
338
|
-
get viewportWidth() {
|
|
339
|
-
return this._element ? this._element.getBoundingClientRect().width : window.innerWidth;
|
|
340
|
-
}
|
|
341
|
-
get maxScrollTop() {
|
|
342
|
-
return this.scrollHeight - this.viewportHeight;
|
|
343
|
-
}
|
|
344
|
-
get maxScrollLeft() {
|
|
345
|
-
return this.scrollWidth - this.viewportWidth;
|
|
346
|
-
}
|
|
347
|
-
}
|
|
348
|
-
class Eo extends wo {
|
|
349
|
-
constructor(o, t) {
|
|
350
|
-
super(t), this._clients = /* @__PURE__ */ new Set(), this._retarget = null, this._end = null, this.__destination = null, this.correctingScrollError = !1, this._checkForArrival = this._checkForArrival.bind(this), this._updateManagedScrollTo = this._updateManagedScrollTo.bind(this), this.scrollTo = this.scrollTo.bind(this), this.scrollBy = this.scrollBy.bind(this);
|
|
351
|
-
const e = this._node;
|
|
352
|
-
this._originalScrollTo = e.scrollTo, this._originalScrollBy = e.scrollBy, this._originalScroll = e.scroll, this._attach(o);
|
|
353
|
-
}
|
|
354
|
-
get _destination() {
|
|
355
|
-
return this.__destination;
|
|
356
|
-
}
|
|
357
|
-
get scrolling() {
|
|
358
|
-
return this._destination !== null;
|
|
359
|
-
}
|
|
360
|
-
scrollTo(o, t) {
|
|
361
|
-
const e = typeof o == "number" && typeof t == "number" ? { left: o, top: t } : o;
|
|
362
|
-
this._scrollTo(e);
|
|
363
|
-
}
|
|
364
|
-
scrollBy(o, t) {
|
|
365
|
-
const e = typeof o == "number" && typeof t == "number" ? { left: o, top: t } : o;
|
|
366
|
-
e.top !== void 0 && (e.top += this.scrollTop), e.left !== void 0 && (e.left += this.scrollLeft), this._scrollTo(e);
|
|
367
|
-
}
|
|
368
|
-
_nativeScrollTo(o) {
|
|
369
|
-
this._originalScrollTo.bind(this._element || window)(o);
|
|
370
|
-
}
|
|
371
|
-
_scrollTo(o, t = null, e = null) {
|
|
372
|
-
this._end !== null && this._end(), o.behavior === "smooth" ? (this._setDestination(o), this._retarget = t, this._end = e) : this._resetScrollState(), this._nativeScrollTo(o);
|
|
373
|
-
}
|
|
374
|
-
_setDestination(o) {
|
|
375
|
-
let { top: t, left: e } = o;
|
|
376
|
-
return t = t === void 0 ? void 0 : Math.max(0, Math.min(t, this.maxScrollTop)), e = e === void 0 ? void 0 : Math.max(0, Math.min(e, this.maxScrollLeft)), this._destination !== null && e === this._destination.left && t === this._destination.top ? !1 : (this.__destination = { top: t, left: e, behavior: "smooth" }, !0);
|
|
377
|
-
}
|
|
378
|
-
_resetScrollState() {
|
|
379
|
-
this.__destination = null, this._retarget = null, this._end = null;
|
|
380
|
-
}
|
|
381
|
-
_updateManagedScrollTo(o) {
|
|
382
|
-
this._destination && this._setDestination(o) && this._nativeScrollTo(this._destination);
|
|
383
|
-
}
|
|
384
|
-
managedScrollTo(o, t, e) {
|
|
385
|
-
return this._scrollTo(o, t, e), this._updateManagedScrollTo;
|
|
386
|
-
}
|
|
387
|
-
correctScrollError(o) {
|
|
388
|
-
this.correctingScrollError = !0, requestAnimationFrame(() => requestAnimationFrame(() => this.correctingScrollError = !1)), this._nativeScrollTo(o), this._retarget && this._setDestination(this._retarget()), this._destination && this._nativeScrollTo(this._destination);
|
|
389
|
-
}
|
|
390
|
-
_checkForArrival() {
|
|
391
|
-
if (this._destination !== null) {
|
|
392
|
-
const { scrollTop: o, scrollLeft: t } = this;
|
|
393
|
-
let { top: e, left: i } = this._destination;
|
|
394
|
-
e = Math.min(e || 0, this.maxScrollTop), i = Math.min(i || 0, this.maxScrollLeft);
|
|
395
|
-
const l = Math.abs(e - o), s = Math.abs(i - t);
|
|
396
|
-
l < 1 && s < 1 && (this._end && this._end(), this._resetScrollState());
|
|
397
|
-
}
|
|
398
|
-
}
|
|
399
|
-
detach(o) {
|
|
400
|
-
return this._clients.delete(o), this._clients.size === 0 && (this._node.scrollTo = this._originalScrollTo, this._node.scrollBy = this._originalScrollBy, this._node.scroll = this._originalScroll, this._node.removeEventListener("scroll", this._checkForArrival)), null;
|
|
401
|
-
}
|
|
402
|
-
_attach(o) {
|
|
403
|
-
this._clients.add(o), this._clients.size === 1 && (this._node.scrollTo = this.scrollTo, this._node.scrollBy = this.scrollBy, this._node.scroll = this.scrollTo, this._node.addEventListener("scroll", this._checkForArrival));
|
|
404
|
-
}
|
|
405
|
-
}
|
|
406
|
-
/**
|
|
407
|
-
* @license
|
|
408
|
-
* Copyright 2021 Google LLC
|
|
409
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
410
|
-
*/
|
|
411
|
-
let j = typeof window < "u" ? window.ResizeObserver : void 0;
|
|
412
|
-
const B = Symbol("virtualizerRef"), I = "virtualizer-sizer";
|
|
413
|
-
let U;
|
|
414
|
-
class Co {
|
|
415
|
-
constructor(o) {
|
|
416
|
-
if (this._benchmarkStart = null, this._layout = null, this._clippingAncestors = [], this._scrollSize = null, this._scrollError = null, this._childrenPos = null, this._childMeasurements = null, this._toBeMeasured = /* @__PURE__ */ new Map(), this._rangeChanged = !0, this._itemsChanged = !0, this._visibilityChanged = !0, this._scrollerController = null, this._isScroller = !1, this._sizer = null, this._hostElementRO = null, this._childrenRO = null, this._mutationObserver = null, this._scrollEventListeners = [], this._scrollEventListenerOptions = {
|
|
417
|
-
passive: !0
|
|
418
|
-
}, this._loadListener = this._childLoaded.bind(this), this._scrollIntoViewTarget = null, this._updateScrollIntoViewCoordinates = null, this._items = [], this._first = -1, this._last = -1, this._firstVisible = -1, this._lastVisible = -1, this._scheduled = /* @__PURE__ */ new WeakSet(), this._measureCallback = null, this._measureChildOverride = null, this._layoutCompletePromise = null, this._layoutCompleteResolver = null, this._layoutCompleteRejecter = null, this._pendingLayoutComplete = null, this._layoutInitialized = null, this._connected = !1, !o)
|
|
419
|
-
throw new Error("Virtualizer constructor requires a configuration object");
|
|
420
|
-
if (o.hostElement)
|
|
421
|
-
this._init(o);
|
|
422
|
-
else
|
|
423
|
-
throw new Error('Virtualizer configuration requires the "hostElement" property');
|
|
424
|
-
}
|
|
425
|
-
set items(o) {
|
|
426
|
-
Array.isArray(o) && o !== this._items && (this._itemsChanged = !0, this._items = o, this._schedule(this._updateLayout));
|
|
427
|
-
}
|
|
428
|
-
_init(o) {
|
|
429
|
-
this._isScroller = !!o.scroller, this._initHostElement(o);
|
|
430
|
-
const t = o.layout || {};
|
|
431
|
-
this._layoutInitialized = this._initLayout(t);
|
|
432
|
-
}
|
|
433
|
-
_initObservers() {
|
|
434
|
-
this._mutationObserver = new MutationObserver(this._finishDOMUpdate.bind(this)), this._hostElementRO = new j(() => this._hostElementSizeChanged()), this._childrenRO = new j(this._childrenSizeChanged.bind(this));
|
|
435
|
-
}
|
|
436
|
-
_initHostElement(o) {
|
|
437
|
-
const t = this._hostElement = o.hostElement;
|
|
438
|
-
this._applyVirtualizerStyles(), t[B] = this;
|
|
439
|
-
}
|
|
440
|
-
connected() {
|
|
441
|
-
this._initObservers();
|
|
442
|
-
const o = this._isScroller;
|
|
443
|
-
this._clippingAncestors = Io(this._hostElement, o), this._scrollerController = new Eo(this, this._clippingAncestors[0]), this._schedule(this._updateLayout), this._observeAndListen(), this._connected = !0;
|
|
444
|
-
}
|
|
445
|
-
_observeAndListen() {
|
|
446
|
-
this._mutationObserver.observe(this._hostElement, { childList: !0 }), this._hostElementRO.observe(this._hostElement), this._scrollEventListeners.push(window), window.addEventListener("scroll", this, this._scrollEventListenerOptions), this._clippingAncestors.forEach((o) => {
|
|
447
|
-
o.addEventListener("scroll", this, this._scrollEventListenerOptions), this._scrollEventListeners.push(o), this._hostElementRO.observe(o);
|
|
448
|
-
}), this._hostElementRO.observe(this._scrollerController.element), this._children.forEach((o) => this._childrenRO.observe(o)), this._scrollEventListeners.forEach((o) => o.addEventListener("scroll", this, this._scrollEventListenerOptions));
|
|
449
|
-
}
|
|
450
|
-
disconnected() {
|
|
451
|
-
var o, t, e, i;
|
|
452
|
-
this._scrollEventListeners.forEach((l) => l.removeEventListener("scroll", this, this._scrollEventListenerOptions)), this._scrollEventListeners = [], this._clippingAncestors = [], (o = this._scrollerController) == null || o.detach(this), this._scrollerController = null, (t = this._mutationObserver) == null || t.disconnect(), this._mutationObserver = null, (e = this._hostElementRO) == null || e.disconnect(), this._hostElementRO = null, (i = this._childrenRO) == null || i.disconnect(), this._childrenRO = null, this._rejectLayoutCompletePromise("disconnected"), this._connected = !1;
|
|
453
|
-
}
|
|
454
|
-
_applyVirtualizerStyles() {
|
|
455
|
-
const t = this._hostElement.style;
|
|
456
|
-
t.display = t.display || "block", t.position = t.position || "relative", t.contain = t.contain || "size layout", this._isScroller && (t.overflow = t.overflow || "auto", t.minHeight = t.minHeight || "150px");
|
|
457
|
-
}
|
|
458
|
-
_getSizer() {
|
|
459
|
-
const o = this._hostElement;
|
|
460
|
-
if (!this._sizer) {
|
|
461
|
-
let t = o.querySelector(`[${I}]`);
|
|
462
|
-
t || (t = document.createElement("div"), t.setAttribute(I, ""), o.appendChild(t)), Object.assign(t.style, {
|
|
463
|
-
position: "absolute",
|
|
464
|
-
margin: "-2px 0 0 0",
|
|
465
|
-
padding: 0,
|
|
466
|
-
visibility: "hidden",
|
|
467
|
-
fontSize: "2px"
|
|
468
|
-
}), t.textContent = " ", t.setAttribute(I, ""), this._sizer = t;
|
|
469
|
-
}
|
|
470
|
-
return this._sizer;
|
|
471
|
-
}
|
|
472
|
-
async updateLayoutConfig(o) {
|
|
473
|
-
await this._layoutInitialized;
|
|
474
|
-
const t = o.type || // The new config is compatible with the current layout,
|
|
475
|
-
// so we update the config and return true to indicate
|
|
476
|
-
// a successful update
|
|
477
|
-
U;
|
|
478
|
-
if (typeof t == "function" && this._layout instanceof t) {
|
|
479
|
-
const e = { ...o };
|
|
480
|
-
return delete e.type, this._layout.config = e, !0;
|
|
481
|
-
}
|
|
482
|
-
return !1;
|
|
483
|
-
}
|
|
484
|
-
async _initLayout(o) {
|
|
485
|
-
let t, e;
|
|
486
|
-
if (typeof o.type == "function") {
|
|
487
|
-
e = o.type;
|
|
488
|
-
const i = { ...o };
|
|
489
|
-
delete i.type, t = i;
|
|
490
|
-
} else
|
|
491
|
-
t = o;
|
|
492
|
-
e === void 0 && (U = e = (await import("../flow-D-0MTYCm.js")).FlowLayout), this._layout = new e((i) => this._handleLayoutMessage(i), t), this._layout.measureChildren && typeof this._layout.updateItemSizes == "function" && (typeof this._layout.measureChildren == "function" && (this._measureChildOverride = this._layout.measureChildren), this._measureCallback = this._layout.updateItemSizes.bind(this._layout)), this._layout.listenForChildLoadEvents && this._hostElement.addEventListener("load", this._loadListener, !0), this._schedule(this._updateLayout);
|
|
493
|
-
}
|
|
494
|
-
// TODO (graynorton): Rework benchmarking so that it has no API and
|
|
495
|
-
// instead is always on except in production builds
|
|
496
|
-
startBenchmarking() {
|
|
497
|
-
this._benchmarkStart === null && (this._benchmarkStart = window.performance.now());
|
|
498
|
-
}
|
|
499
|
-
stopBenchmarking() {
|
|
500
|
-
if (this._benchmarkStart !== null) {
|
|
501
|
-
const o = window.performance.now(), t = o - this._benchmarkStart, i = performance.getEntriesByName("uv-virtualizing", "measure").filter((l) => l.startTime >= this._benchmarkStart && l.startTime < o).reduce((l, s) => l + s.duration, 0);
|
|
502
|
-
return this._benchmarkStart = null, { timeElapsed: t, virtualizationTime: i };
|
|
503
|
-
}
|
|
504
|
-
return null;
|
|
505
|
-
}
|
|
506
|
-
_measureChildren() {
|
|
507
|
-
const o = {}, t = this._children, e = this._measureChildOverride || this._measureChild;
|
|
508
|
-
for (let i = 0; i < t.length; i++) {
|
|
509
|
-
const l = t[i], s = this._first + i;
|
|
510
|
-
(this._itemsChanged || this._toBeMeasured.has(l)) && (o[s] = e.call(this, l, this._items[s]));
|
|
511
|
-
}
|
|
512
|
-
this._childMeasurements = o, this._schedule(this._updateLayout), this._toBeMeasured.clear();
|
|
513
|
-
}
|
|
514
|
-
/**
|
|
515
|
-
* Returns the width, height, and margins of the given child.
|
|
516
|
-
*/
|
|
517
|
-
_measureChild(o) {
|
|
518
|
-
const { width: t, height: e } = o.getBoundingClientRect();
|
|
519
|
-
return Object.assign({ width: t, height: e }, So(o));
|
|
520
|
-
}
|
|
521
|
-
async _schedule(o) {
|
|
522
|
-
this._scheduled.has(o) || (this._scheduled.add(o), await Promise.resolve(), this._scheduled.delete(o), o.call(this));
|
|
523
|
-
}
|
|
524
|
-
async _updateDOM(o) {
|
|
525
|
-
this._scrollSize = o.scrollSize, this._adjustRange(o.range), this._childrenPos = o.childPositions, this._scrollError = o.scrollError || null;
|
|
526
|
-
const { _rangeChanged: t, _itemsChanged: e } = this;
|
|
527
|
-
this._visibilityChanged && (this._notifyVisibility(), this._visibilityChanged = !1), (t || e) && (this._notifyRange(), this._rangeChanged = !1), this._finishDOMUpdate();
|
|
528
|
-
}
|
|
529
|
-
_finishDOMUpdate() {
|
|
530
|
-
this._connected && (this._children.forEach((o) => this._childrenRO.observe(o)), this._checkScrollIntoViewTarget(this._childrenPos), this._positionChildren(this._childrenPos), this._sizeHostElement(this._scrollSize), this._correctScrollError(), this._benchmarkStart && "mark" in window.performance && window.performance.mark("uv-end"));
|
|
531
|
-
}
|
|
532
|
-
_updateLayout() {
|
|
533
|
-
this._layout && this._connected && (this._layout.items = this._items, this._updateView(), this._childMeasurements !== null && (this._measureCallback && this._measureCallback(this._childMeasurements), this._childMeasurements = null), this._layout.reflowIfNeeded(), this._benchmarkStart && "mark" in window.performance && window.performance.mark("uv-end"));
|
|
534
|
-
}
|
|
535
|
-
_handleScrollEvent() {
|
|
536
|
-
var o;
|
|
537
|
-
if (this._benchmarkStart && "mark" in window.performance) {
|
|
538
|
-
try {
|
|
539
|
-
window.performance.measure("uv-virtualizing", "uv-start", "uv-end");
|
|
540
|
-
} catch (t) {
|
|
541
|
-
console.warn("Error measuring performance data: ", t);
|
|
542
|
-
}
|
|
543
|
-
window.performance.mark("uv-start");
|
|
544
|
-
}
|
|
545
|
-
this._scrollerController.correctingScrollError === !1 && ((o = this._layout) == null || o.unpin()), this._schedule(this._updateLayout);
|
|
546
|
-
}
|
|
547
|
-
handleEvent(o) {
|
|
548
|
-
switch (o.type) {
|
|
549
|
-
case "scroll":
|
|
550
|
-
(o.currentTarget === window || this._clippingAncestors.includes(o.currentTarget)) && this._handleScrollEvent();
|
|
551
|
-
break;
|
|
552
|
-
default:
|
|
553
|
-
console.warn("event not handled", o);
|
|
554
|
-
}
|
|
555
|
-
}
|
|
556
|
-
_handleLayoutMessage(o) {
|
|
557
|
-
o.type === "stateChanged" ? this._updateDOM(o) : o.type === "visibilityChanged" ? (this._firstVisible = o.firstVisible, this._lastVisible = o.lastVisible, this._notifyVisibility()) : o.type === "unpinned" && this._hostElement.dispatchEvent(new F());
|
|
558
|
-
}
|
|
559
|
-
get _children() {
|
|
560
|
-
const o = [];
|
|
561
|
-
let t = this._hostElement.firstElementChild;
|
|
562
|
-
for (; t; )
|
|
563
|
-
t.hasAttribute(I) || o.push(t), t = t.nextElementSibling;
|
|
564
|
-
return o;
|
|
565
|
-
}
|
|
566
|
-
_updateView() {
|
|
567
|
-
var i;
|
|
568
|
-
const o = this._hostElement, t = (i = this._scrollerController) == null ? void 0 : i.element, e = this._layout;
|
|
569
|
-
if (o && t && e) {
|
|
570
|
-
let l, s, r, a;
|
|
571
|
-
const c = o.getBoundingClientRect();
|
|
572
|
-
l = 0, s = 0, r = window.innerHeight, a = window.innerWidth;
|
|
573
|
-
const m = this._clippingAncestors.map((E) => E.getBoundingClientRect());
|
|
574
|
-
m.unshift(c);
|
|
575
|
-
for (const E of m)
|
|
576
|
-
l = Math.max(l, E.top), s = Math.max(s, E.left), r = Math.min(r, E.bottom), a = Math.min(a, E.right);
|
|
577
|
-
const u = t.getBoundingClientRect(), d = {
|
|
578
|
-
left: c.left - u.left,
|
|
579
|
-
top: c.top - u.top
|
|
580
|
-
}, h = {
|
|
581
|
-
width: t.scrollWidth,
|
|
582
|
-
height: t.scrollHeight
|
|
583
|
-
}, p = l - c.top + o.scrollTop, v = s - c.left + o.scrollLeft, k = Math.max(0, r - l), x = Math.max(0, a - s);
|
|
584
|
-
e.viewportSize = { width: x, height: k }, e.viewportScroll = { top: p, left: v }, e.totalScrollSize = h, e.offsetWithinScroller = d;
|
|
585
|
-
}
|
|
586
|
-
}
|
|
587
|
-
/**
|
|
588
|
-
* Styles the host element so that its size reflects the
|
|
589
|
-
* total size of all items.
|
|
590
|
-
*/
|
|
591
|
-
_sizeHostElement(o) {
|
|
592
|
-
const e = o && o.width !== null ? Math.min(82e5, o.width) : 0, i = o && o.height !== null ? Math.min(82e5, o.height) : 0;
|
|
593
|
-
if (this._isScroller)
|
|
594
|
-
this._getSizer().style.transform = `translate(${e}px, ${i}px)`;
|
|
595
|
-
else {
|
|
596
|
-
const l = this._hostElement.style;
|
|
597
|
-
l.minWidth = e ? `${e}px` : "100%", l.minHeight = i ? `${i}px` : "100%";
|
|
598
|
-
}
|
|
599
|
-
}
|
|
600
|
-
/**
|
|
601
|
-
* Sets the top and left transform style of the children from the values in
|
|
602
|
-
* pos.
|
|
603
|
-
*/
|
|
604
|
-
_positionChildren(o) {
|
|
605
|
-
o && o.forEach(({ top: t, left: e, width: i, height: l, xOffset: s, yOffset: r }, a) => {
|
|
606
|
-
const c = this._children[a - this._first];
|
|
607
|
-
c && (c.style.position = "absolute", c.style.boxSizing = "border-box", c.style.transform = `translate(${e}px, ${t}px)`, i !== void 0 && (c.style.width = i + "px"), l !== void 0 && (c.style.height = l + "px"), c.style.left = s === void 0 ? null : s + "px", c.style.top = r === void 0 ? null : r + "px");
|
|
608
|
-
});
|
|
609
|
-
}
|
|
610
|
-
async _adjustRange(o) {
|
|
611
|
-
const { _first: t, _last: e, _firstVisible: i, _lastVisible: l } = this;
|
|
612
|
-
this._first = o.first, this._last = o.last, this._firstVisible = o.firstVisible, this._lastVisible = o.lastVisible, this._rangeChanged = this._rangeChanged || this._first !== t || this._last !== e, this._visibilityChanged = this._visibilityChanged || this._firstVisible !== i || this._lastVisible !== l;
|
|
613
|
-
}
|
|
614
|
-
_correctScrollError() {
|
|
615
|
-
if (this._scrollError) {
|
|
616
|
-
const { scrollTop: o, scrollLeft: t } = this._scrollerController, { top: e, left: i } = this._scrollError;
|
|
617
|
-
this._scrollError = null, this._scrollerController.correctScrollError({
|
|
618
|
-
top: o - e,
|
|
619
|
-
left: t - i
|
|
620
|
-
});
|
|
218
|
+
const $ = (a, o, t) => {
|
|
219
|
+
const l = /* @__PURE__ */ new Map();
|
|
220
|
+
for (let e = o; e <= t; e++) l.set(a[e], e);
|
|
221
|
+
return l;
|
|
222
|
+
}, lo = M(class extends W {
|
|
223
|
+
constructor(a) {
|
|
224
|
+
if (super(a), a.type !== R.CHILD) throw Error("repeat() can only be used in text expressions");
|
|
225
|
+
}
|
|
226
|
+
dt(a, o, t) {
|
|
227
|
+
let l;
|
|
228
|
+
t === void 0 ? t = o : o !== void 0 && (l = o);
|
|
229
|
+
const e = [], n = [];
|
|
230
|
+
let r = 0;
|
|
231
|
+
for (const i of a) e[r] = l ? l(i, r) : r, n[r] = t(i, r), r++;
|
|
232
|
+
return { values: n, keys: e };
|
|
233
|
+
}
|
|
234
|
+
render(a, o, t) {
|
|
235
|
+
return this.dt(a, o, t).values;
|
|
236
|
+
}
|
|
237
|
+
update(a, [o, t, l]) {
|
|
238
|
+
const e = G(a), { values: n, keys: r } = this.dt(o, t, l);
|
|
239
|
+
if (!Array.isArray(e)) return this.ut = r, n;
|
|
240
|
+
const i = this.ut ?? (this.ut = []), s = [];
|
|
241
|
+
let m, p, h = 0, u = e.length - 1, c = 0, d = n.length - 1;
|
|
242
|
+
for (; h <= u && c <= d; ) if (e[h] === null) h++;
|
|
243
|
+
else if (e[u] === null) u--;
|
|
244
|
+
else if (i[h] === r[c]) s[c] = y(e[h], n[c]), h++, c++;
|
|
245
|
+
else if (i[u] === r[d]) s[d] = y(e[u], n[d]), u--, d--;
|
|
246
|
+
else if (i[h] === r[d]) s[d] = y(e[h], n[d]), O(a, s[d + 1], e[h]), h++, d--;
|
|
247
|
+
else if (i[u] === r[c]) s[c] = y(e[u], n[c]), O(a, e[h], e[u]), u--, c++;
|
|
248
|
+
else if (m === void 0 && (m = $(r, c, d), p = $(i, h, u)), m.has(i[h])) if (m.has(i[u])) {
|
|
249
|
+
const v = p.get(r[c]), w = v !== void 0 ? e[v] : null;
|
|
250
|
+
if (w === null) {
|
|
251
|
+
const A = O(a, e[h]);
|
|
252
|
+
y(A, n[c]), s[c] = A;
|
|
253
|
+
} else s[c] = y(w, n[c]), O(a, e[h], w), e[v] = null;
|
|
254
|
+
c++;
|
|
255
|
+
} else E(e[u]), u--;
|
|
256
|
+
else E(e[h]), h++;
|
|
257
|
+
for (; c <= d; ) {
|
|
258
|
+
const v = O(a, s[d + 1]);
|
|
259
|
+
y(v, n[c]), s[c++] = v;
|
|
621
260
|
}
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
return o === 1 / 0 && (o = this._items.length - 1), ((t = this._items) == null ? void 0 : t[o]) === void 0 ? void 0 : {
|
|
626
|
-
scrollIntoView: (e = {}) => this._scrollElementIntoView({ ...e, index: o })
|
|
627
|
-
};
|
|
628
|
-
}
|
|
629
|
-
_scrollElementIntoView(o) {
|
|
630
|
-
if (o.index >= this._first && o.index <= this._last)
|
|
631
|
-
this._children[o.index - this._first].scrollIntoView(o);
|
|
632
|
-
else if (o.index = Math.min(o.index, this._items.length - 1), o.behavior === "smooth") {
|
|
633
|
-
const t = this._layout.getScrollIntoViewCoordinates(o), { behavior: e } = o;
|
|
634
|
-
this._updateScrollIntoViewCoordinates = this._scrollerController.managedScrollTo(Object.assign(t, { behavior: e }), () => this._layout.getScrollIntoViewCoordinates(o), () => this._scrollIntoViewTarget = null), this._scrollIntoViewTarget = o;
|
|
635
|
-
} else
|
|
636
|
-
this._layout.pin = o;
|
|
637
|
-
}
|
|
638
|
-
/**
|
|
639
|
-
* If we are smoothly scrolling to an element and the target element
|
|
640
|
-
* is in the DOM, we update our target coordinates as needed
|
|
641
|
-
*/
|
|
642
|
-
_checkScrollIntoViewTarget(o) {
|
|
643
|
-
const { index: t } = this._scrollIntoViewTarget || {};
|
|
644
|
-
t && (o != null && o.has(t)) && this._updateScrollIntoViewCoordinates(this._layout.getScrollIntoViewCoordinates(this._scrollIntoViewTarget));
|
|
645
|
-
}
|
|
646
|
-
/**
|
|
647
|
-
* Emits a rangechange event with the current first, last, firstVisible, and
|
|
648
|
-
* lastVisible.
|
|
649
|
-
*/
|
|
650
|
-
_notifyRange() {
|
|
651
|
-
this._hostElement.dispatchEvent(new R({ first: this._first, last: this._last }));
|
|
652
|
-
}
|
|
653
|
-
_notifyVisibility() {
|
|
654
|
-
this._hostElement.dispatchEvent(new $({
|
|
655
|
-
first: this._firstVisible,
|
|
656
|
-
last: this._lastVisible
|
|
657
|
-
}));
|
|
658
|
-
}
|
|
659
|
-
get layoutComplete() {
|
|
660
|
-
return this._layoutCompletePromise || (this._layoutCompletePromise = new Promise((o, t) => {
|
|
661
|
-
this._layoutCompleteResolver = o, this._layoutCompleteRejecter = t;
|
|
662
|
-
})), this._layoutCompletePromise;
|
|
663
|
-
}
|
|
664
|
-
_rejectLayoutCompletePromise(o) {
|
|
665
|
-
this._layoutCompleteRejecter !== null && this._layoutCompleteRejecter(o), this._resetLayoutCompleteState();
|
|
666
|
-
}
|
|
667
|
-
_scheduleLayoutComplete() {
|
|
668
|
-
this._layoutCompletePromise && this._pendingLayoutComplete === null && (this._pendingLayoutComplete = requestAnimationFrame(() => requestAnimationFrame(() => this._resolveLayoutCompletePromise())));
|
|
669
|
-
}
|
|
670
|
-
_resolveLayoutCompletePromise() {
|
|
671
|
-
this._layoutCompleteResolver !== null && this._layoutCompleteResolver(), this._resetLayoutCompleteState();
|
|
672
|
-
}
|
|
673
|
-
_resetLayoutCompleteState() {
|
|
674
|
-
this._layoutCompletePromise = null, this._layoutCompleteResolver = null, this._layoutCompleteRejecter = null, this._pendingLayoutComplete = null;
|
|
675
|
-
}
|
|
676
|
-
/**
|
|
677
|
-
* Render and update the view at the next opportunity with the given
|
|
678
|
-
* hostElement size.
|
|
679
|
-
*/
|
|
680
|
-
_hostElementSizeChanged() {
|
|
681
|
-
this._schedule(this._updateLayout);
|
|
682
|
-
}
|
|
683
|
-
// TODO (graynorton): Rethink how this works. Probably child loading is too specific
|
|
684
|
-
// to have dedicated support for; might want some more generic lifecycle hooks for
|
|
685
|
-
// layouts to use. Possibly handle measurement this way, too, or maybe that remains
|
|
686
|
-
// a first-class feature?
|
|
687
|
-
_childLoaded() {
|
|
688
|
-
}
|
|
689
|
-
// This is the callback for the ResizeObserver that watches the
|
|
690
|
-
// virtualizer's children. We land here at the end of every virtualizer
|
|
691
|
-
// update cycle that results in changes to physical items, and we also
|
|
692
|
-
// end up here if one or more children change size independently of
|
|
693
|
-
// the virtualizer update cycle.
|
|
694
|
-
_childrenSizeChanged(o) {
|
|
695
|
-
var t;
|
|
696
|
-
if ((t = this._layout) != null && t.measureChildren) {
|
|
697
|
-
for (const e of o)
|
|
698
|
-
this._toBeMeasured.set(e.target, e.contentRect);
|
|
699
|
-
this._measureChildren();
|
|
700
|
-
}
|
|
701
|
-
this._scheduleLayoutComplete(), this._itemsChanged = !1, this._rangeChanged = !1;
|
|
702
|
-
}
|
|
703
|
-
}
|
|
704
|
-
function So(n) {
|
|
705
|
-
const o = window.getComputedStyle(n);
|
|
706
|
-
return {
|
|
707
|
-
marginTop: A(o.marginTop),
|
|
708
|
-
marginRight: A(o.marginRight),
|
|
709
|
-
marginBottom: A(o.marginBottom),
|
|
710
|
-
marginLeft: A(o.marginLeft)
|
|
711
|
-
};
|
|
712
|
-
}
|
|
713
|
-
function A(n) {
|
|
714
|
-
const o = n ? parseFloat(n) : NaN;
|
|
715
|
-
return Number.isNaN(o) ? 0 : o;
|
|
716
|
-
}
|
|
717
|
-
function N(n) {
|
|
718
|
-
if (n.assignedSlot !== null)
|
|
719
|
-
return n.assignedSlot;
|
|
720
|
-
if (n.parentElement !== null)
|
|
721
|
-
return n.parentElement;
|
|
722
|
-
const o = n.parentNode;
|
|
723
|
-
return o && o.nodeType === Node.DOCUMENT_FRAGMENT_NODE && o.host || null;
|
|
724
|
-
}
|
|
725
|
-
function Oo(n, o = !1) {
|
|
726
|
-
const t = [];
|
|
727
|
-
let e = o ? n : N(n);
|
|
728
|
-
for (; e !== null; )
|
|
729
|
-
t.push(e), e = N(e);
|
|
730
|
-
return t;
|
|
731
|
-
}
|
|
732
|
-
function Io(n, o = !1) {
|
|
733
|
-
let t = !1;
|
|
734
|
-
return Oo(n, o).filter((e) => {
|
|
735
|
-
if (t)
|
|
736
|
-
return !1;
|
|
737
|
-
const i = getComputedStyle(e);
|
|
738
|
-
return t = i.position === "fixed", i.overflow !== "visible";
|
|
739
|
-
});
|
|
740
|
-
}
|
|
741
|
-
/**
|
|
742
|
-
* @license
|
|
743
|
-
* Copyright 2021 Google LLC
|
|
744
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
745
|
-
*/
|
|
746
|
-
const J = (n) => n, X = (n, o) => g`${o}: ${JSON.stringify(n, null, 2)}`;
|
|
747
|
-
class Ao extends ho {
|
|
748
|
-
constructor(o) {
|
|
749
|
-
if (super(o), this._virtualizer = null, this._first = 0, this._last = -1, this._renderItem = (t, e) => X(t, e + this._first), this._keyFunction = (t, e) => J(t, e + this._first), this._items = [], o.type !== K.CHILD)
|
|
750
|
-
throw new Error("The virtualize directive can only be used in child expressions");
|
|
751
|
-
}
|
|
752
|
-
render(o) {
|
|
753
|
-
o && this._setFunctions(o);
|
|
754
|
-
const t = [];
|
|
755
|
-
if (this._first >= 0 && this._last >= this._first)
|
|
756
|
-
for (let e = this._first; e <= this._last; e++)
|
|
757
|
-
t.push(this._items[e]);
|
|
758
|
-
return Z(t, this._keyFunction, this._renderItem);
|
|
759
|
-
}
|
|
760
|
-
update(o, [t]) {
|
|
761
|
-
this._setFunctions(t);
|
|
762
|
-
const e = this._items !== t.items;
|
|
763
|
-
return this._items = t.items || [], this._virtualizer ? this._updateVirtualizerConfig(o, t) : this._initialize(o, t), e ? H : this.render();
|
|
764
|
-
}
|
|
765
|
-
async _updateVirtualizerConfig(o, t) {
|
|
766
|
-
if (!await this._virtualizer.updateLayoutConfig(t.layout || {})) {
|
|
767
|
-
const i = o.parentNode;
|
|
768
|
-
this._makeVirtualizer(i, t);
|
|
261
|
+
for (; h <= u; ) {
|
|
262
|
+
const v = e[h++];
|
|
263
|
+
v !== null && E(v);
|
|
769
264
|
}
|
|
770
|
-
this.
|
|
771
|
-
}
|
|
772
|
-
_setFunctions(o) {
|
|
773
|
-
const { renderItem: t, keyFunction: e } = o;
|
|
774
|
-
t && (this._renderItem = (i, l) => t(i, l + this._first)), e && (this._keyFunction = (i, l) => e(i, l + this._first));
|
|
775
|
-
}
|
|
776
|
-
_makeVirtualizer(o, t) {
|
|
777
|
-
this._virtualizer && this._virtualizer.disconnected();
|
|
778
|
-
const { layout: e, scroller: i, items: l } = t;
|
|
779
|
-
this._virtualizer = new Co({ hostElement: o, layout: e, scroller: i }), this._virtualizer.items = l, this._virtualizer.connected();
|
|
780
|
-
}
|
|
781
|
-
_initialize(o, t) {
|
|
782
|
-
const e = o.parentNode;
|
|
783
|
-
e && e.nodeType === 1 && (e.addEventListener("rangeChanged", (i) => {
|
|
784
|
-
this._first = i.first, this._last = i.last, this.setValue(this.render());
|
|
785
|
-
}), this._makeVirtualizer(e, t));
|
|
786
|
-
}
|
|
787
|
-
disconnected() {
|
|
788
|
-
var o;
|
|
789
|
-
(o = this._virtualizer) == null || o.disconnected();
|
|
790
|
-
}
|
|
791
|
-
reconnected() {
|
|
792
|
-
var o;
|
|
793
|
-
(o = this._virtualizer) == null || o.connected();
|
|
794
|
-
}
|
|
795
|
-
}
|
|
796
|
-
const Lo = q(Ao);
|
|
797
|
-
/**
|
|
798
|
-
* @license
|
|
799
|
-
* Copyright 2021 Google LLC
|
|
800
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
801
|
-
*/
|
|
802
|
-
class C extends oo {
|
|
803
|
-
constructor() {
|
|
804
|
-
super(...arguments), this.items = [], this.renderItem = X, this.keyFunction = J, this.layout = {}, this.scroller = !1;
|
|
805
|
-
}
|
|
806
|
-
createRenderRoot() {
|
|
807
|
-
return this;
|
|
808
|
-
}
|
|
809
|
-
render() {
|
|
810
|
-
const { items: o, renderItem: t, keyFunction: e, layout: i, scroller: l } = this;
|
|
811
|
-
return g`${Lo({
|
|
812
|
-
items: o,
|
|
813
|
-
renderItem: t,
|
|
814
|
-
keyFunction: e,
|
|
815
|
-
layout: i,
|
|
816
|
-
scroller: l
|
|
817
|
-
})}`;
|
|
818
|
-
}
|
|
819
|
-
element(o) {
|
|
820
|
-
var t;
|
|
821
|
-
return (t = this[B]) == null ? void 0 : t.element(o);
|
|
822
|
-
}
|
|
823
|
-
get layoutComplete() {
|
|
824
|
-
var o;
|
|
825
|
-
return (o = this[B]) == null ? void 0 : o.layoutComplete;
|
|
265
|
+
return this.ut = r, J(a, s), Z;
|
|
826
266
|
}
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
* lit-virtualizer. It is deprecated and will likely be removed in the 1.0.0 release.
|
|
830
|
-
*/
|
|
831
|
-
scrollToIndex(o, t = "start") {
|
|
832
|
-
var e;
|
|
833
|
-
(e = this.element(o)) == null || e.scrollIntoView({ block: t });
|
|
834
|
-
}
|
|
835
|
-
}
|
|
836
|
-
O([
|
|
837
|
-
f({ attribute: !1 })
|
|
838
|
-
], C.prototype, "items", void 0);
|
|
839
|
-
O([
|
|
840
|
-
f()
|
|
841
|
-
], C.prototype, "renderItem", void 0);
|
|
842
|
-
O([
|
|
843
|
-
f()
|
|
844
|
-
], C.prototype, "keyFunction", void 0);
|
|
845
|
-
O([
|
|
846
|
-
f({ attribute: !1 })
|
|
847
|
-
], C.prototype, "layout", void 0);
|
|
848
|
-
O([
|
|
849
|
-
f({ reflect: !0, type: Boolean })
|
|
850
|
-
], C.prototype, "scroller", void 0);
|
|
851
|
-
/**
|
|
852
|
-
* @license
|
|
853
|
-
* Copyright 2021 Google LLC
|
|
854
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
855
|
-
*/
|
|
856
|
-
customElements.define("lit-virtualizer", C);
|
|
857
|
-
const To = ":host{--options-divider-thickness: var( --divider-thickness-medium, var(--luzmo-border-width) );inline-size:auto;margin-block:var(--luzmo-options-section-divider-margin-block, max(0px, (var(--option-section-divider-height) - var(--options-divider-thickness)) / 2));margin-inline:var(--luzmo-option-label-inline-edge-to-content, var(--option-label-inline-edge-to-content));overflow:visible}:host{display:block;flex-shrink:0}";
|
|
858
|
-
class Vo extends G(W, {
|
|
267
|
+
}), ro = ":host{--options-divider-thickness: var( --divider-thickness-medium, var(--luzmo-border-width) );inline-size:auto;margin-block:var(--luzmo-options-section-divider-margin-block, max(0px, (var(--option-section-divider-height) - var(--options-divider-thickness)) / 2));margin-inline:var(--luzmo-option-label-inline-edge-to-content, var(--option-label-inline-edge-to-content));overflow:visible}:host{display:block;flex-shrink:0}";
|
|
268
|
+
class no extends L(U, {
|
|
859
269
|
validSizes: ["s", "m", "l"]
|
|
860
270
|
}) {
|
|
861
271
|
static get styles() {
|
|
862
|
-
return [
|
|
272
|
+
return [C(Q), C(ro)];
|
|
863
273
|
}
|
|
864
274
|
firstUpdated(o) {
|
|
865
275
|
super.firstUpdated(o), this.setAttribute("role", "separator");
|
|
866
276
|
}
|
|
867
277
|
}
|
|
868
|
-
const
|
|
869
|
-
var
|
|
870
|
-
for (var
|
|
871
|
-
(
|
|
872
|
-
return
|
|
278
|
+
const ao = ":host{--option-top-to-action: var(--luzmo-spacing-1);--option-top-to-checkbox: var(--luzmo-spacing-1);--option-label-line-height: var(--luzmo-line-height);--option-label-line-height-cjk: 1.5;--option-label-to-description-spacing: 1px;--option-focus-indicator-width: var(--luzmo-indicator-width);--option-focus-indicator-color: var(--luzmo-indicator-color);--option-label-to-value-area-min-spacing: var(--luzmo-spacing-3);--option-label-content-color-default: var(--luzmo-font-color);--option-label-content-color-hover: var(--luzmo-font-color-hover);--option-label-content-color-down: var(--luzmo-font-color-down);--option-label-content-color-focus: var(--luzmo-font-color-focus);--option-label-icon-color-default: var(--luzmo-font-color);--option-label-icon-color-hover: var(--luzmo-font-color-hover);--option-label-icon-color-down: var(--luzmo-font-color-down);--option-label-icon-color-focus: var(--luzmo-font-color-focus);--option-highlight-selected-label-background-color: var(--luzmo-primary);--option-highlight-selected-label-content-color: var( --luzmo-primary-inverse-color );--option-highlight-selected-label-content-color-hover: var( --luzmo-primary-inverse-color );--option-highlight-selected-label-content-color-down: var( --luzmo-primary-inverse-color );--option-highlight-selected-label-content-color-focus: var( --luzmo-primary-inverse-color );--option-label-content-color-disabled: var(--luzmo-font-color-disabled);--option-label-icon-color-disabled: var(--luzmo-font-color-disabled);--option-description-line-height: var(--luzmo-line-height);--option-description-line-height-cjk: 1.5;--option-description-color-default: var(--luzmo-font-color);--option-description-color-hover: var(--luzmo-font-color-hover);--option-description-color-down: var(--luzmo-font-color-down);--option-description-color-focus: var(--luzmo-font-color-focus);--option-description-color-disabled: var(--luzmo-disabled-color);--options-section-header-line-height: var(--luzmo-line-height);--options-section-header-line-height-cjk: 1.5;--options-section-header-font-weight: bold;--options-section-header-color: var(--luzmo-font-color-hard);--options-collapsible-icon-color: var(--luzmo-font-color-hard);--options-checkmark-icon-color-default: var(--luzmo-font-color);--options-checkmark-icon-color-hover: var(--luzmo-font-color-hover);--options-checkmark-icon-color-down: var(--luzmo-font-color-down);--options-checkmark-icon-color-focus: var(--luzmo-font-color-focus);--options-checkbox-icon-color-default: var(--luzmo-font-color);--options-checkbox-icon-color-hover: var(--luzmo-font-color-hover);--options-checkbox-icon-color-down: var(--luzmo-font-color-down);--options-checkbox-icon-color-focus: var(--luzmo-font-color-focus);--options-drillin-icon-color-default: var(--luzmo-font-color);--options-drillin-icon-color-hover: var(--luzmo-font-color-hover);--options-drillin-icon-color-down: var(--luzmo-font-color-down);--options-drillin-icon-color-focus: var(--luzmo-font-color-focus);--option-value-color-default: var(--luzmo-font-color);--option-value-color-hover: var(--luzmo-font-color-hover);--option-value-color-down: var(--luzmo-font-color-down);--option-value-color-focus: var(--luzmo-font-color-focus);--option-collapsible-no-icon-suboption-padding-x-start: 28px;--option-background-color-selected: var(--luzmo-background-color);--option-background-color-default: var(--luzmo-background-color);--option-background-color-hover: var(--luzmo-background-color-hover);--option-background-color-down: var(--luzmo-background-color-down);--option-background-color-key-focus: var(--luzmo-background-color-focus)}:host{--option-min-height: var(--luzmo-component-height);--option-icon-container-height: 18px;--options-pending-height: var(--option-min-height);--progress-circle-size: calc( var(--options-pending-height) - var(--option-top-edge-to-text) - var( --option-bottom-edge-to-text ) );--option-icon-height: var(--luzmo-font-size-l);--option-icon-width: var(--luzmo-font-size-l);--option-label-font-size: var(--luzmo-font-size);--option-label-text-to-visual: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--option-label-text-to-control: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--option-label-inline-edge-to-content: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--pending-inline-edge-to-content: var(--option-label-inline-edge-to-content);--option-top-edge-to-text: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--option-bottom-edge-to-text: var(--luzmo-spacing-3);--option-description-font-size: var(--luzmo-font-size-xs);--options-section-header-font-size: var(--luzmo-font-size);--options-section-header-min-width: var(--luzmo-component-height);--option-selectable-edge-to-text-not-selected: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--option-checkmark-size: var(--luzmo-font-size-xs);--option-checkbox-size: var(--luzmo-font-size-xs);--option-top-to-checkmark: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--option-top-to-checkbox: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) )}:host([size=s]){--option-min-height: var(--luzmo-component-height-s);--option-icon-container-height: 17px;--option-icon-height: var(--luzmo-font-size);--option-icon-width: var(--luzmo-font-size);--option-label-font-size: var(--luzmo-font-size-s);--option-label-text-to-visual: var(--luzmo-spacing-3);--option-label-text-to-control: var(--luzmo-spacing-3);--option-label-inline-edge-to-content: var(--luzmo-spacing-3);--option-top-edge-to-text: calc( var(--luzmo-spacing-1) + var(--luzmo-spacing-2) );--option-bottom-edge-to-text: var(--luzmo-spacing-2);--option-description-font-size: var(--luzmo-font-size-xs);--options-section-header-font-size: var(--luzmo-font-size-s);--options-section-header-min-width: var(--luzmo-component-height-s);--option-selectable-edge-to-text-not-selected: var(--luzmo-spacing-3);--option-checkmark-size: var(--luzmo-font-size-xs);--option-checkbox-size: var(--luzmo-font-size-xs);--option-top-to-checkmark: var(--luzmo-spacing-3);--option-top-to-checkbox: var(--luzmo-spacing-3)}:host([size=l]){--option-min-height: var(--luzmo-component-height-l);--option-icon-container-height: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--option-icon-height: var(--luzmo-font-size-l);--option-icon-width: var(--luzmo-font-size-l);--option-label-font-size: var(--luzmo-font-size-l);--option-label-text-to-visual: var(--luzmo-spacing-4);--option-label-text-to-control: var(--luzmo-spacing-4);--option-label-inline-edge-to-content: var(--luzmo-spacing-4);--option-top-edge-to-text: var(--luzmo-spacing-4);--option-bottom-edge-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--option-description-font-size: var(--luzmo-font-size-s);--options-section-header-font-size: var(--luzmo-font-size-l);--options-section-header-min-width: var(--luzmo-component-height-l);--option-selectable-edge-to-text-not-selected: var(--luzmo-spacing-4);--option-checkmark-size: var(--luzmo-font-size-s);--option-checkbox-size: var(--luzmo-font-size-s);--option-top-to-checkmark: var(--luzmo-spacing-4);--option-top-to-checkbox: var(--luzmo-spacing-4)}:host([size=xl]){--option-min-height: var(--luzmo-component-height-xl);--option-icon-container-height: 26px;--option-icon-height: var(--luzmo-font-size-xl);--option-icon-width: var(--luzmo-font-size-xl);--option-label-font-size: var(--luzmo-font-size-xl);--option-label-text-to-visual: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--option-label-text-to-control: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--option-label-inline-edge-to-content: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--option-top-edge-to-text: var(--luzmo-spacing-4);--option-bottom-edge-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--option-description-font-size: var(--luzmo-font-size);--options-section-header-font-size: var(--luzmo-font-size-xl);--options-section-header-min-width: var(--luzmo-component-height-xl);--option-selectable-edge-to-text-not-selected: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--option-checkmark-size: var(--luzmo-font-size);--option-checkbox-size: var(--luzmo-font-size);--option-top-to-checkmark: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--option-top-to-checkbox: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) )}@media (forced-colors: active){:host{--highcontrast-option-background-color-default: ButtonFace;--highcontrast-option-color-default: ButtonText;--highcontrast-option-background-color-focus: Highlight;--highcontrast-option-color-focus: HighlightText;--highcontrast-options-checkmark-icon-color-default: Highlight;--highcontrast-options-checkbox-icon-color-default: Highlight;--highcontrast-option-color-disabled: GrayText;--highcontrast-option-focus-indicator-color: Highlight;--highcontrast-option-selected-background-color: Highlight;--highcontrast-option-selected-color: HighlightText}@supports (color: SelectedItem){:host{--highcontrast-option-selected-background-color: SelectedItem;--highcontrast-option-selected-color: SelectedItemText}}}:host{inline-size:auto;inline-size:var(--luzmo-options-inline-size, auto);box-sizing:border-box;margin:0;padding:0;list-style-type:none;display:inline-block;overflow:auto}:host:lang(ja),:host:lang(ko),:host:lang(zh){--option-label-line-height: var( --luzmo-option-label-line-height-cjk, var(--option-label-line-height-cjk) );--option-description-line-height: var( --luzmo-option-description-line-height-cjk, var(--option-description-line-height-cjk) );--options-section-header-line-height: var( --luzmo-options-section-header-line-height-cjk, var(--options-section-header-line-height-cjk) )}luzmo-option{width:100%}#pending{display:flex;flex-shrink:0;align-items:center;height:var(--options-pending-height);padding-inline:var(--pending-inline-edge-to-content)}:host{display:inline-flex;flex-direction:column;width:100%}:host(:focus){outline:none}::slotted(*){flex-shrink:0}";
|
|
279
|
+
var co = Object.defineProperty, x = (a, o, t, l) => {
|
|
280
|
+
for (var e = void 0, n = a.length - 1, r; n >= 0; n--)
|
|
281
|
+
(r = a[n]) && (e = r(o, t, e) || e);
|
|
282
|
+
return e && co(o, t, e), e;
|
|
873
283
|
};
|
|
874
|
-
const
|
|
875
|
-
function
|
|
876
|
-
return !!o && (
|
|
284
|
+
const so = 25;
|
|
285
|
+
function ho(a, o) {
|
|
286
|
+
return !!o && (a === o || a.contains(o));
|
|
877
287
|
}
|
|
878
|
-
class z extends
|
|
288
|
+
class z extends L(U, {
|
|
879
289
|
noDefaultSize: !0
|
|
880
290
|
}) {
|
|
881
291
|
constructor() {
|
|
@@ -885,26 +295,26 @@ class z extends G(W, {
|
|
|
885
295
|
* @internal
|
|
886
296
|
*/
|
|
887
297
|
static get styles() {
|
|
888
|
-
return [
|
|
298
|
+
return [C(ao)];
|
|
889
299
|
}
|
|
890
300
|
/**
|
|
891
301
|
* @internal
|
|
892
302
|
*/
|
|
893
303
|
get _virtualizeActive() {
|
|
894
|
-
return this.options.length >
|
|
304
|
+
return this.options.length > so;
|
|
895
305
|
}
|
|
896
306
|
firstUpdated(o) {
|
|
897
307
|
super.firstUpdated(o), this.hasAttribute("tabindex") || (this.tabIndex = 0);
|
|
898
308
|
const t = [
|
|
899
|
-
new Promise((
|
|
309
|
+
new Promise((l) => requestAnimationFrame(() => l(!0)))
|
|
900
310
|
];
|
|
901
|
-
[...this.children].forEach((
|
|
902
|
-
|
|
311
|
+
[...this.children].forEach((l) => {
|
|
312
|
+
l.localName === "luzmo-option" && t.push(l.updateComplete);
|
|
903
313
|
}), this.optionElementsUpdated = Promise.all(t);
|
|
904
314
|
}
|
|
905
315
|
willUpdate(o) {
|
|
906
|
-
var
|
|
907
|
-
o.has("selects") && this.selects === "single" && ((
|
|
316
|
+
var l;
|
|
317
|
+
o.has("selects") && this.selects === "single" && ((l = this.value) == null ? void 0 : l.length) > 1 && (this.value = this.value.slice(0, 1));
|
|
908
318
|
}
|
|
909
319
|
updated(o) {
|
|
910
320
|
super.updated(o), o.has("label") && (this.label || o.get("label") !== void 0) && (this.label ? this.setAttribute("aria-label", this.label) : this.removeAttribute("aria-label"));
|
|
@@ -931,7 +341,7 @@ class z extends G(W, {
|
|
|
931
341
|
}
|
|
932
342
|
// when the focus is lost in the options menu, we need to remove the focus from the item, stop listening to keyboard events and clean up the aria-activedescendant
|
|
933
343
|
handleBlur(o) {
|
|
934
|
-
|
|
344
|
+
ho(this, o.relatedTarget) || (this.stopListeningToKeyboard(), this._removeFocusedPropertyOnOptions(), this.removeAttribute("aria-activedescendant"));
|
|
935
345
|
}
|
|
936
346
|
startListeningToKeyboard() {
|
|
937
347
|
this.addEventListener("keydown", this.handleKeydown);
|
|
@@ -940,70 +350,70 @@ class z extends G(W, {
|
|
|
940
350
|
this.removeEventListener("keydown", this.handleKeydown);
|
|
941
351
|
}
|
|
942
352
|
handleKeydown(o) {
|
|
943
|
-
var
|
|
353
|
+
var n;
|
|
944
354
|
if (o.defaultPrevented)
|
|
945
355
|
return;
|
|
946
|
-
const t = this.focusedOptionIndex,
|
|
947
|
-
(
|
|
948
|
-
var
|
|
949
|
-
return ((
|
|
356
|
+
const t = this.focusedOptionIndex, l = [...this.visibleOptionElements].find(
|
|
357
|
+
(r) => {
|
|
358
|
+
var i, s, m, p;
|
|
359
|
+
return ((i = r.value) == null ? void 0 : i.toString()) === ((p = (m = (s = this.options) == null ? void 0 : s[t]) == null ? void 0 : m.value) == null ? void 0 : p.toString());
|
|
950
360
|
}
|
|
951
|
-
), { key:
|
|
952
|
-
if (
|
|
361
|
+
), { key: e } = o;
|
|
362
|
+
if (e === "Tab") {
|
|
953
363
|
this.prepareToCleanUp();
|
|
954
364
|
return;
|
|
955
365
|
}
|
|
956
|
-
if (
|
|
957
|
-
o.preventDefault(),
|
|
366
|
+
if (e === " " || e === "Enter") {
|
|
367
|
+
o.preventDefault(), l && this.toggleOption(o, (n = this.options) == null ? void 0 : n[t]);
|
|
958
368
|
return;
|
|
959
369
|
}
|
|
960
|
-
if (
|
|
961
|
-
o.preventDefault(), this.navigateWithinOptions(o,
|
|
370
|
+
if (e === "ArrowDown" || e === "ArrowUp") {
|
|
371
|
+
o.preventDefault(), this.navigateWithinOptions(o, l);
|
|
962
372
|
return;
|
|
963
373
|
}
|
|
964
374
|
}
|
|
965
375
|
navigateWithinOptions(o, t) {
|
|
966
|
-
const { key:
|
|
376
|
+
const { key: l } = o, e = l === "ArrowDown" ? 1 : -1;
|
|
967
377
|
o.preventDefault(), o.stopPropagation();
|
|
968
|
-
const
|
|
969
|
-
|
|
378
|
+
const n = this.focusOptionByOffset(
|
|
379
|
+
e,
|
|
970
380
|
t,
|
|
971
381
|
!0
|
|
972
382
|
);
|
|
973
|
-
|
|
383
|
+
n !== t && (this._virtualizeActive || n == null || n.scrollIntoView({ block: "nearest" }));
|
|
974
384
|
}
|
|
975
|
-
focusOptionByOffset(o, t,
|
|
976
|
-
var
|
|
977
|
-
const
|
|
385
|
+
focusOptionByOffset(o, t, l) {
|
|
386
|
+
var h;
|
|
387
|
+
const e = o || 1;
|
|
978
388
|
t && (t.focused = !1);
|
|
979
|
-
const
|
|
389
|
+
const n = this.focusedOptionIndex;
|
|
980
390
|
this.focusedOptionIndex = this.options.length > 0 ? (this.options.length + this.focusedOptionIndex + o) % this.options.length : 0;
|
|
981
|
-
let
|
|
982
|
-
for (; (
|
|
983
|
-
|
|
984
|
-
const
|
|
985
|
-
(
|
|
986
|
-
new Event(`luzmo-exceeded-${
|
|
391
|
+
let r = this.options[this.focusedOptionIndex], i = this.options.length;
|
|
392
|
+
for (; (r != null && r.disabled || r != null && r.divider) && i; )
|
|
393
|
+
i -= 1, this.focusedOptionIndex = (this.options.length + this.focusedOptionIndex + e) % this.options.length, r = this.options[this.focusedOptionIndex];
|
|
394
|
+
const s = n < this.focusedOptionIndex && o === -1, m = n > this.focusedOptionIndex && o === 1;
|
|
395
|
+
(s || m) && (this.focusedOptionIndex = n, this.dispatchEvent(
|
|
396
|
+
new Event(`luzmo-exceeded-${s ? "top" : "bottom"}`, {
|
|
987
397
|
bubbles: !0,
|
|
988
398
|
composed: !0,
|
|
989
399
|
cancelable: !0
|
|
990
400
|
})
|
|
991
401
|
));
|
|
992
|
-
let
|
|
993
|
-
return
|
|
994
|
-
(
|
|
995
|
-
var
|
|
996
|
-
return ((
|
|
402
|
+
let p;
|
|
403
|
+
return l && this._virtualizeActive && (p = [...this.visibleOptionElements].find(
|
|
404
|
+
(u) => {
|
|
405
|
+
var c, d, v;
|
|
406
|
+
return ((c = u.value) == null ? void 0 : c.toString()) === ((v = (d = this.options[this.focusedOptionIndex]) == null ? void 0 : d.value) == null ? void 0 : v.toString());
|
|
997
407
|
}
|
|
998
|
-
),
|
|
408
|
+
), p || (this.focusedOptionIndex = this._firstVisibleIndex)), this._virtualizeActive && l && ((h = this.virtualizer.element(this.focusedOptionIndex)) == null || h.scrollIntoView({
|
|
999
409
|
behavior: "smooth",
|
|
1000
410
|
block: "nearest"
|
|
1001
|
-
})),
|
|
1002
|
-
(
|
|
1003
|
-
var
|
|
1004
|
-
return (
|
|
411
|
+
})), p = p ?? [...this.visibleOptionElements].find(
|
|
412
|
+
(u) => {
|
|
413
|
+
var c, d, v, w, A;
|
|
414
|
+
return (u.value === null ? null : (c = u.value) == null ? void 0 : c.toString()) === (((d = this.options[this.focusedOptionIndex]) == null ? void 0 : d.value) === null ? (v = this.options[this.focusedOptionIndex]) == null ? void 0 : v.value : (A = (w = this.options[this.focusedOptionIndex]) == null ? void 0 : w.value) == null ? void 0 : A.toString());
|
|
1005
415
|
}
|
|
1006
|
-
),
|
|
416
|
+
), r != null && r.disabled || this.setFocusedAndActiveDescendant(p), p;
|
|
1007
417
|
}
|
|
1008
418
|
updateSelectedItemIndex() {
|
|
1009
419
|
this.focusedOptionIndex = this._virtualizeActive ? this._firstVisibleIndex : 0;
|
|
@@ -1033,21 +443,21 @@ class z extends G(W, {
|
|
|
1033
443
|
);
|
|
1034
444
|
}
|
|
1035
445
|
async toggleOption(o, t) {
|
|
1036
|
-
var
|
|
1037
|
-
const
|
|
1038
|
-
(
|
|
446
|
+
var r;
|
|
447
|
+
const l = o instanceof KeyboardEvent, e = this.options.findIndex(
|
|
448
|
+
(i) => (i == null ? void 0 : i.value) === (t == null ? void 0 : t.value)
|
|
1039
449
|
);
|
|
1040
|
-
this.focusedOptionIndex =
|
|
1041
|
-
var
|
|
1042
|
-
if (
|
|
1043
|
-
const
|
|
1044
|
-
|
|
450
|
+
this.focusedOptionIndex = e, this.visibleOptionElements.forEach((i) => {
|
|
451
|
+
var s, m;
|
|
452
|
+
if (l) {
|
|
453
|
+
const p = ((i == null ? void 0 : i.value) === null ? null : (s = i.value) == null ? void 0 : s.toString()) === ((t == null ? void 0 : t.value) === null ? null : (m = t == null ? void 0 : t.value) == null ? void 0 : m.toString());
|
|
454
|
+
i.focused = p, p && this.setFocusedAndActiveDescendant(i);
|
|
1045
455
|
} else
|
|
1046
|
-
|
|
456
|
+
i.focused = !1;
|
|
1047
457
|
});
|
|
1048
|
-
const
|
|
1049
|
-
this.selects === "single" ? (this.value = [t == null ? void 0 : t.value], this._selectedOptions = [t]) : (this.value =
|
|
1050
|
-
(
|
|
458
|
+
const n = Array.isArray(this.value) && ((r = this.value) == null ? void 0 : r.includes((t == null ? void 0 : t.value) ?? null));
|
|
459
|
+
this.selects === "single" ? (this.value = [t == null ? void 0 : t.value], this._selectedOptions = [t]) : (this.value = n ? this.value.filter((i) => i !== (t == null ? void 0 : t.value)) : [...this.value ?? [], t == null ? void 0 : t.value], this._selectedOptions = n ? this._selectedOptions.filter(
|
|
460
|
+
(i) => i.value !== t.value
|
|
1051
461
|
) : [...this._selectedOptions, t]), await this.updateComplete, this.dispatchEvent(
|
|
1052
462
|
new CustomEvent("change", {
|
|
1053
463
|
bubbles: !0,
|
|
@@ -1063,40 +473,40 @@ class z extends G(W, {
|
|
|
1063
473
|
this.toggleOption(t, o);
|
|
1064
474
|
}
|
|
1065
475
|
render() {
|
|
1066
|
-
const o = (
|
|
476
|
+
const o = (i) => g`<luzmo-icon
|
|
1067
477
|
slot="icon"
|
|
1068
|
-
.icon=${
|
|
478
|
+
.icon=${i}
|
|
1069
479
|
.size=${this.size}
|
|
1070
|
-
></luzmo-icon>`, t = (
|
|
480
|
+
></luzmo-icon>`, t = (i) => g`<span slot="description">${i}</span>`, l = (i) => g`<luzmo-icon
|
|
1071
481
|
slot="icon"
|
|
1072
|
-
.src=${
|
|
482
|
+
.src=${i}
|
|
1073
483
|
.size=${this.size}
|
|
1074
|
-
></luzmo-icon>`,
|
|
484
|
+
></luzmo-icon>`, e = (i) => {
|
|
1075
485
|
var v;
|
|
1076
|
-
const
|
|
1077
|
-
return
|
|
1078
|
-
.value=${
|
|
486
|
+
const s = i == null ? void 0 : i.value, m = i == null ? void 0 : i.label, p = i == null ? void 0 : i.description, h = i == null ? void 0 : i.icon, u = i == null ? void 0 : i.imgSrc, c = i == null ? void 0 : i.divider, d = typeof i == "string" || i == null ? void 0 : i.disabled;
|
|
487
|
+
return c ? g`<luzmo-options-divider></luzmo-options-divider>` : g`<luzmo-option
|
|
488
|
+
.value=${s}
|
|
1079
489
|
.size=${this.size}
|
|
1080
490
|
.variant=${this.variant}
|
|
1081
491
|
?emphasized=${this.emphasized}
|
|
1082
492
|
?no-wrap=${this.noWrap}
|
|
1083
|
-
?disabled=${
|
|
1084
|
-
.selected=${Array.isArray(this.value) ? (v = this.value) == null ? void 0 : v.includes(
|
|
493
|
+
?disabled=${d}
|
|
494
|
+
.selected=${Array.isArray(this.value) ? (v = this.value) == null ? void 0 : v.includes(s) : !1}
|
|
1085
495
|
.role=${this.selects === "single" ? "option" : "optioncheckbox"}
|
|
1086
|
-
@click=${this.handleOptionClick.bind(this,
|
|
496
|
+
@click=${this.handleOptionClick.bind(this, i)}
|
|
1087
497
|
>
|
|
1088
|
-
${
|
|
1089
|
-
${
|
|
498
|
+
${h ? o(h) : u ? l(u) : I}
|
|
499
|
+
${m} ${p ? t(p) : I}
|
|
1090
500
|
</luzmo-option>`;
|
|
1091
|
-
},
|
|
501
|
+
}, n = this._virtualizeActive ? g`<lit-virtualizer
|
|
1092
502
|
.items=${this.options}
|
|
1093
|
-
.renderItem=${
|
|
503
|
+
.renderItem=${e}
|
|
1094
504
|
@rangeChanged=${this.rangeChange}
|
|
1095
505
|
@visibilityChanged=${this.visibilityChanged}
|
|
1096
|
-
></lit-virtualizer>` :
|
|
506
|
+
></lit-virtualizer>` : lo(this.options, e), r = this.pending ? g`<div id="pending">
|
|
1097
507
|
<luzmo-progress-circle indeterminate></luzmo-progress-circle>
|
|
1098
|
-
</div>` :
|
|
1099
|
-
return g`${
|
|
508
|
+
</div>` : I;
|
|
509
|
+
return g`${n} ${r}`;
|
|
1100
510
|
}
|
|
1101
511
|
connectedCallback() {
|
|
1102
512
|
super.connectedCallback(), this.setAttribute("role", "listbox"), this.updateComplete.then(() => this.updateItemFocus());
|
|
@@ -1119,59 +529,59 @@ class z extends G(W, {
|
|
|
1119
529
|
if (this.visibleOptionElements.length === 0)
|
|
1120
530
|
return;
|
|
1121
531
|
const o = this.focusedOptionIndex, t = [...this.visibleOptionElements].find(
|
|
1122
|
-
(
|
|
1123
|
-
var
|
|
1124
|
-
return (
|
|
532
|
+
(l) => {
|
|
533
|
+
var e, n, r, i, s, m;
|
|
534
|
+
return (l.value === null ? null : (e = l.value) == null ? void 0 : e.toString()) === (((r = (n = this.options) == null ? void 0 : n[o]) == null ? void 0 : r.value) === null ? null : (m = (s = (i = this.options) == null ? void 0 : i[o]) == null ? void 0 : s.value) == null ? void 0 : m.toString());
|
|
1125
535
|
}
|
|
1126
536
|
);
|
|
1127
537
|
this.setFocusedAndActiveDescendant(t);
|
|
1128
538
|
}
|
|
1129
539
|
setFocusedAndActiveDescendant(o) {
|
|
1130
|
-
var
|
|
540
|
+
var l, e;
|
|
1131
541
|
if (!o)
|
|
1132
542
|
return;
|
|
1133
|
-
const t = this.hasVisibleFocusInTree() || !!((
|
|
1134
|
-
(
|
|
543
|
+
const t = this.hasVisibleFocusInTree() || !!((l = this.visibleOptionElements) != null && l.some && ((e = this.visibleOptionElements) != null && e.some(
|
|
544
|
+
(n) => n.hasVisibleFocusInTree()
|
|
1135
545
|
)));
|
|
1136
546
|
o.focused = t, t && this.setAttribute("aria-activedescendant", o.id);
|
|
1137
547
|
}
|
|
1138
548
|
}
|
|
1139
|
-
|
|
549
|
+
x([
|
|
1140
550
|
f({ type: String, reflect: !0 })
|
|
1141
551
|
], z.prototype, "label");
|
|
1142
|
-
|
|
552
|
+
x([
|
|
1143
553
|
f({ type: String, reflect: !0 })
|
|
1144
554
|
], z.prototype, "variant");
|
|
1145
|
-
|
|
555
|
+
x([
|
|
1146
556
|
f({ type: String, reflect: !0 })
|
|
1147
557
|
], z.prototype, "selects");
|
|
1148
|
-
|
|
558
|
+
x([
|
|
1149
559
|
f({ type: Boolean, reflect: !0 })
|
|
1150
560
|
], z.prototype, "emphasized");
|
|
1151
|
-
|
|
561
|
+
x([
|
|
1152
562
|
f({ type: Boolean, reflect: !0 })
|
|
1153
563
|
], z.prototype, "pending");
|
|
1154
|
-
|
|
564
|
+
x([
|
|
1155
565
|
f({ type: Array })
|
|
1156
566
|
], z.prototype, "options");
|
|
1157
|
-
|
|
567
|
+
x([
|
|
1158
568
|
f({ type: Boolean, reflect: !0, attribute: "no-wrap" })
|
|
1159
569
|
], z.prototype, "noWrap");
|
|
1160
|
-
|
|
570
|
+
x([
|
|
1161
571
|
f({ type: Array })
|
|
1162
572
|
], z.prototype, "value");
|
|
1163
|
-
|
|
1164
|
-
|
|
573
|
+
x([
|
|
574
|
+
S("lit-virtualizer")
|
|
1165
575
|
], z.prototype, "virtualizer");
|
|
1166
|
-
|
|
1167
|
-
|
|
576
|
+
x([
|
|
577
|
+
j("luzmo-option")
|
|
1168
578
|
], z.prototype, "visibleOptionElements");
|
|
1169
579
|
customElements.get("luzmo-options") || customElements.define("luzmo-options", z);
|
|
1170
|
-
customElements.get("luzmo-options-divider") || customElements.define("luzmo-options-divider",
|
|
580
|
+
customElements.get("luzmo-options-divider") || customElements.define("luzmo-options-divider", no);
|
|
1171
581
|
customElements.get("luzmo-option") || customElements.define("luzmo-option", b);
|
|
1172
582
|
export {
|
|
1173
583
|
b as LuzmoOption,
|
|
1174
584
|
z as LuzmoOptions,
|
|
1175
|
-
|
|
1176
|
-
|
|
585
|
+
no as LuzmoOptionsDivider,
|
|
586
|
+
so as VIRTUALIZE_AS_OF_NUM_ITEMS
|
|
1177
587
|
};
|