@nl-design-system-community/clippy-components 1.2.0 → 2.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/clippy-button/index.js +4 -4
- package/dist/clippy-code/index.js +18 -15
- package/dist/clippy-color-combobox/index.d.ts +9 -13
- package/dist/clippy-color-combobox/index.d.ts.map +1 -1
- package/dist/clippy-color-combobox/index.js +6 -5
- package/dist/clippy-color-combobox/lib.d.ts +16 -12
- package/dist/clippy-color-combobox/lib.d.ts.map +1 -1
- package/dist/clippy-color-combobox/messages/en.d.ts +14 -6
- package/dist/clippy-color-combobox/messages/en.d.ts.map +1 -1
- package/dist/clippy-color-combobox/messages/nl.d.ts +14 -6
- package/dist/clippy-color-combobox/messages/nl.d.ts.map +1 -1
- package/dist/clippy-combobox/index.d.ts +22 -8
- package/dist/clippy-combobox/index.d.ts.map +1 -1
- package/dist/clippy-combobox/index.js +703 -8
- package/dist/clippy-font-combobox/index.d.ts +4 -3
- package/dist/clippy-font-combobox/index.d.ts.map +1 -1
- package/dist/clippy-font-combobox/index.js +94 -59
- package/dist/clippy-heading/index.js +180 -174
- package/dist/clippy-html-image/index.js +51 -31
- package/dist/clippy-icon/index.js +22 -16
- package/dist/clippy-lang-combobox/index.d.ts +2 -4
- package/dist/clippy-lang-combobox/index.d.ts.map +1 -1
- package/dist/clippy-lang-combobox/index.js +104 -78
- package/dist/clippy-modal/index.d.ts +3 -3
- package/dist/clippy-modal/index.d.ts.map +1 -1
- package/dist/clippy-modal/index.js +98 -89
- package/dist/clippy-toggletip/index.d.ts +16 -0
- package/dist/clippy-toggletip/index.d.ts.map +1 -0
- package/dist/clippy-toggletip/index.js +180 -0
- package/dist/decorators-Cq82_-g_.js +11 -0
- package/dist/en-D1kE0w6o.js +4 -0
- package/dist/external-BCrp-PaG.js +4 -0
- package/dist/index-7tZ2Ykfm.js +135 -0
- package/dist/index-C9pF3BXT.js +10683 -0
- package/dist/lib/FormElement/index.d.ts +2 -1
- package/dist/lib/FormElement/index.d.ts.map +1 -1
- package/dist/lib/FormElement/index.js +95 -0
- package/dist/lib/LocalizationMixin/index.d.ts.map +1 -1
- package/dist/lib/LocalizationMixin/index.js +64 -0
- package/dist/lib/converters/index.d.ts +4 -0
- package/dist/lib/converters/index.d.ts.map +1 -1
- package/dist/lib/converters/index.js +35 -0
- package/dist/lib/sr-only/index.d.ts +3 -0
- package/dist/lib/sr-only/index.d.ts.map +1 -0
- package/dist/lib/sr-only/index.js +18 -0
- package/dist/nl-99gBQbne.js +19 -0
- package/package.json +19 -16
- package/dist/decorators-BGpMqJ7V.js +0 -7
- package/dist/en-B-D8DBsf.js +0 -4
- package/dist/external-Dtf6f6DP.js +0 -4
- package/dist/index-CT1z3SFL.js +0 -106
- package/dist/index-CaVpiaBC.js +0 -52
- package/dist/index-CmKtM5nD.js +0 -379
- package/dist/index-CtreqNZ6.js +0 -3602
- package/dist/index-D3FiqptQ.js +0 -65
- package/dist/nl-CJG2-yS5.js +0 -11
package/dist/index-CT1z3SFL.js
DELETED
|
@@ -1,106 +0,0 @@
|
|
|
1
|
-
import { s as i } from "./decorators-BGpMqJ7V.js";
|
|
2
|
-
import { css as v, unsafeCSS as p, nothing as d, html as g } from "lit";
|
|
3
|
-
import { property as n } from "lit/decorators.js";
|
|
4
|
-
import { classMap as y } from "lit/directives/class-map.js";
|
|
5
|
-
import { F as h } from "./index-D3FiqptQ.js";
|
|
6
|
-
const k = ".nl-button{--nl-icon-block-size: var(--nl-button-icon-size);--nl-icon-inline-size: var(--nl-button-icon-size);--nl-icon-color: currentColor;align-items:center;block-size:fit-content;border-radius:var(--nl-button-border-radius);border-style:solid;box-sizing:border-box;column-gap:var(--nl-button-column-gap);cursor:pointer;display:inline-flex;font-family:var(--nl-button-font-family);inline-size:fit-content;justify-content:center;min-block-size:var(--nl-button-min-block-size, max(44px, fit-content));min-inline-size:var(--nl-button-min-inline-size, max(44px, fit-content));outline-offset:var(--nl-button-outline-offset);overflow-wrap:break-word;padding-block-end:var(--nl-button-padding-block-end);padding-block-start:var(--nl-button-padding-block-start);padding-inline-end:var(--nl-button-padding-inline-end);padding-inline-start:var(--nl-button-padding-inline-start);text-align:start;text-box-trim:trim-both;text-decoration:none;-webkit-user-select:none;user-select:none;background-color:var(--nl-button-default-background-color);border-color:var(--nl-button-default-border-color);border-width:var(--nl-button-default-border-width);color:var(--nl-button-default-color);font-size:var(--nl-button-default-font-size);font-weight:var(--nl-button-default-font-weight);line-height:var(--nl-button-default-line-height)}.nl-button:not(:has(*)),.nl-button:has(>:where(:first-child)):not(:has(>:where(.nl-button__icon-end,.nl-button__icon-start,.nl-button__label))){display:inline-block}@media screen and (forced-colors:active){.nl-button{background-color:ButtonFace!important;border-color:ButtonText!important;color:ButtonText!important}.nl-button--disabled{background-color:ButtonFace!important;border-color:GrayText!important;color:GrayText!important}.nl-button--pressed{background-color:ButtonText!important;border-color:ButtonText!important;color:ButtonFace!important;forced-color-adjust:none}.nl-button--pressed.nl-button--disabled{background-color:GrayText!important;border-color:GrayText!important;color:ButtonFace!important;forced-color-adjust:none}.nl-button:not(.nl-button--disabled):hover{border-color:Highlight!important}}.nl-button[hidden]{display:none}.nl-button--icon-only{padding-block-end:var(--nl-button-icon-only-padding-block-end, 0);padding-block-start:var(--nl-button-icon-only-padding-block-start, 0);padding-inline-end:var(--nl-button-icon-only-padding-inline-end, 0);padding-inline-start:var(--nl-button-icon-only-padding-inline-start, 0)}.nl-button--icon-only .nl-button__label{block-size:1px!important;border:0!important;clip:rect(1px,1px,1px,1px)!important;-webkit-clip-path:inset(50%)!important;clip-path:inset(50%)!important;inline-size:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important}.nl-button__icon-start,.nl-button__icon-end{line-height:0}.nl-button__label{background-color:inherit;overflow-wrap:break-word;text-box-trim:trim-both}.nl-button:hover{background-color:var(--nl-button-default-hover-background-color);border-color:var(--nl-button-default-hover-border-color);color:var(--nl-button-default-hover-color)}.nl-button:active{background-color:var(--nl-button-default-active-background-color);border-color:var(--nl-button-default-active-border-color);color:var(--nl-button-default-active-color)}.nl-button.nl-button--pressed{background-color:var(--nl-button-default-pressed-background-color);border-color:var(--nl-button-default-pressed-border-color);color:var(--nl-button-default-pressed-color)}.nl-button:where(.nl-button--pressed):hover{background-color:var(--nl-button-default-pressed-hover-background-color);border-color:var(--nl-button-default-pressed-hover-border-color);color:var(--nl-button-default-pressed-hover-color)}.nl-button:where(.nl-button--pressed):active{background-color:var(--nl-button-default-pressed-active-background-color);border-color:var(--nl-button-default-pressed-active-border-color);color:var(--nl-button-default-pressed-active-color)}.nl-button.nl-button--pressed.nl-button--disabled{background-color:var(--nl-button-default-pressed-disabled-background-color);border-color:var(--nl-button-default-pressed-disabled-border-color);color:var(--nl-button-default-pressed-disabled-color)}.nl-button.nl-button--disabled{cursor:not-allowed;background-color:var(--nl-button-default-disabled-background-color);border-color:var(--nl-button-default-disabled-border-color);color:var(--nl-button-default-disabled-color)}.nl-button:where(.nl-button--primary){background-color:var(--nl-button-primary-background-color);border-color:var(--nl-button-primary-border-color);border-width:var(--nl-button-primary-border-width);color:var(--nl-button-primary-color);font-size:var(--nl-button-primary-font-size);font-weight:var(--nl-button-primary-font-weight);line-height:var(--nl-button-primary-line-height)}.nl-button:where(.nl-button--primary):hover{background-color:var(--nl-button-primary-hover-background-color);border-color:var(--nl-button-primary-hover-border-color);color:var(--nl-button-primary-hover-color)}.nl-button:where(.nl-button--primary):active{background-color:var(--nl-button-primary-active-background-color);border-color:var(--nl-button-primary-active-border-color);color:var(--nl-button-primary-active-color)}.nl-button:where(.nl-button--primary).nl-button--pressed{background-color:var(--nl-button-primary-pressed-background-color);border-color:var(--nl-button-primary-pressed-border-color);color:var(--nl-button-primary-pressed-color)}.nl-button:where(.nl-button--primary.nl-button--pressed):hover{background-color:var(--nl-button-primary-pressed-hover-background-color);border-color:var(--nl-button-primary-pressed-hover-border-color);color:var(--nl-button-primary-pressed-hover-color)}.nl-button:where(.nl-button--primary.nl-button--pressed):active{background-color:var(--nl-button-primary-pressed-active-background-color);border-color:var(--nl-button-primary-pressed-active-border-color);color:var(--nl-button-primary-pressed-active-color)}.nl-button:where(.nl-button--primary).nl-button--pressed.nl-button--disabled{background-color:var(--nl-button-primary-pressed-disabled-background-color);border-color:var(--nl-button-primary-pressed-disabled-border-color);color:var(--nl-button-primary-pressed-disabled-color)}.nl-button:where(.nl-button--primary).nl-button--disabled{background-color:var(--nl-button-primary-disabled-background-color);border-color:var(--nl-button-primary-disabled-border-color);color:var(--nl-button-primary-disabled-color)}.nl-button:where(.nl-button--primary).nl-button--positive{background-color:var(--nl-button-primary-positive-background-color);border-color:var(--nl-button-primary-positive-border-color);color:var(--nl-button-primary-positive-color)}.nl-button:where(.nl-button--primary).nl-button--positive:hover{background-color:var(--nl-button-primary-positive-hover-background-color);border-color:var(--nl-button-primary-positive-hover-border-color);color:var(--nl-button-primary-positive-hover-color)}.nl-button:where(.nl-button--primary).nl-button--positive:active{background-color:var(--nl-button-primary-positive-active-background-color);border-color:var(--nl-button-primary-positive-active-border-color);color:var(--nl-button-primary-positive-active-color)}.nl-button:where(.nl-button--primary).nl-button--positive.nl-button--pressed{background-color:var(--nl-button-primary-positive-pressed-background-color);border-color:var(--nl-button-primary-positive-pressed-border-color);color:var(--nl-button-primary-positive-pressed-color)}.nl-button:where(.nl-button--primary.nl-button--positive).nl-button--pressed:hover{background-color:var(--nl-button-primary-positive-pressed-hover-background-color);border-color:var(--nl-button-primary-positive-pressed-hover-border-color);color:var(--nl-button-primary-positive-pressed-hover-color)}.nl-button:where(.nl-button--primary.nl-button--positive).nl-button--pressed:active{background-color:var(--nl-button-primary-positive-pressed-active-background-color);border-color:var(--nl-button-primary-positive-pressed-active-border-color);color:var(--nl-button-primary-positive-pressed-active-color)}.nl-button:where(.nl-button--primary).nl-button--positive.nl-button--pressed.nl-button--disabled{background-color:var(--nl-button-primary-pressed-disabled-background-color);border-color:var(--nl-button-primary-pressed-disabled-border-color);color:var(--nl-button-primary-pressed-disabled-color)}.nl-button:where(.nl-button--primary).nl-button--positive.nl-button--disabled{background-color:var(--nl-button-primary-disabled-background-color);border-color:var(--nl-button-primary-disabled-border-color);color:var(--nl-button-primary-disabled-color)}.nl-button:where(.nl-button--primary).nl-button--negative{background-color:var(--nl-button-primary-negative-background-color);border-color:var(--nl-button-primary-negative-border-color);color:var(--nl-button-primary-negative-color)}.nl-button:where(.nl-button--primary).nl-button--negative:hover{background-color:var(--nl-button-primary-negative-hover-background-color);border-color:var(--nl-button-primary-negative-hover-border-color);color:var(--nl-button-primary-negative-hover-color)}.nl-button:where(.nl-button--primary).nl-button--negative:active{background-color:var(--nl-button-primary-negative-active-background-color);border-color:var(--nl-button-primary-negative-active-border-color);color:var(--nl-button-primary-negative-active-color)}.nl-button:where(.nl-button--primary).nl-button--negative.nl-button--pressed{background-color:var(--nl-button-primary-negative-pressed-background-color);border-color:var(--nl-button-primary-negative-pressed-border-color);color:var(--nl-button-primary-negative-pressed-color)}.nl-button:where(.nl-button--primary.nl-button--negative).nl-button--pressed:hover{background-color:var(--nl-button-primary-negative-pressed-hover-background-color);border-color:var(--nl-button-primary-negative-pressed-hover-border-color);color:var(--nl-button-primary-negative-pressed-hover-color)}.nl-button:where(.nl-button--primary.nl-button--negative).nl-button--pressed:active{background-color:var(--nl-button-primary-negative-pressed-active-background-color);border-color:var(--nl-button-primary-negative-pressed-active-border-color);color:var(--nl-button-primary-negative-pressed-active-color)}.nl-button:where(.nl-button--primary).nl-button--negative.nl-button--pressed.nl-button--disabled{background-color:var(--nl-button-primary-pressed-disabled-background-color);border-color:var(--nl-button-primary-pressed-disabled-border-color);color:var(--nl-button-primary-pressed-disabled-color)}.nl-button:where(.nl-button--primary).nl-button--negative.nl-button--disabled{background-color:var(--nl-button-primary-disabled-background-color);border-color:var(--nl-button-primary-disabled-border-color);color:var(--nl-button-primary-disabled-color)}.nl-button:where(.nl-button--secondary){background-color:var(--nl-button-secondary-background-color);border-color:var(--nl-button-secondary-border-color);border-width:var(--nl-button-secondary-border-width);color:var(--nl-button-secondary-color);font-size:var(--nl-button-secondary-font-size);font-weight:var(--nl-button-secondary-font-weight);line-height:var(--nl-button-secondary-line-height)}.nl-button:where(.nl-button--secondary):hover{background-color:var(--nl-button-secondary-hover-background-color);border-color:var(--nl-button-secondary-hover-border-color);color:var(--nl-button-secondary-hover-color)}.nl-button:where(.nl-button--secondary):active{background-color:var(--nl-button-secondary-active-background-color);border-color:var(--nl-button-secondary-active-border-color);color:var(--nl-button-secondary-active-color)}.nl-button:where(.nl-button--secondary).nl-button--pressed{background-color:var(--nl-button-secondary-pressed-background-color);border-color:var(--nl-button-secondary-pressed-border-color);color:var(--nl-button-secondary-pressed-color)}.nl-button:where(.nl-button--secondary.nl-button--pressed):hover{background-color:var(--nl-button-secondary-pressed-hover-background-color);border-color:var(--nl-button-secondary-pressed-hover-border-color);color:var(--nl-button-secondary-pressed-hover-color)}.nl-button:where(.nl-button--secondary.nl-button--pressed):active{background-color:var(--nl-button-secondary-pressed-active-background-color);border-color:var(--nl-button-secondary-pressed-active-border-color);color:var(--nl-button-secondary-pressed-active-color)}.nl-button:where(.nl-button--secondary).nl-button--pressed.nl-button--disabled{background-color:var(--nl-button-secondary-pressed-disabled-background-color);border-color:var(--nl-button-secondary-pressed-disabled-border-color);color:var(--nl-button-secondary-pressed-disabled-color)}.nl-button:where(.nl-button--secondary).nl-button--disabled{background-color:var(--nl-button-secondary-disabled-background-color);border-color:var(--nl-button-secondary-disabled-border-color);color:var(--nl-button-secondary-disabled-color)}.nl-button:where(.nl-button--secondary).nl-button--positive{background-color:var(--nl-button-secondary-positive-background-color);border-color:var(--nl-button-secondary-positive-border-color);color:var(--nl-button-secondary-positive-color)}.nl-button:where(.nl-button--secondary).nl-button--positive:hover{background-color:var(--nl-button-secondary-positive-hover-background-color);border-color:var(--nl-button-secondary-positive-hover-border-color);color:var(--nl-button-secondary-positive-hover-color)}.nl-button:where(.nl-button--secondary).nl-button--positive:active{background-color:var(--nl-button-secondary-positive-active-background-color);border-color:var(--nl-button-secondary-positive-active-border-color);color:var(--nl-button-secondary-positive-active-color)}.nl-button:where(.nl-button--secondary).nl-button--positive.nl-button--pressed{background-color:var(--nl-button-secondary-positive-pressed-background-color);border-color:var(--nl-button-secondary-positive-pressed-border-color);color:var(--nl-button-secondary-positive-pressed-color)}.nl-button:where(.nl-button--secondary.nl-button--positive).nl-button--pressed:hover{background-color:var(--nl-button-secondary-positive-pressed-hover-background-color);border-color:var(--nl-button-secondary-positive-pressed-hover-border-color);color:var(--nl-button-secondary-positive-pressed-hover-color)}.nl-button:where(.nl-button--secondary.nl-button--positive).nl-button--pressed:active{background-color:var(--nl-button-secondary-positive-pressed-active-background-color);border-color:var(--nl-button-secondary-positive-pressed-active-border-color);color:var(--nl-button-secondary-positive-pressed-active-color)}.nl-button:where(.nl-button--secondary).nl-button--positive.nl-button--pressed.nl-button--disabled{background-color:var(--nl-button-secondary-pressed-disabled-background-color);border-color:var(--nl-button-secondary-pressed-disabled-border-color);color:var(--nl-button-secondary-pressed-disabled-color)}.nl-button:where(.nl-button--secondary).nl-button--positive.nl-button--disabled{background-color:var(--nl-button-secondary-disabled-background-color);border-color:var(--nl-button-secondary-disabled-border-color);color:var(--nl-button-secondary-disabled-color)}.nl-button:where(.nl-button--secondary).nl-button--negative{background-color:var(--nl-button-secondary-negative-background-color);border-color:var(--nl-button-secondary-negative-border-color);color:var(--nl-button-secondary-negative-color)}.nl-button:where(.nl-button--secondary).nl-button--negative:hover{background-color:var(--nl-button-secondary-negative-hover-background-color);border-color:var(--nl-button-secondary-negative-hover-border-color);color:var(--nl-button-secondary-negative-hover-color)}.nl-button:where(.nl-button--secondary).nl-button--negative:active{background-color:var(--nl-button-secondary-negative-active-background-color);border-color:var(--nl-button-secondary-negative-active-border-color);color:var(--nl-button-secondary-negative-active-color)}.nl-button:where(.nl-button--secondary).nl-button--negative.nl-button--pressed{background-color:var(--nl-button-secondary-negative-pressed-background-color);border-color:var(--nl-button-secondary-negative-pressed-border-color);color:var(--nl-button-secondary-negative-pressed-color)}.nl-button:where(.nl-button--secondary.nl-button--negative).nl-button--pressed:hover{background-color:var(--nl-button-secondary-negative-pressed-hover-background-color);border-color:var(--nl-button-secondary-negative-pressed-hover-border-color);color:var(--nl-button-secondary-negative-pressed-hover-color)}.nl-button:where(.nl-button--secondary.nl-button--negative).nl-button--pressed:active{background-color:var(--nl-button-secondary-negative-pressed-active-background-color);border-color:var(--nl-button-secondary-negative-pressed-active-border-color);color:var(--nl-button-secondary-negative-pressed-active-color)}.nl-button:where(.nl-button--secondary).nl-button--negative.nl-button--pressed.nl-button--disabled{background-color:var(--nl-button-secondary-pressed-disabled-background-color);border-color:var(--nl-button-secondary-pressed-disabled-border-color);color:var(--nl-button-secondary-pressed-disabled-color)}.nl-button:where(.nl-button--secondary).nl-button--negative.nl-button--disabled{background-color:var(--nl-button-secondary-disabled-background-color);border-color:var(--nl-button-secondary-disabled-border-color);color:var(--nl-button-secondary-disabled-color)}.nl-button:where(.nl-button--subtle){background-color:var(--nl-button-subtle-background-color);border-color:var(--nl-button-subtle-border-color);border-width:var(--nl-button-subtle-border-width);color:var(--nl-button-subtle-color);font-size:var(--nl-button-subtle-font-size);font-weight:var(--nl-button-subtle-font-weight);line-height:var(--nl-button-subtle-line-height)}.nl-button:where(.nl-button--subtle):hover{background-color:var(--nl-button-subtle-hover-background-color);border-color:var(--nl-button-subtle-hover-border-color);color:var(--nl-button-subtle-hover-color)}.nl-button:where(.nl-button--subtle):active{background-color:var(--nl-button-subtle-active-background-color);border-color:var(--nl-button-subtle-active-border-color);color:var(--nl-button-subtle-active-color)}.nl-button:where(.nl-button--subtle).nl-button--pressed{background-color:var(--nl-button-subtle-pressed-background-color);border-color:var(--nl-button-subtle-pressed-border-color);color:var(--nl-button-subtle-pressed-color)}.nl-button:where(.nl-button--subtle.nl-button--pressed):hover{background-color:var(--nl-button-subtle-pressed-hover-background-color);border-color:var(--nl-button-subtle-pressed-hover-border-color);color:var(--nl-button-subtle-pressed-hover-color)}.nl-button:where(.nl-button--subtle.nl-button--pressed):active{background-color:var(--nl-button-subtle-pressed-active-background-color);border-color:var(--nl-button-subtle-pressed-active-border-color);color:var(--nl-button-subtle-pressed-active-color)}.nl-button:where(.nl-button--subtle).nl-button--pressed.nl-button--disabled{background-color:var(--nl-button-subtle-pressed-disabled-background-color);border-color:var(--nl-button-subtle-pressed-disabled-border-color);color:var(--nl-button-subtle-pressed-disabled-color)}.nl-button:where(.nl-button--subtle).nl-button--disabled{background-color:var(--nl-button-subtle-disabled-background-color);border-color:var(--nl-button-subtle-disabled-border-color);color:var(--nl-button-subtle-disabled-color)}.nl-button:where(.nl-button--subtle).nl-button--positive{background-color:var(--nl-button-subtle-positive-background-color);border-color:var(--nl-button-subtle-positive-border-color);color:var(--nl-button-subtle-positive-color)}.nl-button:where(.nl-button--subtle).nl-button--positive:hover{background-color:var(--nl-button-subtle-positive-hover-background-color);border-color:var(--nl-button-subtle-positive-hover-border-color);color:var(--nl-button-subtle-positive-hover-color)}.nl-button:where(.nl-button--subtle).nl-button--positive:active{background-color:var(--nl-button-subtle-positive-active-background-color);border-color:var(--nl-button-subtle-positive-active-border-color);color:var(--nl-button-subtle-positive-active-color)}.nl-button:where(.nl-button--subtle).nl-button--positive.nl-button--pressed{background-color:var(--nl-button-subtle-positive-pressed-background-color);border-color:var(--nl-button-subtle-positive-pressed-border-color);color:var(--nl-button-subtle-positive-pressed-color)}.nl-button:where(.nl-button--subtle.nl-button--positive).nl-button--pressed:hover{background-color:var(--nl-button-subtle-positive-pressed-hover-background-color);border-color:var(--nl-button-subtle-positive-pressed-hover-border-color);color:var(--nl-button-subtle-positive-pressed-hover-color)}.nl-button:where(.nl-button--subtle.nl-button--positive).nl-button--pressed:active{background-color:var(--nl-button-subtle-positive-pressed-active-background-color);border-color:var(--nl-button-subtle-positive-pressed-active-border-color);color:var(--nl-button-subtle-positive-pressed-active-color)}.nl-button:where(.nl-button--subtle).nl-button--positive.nl-button--pressed.nl-button--disabled{background-color:var(--nl-button-subtle-pressed-disabled-background-color);border-color:var(--nl-button-subtle-pressed-disabled-border-color);color:var(--nl-button-subtle-pressed-disabled-color)}.nl-button:where(.nl-button--subtle).nl-button--positive.nl-button--disabled{background-color:var(--nl-button-subtle-disabled-background-color);border-color:var(--nl-button-subtle-disabled-border-color);color:var(--nl-button-subtle-disabled-color)}.nl-button:where(.nl-button--subtle).nl-button--negative{background-color:var(--nl-button-subtle-negative-background-color);border-color:var(--nl-button-subtle-negative-border-color);color:var(--nl-button-subtle-negative-color)}.nl-button:where(.nl-button--subtle).nl-button--negative:hover{background-color:var(--nl-button-subtle-negative-hover-background-color);border-color:var(--nl-button-subtle-negative-hover-border-color);color:var(--nl-button-subtle-negative-hover-color)}.nl-button:where(.nl-button--subtle).nl-button--negative:active{background-color:var(--nl-button-subtle-negative-active-background-color);border-color:var(--nl-button-subtle-negative-active-border-color);color:var(--nl-button-subtle-negative-active-color)}.nl-button:where(.nl-button--subtle).nl-button--negative.nl-button--pressed{background-color:var(--nl-button-subtle-negative-pressed-background-color);border-color:var(--nl-button-subtle-negative-pressed-border-color);color:var(--nl-button-subtle-negative-pressed-color)}.nl-button:where(.nl-button--subtle.nl-button--negative).nl-button--pressed:hover{background-color:var(--nl-button-subtle-negative-pressed-hover-background-color);border-color:var(--nl-button-subtle-negative-pressed-hover-border-color);color:var(--nl-button-subtle-negative-pressed-hover-color)}.nl-button:where(.nl-button--subtle.nl-button--negative).nl-button--pressed:active{background-color:var(--nl-button-subtle-negative-pressed-active-background-color);border-color:var(--nl-button-subtle-negative-pressed-active-border-color);color:var(--nl-button-subtle-negative-pressed-active-color)}.nl-button:where(.nl-button--subtle).nl-button--negative.nl-button--pressed.nl-button--disabled{background-color:var(--nl-button-subtle-pressed-disabled-background-color);border-color:var(--nl-button-subtle-pressed-disabled-border-color);color:var(--nl-button-subtle-pressed-disabled-color)}.nl-button:where(.nl-button--subtle).nl-button--negative.nl-button--disabled{background-color:var(--nl-button-subtle-disabled-background-color);border-color:var(--nl-button-subtle-disabled-border-color);color:var(--nl-button-subtle-disabled-color)}.nl-button:focus-visible,.nl-button.nl-button--focus-visible{background-color:var(--nl-button-focus-background-color);border-color:var(--nl-button-focus-border-color);color:var(--nl-button-focus-color)}", m = v`
|
|
7
|
-
.clippy-button--small {
|
|
8
|
-
--nl-button-min-inline-size: var(--clippy-button-small-min-inline-size, 32px);
|
|
9
|
-
--nl-button-min-block-size: var(--clippy-button-small-min-block-size, 32px);
|
|
10
|
-
--clippy-icon-size: var(--clippy-button-small-icon, 18px);
|
|
11
|
-
}
|
|
12
|
-
`;
|
|
13
|
-
var w = Object.defineProperty, f = Object.getOwnPropertyDescriptor, t = (o, l, a, b) => {
|
|
14
|
-
for (var e = b > 1 ? void 0 : b ? f(l, a) : l, c = o.length - 1, u; c >= 0; c--)
|
|
15
|
-
(u = o[c]) && (e = (b ? u(l, a, e) : u(e)) || e);
|
|
16
|
-
return b && e && w(l, a, e), e;
|
|
17
|
-
};
|
|
18
|
-
const x = "clippy-button", s = "medium";
|
|
19
|
-
let r = class extends h {
|
|
20
|
-
constructor() {
|
|
21
|
-
super(...arguments), this["icon-only"] = !1, this.toggle = void 0, this.pressed = !1, this.busy = !1, this.size = s, this.type = "button";
|
|
22
|
-
}
|
|
23
|
-
render() {
|
|
24
|
-
return g`
|
|
25
|
-
<button
|
|
26
|
-
type=${this.type}
|
|
27
|
-
aria-pressed=${this.toggle ? this.pressed : d}
|
|
28
|
-
aria-disabled=${this.disabled || d}
|
|
29
|
-
class=${y({
|
|
30
|
-
[`clippy-button--${this.size}`]: this.size !== s,
|
|
31
|
-
[`nl-button--${this.hint}`]: !!this.hint,
|
|
32
|
-
[`nl-button--${this.purpose}`]: !!this.purpose,
|
|
33
|
-
"nl-button": !0,
|
|
34
|
-
"nl-button--busy": this.busy,
|
|
35
|
-
"nl-button--disabled": this.disabled,
|
|
36
|
-
"nl-button--icon-only": this["icon-only"],
|
|
37
|
-
"nl-button--pressed": this.toggle ? this.pressed : !1
|
|
38
|
-
})}
|
|
39
|
-
>
|
|
40
|
-
<slot name="iconStart" class="nl-button__icon-start"></slot>
|
|
41
|
-
<span class="nl-button__label"><slot></slot></span>
|
|
42
|
-
<slot name="iconEnd" class="nl-button__icon-end"></slot>
|
|
43
|
-
</button>
|
|
44
|
-
`;
|
|
45
|
-
}
|
|
46
|
-
};
|
|
47
|
-
r.styles = [m, p(k)];
|
|
48
|
-
t([
|
|
49
|
-
n({ type: Boolean })
|
|
50
|
-
], r.prototype, "icon-only", 2);
|
|
51
|
-
t([
|
|
52
|
-
n({ type: Boolean })
|
|
53
|
-
], r.prototype, "toggle", 2);
|
|
54
|
-
t([
|
|
55
|
-
n({ type: Boolean })
|
|
56
|
-
], r.prototype, "pressed", 2);
|
|
57
|
-
t([
|
|
58
|
-
n({ type: Boolean })
|
|
59
|
-
], r.prototype, "busy", 2);
|
|
60
|
-
t([
|
|
61
|
-
n({
|
|
62
|
-
converter: {
|
|
63
|
-
fromAttribute: (o) => {
|
|
64
|
-
if (o === "positive" || o === "negative")
|
|
65
|
-
return o;
|
|
66
|
-
console.warn(`Invalid hint "${o}".`);
|
|
67
|
-
}
|
|
68
|
-
},
|
|
69
|
-
type: String
|
|
70
|
-
})
|
|
71
|
-
], r.prototype, "hint", 2);
|
|
72
|
-
t([
|
|
73
|
-
n({
|
|
74
|
-
converter: {
|
|
75
|
-
fromAttribute: (o) => o === "small" || o === "medium" ? o : (console.warn(`Invalid size "${o}". Using default "medium".`), "medium")
|
|
76
|
-
},
|
|
77
|
-
type: String
|
|
78
|
-
})
|
|
79
|
-
], r.prototype, "size", 2);
|
|
80
|
-
t([
|
|
81
|
-
n({
|
|
82
|
-
converter: {
|
|
83
|
-
fromAttribute: (o) => {
|
|
84
|
-
if (o === "primary" || o === "secondary" || o === "subtle")
|
|
85
|
-
return o;
|
|
86
|
-
console.warn(`Invalid purpose "${o}".`);
|
|
87
|
-
}
|
|
88
|
-
},
|
|
89
|
-
type: String
|
|
90
|
-
})
|
|
91
|
-
], r.prototype, "purpose", 2);
|
|
92
|
-
t([
|
|
93
|
-
n({
|
|
94
|
-
converter: {
|
|
95
|
-
fromAttribute: (o) => o === "button" || o === "submit" || o === "reset" ? o : (console.warn(`Invalid button type "${o}". Using default "button".`), "button")
|
|
96
|
-
},
|
|
97
|
-
type: String
|
|
98
|
-
})
|
|
99
|
-
], r.prototype, "type", 2);
|
|
100
|
-
r = t([
|
|
101
|
-
i(x)
|
|
102
|
-
], r);
|
|
103
|
-
export {
|
|
104
|
-
r as C,
|
|
105
|
-
k as b
|
|
106
|
-
};
|
package/dist/index-CaVpiaBC.js
DELETED
|
@@ -1,52 +0,0 @@
|
|
|
1
|
-
var A = (t) => {
|
|
2
|
-
throw TypeError(t);
|
|
3
|
-
};
|
|
4
|
-
var p = (t, e, n) => e.has(t) || A("Cannot " + n);
|
|
5
|
-
var c = (t, e, n) => (p(t, e, "read from private field"), n ? n.call(t) : e.get(t)), h = (t, e, n) => e.has(t) ? A("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(t) : e.set(t, n), g = (t, e, n, l) => (p(t, e, "write to private field"), l ? l.call(t, n) : e.set(t, n), n);
|
|
6
|
-
import { property as _ } from "lit/decorators.js";
|
|
7
|
-
var f = Object.defineProperty, b = Object.getOwnPropertyDescriptor, D = (t, e, n, l) => {
|
|
8
|
-
for (var i = b(e, n), s = t.length - 1, L; s >= 0; s--)
|
|
9
|
-
(L = t[s]) && (i = L(e, n, i) || i);
|
|
10
|
-
return i && f(e, n, i), i;
|
|
11
|
-
};
|
|
12
|
-
const E = "en", N = (t, e = E) => {
|
|
13
|
-
var i, s;
|
|
14
|
-
const n = (s = class extends t {
|
|
15
|
-
constructor() {
|
|
16
|
-
super(...arguments);
|
|
17
|
-
// Static because not dependent on the instance
|
|
18
|
-
h(this, i);
|
|
19
|
-
}
|
|
20
|
-
get DEFAULT_LANG() {
|
|
21
|
-
return s.DEFAULT_LANG;
|
|
22
|
-
}
|
|
23
|
-
get lang() {
|
|
24
|
-
return c(this, i) || this.DEFAULT_LANG;
|
|
25
|
-
}
|
|
26
|
-
set lang(r) {
|
|
27
|
-
r && c(this, i) !== r && g(this, i, r);
|
|
28
|
-
}
|
|
29
|
-
connectedCallback() {
|
|
30
|
-
super.connectedCallback();
|
|
31
|
-
const r = "lang";
|
|
32
|
-
let o = c(this, i) || this.getAttribute(r);
|
|
33
|
-
if (!o) {
|
|
34
|
-
let a = this.parentElement;
|
|
35
|
-
for (; a; ) {
|
|
36
|
-
if (a.hasAttribute(r)) {
|
|
37
|
-
o = a.getAttribute(r) || o;
|
|
38
|
-
break;
|
|
39
|
-
}
|
|
40
|
-
a = a.parentElement;
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
this.lang = o || this.DEFAULT_LANG;
|
|
44
|
-
}
|
|
45
|
-
}, i = new WeakMap(), s.DEFAULT_LANG = e, s);
|
|
46
|
-
return D([
|
|
47
|
-
_()
|
|
48
|
-
], n.prototype, "lang"), n;
|
|
49
|
-
};
|
|
50
|
-
export {
|
|
51
|
-
N as L
|
|
52
|
-
};
|
package/dist/index-CmKtM5nD.js
DELETED
|
@@ -1,379 +0,0 @@
|
|
|
1
|
-
import { s as Y } from "./decorators-BGpMqJ7V.js";
|
|
2
|
-
import { css as A, unsafeCSS as I, html as _, nothing as B } from "lit";
|
|
3
|
-
import { property as g, state as F } from "lit/decorators.js";
|
|
4
|
-
import { classMap as V } from "lit/directives/class-map.js";
|
|
5
|
-
import { ifDefined as j } from "lit/directives/if-defined.js";
|
|
6
|
-
import { F as J } from "./index-D3FiqptQ.js";
|
|
7
|
-
const L = (t) => (o) => {
|
|
8
|
-
if (o === null || o === "")
|
|
9
|
-
return null;
|
|
10
|
-
const r = (e) => e.trim().split(t).map((i) => i.trim());
|
|
11
|
-
try {
|
|
12
|
-
const e = o && JSON.parse(o);
|
|
13
|
-
return Array.isArray(e) ? e : null;
|
|
14
|
-
} catch {
|
|
15
|
-
return r(o);
|
|
16
|
-
}
|
|
17
|
-
}, Q = L(/\s+/), wt = L(","), K = ".utrecht-combobox{inline-size:100%;max-inline-size:var(--utrecht-textbox-max-inline-size, var(--utrecht-form-control-max-inline-size));position:relative}.utrecht-combobox__popover{border-width:0;padding-block-end:0;padding-block-start:0;padding-inline-end:0;padding-inline-start:0;background-color:canvas;block-size:fit-content;color:canvastext;inline-size:fit-content;inset:0;overflow:auto;position:absolute;z-index:var(--utrecht-combobox-popover-z-index, 1)}.utrecht-combobox__popover--block-end{inset-block-start:100%}.utrecht-combobox__popover--hidden{display:none!important}", U = ".utrecht-listbox{--utrecht-listbox-max-block-size: 300px;background-color:var(--_utrecht-listbox-disabled-background-color, var(--_utrecht-listbox-interactive-background-color, var(--utrecht-listbox-background-color)));border-color:var(--_utrecht-listbox-disabled-border-color, var(--_utrecht-listbox-interactive-border-color, var(--utrecht-listbox-border-color)));border-radius:var(--utrecht-listbox-border-radius);border-style:solid;border-width:var(--utrecht-listbox-border-width);box-sizing:border-box;color:var(--_utrecht-listbox-disabled-color, var(--_utrecht-listbox-interactive-color, var(--utrecht-listbox-color)));cursor:default;display:flex;flex-direction:column;font-weight:var(--utrecht-listbox-font-weight, var(--utrecht-form-control-font-weight, initial));inline-size:var(--utrecht-listbox-inline-size, var(--utrecht-form-control-max-inline-size));max-block-size:var(--utrecht-listbox-max-block-size);max-inline-size:100%;min-block-size:1em;overflow-block:auto;overflow-y:auto;padding-block-end:var(--utrecht-listbox-padding-block-end);padding-block-start:var(--utrecht-listbox-padding-block-start);padding-inline-end:var(--utrecht-listbox-padding-inline-end);padding-inline-start:var(--utrecht-listbox-padding-inline-start);-webkit-user-select:none;user-select:none}@media(forced-colors:active){.utrecht-listbox{--utrecht-listbox-background-color: field;--utrecht-listbox-border-color: fieldtext;--utrecht-listbox-hover-background-color: field;--utrecht-listbox-hover-border-color: fieldtext;--utrecht-listbox-hover-color: fieldtext;--utrecht-listbox-focus-border-color: Highlight;--utrecht-listbox-disabled-border-color: GrayText;--utrecht-listbox-option-background-color: field;--utrecht-listbox-option-color: fieldtext;--utrecht-listbox-option-hover-background-color: Highlight;--utrecht-listbox-option-hover-color: HighlightText;--utrecht-listbox-option-active-background-color: Highlight;--utrecht-listbox-option-active-color: HighlightText;--utrecht-listbox-option-disabled-background-color: field;--utrecht-listbox-option-disabled-color: GrayText;--utrecht-listbox-option-selected-background-color: Highlight;--utrecht-listbox-option-selected-color: HighlightText;--utrecht-listbox-option-selected-hover-background-color: Highlight;--utrecht-listbox-option-selected-hover-color: HighlightText;--utrecht-listbox-option-selected-disabled-background-color: GrayText;--utrecht-listbox-option-selected-disabled-color: field}}.utrecht-listbox--focus{--_utrecht-listbox-interactive-border-color: var(--utrecht-listbox-focus-border-color)}.utrecht-listbox--focus-visible{--_utrecht-focus-ring-box-shadow: 0 0 0 var(--utrecht-focus-outline-width, 0) var(--utrecht-focus-inverse-outline-color, transparent);box-shadow:var(--_utrecht-focus-ring-box-shadow);outline-color:var(--utrecht-focus-outline-color, revert);outline-offset:var(--utrecht-focus-outline-offset, revert);outline-style:var(--utrecht-focus-outline-style, revert);outline-width:var(--utrecht-focus-outline-width, revert);z-index:1}.utrecht-listbox__list{margin-block-end:0;margin-block-start:0;margin-inline-end:0;margin-inline-start:0;padding-inline-start:0}.utrecht-listbox__group{margin-block-end:0;margin-block-start:0;margin-inline-end:0;margin-inline-start:0;padding-inline-start:0;margin-block-end:var(--utrecht-listbox-option-group-margin-block-end)}.utrecht-listbox__group-label{color:var(--utrecht-listbox-option-group-label-color);font-size:var(--utrecht-listbox-option-group-label-font-size);font-weight:var(--utrecht-listbox-option-group-label-font-weight);line-height:var(--utrecht-listbox-option-group-label-line-height);margin-inline-start:var(--utrecht-listbox-option-group-label-margin-inline-start)}@media(forced-colors:active){.utrecht-listbox__group-label{background-color:field;color:fieldtext}}.utrecht-listbox__option{list-style:none;--_utrecht-listbox-option-background-color: var( --_utrecht-listbox-option-disabled-background-color, var( --_utrecht-listbox-option-interactive-background-color, var(--_utrecht-listbox-option-state-background-color, var(--utrecht-listbox-option-background-color)) ) );--_utrecht-listbox-option-color: var( --_utrecht-listbox-option-disabled-color, var( --_utrecht-listbox-option-interactive-color, var(--_utrecht-listbox-option-state-color, var(--utrecht-listbox-option-color)) ) );align-items:center;background-color:var(--_utrecht-listbox-option-background-color);box-sizing:border-box;color:var(--_utrecht-listbox-option-color);display:flex;min-block-size:var(--utrecht-listbox-option-min-block-size, var(--utrecht-pointer-target-min-size, 24px));padding-block-end:var(--utrecht-listbox-option-padding-block-end);padding-block-start:var(--utrecht-listbox-option-padding-block-start);padding-inline-end:var(--utrecht-listbox-option-padding-inline-end);padding-inline-start:var(--utrecht-listbox-option-padding-inline-start)}@media(forced-colors:active){.utrecht-listbox__option{forced-color-adjust:none}}.utrecht-listbox__option--hover{--_utrecht-listbox-option-interactive-background-color: var(--utrecht-listbox-option-hover-background-color);--_utrecht-listbox-option-interactive-color: var(--utrecht-listbox-option-hover-color)}.utrecht-listbox__option--focus{--_utrecht-listbox-option-state-background-color: var(--utrecht-listbox-option-focus-background-color);--_utrecht-listbox-option-state-color: var(--utrecht-listbox-option-focus-color)}.utrecht-listbox__option--focus-visible{--_utrecht-focus-ring-box-shadow: 0 0 0 var(--utrecht-focus-outline-width, 0) var(--utrecht-focus-inverse-outline-color, transparent);box-shadow:var(--_utrecht-focus-ring-box-shadow);outline-color:var(--utrecht-focus-outline-color, revert);outline-offset:var(--utrecht-focus-outline-offset, revert);outline-style:var(--utrecht-focus-outline-style, revert);outline-width:var(--utrecht-focus-outline-width, revert);z-index:1;--utrecht-focus-outline-offset: calc(var(--utrecht-focus-outline-width) * -1)}.utrecht-listbox__option--active{--_utrecht-listbox-option-state-background-color: var(--utrecht-listbox-option-active-background-color);--_utrecht-listbox-option-state-color: var(--utrecht-listbox-option-active-color);font-weight:var(--utrecht-listbox-option-is-active-font-weight)}.utrecht-listbox__option--selected{--_utrecht-listbox-option-disabled-background-color: var(--utrecht-listbox-option-selected-disabled-background-color);--_utrecht-listbox-option-disabled-color: var(--utrecht-listbox-option-selected-disabled-color);--_utrecht-listbox-option-interactive-background-color: var(--utrecht-listbox-option-selected-hover-background-color);--_utrecht-listbox-option-interactive-color: var(--utrecht-listbox-option-selected-hover-color);--_utrecht-listbox-option-state-background-color: var(--utrecht-listbox-option-selected-background-color);--_utrecht-listbox-option-state-color: var(--utrecht-listbox-option-selected-color)}.utrecht-listbox__option--html-li{list-style:none}.utrecht-listbox__option--html-li:hover{--_utrecht-listbox-option-interactive-background-color: var(--utrecht-listbox-option-hover-background-color);--_utrecht-listbox-option-interactive-color: var(--utrecht-listbox-option-hover-color)}.utrecht-listbox__option--html-li:focus{--_utrecht-listbox-option-state-background-color: var(--utrecht-listbox-option-focus-background-color);--_utrecht-listbox-option-state-color: var(--utrecht-listbox-option-focus-color)}.utrecht-listbox__option--disabled{--utrecht-listbox-option-hover-background-color: var(--utrecht-listbox-option-disabled-background-color);--utrecht-listbox-option-hover-color: var(--utrecht-listbox-option-disabled-color);--_utrecht-listbox-option-interactive-background-color: var(--utrecht-listbox-option-disabled-background-color);--_utrecht-listbox-option-interactive-color: var(--utrecht-listbox-option-disabled-color);cursor:var(--utrecht-action-disabled-cursor, not-allowed)}.utrecht-listbox--disabled{--_utrecht-listbox-option-disabled-background-color: var(--utrecht-listbox-option-disabled-background-color);--_utrecht-listbox-option-disabled-color: var(--utrecht-listbox-option-disabled-color);--_utrecht-listbox-disabled-background-color: var(--utrecht-listbox-disabled-background-color);--_utrecht-listbox-disabled-border-color: var(--utrecht-listbox-disabled-border-color);--_utrecht-listbox-disabled-color: var(--utrecht-listbox-disabled-color);cursor:var(--utrecht-action-disabled-cursor, not-allowed)}.utrecht-listbox--html-div:focus{--_utrecht-listbox-interactive-border-color: var(--utrecht-listbox-focus-border-color)}.utrecht-listbox--html-div:focus-visible{--_utrecht-focus-ring-box-shadow: 0 0 0 var(--utrecht-focus-outline-width, 0) var(--utrecht-focus-inverse-outline-color, transparent);box-shadow:var(--_utrecht-focus-ring-box-shadow);outline-color:var(--utrecht-focus-outline-color, revert);outline-offset:var(--utrecht-focus-outline-offset, revert);outline-style:var(--utrecht-focus-outline-style, revert);outline-width:var(--utrecht-focus-outline-width, revert);z-index:1}.utrecht-listbox--forced-colors{--utrecht-listbox-background-color: field;--utrecht-listbox-border-color: fieldtext;--utrecht-listbox-hover-background-color: field;--utrecht-listbox-hover-border-color: fieldtext;--utrecht-listbox-hover-color: fieldtext;--utrecht-listbox-focus-border-color: Highlight;--utrecht-listbox-disabled-border-color: GrayText;--utrecht-listbox-option-background-color: field;--utrecht-listbox-option-color: fieldtext;--utrecht-listbox-option-hover-background-color: Highlight;--utrecht-listbox-option-hover-color: HighlightText;--utrecht-listbox-option-active-background-color: Highlight;--utrecht-listbox-option-active-color: HighlightText;--utrecht-listbox-option-disabled-background-color: field;--utrecht-listbox-option-disabled-color: GrayText;--utrecht-listbox-option-selected-background-color: Highlight;--utrecht-listbox-option-selected-color: HighlightText;--utrecht-listbox-option-selected-hover-background-color: Highlight;--utrecht-listbox-option-selected-hover-color: HighlightText;--utrecht-listbox-option-selected-disabled-background-color: GrayText;--utrecht-listbox-option-selected-disabled-color: field}", X = '.utrecht-textbox{--_utrecht-textbox-value-char: .667em + .334ch;--_utrecht-textbox-max-inline-size: calc( calc(var(--utrecht-textbox-value-max-length) * var(--_utrecht-textbox-value-char)) + var(--utrecht-textbox-padding-inline-end, var(--utrecht-form-control-padding-inline-end, 0)) + var(--utrecht-textbox-padding-inline-start, var(--utrecht-form-control-padding-inline-start, 0)) + var(--utrecht-textbox-border-width, var(--utrecht-form-control-border-width, 0)) + var(--utrecht-textbox-autocomplete-ui-size, 44px) );background-color:var(--utrecht-textbox-background-color, var(--utrecht-form-control-background-color));block-size:initial;border-width:var(--utrecht-textbox-border-width, var(--utrecht-form-control-border-width));border-block-end-width:var(--utrecht-textbox-border-bottom-width, var(--utrecht-textbox-border-width, var(--utrecht-form-control-border-width)));border-color:var(--utrecht-textbox-border-color, var(--utrecht-form-control-border-color));border-radius:var(--utrecht-textbox-border-radius, var(--utrecht-form-control-border-radius, 0));border-style:solid;box-sizing:border-box;color:var(--utrecht-textbox-color, var(--utrecht-form-control-color));font-family:var(--utrecht-textbox-font-family, var(--utrecht-form-control-font-family));font-size:var(--utrecht-textbox-font-size, var(--utrecht-form-control-font-size, inherit));font-weight:var(--utrecht-textbox-font-weight, var(--utrecht-form-control-font-weight, initial));inline-size:100%;line-height:var(--utrecht-textbox-line-height, var(--utrecht-form-control-line-height, initial));min-block-size:var(--utrecht-pointer-target-min-size, 44px);min-inline-size:var(--utrecht-pointer-target-min-size, 44px);max-inline-size:min(var(--_utrecht-textbox-max-inline-size, 100%),var(--utrecht-textbox-max-inline-size, var(--utrecht-form-control-max-inline-size)));padding-block-end:var(--utrecht-textbox-padding-block-end, var(--utrecht-form-control-padding-block-end, 0));padding-block-start:var(--utrecht-textbox-padding-block-start, var(--utrecht-form-control-padding-block-start, 0));padding-inline-end:var(--utrecht-textbox-padding-inline-end, var(--utrecht-form-control-padding-inline-end, initial));padding-inline-start:var(--utrecht-textbox-padding-inline-start, var(--utrecht-form-control-padding-inline-start, initial))}.utrecht-textbox--invalid{--_utrecht-textbox-border-width: var( --utrecht-textbox-invalid-border-width, var( --utrecht-form-control-invalid-border-width, var(--utrecht-textbox-border-width, var(--utrecht-form-control-border-width)) ) );background-color:var(--utrecht-textbox-invalid-background-color, var(--utrecht-form-control-invalid-background-color, var(--utrecht-textbox-background-color, var(--utrecht-form-control-background-color))));border-width:var(--_utrecht-textbox-border-width);border-block-end-width:var(--utrecht-textbox-invalid-border-bottom-width, var(--utrecht-form-control-invalid-border-bottom-width, var(--utrecht-textbox-border-bottom-width, var(--utrecht-form-control-border-bottom-width, var(--_utrecht-textbox-border-width)))));border-color:var(--utrecht-textbox-invalid-border-color, var(--utrecht-form-control-invalid-border-color, var(--utrecht-textbox-border-color, var(--utrecht-form-control-border-color))));color:var(--utrecht-textbox-invalid-color, var(--utrecht-form-control-invalid-color, var(--utrecht-textbox-color, var(--utrecht-form-control-color))))}.utrecht-textbox--disabled{background-color:var(--utrecht-textbox-disabled-background-color, var(--utrecht-form-control-disabled-background-color, var(--utrecht-textbox-background-color, var(--utrecht-form-control-background-color))));border-color:var(--utrecht-textbox-disabled-border-color, var(--utrecht-form-control-disabled-border-color, var(--utrecht-textbox-border-color, var(--utrecht-form-control-border-color))));color:var(--utrecht-textbox-disabled-color, var(--utrecht-form-control-disabled-color, var(--utrecht-textbox-color, var(--utrecht-form-control-color))));cursor:var(--utrecht-action-disabled-cursor, not-allowed)}.utrecht-textbox--focus{background-color:var(--utrecht-textbox-focus-background-color, var(--utrecht-form-control-focus-background-color, var(--utrecht-textbox-background-color, var(--utrecht-form-control-background-color))));border-color:var(--utrecht-textbox-focus-border-color, var(--utrecht-form-control-focus-border-color, var(--utrecht-textbox-border-color, var(--utrecht-form-control-border-color))));color:var(--utrecht-textbox-focus-color, var(--utrecht-form-control-focus-color, var(--utrecht-textbox-color, var(--utrecht-form-control-color))))}.utrecht-textbox--focus-visible{--_utrecht-focus-ring-box-shadow: 0 0 0 var(--utrecht-focus-outline-width, 0) var(--utrecht-focus-inverse-outline-color, transparent);box-shadow:var(--_utrecht-focus-ring-box-shadow);outline-color:var(--utrecht-focus-outline-color, revert);outline-offset:var(--utrecht-focus-outline-offset, revert);outline-style:var(--utrecht-focus-outline-style, revert);outline-width:var(--utrecht-focus-outline-width, revert);z-index:1}.utrecht-textbox--read-only{background-color:var(--utrecht-textbox-read-only-background-color, var(--utrecht-form-control-read-only-background-color, var(--utrecht-textbox-background-color, var(--utrecht-form-control-background-color))));border-color:var(--utrecht-textbox-read-only-border-color, var(--utrecht-form-control-read-only-border-color, var(--utrecht-textbox-border-color, var(--utrecht-form-control-border-color))));color:var(--utrecht-textbox-read-only-color, var(--utrecht-form-control-read-only-color, var(--utrecht-textbox-color, var(--utrecht-form-control-color))))}.utrecht-textbox__placeholder{color:var(--utrecht-textbox-placeholder-color, var(--utrecht-form-control-placeholder-color, var(--utrecht-textbox-color, var(--utrecht-form-control-color))));font-style:var(--utrecht-form-control-placeholder-font-style);opacity:100%}.utrecht-textbox--numeric{-moz-appearance:textfield;font-variant-numeric:lining-nums tabular-nums}.utrecht-textbox--password{font-variant-ligatures:none;font-variant-numeric:slashed-zero}.utrecht-textbox--postal-code-nl-size{--utrecht-textbox-value-max-length: 7}.utrecht-textbox--house-number-size{--utrecht-textbox-value-max-length: 5}.utrecht-textbox--house-letter-size{--utrecht-textbox-value-max-length: 1}.utrecht-textbox--house-addition-size{--utrecht-textbox-value-max-length: 4}.utrecht-textbox--voorvoegsel-size{--utrecht-textbox-value-max-length: 10}.utrecht-textbox--tel-size{--utrecht-textbox-value-max-length: 19}.utrecht-textbox--tel-nl-size{--utrecht-textbox-value-max-length: 13}.utrecht-textbox--iban-size{--utrecht-textbox-value-max-length: 41}.utrecht-textbox--iban-nl-size{--utrecht-textbox-value-max-length: 22}.utrecht-textbox--placeholder-ltr::placeholder,.utrecht-textbox--placeholder-ltr:placeholder-shown{direction:ltr}.utrecht-textbox--placeholder-rtl::placeholder,.utrecht-textbox--placeholder-rtl:placeholder-shown{direction:rtl}.utrecht-textbox--url{font-variant-ligatures:none}.utrecht-textbox--html-input:focus{background-color:var(--utrecht-textbox-focus-background-color, var(--utrecht-form-control-focus-background-color, var(--utrecht-textbox-background-color, var(--utrecht-form-control-background-color))));border-color:var(--utrecht-textbox-focus-border-color, var(--utrecht-form-control-focus-border-color, var(--utrecht-textbox-border-color, var(--utrecht-form-control-border-color))));color:var(--utrecht-textbox-focus-color, var(--utrecht-form-control-focus-color, var(--utrecht-textbox-color, var(--utrecht-form-control-color))))}.utrecht-textbox--html-input:focus-visible{--_utrecht-focus-ring-box-shadow: 0 0 0 var(--utrecht-focus-outline-width, 0) var(--utrecht-focus-inverse-outline-color, transparent);box-shadow:var(--_utrecht-focus-ring-box-shadow);outline-color:var(--utrecht-focus-outline-color, revert);outline-offset:var(--utrecht-focus-outline-offset, revert);outline-style:var(--utrecht-focus-outline-style, revert);outline-width:var(--utrecht-focus-outline-width, revert);z-index:1}.utrecht-textbox--html-input:user-invalid,.utrecht-textbox--html-input[aria-invalid=true]{--_utrecht-textbox-border-width: var( --utrecht-textbox-invalid-border-width, var( --utrecht-form-control-invalid-border-width, var(--utrecht-textbox-border-width, var(--utrecht-form-control-border-width)) ) );background-color:var(--utrecht-textbox-invalid-background-color, var(--utrecht-form-control-invalid-background-color, var(--utrecht-textbox-background-color, var(--utrecht-form-control-background-color))));border-width:var(--_utrecht-textbox-border-width);border-block-end-width:var(--utrecht-textbox-invalid-border-bottom-width, var(--utrecht-form-control-invalid-border-bottom-width, var(--utrecht-textbox-border-bottom-width, var(--utrecht-form-control-border-bottom-width, var(--_utrecht-textbox-border-width)))));border-color:var(--utrecht-textbox-invalid-border-color, var(--utrecht-form-control-invalid-border-color, var(--utrecht-textbox-border-color, var(--utrecht-form-control-border-color))));color:var(--utrecht-textbox-invalid-color, var(--utrecht-form-control-invalid-color, var(--utrecht-textbox-color, var(--utrecht-form-control-color))))}.utrecht-textbox--html-input:read-only{background-color:var(--utrecht-textbox-read-only-background-color, var(--utrecht-form-control-read-only-background-color, var(--utrecht-textbox-background-color, var(--utrecht-form-control-background-color))));border-color:var(--utrecht-textbox-read-only-border-color, var(--utrecht-form-control-read-only-border-color, var(--utrecht-textbox-border-color, var(--utrecht-form-control-border-color))));color:var(--utrecht-textbox-read-only-color, var(--utrecht-form-control-read-only-color, var(--utrecht-textbox-color, var(--utrecht-form-control-color))))}.utrecht-textbox--html-input:disabled{background-color:var(--utrecht-textbox-disabled-background-color, var(--utrecht-form-control-disabled-background-color, var(--utrecht-textbox-background-color, var(--utrecht-form-control-background-color))));border-color:var(--utrecht-textbox-disabled-border-color, var(--utrecht-form-control-disabled-border-color, var(--utrecht-textbox-border-color, var(--utrecht-form-control-border-color))));color:var(--utrecht-textbox-disabled-color, var(--utrecht-form-control-disabled-color, var(--utrecht-textbox-color, var(--utrecht-form-control-color))));cursor:var(--utrecht-action-disabled-cursor, not-allowed)}.utrecht-textbox--html-input::placeholder{color:var(--utrecht-textbox-placeholder-color, var(--utrecht-form-control-placeholder-color, var(--utrecht-textbox-color, var(--utrecht-form-control-color))));font-style:var(--utrecht-form-control-placeholder-font-style);opacity:100%}.utrecht-textbox--html-input[type=password i]{font-variant-ligatures:none;font-variant-numeric:slashed-zero}.utrecht-textbox--html-input[type=url i],.utrecht-textbox--html-input[type=email i],.utrecht-textbox--html-input[inputMode=email i],.utrecht-textbox--html-input[inputMode=url i]{font-variant-ligatures:none}.utrecht-textbox--html-input[pattern="\\\\d*"],.utrecht-textbox--html-input[pattern="[0-9]*"],.utrecht-textbox--html-input[type=number i],.utrecht-textbox--html-input[type=tel i],.utrecht-textbox--html-input[inputMode=numeric i],.utrecht-textbox--html-input[inputMode=decimal i],.utrecht-textbox--html-input[inputMode=tel i]{-moz-appearance:textfield;font-variant-numeric:lining-nums tabular-nums}', Z = (t, o, r, e) => {
|
|
18
|
-
if (r === "length" || r === "prototype" || r === "arguments" || r === "caller")
|
|
19
|
-
return;
|
|
20
|
-
const i = Object.getOwnPropertyDescriptor(t, r), n = Object.getOwnPropertyDescriptor(o, r);
|
|
21
|
-
!tt(i, n) && e || Object.defineProperty(t, r, n);
|
|
22
|
-
}, tt = function(t, o) {
|
|
23
|
-
return t === void 0 || t.configurable || t.writable === o.writable && t.enumerable === o.enumerable && t.configurable === o.configurable && (t.writable || t.value === o.value);
|
|
24
|
-
}, ot = (t, o) => {
|
|
25
|
-
const r = Object.getPrototypeOf(o);
|
|
26
|
-
r !== Object.getPrototypeOf(t) && Object.setPrototypeOf(t, r);
|
|
27
|
-
}, rt = (t, o) => `/* Wrapped ${t}*/
|
|
28
|
-
${o}`, et = Object.getOwnPropertyDescriptor(Function.prototype, "toString"), it = Object.getOwnPropertyDescriptor(Function.prototype.toString, "name"), ct = (t, o, r) => {
|
|
29
|
-
const e = r === "" ? "" : `with ${r.trim()}() `, i = rt.bind(null, e, o.toString());
|
|
30
|
-
Object.defineProperty(i, "name", it);
|
|
31
|
-
const { writable: n, enumerable: d, configurable: m } = et;
|
|
32
|
-
Object.defineProperty(t, "toString", { value: i, writable: n, enumerable: d, configurable: m });
|
|
33
|
-
};
|
|
34
|
-
function lt(t, o, { ignoreNonConfigurable: r = !1 } = {}) {
|
|
35
|
-
const { name: e } = t;
|
|
36
|
-
for (const i of Reflect.ownKeys(o))
|
|
37
|
-
Z(t, o, i, r);
|
|
38
|
-
return ot(t, o), ct(t, o, e), t;
|
|
39
|
-
}
|
|
40
|
-
const k = 2147483647, nt = /* @__PURE__ */ new WeakMap(), $ = /* @__PURE__ */ new WeakMap(), at = /* @__PURE__ */ new WeakMap();
|
|
41
|
-
function ut(t, o) {
|
|
42
|
-
const r = t.get(o);
|
|
43
|
-
if (r) {
|
|
44
|
-
if (r.maxAge <= Date.now()) {
|
|
45
|
-
t.delete(o);
|
|
46
|
-
return;
|
|
47
|
-
}
|
|
48
|
-
return r;
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
function st(t, { cacheKey: o, cache: r = /* @__PURE__ */ new Map(), maxAge: e } = {}) {
|
|
52
|
-
if (e === 0)
|
|
53
|
-
return t;
|
|
54
|
-
if (typeof e == "number" && Number.isFinite(e)) {
|
|
55
|
-
if (e > k)
|
|
56
|
-
throw new TypeError(`The \`maxAge\` option cannot exceed ${k}.`);
|
|
57
|
-
if (e < 0)
|
|
58
|
-
throw new TypeError("The `maxAge` option should not be a negative number.");
|
|
59
|
-
}
|
|
60
|
-
const i = function(...n) {
|
|
61
|
-
const d = o ? o(n) : n[0], m = ut(r, d);
|
|
62
|
-
if (m)
|
|
63
|
-
return m.data;
|
|
64
|
-
const O = t.apply(this, n), u = typeof e == "function" ? e(...n) : e;
|
|
65
|
-
if (u !== void 0 && u !== Number.POSITIVE_INFINITY) {
|
|
66
|
-
if (!Number.isFinite(u))
|
|
67
|
-
throw new TypeError("The `maxAge` function must return a finite number, `0`, or `Infinity`.");
|
|
68
|
-
if (u <= 0)
|
|
69
|
-
return O;
|
|
70
|
-
if (u > k)
|
|
71
|
-
throw new TypeError(`The \`maxAge\` function result cannot exceed ${k}.`);
|
|
72
|
-
}
|
|
73
|
-
if (r.set(d, {
|
|
74
|
-
data: O,
|
|
75
|
-
maxAge: u === void 0 || u === Number.POSITIVE_INFINITY ? Number.POSITIVE_INFINITY : Date.now() + u
|
|
76
|
-
}), u !== void 0 && u !== Number.POSITIVE_INFINITY) {
|
|
77
|
-
const T = setTimeout(() => {
|
|
78
|
-
r.delete(d), $.get(i)?.delete(T);
|
|
79
|
-
}, u);
|
|
80
|
-
T.unref?.();
|
|
81
|
-
const W = $.get(i) ?? /* @__PURE__ */ new Set();
|
|
82
|
-
W.add(T), $.set(i, W);
|
|
83
|
-
}
|
|
84
|
-
return O;
|
|
85
|
-
};
|
|
86
|
-
return lt(i, t, {
|
|
87
|
-
ignoreNonConfigurable: !0
|
|
88
|
-
}), nt.set(i, r), at.set(i, o ?? ((n) => n[0])), i;
|
|
89
|
-
}
|
|
90
|
-
const ht = A`
|
|
91
|
-
/* stylelint-disable */
|
|
92
|
-
.sr-only {
|
|
93
|
-
position: absolute;
|
|
94
|
-
inline-size: 1px;
|
|
95
|
-
block-size: 1px;
|
|
96
|
-
padding: 0;
|
|
97
|
-
margin: -1px;
|
|
98
|
-
overflow: hidden;
|
|
99
|
-
clip: rect(0, 0, 0, 0);
|
|
100
|
-
white-space: nowrap;
|
|
101
|
-
border-width: 0;
|
|
102
|
-
}
|
|
103
|
-
`, dt = A`
|
|
104
|
-
.clippy-combobox__input-container {
|
|
105
|
-
display: inline-block;
|
|
106
|
-
inline-size: 100%;
|
|
107
|
-
position: relative;
|
|
108
|
-
}
|
|
109
|
-
.clippy-combobox__current-option {
|
|
110
|
-
pointer-events: none;
|
|
111
|
-
position: absolute;
|
|
112
|
-
display: flex;
|
|
113
|
-
// Clip contents when current option exceeds input size
|
|
114
|
-
inline-size: 100%;
|
|
115
|
-
white-space: nowrap;
|
|
116
|
-
overflow: hidden;
|
|
117
|
-
}
|
|
118
|
-
.clippy-combobox__current-option:has(+ input:focus) {
|
|
119
|
-
display: none;
|
|
120
|
-
}
|
|
121
|
-
`;
|
|
122
|
-
var bt = Object.defineProperty, xt = Object.getOwnPropertyDescriptor, G = (t) => {
|
|
123
|
-
throw TypeError(t);
|
|
124
|
-
}, b = (t, o, r, e) => {
|
|
125
|
-
for (var i = e > 1 ? void 0 : e ? xt(o, r) : o, n = t.length - 1, d; n >= 0; n--)
|
|
126
|
-
(d = t[n]) && (i = (e ? d(o, r, i) : d(i)) || i);
|
|
127
|
-
return e && i && bt(o, r, i), i;
|
|
128
|
-
}, q = (t, o, r) => o.has(t) || G("Cannot " + r), l = (t, o, r) => (q(t, o, "read from private field"), r ? r.call(t) : o.get(t)), h = (t, o, r) => o.has(t) ? G("Cannot add the same private member more than once") : o instanceof WeakSet ? o.add(t) : o.set(t, r), vt = (t, o, r, e) => (q(t, o, "write to private field"), o.set(t, r), r), a = (t, o, r) => (q(t, o, "access private method"), r), c, p, v, S, C, f, w, N, E, M, P, x, y, D, H, z;
|
|
129
|
-
const R = "clippy-combobox";
|
|
130
|
-
let s = class extends J {
|
|
131
|
-
constructor() {
|
|
132
|
-
super(...arguments), h(this, c), this.allowOther = !1, this.open = !1, this.position = "block-end", h(this, v, /* @__PURE__ */ new Map()), this.selectedIndex = -1, this.query = "", this.filter = (t) => ({ label: o }) => o.toLowerCase().includes(t.toLowerCase()), h(this, S, st(async (t) => {
|
|
133
|
-
const o = await this.fetchAdditionalOptions(t);
|
|
134
|
-
for (const r of o)
|
|
135
|
-
l(this, v).set(r.label, r);
|
|
136
|
-
})), h(this, C, (t) => {
|
|
137
|
-
if (!(t.relatedTarget && this.shadowRoot?.contains(t.relatedTarget))) {
|
|
138
|
-
if (this.allowOther && this.query) {
|
|
139
|
-
const r = this.queryToValue(this.query);
|
|
140
|
-
r && this.value !== r && (this.value = r, l(this, f).call(this));
|
|
141
|
-
}
|
|
142
|
-
this.open = !1, this.emit("blur");
|
|
143
|
-
}
|
|
144
|
-
}), h(this, f, () => {
|
|
145
|
-
this.emit("change");
|
|
146
|
-
}), h(this, w, (t) => {
|
|
147
|
-
t.composedPath().some((r) => r instanceof Node && this.contains(r)) || (this.open = !1, this.emit("blur"));
|
|
148
|
-
}), h(this, N, () => {
|
|
149
|
-
this.open = !0, this.emit("focus");
|
|
150
|
-
}), h(this, E, (t) => {
|
|
151
|
-
const o = t.target;
|
|
152
|
-
o instanceof HTMLInputElement && (this.selectedIndex = -1, this.open = !0, this.query = o.value, this.emit("input"));
|
|
153
|
-
}), h(this, M, (t) => {
|
|
154
|
-
const o = t.currentTarget;
|
|
155
|
-
if (!(o instanceof HTMLElement)) return;
|
|
156
|
-
const r = Number(o.dataset.index);
|
|
157
|
-
Number.isNaN(r) || a(this, c, y).call(this, r);
|
|
158
|
-
}), h(this, P, ({ key: t }) => {
|
|
159
|
-
const o = this.selectedIndex, r = this.filteredOptions.length;
|
|
160
|
-
switch (t) {
|
|
161
|
-
case "ArrowDown":
|
|
162
|
-
return a(this, c, x).call(this, o + 1, !0);
|
|
163
|
-
case "ArrowUp":
|
|
164
|
-
return a(this, c, x).call(this, o - 1, !0);
|
|
165
|
-
case "Enter":
|
|
166
|
-
return o > -1 ? a(this, c, y).call(this, o) : r === 1 ? a(this, c, y).call(this, 0) : this.allowOther ? a(this, c, D).call(this) : void 0;
|
|
167
|
-
case "Escape":
|
|
168
|
-
return a(this, c, x).call(this, -1);
|
|
169
|
-
case "Home":
|
|
170
|
-
return a(this, c, x).call(this, 0);
|
|
171
|
-
case "End":
|
|
172
|
-
return a(this, c, x).call(this, r - 1);
|
|
173
|
-
default:
|
|
174
|
-
return;
|
|
175
|
-
}
|
|
176
|
-
});
|
|
177
|
-
}
|
|
178
|
-
get filteredOptions() {
|
|
179
|
-
if (this.query.length === 0)
|
|
180
|
-
return this.options;
|
|
181
|
-
const t = this.filter(this.query), o = this.options.filter(t);
|
|
182
|
-
return o.length === 0 && l(this, S).call(this, this.query), o;
|
|
183
|
-
}
|
|
184
|
-
set options(t) {
|
|
185
|
-
vt(this, v, new Map(
|
|
186
|
-
t.map(
|
|
187
|
-
(o) => typeof o == "string" ? [o, { label: o, value: o }] : [o.label, o]
|
|
188
|
-
)
|
|
189
|
-
));
|
|
190
|
-
}
|
|
191
|
-
get options() {
|
|
192
|
-
return [...l(this, v).values()];
|
|
193
|
-
}
|
|
194
|
-
set value(t) {
|
|
195
|
-
super.value = t, this.query = this.valueToQuery(t) || this.query;
|
|
196
|
-
}
|
|
197
|
-
get value() {
|
|
198
|
-
return super.value;
|
|
199
|
-
}
|
|
200
|
-
emit(t) {
|
|
201
|
-
this.dispatchEvent(new Event(t, { bubbles: !0, composed: !0 }));
|
|
202
|
-
}
|
|
203
|
-
/**
|
|
204
|
-
* Override this function to customize an external data source
|
|
205
|
-
*/
|
|
206
|
-
fetchAdditionalOptions(t) {
|
|
207
|
-
const o = [];
|
|
208
|
-
return Promise.resolve(o);
|
|
209
|
-
}
|
|
210
|
-
getOptionForValue(t) {
|
|
211
|
-
const o = typeof t == "object" && t !== null;
|
|
212
|
-
return this.options.find((r) => o && typeof r.value == "object" && r.value !== null ? JSON.stringify(r.value) === JSON.stringify(t) : r.value === t);
|
|
213
|
-
}
|
|
214
|
-
/**
|
|
215
|
-
* Override this function to customize how the user input is resolved to a value.
|
|
216
|
-
*/
|
|
217
|
-
queryToValue(t) {
|
|
218
|
-
if (this.allowOther)
|
|
219
|
-
return this.getOptionForValue(this.value)?.value || t;
|
|
220
|
-
const o = this.filter(t);
|
|
221
|
-
return this.options.find(o)?.value ?? null;
|
|
222
|
-
}
|
|
223
|
-
/**
|
|
224
|
-
* Override this function to customize how a value is converted to a query.
|
|
225
|
-
* This runs on setting the value.
|
|
226
|
-
*/
|
|
227
|
-
valueToQuery(t) {
|
|
228
|
-
return this.getOptionForValue(t)?.label;
|
|
229
|
-
}
|
|
230
|
-
/**
|
|
231
|
-
* Override this function to customize the rendering of combobox options and selected value.
|
|
232
|
-
*/
|
|
233
|
-
renderEntry({ label: t }, o) {
|
|
234
|
-
return _`${t}`;
|
|
235
|
-
}
|
|
236
|
-
connectedCallback() {
|
|
237
|
-
super.connectedCallback(), document.addEventListener("click", l(this, w));
|
|
238
|
-
}
|
|
239
|
-
disconnectedCallback() {
|
|
240
|
-
super.disconnectedCallback(), document.removeEventListener("click", l(this, w));
|
|
241
|
-
}
|
|
242
|
-
render() {
|
|
243
|
-
const t = {
|
|
244
|
-
[`utrecht-combobox__popover--${this.position}`]: this.position,
|
|
245
|
-
"utrecht-combobox__popover--hidden": !this.open
|
|
246
|
-
}, o = this.getOptionForValue(this.value);
|
|
247
|
-
return _`
|
|
248
|
-
<div class="utrecht-combobox">
|
|
249
|
-
<label for="${l(this, c, p)}" class="sr-only">${this.hiddenLabel}</label>
|
|
250
|
-
<div class="clippy-combobox__input-container">
|
|
251
|
-
${o ? _`<div
|
|
252
|
-
role="presentation"
|
|
253
|
-
class="clippy-combobox__current-option utrecht-textbox utrecht-combobox__input"
|
|
254
|
-
>
|
|
255
|
-
${this.renderEntry(o)}
|
|
256
|
-
</div>` : B}
|
|
257
|
-
<input
|
|
258
|
-
id=${l(this, c, p)}
|
|
259
|
-
name=${this.name}
|
|
260
|
-
autocomplete="off"
|
|
261
|
-
role="combobox"
|
|
262
|
-
aria-autocomplete="list"
|
|
263
|
-
aria-haspopup="listbox"
|
|
264
|
-
aria-controls=${l(this, c, H)}
|
|
265
|
-
aria-expanded=${this.open}
|
|
266
|
-
aria-activedescendant=${j(a(this, c, z).call(this))}
|
|
267
|
-
type="text"
|
|
268
|
-
class="utrecht-textbox utrecht-combobox__input"
|
|
269
|
-
dir="auto"
|
|
270
|
-
.value=${this.query}
|
|
271
|
-
@input=${l(this, E)}
|
|
272
|
-
@focus=${l(this, N)}
|
|
273
|
-
@blur=${l(this, C)}
|
|
274
|
-
@keydown=${l(this, P)}
|
|
275
|
-
/>
|
|
276
|
-
</div>
|
|
277
|
-
<div
|
|
278
|
-
id=${l(this, c, H)}
|
|
279
|
-
class="utrecht-listbox utrecht-combobox__popover ${V(t)}"
|
|
280
|
-
role="listbox"
|
|
281
|
-
tabindex="-1"
|
|
282
|
-
>
|
|
283
|
-
<ul class="utrecht-listbox__list" role="none">
|
|
284
|
-
${this.filteredOptions.map((r, e) => {
|
|
285
|
-
const i = e === this.selectedIndex;
|
|
286
|
-
return _`<li
|
|
287
|
-
class="clippy-combobox__option utrecht-listbox__option utrecht-listbox__option--html-li ${V(
|
|
288
|
-
{
|
|
289
|
-
"utrecht-listbox__option--selected": i
|
|
290
|
-
}
|
|
291
|
-
)}"
|
|
292
|
-
role="option"
|
|
293
|
-
id=${j(a(this, c, z).call(this, e))}
|
|
294
|
-
aria-selected=${i}
|
|
295
|
-
data-index=${e}
|
|
296
|
-
@click=${l(this, M)}
|
|
297
|
-
>
|
|
298
|
-
${this.renderEntry(r, e)}
|
|
299
|
-
</li>`;
|
|
300
|
-
})}
|
|
301
|
-
</ul>
|
|
302
|
-
</div>
|
|
303
|
-
</div>
|
|
304
|
-
`;
|
|
305
|
-
}
|
|
306
|
-
};
|
|
307
|
-
c = /* @__PURE__ */ new WeakSet();
|
|
308
|
-
p = function() {
|
|
309
|
-
return `${R}-${this.name}`;
|
|
310
|
-
};
|
|
311
|
-
v = /* @__PURE__ */ new WeakMap();
|
|
312
|
-
S = /* @__PURE__ */ new WeakMap();
|
|
313
|
-
C = /* @__PURE__ */ new WeakMap();
|
|
314
|
-
f = /* @__PURE__ */ new WeakMap();
|
|
315
|
-
w = /* @__PURE__ */ new WeakMap();
|
|
316
|
-
N = /* @__PURE__ */ new WeakMap();
|
|
317
|
-
E = /* @__PURE__ */ new WeakMap();
|
|
318
|
-
M = /* @__PURE__ */ new WeakMap();
|
|
319
|
-
P = /* @__PURE__ */ new WeakMap();
|
|
320
|
-
x = function(t, o = !1) {
|
|
321
|
-
this.open = o, this.selectedIndex = t > -1 ? t % this.filteredOptions.length : -1, this.selectedIndex > -1 && this.shadowRoot?.querySelector(`#${String(a(this, c, z).call(this))}`)?.scrollIntoView({
|
|
322
|
-
behavior: "smooth",
|
|
323
|
-
block: "nearest",
|
|
324
|
-
inline: "nearest"
|
|
325
|
-
});
|
|
326
|
-
};
|
|
327
|
-
y = function(t) {
|
|
328
|
-
const { label: o, value: r } = this.filteredOptions.at(t) ?? {};
|
|
329
|
-
t < 0 || !o || !r || (this.query = o.toString(), this.value !== r && (this.value = r, l(this, f).call(this)), this.open = !1);
|
|
330
|
-
};
|
|
331
|
-
D = function() {
|
|
332
|
-
const t = this.query;
|
|
333
|
-
this.value !== t && (this.value = t, l(this, f).call(this)), this.open = !1;
|
|
334
|
-
};
|
|
335
|
-
H = function() {
|
|
336
|
-
return `list-${l(this, c, p)}`;
|
|
337
|
-
};
|
|
338
|
-
z = function(t = this.selectedIndex) {
|
|
339
|
-
return t === -1 ? void 0 : `option-${t}-${l(this, c, p)}`;
|
|
340
|
-
};
|
|
341
|
-
s.styles = [
|
|
342
|
-
dt,
|
|
343
|
-
ht,
|
|
344
|
-
I(K),
|
|
345
|
-
I(U),
|
|
346
|
-
I(X)
|
|
347
|
-
];
|
|
348
|
-
b([
|
|
349
|
-
g({ attribute: "other", type: Boolean })
|
|
350
|
-
], s.prototype, "allowOther", 2);
|
|
351
|
-
b([
|
|
352
|
-
g({ reflect: !0, type: Boolean })
|
|
353
|
-
], s.prototype, "open", 2);
|
|
354
|
-
b([
|
|
355
|
-
g()
|
|
356
|
-
], s.prototype, "position", 2);
|
|
357
|
-
b([
|
|
358
|
-
F()
|
|
359
|
-
], s.prototype, "selectedIndex", 2);
|
|
360
|
-
b([
|
|
361
|
-
F()
|
|
362
|
-
], s.prototype, "query", 2);
|
|
363
|
-
b([
|
|
364
|
-
F()
|
|
365
|
-
], s.prototype, "filteredOptions", 1);
|
|
366
|
-
b([
|
|
367
|
-
g({ converter: Q })
|
|
368
|
-
], s.prototype, "options", 1);
|
|
369
|
-
b([
|
|
370
|
-
g()
|
|
371
|
-
], s.prototype, "value", 1);
|
|
372
|
-
s = b([
|
|
373
|
-
Y(R)
|
|
374
|
-
], s);
|
|
375
|
-
export {
|
|
376
|
-
s as C,
|
|
377
|
-
Q as a,
|
|
378
|
-
wt as b
|
|
379
|
-
};
|