@luzmo/lucero 0.0.33 → 0.0.35
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/options/index.cjs +27 -27
- package/components/options/index.js +151 -150
- package/components/options/options.d.ts +1 -1
- package/components/select/index.cjs +24 -24
- package/components/select/index.js +135 -128
- package/components/select/select.d.ts +1 -1
- package/custom-elements.json +1 -1
- package/package.json +1 -1
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
18
|
import { s as Q } from "../mutation-controller-DH7YOCyj.js";
|
|
19
|
-
import { x as g, r as T, E as L, n as
|
|
19
|
+
import { x as g, r as T, E as L, n as f, T as H, c as oo, a as W } from "../base-WsynuqaS.js";
|
|
20
20
|
import { e as V } from "../query-D_KR_GUc.js";
|
|
21
21
|
import { F as to } from "../focusable-BxtpnzWp.js";
|
|
22
22
|
import { L as eo } from "../like-anchor-Bvn_vLQ8.js";
|
|
@@ -26,14 +26,14 @@ import { r as ro } from "../random-id-ByCz1xaq.js";
|
|
|
26
26
|
import { O as D, C as no, h as so, F as ao } from "../luzmo-icons-DbwDQtuO.js";
|
|
27
27
|
import { e as q, i as co, t as K } from "../directive-oAbCiebi.js";
|
|
28
28
|
import { f as ho } from "../async-directive-BfcqVjDp.js";
|
|
29
|
-
import { p as uo, v as
|
|
29
|
+
import { p as uo, v as w, r as S, M, m as po } from "../directive-helpers-Cm6gitnu.js";
|
|
30
30
|
import { e as mo } from "../base-D76d76ww.js";
|
|
31
31
|
import { S as G } from "../sized-mixin-D4ACoVUr.js";
|
|
32
32
|
import { d as vo } from "../divider.module-DoQWQEIJ.js";
|
|
33
33
|
const Y = () => {
|
|
34
34
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
35
|
-
const
|
|
36
|
-
|
|
35
|
+
const n = document.createElement("style");
|
|
36
|
+
n.setAttribute("data-luzmo-vars", ""), n.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(n);
|
|
37
37
|
}
|
|
38
38
|
};
|
|
39
39
|
Y();
|
|
@@ -43,27 +43,27 @@ Y();
|
|
|
43
43
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
44
44
|
*/
|
|
45
45
|
let fo;
|
|
46
|
-
function go(
|
|
46
|
+
function go(n) {
|
|
47
47
|
return (o, t) => mo(o, t, { get() {
|
|
48
|
-
return (this.renderRoot ?? fo ?? (fo = document.createDocumentFragment())).querySelectorAll(
|
|
48
|
+
return (this.renderRoot ?? fo ?? (fo = document.createDocumentFragment())).querySelectorAll(n);
|
|
49
49
|
} });
|
|
50
50
|
}
|
|
51
51
|
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}';
|
|
52
|
-
var zo = Object.defineProperty, _o = Object.getOwnPropertyDescriptor, _ = (
|
|
53
|
-
for (var i = e > 1 ? void 0 : e ? _o(o, t) : o, l =
|
|
54
|
-
(
|
|
52
|
+
var zo = Object.defineProperty, _o = Object.getOwnPropertyDescriptor, _ = (n, o, t, e) => {
|
|
53
|
+
for (var i = e > 1 ? void 0 : e ? _o(o, t) : o, l = n.length - 1, s; l >= 0; l--)
|
|
54
|
+
(s = n[l]) && (i = (e ? s(o, t, i) : s(i)) || i);
|
|
55
55
|
return e && i && zo(o, t, i), i;
|
|
56
56
|
};
|
|
57
|
-
const yo = (
|
|
58
|
-
<span class="icon-container icon checkmark ${
|
|
57
|
+
const yo = (n) => g`
|
|
58
|
+
<span class="icon-container icon checkmark ${n.join(" ")}">
|
|
59
59
|
${D(ao)}
|
|
60
60
|
</span>
|
|
61
|
-
`, ko = (
|
|
62
|
-
<span class="icon-container icon checkbox ${
|
|
61
|
+
`, ko = (n) => g`
|
|
62
|
+
<span class="icon-container icon checkbox ${n.join(" ")}">
|
|
63
63
|
${D(so)}
|
|
64
64
|
</span>
|
|
65
|
-
`, xo = (
|
|
66
|
-
<span class="icon-container icon checkbox ${
|
|
65
|
+
`, xo = (n) => g`
|
|
66
|
+
<span class="icon-container icon checkbox ${n.join(" ")}">
|
|
67
67
|
${D(no)}
|
|
68
68
|
</span>
|
|
69
69
|
`;
|
|
@@ -185,22 +185,22 @@ class b extends eo(
|
|
|
185
185
|
}
|
|
186
186
|
}
|
|
187
187
|
_([
|
|
188
|
-
|
|
188
|
+
f({ type: Boolean, reflect: !0 })
|
|
189
189
|
], b.prototype, "active", 2);
|
|
190
190
|
_([
|
|
191
|
-
|
|
191
|
+
f({ type: Boolean, reflect: !0 })
|
|
192
192
|
], b.prototype, "focused", 2);
|
|
193
193
|
_([
|
|
194
|
-
|
|
194
|
+
f({ type: Boolean, reflect: !0 })
|
|
195
195
|
], b.prototype, "selected", 2);
|
|
196
196
|
_([
|
|
197
|
-
|
|
197
|
+
f({ type: Boolean, reflect: !0 })
|
|
198
198
|
], b.prototype, "emphasized", 2);
|
|
199
199
|
_([
|
|
200
|
-
|
|
200
|
+
f({ type: String, reflect: !0 })
|
|
201
201
|
], b.prototype, "variant", 2);
|
|
202
202
|
_([
|
|
203
|
-
|
|
203
|
+
f({ type: String })
|
|
204
204
|
], b.prototype, "value", 1);
|
|
205
205
|
_([
|
|
206
206
|
V("slot:not([name])")
|
|
@@ -209,7 +209,7 @@ _([
|
|
|
209
209
|
V('slot[name="icon"]')
|
|
210
210
|
], b.prototype, "iconSlot", 2);
|
|
211
211
|
_([
|
|
212
|
-
|
|
212
|
+
f({
|
|
213
213
|
type: Boolean,
|
|
214
214
|
reflect: !0,
|
|
215
215
|
attribute: "no-wrap",
|
|
@@ -221,10 +221,10 @@ _([
|
|
|
221
221
|
_([
|
|
222
222
|
V(".anchor")
|
|
223
223
|
], b.prototype, "anchorElement", 2);
|
|
224
|
-
function
|
|
225
|
-
var i = arguments.length, l = i < 3 ? o : e === null ? e = Object.getOwnPropertyDescriptor(o, t) : e,
|
|
226
|
-
if (typeof Reflect == "object" && typeof Reflect.decorate == "function") l = Reflect.decorate(
|
|
227
|
-
else for (var
|
|
224
|
+
function O(n, o, t, e) {
|
|
225
|
+
var i = arguments.length, l = i < 3 ? o : e === null ? e = Object.getOwnPropertyDescriptor(o, t) : e, s;
|
|
226
|
+
if (typeof Reflect == "object" && typeof Reflect.decorate == "function") l = Reflect.decorate(n, o, t, e);
|
|
227
|
+
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);
|
|
228
228
|
return i > 3 && l && Object.defineProperty(o, t, l), l;
|
|
229
229
|
}
|
|
230
230
|
/**
|
|
@@ -232,54 +232,54 @@ function S(s, o, t, e) {
|
|
|
232
232
|
* Copyright 2017 Google LLC
|
|
233
233
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
234
234
|
*/
|
|
235
|
-
const P = (
|
|
235
|
+
const P = (n, o, t) => {
|
|
236
236
|
const e = /* @__PURE__ */ new Map();
|
|
237
|
-
for (let i = o; i <= t; i++) e.set(
|
|
237
|
+
for (let i = o; i <= t; i++) e.set(n[i], i);
|
|
238
238
|
return e;
|
|
239
239
|
}, Z = q(class extends co {
|
|
240
|
-
constructor(
|
|
241
|
-
if (super(
|
|
240
|
+
constructor(n) {
|
|
241
|
+
if (super(n), n.type !== K.CHILD) throw Error("repeat() can only be used in text expressions");
|
|
242
242
|
}
|
|
243
|
-
dt(
|
|
243
|
+
dt(n, o, t) {
|
|
244
244
|
let e;
|
|
245
245
|
t === void 0 ? t = o : o !== void 0 && (e = o);
|
|
246
246
|
const i = [], l = [];
|
|
247
|
-
let
|
|
248
|
-
for (const
|
|
247
|
+
let s = 0;
|
|
248
|
+
for (const r of n) i[s] = e ? e(r, s) : s, l[s] = t(r, s), s++;
|
|
249
249
|
return { values: l, keys: i };
|
|
250
250
|
}
|
|
251
|
-
render(
|
|
252
|
-
return this.dt(
|
|
251
|
+
render(n, o, t) {
|
|
252
|
+
return this.dt(n, o, t).values;
|
|
253
253
|
}
|
|
254
|
-
update(
|
|
255
|
-
const i = uo(
|
|
256
|
-
if (!Array.isArray(i)) return this.ut =
|
|
257
|
-
const
|
|
258
|
-
let c,
|
|
254
|
+
update(n, [o, t, e]) {
|
|
255
|
+
const i = uo(n), { values: l, keys: s } = this.dt(o, t, e);
|
|
256
|
+
if (!Array.isArray(i)) return this.ut = s, l;
|
|
257
|
+
const r = this.ut ?? (this.ut = []), a = [];
|
|
258
|
+
let c, m, u = 0, d = i.length - 1, h = 0, p = l.length - 1;
|
|
259
259
|
for (; u <= d && h <= p; ) if (i[u] === null) u++;
|
|
260
260
|
else if (i[d] === null) d--;
|
|
261
|
-
else if (
|
|
262
|
-
else if (
|
|
263
|
-
else if (
|
|
264
|
-
else if (
|
|
265
|
-
else if (c === void 0 && (c = P(
|
|
266
|
-
const
|
|
267
|
-
if (
|
|
268
|
-
const
|
|
269
|
-
|
|
270
|
-
} else a[h] = k
|
|
261
|
+
else if (r[u] === s[h]) a[h] = w(i[u], l[h]), u++, h++;
|
|
262
|
+
else if (r[d] === s[p]) a[p] = w(i[d], l[p]), d--, p--;
|
|
263
|
+
else if (r[u] === s[p]) a[p] = w(i[u], l[p]), S(n, a[p + 1], i[u]), u++, p--;
|
|
264
|
+
else if (r[d] === s[h]) a[h] = w(i[d], l[h]), S(n, i[u], i[d]), d--, h++;
|
|
265
|
+
else if (c === void 0 && (c = P(s, h, p), m = P(r, u, d)), c.has(r[u])) if (c.has(r[d])) {
|
|
266
|
+
const v = m.get(s[h]), k = v !== void 0 ? i[v] : null;
|
|
267
|
+
if (k === null) {
|
|
268
|
+
const x = S(n, i[u]);
|
|
269
|
+
w(x, l[h]), a[h] = x;
|
|
270
|
+
} else a[h] = w(k, l[h]), S(n, i[u], k), i[v] = null;
|
|
271
271
|
h++;
|
|
272
272
|
} else M(i[d]), d--;
|
|
273
273
|
else M(i[u]), u++;
|
|
274
274
|
for (; h <= p; ) {
|
|
275
|
-
const
|
|
276
|
-
|
|
275
|
+
const v = S(n, a[p + 1]);
|
|
276
|
+
w(v, l[h]), a[h++] = v;
|
|
277
277
|
}
|
|
278
278
|
for (; u <= d; ) {
|
|
279
|
-
const
|
|
280
|
-
|
|
279
|
+
const v = i[u++];
|
|
280
|
+
v !== null && M(v);
|
|
281
281
|
}
|
|
282
|
-
return this.ut =
|
|
282
|
+
return this.ut = s, po(n, a), H;
|
|
283
283
|
}
|
|
284
284
|
});
|
|
285
285
|
/**
|
|
@@ -391,8 +391,8 @@ class Co extends wo {
|
|
|
391
391
|
const { scrollTop: o, scrollLeft: t } = this;
|
|
392
392
|
let { top: e, left: i } = this._destination;
|
|
393
393
|
e = Math.min(e || 0, this.maxScrollTop), i = Math.min(i || 0, this.maxScrollLeft);
|
|
394
|
-
const l = Math.abs(e - o),
|
|
395
|
-
l < 1 &&
|
|
394
|
+
const l = Math.abs(e - o), s = Math.abs(i - t);
|
|
395
|
+
l < 1 && s < 1 && (this._end && this._end(), this._resetScrollState());
|
|
396
396
|
}
|
|
397
397
|
}
|
|
398
398
|
detach(o) {
|
|
@@ -497,7 +497,7 @@ class Eo {
|
|
|
497
497
|
}
|
|
498
498
|
stopBenchmarking() {
|
|
499
499
|
if (this._benchmarkStart !== null) {
|
|
500
|
-
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,
|
|
500
|
+
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);
|
|
501
501
|
return this._benchmarkStart = null, { timeElapsed: t, virtualizationTime: i };
|
|
502
502
|
}
|
|
503
503
|
return null;
|
|
@@ -505,8 +505,8 @@ class Eo {
|
|
|
505
505
|
_measureChildren() {
|
|
506
506
|
const o = {}, t = this._children, e = this._measureChildOverride || this._measureChild;
|
|
507
507
|
for (let i = 0; i < t.length; i++) {
|
|
508
|
-
const l = t[i],
|
|
509
|
-
(this._itemsChanged || this._toBeMeasured.has(l)) && (o[
|
|
508
|
+
const l = t[i], s = this._first + i;
|
|
509
|
+
(this._itemsChanged || this._toBeMeasured.has(l)) && (o[s] = e.call(this, l, this._items[s]));
|
|
510
510
|
}
|
|
511
511
|
this._childMeasurements = o, this._schedule(this._updateLayout), this._toBeMeasured.clear();
|
|
512
512
|
}
|
|
@@ -566,21 +566,21 @@ class Eo {
|
|
|
566
566
|
var i;
|
|
567
567
|
const o = this._hostElement, t = (i = this._scrollerController) == null ? void 0 : i.element, e = this._layout;
|
|
568
568
|
if (o && t && e) {
|
|
569
|
-
let l,
|
|
569
|
+
let l, s, r, a;
|
|
570
570
|
const c = o.getBoundingClientRect();
|
|
571
|
-
l = 0,
|
|
572
|
-
const
|
|
573
|
-
|
|
574
|
-
for (const
|
|
575
|
-
l = Math.max(l,
|
|
571
|
+
l = 0, s = 0, r = window.innerHeight, a = window.innerWidth;
|
|
572
|
+
const m = this._clippingAncestors.map((C) => C.getBoundingClientRect());
|
|
573
|
+
m.unshift(c);
|
|
574
|
+
for (const C of m)
|
|
575
|
+
l = Math.max(l, C.top), s = Math.max(s, C.left), r = Math.min(r, C.bottom), a = Math.min(a, C.right);
|
|
576
576
|
const u = t.getBoundingClientRect(), d = {
|
|
577
577
|
left: c.left - u.left,
|
|
578
578
|
top: c.top - u.top
|
|
579
579
|
}, h = {
|
|
580
580
|
width: t.scrollWidth,
|
|
581
581
|
height: t.scrollHeight
|
|
582
|
-
}, p = l - c.top + o.scrollTop,
|
|
583
|
-
e.viewportSize = { width:
|
|
582
|
+
}, p = l - c.top + o.scrollTop, v = s - c.left + o.scrollLeft, k = Math.max(0, r - l), x = Math.max(0, a - s);
|
|
583
|
+
e.viewportSize = { width: x, height: k }, e.viewportScroll = { top: p, left: v }, e.totalScrollSize = h, e.offsetWithinScroller = d;
|
|
584
584
|
}
|
|
585
585
|
}
|
|
586
586
|
/**
|
|
@@ -601,9 +601,9 @@ class Eo {
|
|
|
601
601
|
* pos.
|
|
602
602
|
*/
|
|
603
603
|
_positionChildren(o) {
|
|
604
|
-
o && o.forEach(({ top: t, left: e, width: i, height: l, xOffset:
|
|
604
|
+
o && o.forEach(({ top: t, left: e, width: i, height: l, xOffset: s, yOffset: r }, a) => {
|
|
605
605
|
const c = this._children[a - this._first];
|
|
606
|
-
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 =
|
|
606
|
+
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");
|
|
607
607
|
});
|
|
608
608
|
}
|
|
609
609
|
async _adjustRange(o) {
|
|
@@ -700,8 +700,8 @@ class Eo {
|
|
|
700
700
|
this._scheduleLayoutComplete(), this._itemsChanged = !1, this._rangeChanged = !1;
|
|
701
701
|
}
|
|
702
702
|
}
|
|
703
|
-
function So(
|
|
704
|
-
const o = window.getComputedStyle(
|
|
703
|
+
function So(n) {
|
|
704
|
+
const o = window.getComputedStyle(n);
|
|
705
705
|
return {
|
|
706
706
|
marginTop: A(o.marginTop),
|
|
707
707
|
marginRight: A(o.marginRight),
|
|
@@ -709,28 +709,28 @@ function So(s) {
|
|
|
709
709
|
marginLeft: A(o.marginLeft)
|
|
710
710
|
};
|
|
711
711
|
}
|
|
712
|
-
function A(
|
|
713
|
-
const o =
|
|
712
|
+
function A(n) {
|
|
713
|
+
const o = n ? parseFloat(n) : NaN;
|
|
714
714
|
return Number.isNaN(o) ? 0 : o;
|
|
715
715
|
}
|
|
716
|
-
function N(
|
|
717
|
-
if (
|
|
718
|
-
return
|
|
719
|
-
if (
|
|
720
|
-
return
|
|
721
|
-
const o =
|
|
716
|
+
function N(n) {
|
|
717
|
+
if (n.assignedSlot !== null)
|
|
718
|
+
return n.assignedSlot;
|
|
719
|
+
if (n.parentElement !== null)
|
|
720
|
+
return n.parentElement;
|
|
721
|
+
const o = n.parentNode;
|
|
722
722
|
return o && o.nodeType === Node.DOCUMENT_FRAGMENT_NODE && o.host || null;
|
|
723
723
|
}
|
|
724
|
-
function Oo(
|
|
724
|
+
function Oo(n, o = !1) {
|
|
725
725
|
const t = [];
|
|
726
|
-
let e = o ?
|
|
726
|
+
let e = o ? n : N(n);
|
|
727
727
|
for (; e !== null; )
|
|
728
728
|
t.push(e), e = N(e);
|
|
729
729
|
return t;
|
|
730
730
|
}
|
|
731
|
-
function Io(
|
|
731
|
+
function Io(n, o = !1) {
|
|
732
732
|
let t = !1;
|
|
733
|
-
return Oo(
|
|
733
|
+
return Oo(n, o).filter((e) => {
|
|
734
734
|
if (t)
|
|
735
735
|
return !1;
|
|
736
736
|
const i = getComputedStyle(e);
|
|
@@ -742,7 +742,7 @@ function Io(s, o = !1) {
|
|
|
742
742
|
* Copyright 2021 Google LLC
|
|
743
743
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
744
744
|
*/
|
|
745
|
-
const J = (
|
|
745
|
+
const J = (n) => n, X = (n, o) => g`${o}: ${JSON.stringify(n, null, 2)}`;
|
|
746
746
|
class Ao extends ho {
|
|
747
747
|
constructor(o) {
|
|
748
748
|
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)
|
|
@@ -798,7 +798,7 @@ const Lo = q(Ao);
|
|
|
798
798
|
* Copyright 2021 Google LLC
|
|
799
799
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
800
800
|
*/
|
|
801
|
-
class
|
|
801
|
+
class E extends oo {
|
|
802
802
|
constructor() {
|
|
803
803
|
super(...arguments), this.items = [], this.renderItem = X, this.keyFunction = J, this.layout = {}, this.scroller = !1;
|
|
804
804
|
}
|
|
@@ -832,27 +832,27 @@ class w extends oo {
|
|
|
832
832
|
(e = this.element(o)) == null || e.scrollIntoView({ block: t });
|
|
833
833
|
}
|
|
834
834
|
}
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
],
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
],
|
|
841
|
-
|
|
842
|
-
|
|
843
|
-
],
|
|
844
|
-
|
|
845
|
-
|
|
846
|
-
],
|
|
847
|
-
|
|
848
|
-
|
|
849
|
-
],
|
|
835
|
+
O([
|
|
836
|
+
f({ attribute: !1 })
|
|
837
|
+
], E.prototype, "items", void 0);
|
|
838
|
+
O([
|
|
839
|
+
f()
|
|
840
|
+
], E.prototype, "renderItem", void 0);
|
|
841
|
+
O([
|
|
842
|
+
f()
|
|
843
|
+
], E.prototype, "keyFunction", void 0);
|
|
844
|
+
O([
|
|
845
|
+
f({ attribute: !1 })
|
|
846
|
+
], E.prototype, "layout", void 0);
|
|
847
|
+
O([
|
|
848
|
+
f({ reflect: !0, type: Boolean })
|
|
849
|
+
], E.prototype, "scroller", void 0);
|
|
850
850
|
/**
|
|
851
851
|
* @license
|
|
852
852
|
* Copyright 2021 Google LLC
|
|
853
853
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
854
854
|
*/
|
|
855
|
-
customElements.define("lit-virtualizer",
|
|
855
|
+
customElements.define("lit-virtualizer", E);
|
|
856
856
|
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}";
|
|
857
857
|
class Vo extends G(W, {
|
|
858
858
|
validSizes: ["s", "m", "l"]
|
|
@@ -865,14 +865,14 @@ class Vo extends G(W, {
|
|
|
865
865
|
}
|
|
866
866
|
}
|
|
867
867
|
const $o = ":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;--pending-height: var(--option-min-height);--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;align-items:center;height:var(--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}";
|
|
868
|
-
var Ro = Object.defineProperty, y = (
|
|
869
|
-
for (var i = void 0, l =
|
|
870
|
-
(
|
|
868
|
+
var Ro = Object.defineProperty, y = (n, o, t, e) => {
|
|
869
|
+
for (var i = void 0, l = n.length - 1, s; l >= 0; l--)
|
|
870
|
+
(s = n[l]) && (i = s(o, t, i) || i);
|
|
871
871
|
return i && Ro(o, t, i), i;
|
|
872
872
|
};
|
|
873
873
|
const Fo = 25;
|
|
874
|
-
function Mo(
|
|
875
|
-
return !!o && (
|
|
874
|
+
function Mo(n, o) {
|
|
875
|
+
return !!o && (n === o || n.contains(o));
|
|
876
876
|
}
|
|
877
877
|
class z extends G(W, {
|
|
878
878
|
noDefaultSize: !0
|
|
@@ -937,9 +937,9 @@ class z extends G(W, {
|
|
|
937
937
|
if (o.defaultPrevented)
|
|
938
938
|
return;
|
|
939
939
|
const t = this.focusedOptionIndex, e = [...this.visibleOptionElements].find(
|
|
940
|
-
(
|
|
941
|
-
var
|
|
942
|
-
return ((
|
|
940
|
+
(s) => {
|
|
941
|
+
var r, a, c, m;
|
|
942
|
+
return ((r = s.value) == null ? void 0 : r.toString()) === ((m = (c = (a = this.options) == null ? void 0 : a[t]) == null ? void 0 : c.value) == null ? void 0 : m.toString());
|
|
943
943
|
}
|
|
944
944
|
), { key: i } = o;
|
|
945
945
|
if (i === "Tab") {
|
|
@@ -971,9 +971,9 @@ class z extends G(W, {
|
|
|
971
971
|
t && (t.focused = !1);
|
|
972
972
|
const l = this.focusedOptionIndex;
|
|
973
973
|
this.focusedOptionIndex = this.options.length > 0 ? (this.options.length + this.focusedOptionIndex + o) % this.options.length : 0;
|
|
974
|
-
let
|
|
975
|
-
for (; (
|
|
976
|
-
|
|
974
|
+
let s = this.options[this.focusedOptionIndex], r = this.options.length;
|
|
975
|
+
for (; (s != null && s.disabled || s != null && s.divider) && r; )
|
|
976
|
+
r -= 1, this.focusedOptionIndex = (this.options.length + this.focusedOptionIndex + i) % this.options.length, s = this.options[this.focusedOptionIndex];
|
|
977
977
|
const a = l < this.focusedOptionIndex && o === -1, c = l > this.focusedOptionIndex && o === 1;
|
|
978
978
|
(a || c) && (this.focusedOptionIndex = l, this.dispatchEvent(
|
|
979
979
|
new Event(`luzmo-exceeded-${a ? "top" : "bottom"}`, {
|
|
@@ -982,21 +982,21 @@ class z extends G(W, {
|
|
|
982
982
|
cancelable: !0
|
|
983
983
|
})
|
|
984
984
|
));
|
|
985
|
-
let
|
|
986
|
-
return e && this._virtualizeActive && (
|
|
985
|
+
let m;
|
|
986
|
+
return e && this._virtualizeActive && (m = [...this.visibleOptionElements].find(
|
|
987
987
|
(d) => {
|
|
988
|
-
var h, p,
|
|
989
|
-
return ((h = d.value) == null ? void 0 : h.toString()) === ((
|
|
988
|
+
var h, p, v;
|
|
989
|
+
return ((h = d.value) == null ? void 0 : h.toString()) === ((v = (p = this.options[this.focusedOptionIndex]) == null ? void 0 : p.value) == null ? void 0 : v.toString());
|
|
990
990
|
}
|
|
991
|
-
),
|
|
991
|
+
), m || (this.focusedOptionIndex = this._firstVisibleIndex)), this._virtualizeActive && e && ((u = this.virtualizer.element(this.focusedOptionIndex)) == null || u.scrollIntoView({
|
|
992
992
|
behavior: "smooth",
|
|
993
993
|
block: "nearest"
|
|
994
|
-
})),
|
|
994
|
+
})), m = m ?? [...this.visibleOptionElements].find(
|
|
995
995
|
(d) => {
|
|
996
|
-
var h, p,
|
|
997
|
-
return ((h = d.value) == null ? void 0 : h.toString()) === ((
|
|
996
|
+
var h, p, v, k, x;
|
|
997
|
+
return (d.value === null ? null : (h = d.value) == null ? void 0 : h.toString()) === (((p = this.options[this.focusedOptionIndex]) == null ? void 0 : p.value) === null ? (v = this.options[this.focusedOptionIndex]) == null ? void 0 : v.value : (x = (k = this.options[this.focusedOptionIndex]) == null ? void 0 : k.value) == null ? void 0 : x.toString());
|
|
998
998
|
}
|
|
999
|
-
),
|
|
999
|
+
), s != null && s.disabled || this.setFocusedAndActiveDescendant(m), m;
|
|
1000
1000
|
}
|
|
1001
1001
|
updateSelectedItemIndex() {
|
|
1002
1002
|
this.focusedOptionIndex = this._virtualizeActive ? this._firstVisibleIndex : 0;
|
|
@@ -1005,7 +1005,7 @@ class z extends G(W, {
|
|
|
1005
1005
|
this._selectedOptions = this.options.filter(
|
|
1006
1006
|
(o) => {
|
|
1007
1007
|
var t;
|
|
1008
|
-
return
|
|
1008
|
+
return Array.isArray(this.value) && ((t = this.value) == null ? void 0 : t.includes((o == null ? void 0 : o.value) ?? null));
|
|
1009
1009
|
}
|
|
1010
1010
|
);
|
|
1011
1011
|
}
|
|
@@ -1026,21 +1026,22 @@ class z extends G(W, {
|
|
|
1026
1026
|
);
|
|
1027
1027
|
}
|
|
1028
1028
|
async toggleOption(o, t) {
|
|
1029
|
+
var s;
|
|
1029
1030
|
const e = o instanceof KeyboardEvent, i = this.options.findIndex(
|
|
1030
1031
|
(r) => (r == null ? void 0 : r.value) === (t == null ? void 0 : t.value)
|
|
1031
1032
|
);
|
|
1032
1033
|
this.focusedOptionIndex = i, this.visibleOptionElements.forEach((r) => {
|
|
1033
|
-
var
|
|
1034
|
+
var a, c;
|
|
1034
1035
|
if (e) {
|
|
1035
|
-
const
|
|
1036
|
-
r.focused =
|
|
1036
|
+
const m = ((r == null ? void 0 : r.value) === null ? null : (a = r.value) == null ? void 0 : a.toString()) === ((t == null ? void 0 : t.value) === null ? null : (c = t == null ? void 0 : t.value) == null ? void 0 : c.toString());
|
|
1037
|
+
r.focused = m, m && this.setFocusedAndActiveDescendant(r);
|
|
1037
1038
|
} else
|
|
1038
1039
|
r.focused = !1;
|
|
1039
1040
|
});
|
|
1040
|
-
const l = (this.value
|
|
1041
|
+
const l = Array.isArray(this.value) && ((s = this.value) == null ? void 0 : s.includes((t == null ? void 0 : t.value) ?? null));
|
|
1041
1042
|
this.selects === "single" ? (this.value = [t == null ? void 0 : t.value], this._selectedOptions = [t]) : (this.value = l ? this.value.filter((r) => r !== (t == null ? void 0 : t.value)) : [...this.value ?? [], t == null ? void 0 : t.value], this._selectedOptions = l ? this._selectedOptions.filter(
|
|
1042
1043
|
(r) => r.value !== t.value
|
|
1043
|
-
) : [...this._selectedOptions, t]), await this.updateComplete, this.dispatchEvent(
|
|
1044
|
+
) : [...this._selectedOptions, t]), console.log("this.value LL", this.value), await this.updateComplete, this.dispatchEvent(
|
|
1044
1045
|
new CustomEvent("change", {
|
|
1045
1046
|
bubbles: !0,
|
|
1046
1047
|
cancelable: !0,
|
|
@@ -1055,17 +1056,17 @@ class z extends G(W, {
|
|
|
1055
1056
|
this.toggleOption(t, o);
|
|
1056
1057
|
}
|
|
1057
1058
|
render() {
|
|
1058
|
-
const o = (
|
|
1059
|
+
const o = (r) => g`<luzmo-icon
|
|
1059
1060
|
slot="icon"
|
|
1060
|
-
.icon=${
|
|
1061
|
+
.icon=${r}
|
|
1061
1062
|
.size=${this.size}
|
|
1062
|
-
></luzmo-icon>`, t = (
|
|
1063
|
+
></luzmo-icon>`, t = (r) => g`<span slot="description">${r}</span>`, e = (r) => g`<luzmo-icon
|
|
1063
1064
|
slot="icon"
|
|
1064
|
-
.src=${
|
|
1065
|
+
.src=${r}
|
|
1065
1066
|
.size=${this.size}
|
|
1066
|
-
></luzmo-icon>`, i = (
|
|
1067
|
-
var
|
|
1068
|
-
const a =
|
|
1067
|
+
></luzmo-icon>`, i = (r) => {
|
|
1068
|
+
var v;
|
|
1069
|
+
const a = r == null ? void 0 : r.value, c = r == null ? void 0 : r.label, m = r == null ? void 0 : r.description, u = r == null ? void 0 : r.icon, d = r == null ? void 0 : r.imgSrc, h = r == null ? void 0 : r.divider, p = typeof r == "string" || r == null ? void 0 : r.disabled;
|
|
1069
1070
|
return h ? g`<luzmo-options-divider></luzmo-options-divider>` : g`<luzmo-option
|
|
1070
1071
|
.value=${a}
|
|
1071
1072
|
.size=${this.size}
|
|
@@ -1073,25 +1074,25 @@ class z extends G(W, {
|
|
|
1073
1074
|
?emphasized=${this.emphasized}
|
|
1074
1075
|
?no-wrap=${this.noWrap}
|
|
1075
1076
|
?disabled=${p}
|
|
1076
|
-
.selected=${Array.isArray(this.value) ? (
|
|
1077
|
+
.selected=${Array.isArray(this.value) ? (v = this.value) == null ? void 0 : v.includes(a) : !1}
|
|
1077
1078
|
.role=${this.selects === "single" ? "option" : "optioncheckbox"}
|
|
1078
|
-
@click=${this.handleOptionClick.bind(this,
|
|
1079
|
+
@click=${this.handleOptionClick.bind(this, r)}
|
|
1079
1080
|
>
|
|
1080
1081
|
${u ? o(u) : d ? e(d) : L}
|
|
1081
|
-
${c} ${
|
|
1082
|
+
${c} ${m ? t(m) : L}
|
|
1082
1083
|
</luzmo-option>`;
|
|
1083
1084
|
}, l = this._virtualizeActive ? g`<lit-virtualizer
|
|
1084
1085
|
.items=${this.options}
|
|
1085
1086
|
.renderItem=${i}
|
|
1086
1087
|
@rangeChanged=${this.rangeChange}
|
|
1087
1088
|
@visibilityChanged=${this.visibilityChanged}
|
|
1088
|
-
></lit-virtualizer>` : Z(this.options, i),
|
|
1089
|
+
></lit-virtualizer>` : Z(this.options, i), s = this.pending ? g`<div id="pending">
|
|
1089
1090
|
<luzmo-progress-circle
|
|
1090
1091
|
indeterminate
|
|
1091
1092
|
.size=${this.size}
|
|
1092
1093
|
></luzmo-progress-circle>
|
|
1093
1094
|
</div>` : L;
|
|
1094
|
-
return g`${l} ${
|
|
1095
|
+
return g`${l} ${s}`;
|
|
1095
1096
|
}
|
|
1096
1097
|
connectedCallback() {
|
|
1097
1098
|
super.connectedCallback(), this.setAttribute("role", "listbox"), this.updateComplete.then(() => this.updateItemFocus());
|
|
@@ -1115,8 +1116,8 @@ class z extends G(W, {
|
|
|
1115
1116
|
return;
|
|
1116
1117
|
const o = this.focusedOptionIndex, t = [...this.visibleOptionElements].find(
|
|
1117
1118
|
(e) => {
|
|
1118
|
-
var i, l, r,
|
|
1119
|
-
return ((i = e.value) == null ? void 0 : i.toString()) === ((
|
|
1119
|
+
var i, l, s, r, a, c;
|
|
1120
|
+
return (e.value === null ? null : (i = e.value) == null ? void 0 : i.toString()) === (((s = (l = this.options) == null ? void 0 : l[o]) == null ? void 0 : s.value) === null ? null : (c = (a = (r = this.options) == null ? void 0 : r[o]) == null ? void 0 : a.value) == null ? void 0 : c.toString());
|
|
1120
1121
|
}
|
|
1121
1122
|
);
|
|
1122
1123
|
this.setFocusedAndActiveDescendant(t);
|
|
@@ -1132,28 +1133,28 @@ class z extends G(W, {
|
|
|
1132
1133
|
}
|
|
1133
1134
|
}
|
|
1134
1135
|
y([
|
|
1135
|
-
|
|
1136
|
+
f({ type: String, reflect: !0 })
|
|
1136
1137
|
], z.prototype, "label");
|
|
1137
1138
|
y([
|
|
1138
|
-
|
|
1139
|
+
f({ type: String, reflect: !0 })
|
|
1139
1140
|
], z.prototype, "variant");
|
|
1140
1141
|
y([
|
|
1141
|
-
|
|
1142
|
+
f({ type: String, reflect: !0 })
|
|
1142
1143
|
], z.prototype, "selects");
|
|
1143
1144
|
y([
|
|
1144
|
-
|
|
1145
|
+
f({ type: Boolean, reflect: !0 })
|
|
1145
1146
|
], z.prototype, "emphasized");
|
|
1146
1147
|
y([
|
|
1147
|
-
|
|
1148
|
+
f({ type: Boolean, reflect: !0 })
|
|
1148
1149
|
], z.prototype, "pending");
|
|
1149
1150
|
y([
|
|
1150
|
-
|
|
1151
|
+
f({ type: Array })
|
|
1151
1152
|
], z.prototype, "options");
|
|
1152
1153
|
y([
|
|
1153
|
-
|
|
1154
|
+
f({ type: Boolean, reflect: !0, attribute: "no-wrap" })
|
|
1154
1155
|
], z.prototype, "noWrap");
|
|
1155
1156
|
y([
|
|
1156
|
-
|
|
1157
|
+
f({ type: Array })
|
|
1157
1158
|
], z.prototype, "value");
|
|
1158
1159
|
y([
|
|
1159
1160
|
V("lit-virtualizer")
|