@public-ui/hydrate 2.1.7-rc.1 → 2.1.7
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/index.js +931 -506
- package/dist/index.mjs +931 -506
- package/package.json +3 -3
package/dist/index.js
CHANGED
|
@@ -3838,6 +3838,10 @@ const validateAriaCurrentValue = (component, value) => {
|
|
|
3838
3838
|
});
|
|
3839
3839
|
};
|
|
3840
3840
|
|
|
3841
|
+
const validateAriaDescription = (component, value) => {
|
|
3842
|
+
watchString(component, '_ariaDescription', value);
|
|
3843
|
+
};
|
|
3844
|
+
|
|
3841
3845
|
const validateAriaExpanded = (component, value) => {
|
|
3842
3846
|
watchBoolean(component, '_ariaExpanded', value);
|
|
3843
3847
|
};
|
|
@@ -4210,6 +4214,10 @@ const validatePaginationPosition = (component, value) => {
|
|
|
4210
4214
|
});
|
|
4211
4215
|
};
|
|
4212
4216
|
|
|
4217
|
+
const validatePopoverCallbacks = (component, value) => {
|
|
4218
|
+
watchValidator(component, `_on`, (value) => typeof value === 'object' && value !== null, new Set(['PopoverCallbacksPropType {Events.onClose}']), value);
|
|
4219
|
+
};
|
|
4220
|
+
|
|
4213
4221
|
const validateReadOnly = (component, value) => {
|
|
4214
4222
|
watchBoolean(component, '_readOnly', value);
|
|
4215
4223
|
};
|
|
@@ -4374,11 +4382,11 @@ let KolHeadingWcTag = 'kol-heading-wc';
|
|
|
4374
4382
|
let KolIconTag = 'kol-icon';
|
|
4375
4383
|
let KolIndentedTextTag = 'kol-indented-text';
|
|
4376
4384
|
let KolIndentedTextWcTag = 'kol-indented-text-wc';
|
|
4377
|
-
let KolInputCheckboxTag = 'kol-input-checkbox';
|
|
4378
4385
|
let KolInputWcTag = 'kol-input';
|
|
4379
4386
|
let KolLinkTag = 'kol-link';
|
|
4380
4387
|
let KolLinkWcTag = 'kol-link-wc';
|
|
4381
4388
|
let KolPaginationTag = 'kol-pagination';
|
|
4389
|
+
let KolPopoverWcTag = 'kol-popover-wc';
|
|
4382
4390
|
let KolSelectTag = 'kol-select';
|
|
4383
4391
|
let KolSpanWcTag = 'kol-span-wc';
|
|
4384
4392
|
let KolTableStatefulTag = 'kol-table-stateful';
|
|
@@ -4389,8 +4397,8 @@ let KolTreeItemWcTag = 'kol-tree-item-wc';
|
|
|
4389
4397
|
let KolTreeTag = 'kol-tree';
|
|
4390
4398
|
let KolTreeWcTag = 'kol-tree-wc';
|
|
4391
4399
|
|
|
4392
|
-
const defaultStyleCss$
|
|
4393
|
-
var KolAbbrDefaultStyle0 = defaultStyleCss$
|
|
4400
|
+
const defaultStyleCss$P = "@layer kol-global {\n .sc-kol-abbr-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-abbr-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-abbr-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-abbr-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .sc-kol-abbr-default-h > abbr {\n cursor: help;\n }\n}";
|
|
4401
|
+
var KolAbbrDefaultStyle0 = defaultStyleCss$P;
|
|
4394
4402
|
|
|
4395
4403
|
class KolAbbr {
|
|
4396
4404
|
constructor(hostRef) {
|
|
@@ -4448,8 +4456,8 @@ const watchHeadingLevel = (component, value) => {
|
|
|
4448
4456
|
});
|
|
4449
4457
|
};
|
|
4450
4458
|
|
|
4451
|
-
const defaultStyleCss$
|
|
4452
|
-
var KolAccordionDefaultStyle0 = defaultStyleCss$
|
|
4459
|
+
const defaultStyleCss$O = "@layer kol-global {\n .sc-kol-accordion-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-accordion-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-accordion-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-accordion-default-h {\n display: block;\n }\n}\n@layer kol-component {\n .sc-kol-accordion-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n \n .wrapper {\n display: grid;\n grid-template-rows: 0fr;\n overflow: hidden;\n transition: grid-template-rows 0.3s;\n }\n .accordion.open .wrapper {\n grid-template-rows: 1fr;\n }\n .animation-wrapper {\n min-height: 0;\n transition: visibility 0.3s;\n \n visibility: hidden;\n }\n .accordion.open .animation-wrapper {\n visibility: visible;\n }\n @media (prefers-reduced-motion) {\n .animation-wrapper,\n .wrapper {\n transition-duration: 0s;\n }\n }\n \n @media print {\n .accordion:not(.open) .animation-wrapper {\n display: none;\n }\n }\n \n .accordion .kol-heading-wc .kol-button-wc button .kol-span-wc {\n justify-items: start;\n }\n}";
|
|
4460
|
+
var KolAccordionDefaultStyle0 = defaultStyleCss$O;
|
|
4453
4461
|
|
|
4454
4462
|
featureHint(`[KolAccordion] Anfrage nach einer KolAccordionGroup bei dem immer nur ein Accordion geöffnet ist.
|
|
4455
4463
|
|
|
@@ -4552,8 +4560,8 @@ class KolAccordion {
|
|
|
4552
4560
|
}; }
|
|
4553
4561
|
}
|
|
4554
4562
|
|
|
4555
|
-
const defaultStyleCss$
|
|
4556
|
-
var KolAlertDefaultStyle0 = defaultStyleCss$
|
|
4563
|
+
const defaultStyleCss$N = "@layer kol-global {\n .sc-kol-alert-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-alert-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-alert-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-alert-default-h {\n display: block;\n }\n}\n@layer kol-component {\n .sc-kol-alert-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n}\n@layer kol-component {\n .kol-alert-wc {\n display: grid;\n }\n .kol-alert-wc .heading {\n display: flex;\n place-items: center;\n }\n .kol-alert-wc .heading > div {\n flex-grow: 1;\n }\n .close {\n \n outline: transparent solid 1px;\n }\n}";
|
|
4564
|
+
var KolAlertDefaultStyle0 = defaultStyleCss$N;
|
|
4557
4565
|
|
|
4558
4566
|
class KolAlert {
|
|
4559
4567
|
constructor(hostRef) {
|
|
@@ -4635,13 +4643,15 @@ var locale_de = {
|
|
|
4635
4643
|
'table-visible-range': 'Einträge {{start}} bis {{end}} von {{total}}',
|
|
4636
4644
|
'table-selection-all': 'Alle auswählen',
|
|
4637
4645
|
'table-selection-none': 'Alle abwählen',
|
|
4638
|
-
'table-selection-
|
|
4646
|
+
'table-selection-indeterminate': 'Alle auswählen bei teilweiser Auswahl',
|
|
4639
4647
|
dropdown: 'Auswahlliste',
|
|
4640
4648
|
'nav-label-open': 'Untermenü zu {{label}} öffnen',
|
|
4641
4649
|
'nav-label-close': 'Untermenü zu {{label}} schließen',
|
|
4642
4650
|
'close-alert': 'Benachrichtigung {{label}} schließen',
|
|
4643
4651
|
'show-password': 'einblenden',
|
|
4644
4652
|
'hide-password': 'ausblenden',
|
|
4653
|
+
'no-results-message': 'Keine Ergebnisse gefunden.',
|
|
4654
|
+
'delete-selection': 'Auswahl entfernen',
|
|
4645
4655
|
};
|
|
4646
4656
|
|
|
4647
4657
|
var locale_en = {
|
|
@@ -4685,13 +4695,15 @@ var locale_en = {
|
|
|
4685
4695
|
'table-visible-range': 'Entries {{start}} to {{end}} of {{total}}',
|
|
4686
4696
|
'table-selection-all': 'Select all',
|
|
4687
4697
|
'table-selection-none': 'Deselect all',
|
|
4688
|
-
'table-selection-
|
|
4698
|
+
'table-selection-indeterminate': 'Select all with partial selection',
|
|
4689
4699
|
dropdown: 'Dropdown',
|
|
4690
4700
|
'nav-label-open': 'Submenu for {{label}} open',
|
|
4691
4701
|
'nav-label-close': 'Submenu for {{label}} close',
|
|
4692
|
-
'close-alert': '
|
|
4702
|
+
'close-alert': 'Close notification {{label}}',
|
|
4693
4703
|
'show-password': 'Show',
|
|
4694
4704
|
'hide-password': 'Hide',
|
|
4705
|
+
'no-results-message': 'No results found.',
|
|
4706
|
+
'delete-selection': 'Delete selection',
|
|
4695
4707
|
};
|
|
4696
4708
|
|
|
4697
4709
|
const mapLocaleKeys = (locale) => Object.keys(locale).reduce((a, c) => ((a[`${'kol'}-${c}`] = locale[c]), a), {});
|
|
@@ -4810,7 +4822,7 @@ class KolAlertWc {
|
|
|
4810
4822
|
};
|
|
4811
4823
|
}
|
|
4812
4824
|
render() {
|
|
4813
|
-
var _a;
|
|
4825
|
+
var _a, _b;
|
|
4814
4826
|
if (this.state._alert) {
|
|
4815
4827
|
try {
|
|
4816
4828
|
Log.debug(['Navigator should vibrate ...', navigator.vibrate([100, 75, 100, 75, 100])]);
|
|
@@ -4828,11 +4840,11 @@ class KolAlertWc {
|
|
|
4828
4840
|
[this.state._type]: true,
|
|
4829
4841
|
[this.state._variant]: true,
|
|
4830
4842
|
hasCloser: !!this.state._hasCloser,
|
|
4831
|
-
}, role: this.state._alert ? 'alert' : undefined }, hAsync("div", { key: 'b190de9f62c33d970daabc1b5638132da33c936e', class: "heading" }, hAsync(AlertIcon, { key: 'e1da8b194a13ec6f9270efc2234caadcee77e827', label: this.state._label, type: this.state._type }), hAsync("div", { key: '7ffd000cfbe218c582791e8646ff5caf9bad5b25', class: "heading-content" }, typeof this.state._label === 'string' && ((_a = this.state._label) === null || _a === void 0 ? void 0 : _a.length) > 0 && (hAsync(KolHeadingWcTag, { key: 'f9e7c598243a4868b80b248fdf4dfdeed5d24a2b', _label: this.state._label, _level: this.state._level })), this.state._variant === 'msg' && (hAsync("div", { key: 'b5b70319b6c7747872e9d8072a1fe7565938f7c1', class: "content" }, hAsync("slot", { key: 'b75edf24762d861147d5ee5fa0701b4c5a30eed1' })))), this.state._hasCloser && (hAsync(KolButtonWcTag, { key: '
|
|
4843
|
+
}, role: this.state._alert ? 'alert' : undefined }, hAsync("div", { key: 'b190de9f62c33d970daabc1b5638132da33c936e', class: "heading" }, hAsync(AlertIcon, { key: 'e1da8b194a13ec6f9270efc2234caadcee77e827', label: this.state._label, type: this.state._type }), hAsync("div", { key: '7ffd000cfbe218c582791e8646ff5caf9bad5b25', class: "heading-content" }, typeof this.state._label === 'string' && ((_a = this.state._label) === null || _a === void 0 ? void 0 : _a.length) > 0 && (hAsync(KolHeadingWcTag, { key: 'f9e7c598243a4868b80b248fdf4dfdeed5d24a2b', _label: this.state._label, _level: this.state._level })), this.state._variant === 'msg' && (hAsync("div", { key: 'b5b70319b6c7747872e9d8072a1fe7565938f7c1', class: "content" }, hAsync("slot", { key: 'b75edf24762d861147d5ee5fa0701b4c5a30eed1' })))), this.state._hasCloser && (hAsync(KolButtonWcTag, { key: '5db019ad83012c65f17398803bc50832120c0833', class: "close", _hideLabel: true, _icons: {
|
|
4832
4844
|
left: {
|
|
4833
4845
|
icon: 'codicon codicon-close',
|
|
4834
4846
|
},
|
|
4835
|
-
}, _label: translate('kol-close-alert', { placeholders: { label: this.state._label } }), _on: this.on, _tooltipAlign: "left" }))), this.state._variant === 'card' && (hAsync("div", { key: '
|
|
4847
|
+
}, _label: translate('kol-close-alert', { placeholders: { label: ((_b = this.state._label) === null || _b === void 0 ? void 0 : _b.trim()) || '' } }), _on: this.on, _tooltipAlign: "left" }))), this.state._variant === 'card' && (hAsync("div", { key: '42ff0049d5b293a851e92c34abe677f89323257c', class: "content" }, hAsync("slot", { key: '36339b30f064be51cbb389f29d62a3e12c9c3df1' })))));
|
|
4836
4848
|
}
|
|
4837
4849
|
validateAlert(value) {
|
|
4838
4850
|
watchBoolean(this, '_alert', value);
|
|
@@ -4896,8 +4908,8 @@ class KolAlertWc {
|
|
|
4896
4908
|
}; }
|
|
4897
4909
|
}
|
|
4898
4910
|
|
|
4899
|
-
const defaultStyleCss$
|
|
4900
|
-
var KolAvatarDefaultStyle0 = defaultStyleCss$
|
|
4911
|
+
const defaultStyleCss$M = "@layer kol-global {\n .sc-kol-avatar-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-avatar-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-avatar-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-avatar-default-h {\n display: block;\n }\n}\n@layer kol-component {\n .sc-kol-avatar-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .container {\n border-radius: 50%;\n overflow: hidden;\n \n outline: transparent solid 1px;\n \n width: 100px;\n height: 100px;\n }\n .image {\n width: 100%;\n height: 100%;\n }\n .initials {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n \n background: #d3d3d3;\n font-size: 40px;\n }\n}";
|
|
4912
|
+
var KolAvatarDefaultStyle0 = defaultStyleCss$M;
|
|
4901
4913
|
|
|
4902
4914
|
class KolAvatar {
|
|
4903
4915
|
constructor(hostRef) {
|
|
@@ -4983,8 +4995,8 @@ class KolAvatarWc {
|
|
|
4983
4995
|
}; }
|
|
4984
4996
|
}
|
|
4985
4997
|
|
|
4986
|
-
const defaultStyleCss$
|
|
4987
|
-
var KolBadgeDefaultStyle0 = defaultStyleCss$
|
|
4998
|
+
const defaultStyleCss$L = "@layer kol-global {\n .sc-kol-badge-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-badge-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-badge-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n \n .sc-kol-badge-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .sc-kol-badge-default-h > span {\n display: inline-flex;\n place-items: center;\n \n outline: transparent solid 1px;\n }\n .sc-kol-badge-default-h > span > .kol-button-wc button {\n color: inherit;\n }\n}";
|
|
4999
|
+
var KolBadgeDefaultStyle0 = defaultStyleCss$L;
|
|
4988
5000
|
|
|
4989
5001
|
featureHint(`[KolBadge] Optimierung des _color-Properties (rgba, rgb, hex usw.).`);
|
|
4990
5002
|
class KolBadge {
|
|
@@ -5084,8 +5096,8 @@ const watchNavLinks = (className, component, value) => {
|
|
|
5084
5096
|
uiUxHintMillerscheZahl(className, component.state._links.length);
|
|
5085
5097
|
};
|
|
5086
5098
|
|
|
5087
|
-
const defaultStyleCss$
|
|
5088
|
-
var KolBreadcrumbDefaultStyle0 = defaultStyleCss$
|
|
5099
|
+
const defaultStyleCss$K = "@layer kol-global {\n .sc-kol-breadcrumb-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-breadcrumb-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-breadcrumb-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-breadcrumb-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n li,\n ul {\n margin: 0;\n padding: 0;\n list-style: none;\n display: flex;\n gap: 0.5em;\n flex-wrap: wrap;\n place-items: center;\n }\n .kol-icon::part(separator) {\n font-weight: 900;\n font-size: 0.7em;\n }\n .kol-icon::part(separator):before {\n content: \"\\f054\";\n font-family: \"Font Awesome 6 Free\";\n }\n}";
|
|
5100
|
+
var KolBreadcrumbDefaultStyle0 = defaultStyleCss$K;
|
|
5089
5101
|
|
|
5090
5102
|
class KolBreadcrumb {
|
|
5091
5103
|
constructor(hostRef) {
|
|
@@ -5145,8 +5157,8 @@ class KolBreadcrumb {
|
|
|
5145
5157
|
}; }
|
|
5146
5158
|
}
|
|
5147
5159
|
|
|
5148
|
-
const defaultStyleCss$
|
|
5149
|
-
var KolButtonDefaultStyle0 = defaultStyleCss$
|
|
5160
|
+
const defaultStyleCss$J = "@charset \"UTF-8\";\n\n@layer kol-global {\n .sc-kol-button-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-button-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-button-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-button-default-h {\n font-style: calc(16rem / var(--kolibri-root-font-size, 16));\n display: inline-block;\n }\n :is(a, button) {\n display: inline-flex;\n place-items: center;\n text-align: center;\n text-decoration-line: none;\n }\n :is(a, button)::before {\n \n content: \"\";\n }\n \n :is(a, button) > .kol-span-wc {\n margin: auto;\n width: 100%;\n }\n}";
|
|
5161
|
+
var KolButtonDefaultStyle0 = defaultStyleCss$J;
|
|
5150
5162
|
|
|
5151
5163
|
class KolButton {
|
|
5152
5164
|
constructor(hostRef) {
|
|
@@ -5156,6 +5168,7 @@ class KolButton {
|
|
|
5156
5168
|
};
|
|
5157
5169
|
this._accessKey = undefined;
|
|
5158
5170
|
this._ariaControls = undefined;
|
|
5171
|
+
this._ariaDescription = undefined;
|
|
5159
5172
|
this._ariaExpanded = undefined;
|
|
5160
5173
|
this._ariaSelected = undefined;
|
|
5161
5174
|
this._customClass = undefined;
|
|
@@ -5185,11 +5198,11 @@ class KolButton {
|
|
|
5185
5198
|
await ((_a = this.buttonWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
|
|
5186
5199
|
}
|
|
5187
5200
|
render() {
|
|
5188
|
-
return (hAsync(Host, { key: '
|
|
5201
|
+
return (hAsync(Host, { key: '515bfb8d7870ebf2aca5f0c4d824e26d580c7d5d', class: "kol-button" }, hAsync(KolButtonWcTag, { key: 'd072d81aac487b8534b42ef47df1cfa016352290', ref: this.catchRef, class: {
|
|
5189
5202
|
button: true,
|
|
5190
5203
|
[this._variant]: this._variant !== 'custom',
|
|
5191
5204
|
[this._customClass]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,
|
|
5192
|
-
}, _accessKey: this._accessKey, _ariaControls: this._ariaControls, _ariaExpanded: this._ariaExpanded, _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _hideLabel: this._hideLabel, _icons: this._icons, _id: this._id, _label: this._label, _name: this._name, _on: this._on, _role: this._role, _syncValueBySelector: this._syncValueBySelector, _tabIndex: this._tabIndex, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _variant: this._variant }, hAsync("slot", { key: '
|
|
5205
|
+
}, _accessKey: this._accessKey, _ariaControls: this._ariaControls, _ariaDescription: this._ariaDescription, _ariaExpanded: this._ariaExpanded, _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _hideLabel: this._hideLabel, _icons: this._icons, _id: this._id, _label: this._label, _name: this._name, _on: this._on, _role: this._role, _syncValueBySelector: this._syncValueBySelector, _tabIndex: this._tabIndex, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _variant: this._variant }, hAsync("slot", { key: '412a7bc77ba0903f3d3db904e112c81c55ca4baa', name: "expert", slot: "expert" }))));
|
|
5193
5206
|
}
|
|
5194
5207
|
static get style() { return {
|
|
5195
5208
|
default: KolButtonDefaultStyle0
|
|
@@ -5200,6 +5213,7 @@ class KolButton {
|
|
|
5200
5213
|
"$members$": {
|
|
5201
5214
|
"_accessKey": [1, "_access-key"],
|
|
5202
5215
|
"_ariaControls": [1, "_aria-controls"],
|
|
5216
|
+
"_ariaDescription": [1, "_aria-description"],
|
|
5203
5217
|
"_ariaExpanded": [4, "_aria-expanded"],
|
|
5204
5218
|
"_ariaSelected": [4, "_aria-selected"],
|
|
5205
5219
|
"_customClass": [1, "_custom-class"],
|
|
@@ -5227,8 +5241,8 @@ class KolButton {
|
|
|
5227
5241
|
}; }
|
|
5228
5242
|
}
|
|
5229
5243
|
|
|
5230
|
-
const defaultStyleCss$
|
|
5231
|
-
var KolButtonGroupDefaultStyle0 = defaultStyleCss$
|
|
5244
|
+
const defaultStyleCss$I = "@layer kol-global {\n .sc-kol-button-group-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-button-group-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-button-group-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-button-group-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .sc-kol-button-group-default-h > .kol-button-group-wc {\n display: flex;\n flex-wrap: wrap;\n }\n}";
|
|
5245
|
+
var KolButtonGroupDefaultStyle0 = defaultStyleCss$I;
|
|
5232
5246
|
|
|
5233
5247
|
class KolButtonGroup {
|
|
5234
5248
|
constructor(hostRef) {
|
|
@@ -5270,8 +5284,8 @@ class KolButtonGroupWc {
|
|
|
5270
5284
|
}; }
|
|
5271
5285
|
}
|
|
5272
5286
|
|
|
5273
|
-
const defaultStyleCss$
|
|
5274
|
-
var KolButtonLinkDefaultStyle0 = defaultStyleCss$
|
|
5287
|
+
const defaultStyleCss$H = "@layer kol-global {\n .sc-kol-button-link-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-button-link-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-button-link-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-button-link-default-h {\n display: inline-block;\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n :is(a, button) {\n align-items: baseline;\n display: inline-flex;\n place-items: center;\n text-align: left;\n text-decoration-line: none;\n }\n :is(a, button) .kol-span-wc .span-label {\n text-decoration-line: underline;\n }\n a:is(:focus, :hover):not([aria-disabled]) .kol-span-wc .span-label,\n button:is(:focus, :hover):not([disabled]) .kol-span-wc .span-label {\n text-decoration-thickness: 0.2em;\n }\n .skip {\n left: -99999px;\n overflow: hidden;\n position: absolute;\n z-index: 9999999;\n line-height: 1em;\n }\n .skip:focus {\n background-color: #fff;\n left: unset;\n padding: 1em;\n position: unset;\n }\n .kol-icon.external-link-icon {\n display: inline-flex;\n }\n}";
|
|
5288
|
+
var KolButtonLinkDefaultStyle0 = defaultStyleCss$H;
|
|
5275
5289
|
|
|
5276
5290
|
class KolButtonLink {
|
|
5277
5291
|
constructor(hostRef) {
|
|
@@ -5281,6 +5295,7 @@ class KolButtonLink {
|
|
|
5281
5295
|
};
|
|
5282
5296
|
this._accessKey = undefined;
|
|
5283
5297
|
this._ariaControls = undefined;
|
|
5298
|
+
this._ariaDescription = undefined;
|
|
5284
5299
|
this._ariaExpanded = undefined;
|
|
5285
5300
|
this._ariaSelected = undefined;
|
|
5286
5301
|
this._disabled = false;
|
|
@@ -5308,7 +5323,7 @@ class KolButtonLink {
|
|
|
5308
5323
|
await ((_a = this.buttonWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
|
|
5309
5324
|
}
|
|
5310
5325
|
render() {
|
|
5311
|
-
return (hAsync(Host, { key: '
|
|
5326
|
+
return (hAsync(Host, { key: '3742a4fb39143d12413b25ea1e3bf1f392be2869', class: "kol-button-link" }, hAsync(KolButtonWcTag, { key: '95ff1c9b62b871a945c82d3ff421a11f1dbdf04e', ref: this.catchRef, _accessKey: this._accessKey, _ariaControls: this._ariaControls, _ariaDescription: this._ariaDescription, _ariaExpanded: this._ariaExpanded, _ariaSelected: this._ariaSelected, _disabled: this._disabled, _icons: this._icons, _hideLabel: this._hideLabel, _id: this._id, _label: this._label, _name: this._name, _on: this._on, _role: "link", _syncValueBySelector: this._syncValueBySelector, _tabIndex: this._tabIndex, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value }, hAsync("slot", { key: '1f37a941df1a123f98e5a18199d5d77581344982', name: "expert", slot: "expert" }))));
|
|
5312
5327
|
}
|
|
5313
5328
|
static get style() { return {
|
|
5314
5329
|
default: KolButtonLinkDefaultStyle0
|
|
@@ -5319,6 +5334,7 @@ class KolButtonLink {
|
|
|
5319
5334
|
"$members$": {
|
|
5320
5335
|
"_accessKey": [1, "_access-key"],
|
|
5321
5336
|
"_ariaControls": [1, "_aria-controls"],
|
|
5337
|
+
"_ariaDescription": [1, "_aria-description"],
|
|
5322
5338
|
"_ariaExpanded": [4, "_aria-expanded"],
|
|
5323
5339
|
"_ariaSelected": [4, "_aria-selected"],
|
|
5324
5340
|
"_disabled": [4],
|
|
@@ -5453,6 +5469,7 @@ const isAssociatedTagName = (name) => name === 'KOL-BUTTON' ||
|
|
|
5453
5469
|
name === 'KOL-INPUT-RANGE' ||
|
|
5454
5470
|
name === 'KOL-INPUT-TEXT' ||
|
|
5455
5471
|
name === 'KOL-SELECT' ||
|
|
5472
|
+
name === 'KOL-SINGLE-SELECT' ||
|
|
5456
5473
|
name === 'KOL-TEXTAREA';
|
|
5457
5474
|
class AssociatedInputController {
|
|
5458
5475
|
constructor(component, type, host) {
|
|
@@ -5471,7 +5488,7 @@ class AssociatedInputController {
|
|
|
5471
5488
|
this.component = component;
|
|
5472
5489
|
this.host = this.findHostWithShadowRoot(host);
|
|
5473
5490
|
this.type = type;
|
|
5474
|
-
if (this.experimentalMode && isAssociatedTagName((_a = this.host) === null || _a === void 0 ? void 0 : _a.tagName)) {
|
|
5491
|
+
if (this.experimentalMode && isAssociatedTagName((_a = this.host) === null || _a === void 0 ? void 0 : _a.tagName) && component._name) {
|
|
5475
5492
|
(_b = this.host) === null || _b === void 0 ? void 0 : _b.querySelectorAll('input,select,textarea').forEach((el) => {
|
|
5476
5493
|
var _a;
|
|
5477
5494
|
(_a = this.host) === null || _a === void 0 ? void 0 : _a.removeChild(el);
|
|
@@ -5498,6 +5515,7 @@ class AssociatedInputController {
|
|
|
5498
5515
|
this.formAssociated = document.createElement('textarea');
|
|
5499
5516
|
break;
|
|
5500
5517
|
case 'checkbox':
|
|
5518
|
+
case 'single-select':
|
|
5501
5519
|
case 'combobox':
|
|
5502
5520
|
default:
|
|
5503
5521
|
this.formAssociated = document.createElement('input');
|
|
@@ -5616,17 +5634,20 @@ class KolButtonWc {
|
|
|
5616
5634
|
(_a = this.buttonRef) === null || _a === void 0 ? void 0 : _a.focus();
|
|
5617
5635
|
}
|
|
5618
5636
|
render() {
|
|
5637
|
+
var _a, _b;
|
|
5619
5638
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
5620
|
-
|
|
5639
|
+
const hasAriaDescription = Boolean((_b = (_a = this.state._ariaDescription) === null || _a === void 0 ? void 0 : _a.trim()) === null || _b === void 0 ? void 0 : _b.length);
|
|
5640
|
+
return (hAsync(Host, { key: '5516bef539eb9262e669fe92f72dc243d8920bd0', class: "kol-button-wc" }, hAsync("button", Object.assign({ key: '1d3eb3a7720f306a3c186feedfd365bf5331c86c', ref: this.catchRef, accessKey: this.state._accessKey || undefined, "aria-controls": this.state._ariaControls, "aria-describedby": hasAriaDescription ? this.internalDescriptionById : undefined, "aria-expanded": mapBoolean2String(this.state._ariaExpanded), "aria-label": this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, "aria-selected": mapStringOrBoolean2String(this.state._ariaSelected), class: {
|
|
5621
5641
|
button: true,
|
|
5622
5642
|
disabled: this.state._disabled === true,
|
|
5623
5643
|
[this.state._variant]: this.state._variant !== 'custom',
|
|
5624
5644
|
[this.state._customClass]: this.state._variant === 'custom' && typeof this.state._customClass === 'string' && this.state._customClass.length > 0,
|
|
5625
5645
|
'hide-label': this.state._hideLabel === true,
|
|
5626
|
-
}, disabled: this.state._disabled, id: this.state._id, name: this.state._name }, this.state._on, { onClick: this.onClick, role: this.state._role, tabIndex: this.state._tabIndex, type: this.state._type }), hAsync(KolSpanWcTag, { key: '
|
|
5646
|
+
}, disabled: this.state._disabled, id: this.state._id, name: this.state._name }, this.state._on, { onClick: this.onClick, role: this.state._role, tabIndex: this.state._tabIndex, type: this.state._type }), hAsync(KolSpanWcTag, { key: '3ba922687287ba66ce958e13b98802e62f333079', class: "button-inner", _accessKey: this.state._accessKey, _icons: this.state._icons, _hideLabel: this.state._hideLabel, _label: hasExpertSlot ? '' : this.state._label }, hAsync("slot", { key: '9ee6d1239e3012f306e0b3ae8fc984db25225507', name: "expert", slot: "expert" }))), hAsync(KolTooltipWcTag, { key: '8ece133d5b3f4f3832e60e26b804c58244c8b364', "aria-hidden": "true", hidden: hasExpertSlot || !this.state._hideLabel, _accessKey: this._accessKey, _align: this.state._tooltipAlign, _label: typeof this.state._label === 'string' ? this.state._label : '' }), hasAriaDescription && (hAsync("span", { key: 'f2a460b10f336b17add6fd3663c0f4ceef91ddb5', class: "visually-hidden", id: this.internalDescriptionById }, this.state._ariaDescription))));
|
|
5627
5647
|
}
|
|
5628
5648
|
constructor(hostRef) {
|
|
5629
5649
|
registerInstance(this, hostRef);
|
|
5650
|
+
this.internalDescriptionById = nonce();
|
|
5630
5651
|
this.catchRef = (ref) => {
|
|
5631
5652
|
this.buttonRef = ref;
|
|
5632
5653
|
};
|
|
@@ -5656,6 +5677,7 @@ class KolButtonWc {
|
|
|
5656
5677
|
};
|
|
5657
5678
|
this._accessKey = undefined;
|
|
5658
5679
|
this._ariaControls = undefined;
|
|
5680
|
+
this._ariaDescription = undefined;
|
|
5659
5681
|
this._ariaExpanded = undefined;
|
|
5660
5682
|
this._ariaSelected = undefined;
|
|
5661
5683
|
this._customClass = undefined;
|
|
@@ -5688,6 +5710,9 @@ class KolButtonWc {
|
|
|
5688
5710
|
validateAriaControls(value) {
|
|
5689
5711
|
validateAriaControls(this, value);
|
|
5690
5712
|
}
|
|
5713
|
+
validateAriaDescription(value) {
|
|
5714
|
+
validateAriaDescription(this, value);
|
|
5715
|
+
}
|
|
5691
5716
|
validateAriaExpanded(value) {
|
|
5692
5717
|
validateAriaExpanded(this, value);
|
|
5693
5718
|
}
|
|
@@ -5745,6 +5770,7 @@ class KolButtonWc {
|
|
|
5745
5770
|
componentWillLoad() {
|
|
5746
5771
|
this.validateAccessKey(this._accessKey);
|
|
5747
5772
|
this.validateAriaControls(this._ariaControls);
|
|
5773
|
+
this.validateAriaDescription(this._ariaDescription);
|
|
5748
5774
|
this.validateAriaExpanded(this._ariaExpanded);
|
|
5749
5775
|
this.validateAriaSelected(this._ariaSelected);
|
|
5750
5776
|
this.validateCustomClass(this._customClass);
|
|
@@ -5767,6 +5793,7 @@ class KolButtonWc {
|
|
|
5767
5793
|
static get watchers() { return {
|
|
5768
5794
|
"_accessKey": ["validateAccessKey"],
|
|
5769
5795
|
"_ariaControls": ["validateAriaControls"],
|
|
5796
|
+
"_ariaDescription": ["validateAriaDescription"],
|
|
5770
5797
|
"_ariaExpanded": ["validateAriaExpanded"],
|
|
5771
5798
|
"_ariaSelected": ["validateAriaSelected"],
|
|
5772
5799
|
"_customClass": ["validateCustomClass"],
|
|
@@ -5791,6 +5818,7 @@ class KolButtonWc {
|
|
|
5791
5818
|
"$members$": {
|
|
5792
5819
|
"_accessKey": [1, "_access-key"],
|
|
5793
5820
|
"_ariaControls": [1, "_aria-controls"],
|
|
5821
|
+
"_ariaDescription": [1, "_aria-description"],
|
|
5794
5822
|
"_ariaExpanded": [4, "_aria-expanded"],
|
|
5795
5823
|
"_ariaSelected": [4, "_aria-selected"],
|
|
5796
5824
|
"_customClass": [1, "_custom-class"],
|
|
@@ -5817,8 +5845,8 @@ class KolButtonWc {
|
|
|
5817
5845
|
}; }
|
|
5818
5846
|
}
|
|
5819
5847
|
|
|
5820
|
-
const defaultStyleCss$
|
|
5821
|
-
var KolCardDefaultStyle0 = defaultStyleCss$
|
|
5848
|
+
const defaultStyleCss$G = "@layer kol-global {\n .sc-kol-card-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-card-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-card-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-card-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .sc-kol-card-default-h > div.card {\n height: 100%;\n position: relative;\n \n outline: transparent solid 1px;\n }\n .close {\n position: absolute;\n top: 0;\n right: 0;\n }\n}";
|
|
5849
|
+
var KolCardDefaultStyle0 = defaultStyleCss$G;
|
|
5822
5850
|
|
|
5823
5851
|
class KolCard {
|
|
5824
5852
|
constructor(hostRef) {
|
|
@@ -5842,7 +5870,7 @@ class KolCard {
|
|
|
5842
5870
|
};
|
|
5843
5871
|
}
|
|
5844
5872
|
render() {
|
|
5845
|
-
return (hAsync(Host, { key: '
|
|
5873
|
+
return (hAsync(Host, { key: 'd709f6f5929c6f14ec756692979b28b54f68a3d8', class: "kol-card" }, hAsync("div", { key: '4124876ff829f50bcaa6ba42ede3bc6510bec733', class: "card" }, hAsync("div", { key: '1fb33811e88ea804e0547d4d4f2ecc0f57cb0bec', class: "header" }, hAsync(KolHeadingWcTag, { key: '9b3123c1e1017af55116f42c05b618a2b76279ef', _label: this.state._label, _level: this.state._level })), hAsync("div", { key: '06e5801a62c8630820cac20f8c314c9bb23879ca', class: "content" }, hAsync("slot", { key: '7facf55ee995d0d008d1cdaa3a0fd0d0a83acbd7' })), this.state._hasCloser && (hAsync(KolButtonWcTag, { key: '48ef49d7d188f505c294b85ab41060a175e5cbd4', class: "close", _hideLabel: true, _icons: {
|
|
5846
5874
|
left: {
|
|
5847
5875
|
icon: 'codicon codicon-close',
|
|
5848
5876
|
},
|
|
@@ -5976,14 +6004,7 @@ class InputController extends ControlledInputController {
|
|
|
5976
6004
|
watchString(this.component, '_hint', value);
|
|
5977
6005
|
}
|
|
5978
6006
|
validateId(value) {
|
|
5979
|
-
watchString(this.component, '_id', value, {
|
|
5980
|
-
hooks: {
|
|
5981
|
-
afterPatch: () => {
|
|
5982
|
-
this.setAttribute('id', this.formAssociated, this.component.state._id);
|
|
5983
|
-
},
|
|
5984
|
-
},
|
|
5985
|
-
minLength: 1,
|
|
5986
|
-
});
|
|
6007
|
+
watchString(this.component, '_id', value, { minLength: 1 });
|
|
5987
6008
|
if (value === '' || typeof value === 'undefined') {
|
|
5988
6009
|
devHint(`A unique ID on the input fields is not strictly required, but it might be relevant for E2E tests.`);
|
|
5989
6010
|
}
|
|
@@ -6189,8 +6210,8 @@ const getRenderStates = (state) => {
|
|
|
6189
6210
|
|
|
6190
6211
|
function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f);}else for(f in e)e[f]&&(n&&(n+=" "),n+=f);return n}function clsx(){for(var e,t,f=0,n="",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}
|
|
6191
6212
|
|
|
6192
|
-
const defaultStyleCss$
|
|
6193
|
-
var KolComboboxDefaultStyle0 = defaultStyleCss$
|
|
6213
|
+
const defaultStyleCss$F = "@layer kol-global {\n .sc-kol-combobox-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-combobox-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-combobox-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .required label > span::after,\n .required legend > span::after {\n content: \"*\";\n }\n}\n@layer kol-component {\n .sc-kol-combobox-default-h {\n display: block;\n }\n}\n@layer kol-component {\n input,\n textarea {\n cursor: text;\n }\n input[type=checkbox],\n input[type=color],\n input[type=file],\n input[type=radio],\n input[type=range],\n label,\n option,\n select {\n cursor: pointer;\n }\n \n \n \n input[type=color],\n input[type=date],\n input[type=datetime-local],\n input[type=email],\n input[type=file],\n input[type=month],\n input[type=number],\n input[type=password],\n input[type=search],\n input[type=tel],\n input[type=text],\n input[type=time],\n input[type=url],\n input[type=week],\n select,\n select[multiple] option,\n textarea {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n width: 100%;\n }\n \n input[type=file] {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n }\n \n select[multiple] option {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n }\n}\n@layer kol-component {\n .kol-input {\n display: grid;\n }\n .kol-input .input-slot {\n flex-grow: 1;\n }\n input:not([type=checkbox], [type=radio]),\n select:not([multiple], [size]) {\n height: 2.75em;\n }\n input:focus,\n option:focus,\n select:focus,\n textarea:focus {\n outline: 0;\n }\n .input {\n display: flex;\n align-items: center;\n }\n .input > .kol-icon {\n display: grid;\n height: var(--a11y-min-size);\n place-items: center;\n }\n .kol-input.required .input-tooltip .span-label::after {\n content: \"*\";\n }\n}\n@layer kol-component {\n .sc-kol-combobox-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .combobox {\n position: relative;\n }\n .combobox--disabled, .combobox--disabled * {\n cursor: not-allowed !important;\n }\n .combobox--disabled {\n opacity: 0.5;\n outline: none;\n }\n .combobox__group {\n display: inline-flex;\n align-items: center;\n cursor: pointer;\n }\n .combobox__input {\n flex-grow: 1;\n }\n .combobox__icon {\n align-items: center;\n cursor: pointer;\n display: flex;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .combobox__listbox {\n display: block;\n position: absolute;\n list-style-type: none;\n margin: 0;\n padding: 0;\n overflow-y: auto;\n overflow-x: hidden;\n z-index: 2;\n background-color: white;\n max-height: calc(250rem / var(--kolibri-root-font-size, 16));\n }\n .combobox__item {\n cursor: pointer;\n }\n .combobox__listbox--cursor-hidden .combobox__item {\n cursor: none !important;\n }\n}";
|
|
6214
|
+
var KolComboboxDefaultStyle0 = defaultStyleCss$F;
|
|
6194
6215
|
|
|
6195
6216
|
class KolCombobox {
|
|
6196
6217
|
async getValue() {
|
|
@@ -6226,10 +6247,12 @@ class KolCombobox {
|
|
|
6226
6247
|
this._filteredSuggestions = [...this._suggestions];
|
|
6227
6248
|
}
|
|
6228
6249
|
else {
|
|
6229
|
-
this._filteredSuggestions = this._suggestions
|
|
6230
|
-
|
|
6231
|
-
|
|
6232
|
-
|
|
6250
|
+
this._filteredSuggestions = Array.isArray(this._suggestions)
|
|
6251
|
+
? this._suggestions.filter((option) => {
|
|
6252
|
+
return option.toLowerCase().includes(query.toLowerCase());
|
|
6253
|
+
})
|
|
6254
|
+
: this._filteredSuggestions;
|
|
6255
|
+
this._isOpen = this._filteredSuggestions && this._filteredSuggestions.length > 0 ? true : false;
|
|
6233
6256
|
}
|
|
6234
6257
|
}
|
|
6235
6258
|
moveFocus(delta) {
|
|
@@ -6264,7 +6287,7 @@ class KolCombobox {
|
|
|
6264
6287
|
render() {
|
|
6265
6288
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
6266
6289
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
6267
|
-
return (hAsync(Host, { key: '
|
|
6290
|
+
return (hAsync(Host, { key: '520b90a5b17719f0acd633ca8a9a3b313b8fef41', class: "kol-combobox" }, hAsync("div", { key: '7e5a3ec03dcd6769a16d181cd1b26beb26af2a9a', class: clsx('combobox', this.state._disabled && 'combobox--disabled') }, hAsync(KolInputWcTag, { key: '5501454ee81df1d0811d0835409126506a334983', _accessKey: this.state._accessKey, _disabled: this.state._disabled, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _msg: this.state._msg, _required: this.state._required, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: 'e9dd3f2cf17eaf4e5d295f0bd9fc37aa9085b8b9', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedAccessKey, { accessKey: this.state._accessKey, label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, this.state._accessKey))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: 'afba7d4ff0b569da313797721270311242e34734', slot: "input" }, hAsync("div", { key: 'f5f1db833f8695b125a834b884b4673121a0dc1e', class: "combobox__group" }, hAsync("input", Object.assign({ key: 'caa86d47cf25063b487b62d78fdc2e7010da5e0a', ref: this.catchRef, class: "combobox__input", type: "text", role: "combobox", "aria-autocomplete": "both", "aria-expanded": this._isOpen ? 'true' : 'false', "aria-controls": "listbox", value: this.state._value, accessKey: this.state._accessKey, "aria-describedby": ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, "aria-label": this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, "aria-labelledby": this.state._id, "aria-activedescendant": this._isOpen && this._focusedOptionIndex >= 0 ? `option-${this._focusedOptionIndex}` : undefined, autoCapitalize: "off", autoCorrect: "off", disabled: this.state._disabled, id: this.state._id, name: this.state._name, required: this.state._required, spellcheck: "false" }, this.controller.onFacade, { onInput: this.onInput.bind(this), onChange: this.onChange.bind(this), placeholder: this.state._placeholder })), hAsync("button", { key: '0cd5a3bcf6b5ad52e86795465dadbaeee2604c80', tabindex: "-1", class: "combobox__icon", onClick: this.toggleListbox.bind(this), disabled: this.state._disabled }, hAsync(KolIconTag, { key: '2ad19cc55158c2016008fd362d86eae5772d4e18', _icons: "codicon codicon-triangle-down", _label: translate('kol-dropdown') }))), this._isOpen && !(this.state._disabled === true) && (hAsync("ul", { key: 'd9e2426f5780921c805644d56c51e4d9e554ec3d', role: "listbox", class: clsx('combobox__listbox', this.blockSuggestionMouseOver && 'combobox__listbox--cursor-hidden'), onKeyDown: this.handleKeyDownDropdown.bind(this) }, Array.isArray(this._filteredSuggestions) &&
|
|
6268
6291
|
this._filteredSuggestions.length > 0 &&
|
|
6269
6292
|
this._filteredSuggestions.map((option, index) => (hAsync("li", { id: `option-${index}`, key: `-${index}`, ref: (el) => {
|
|
6270
6293
|
if (el)
|
|
@@ -6559,7 +6582,7 @@ class KolCombobox {
|
|
|
6559
6582
|
"_msg": [16],
|
|
6560
6583
|
"_name": [1],
|
|
6561
6584
|
"_on": [16],
|
|
6562
|
-
"_suggestions": [
|
|
6585
|
+
"_suggestions": [1],
|
|
6563
6586
|
"_required": [4],
|
|
6564
6587
|
"_syncValueBySelector": [1, "_sync-value-by-selector"],
|
|
6565
6588
|
"_tabIndex": [2, "_tab-index"],
|
|
@@ -6645,8 +6668,8 @@ class DetailsAnimationController {
|
|
|
6645
6668
|
}
|
|
6646
6669
|
}
|
|
6647
6670
|
|
|
6648
|
-
const defaultStyleCss$
|
|
6649
|
-
var KolDetailsDefaultStyle0 = defaultStyleCss$
|
|
6671
|
+
const defaultStyleCss$E = "@layer kol-global {\n .sc-kol-details-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-details-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-details-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-details-default-h {\n display: block;\n }\n}\n@layer kol-component {\n .sc-kol-details-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n details {\n display: grid;\n }\n details > summary {\n cursor: pointer;\n display: flex;\n place-items: center;\n }\n details > summary > span {\n border-bottom-color: grey;\n border-bottom-style: solid;\n }\n details > summary:focus > span,\n details > summary:hover > span,\n details[open] > summary > span {\n border-bottom-color: #000;\n }\n .content {\n overflow: hidden;\n }\n details > .kol-indented-text {\n margin: 0.25em 0 0 0.5em;\n }\n .icon.is-open::part(icon) {\n transform: rotate(90deg);\n }\n}";
|
|
6672
|
+
var KolDetailsDefaultStyle0 = defaultStyleCss$E;
|
|
6650
6673
|
|
|
6651
6674
|
class KolDetails {
|
|
6652
6675
|
constructor(hostRef) {
|
|
@@ -6693,10 +6716,10 @@ class KolDetails {
|
|
|
6693
6716
|
(_a = this.summaryElement) === null || _a === void 0 ? void 0 : _a.focus();
|
|
6694
6717
|
}
|
|
6695
6718
|
render() {
|
|
6696
|
-
return (hAsync(Host, { key: '
|
|
6719
|
+
return (hAsync(Host, { key: '2acc7482e04c1586f0eaa18394d4f0b6319d5eca', class: "kol-details" }, hAsync("details", { key: 'f81c39a0976ff683933b79267b3cc8ab5f9c79e1', ref: this.catchDetails, class: {
|
|
6697
6720
|
disabled: this.state._disabled === true,
|
|
6698
6721
|
open: this.state._open === true,
|
|
6699
|
-
}, onToggle: this.handleToggle }, hAsync("summary", { key: '
|
|
6722
|
+
}, onToggle: this.handleToggle }, hAsync("summary", { key: '644b159a65e37f184b1d76fb0a5ad5a39a734c47', ref: this.catchSummary, "aria-disabled": this.state._disabled ? 'true' : undefined, onClick: this.preventToggleIfDisabled, onKeyPress: this.preventToggleIfDisabled, tabIndex: this.state._disabled ? -1 : undefined }, hAsync(KolIconTag, { key: '31854deab53e40ed9df847a798489166f1d6a3e3', _label: "", _icons: "codicon codicon-chevron-right", class: `icon ${this.state._open ? 'is-open' : ''}` }), hAsync("span", { key: '55828be257eca8d29fa7d9729d48e703fd1a08b8' }, this.state._label)), hAsync("div", { key: '6c5a9d68b6d58e045018010f35758c253a77240a', "aria-hidden": this.state._open === false ? 'true' : undefined, class: "content", ref: (element) => (this.contentElement = element) }, hAsync(KolIndentedTextTag, { key: 'a7da0cad9ac40c30f0264c75f987a6dfc7968d40' }, hAsync("slot", { key: 'cf3f792a9988a7ee869b79a2d9b3537f6fa7722c' }))))));
|
|
6700
6723
|
}
|
|
6701
6724
|
validateDisabled(value) {
|
|
6702
6725
|
validateDisabled(this, value);
|
|
@@ -6756,8 +6779,8 @@ class KolDetails {
|
|
|
6756
6779
|
}; }
|
|
6757
6780
|
}
|
|
6758
6781
|
|
|
6759
|
-
const defaultStyleCss$
|
|
6760
|
-
var KolDrawerDefaultStyle0 = defaultStyleCss$
|
|
6782
|
+
const defaultStyleCss$D = "@layer kol-global {\n .sc-kol-drawer-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-drawer-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-drawer-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-drawer-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .drawer__dialog {\n padding: 0;\n border: none;\n }\n .drawer__wrapper {\n position: fixed;\n width: auto;\n overflow: auto;\n background: white;\n }\n .drawer__wrapper--left {\n top: 0;\n left: 0;\n height: 100vh;\n max-height: 100%;\n }\n .drawer__wrapper--right {\n top: 0;\n right: 0;\n height: 100vh;\n max-height: 100%;\n }\n .drawer__wrapper--top {\n left: 0;\n top: 0;\n width: 100vw;\n max-width: 100%;\n }\n .drawer__wrapper--bottom {\n left: 0;\n bottom: 0;\n width: 100vw;\n max-width: 100%;\n }\n .drawer__content {\n position: relative;\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n}";
|
|
6783
|
+
var KolDrawerDefaultStyle0 = defaultStyleCss$D;
|
|
6761
6784
|
|
|
6762
6785
|
class KolDrawer {
|
|
6763
6786
|
constructor(hostRef) {
|
|
@@ -6801,7 +6824,7 @@ class KolDrawer {
|
|
|
6801
6824
|
}
|
|
6802
6825
|
render() {
|
|
6803
6826
|
const isModal = this.state._modal;
|
|
6804
|
-
return (hAsync(Host, { key: '
|
|
6827
|
+
return (hAsync(Host, { key: 'c4eb14d5c56ecd8448f144944c2e102fadd6d97f', class: `kol-drawer drawer ${isModal ? 'drawer--modal' : ''}`, ref: (el) => (this.hostElement = el) }, hAsync("dialog", { key: '16d62e5e7689543ddbb7be000e8dd283879357bc', class: "drawer__dialog", ref: this.getRef }, this.renderDialogContent())));
|
|
6805
6828
|
}
|
|
6806
6829
|
validateLabel(value) {
|
|
6807
6830
|
validateLabel(this, value, {
|
|
@@ -6888,8 +6911,8 @@ class KolDrawer {
|
|
|
6888
6911
|
}; }
|
|
6889
6912
|
}
|
|
6890
6913
|
|
|
6891
|
-
const defaultStyleCss$
|
|
6892
|
-
var KolFormDefaultStyle0 = defaultStyleCss$
|
|
6914
|
+
const defaultStyleCss$C = "@layer kol-global {\n .sc-kol-form-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-form-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-form-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .required label > span::after,\n .required legend > span::after {\n content: \"*\";\n }\n}\n@layer kol-component {\n .sc-kol-form-default-h {\n display: block;\n }\n}\n@layer kol-component {\n input,\n textarea {\n cursor: text;\n }\n input[type=checkbox],\n input[type=color],\n input[type=file],\n input[type=radio],\n input[type=range],\n label,\n option,\n select {\n cursor: pointer;\n }\n \n \n \n input[type=color],\n input[type=date],\n input[type=datetime-local],\n input[type=email],\n input[type=file],\n input[type=month],\n input[type=number],\n input[type=password],\n input[type=search],\n input[type=tel],\n input[type=text],\n input[type=time],\n input[type=url],\n input[type=week],\n select,\n select[multiple] option,\n textarea {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n width: 100%;\n }\n \n input[type=file] {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n }\n \n select[multiple] option {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n }\n}\n@layer kol-component {\n .kol-input {\n display: grid;\n }\n .kol-input .input-slot {\n flex-grow: 1;\n }\n input:not([type=checkbox], [type=radio]),\n select:not([multiple], [size]) {\n height: 2.75em;\n }\n input:focus,\n option:focus,\n select:focus,\n textarea:focus {\n outline: 0;\n }\n .input {\n display: flex;\n align-items: center;\n }\n .input > .kol-icon {\n display: grid;\n height: var(--a11y-min-size);\n place-items: center;\n }\n .kol-input.required .input-tooltip .span-label::after {\n content: \"*\";\n }\n}\n\n@layer kol-global {\n .sc-kol-form-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-form-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-form-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-form-default-h {\n display: block;\n }\n}\n@layer kol-component {\n .kol-alert-wc {\n display: grid;\n }\n .kol-alert-wc .heading {\n display: flex;\n place-items: center;\n }\n .kol-alert-wc .heading > div {\n flex-grow: 1;\n }\n .close {\n \n outline: transparent solid 1px;\n }\n}\n@layer kol-component {\n .sc-kol-form-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n}";
|
|
6915
|
+
var KolFormDefaultStyle0 = defaultStyleCss$C;
|
|
6893
6916
|
|
|
6894
6917
|
class KolForm {
|
|
6895
6918
|
constructor(hostRef) {
|
|
@@ -6928,10 +6951,10 @@ class KolForm {
|
|
|
6928
6951
|
this.state = {};
|
|
6929
6952
|
}
|
|
6930
6953
|
render() {
|
|
6931
|
-
return (hAsync(Host, { key: '
|
|
6954
|
+
return (hAsync(Host, { key: '14641ff8ec7ae1a8cd644657d3d430ce16ad807a', class: "kol-form" }, this._errorList && this._errorList.length > 0 && (hAsync(KolAlertWcTag, { key: '7d835a8feb70e1f46364936db5af85c1cbd27d37', _type: "error" }, translate('kol-error-list-message'), hAsync("nav", { key: '4c021cc452697bd96cbc403026a24d7e5055babe', "aria-label": translate('kol-error-list') }, hAsync("ul", { key: 'f17c2e0bccc8c7b32c10d3b07d242f73661be066' }, this._errorList.map((error, index) => (hAsync("li", { key: index }, hAsync(KolLinkTag, { _href: error.selector, _label: error.message, _on: { onClick: this.handleLinkClick }, ref: (el) => {
|
|
6932
6955
|
if (index === 0)
|
|
6933
6956
|
this.errorListElement = el;
|
|
6934
|
-
} })))))))), hAsync("form", { key: '
|
|
6957
|
+
} })))))))), hAsync("form", { key: '663fa6f4e400b6f459ff9bcdc62f3f306c31ba4d', method: "post", onSubmit: this.onSubmit, onReset: this.onReset, autoComplete: "off", noValidate: true }, this.state._requiredText === true ? (hAsync("p", null, hAsync(KolIndentedTextWcTag, null, translate('kol-form-description')))) : typeof this.state._requiredText === 'string' && this.state._requiredText.length > 0 ? (hAsync("p", null, hAsync(KolIndentedTextWcTag, null, this.state._requiredText))) : null, hAsync("slot", { key: 'fc64235dc566b7b3dcdbca92ffbcd552750cca54' }))));
|
|
6935
6958
|
}
|
|
6936
6959
|
async focusErrorList() {
|
|
6937
6960
|
setTimeout(() => {
|
|
@@ -6987,8 +7010,8 @@ class KolForm {
|
|
|
6987
7010
|
}; }
|
|
6988
7011
|
}
|
|
6989
7012
|
|
|
6990
|
-
const defaultStyleCss$
|
|
6991
|
-
var KolHeadingDefaultStyle0 = defaultStyleCss$
|
|
7013
|
+
const defaultStyleCss$B = "@layer kol-global {\n .sc-kol-heading-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-heading-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-heading-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-heading-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n}";
|
|
7014
|
+
var KolHeadingDefaultStyle0 = defaultStyleCss$B;
|
|
6992
7015
|
|
|
6993
7016
|
class KolHeading {
|
|
6994
7017
|
constructor(hostRef) {
|
|
@@ -6999,7 +7022,7 @@ class KolHeading {
|
|
|
6999
7022
|
this._variant = undefined;
|
|
7000
7023
|
}
|
|
7001
7024
|
render() {
|
|
7002
|
-
return (hAsync(KolHeadingWcTag, { key: '
|
|
7025
|
+
return (hAsync(KolHeadingWcTag, { key: '5691c465675446f40af4186cd1a41e093396c1d2', _label: this._label, _level: this._level, _secondaryHeadline: this._secondaryHeadline, _variant: this._variant, class: "kol-heading" }, hAsync("slot", { key: '9b311b28a45a2a85bf9d78f7d80e69940feb6c2e', name: "expert", slot: "expert" })));
|
|
7003
7026
|
}
|
|
7004
7027
|
static get style() { return {
|
|
7005
7028
|
default: KolHeadingDefaultStyle0
|
|
@@ -7077,7 +7100,7 @@ class KolHeadingWc {
|
|
|
7077
7100
|
this.validateVariant(this._variant);
|
|
7078
7101
|
}
|
|
7079
7102
|
render() {
|
|
7080
|
-
return (hAsync(Host, { key: '
|
|
7103
|
+
return (hAsync(Host, { key: 'd838d4cf0b9e07a0ce01757de31f7c054c46307e', class: "kol-heading-wc" }, typeof this.state._secondaryHeadline === 'string' && this.state._secondaryHeadline.length > 0 ? (hAsync("hgroup", null, this.renderHeadline(this.state._label, this.state._level), this.state._secondaryHeadline && this.renderSecondaryHeadline(this.state._secondaryHeadline, this.state._level + 1))) : (this.renderHeadline(this.state._label, this.state._level))));
|
|
7081
7104
|
}
|
|
7082
7105
|
static get watchers() { return {
|
|
7083
7106
|
"_label": ["validateLabel"],
|
|
@@ -7101,8 +7124,8 @@ class KolHeadingWc {
|
|
|
7101
7124
|
}; }
|
|
7102
7125
|
}
|
|
7103
7126
|
|
|
7104
|
-
const defaultStyleCss$z = "@font-face {\n font-family: \"codicon\";\n font-display: block;\n src: url(\"./codicon.ttf?0e5b0adf625a37fbcd638d31f0fe72aa\") format(\"truetype\");\n}\n/*!@.codicon[class*=codicon-]*/.codicon[class*=codicon-].sc-kol-icon-default {\n font: normal normal normal 16px/1 codicon;\n display: inline-block;\n text-decoration: none;\n text-rendering: auto;\n text-align: center;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n user-select: none;\n -webkit-user-select: none;\n -ms-user-select: none;\n}\n\n\n@keyframes codicon-spin {\n 100% {\n transform: rotate(360deg);\n }\n}\n/*!@.codicon-sync.codicon-modifier-spin,\n.codicon-loading.codicon-modifier-spin,\n.codicon-gear.codicon-modifier-spin*/.codicon-sync.codicon-modifier-spin.sc-kol-icon-default, .codicon-loading.codicon-modifier-spin.sc-kol-icon-default, .codicon-gear.codicon-modifier-spin.sc-kol-icon-default {\n \n animation: codicon-spin 1.5s steps(30) infinite;\n}\n\n/*!@.codicon-modifier-disabled*/.codicon-modifier-disabled.sc-kol-icon-default {\n opacity: 0.5;\n}\n\n/*!@.codicon-modifier-hidden*/.codicon-modifier-hidden.sc-kol-icon-default {\n opacity: 0;\n}\n\n\n/*!@.codicon-loading*/.codicon-loading.sc-kol-icon-default {\n animation-duration: 1s !important;\n animation-timing-function: cubic-bezier(0.53, 0.21, 0.29, 0.67) !important;\n}\n\n\n/*!@.codicon-add:before*/.codicon-add.sc-kol-icon-default:before {\n content: \"\\ea60\";\n}\n\n/*!@.codicon-plus:before*/.codicon-plus.sc-kol-icon-default:before {\n content: \"\\ea60\";\n}\n\n/*!@.codicon-gist-new:before*/.codicon-gist-new.sc-kol-icon-default:before {\n content: \"\\ea60\";\n}\n\n/*!@.codicon-repo-create:before*/.codicon-repo-create.sc-kol-icon-default:before {\n content: \"\\ea60\";\n}\n\n/*!@.codicon-lightbulb:before*/.codicon-lightbulb.sc-kol-icon-default:before {\n content: \"\\ea61\";\n}\n\n/*!@.codicon-light-bulb:before*/.codicon-light-bulb.sc-kol-icon-default:before {\n content: \"\\ea61\";\n}\n\n/*!@.codicon-repo:before*/.codicon-repo.sc-kol-icon-default:before {\n content: \"\\ea62\";\n}\n\n/*!@.codicon-repo-delete:before*/.codicon-repo-delete.sc-kol-icon-default:before {\n content: \"\\ea62\";\n}\n\n/*!@.codicon-gist-fork:before*/.codicon-gist-fork.sc-kol-icon-default:before {\n content: \"\\ea63\";\n}\n\n/*!@.codicon-repo-forked:before*/.codicon-repo-forked.sc-kol-icon-default:before {\n content: \"\\ea63\";\n}\n\n/*!@.codicon-git-pull-request:before*/.codicon-git-pull-request.sc-kol-icon-default:before {\n content: \"\\ea64\";\n}\n\n/*!@.codicon-git-pull-request-abandoned:before*/.codicon-git-pull-request-abandoned.sc-kol-icon-default:before {\n content: \"\\ea64\";\n}\n\n/*!@.codicon-record-keys:before*/.codicon-record-keys.sc-kol-icon-default:before {\n content: \"\\ea65\";\n}\n\n/*!@.codicon-keyboard:before*/.codicon-keyboard.sc-kol-icon-default:before {\n content: \"\\ea65\";\n}\n\n/*!@.codicon-tag:before*/.codicon-tag.sc-kol-icon-default:before {\n content: \"\\ea66\";\n}\n\n/*!@.codicon-tag-add:before*/.codicon-tag-add.sc-kol-icon-default:before {\n content: \"\\ea66\";\n}\n\n/*!@.codicon-tag-remove:before*/.codicon-tag-remove.sc-kol-icon-default:before {\n content: \"\\ea66\";\n}\n\n/*!@.codicon-person:before*/.codicon-person.sc-kol-icon-default:before {\n content: \"\\ea67\";\n}\n\n/*!@.codicon-person-follow:before*/.codicon-person-follow.sc-kol-icon-default:before {\n content: \"\\ea67\";\n}\n\n/*!@.codicon-person-outline:before*/.codicon-person-outline.sc-kol-icon-default:before {\n content: \"\\ea67\";\n}\n\n/*!@.codicon-person-filled:before*/.codicon-person-filled.sc-kol-icon-default:before {\n content: \"\\ea67\";\n}\n\n/*!@.codicon-git-branch:before*/.codicon-git-branch.sc-kol-icon-default:before {\n content: \"\\ea68\";\n}\n\n/*!@.codicon-git-branch-create:before*/.codicon-git-branch-create.sc-kol-icon-default:before {\n content: \"\\ea68\";\n}\n\n/*!@.codicon-git-branch-delete:before*/.codicon-git-branch-delete.sc-kol-icon-default:before {\n content: \"\\ea68\";\n}\n\n/*!@.codicon-source-control:before*/.codicon-source-control.sc-kol-icon-default:before {\n content: \"\\ea68\";\n}\n\n/*!@.codicon-mirror:before*/.codicon-mirror.sc-kol-icon-default:before {\n content: \"\\ea69\";\n}\n\n/*!@.codicon-mirror-public:before*/.codicon-mirror-public.sc-kol-icon-default:before {\n content: \"\\ea69\";\n}\n\n/*!@.codicon-star:before*/.codicon-star.sc-kol-icon-default:before {\n content: \"\\ea6a\";\n}\n\n/*!@.codicon-star-add:before*/.codicon-star-add.sc-kol-icon-default:before {\n content: \"\\ea6a\";\n}\n\n/*!@.codicon-star-delete:before*/.codicon-star-delete.sc-kol-icon-default:before {\n content: \"\\ea6a\";\n}\n\n/*!@.codicon-star-empty:before*/.codicon-star-empty.sc-kol-icon-default:before {\n content: \"\\ea6a\";\n}\n\n/*!@.codicon-comment:before*/.codicon-comment.sc-kol-icon-default:before {\n content: \"\\ea6b\";\n}\n\n/*!@.codicon-comment-add:before*/.codicon-comment-add.sc-kol-icon-default:before {\n content: \"\\ea6b\";\n}\n\n/*!@.codicon-alert:before*/.codicon-alert.sc-kol-icon-default:before {\n content: \"\\ea6c\";\n}\n\n/*!@.codicon-warning:before*/.codicon-warning.sc-kol-icon-default:before {\n content: \"\\ea6c\";\n}\n\n/*!@.codicon-search:before*/.codicon-search.sc-kol-icon-default:before {\n content: \"\\ea6d\";\n}\n\n/*!@.codicon-search-save:before*/.codicon-search-save.sc-kol-icon-default:before {\n content: \"\\ea6d\";\n}\n\n/*!@.codicon-log-out:before*/.codicon-log-out.sc-kol-icon-default:before {\n content: \"\\ea6e\";\n}\n\n/*!@.codicon-sign-out:before*/.codicon-sign-out.sc-kol-icon-default:before {\n content: \"\\ea6e\";\n}\n\n/*!@.codicon-log-in:before*/.codicon-log-in.sc-kol-icon-default:before {\n content: \"\\ea6f\";\n}\n\n/*!@.codicon-sign-in:before*/.codicon-sign-in.sc-kol-icon-default:before {\n content: \"\\ea6f\";\n}\n\n/*!@.codicon-eye:before*/.codicon-eye.sc-kol-icon-default:before {\n content: \"\\ea70\";\n}\n\n/*!@.codicon-eye-unwatch:before*/.codicon-eye-unwatch.sc-kol-icon-default:before {\n content: \"\\ea70\";\n}\n\n/*!@.codicon-eye-watch:before*/.codicon-eye-watch.sc-kol-icon-default:before {\n content: \"\\ea70\";\n}\n\n/*!@.codicon-circle-filled:before*/.codicon-circle-filled.sc-kol-icon-default:before {\n content: \"\\ea71\";\n}\n\n/*!@.codicon-primitive-dot:before*/.codicon-primitive-dot.sc-kol-icon-default:before {\n content: \"\\ea71\";\n}\n\n/*!@.codicon-close-dirty:before*/.codicon-close-dirty.sc-kol-icon-default:before {\n content: \"\\ea71\";\n}\n\n/*!@.codicon-debug-breakpoint:before*/.codicon-debug-breakpoint.sc-kol-icon-default:before {\n content: \"\\ea71\";\n}\n\n/*!@.codicon-debug-breakpoint-disabled:before*/.codicon-debug-breakpoint-disabled.sc-kol-icon-default:before {\n content: \"\\ea71\";\n}\n\n/*!@.codicon-debug-hint:before*/.codicon-debug-hint.sc-kol-icon-default:before {\n content: \"\\ea71\";\n}\n\n/*!@.codicon-primitive-square:before*/.codicon-primitive-square.sc-kol-icon-default:before {\n content: \"\\ea72\";\n}\n\n/*!@.codicon-edit:before*/.codicon-edit.sc-kol-icon-default:before {\n content: \"\\ea73\";\n}\n\n/*!@.codicon-pencil:before*/.codicon-pencil.sc-kol-icon-default:before {\n content: \"\\ea73\";\n}\n\n/*!@.codicon-info:before*/.codicon-info.sc-kol-icon-default:before {\n content: \"\\ea74\";\n}\n\n/*!@.codicon-issue-opened:before*/.codicon-issue-opened.sc-kol-icon-default:before {\n content: \"\\ea74\";\n}\n\n/*!@.codicon-gist-private:before*/.codicon-gist-private.sc-kol-icon-default:before {\n content: \"\\ea75\";\n}\n\n/*!@.codicon-git-fork-private:before*/.codicon-git-fork-private.sc-kol-icon-default:before {\n content: \"\\ea75\";\n}\n\n/*!@.codicon-lock:before*/.codicon-lock.sc-kol-icon-default:before {\n content: \"\\ea75\";\n}\n\n/*!@.codicon-mirror-private:before*/.codicon-mirror-private.sc-kol-icon-default:before {\n content: \"\\ea75\";\n}\n\n/*!@.codicon-close:before*/.codicon-close.sc-kol-icon-default:before {\n content: \"\\ea76\";\n}\n\n/*!@.codicon-remove-close:before*/.codicon-remove-close.sc-kol-icon-default:before {\n content: \"\\ea76\";\n}\n\n/*!@.codicon-x:before*/.codicon-x.sc-kol-icon-default:before {\n content: \"\\ea76\";\n}\n\n/*!@.codicon-repo-sync:before*/.codicon-repo-sync.sc-kol-icon-default:before {\n content: \"\\ea77\";\n}\n\n/*!@.codicon-sync:before*/.codicon-sync.sc-kol-icon-default:before {\n content: \"\\ea77\";\n}\n\n/*!@.codicon-clone:before*/.codicon-clone.sc-kol-icon-default:before {\n content: \"\\ea78\";\n}\n\n/*!@.codicon-desktop-download:before*/.codicon-desktop-download.sc-kol-icon-default:before {\n content: \"\\ea78\";\n}\n\n/*!@.codicon-beaker:before*/.codicon-beaker.sc-kol-icon-default:before {\n content: \"\\ea79\";\n}\n\n/*!@.codicon-microscope:before*/.codicon-microscope.sc-kol-icon-default:before {\n content: \"\\ea79\";\n}\n\n/*!@.codicon-vm:before*/.codicon-vm.sc-kol-icon-default:before {\n content: \"\\ea7a\";\n}\n\n/*!@.codicon-device-desktop:before*/.codicon-device-desktop.sc-kol-icon-default:before {\n content: \"\\ea7a\";\n}\n\n/*!@.codicon-file:before*/.codicon-file.sc-kol-icon-default:before {\n content: \"\\ea7b\";\n}\n\n/*!@.codicon-file-text:before*/.codicon-file-text.sc-kol-icon-default:before {\n content: \"\\ea7b\";\n}\n\n/*!@.codicon-more:before*/.codicon-more.sc-kol-icon-default:before {\n content: \"\\ea7c\";\n}\n\n/*!@.codicon-ellipsis:before*/.codicon-ellipsis.sc-kol-icon-default:before {\n content: \"\\ea7c\";\n}\n\n/*!@.codicon-kebab-horizontal:before*/.codicon-kebab-horizontal.sc-kol-icon-default:before {\n content: \"\\ea7c\";\n}\n\n/*!@.codicon-mail-reply:before*/.codicon-mail-reply.sc-kol-icon-default:before {\n content: \"\\ea7d\";\n}\n\n/*!@.codicon-reply:before*/.codicon-reply.sc-kol-icon-default:before {\n content: \"\\ea7d\";\n}\n\n/*!@.codicon-organization:before*/.codicon-organization.sc-kol-icon-default:before {\n content: \"\\ea7e\";\n}\n\n/*!@.codicon-organization-filled:before*/.codicon-organization-filled.sc-kol-icon-default:before {\n content: \"\\ea7e\";\n}\n\n/*!@.codicon-organization-outline:before*/.codicon-organization-outline.sc-kol-icon-default:before {\n content: \"\\ea7e\";\n}\n\n/*!@.codicon-new-file:before*/.codicon-new-file.sc-kol-icon-default:before {\n content: \"\\ea7f\";\n}\n\n/*!@.codicon-file-add:before*/.codicon-file-add.sc-kol-icon-default:before {\n content: \"\\ea7f\";\n}\n\n/*!@.codicon-new-folder:before*/.codicon-new-folder.sc-kol-icon-default:before {\n content: \"\\ea80\";\n}\n\n/*!@.codicon-file-directory-create:before*/.codicon-file-directory-create.sc-kol-icon-default:before {\n content: \"\\ea80\";\n}\n\n/*!@.codicon-trash:before*/.codicon-trash.sc-kol-icon-default:before {\n content: \"\\ea81\";\n}\n\n/*!@.codicon-trashcan:before*/.codicon-trashcan.sc-kol-icon-default:before {\n content: \"\\ea81\";\n}\n\n/*!@.codicon-history:before*/.codicon-history.sc-kol-icon-default:before {\n content: \"\\ea82\";\n}\n\n/*!@.codicon-clock:before*/.codicon-clock.sc-kol-icon-default:before {\n content: \"\\ea82\";\n}\n\n/*!@.codicon-folder:before*/.codicon-folder.sc-kol-icon-default:before {\n content: \"\\ea83\";\n}\n\n/*!@.codicon-file-directory:before*/.codicon-file-directory.sc-kol-icon-default:before {\n content: \"\\ea83\";\n}\n\n/*!@.codicon-symbol-folder:before*/.codicon-symbol-folder.sc-kol-icon-default:before {\n content: \"\\ea83\";\n}\n\n/*!@.codicon-logo-github:before*/.codicon-logo-github.sc-kol-icon-default:before {\n content: \"\\ea84\";\n}\n\n/*!@.codicon-mark-github:before*/.codicon-mark-github.sc-kol-icon-default:before {\n content: \"\\ea84\";\n}\n\n/*!@.codicon-github:before*/.codicon-github.sc-kol-icon-default:before {\n content: \"\\ea84\";\n}\n\n/*!@.codicon-terminal:before*/.codicon-terminal.sc-kol-icon-default:before {\n content: \"\\ea85\";\n}\n\n/*!@.codicon-console:before*/.codicon-console.sc-kol-icon-default:before {\n content: \"\\ea85\";\n}\n\n/*!@.codicon-repl:before*/.codicon-repl.sc-kol-icon-default:before {\n content: \"\\ea85\";\n}\n\n/*!@.codicon-zap:before*/.codicon-zap.sc-kol-icon-default:before {\n content: \"\\ea86\";\n}\n\n/*!@.codicon-symbol-event:before*/.codicon-symbol-event.sc-kol-icon-default:before {\n content: \"\\ea86\";\n}\n\n/*!@.codicon-error:before*/.codicon-error.sc-kol-icon-default:before {\n content: \"\\ea87\";\n}\n\n/*!@.codicon-stop:before*/.codicon-stop.sc-kol-icon-default:before {\n content: \"\\ea87\";\n}\n\n/*!@.codicon-variable:before*/.codicon-variable.sc-kol-icon-default:before {\n content: \"\\ea88\";\n}\n\n/*!@.codicon-symbol-variable:before*/.codicon-symbol-variable.sc-kol-icon-default:before {\n content: \"\\ea88\";\n}\n\n/*!@.codicon-array:before*/.codicon-array.sc-kol-icon-default:before {\n content: \"\\ea8a\";\n}\n\n/*!@.codicon-symbol-array:before*/.codicon-symbol-array.sc-kol-icon-default:before {\n content: \"\\ea8a\";\n}\n\n/*!@.codicon-symbol-module:before*/.codicon-symbol-module.sc-kol-icon-default:before {\n content: \"\\ea8b\";\n}\n\n/*!@.codicon-symbol-package:before*/.codicon-symbol-package.sc-kol-icon-default:before {\n content: \"\\ea8b\";\n}\n\n/*!@.codicon-symbol-namespace:before*/.codicon-symbol-namespace.sc-kol-icon-default:before {\n content: \"\\ea8b\";\n}\n\n/*!@.codicon-symbol-object:before*/.codicon-symbol-object.sc-kol-icon-default:before {\n content: \"\\ea8b\";\n}\n\n/*!@.codicon-symbol-method:before*/.codicon-symbol-method.sc-kol-icon-default:before {\n content: \"\\ea8c\";\n}\n\n/*!@.codicon-symbol-function:before*/.codicon-symbol-function.sc-kol-icon-default:before {\n content: \"\\ea8c\";\n}\n\n/*!@.codicon-symbol-constructor:before*/.codicon-symbol-constructor.sc-kol-icon-default:before {\n content: \"\\ea8c\";\n}\n\n/*!@.codicon-symbol-boolean:before*/.codicon-symbol-boolean.sc-kol-icon-default:before {\n content: \"\\ea8f\";\n}\n\n/*!@.codicon-symbol-null:before*/.codicon-symbol-null.sc-kol-icon-default:before {\n content: \"\\ea8f\";\n}\n\n/*!@.codicon-symbol-numeric:before*/.codicon-symbol-numeric.sc-kol-icon-default:before {\n content: \"\\ea90\";\n}\n\n/*!@.codicon-symbol-number:before*/.codicon-symbol-number.sc-kol-icon-default:before {\n content: \"\\ea90\";\n}\n\n/*!@.codicon-symbol-structure:before*/.codicon-symbol-structure.sc-kol-icon-default:before {\n content: \"\\ea91\";\n}\n\n/*!@.codicon-symbol-struct:before*/.codicon-symbol-struct.sc-kol-icon-default:before {\n content: \"\\ea91\";\n}\n\n/*!@.codicon-symbol-parameter:before*/.codicon-symbol-parameter.sc-kol-icon-default:before {\n content: \"\\ea92\";\n}\n\n/*!@.codicon-symbol-type-parameter:before*/.codicon-symbol-type-parameter.sc-kol-icon-default:before {\n content: \"\\ea92\";\n}\n\n/*!@.codicon-symbol-key:before*/.codicon-symbol-key.sc-kol-icon-default:before {\n content: \"\\ea93\";\n}\n\n/*!@.codicon-symbol-text:before*/.codicon-symbol-text.sc-kol-icon-default:before {\n content: \"\\ea93\";\n}\n\n/*!@.codicon-symbol-reference:before*/.codicon-symbol-reference.sc-kol-icon-default:before {\n content: \"\\ea94\";\n}\n\n/*!@.codicon-go-to-file:before*/.codicon-go-to-file.sc-kol-icon-default:before {\n content: \"\\ea94\";\n}\n\n/*!@.codicon-symbol-enum:before*/.codicon-symbol-enum.sc-kol-icon-default:before {\n content: \"\\ea95\";\n}\n\n/*!@.codicon-symbol-value:before*/.codicon-symbol-value.sc-kol-icon-default:before {\n content: \"\\ea95\";\n}\n\n/*!@.codicon-symbol-ruler:before*/.codicon-symbol-ruler.sc-kol-icon-default:before {\n content: \"\\ea96\";\n}\n\n/*!@.codicon-symbol-unit:before*/.codicon-symbol-unit.sc-kol-icon-default:before {\n content: \"\\ea96\";\n}\n\n/*!@.codicon-activate-breakpoints:before*/.codicon-activate-breakpoints.sc-kol-icon-default:before {\n content: \"\\ea97\";\n}\n\n/*!@.codicon-archive:before*/.codicon-archive.sc-kol-icon-default:before {\n content: \"\\ea98\";\n}\n\n/*!@.codicon-arrow-both:before*/.codicon-arrow-both.sc-kol-icon-default:before {\n content: \"\\ea99\";\n}\n\n/*!@.codicon-arrow-down:before*/.codicon-arrow-down.sc-kol-icon-default:before {\n content: \"\\ea9a\";\n}\n\n/*!@.codicon-arrow-left:before*/.codicon-arrow-left.sc-kol-icon-default:before {\n content: \"\\ea9b\";\n}\n\n/*!@.codicon-arrow-right:before*/.codicon-arrow-right.sc-kol-icon-default:before {\n content: \"\\ea9c\";\n}\n\n/*!@.codicon-arrow-small-down:before*/.codicon-arrow-small-down.sc-kol-icon-default:before {\n content: \"\\ea9d\";\n}\n\n/*!@.codicon-arrow-small-left:before*/.codicon-arrow-small-left.sc-kol-icon-default:before {\n content: \"\\ea9e\";\n}\n\n/*!@.codicon-arrow-small-right:before*/.codicon-arrow-small-right.sc-kol-icon-default:before {\n content: \"\\ea9f\";\n}\n\n/*!@.codicon-arrow-small-up:before*/.codicon-arrow-small-up.sc-kol-icon-default:before {\n content: \"\\eaa0\";\n}\n\n/*!@.codicon-arrow-up:before*/.codicon-arrow-up.sc-kol-icon-default:before {\n content: \"\\eaa1\";\n}\n\n/*!@.codicon-bell:before*/.codicon-bell.sc-kol-icon-default:before {\n content: \"\\eaa2\";\n}\n\n/*!@.codicon-bold:before*/.codicon-bold.sc-kol-icon-default:before {\n content: \"\\eaa3\";\n}\n\n/*!@.codicon-book:before*/.codicon-book.sc-kol-icon-default:before {\n content: \"\\eaa4\";\n}\n\n/*!@.codicon-bookmark:before*/.codicon-bookmark.sc-kol-icon-default:before {\n content: \"\\eaa5\";\n}\n\n/*!@.codicon-debug-breakpoint-conditional-unverified:before*/.codicon-debug-breakpoint-conditional-unverified.sc-kol-icon-default:before {\n content: \"\\eaa6\";\n}\n\n/*!@.codicon-debug-breakpoint-conditional:before*/.codicon-debug-breakpoint-conditional.sc-kol-icon-default:before {\n content: \"\\eaa7\";\n}\n\n/*!@.codicon-debug-breakpoint-conditional-disabled:before*/.codicon-debug-breakpoint-conditional-disabled.sc-kol-icon-default:before {\n content: \"\\eaa7\";\n}\n\n/*!@.codicon-debug-breakpoint-data-unverified:before*/.codicon-debug-breakpoint-data-unverified.sc-kol-icon-default:before {\n content: \"\\eaa8\";\n}\n\n/*!@.codicon-debug-breakpoint-data:before*/.codicon-debug-breakpoint-data.sc-kol-icon-default:before {\n content: \"\\eaa9\";\n}\n\n/*!@.codicon-debug-breakpoint-data-disabled:before*/.codicon-debug-breakpoint-data-disabled.sc-kol-icon-default:before {\n content: \"\\eaa9\";\n}\n\n/*!@.codicon-debug-breakpoint-log-unverified:before*/.codicon-debug-breakpoint-log-unverified.sc-kol-icon-default:before {\n content: \"\\eaaa\";\n}\n\n/*!@.codicon-debug-breakpoint-log:before*/.codicon-debug-breakpoint-log.sc-kol-icon-default:before {\n content: \"\\eaab\";\n}\n\n/*!@.codicon-debug-breakpoint-log-disabled:before*/.codicon-debug-breakpoint-log-disabled.sc-kol-icon-default:before {\n content: \"\\eaab\";\n}\n\n/*!@.codicon-briefcase:before*/.codicon-briefcase.sc-kol-icon-default:before {\n content: \"\\eaac\";\n}\n\n/*!@.codicon-broadcast:before*/.codicon-broadcast.sc-kol-icon-default:before {\n content: \"\\eaad\";\n}\n\n/*!@.codicon-browser:before*/.codicon-browser.sc-kol-icon-default:before {\n content: \"\\eaae\";\n}\n\n/*!@.codicon-bug:before*/.codicon-bug.sc-kol-icon-default:before {\n content: \"\\eaaf\";\n}\n\n/*!@.codicon-calendar:before*/.codicon-calendar.sc-kol-icon-default:before {\n content: \"\\eab0\";\n}\n\n/*!@.codicon-case-sensitive:before*/.codicon-case-sensitive.sc-kol-icon-default:before {\n content: \"\\eab1\";\n}\n\n/*!@.codicon-check:before*/.codicon-check.sc-kol-icon-default:before {\n content: \"\\eab2\";\n}\n\n/*!@.codicon-checklist:before*/.codicon-checklist.sc-kol-icon-default:before {\n content: \"\\eab3\";\n}\n\n/*!@.codicon-chevron-down:before*/.codicon-chevron-down.sc-kol-icon-default:before {\n content: \"\\eab4\";\n}\n\n/*!@.codicon-chevron-left:before*/.codicon-chevron-left.sc-kol-icon-default:before {\n content: \"\\eab5\";\n}\n\n/*!@.codicon-chevron-right:before*/.codicon-chevron-right.sc-kol-icon-default:before {\n content: \"\\eab6\";\n}\n\n/*!@.codicon-chevron-up:before*/.codicon-chevron-up.sc-kol-icon-default:before {\n content: \"\\eab7\";\n}\n\n/*!@.codicon-chrome-close:before*/.codicon-chrome-close.sc-kol-icon-default:before {\n content: \"\\eab8\";\n}\n\n/*!@.codicon-chrome-maximize:before*/.codicon-chrome-maximize.sc-kol-icon-default:before {\n content: \"\\eab9\";\n}\n\n/*!@.codicon-chrome-minimize:before*/.codicon-chrome-minimize.sc-kol-icon-default:before {\n content: \"\\eaba\";\n}\n\n/*!@.codicon-chrome-restore:before*/.codicon-chrome-restore.sc-kol-icon-default:before {\n content: \"\\eabb\";\n}\n\n/*!@.codicon-circle-outline:before*/.codicon-circle-outline.sc-kol-icon-default:before {\n content: \"\\eabc\";\n}\n\n/*!@.codicon-debug-breakpoint-unverified:before*/.codicon-debug-breakpoint-unverified.sc-kol-icon-default:before {\n content: \"\\eabc\";\n}\n\n/*!@.codicon-circle-slash:before*/.codicon-circle-slash.sc-kol-icon-default:before {\n content: \"\\eabd\";\n}\n\n/*!@.codicon-circuit-board:before*/.codicon-circuit-board.sc-kol-icon-default:before {\n content: \"\\eabe\";\n}\n\n/*!@.codicon-clear-all:before*/.codicon-clear-all.sc-kol-icon-default:before {\n content: \"\\eabf\";\n}\n\n/*!@.codicon-clippy:before*/.codicon-clippy.sc-kol-icon-default:before {\n content: \"\\eac0\";\n}\n\n/*!@.codicon-close-all:before*/.codicon-close-all.sc-kol-icon-default:before {\n content: \"\\eac1\";\n}\n\n/*!@.codicon-cloud-download:before*/.codicon-cloud-download.sc-kol-icon-default:before {\n content: \"\\eac2\";\n}\n\n/*!@.codicon-cloud-upload:before*/.codicon-cloud-upload.sc-kol-icon-default:before {\n content: \"\\eac3\";\n}\n\n/*!@.codicon-code:before*/.codicon-code.sc-kol-icon-default:before {\n content: \"\\eac4\";\n}\n\n/*!@.codicon-collapse-all:before*/.codicon-collapse-all.sc-kol-icon-default:before {\n content: \"\\eac5\";\n}\n\n/*!@.codicon-color-mode:before*/.codicon-color-mode.sc-kol-icon-default:before {\n content: \"\\eac6\";\n}\n\n/*!@.codicon-comment-discussion:before*/.codicon-comment-discussion.sc-kol-icon-default:before {\n content: \"\\eac7\";\n}\n\n/*!@.codicon-credit-card:before*/.codicon-credit-card.sc-kol-icon-default:before {\n content: \"\\eac9\";\n}\n\n/*!@.codicon-dash:before*/.codicon-dash.sc-kol-icon-default:before {\n content: \"\\eacc\";\n}\n\n/*!@.codicon-dashboard:before*/.codicon-dashboard.sc-kol-icon-default:before {\n content: \"\\eacd\";\n}\n\n/*!@.codicon-database:before*/.codicon-database.sc-kol-icon-default:before {\n content: \"\\eace\";\n}\n\n/*!@.codicon-debug-continue:before*/.codicon-debug-continue.sc-kol-icon-default:before {\n content: \"\\eacf\";\n}\n\n/*!@.codicon-debug-disconnect:before*/.codicon-debug-disconnect.sc-kol-icon-default:before {\n content: \"\\ead0\";\n}\n\n/*!@.codicon-debug-pause:before*/.codicon-debug-pause.sc-kol-icon-default:before {\n content: \"\\ead1\";\n}\n\n/*!@.codicon-debug-restart:before*/.codicon-debug-restart.sc-kol-icon-default:before {\n content: \"\\ead2\";\n}\n\n/*!@.codicon-debug-start:before*/.codicon-debug-start.sc-kol-icon-default:before {\n content: \"\\ead3\";\n}\n\n/*!@.codicon-debug-step-into:before*/.codicon-debug-step-into.sc-kol-icon-default:before {\n content: \"\\ead4\";\n}\n\n/*!@.codicon-debug-step-out:before*/.codicon-debug-step-out.sc-kol-icon-default:before {\n content: \"\\ead5\";\n}\n\n/*!@.codicon-debug-step-over:before*/.codicon-debug-step-over.sc-kol-icon-default:before {\n content: \"\\ead6\";\n}\n\n/*!@.codicon-debug-stop:before*/.codicon-debug-stop.sc-kol-icon-default:before {\n content: \"\\ead7\";\n}\n\n/*!@.codicon-debug:before*/.codicon-debug.sc-kol-icon-default:before {\n content: \"\\ead8\";\n}\n\n/*!@.codicon-device-camera-video:before*/.codicon-device-camera-video.sc-kol-icon-default:before {\n content: \"\\ead9\";\n}\n\n/*!@.codicon-device-camera:before*/.codicon-device-camera.sc-kol-icon-default:before {\n content: \"\\eada\";\n}\n\n/*!@.codicon-device-mobile:before*/.codicon-device-mobile.sc-kol-icon-default:before {\n content: \"\\eadb\";\n}\n\n/*!@.codicon-diff-added:before*/.codicon-diff-added.sc-kol-icon-default:before {\n content: \"\\eadc\";\n}\n\n/*!@.codicon-diff-ignored:before*/.codicon-diff-ignored.sc-kol-icon-default:before {\n content: \"\\eadd\";\n}\n\n/*!@.codicon-diff-modified:before*/.codicon-diff-modified.sc-kol-icon-default:before {\n content: \"\\eade\";\n}\n\n/*!@.codicon-diff-removed:before*/.codicon-diff-removed.sc-kol-icon-default:before {\n content: \"\\eadf\";\n}\n\n/*!@.codicon-diff-renamed:before*/.codicon-diff-renamed.sc-kol-icon-default:before {\n content: \"\\eae0\";\n}\n\n/*!@.codicon-diff:before*/.codicon-diff.sc-kol-icon-default:before {\n content: \"\\eae1\";\n}\n\n/*!@.codicon-discard:before*/.codicon-discard.sc-kol-icon-default:before {\n content: \"\\eae2\";\n}\n\n/*!@.codicon-editor-layout:before*/.codicon-editor-layout.sc-kol-icon-default:before {\n content: \"\\eae3\";\n}\n\n/*!@.codicon-empty-window:before*/.codicon-empty-window.sc-kol-icon-default:before {\n content: \"\\eae4\";\n}\n\n/*!@.codicon-exclude:before*/.codicon-exclude.sc-kol-icon-default:before {\n content: \"\\eae5\";\n}\n\n/*!@.codicon-extensions:before*/.codicon-extensions.sc-kol-icon-default:before {\n content: \"\\eae6\";\n}\n\n/*!@.codicon-eye-closed:before*/.codicon-eye-closed.sc-kol-icon-default:before {\n content: \"\\eae7\";\n}\n\n/*!@.codicon-file-binary:before*/.codicon-file-binary.sc-kol-icon-default:before {\n content: \"\\eae8\";\n}\n\n/*!@.codicon-file-code:before*/.codicon-file-code.sc-kol-icon-default:before {\n content: \"\\eae9\";\n}\n\n/*!@.codicon-file-media:before*/.codicon-file-media.sc-kol-icon-default:before {\n content: \"\\eaea\";\n}\n\n/*!@.codicon-file-pdf:before*/.codicon-file-pdf.sc-kol-icon-default:before {\n content: \"\\eaeb\";\n}\n\n/*!@.codicon-file-submodule:before*/.codicon-file-submodule.sc-kol-icon-default:before {\n content: \"\\eaec\";\n}\n\n/*!@.codicon-file-symlink-directory:before*/.codicon-file-symlink-directory.sc-kol-icon-default:before {\n content: \"\\eaed\";\n}\n\n/*!@.codicon-file-symlink-file:before*/.codicon-file-symlink-file.sc-kol-icon-default:before {\n content: \"\\eaee\";\n}\n\n/*!@.codicon-file-zip:before*/.codicon-file-zip.sc-kol-icon-default:before {\n content: \"\\eaef\";\n}\n\n/*!@.codicon-files:before*/.codicon-files.sc-kol-icon-default:before {\n content: \"\\eaf0\";\n}\n\n/*!@.codicon-filter:before*/.codicon-filter.sc-kol-icon-default:before {\n content: \"\\eaf1\";\n}\n\n/*!@.codicon-flame:before*/.codicon-flame.sc-kol-icon-default:before {\n content: \"\\eaf2\";\n}\n\n/*!@.codicon-fold-down:before*/.codicon-fold-down.sc-kol-icon-default:before {\n content: \"\\eaf3\";\n}\n\n/*!@.codicon-fold-up:before*/.codicon-fold-up.sc-kol-icon-default:before {\n content: \"\\eaf4\";\n}\n\n/*!@.codicon-fold:before*/.codicon-fold.sc-kol-icon-default:before {\n content: \"\\eaf5\";\n}\n\n/*!@.codicon-folder-active:before*/.codicon-folder-active.sc-kol-icon-default:before {\n content: \"\\eaf6\";\n}\n\n/*!@.codicon-folder-opened:before*/.codicon-folder-opened.sc-kol-icon-default:before {\n content: \"\\eaf7\";\n}\n\n/*!@.codicon-gear:before*/.codicon-gear.sc-kol-icon-default:before {\n content: \"\\eaf8\";\n}\n\n/*!@.codicon-gift:before*/.codicon-gift.sc-kol-icon-default:before {\n content: \"\\eaf9\";\n}\n\n/*!@.codicon-gist-secret:before*/.codicon-gist-secret.sc-kol-icon-default:before {\n content: \"\\eafa\";\n}\n\n/*!@.codicon-gist:before*/.codicon-gist.sc-kol-icon-default:before {\n content: \"\\eafb\";\n}\n\n/*!@.codicon-git-commit:before*/.codicon-git-commit.sc-kol-icon-default:before {\n content: \"\\eafc\";\n}\n\n/*!@.codicon-git-compare:before*/.codicon-git-compare.sc-kol-icon-default:before {\n content: \"\\eafd\";\n}\n\n/*!@.codicon-compare-changes:before*/.codicon-compare-changes.sc-kol-icon-default:before {\n content: \"\\eafd\";\n}\n\n/*!@.codicon-git-merge:before*/.codicon-git-merge.sc-kol-icon-default:before {\n content: \"\\eafe\";\n}\n\n/*!@.codicon-github-action:before*/.codicon-github-action.sc-kol-icon-default:before {\n content: \"\\eaff\";\n}\n\n/*!@.codicon-github-alt:before*/.codicon-github-alt.sc-kol-icon-default:before {\n content: \"\\eb00\";\n}\n\n/*!@.codicon-globe:before*/.codicon-globe.sc-kol-icon-default:before {\n content: \"\\eb01\";\n}\n\n/*!@.codicon-grabber:before*/.codicon-grabber.sc-kol-icon-default:before {\n content: \"\\eb02\";\n}\n\n/*!@.codicon-graph:before*/.codicon-graph.sc-kol-icon-default:before {\n content: \"\\eb03\";\n}\n\n/*!@.codicon-gripper:before*/.codicon-gripper.sc-kol-icon-default:before {\n content: \"\\eb04\";\n}\n\n/*!@.codicon-heart:before*/.codicon-heart.sc-kol-icon-default:before {\n content: \"\\eb05\";\n}\n\n/*!@.codicon-home:before*/.codicon-home.sc-kol-icon-default:before {\n content: \"\\eb06\";\n}\n\n/*!@.codicon-horizontal-rule:before*/.codicon-horizontal-rule.sc-kol-icon-default:before {\n content: \"\\eb07\";\n}\n\n/*!@.codicon-hubot:before*/.codicon-hubot.sc-kol-icon-default:before {\n content: \"\\eb08\";\n}\n\n/*!@.codicon-inbox:before*/.codicon-inbox.sc-kol-icon-default:before {\n content: \"\\eb09\";\n}\n\n/*!@.codicon-issue-reopened:before*/.codicon-issue-reopened.sc-kol-icon-default:before {\n content: \"\\eb0b\";\n}\n\n/*!@.codicon-issues:before*/.codicon-issues.sc-kol-icon-default:before {\n content: \"\\eb0c\";\n}\n\n/*!@.codicon-italic:before*/.codicon-italic.sc-kol-icon-default:before {\n content: \"\\eb0d\";\n}\n\n/*!@.codicon-jersey:before*/.codicon-jersey.sc-kol-icon-default:before {\n content: \"\\eb0e\";\n}\n\n/*!@.codicon-json:before*/.codicon-json.sc-kol-icon-default:before {\n content: \"\\eb0f\";\n}\n\n/*!@.codicon-kebab-vertical:before*/.codicon-kebab-vertical.sc-kol-icon-default:before {\n content: \"\\eb10\";\n}\n\n/*!@.codicon-key:before*/.codicon-key.sc-kol-icon-default:before {\n content: \"\\eb11\";\n}\n\n/*!@.codicon-law:before*/.codicon-law.sc-kol-icon-default:before {\n content: \"\\eb12\";\n}\n\n/*!@.codicon-lightbulb-autofix:before*/.codicon-lightbulb-autofix.sc-kol-icon-default:before {\n content: \"\\eb13\";\n}\n\n/*!@.codicon-link-external:before*/.codicon-link-external.sc-kol-icon-default:before {\n content: \"\\eb14\";\n}\n\n/*!@.codicon-link:before*/.codicon-link.sc-kol-icon-default:before {\n content: \"\\eb15\";\n}\n\n/*!@.codicon-list-ordered:before*/.codicon-list-ordered.sc-kol-icon-default:before {\n content: \"\\eb16\";\n}\n\n/*!@.codicon-list-unordered:before*/.codicon-list-unordered.sc-kol-icon-default:before {\n content: \"\\eb17\";\n}\n\n/*!@.codicon-live-share:before*/.codicon-live-share.sc-kol-icon-default:before {\n content: \"\\eb18\";\n}\n\n/*!@.codicon-loading:before*/.codicon-loading.sc-kol-icon-default:before {\n content: \"\\eb19\";\n}\n\n/*!@.codicon-location:before*/.codicon-location.sc-kol-icon-default:before {\n content: \"\\eb1a\";\n}\n\n/*!@.codicon-mail-read:before*/.codicon-mail-read.sc-kol-icon-default:before {\n content: \"\\eb1b\";\n}\n\n/*!@.codicon-mail:before*/.codicon-mail.sc-kol-icon-default:before {\n content: \"\\eb1c\";\n}\n\n/*!@.codicon-markdown:before*/.codicon-markdown.sc-kol-icon-default:before {\n content: \"\\eb1d\";\n}\n\n/*!@.codicon-megaphone:before*/.codicon-megaphone.sc-kol-icon-default:before {\n content: \"\\eb1e\";\n}\n\n/*!@.codicon-mention:before*/.codicon-mention.sc-kol-icon-default:before {\n content: \"\\eb1f\";\n}\n\n/*!@.codicon-milestone:before*/.codicon-milestone.sc-kol-icon-default:before {\n content: \"\\eb20\";\n}\n\n/*!@.codicon-mortar-board:before*/.codicon-mortar-board.sc-kol-icon-default:before {\n content: \"\\eb21\";\n}\n\n/*!@.codicon-move:before*/.codicon-move.sc-kol-icon-default:before {\n content: \"\\eb22\";\n}\n\n/*!@.codicon-multiple-windows:before*/.codicon-multiple-windows.sc-kol-icon-default:before {\n content: \"\\eb23\";\n}\n\n/*!@.codicon-mute:before*/.codicon-mute.sc-kol-icon-default:before {\n content: \"\\eb24\";\n}\n\n/*!@.codicon-no-newline:before*/.codicon-no-newline.sc-kol-icon-default:before {\n content: \"\\eb25\";\n}\n\n/*!@.codicon-note:before*/.codicon-note.sc-kol-icon-default:before {\n content: \"\\eb26\";\n}\n\n/*!@.codicon-octoface:before*/.codicon-octoface.sc-kol-icon-default:before {\n content: \"\\eb27\";\n}\n\n/*!@.codicon-open-preview:before*/.codicon-open-preview.sc-kol-icon-default:before {\n content: \"\\eb28\";\n}\n\n/*!@.codicon-package:before*/.codicon-package.sc-kol-icon-default:before {\n content: \"\\eb29\";\n}\n\n/*!@.codicon-paintcan:before*/.codicon-paintcan.sc-kol-icon-default:before {\n content: \"\\eb2a\";\n}\n\n/*!@.codicon-pin:before*/.codicon-pin.sc-kol-icon-default:before {\n content: \"\\eb2b\";\n}\n\n/*!@.codicon-play:before*/.codicon-play.sc-kol-icon-default:before {\n content: \"\\eb2c\";\n}\n\n/*!@.codicon-run:before*/.codicon-run.sc-kol-icon-default:before {\n content: \"\\eb2c\";\n}\n\n/*!@.codicon-plug:before*/.codicon-plug.sc-kol-icon-default:before {\n content: \"\\eb2d\";\n}\n\n/*!@.codicon-preserve-case:before*/.codicon-preserve-case.sc-kol-icon-default:before {\n content: \"\\eb2e\";\n}\n\n/*!@.codicon-preview:before*/.codicon-preview.sc-kol-icon-default:before {\n content: \"\\eb2f\";\n}\n\n/*!@.codicon-project:before*/.codicon-project.sc-kol-icon-default:before {\n content: \"\\eb30\";\n}\n\n/*!@.codicon-pulse:before*/.codicon-pulse.sc-kol-icon-default:before {\n content: \"\\eb31\";\n}\n\n/*!@.codicon-question:before*/.codicon-question.sc-kol-icon-default:before {\n content: \"\\eb32\";\n}\n\n/*!@.codicon-quote:before*/.codicon-quote.sc-kol-icon-default:before {\n content: \"\\eb33\";\n}\n\n/*!@.codicon-radio-tower:before*/.codicon-radio-tower.sc-kol-icon-default:before {\n content: \"\\eb34\";\n}\n\n/*!@.codicon-reactions:before*/.codicon-reactions.sc-kol-icon-default:before {\n content: \"\\eb35\";\n}\n\n/*!@.codicon-references:before*/.codicon-references.sc-kol-icon-default:before {\n content: \"\\eb36\";\n}\n\n/*!@.codicon-refresh:before*/.codicon-refresh.sc-kol-icon-default:before {\n content: \"\\eb37\";\n}\n\n/*!@.codicon-regex:before*/.codicon-regex.sc-kol-icon-default:before {\n content: \"\\eb38\";\n}\n\n/*!@.codicon-remote-explorer:before*/.codicon-remote-explorer.sc-kol-icon-default:before {\n content: \"\\eb39\";\n}\n\n/*!@.codicon-remote:before*/.codicon-remote.sc-kol-icon-default:before {\n content: \"\\eb3a\";\n}\n\n/*!@.codicon-remove:before*/.codicon-remove.sc-kol-icon-default:before {\n content: \"\\eb3b\";\n}\n\n/*!@.codicon-replace-all:before*/.codicon-replace-all.sc-kol-icon-default:before {\n content: \"\\eb3c\";\n}\n\n/*!@.codicon-replace:before*/.codicon-replace.sc-kol-icon-default:before {\n content: \"\\eb3d\";\n}\n\n/*!@.codicon-repo-clone:before*/.codicon-repo-clone.sc-kol-icon-default:before {\n content: \"\\eb3e\";\n}\n\n/*!@.codicon-repo-force-push:before*/.codicon-repo-force-push.sc-kol-icon-default:before {\n content: \"\\eb3f\";\n}\n\n/*!@.codicon-repo-pull:before*/.codicon-repo-pull.sc-kol-icon-default:before {\n content: \"\\eb40\";\n}\n\n/*!@.codicon-repo-push:before*/.codicon-repo-push.sc-kol-icon-default:before {\n content: \"\\eb41\";\n}\n\n/*!@.codicon-report:before*/.codicon-report.sc-kol-icon-default:before {\n content: \"\\eb42\";\n}\n\n/*!@.codicon-request-changes:before*/.codicon-request-changes.sc-kol-icon-default:before {\n content: \"\\eb43\";\n}\n\n/*!@.codicon-rocket:before*/.codicon-rocket.sc-kol-icon-default:before {\n content: \"\\eb44\";\n}\n\n/*!@.codicon-root-folder-opened:before*/.codicon-root-folder-opened.sc-kol-icon-default:before {\n content: \"\\eb45\";\n}\n\n/*!@.codicon-root-folder:before*/.codicon-root-folder.sc-kol-icon-default:before {\n content: \"\\eb46\";\n}\n\n/*!@.codicon-rss:before*/.codicon-rss.sc-kol-icon-default:before {\n content: \"\\eb47\";\n}\n\n/*!@.codicon-ruby:before*/.codicon-ruby.sc-kol-icon-default:before {\n content: \"\\eb48\";\n}\n\n/*!@.codicon-save-all:before*/.codicon-save-all.sc-kol-icon-default:before {\n content: \"\\eb49\";\n}\n\n/*!@.codicon-save-as:before*/.codicon-save-as.sc-kol-icon-default:before {\n content: \"\\eb4a\";\n}\n\n/*!@.codicon-save:before*/.codicon-save.sc-kol-icon-default:before {\n content: \"\\eb4b\";\n}\n\n/*!@.codicon-screen-full:before*/.codicon-screen-full.sc-kol-icon-default:before {\n content: \"\\eb4c\";\n}\n\n/*!@.codicon-screen-normal:before*/.codicon-screen-normal.sc-kol-icon-default:before {\n content: \"\\eb4d\";\n}\n\n/*!@.codicon-search-stop:before*/.codicon-search-stop.sc-kol-icon-default:before {\n content: \"\\eb4e\";\n}\n\n/*!@.codicon-server:before*/.codicon-server.sc-kol-icon-default:before {\n content: \"\\eb50\";\n}\n\n/*!@.codicon-settings-gear:before*/.codicon-settings-gear.sc-kol-icon-default:before {\n content: \"\\eb51\";\n}\n\n/*!@.codicon-settings:before*/.codicon-settings.sc-kol-icon-default:before {\n content: \"\\eb52\";\n}\n\n/*!@.codicon-shield:before*/.codicon-shield.sc-kol-icon-default:before {\n content: \"\\eb53\";\n}\n\n/*!@.codicon-smiley:before*/.codicon-smiley.sc-kol-icon-default:before {\n content: \"\\eb54\";\n}\n\n/*!@.codicon-sort-precedence:before*/.codicon-sort-precedence.sc-kol-icon-default:before {\n content: \"\\eb55\";\n}\n\n/*!@.codicon-split-horizontal:before*/.codicon-split-horizontal.sc-kol-icon-default:before {\n content: \"\\eb56\";\n}\n\n/*!@.codicon-split-vertical:before*/.codicon-split-vertical.sc-kol-icon-default:before {\n content: \"\\eb57\";\n}\n\n/*!@.codicon-squirrel:before*/.codicon-squirrel.sc-kol-icon-default:before {\n content: \"\\eb58\";\n}\n\n/*!@.codicon-star-full:before*/.codicon-star-full.sc-kol-icon-default:before {\n content: \"\\eb59\";\n}\n\n/*!@.codicon-star-half:before*/.codicon-star-half.sc-kol-icon-default:before {\n content: \"\\eb5a\";\n}\n\n/*!@.codicon-symbol-class:before*/.codicon-symbol-class.sc-kol-icon-default:before {\n content: \"\\eb5b\";\n}\n\n/*!@.codicon-symbol-color:before*/.codicon-symbol-color.sc-kol-icon-default:before {\n content: \"\\eb5c\";\n}\n\n/*!@.codicon-symbol-constant:before*/.codicon-symbol-constant.sc-kol-icon-default:before {\n content: \"\\eb5d\";\n}\n\n/*!@.codicon-symbol-enum-member:before*/.codicon-symbol-enum-member.sc-kol-icon-default:before {\n content: \"\\eb5e\";\n}\n\n/*!@.codicon-symbol-field:before*/.codicon-symbol-field.sc-kol-icon-default:before {\n content: \"\\eb5f\";\n}\n\n/*!@.codicon-symbol-file:before*/.codicon-symbol-file.sc-kol-icon-default:before {\n content: \"\\eb60\";\n}\n\n/*!@.codicon-symbol-interface:before*/.codicon-symbol-interface.sc-kol-icon-default:before {\n content: \"\\eb61\";\n}\n\n/*!@.codicon-symbol-keyword:before*/.codicon-symbol-keyword.sc-kol-icon-default:before {\n content: \"\\eb62\";\n}\n\n/*!@.codicon-symbol-misc:before*/.codicon-symbol-misc.sc-kol-icon-default:before {\n content: \"\\eb63\";\n}\n\n/*!@.codicon-symbol-operator:before*/.codicon-symbol-operator.sc-kol-icon-default:before {\n content: \"\\eb64\";\n}\n\n/*!@.codicon-symbol-property:before*/.codicon-symbol-property.sc-kol-icon-default:before {\n content: \"\\eb65\";\n}\n\n/*!@.codicon-wrench:before*/.codicon-wrench.sc-kol-icon-default:before {\n content: \"\\eb65\";\n}\n\n/*!@.codicon-wrench-subaction:before*/.codicon-wrench-subaction.sc-kol-icon-default:before {\n content: \"\\eb65\";\n}\n\n/*!@.codicon-symbol-snippet:before*/.codicon-symbol-snippet.sc-kol-icon-default:before {\n content: \"\\eb66\";\n}\n\n/*!@.codicon-tasklist:before*/.codicon-tasklist.sc-kol-icon-default:before {\n content: \"\\eb67\";\n}\n\n/*!@.codicon-telescope:before*/.codicon-telescope.sc-kol-icon-default:before {\n content: \"\\eb68\";\n}\n\n/*!@.codicon-text-size:before*/.codicon-text-size.sc-kol-icon-default:before {\n content: \"\\eb69\";\n}\n\n/*!@.codicon-three-bars:before*/.codicon-three-bars.sc-kol-icon-default:before {\n content: \"\\eb6a\";\n}\n\n/*!@.codicon-thumbsdown:before*/.codicon-thumbsdown.sc-kol-icon-default:before {\n content: \"\\eb6b\";\n}\n\n/*!@.codicon-thumbsup:before*/.codicon-thumbsup.sc-kol-icon-default:before {\n content: \"\\eb6c\";\n}\n\n/*!@.codicon-tools:before*/.codicon-tools.sc-kol-icon-default:before {\n content: \"\\eb6d\";\n}\n\n/*!@.codicon-triangle-down:before*/.codicon-triangle-down.sc-kol-icon-default:before {\n content: \"\\eb6e\";\n}\n\n/*!@.codicon-triangle-left:before*/.codicon-triangle-left.sc-kol-icon-default:before {\n content: \"\\eb6f\";\n}\n\n/*!@.codicon-triangle-right:before*/.codicon-triangle-right.sc-kol-icon-default:before {\n content: \"\\eb70\";\n}\n\n/*!@.codicon-triangle-up:before*/.codicon-triangle-up.sc-kol-icon-default:before {\n content: \"\\eb71\";\n}\n\n/*!@.codicon-twitter:before*/.codicon-twitter.sc-kol-icon-default:before {\n content: \"\\eb72\";\n}\n\n/*!@.codicon-unfold:before*/.codicon-unfold.sc-kol-icon-default:before {\n content: \"\\eb73\";\n}\n\n/*!@.codicon-unlock:before*/.codicon-unlock.sc-kol-icon-default:before {\n content: \"\\eb74\";\n}\n\n/*!@.codicon-unmute:before*/.codicon-unmute.sc-kol-icon-default:before {\n content: \"\\eb75\";\n}\n\n/*!@.codicon-unverified:before*/.codicon-unverified.sc-kol-icon-default:before {\n content: \"\\eb76\";\n}\n\n/*!@.codicon-verified:before*/.codicon-verified.sc-kol-icon-default:before {\n content: \"\\eb77\";\n}\n\n/*!@.codicon-versions:before*/.codicon-versions.sc-kol-icon-default:before {\n content: \"\\eb78\";\n}\n\n/*!@.codicon-vm-active:before*/.codicon-vm-active.sc-kol-icon-default:before {\n content: \"\\eb79\";\n}\n\n/*!@.codicon-vm-outline:before*/.codicon-vm-outline.sc-kol-icon-default:before {\n content: \"\\eb7a\";\n}\n\n/*!@.codicon-vm-running:before*/.codicon-vm-running.sc-kol-icon-default:before {\n content: \"\\eb7b\";\n}\n\n/*!@.codicon-watch:before*/.codicon-watch.sc-kol-icon-default:before {\n content: \"\\eb7c\";\n}\n\n/*!@.codicon-whitespace:before*/.codicon-whitespace.sc-kol-icon-default:before {\n content: \"\\eb7d\";\n}\n\n/*!@.codicon-whole-word:before*/.codicon-whole-word.sc-kol-icon-default:before {\n content: \"\\eb7e\";\n}\n\n/*!@.codicon-window:before*/.codicon-window.sc-kol-icon-default:before {\n content: \"\\eb7f\";\n}\n\n/*!@.codicon-word-wrap:before*/.codicon-word-wrap.sc-kol-icon-default:before {\n content: \"\\eb80\";\n}\n\n/*!@.codicon-zoom-in:before*/.codicon-zoom-in.sc-kol-icon-default:before {\n content: \"\\eb81\";\n}\n\n/*!@.codicon-zoom-out:before*/.codicon-zoom-out.sc-kol-icon-default:before {\n content: \"\\eb82\";\n}\n\n/*!@.codicon-list-filter:before*/.codicon-list-filter.sc-kol-icon-default:before {\n content: \"\\eb83\";\n}\n\n/*!@.codicon-list-flat:before*/.codicon-list-flat.sc-kol-icon-default:before {\n content: \"\\eb84\";\n}\n\n/*!@.codicon-list-selection:before*/.codicon-list-selection.sc-kol-icon-default:before {\n content: \"\\eb85\";\n}\n\n/*!@.codicon-selection:before*/.codicon-selection.sc-kol-icon-default:before {\n content: \"\\eb85\";\n}\n\n/*!@.codicon-list-tree:before*/.codicon-list-tree.sc-kol-icon-default:before {\n content: \"\\eb86\";\n}\n\n/*!@.codicon-debug-breakpoint-function-unverified:before*/.codicon-debug-breakpoint-function-unverified.sc-kol-icon-default:before {\n content: \"\\eb87\";\n}\n\n/*!@.codicon-debug-breakpoint-function:before*/.codicon-debug-breakpoint-function.sc-kol-icon-default:before {\n content: \"\\eb88\";\n}\n\n/*!@.codicon-debug-breakpoint-function-disabled:before*/.codicon-debug-breakpoint-function-disabled.sc-kol-icon-default:before {\n content: \"\\eb88\";\n}\n\n/*!@.codicon-debug-stackframe-active:before*/.codicon-debug-stackframe-active.sc-kol-icon-default:before {\n content: \"\\eb89\";\n}\n\n/*!@.codicon-circle-small-filled:before*/.codicon-circle-small-filled.sc-kol-icon-default:before {\n content: \"\\eb8a\";\n}\n\n/*!@.codicon-debug-stackframe-dot:before*/.codicon-debug-stackframe-dot.sc-kol-icon-default:before {\n content: \"\\eb8a\";\n}\n\n/*!@.codicon-debug-stackframe:before*/.codicon-debug-stackframe.sc-kol-icon-default:before {\n content: \"\\eb8b\";\n}\n\n/*!@.codicon-debug-stackframe-focused:before*/.codicon-debug-stackframe-focused.sc-kol-icon-default:before {\n content: \"\\eb8b\";\n}\n\n/*!@.codicon-debug-breakpoint-unsupported:before*/.codicon-debug-breakpoint-unsupported.sc-kol-icon-default:before {\n content: \"\\eb8c\";\n}\n\n/*!@.codicon-symbol-string:before*/.codicon-symbol-string.sc-kol-icon-default:before {\n content: \"\\eb8d\";\n}\n\n/*!@.codicon-debug-reverse-continue:before*/.codicon-debug-reverse-continue.sc-kol-icon-default:before {\n content: \"\\eb8e\";\n}\n\n/*!@.codicon-debug-step-back:before*/.codicon-debug-step-back.sc-kol-icon-default:before {\n content: \"\\eb8f\";\n}\n\n/*!@.codicon-debug-restart-frame:before*/.codicon-debug-restart-frame.sc-kol-icon-default:before {\n content: \"\\eb90\";\n}\n\n/*!@.codicon-debug-alt:before*/.codicon-debug-alt.sc-kol-icon-default:before {\n content: \"\\eb91\";\n}\n\n/*!@.codicon-call-incoming:before*/.codicon-call-incoming.sc-kol-icon-default:before {\n content: \"\\eb92\";\n}\n\n/*!@.codicon-call-outgoing:before*/.codicon-call-outgoing.sc-kol-icon-default:before {\n content: \"\\eb93\";\n}\n\n/*!@.codicon-menu:before*/.codicon-menu.sc-kol-icon-default:before {\n content: \"\\eb94\";\n}\n\n/*!@.codicon-expand-all:before*/.codicon-expand-all.sc-kol-icon-default:before {\n content: \"\\eb95\";\n}\n\n/*!@.codicon-feedback:before*/.codicon-feedback.sc-kol-icon-default:before {\n content: \"\\eb96\";\n}\n\n/*!@.codicon-group-by-ref-type:before*/.codicon-group-by-ref-type.sc-kol-icon-default:before {\n content: \"\\eb97\";\n}\n\n/*!@.codicon-ungroup-by-ref-type:before*/.codicon-ungroup-by-ref-type.sc-kol-icon-default:before {\n content: \"\\eb98\";\n}\n\n/*!@.codicon-account:before*/.codicon-account.sc-kol-icon-default:before {\n content: \"\\eb99\";\n}\n\n/*!@.codicon-bell-dot:before*/.codicon-bell-dot.sc-kol-icon-default:before {\n content: \"\\eb9a\";\n}\n\n/*!@.codicon-debug-console:before*/.codicon-debug-console.sc-kol-icon-default:before {\n content: \"\\eb9b\";\n}\n\n/*!@.codicon-library:before*/.codicon-library.sc-kol-icon-default:before {\n content: \"\\eb9c\";\n}\n\n/*!@.codicon-output:before*/.codicon-output.sc-kol-icon-default:before {\n content: \"\\eb9d\";\n}\n\n/*!@.codicon-run-all:before*/.codicon-run-all.sc-kol-icon-default:before {\n content: \"\\eb9e\";\n}\n\n/*!@.codicon-sync-ignored:before*/.codicon-sync-ignored.sc-kol-icon-default:before {\n content: \"\\eb9f\";\n}\n\n/*!@.codicon-pinned:before*/.codicon-pinned.sc-kol-icon-default:before {\n content: \"\\eba0\";\n}\n\n/*!@.codicon-github-inverted:before*/.codicon-github-inverted.sc-kol-icon-default:before {\n content: \"\\eba1\";\n}\n\n/*!@.codicon-server-process:before*/.codicon-server-process.sc-kol-icon-default:before {\n content: \"\\eba2\";\n}\n\n/*!@.codicon-server-environment:before*/.codicon-server-environment.sc-kol-icon-default:before {\n content: \"\\eba3\";\n}\n\n/*!@.codicon-pass:before*/.codicon-pass.sc-kol-icon-default:before {\n content: \"\\eba4\";\n}\n\n/*!@.codicon-issue-closed:before*/.codicon-issue-closed.sc-kol-icon-default:before {\n content: \"\\eba4\";\n}\n\n/*!@.codicon-stop-circle:before*/.codicon-stop-circle.sc-kol-icon-default:before {\n content: \"\\eba5\";\n}\n\n/*!@.codicon-play-circle:before*/.codicon-play-circle.sc-kol-icon-default:before {\n content: \"\\eba6\";\n}\n\n/*!@.codicon-record:before*/.codicon-record.sc-kol-icon-default:before {\n content: \"\\eba7\";\n}\n\n/*!@.codicon-debug-alt-small:before*/.codicon-debug-alt-small.sc-kol-icon-default:before {\n content: \"\\eba8\";\n}\n\n/*!@.codicon-vm-connect:before*/.codicon-vm-connect.sc-kol-icon-default:before {\n content: \"\\eba9\";\n}\n\n/*!@.codicon-cloud:before*/.codicon-cloud.sc-kol-icon-default:before {\n content: \"\\ebaa\";\n}\n\n/*!@.codicon-merge:before*/.codicon-merge.sc-kol-icon-default:before {\n content: \"\\ebab\";\n}\n\n/*!@.codicon-export:before*/.codicon-export.sc-kol-icon-default:before {\n content: \"\\ebac\";\n}\n\n/*!@.codicon-graph-left:before*/.codicon-graph-left.sc-kol-icon-default:before {\n content: \"\\ebad\";\n}\n\n/*!@.codicon-magnet:before*/.codicon-magnet.sc-kol-icon-default:before {\n content: \"\\ebae\";\n}\n\n/*!@.codicon-notebook:before*/.codicon-notebook.sc-kol-icon-default:before {\n content: \"\\ebaf\";\n}\n\n/*!@.codicon-redo:before*/.codicon-redo.sc-kol-icon-default:before {\n content: \"\\ebb0\";\n}\n\n/*!@.codicon-check-all:before*/.codicon-check-all.sc-kol-icon-default:before {\n content: \"\\ebb1\";\n}\n\n/*!@.codicon-pinned-dirty:before*/.codicon-pinned-dirty.sc-kol-icon-default:before {\n content: \"\\ebb2\";\n}\n\n/*!@.codicon-pass-filled:before*/.codicon-pass-filled.sc-kol-icon-default:before {\n content: \"\\ebb3\";\n}\n\n/*!@.codicon-circle-large-filled:before*/.codicon-circle-large-filled.sc-kol-icon-default:before {\n content: \"\\ebb4\";\n}\n\n/*!@.codicon-circle-large-outline:before*/.codicon-circle-large-outline.sc-kol-icon-default:before {\n content: \"\\ebb5\";\n}\n\n/*!@.codicon-combine:before*/.codicon-combine.sc-kol-icon-default:before {\n content: \"\\ebb6\";\n}\n\n/*!@.codicon-gather:before*/.codicon-gather.sc-kol-icon-default:before {\n content: \"\\ebb6\";\n}\n\n/*!@.codicon-table:before*/.codicon-table.sc-kol-icon-default:before {\n content: \"\\ebb7\";\n}\n\n/*!@.codicon-variable-group:before*/.codicon-variable-group.sc-kol-icon-default:before {\n content: \"\\ebb8\";\n}\n\n/*!@.codicon-type-hierarchy:before*/.codicon-type-hierarchy.sc-kol-icon-default:before {\n content: \"\\ebb9\";\n}\n\n/*!@.codicon-type-hierarchy-sub:before*/.codicon-type-hierarchy-sub.sc-kol-icon-default:before {\n content: \"\\ebba\";\n}\n\n/*!@.codicon-type-hierarchy-super:before*/.codicon-type-hierarchy-super.sc-kol-icon-default:before {\n content: \"\\ebbb\";\n}\n\n/*!@.codicon-git-pull-request-create:before*/.codicon-git-pull-request-create.sc-kol-icon-default:before {\n content: \"\\ebbc\";\n}\n\n/*!@.codicon-run-above:before*/.codicon-run-above.sc-kol-icon-default:before {\n content: \"\\ebbd\";\n}\n\n/*!@.codicon-run-below:before*/.codicon-run-below.sc-kol-icon-default:before {\n content: \"\\ebbe\";\n}\n\n/*!@.codicon-notebook-template:before*/.codicon-notebook-template.sc-kol-icon-default:before {\n content: \"\\ebbf\";\n}\n\n/*!@.codicon-debug-rerun:before*/.codicon-debug-rerun.sc-kol-icon-default:before {\n content: \"\\ebc0\";\n}\n\n/*!@.codicon-workspace-trusted:before*/.codicon-workspace-trusted.sc-kol-icon-default:before {\n content: \"\\ebc1\";\n}\n\n/*!@.codicon-workspace-untrusted:before*/.codicon-workspace-untrusted.sc-kol-icon-default:before {\n content: \"\\ebc2\";\n}\n\n/*!@.codicon-workspace-unknown:before*/.codicon-workspace-unknown.sc-kol-icon-default:before {\n content: \"\\ebc3\";\n}\n\n/*!@.codicon-terminal-cmd:before*/.codicon-terminal-cmd.sc-kol-icon-default:before {\n content: \"\\ebc4\";\n}\n\n/*!@.codicon-terminal-debian:before*/.codicon-terminal-debian.sc-kol-icon-default:before {\n content: \"\\ebc5\";\n}\n\n/*!@.codicon-terminal-linux:before*/.codicon-terminal-linux.sc-kol-icon-default:before {\n content: \"\\ebc6\";\n}\n\n/*!@.codicon-terminal-powershell:before*/.codicon-terminal-powershell.sc-kol-icon-default:before {\n content: \"\\ebc7\";\n}\n\n/*!@.codicon-terminal-tmux:before*/.codicon-terminal-tmux.sc-kol-icon-default:before {\n content: \"\\ebc8\";\n}\n\n/*!@.codicon-terminal-ubuntu:before*/.codicon-terminal-ubuntu.sc-kol-icon-default:before {\n content: \"\\ebc9\";\n}\n\n/*!@.codicon-terminal-bash:before*/.codicon-terminal-bash.sc-kol-icon-default:before {\n content: \"\\ebca\";\n}\n\n/*!@.codicon-arrow-swap:before*/.codicon-arrow-swap.sc-kol-icon-default:before {\n content: \"\\ebcb\";\n}\n\n/*!@.codicon-copy:before*/.codicon-copy.sc-kol-icon-default:before {\n content: \"\\ebcc\";\n}\n\n/*!@.codicon-person-add:before*/.codicon-person-add.sc-kol-icon-default:before {\n content: \"\\ebcd\";\n}\n\n/*!@.codicon-filter-filled:before*/.codicon-filter-filled.sc-kol-icon-default:before {\n content: \"\\ebce\";\n}\n\n/*!@.codicon-wand:before*/.codicon-wand.sc-kol-icon-default:before {\n content: \"\\ebcf\";\n}\n\n/*!@.codicon-debug-line-by-line:before*/.codicon-debug-line-by-line.sc-kol-icon-default:before {\n content: \"\\ebd0\";\n}\n\n/*!@.codicon-inspect:before*/.codicon-inspect.sc-kol-icon-default:before {\n content: \"\\ebd1\";\n}\n\n/*!@.codicon-layers:before*/.codicon-layers.sc-kol-icon-default:before {\n content: \"\\ebd2\";\n}\n\n/*!@.codicon-layers-dot:before*/.codicon-layers-dot.sc-kol-icon-default:before {\n content: \"\\ebd3\";\n}\n\n/*!@.codicon-layers-active:before*/.codicon-layers-active.sc-kol-icon-default:before {\n content: \"\\ebd4\";\n}\n\n/*!@.codicon-compass:before*/.codicon-compass.sc-kol-icon-default:before {\n content: \"\\ebd5\";\n}\n\n/*!@.codicon-compass-dot:before*/.codicon-compass-dot.sc-kol-icon-default:before {\n content: \"\\ebd6\";\n}\n\n/*!@.codicon-compass-active:before*/.codicon-compass-active.sc-kol-icon-default:before {\n content: \"\\ebd7\";\n}\n\n/*!@.codicon-azure:before*/.codicon-azure.sc-kol-icon-default:before {\n content: \"\\ebd8\";\n}\n\n/*!@.codicon-issue-draft:before*/.codicon-issue-draft.sc-kol-icon-default:before {\n content: \"\\ebd9\";\n}\n\n/*!@.codicon-git-pull-request-closed:before*/.codicon-git-pull-request-closed.sc-kol-icon-default:before {\n content: \"\\ebda\";\n}\n\n/*!@.codicon-git-pull-request-draft:before*/.codicon-git-pull-request-draft.sc-kol-icon-default:before {\n content: \"\\ebdb\";\n}\n\n/*!@.codicon-debug-all:before*/.codicon-debug-all.sc-kol-icon-default:before {\n content: \"\\ebdc\";\n}\n\n/*!@.codicon-debug-coverage:before*/.codicon-debug-coverage.sc-kol-icon-default:before {\n content: \"\\ebdd\";\n}\n\n/*!@.codicon-run-errors:before*/.codicon-run-errors.sc-kol-icon-default:before {\n content: \"\\ebde\";\n}\n\n/*!@.codicon-folder-library:before*/.codicon-folder-library.sc-kol-icon-default:before {\n content: \"\\ebdf\";\n}\n\n/*!@.codicon-debug-continue-small:before*/.codicon-debug-continue-small.sc-kol-icon-default:before {\n content: \"\\ebe0\";\n}\n\n/*!@.codicon-beaker-stop:before*/.codicon-beaker-stop.sc-kol-icon-default:before {\n content: \"\\ebe1\";\n}\n\n/*!@.codicon-graph-line:before*/.codicon-graph-line.sc-kol-icon-default:before {\n content: \"\\ebe2\";\n}\n\n/*!@.codicon-graph-scatter:before*/.codicon-graph-scatter.sc-kol-icon-default:before {\n content: \"\\ebe3\";\n}\n\n/*!@.codicon-pie-chart:before*/.codicon-pie-chart.sc-kol-icon-default:before {\n content: \"\\ebe4\";\n}\n\n/*!@.codicon-bracket:before*/.codicon-bracket.sc-kol-icon-default:before {\n content: \"\\eb0f\";\n}\n\n/*!@.codicon-bracket-dot:before*/.codicon-bracket-dot.sc-kol-icon-default:before {\n content: \"\\ebe5\";\n}\n\n/*!@.codicon-bracket-error:before*/.codicon-bracket-error.sc-kol-icon-default:before {\n content: \"\\ebe6\";\n}\n\n/*!@.codicon-lock-small:before*/.codicon-lock-small.sc-kol-icon-default:before {\n content: \"\\ebe7\";\n}\n\n/*!@.codicon-azure-devops:before*/.codicon-azure-devops.sc-kol-icon-default:before {\n content: \"\\ebe8\";\n}\n\n/*!@.codicon-verified-filled:before*/.codicon-verified-filled.sc-kol-icon-default:before {\n content: \"\\ebe9\";\n}\n\n/*!@.codicon-newline:before*/.codicon-newline.sc-kol-icon-default:before {\n content: \"\\ebea\";\n}\n\n/*!@.codicon-layout:before*/.codicon-layout.sc-kol-icon-default:before {\n content: \"\\ebeb\";\n}\n\n/*!@.codicon-layout-activitybar-left:before*/.codicon-layout-activitybar-left.sc-kol-icon-default:before {\n content: \"\\ebec\";\n}\n\n/*!@.codicon-layout-activitybar-right:before*/.codicon-layout-activitybar-right.sc-kol-icon-default:before {\n content: \"\\ebed\";\n}\n\n/*!@.codicon-layout-panel-left:before*/.codicon-layout-panel-left.sc-kol-icon-default:before {\n content: \"\\ebee\";\n}\n\n/*!@.codicon-layout-panel-center:before*/.codicon-layout-panel-center.sc-kol-icon-default:before {\n content: \"\\ebef\";\n}\n\n/*!@.codicon-layout-panel-justify:before*/.codicon-layout-panel-justify.sc-kol-icon-default:before {\n content: \"\\ebf0\";\n}\n\n/*!@.codicon-layout-panel-right:before*/.codicon-layout-panel-right.sc-kol-icon-default:before {\n content: \"\\ebf1\";\n}\n\n/*!@.codicon-layout-panel:before*/.codicon-layout-panel.sc-kol-icon-default:before {\n content: \"\\ebf2\";\n}\n\n/*!@.codicon-layout-sidebar-left:before*/.codicon-layout-sidebar-left.sc-kol-icon-default:before {\n content: \"\\ebf3\";\n}\n\n/*!@.codicon-layout-sidebar-right:before*/.codicon-layout-sidebar-right.sc-kol-icon-default:before {\n content: \"\\ebf4\";\n}\n\n/*!@.codicon-layout-statusbar:before*/.codicon-layout-statusbar.sc-kol-icon-default:before {\n content: \"\\ebf5\";\n}\n\n/*!@.codicon-layout-menubar:before*/.codicon-layout-menubar.sc-kol-icon-default:before {\n content: \"\\ebf6\";\n}\n\n/*!@.codicon-layout-centered:before*/.codicon-layout-centered.sc-kol-icon-default:before {\n content: \"\\ebf7\";\n}\n\n/*!@.codicon-target:before*/.codicon-target.sc-kol-icon-default:before {\n content: \"\\ebf8\";\n}\n\n/*!@.codicon-indent:before*/.codicon-indent.sc-kol-icon-default:before {\n content: \"\\ebf9\";\n}\n\n/*!@.codicon-record-small:before*/.codicon-record-small.sc-kol-icon-default:before {\n content: \"\\ebfa\";\n}\n\n/*!@.codicon-error-small:before*/.codicon-error-small.sc-kol-icon-default:before {\n content: \"\\ebfb\";\n}\n\n/*!@.codicon-arrow-circle-down:before*/.codicon-arrow-circle-down.sc-kol-icon-default:before {\n content: \"\\ebfc\";\n}\n\n/*!@.codicon-arrow-circle-left:before*/.codicon-arrow-circle-left.sc-kol-icon-default:before {\n content: \"\\ebfd\";\n}\n\n/*!@.codicon-arrow-circle-right:before*/.codicon-arrow-circle-right.sc-kol-icon-default:before {\n content: \"\\ebfe\";\n}\n\n/*!@.codicon-arrow-circle-up:before*/.codicon-arrow-circle-up.sc-kol-icon-default:before {\n content: \"\\ebff\";\n}\n\n/*!@.codicon-layout-sidebar-right-off:before*/.codicon-layout-sidebar-right-off.sc-kol-icon-default:before {\n content: \"\\ec00\";\n}\n\n/*!@.codicon-layout-panel-off:before*/.codicon-layout-panel-off.sc-kol-icon-default:before {\n content: \"\\ec01\";\n}\n\n/*!@.codicon-layout-sidebar-left-off:before*/.codicon-layout-sidebar-left-off.sc-kol-icon-default:before {\n content: \"\\ec02\";\n}\n\n/*!@.codicon-blank:before*/.codicon-blank.sc-kol-icon-default:before {\n content: \"\\ec03\";\n}\n\n/*!@.codicon-heart-filled:before*/.codicon-heart-filled.sc-kol-icon-default:before {\n content: \"\\ec04\";\n}\n\n/*!@.codicon-map:before*/.codicon-map.sc-kol-icon-default:before {\n content: \"\\ec05\";\n}\n\n/*!@.codicon-map-filled:before*/.codicon-map-filled.sc-kol-icon-default:before {\n content: \"\\ec06\";\n}\n\n/*!@.codicon-circle-small:before*/.codicon-circle-small.sc-kol-icon-default:before {\n content: \"\\ec07\";\n}\n\n/*!@.codicon-bell-slash:before*/.codicon-bell-slash.sc-kol-icon-default:before {\n content: \"\\ec08\";\n}\n\n/*!@.codicon-bell-slash-dot:before*/.codicon-bell-slash-dot.sc-kol-icon-default:before {\n content: \"\\ec09\";\n}\n\n/*!@.codicon-comment-unresolved:before*/.codicon-comment-unresolved.sc-kol-icon-default:before {\n content: \"\\ec0a\";\n}\n\n/*!@.codicon-git-pull-request-go-to-changes:before*/.codicon-git-pull-request-go-to-changes.sc-kol-icon-default:before {\n content: \"\\ec0b\";\n}\n\n/*!@.codicon-git-pull-request-new-changes:before*/.codicon-git-pull-request-new-changes.sc-kol-icon-default:before {\n content: \"\\ec0c\";\n}\n\n@layer kol-component {\n \n .sc-kol-icon-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n color: inherit;\n display: contents;\n height: 1em;\n line-height: inherit;\n width: 1em;\n }\n .sc-kol-icon-default-h > i {\n height: 1em;\n width: 1em;\n }\n \n .sc-kol-icon-default-h > i,\n .sc-kol-icon-default-h > i:before {\n font-size: inherit !important;\n }\n}";
|
|
7105
|
-
var KolIconDefaultStyle0 = defaultStyleCss$
|
|
7127
|
+
const defaultStyleCss$A = "@font-face {\n font-family: \"codicon\";\n font-display: block;\n src: url(\"./codicon.ttf?0e5b0adf625a37fbcd638d31f0fe72aa\") format(\"truetype\");\n}\n/*!@.codicon[class*=codicon-]*/.codicon[class*=codicon-].sc-kol-icon-default {\n font: normal normal normal 16px/1 codicon;\n display: inline-block;\n text-decoration: none;\n text-rendering: auto;\n text-align: center;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n user-select: none;\n -webkit-user-select: none;\n -ms-user-select: none;\n}\n\n\n@keyframes codicon-spin {\n 100% {\n transform: rotate(360deg);\n }\n}\n/*!@.codicon-sync.codicon-modifier-spin,\n.codicon-loading.codicon-modifier-spin,\n.codicon-gear.codicon-modifier-spin*/.codicon-sync.codicon-modifier-spin.sc-kol-icon-default, .codicon-loading.codicon-modifier-spin.sc-kol-icon-default, .codicon-gear.codicon-modifier-spin.sc-kol-icon-default {\n \n animation: codicon-spin 1.5s steps(30) infinite;\n}\n\n/*!@.codicon-modifier-disabled*/.codicon-modifier-disabled.sc-kol-icon-default {\n opacity: 0.5;\n}\n\n/*!@.codicon-modifier-hidden*/.codicon-modifier-hidden.sc-kol-icon-default {\n opacity: 0;\n}\n\n\n/*!@.codicon-loading*/.codicon-loading.sc-kol-icon-default {\n animation-duration: 1s !important;\n animation-timing-function: cubic-bezier(0.53, 0.21, 0.29, 0.67) !important;\n}\n\n\n/*!@.codicon-add:before*/.codicon-add.sc-kol-icon-default:before {\n content: \"\\ea60\";\n}\n\n/*!@.codicon-plus:before*/.codicon-plus.sc-kol-icon-default:before {\n content: \"\\ea60\";\n}\n\n/*!@.codicon-gist-new:before*/.codicon-gist-new.sc-kol-icon-default:before {\n content: \"\\ea60\";\n}\n\n/*!@.codicon-repo-create:before*/.codicon-repo-create.sc-kol-icon-default:before {\n content: \"\\ea60\";\n}\n\n/*!@.codicon-lightbulb:before*/.codicon-lightbulb.sc-kol-icon-default:before {\n content: \"\\ea61\";\n}\n\n/*!@.codicon-light-bulb:before*/.codicon-light-bulb.sc-kol-icon-default:before {\n content: \"\\ea61\";\n}\n\n/*!@.codicon-repo:before*/.codicon-repo.sc-kol-icon-default:before {\n content: \"\\ea62\";\n}\n\n/*!@.codicon-repo-delete:before*/.codicon-repo-delete.sc-kol-icon-default:before {\n content: \"\\ea62\";\n}\n\n/*!@.codicon-gist-fork:before*/.codicon-gist-fork.sc-kol-icon-default:before {\n content: \"\\ea63\";\n}\n\n/*!@.codicon-repo-forked:before*/.codicon-repo-forked.sc-kol-icon-default:before {\n content: \"\\ea63\";\n}\n\n/*!@.codicon-git-pull-request:before*/.codicon-git-pull-request.sc-kol-icon-default:before {\n content: \"\\ea64\";\n}\n\n/*!@.codicon-git-pull-request-abandoned:before*/.codicon-git-pull-request-abandoned.sc-kol-icon-default:before {\n content: \"\\ea64\";\n}\n\n/*!@.codicon-record-keys:before*/.codicon-record-keys.sc-kol-icon-default:before {\n content: \"\\ea65\";\n}\n\n/*!@.codicon-keyboard:before*/.codicon-keyboard.sc-kol-icon-default:before {\n content: \"\\ea65\";\n}\n\n/*!@.codicon-tag:before*/.codicon-tag.sc-kol-icon-default:before {\n content: \"\\ea66\";\n}\n\n/*!@.codicon-tag-add:before*/.codicon-tag-add.sc-kol-icon-default:before {\n content: \"\\ea66\";\n}\n\n/*!@.codicon-tag-remove:before*/.codicon-tag-remove.sc-kol-icon-default:before {\n content: \"\\ea66\";\n}\n\n/*!@.codicon-person:before*/.codicon-person.sc-kol-icon-default:before {\n content: \"\\ea67\";\n}\n\n/*!@.codicon-person-follow:before*/.codicon-person-follow.sc-kol-icon-default:before {\n content: \"\\ea67\";\n}\n\n/*!@.codicon-person-outline:before*/.codicon-person-outline.sc-kol-icon-default:before {\n content: \"\\ea67\";\n}\n\n/*!@.codicon-person-filled:before*/.codicon-person-filled.sc-kol-icon-default:before {\n content: \"\\ea67\";\n}\n\n/*!@.codicon-git-branch:before*/.codicon-git-branch.sc-kol-icon-default:before {\n content: \"\\ea68\";\n}\n\n/*!@.codicon-git-branch-create:before*/.codicon-git-branch-create.sc-kol-icon-default:before {\n content: \"\\ea68\";\n}\n\n/*!@.codicon-git-branch-delete:before*/.codicon-git-branch-delete.sc-kol-icon-default:before {\n content: \"\\ea68\";\n}\n\n/*!@.codicon-source-control:before*/.codicon-source-control.sc-kol-icon-default:before {\n content: \"\\ea68\";\n}\n\n/*!@.codicon-mirror:before*/.codicon-mirror.sc-kol-icon-default:before {\n content: \"\\ea69\";\n}\n\n/*!@.codicon-mirror-public:before*/.codicon-mirror-public.sc-kol-icon-default:before {\n content: \"\\ea69\";\n}\n\n/*!@.codicon-star:before*/.codicon-star.sc-kol-icon-default:before {\n content: \"\\ea6a\";\n}\n\n/*!@.codicon-star-add:before*/.codicon-star-add.sc-kol-icon-default:before {\n content: \"\\ea6a\";\n}\n\n/*!@.codicon-star-delete:before*/.codicon-star-delete.sc-kol-icon-default:before {\n content: \"\\ea6a\";\n}\n\n/*!@.codicon-star-empty:before*/.codicon-star-empty.sc-kol-icon-default:before {\n content: \"\\ea6a\";\n}\n\n/*!@.codicon-comment:before*/.codicon-comment.sc-kol-icon-default:before {\n content: \"\\ea6b\";\n}\n\n/*!@.codicon-comment-add:before*/.codicon-comment-add.sc-kol-icon-default:before {\n content: \"\\ea6b\";\n}\n\n/*!@.codicon-alert:before*/.codicon-alert.sc-kol-icon-default:before {\n content: \"\\ea6c\";\n}\n\n/*!@.codicon-warning:before*/.codicon-warning.sc-kol-icon-default:before {\n content: \"\\ea6c\";\n}\n\n/*!@.codicon-search:before*/.codicon-search.sc-kol-icon-default:before {\n content: \"\\ea6d\";\n}\n\n/*!@.codicon-search-save:before*/.codicon-search-save.sc-kol-icon-default:before {\n content: \"\\ea6d\";\n}\n\n/*!@.codicon-log-out:before*/.codicon-log-out.sc-kol-icon-default:before {\n content: \"\\ea6e\";\n}\n\n/*!@.codicon-sign-out:before*/.codicon-sign-out.sc-kol-icon-default:before {\n content: \"\\ea6e\";\n}\n\n/*!@.codicon-log-in:before*/.codicon-log-in.sc-kol-icon-default:before {\n content: \"\\ea6f\";\n}\n\n/*!@.codicon-sign-in:before*/.codicon-sign-in.sc-kol-icon-default:before {\n content: \"\\ea6f\";\n}\n\n/*!@.codicon-eye:before*/.codicon-eye.sc-kol-icon-default:before {\n content: \"\\ea70\";\n}\n\n/*!@.codicon-eye-unwatch:before*/.codicon-eye-unwatch.sc-kol-icon-default:before {\n content: \"\\ea70\";\n}\n\n/*!@.codicon-eye-watch:before*/.codicon-eye-watch.sc-kol-icon-default:before {\n content: \"\\ea70\";\n}\n\n/*!@.codicon-circle-filled:before*/.codicon-circle-filled.sc-kol-icon-default:before {\n content: \"\\ea71\";\n}\n\n/*!@.codicon-primitive-dot:before*/.codicon-primitive-dot.sc-kol-icon-default:before {\n content: \"\\ea71\";\n}\n\n/*!@.codicon-close-dirty:before*/.codicon-close-dirty.sc-kol-icon-default:before {\n content: \"\\ea71\";\n}\n\n/*!@.codicon-debug-breakpoint:before*/.codicon-debug-breakpoint.sc-kol-icon-default:before {\n content: \"\\ea71\";\n}\n\n/*!@.codicon-debug-breakpoint-disabled:before*/.codicon-debug-breakpoint-disabled.sc-kol-icon-default:before {\n content: \"\\ea71\";\n}\n\n/*!@.codicon-debug-hint:before*/.codicon-debug-hint.sc-kol-icon-default:before {\n content: \"\\ea71\";\n}\n\n/*!@.codicon-primitive-square:before*/.codicon-primitive-square.sc-kol-icon-default:before {\n content: \"\\ea72\";\n}\n\n/*!@.codicon-edit:before*/.codicon-edit.sc-kol-icon-default:before {\n content: \"\\ea73\";\n}\n\n/*!@.codicon-pencil:before*/.codicon-pencil.sc-kol-icon-default:before {\n content: \"\\ea73\";\n}\n\n/*!@.codicon-info:before*/.codicon-info.sc-kol-icon-default:before {\n content: \"\\ea74\";\n}\n\n/*!@.codicon-issue-opened:before*/.codicon-issue-opened.sc-kol-icon-default:before {\n content: \"\\ea74\";\n}\n\n/*!@.codicon-gist-private:before*/.codicon-gist-private.sc-kol-icon-default:before {\n content: \"\\ea75\";\n}\n\n/*!@.codicon-git-fork-private:before*/.codicon-git-fork-private.sc-kol-icon-default:before {\n content: \"\\ea75\";\n}\n\n/*!@.codicon-lock:before*/.codicon-lock.sc-kol-icon-default:before {\n content: \"\\ea75\";\n}\n\n/*!@.codicon-mirror-private:before*/.codicon-mirror-private.sc-kol-icon-default:before {\n content: \"\\ea75\";\n}\n\n/*!@.codicon-close:before*/.codicon-close.sc-kol-icon-default:before {\n content: \"\\ea76\";\n}\n\n/*!@.codicon-remove-close:before*/.codicon-remove-close.sc-kol-icon-default:before {\n content: \"\\ea76\";\n}\n\n/*!@.codicon-x:before*/.codicon-x.sc-kol-icon-default:before {\n content: \"\\ea76\";\n}\n\n/*!@.codicon-repo-sync:before*/.codicon-repo-sync.sc-kol-icon-default:before {\n content: \"\\ea77\";\n}\n\n/*!@.codicon-sync:before*/.codicon-sync.sc-kol-icon-default:before {\n content: \"\\ea77\";\n}\n\n/*!@.codicon-clone:before*/.codicon-clone.sc-kol-icon-default:before {\n content: \"\\ea78\";\n}\n\n/*!@.codicon-desktop-download:before*/.codicon-desktop-download.sc-kol-icon-default:before {\n content: \"\\ea78\";\n}\n\n/*!@.codicon-beaker:before*/.codicon-beaker.sc-kol-icon-default:before {\n content: \"\\ea79\";\n}\n\n/*!@.codicon-microscope:before*/.codicon-microscope.sc-kol-icon-default:before {\n content: \"\\ea79\";\n}\n\n/*!@.codicon-vm:before*/.codicon-vm.sc-kol-icon-default:before {\n content: \"\\ea7a\";\n}\n\n/*!@.codicon-device-desktop:before*/.codicon-device-desktop.sc-kol-icon-default:before {\n content: \"\\ea7a\";\n}\n\n/*!@.codicon-file:before*/.codicon-file.sc-kol-icon-default:before {\n content: \"\\ea7b\";\n}\n\n/*!@.codicon-file-text:before*/.codicon-file-text.sc-kol-icon-default:before {\n content: \"\\ea7b\";\n}\n\n/*!@.codicon-more:before*/.codicon-more.sc-kol-icon-default:before {\n content: \"\\ea7c\";\n}\n\n/*!@.codicon-ellipsis:before*/.codicon-ellipsis.sc-kol-icon-default:before {\n content: \"\\ea7c\";\n}\n\n/*!@.codicon-kebab-horizontal:before*/.codicon-kebab-horizontal.sc-kol-icon-default:before {\n content: \"\\ea7c\";\n}\n\n/*!@.codicon-mail-reply:before*/.codicon-mail-reply.sc-kol-icon-default:before {\n content: \"\\ea7d\";\n}\n\n/*!@.codicon-reply:before*/.codicon-reply.sc-kol-icon-default:before {\n content: \"\\ea7d\";\n}\n\n/*!@.codicon-organization:before*/.codicon-organization.sc-kol-icon-default:before {\n content: \"\\ea7e\";\n}\n\n/*!@.codicon-organization-filled:before*/.codicon-organization-filled.sc-kol-icon-default:before {\n content: \"\\ea7e\";\n}\n\n/*!@.codicon-organization-outline:before*/.codicon-organization-outline.sc-kol-icon-default:before {\n content: \"\\ea7e\";\n}\n\n/*!@.codicon-new-file:before*/.codicon-new-file.sc-kol-icon-default:before {\n content: \"\\ea7f\";\n}\n\n/*!@.codicon-file-add:before*/.codicon-file-add.sc-kol-icon-default:before {\n content: \"\\ea7f\";\n}\n\n/*!@.codicon-new-folder:before*/.codicon-new-folder.sc-kol-icon-default:before {\n content: \"\\ea80\";\n}\n\n/*!@.codicon-file-directory-create:before*/.codicon-file-directory-create.sc-kol-icon-default:before {\n content: \"\\ea80\";\n}\n\n/*!@.codicon-trash:before*/.codicon-trash.sc-kol-icon-default:before {\n content: \"\\ea81\";\n}\n\n/*!@.codicon-trashcan:before*/.codicon-trashcan.sc-kol-icon-default:before {\n content: \"\\ea81\";\n}\n\n/*!@.codicon-history:before*/.codicon-history.sc-kol-icon-default:before {\n content: \"\\ea82\";\n}\n\n/*!@.codicon-clock:before*/.codicon-clock.sc-kol-icon-default:before {\n content: \"\\ea82\";\n}\n\n/*!@.codicon-folder:before*/.codicon-folder.sc-kol-icon-default:before {\n content: \"\\ea83\";\n}\n\n/*!@.codicon-file-directory:before*/.codicon-file-directory.sc-kol-icon-default:before {\n content: \"\\ea83\";\n}\n\n/*!@.codicon-symbol-folder:before*/.codicon-symbol-folder.sc-kol-icon-default:before {\n content: \"\\ea83\";\n}\n\n/*!@.codicon-logo-github:before*/.codicon-logo-github.sc-kol-icon-default:before {\n content: \"\\ea84\";\n}\n\n/*!@.codicon-mark-github:before*/.codicon-mark-github.sc-kol-icon-default:before {\n content: \"\\ea84\";\n}\n\n/*!@.codicon-github:before*/.codicon-github.sc-kol-icon-default:before {\n content: \"\\ea84\";\n}\n\n/*!@.codicon-terminal:before*/.codicon-terminal.sc-kol-icon-default:before {\n content: \"\\ea85\";\n}\n\n/*!@.codicon-console:before*/.codicon-console.sc-kol-icon-default:before {\n content: \"\\ea85\";\n}\n\n/*!@.codicon-repl:before*/.codicon-repl.sc-kol-icon-default:before {\n content: \"\\ea85\";\n}\n\n/*!@.codicon-zap:before*/.codicon-zap.sc-kol-icon-default:before {\n content: \"\\ea86\";\n}\n\n/*!@.codicon-symbol-event:before*/.codicon-symbol-event.sc-kol-icon-default:before {\n content: \"\\ea86\";\n}\n\n/*!@.codicon-error:before*/.codicon-error.sc-kol-icon-default:before {\n content: \"\\ea87\";\n}\n\n/*!@.codicon-stop:before*/.codicon-stop.sc-kol-icon-default:before {\n content: \"\\ea87\";\n}\n\n/*!@.codicon-variable:before*/.codicon-variable.sc-kol-icon-default:before {\n content: \"\\ea88\";\n}\n\n/*!@.codicon-symbol-variable:before*/.codicon-symbol-variable.sc-kol-icon-default:before {\n content: \"\\ea88\";\n}\n\n/*!@.codicon-array:before*/.codicon-array.sc-kol-icon-default:before {\n content: \"\\ea8a\";\n}\n\n/*!@.codicon-symbol-array:before*/.codicon-symbol-array.sc-kol-icon-default:before {\n content: \"\\ea8a\";\n}\n\n/*!@.codicon-symbol-module:before*/.codicon-symbol-module.sc-kol-icon-default:before {\n content: \"\\ea8b\";\n}\n\n/*!@.codicon-symbol-package:before*/.codicon-symbol-package.sc-kol-icon-default:before {\n content: \"\\ea8b\";\n}\n\n/*!@.codicon-symbol-namespace:before*/.codicon-symbol-namespace.sc-kol-icon-default:before {\n content: \"\\ea8b\";\n}\n\n/*!@.codicon-symbol-object:before*/.codicon-symbol-object.sc-kol-icon-default:before {\n content: \"\\ea8b\";\n}\n\n/*!@.codicon-symbol-method:before*/.codicon-symbol-method.sc-kol-icon-default:before {\n content: \"\\ea8c\";\n}\n\n/*!@.codicon-symbol-function:before*/.codicon-symbol-function.sc-kol-icon-default:before {\n content: \"\\ea8c\";\n}\n\n/*!@.codicon-symbol-constructor:before*/.codicon-symbol-constructor.sc-kol-icon-default:before {\n content: \"\\ea8c\";\n}\n\n/*!@.codicon-symbol-boolean:before*/.codicon-symbol-boolean.sc-kol-icon-default:before {\n content: \"\\ea8f\";\n}\n\n/*!@.codicon-symbol-null:before*/.codicon-symbol-null.sc-kol-icon-default:before {\n content: \"\\ea8f\";\n}\n\n/*!@.codicon-symbol-numeric:before*/.codicon-symbol-numeric.sc-kol-icon-default:before {\n content: \"\\ea90\";\n}\n\n/*!@.codicon-symbol-number:before*/.codicon-symbol-number.sc-kol-icon-default:before {\n content: \"\\ea90\";\n}\n\n/*!@.codicon-symbol-structure:before*/.codicon-symbol-structure.sc-kol-icon-default:before {\n content: \"\\ea91\";\n}\n\n/*!@.codicon-symbol-struct:before*/.codicon-symbol-struct.sc-kol-icon-default:before {\n content: \"\\ea91\";\n}\n\n/*!@.codicon-symbol-parameter:before*/.codicon-symbol-parameter.sc-kol-icon-default:before {\n content: \"\\ea92\";\n}\n\n/*!@.codicon-symbol-type-parameter:before*/.codicon-symbol-type-parameter.sc-kol-icon-default:before {\n content: \"\\ea92\";\n}\n\n/*!@.codicon-symbol-key:before*/.codicon-symbol-key.sc-kol-icon-default:before {\n content: \"\\ea93\";\n}\n\n/*!@.codicon-symbol-text:before*/.codicon-symbol-text.sc-kol-icon-default:before {\n content: \"\\ea93\";\n}\n\n/*!@.codicon-symbol-reference:before*/.codicon-symbol-reference.sc-kol-icon-default:before {\n content: \"\\ea94\";\n}\n\n/*!@.codicon-go-to-file:before*/.codicon-go-to-file.sc-kol-icon-default:before {\n content: \"\\ea94\";\n}\n\n/*!@.codicon-symbol-enum:before*/.codicon-symbol-enum.sc-kol-icon-default:before {\n content: \"\\ea95\";\n}\n\n/*!@.codicon-symbol-value:before*/.codicon-symbol-value.sc-kol-icon-default:before {\n content: \"\\ea95\";\n}\n\n/*!@.codicon-symbol-ruler:before*/.codicon-symbol-ruler.sc-kol-icon-default:before {\n content: \"\\ea96\";\n}\n\n/*!@.codicon-symbol-unit:before*/.codicon-symbol-unit.sc-kol-icon-default:before {\n content: \"\\ea96\";\n}\n\n/*!@.codicon-activate-breakpoints:before*/.codicon-activate-breakpoints.sc-kol-icon-default:before {\n content: \"\\ea97\";\n}\n\n/*!@.codicon-archive:before*/.codicon-archive.sc-kol-icon-default:before {\n content: \"\\ea98\";\n}\n\n/*!@.codicon-arrow-both:before*/.codicon-arrow-both.sc-kol-icon-default:before {\n content: \"\\ea99\";\n}\n\n/*!@.codicon-arrow-down:before*/.codicon-arrow-down.sc-kol-icon-default:before {\n content: \"\\ea9a\";\n}\n\n/*!@.codicon-arrow-left:before*/.codicon-arrow-left.sc-kol-icon-default:before {\n content: \"\\ea9b\";\n}\n\n/*!@.codicon-arrow-right:before*/.codicon-arrow-right.sc-kol-icon-default:before {\n content: \"\\ea9c\";\n}\n\n/*!@.codicon-arrow-small-down:before*/.codicon-arrow-small-down.sc-kol-icon-default:before {\n content: \"\\ea9d\";\n}\n\n/*!@.codicon-arrow-small-left:before*/.codicon-arrow-small-left.sc-kol-icon-default:before {\n content: \"\\ea9e\";\n}\n\n/*!@.codicon-arrow-small-right:before*/.codicon-arrow-small-right.sc-kol-icon-default:before {\n content: \"\\ea9f\";\n}\n\n/*!@.codicon-arrow-small-up:before*/.codicon-arrow-small-up.sc-kol-icon-default:before {\n content: \"\\eaa0\";\n}\n\n/*!@.codicon-arrow-up:before*/.codicon-arrow-up.sc-kol-icon-default:before {\n content: \"\\eaa1\";\n}\n\n/*!@.codicon-bell:before*/.codicon-bell.sc-kol-icon-default:before {\n content: \"\\eaa2\";\n}\n\n/*!@.codicon-bold:before*/.codicon-bold.sc-kol-icon-default:before {\n content: \"\\eaa3\";\n}\n\n/*!@.codicon-book:before*/.codicon-book.sc-kol-icon-default:before {\n content: \"\\eaa4\";\n}\n\n/*!@.codicon-bookmark:before*/.codicon-bookmark.sc-kol-icon-default:before {\n content: \"\\eaa5\";\n}\n\n/*!@.codicon-debug-breakpoint-conditional-unverified:before*/.codicon-debug-breakpoint-conditional-unverified.sc-kol-icon-default:before {\n content: \"\\eaa6\";\n}\n\n/*!@.codicon-debug-breakpoint-conditional:before*/.codicon-debug-breakpoint-conditional.sc-kol-icon-default:before {\n content: \"\\eaa7\";\n}\n\n/*!@.codicon-debug-breakpoint-conditional-disabled:before*/.codicon-debug-breakpoint-conditional-disabled.sc-kol-icon-default:before {\n content: \"\\eaa7\";\n}\n\n/*!@.codicon-debug-breakpoint-data-unverified:before*/.codicon-debug-breakpoint-data-unverified.sc-kol-icon-default:before {\n content: \"\\eaa8\";\n}\n\n/*!@.codicon-debug-breakpoint-data:before*/.codicon-debug-breakpoint-data.sc-kol-icon-default:before {\n content: \"\\eaa9\";\n}\n\n/*!@.codicon-debug-breakpoint-data-disabled:before*/.codicon-debug-breakpoint-data-disabled.sc-kol-icon-default:before {\n content: \"\\eaa9\";\n}\n\n/*!@.codicon-debug-breakpoint-log-unverified:before*/.codicon-debug-breakpoint-log-unverified.sc-kol-icon-default:before {\n content: \"\\eaaa\";\n}\n\n/*!@.codicon-debug-breakpoint-log:before*/.codicon-debug-breakpoint-log.sc-kol-icon-default:before {\n content: \"\\eaab\";\n}\n\n/*!@.codicon-debug-breakpoint-log-disabled:before*/.codicon-debug-breakpoint-log-disabled.sc-kol-icon-default:before {\n content: \"\\eaab\";\n}\n\n/*!@.codicon-briefcase:before*/.codicon-briefcase.sc-kol-icon-default:before {\n content: \"\\eaac\";\n}\n\n/*!@.codicon-broadcast:before*/.codicon-broadcast.sc-kol-icon-default:before {\n content: \"\\eaad\";\n}\n\n/*!@.codicon-browser:before*/.codicon-browser.sc-kol-icon-default:before {\n content: \"\\eaae\";\n}\n\n/*!@.codicon-bug:before*/.codicon-bug.sc-kol-icon-default:before {\n content: \"\\eaaf\";\n}\n\n/*!@.codicon-calendar:before*/.codicon-calendar.sc-kol-icon-default:before {\n content: \"\\eab0\";\n}\n\n/*!@.codicon-case-sensitive:before*/.codicon-case-sensitive.sc-kol-icon-default:before {\n content: \"\\eab1\";\n}\n\n/*!@.codicon-check:before*/.codicon-check.sc-kol-icon-default:before {\n content: \"\\eab2\";\n}\n\n/*!@.codicon-checklist:before*/.codicon-checklist.sc-kol-icon-default:before {\n content: \"\\eab3\";\n}\n\n/*!@.codicon-chevron-down:before*/.codicon-chevron-down.sc-kol-icon-default:before {\n content: \"\\eab4\";\n}\n\n/*!@.codicon-chevron-left:before*/.codicon-chevron-left.sc-kol-icon-default:before {\n content: \"\\eab5\";\n}\n\n/*!@.codicon-chevron-right:before*/.codicon-chevron-right.sc-kol-icon-default:before {\n content: \"\\eab6\";\n}\n\n/*!@.codicon-chevron-up:before*/.codicon-chevron-up.sc-kol-icon-default:before {\n content: \"\\eab7\";\n}\n\n/*!@.codicon-chrome-close:before*/.codicon-chrome-close.sc-kol-icon-default:before {\n content: \"\\eab8\";\n}\n\n/*!@.codicon-chrome-maximize:before*/.codicon-chrome-maximize.sc-kol-icon-default:before {\n content: \"\\eab9\";\n}\n\n/*!@.codicon-chrome-minimize:before*/.codicon-chrome-minimize.sc-kol-icon-default:before {\n content: \"\\eaba\";\n}\n\n/*!@.codicon-chrome-restore:before*/.codicon-chrome-restore.sc-kol-icon-default:before {\n content: \"\\eabb\";\n}\n\n/*!@.codicon-circle-outline:before*/.codicon-circle-outline.sc-kol-icon-default:before {\n content: \"\\eabc\";\n}\n\n/*!@.codicon-debug-breakpoint-unverified:before*/.codicon-debug-breakpoint-unverified.sc-kol-icon-default:before {\n content: \"\\eabc\";\n}\n\n/*!@.codicon-circle-slash:before*/.codicon-circle-slash.sc-kol-icon-default:before {\n content: \"\\eabd\";\n}\n\n/*!@.codicon-circuit-board:before*/.codicon-circuit-board.sc-kol-icon-default:before {\n content: \"\\eabe\";\n}\n\n/*!@.codicon-clear-all:before*/.codicon-clear-all.sc-kol-icon-default:before {\n content: \"\\eabf\";\n}\n\n/*!@.codicon-clippy:before*/.codicon-clippy.sc-kol-icon-default:before {\n content: \"\\eac0\";\n}\n\n/*!@.codicon-close-all:before*/.codicon-close-all.sc-kol-icon-default:before {\n content: \"\\eac1\";\n}\n\n/*!@.codicon-cloud-download:before*/.codicon-cloud-download.sc-kol-icon-default:before {\n content: \"\\eac2\";\n}\n\n/*!@.codicon-cloud-upload:before*/.codicon-cloud-upload.sc-kol-icon-default:before {\n content: \"\\eac3\";\n}\n\n/*!@.codicon-code:before*/.codicon-code.sc-kol-icon-default:before {\n content: \"\\eac4\";\n}\n\n/*!@.codicon-collapse-all:before*/.codicon-collapse-all.sc-kol-icon-default:before {\n content: \"\\eac5\";\n}\n\n/*!@.codicon-color-mode:before*/.codicon-color-mode.sc-kol-icon-default:before {\n content: \"\\eac6\";\n}\n\n/*!@.codicon-comment-discussion:before*/.codicon-comment-discussion.sc-kol-icon-default:before {\n content: \"\\eac7\";\n}\n\n/*!@.codicon-credit-card:before*/.codicon-credit-card.sc-kol-icon-default:before {\n content: \"\\eac9\";\n}\n\n/*!@.codicon-dash:before*/.codicon-dash.sc-kol-icon-default:before {\n content: \"\\eacc\";\n}\n\n/*!@.codicon-dashboard:before*/.codicon-dashboard.sc-kol-icon-default:before {\n content: \"\\eacd\";\n}\n\n/*!@.codicon-database:before*/.codicon-database.sc-kol-icon-default:before {\n content: \"\\eace\";\n}\n\n/*!@.codicon-debug-continue:before*/.codicon-debug-continue.sc-kol-icon-default:before {\n content: \"\\eacf\";\n}\n\n/*!@.codicon-debug-disconnect:before*/.codicon-debug-disconnect.sc-kol-icon-default:before {\n content: \"\\ead0\";\n}\n\n/*!@.codicon-debug-pause:before*/.codicon-debug-pause.sc-kol-icon-default:before {\n content: \"\\ead1\";\n}\n\n/*!@.codicon-debug-restart:before*/.codicon-debug-restart.sc-kol-icon-default:before {\n content: \"\\ead2\";\n}\n\n/*!@.codicon-debug-start:before*/.codicon-debug-start.sc-kol-icon-default:before {\n content: \"\\ead3\";\n}\n\n/*!@.codicon-debug-step-into:before*/.codicon-debug-step-into.sc-kol-icon-default:before {\n content: \"\\ead4\";\n}\n\n/*!@.codicon-debug-step-out:before*/.codicon-debug-step-out.sc-kol-icon-default:before {\n content: \"\\ead5\";\n}\n\n/*!@.codicon-debug-step-over:before*/.codicon-debug-step-over.sc-kol-icon-default:before {\n content: \"\\ead6\";\n}\n\n/*!@.codicon-debug-stop:before*/.codicon-debug-stop.sc-kol-icon-default:before {\n content: \"\\ead7\";\n}\n\n/*!@.codicon-debug:before*/.codicon-debug.sc-kol-icon-default:before {\n content: \"\\ead8\";\n}\n\n/*!@.codicon-device-camera-video:before*/.codicon-device-camera-video.sc-kol-icon-default:before {\n content: \"\\ead9\";\n}\n\n/*!@.codicon-device-camera:before*/.codicon-device-camera.sc-kol-icon-default:before {\n content: \"\\eada\";\n}\n\n/*!@.codicon-device-mobile:before*/.codicon-device-mobile.sc-kol-icon-default:before {\n content: \"\\eadb\";\n}\n\n/*!@.codicon-diff-added:before*/.codicon-diff-added.sc-kol-icon-default:before {\n content: \"\\eadc\";\n}\n\n/*!@.codicon-diff-ignored:before*/.codicon-diff-ignored.sc-kol-icon-default:before {\n content: \"\\eadd\";\n}\n\n/*!@.codicon-diff-modified:before*/.codicon-diff-modified.sc-kol-icon-default:before {\n content: \"\\eade\";\n}\n\n/*!@.codicon-diff-removed:before*/.codicon-diff-removed.sc-kol-icon-default:before {\n content: \"\\eadf\";\n}\n\n/*!@.codicon-diff-renamed:before*/.codicon-diff-renamed.sc-kol-icon-default:before {\n content: \"\\eae0\";\n}\n\n/*!@.codicon-diff:before*/.codicon-diff.sc-kol-icon-default:before {\n content: \"\\eae1\";\n}\n\n/*!@.codicon-discard:before*/.codicon-discard.sc-kol-icon-default:before {\n content: \"\\eae2\";\n}\n\n/*!@.codicon-editor-layout:before*/.codicon-editor-layout.sc-kol-icon-default:before {\n content: \"\\eae3\";\n}\n\n/*!@.codicon-empty-window:before*/.codicon-empty-window.sc-kol-icon-default:before {\n content: \"\\eae4\";\n}\n\n/*!@.codicon-exclude:before*/.codicon-exclude.sc-kol-icon-default:before {\n content: \"\\eae5\";\n}\n\n/*!@.codicon-extensions:before*/.codicon-extensions.sc-kol-icon-default:before {\n content: \"\\eae6\";\n}\n\n/*!@.codicon-eye-closed:before*/.codicon-eye-closed.sc-kol-icon-default:before {\n content: \"\\eae7\";\n}\n\n/*!@.codicon-file-binary:before*/.codicon-file-binary.sc-kol-icon-default:before {\n content: \"\\eae8\";\n}\n\n/*!@.codicon-file-code:before*/.codicon-file-code.sc-kol-icon-default:before {\n content: \"\\eae9\";\n}\n\n/*!@.codicon-file-media:before*/.codicon-file-media.sc-kol-icon-default:before {\n content: \"\\eaea\";\n}\n\n/*!@.codicon-file-pdf:before*/.codicon-file-pdf.sc-kol-icon-default:before {\n content: \"\\eaeb\";\n}\n\n/*!@.codicon-file-submodule:before*/.codicon-file-submodule.sc-kol-icon-default:before {\n content: \"\\eaec\";\n}\n\n/*!@.codicon-file-symlink-directory:before*/.codicon-file-symlink-directory.sc-kol-icon-default:before {\n content: \"\\eaed\";\n}\n\n/*!@.codicon-file-symlink-file:before*/.codicon-file-symlink-file.sc-kol-icon-default:before {\n content: \"\\eaee\";\n}\n\n/*!@.codicon-file-zip:before*/.codicon-file-zip.sc-kol-icon-default:before {\n content: \"\\eaef\";\n}\n\n/*!@.codicon-files:before*/.codicon-files.sc-kol-icon-default:before {\n content: \"\\eaf0\";\n}\n\n/*!@.codicon-filter:before*/.codicon-filter.sc-kol-icon-default:before {\n content: \"\\eaf1\";\n}\n\n/*!@.codicon-flame:before*/.codicon-flame.sc-kol-icon-default:before {\n content: \"\\eaf2\";\n}\n\n/*!@.codicon-fold-down:before*/.codicon-fold-down.sc-kol-icon-default:before {\n content: \"\\eaf3\";\n}\n\n/*!@.codicon-fold-up:before*/.codicon-fold-up.sc-kol-icon-default:before {\n content: \"\\eaf4\";\n}\n\n/*!@.codicon-fold:before*/.codicon-fold.sc-kol-icon-default:before {\n content: \"\\eaf5\";\n}\n\n/*!@.codicon-folder-active:before*/.codicon-folder-active.sc-kol-icon-default:before {\n content: \"\\eaf6\";\n}\n\n/*!@.codicon-folder-opened:before*/.codicon-folder-opened.sc-kol-icon-default:before {\n content: \"\\eaf7\";\n}\n\n/*!@.codicon-gear:before*/.codicon-gear.sc-kol-icon-default:before {\n content: \"\\eaf8\";\n}\n\n/*!@.codicon-gift:before*/.codicon-gift.sc-kol-icon-default:before {\n content: \"\\eaf9\";\n}\n\n/*!@.codicon-gist-secret:before*/.codicon-gist-secret.sc-kol-icon-default:before {\n content: \"\\eafa\";\n}\n\n/*!@.codicon-gist:before*/.codicon-gist.sc-kol-icon-default:before {\n content: \"\\eafb\";\n}\n\n/*!@.codicon-git-commit:before*/.codicon-git-commit.sc-kol-icon-default:before {\n content: \"\\eafc\";\n}\n\n/*!@.codicon-git-compare:before*/.codicon-git-compare.sc-kol-icon-default:before {\n content: \"\\eafd\";\n}\n\n/*!@.codicon-compare-changes:before*/.codicon-compare-changes.sc-kol-icon-default:before {\n content: \"\\eafd\";\n}\n\n/*!@.codicon-git-merge:before*/.codicon-git-merge.sc-kol-icon-default:before {\n content: \"\\eafe\";\n}\n\n/*!@.codicon-github-action:before*/.codicon-github-action.sc-kol-icon-default:before {\n content: \"\\eaff\";\n}\n\n/*!@.codicon-github-alt:before*/.codicon-github-alt.sc-kol-icon-default:before {\n content: \"\\eb00\";\n}\n\n/*!@.codicon-globe:before*/.codicon-globe.sc-kol-icon-default:before {\n content: \"\\eb01\";\n}\n\n/*!@.codicon-grabber:before*/.codicon-grabber.sc-kol-icon-default:before {\n content: \"\\eb02\";\n}\n\n/*!@.codicon-graph:before*/.codicon-graph.sc-kol-icon-default:before {\n content: \"\\eb03\";\n}\n\n/*!@.codicon-gripper:before*/.codicon-gripper.sc-kol-icon-default:before {\n content: \"\\eb04\";\n}\n\n/*!@.codicon-heart:before*/.codicon-heart.sc-kol-icon-default:before {\n content: \"\\eb05\";\n}\n\n/*!@.codicon-home:before*/.codicon-home.sc-kol-icon-default:before {\n content: \"\\eb06\";\n}\n\n/*!@.codicon-horizontal-rule:before*/.codicon-horizontal-rule.sc-kol-icon-default:before {\n content: \"\\eb07\";\n}\n\n/*!@.codicon-hubot:before*/.codicon-hubot.sc-kol-icon-default:before {\n content: \"\\eb08\";\n}\n\n/*!@.codicon-inbox:before*/.codicon-inbox.sc-kol-icon-default:before {\n content: \"\\eb09\";\n}\n\n/*!@.codicon-issue-reopened:before*/.codicon-issue-reopened.sc-kol-icon-default:before {\n content: \"\\eb0b\";\n}\n\n/*!@.codicon-issues:before*/.codicon-issues.sc-kol-icon-default:before {\n content: \"\\eb0c\";\n}\n\n/*!@.codicon-italic:before*/.codicon-italic.sc-kol-icon-default:before {\n content: \"\\eb0d\";\n}\n\n/*!@.codicon-jersey:before*/.codicon-jersey.sc-kol-icon-default:before {\n content: \"\\eb0e\";\n}\n\n/*!@.codicon-json:before*/.codicon-json.sc-kol-icon-default:before {\n content: \"\\eb0f\";\n}\n\n/*!@.codicon-kebab-vertical:before*/.codicon-kebab-vertical.sc-kol-icon-default:before {\n content: \"\\eb10\";\n}\n\n/*!@.codicon-key:before*/.codicon-key.sc-kol-icon-default:before {\n content: \"\\eb11\";\n}\n\n/*!@.codicon-law:before*/.codicon-law.sc-kol-icon-default:before {\n content: \"\\eb12\";\n}\n\n/*!@.codicon-lightbulb-autofix:before*/.codicon-lightbulb-autofix.sc-kol-icon-default:before {\n content: \"\\eb13\";\n}\n\n/*!@.codicon-link-external:before*/.codicon-link-external.sc-kol-icon-default:before {\n content: \"\\eb14\";\n}\n\n/*!@.codicon-link:before*/.codicon-link.sc-kol-icon-default:before {\n content: \"\\eb15\";\n}\n\n/*!@.codicon-list-ordered:before*/.codicon-list-ordered.sc-kol-icon-default:before {\n content: \"\\eb16\";\n}\n\n/*!@.codicon-list-unordered:before*/.codicon-list-unordered.sc-kol-icon-default:before {\n content: \"\\eb17\";\n}\n\n/*!@.codicon-live-share:before*/.codicon-live-share.sc-kol-icon-default:before {\n content: \"\\eb18\";\n}\n\n/*!@.codicon-loading:before*/.codicon-loading.sc-kol-icon-default:before {\n content: \"\\eb19\";\n}\n\n/*!@.codicon-location:before*/.codicon-location.sc-kol-icon-default:before {\n content: \"\\eb1a\";\n}\n\n/*!@.codicon-mail-read:before*/.codicon-mail-read.sc-kol-icon-default:before {\n content: \"\\eb1b\";\n}\n\n/*!@.codicon-mail:before*/.codicon-mail.sc-kol-icon-default:before {\n content: \"\\eb1c\";\n}\n\n/*!@.codicon-markdown:before*/.codicon-markdown.sc-kol-icon-default:before {\n content: \"\\eb1d\";\n}\n\n/*!@.codicon-megaphone:before*/.codicon-megaphone.sc-kol-icon-default:before {\n content: \"\\eb1e\";\n}\n\n/*!@.codicon-mention:before*/.codicon-mention.sc-kol-icon-default:before {\n content: \"\\eb1f\";\n}\n\n/*!@.codicon-milestone:before*/.codicon-milestone.sc-kol-icon-default:before {\n content: \"\\eb20\";\n}\n\n/*!@.codicon-mortar-board:before*/.codicon-mortar-board.sc-kol-icon-default:before {\n content: \"\\eb21\";\n}\n\n/*!@.codicon-move:before*/.codicon-move.sc-kol-icon-default:before {\n content: \"\\eb22\";\n}\n\n/*!@.codicon-multiple-windows:before*/.codicon-multiple-windows.sc-kol-icon-default:before {\n content: \"\\eb23\";\n}\n\n/*!@.codicon-mute:before*/.codicon-mute.sc-kol-icon-default:before {\n content: \"\\eb24\";\n}\n\n/*!@.codicon-no-newline:before*/.codicon-no-newline.sc-kol-icon-default:before {\n content: \"\\eb25\";\n}\n\n/*!@.codicon-note:before*/.codicon-note.sc-kol-icon-default:before {\n content: \"\\eb26\";\n}\n\n/*!@.codicon-octoface:before*/.codicon-octoface.sc-kol-icon-default:before {\n content: \"\\eb27\";\n}\n\n/*!@.codicon-open-preview:before*/.codicon-open-preview.sc-kol-icon-default:before {\n content: \"\\eb28\";\n}\n\n/*!@.codicon-package:before*/.codicon-package.sc-kol-icon-default:before {\n content: \"\\eb29\";\n}\n\n/*!@.codicon-paintcan:before*/.codicon-paintcan.sc-kol-icon-default:before {\n content: \"\\eb2a\";\n}\n\n/*!@.codicon-pin:before*/.codicon-pin.sc-kol-icon-default:before {\n content: \"\\eb2b\";\n}\n\n/*!@.codicon-play:before*/.codicon-play.sc-kol-icon-default:before {\n content: \"\\eb2c\";\n}\n\n/*!@.codicon-run:before*/.codicon-run.sc-kol-icon-default:before {\n content: \"\\eb2c\";\n}\n\n/*!@.codicon-plug:before*/.codicon-plug.sc-kol-icon-default:before {\n content: \"\\eb2d\";\n}\n\n/*!@.codicon-preserve-case:before*/.codicon-preserve-case.sc-kol-icon-default:before {\n content: \"\\eb2e\";\n}\n\n/*!@.codicon-preview:before*/.codicon-preview.sc-kol-icon-default:before {\n content: \"\\eb2f\";\n}\n\n/*!@.codicon-project:before*/.codicon-project.sc-kol-icon-default:before {\n content: \"\\eb30\";\n}\n\n/*!@.codicon-pulse:before*/.codicon-pulse.sc-kol-icon-default:before {\n content: \"\\eb31\";\n}\n\n/*!@.codicon-question:before*/.codicon-question.sc-kol-icon-default:before {\n content: \"\\eb32\";\n}\n\n/*!@.codicon-quote:before*/.codicon-quote.sc-kol-icon-default:before {\n content: \"\\eb33\";\n}\n\n/*!@.codicon-radio-tower:before*/.codicon-radio-tower.sc-kol-icon-default:before {\n content: \"\\eb34\";\n}\n\n/*!@.codicon-reactions:before*/.codicon-reactions.sc-kol-icon-default:before {\n content: \"\\eb35\";\n}\n\n/*!@.codicon-references:before*/.codicon-references.sc-kol-icon-default:before {\n content: \"\\eb36\";\n}\n\n/*!@.codicon-refresh:before*/.codicon-refresh.sc-kol-icon-default:before {\n content: \"\\eb37\";\n}\n\n/*!@.codicon-regex:before*/.codicon-regex.sc-kol-icon-default:before {\n content: \"\\eb38\";\n}\n\n/*!@.codicon-remote-explorer:before*/.codicon-remote-explorer.sc-kol-icon-default:before {\n content: \"\\eb39\";\n}\n\n/*!@.codicon-remote:before*/.codicon-remote.sc-kol-icon-default:before {\n content: \"\\eb3a\";\n}\n\n/*!@.codicon-remove:before*/.codicon-remove.sc-kol-icon-default:before {\n content: \"\\eb3b\";\n}\n\n/*!@.codicon-replace-all:before*/.codicon-replace-all.sc-kol-icon-default:before {\n content: \"\\eb3c\";\n}\n\n/*!@.codicon-replace:before*/.codicon-replace.sc-kol-icon-default:before {\n content: \"\\eb3d\";\n}\n\n/*!@.codicon-repo-clone:before*/.codicon-repo-clone.sc-kol-icon-default:before {\n content: \"\\eb3e\";\n}\n\n/*!@.codicon-repo-force-push:before*/.codicon-repo-force-push.sc-kol-icon-default:before {\n content: \"\\eb3f\";\n}\n\n/*!@.codicon-repo-pull:before*/.codicon-repo-pull.sc-kol-icon-default:before {\n content: \"\\eb40\";\n}\n\n/*!@.codicon-repo-push:before*/.codicon-repo-push.sc-kol-icon-default:before {\n content: \"\\eb41\";\n}\n\n/*!@.codicon-report:before*/.codicon-report.sc-kol-icon-default:before {\n content: \"\\eb42\";\n}\n\n/*!@.codicon-request-changes:before*/.codicon-request-changes.sc-kol-icon-default:before {\n content: \"\\eb43\";\n}\n\n/*!@.codicon-rocket:before*/.codicon-rocket.sc-kol-icon-default:before {\n content: \"\\eb44\";\n}\n\n/*!@.codicon-root-folder-opened:before*/.codicon-root-folder-opened.sc-kol-icon-default:before {\n content: \"\\eb45\";\n}\n\n/*!@.codicon-root-folder:before*/.codicon-root-folder.sc-kol-icon-default:before {\n content: \"\\eb46\";\n}\n\n/*!@.codicon-rss:before*/.codicon-rss.sc-kol-icon-default:before {\n content: \"\\eb47\";\n}\n\n/*!@.codicon-ruby:before*/.codicon-ruby.sc-kol-icon-default:before {\n content: \"\\eb48\";\n}\n\n/*!@.codicon-save-all:before*/.codicon-save-all.sc-kol-icon-default:before {\n content: \"\\eb49\";\n}\n\n/*!@.codicon-save-as:before*/.codicon-save-as.sc-kol-icon-default:before {\n content: \"\\eb4a\";\n}\n\n/*!@.codicon-save:before*/.codicon-save.sc-kol-icon-default:before {\n content: \"\\eb4b\";\n}\n\n/*!@.codicon-screen-full:before*/.codicon-screen-full.sc-kol-icon-default:before {\n content: \"\\eb4c\";\n}\n\n/*!@.codicon-screen-normal:before*/.codicon-screen-normal.sc-kol-icon-default:before {\n content: \"\\eb4d\";\n}\n\n/*!@.codicon-search-stop:before*/.codicon-search-stop.sc-kol-icon-default:before {\n content: \"\\eb4e\";\n}\n\n/*!@.codicon-server:before*/.codicon-server.sc-kol-icon-default:before {\n content: \"\\eb50\";\n}\n\n/*!@.codicon-settings-gear:before*/.codicon-settings-gear.sc-kol-icon-default:before {\n content: \"\\eb51\";\n}\n\n/*!@.codicon-settings:before*/.codicon-settings.sc-kol-icon-default:before {\n content: \"\\eb52\";\n}\n\n/*!@.codicon-shield:before*/.codicon-shield.sc-kol-icon-default:before {\n content: \"\\eb53\";\n}\n\n/*!@.codicon-smiley:before*/.codicon-smiley.sc-kol-icon-default:before {\n content: \"\\eb54\";\n}\n\n/*!@.codicon-sort-precedence:before*/.codicon-sort-precedence.sc-kol-icon-default:before {\n content: \"\\eb55\";\n}\n\n/*!@.codicon-split-horizontal:before*/.codicon-split-horizontal.sc-kol-icon-default:before {\n content: \"\\eb56\";\n}\n\n/*!@.codicon-split-vertical:before*/.codicon-split-vertical.sc-kol-icon-default:before {\n content: \"\\eb57\";\n}\n\n/*!@.codicon-squirrel:before*/.codicon-squirrel.sc-kol-icon-default:before {\n content: \"\\eb58\";\n}\n\n/*!@.codicon-star-full:before*/.codicon-star-full.sc-kol-icon-default:before {\n content: \"\\eb59\";\n}\n\n/*!@.codicon-star-half:before*/.codicon-star-half.sc-kol-icon-default:before {\n content: \"\\eb5a\";\n}\n\n/*!@.codicon-symbol-class:before*/.codicon-symbol-class.sc-kol-icon-default:before {\n content: \"\\eb5b\";\n}\n\n/*!@.codicon-symbol-color:before*/.codicon-symbol-color.sc-kol-icon-default:before {\n content: \"\\eb5c\";\n}\n\n/*!@.codicon-symbol-constant:before*/.codicon-symbol-constant.sc-kol-icon-default:before {\n content: \"\\eb5d\";\n}\n\n/*!@.codicon-symbol-enum-member:before*/.codicon-symbol-enum-member.sc-kol-icon-default:before {\n content: \"\\eb5e\";\n}\n\n/*!@.codicon-symbol-field:before*/.codicon-symbol-field.sc-kol-icon-default:before {\n content: \"\\eb5f\";\n}\n\n/*!@.codicon-symbol-file:before*/.codicon-symbol-file.sc-kol-icon-default:before {\n content: \"\\eb60\";\n}\n\n/*!@.codicon-symbol-interface:before*/.codicon-symbol-interface.sc-kol-icon-default:before {\n content: \"\\eb61\";\n}\n\n/*!@.codicon-symbol-keyword:before*/.codicon-symbol-keyword.sc-kol-icon-default:before {\n content: \"\\eb62\";\n}\n\n/*!@.codicon-symbol-misc:before*/.codicon-symbol-misc.sc-kol-icon-default:before {\n content: \"\\eb63\";\n}\n\n/*!@.codicon-symbol-operator:before*/.codicon-symbol-operator.sc-kol-icon-default:before {\n content: \"\\eb64\";\n}\n\n/*!@.codicon-symbol-property:before*/.codicon-symbol-property.sc-kol-icon-default:before {\n content: \"\\eb65\";\n}\n\n/*!@.codicon-wrench:before*/.codicon-wrench.sc-kol-icon-default:before {\n content: \"\\eb65\";\n}\n\n/*!@.codicon-wrench-subaction:before*/.codicon-wrench-subaction.sc-kol-icon-default:before {\n content: \"\\eb65\";\n}\n\n/*!@.codicon-symbol-snippet:before*/.codicon-symbol-snippet.sc-kol-icon-default:before {\n content: \"\\eb66\";\n}\n\n/*!@.codicon-tasklist:before*/.codicon-tasklist.sc-kol-icon-default:before {\n content: \"\\eb67\";\n}\n\n/*!@.codicon-telescope:before*/.codicon-telescope.sc-kol-icon-default:before {\n content: \"\\eb68\";\n}\n\n/*!@.codicon-text-size:before*/.codicon-text-size.sc-kol-icon-default:before {\n content: \"\\eb69\";\n}\n\n/*!@.codicon-three-bars:before*/.codicon-three-bars.sc-kol-icon-default:before {\n content: \"\\eb6a\";\n}\n\n/*!@.codicon-thumbsdown:before*/.codicon-thumbsdown.sc-kol-icon-default:before {\n content: \"\\eb6b\";\n}\n\n/*!@.codicon-thumbsup:before*/.codicon-thumbsup.sc-kol-icon-default:before {\n content: \"\\eb6c\";\n}\n\n/*!@.codicon-tools:before*/.codicon-tools.sc-kol-icon-default:before {\n content: \"\\eb6d\";\n}\n\n/*!@.codicon-triangle-down:before*/.codicon-triangle-down.sc-kol-icon-default:before {\n content: \"\\eb6e\";\n}\n\n/*!@.codicon-triangle-left:before*/.codicon-triangle-left.sc-kol-icon-default:before {\n content: \"\\eb6f\";\n}\n\n/*!@.codicon-triangle-right:before*/.codicon-triangle-right.sc-kol-icon-default:before {\n content: \"\\eb70\";\n}\n\n/*!@.codicon-triangle-up:before*/.codicon-triangle-up.sc-kol-icon-default:before {\n content: \"\\eb71\";\n}\n\n/*!@.codicon-twitter:before*/.codicon-twitter.sc-kol-icon-default:before {\n content: \"\\eb72\";\n}\n\n/*!@.codicon-unfold:before*/.codicon-unfold.sc-kol-icon-default:before {\n content: \"\\eb73\";\n}\n\n/*!@.codicon-unlock:before*/.codicon-unlock.sc-kol-icon-default:before {\n content: \"\\eb74\";\n}\n\n/*!@.codicon-unmute:before*/.codicon-unmute.sc-kol-icon-default:before {\n content: \"\\eb75\";\n}\n\n/*!@.codicon-unverified:before*/.codicon-unverified.sc-kol-icon-default:before {\n content: \"\\eb76\";\n}\n\n/*!@.codicon-verified:before*/.codicon-verified.sc-kol-icon-default:before {\n content: \"\\eb77\";\n}\n\n/*!@.codicon-versions:before*/.codicon-versions.sc-kol-icon-default:before {\n content: \"\\eb78\";\n}\n\n/*!@.codicon-vm-active:before*/.codicon-vm-active.sc-kol-icon-default:before {\n content: \"\\eb79\";\n}\n\n/*!@.codicon-vm-outline:before*/.codicon-vm-outline.sc-kol-icon-default:before {\n content: \"\\eb7a\";\n}\n\n/*!@.codicon-vm-running:before*/.codicon-vm-running.sc-kol-icon-default:before {\n content: \"\\eb7b\";\n}\n\n/*!@.codicon-watch:before*/.codicon-watch.sc-kol-icon-default:before {\n content: \"\\eb7c\";\n}\n\n/*!@.codicon-whitespace:before*/.codicon-whitespace.sc-kol-icon-default:before {\n content: \"\\eb7d\";\n}\n\n/*!@.codicon-whole-word:before*/.codicon-whole-word.sc-kol-icon-default:before {\n content: \"\\eb7e\";\n}\n\n/*!@.codicon-window:before*/.codicon-window.sc-kol-icon-default:before {\n content: \"\\eb7f\";\n}\n\n/*!@.codicon-word-wrap:before*/.codicon-word-wrap.sc-kol-icon-default:before {\n content: \"\\eb80\";\n}\n\n/*!@.codicon-zoom-in:before*/.codicon-zoom-in.sc-kol-icon-default:before {\n content: \"\\eb81\";\n}\n\n/*!@.codicon-zoom-out:before*/.codicon-zoom-out.sc-kol-icon-default:before {\n content: \"\\eb82\";\n}\n\n/*!@.codicon-list-filter:before*/.codicon-list-filter.sc-kol-icon-default:before {\n content: \"\\eb83\";\n}\n\n/*!@.codicon-list-flat:before*/.codicon-list-flat.sc-kol-icon-default:before {\n content: \"\\eb84\";\n}\n\n/*!@.codicon-list-selection:before*/.codicon-list-selection.sc-kol-icon-default:before {\n content: \"\\eb85\";\n}\n\n/*!@.codicon-selection:before*/.codicon-selection.sc-kol-icon-default:before {\n content: \"\\eb85\";\n}\n\n/*!@.codicon-list-tree:before*/.codicon-list-tree.sc-kol-icon-default:before {\n content: \"\\eb86\";\n}\n\n/*!@.codicon-debug-breakpoint-function-unverified:before*/.codicon-debug-breakpoint-function-unverified.sc-kol-icon-default:before {\n content: \"\\eb87\";\n}\n\n/*!@.codicon-debug-breakpoint-function:before*/.codicon-debug-breakpoint-function.sc-kol-icon-default:before {\n content: \"\\eb88\";\n}\n\n/*!@.codicon-debug-breakpoint-function-disabled:before*/.codicon-debug-breakpoint-function-disabled.sc-kol-icon-default:before {\n content: \"\\eb88\";\n}\n\n/*!@.codicon-debug-stackframe-active:before*/.codicon-debug-stackframe-active.sc-kol-icon-default:before {\n content: \"\\eb89\";\n}\n\n/*!@.codicon-circle-small-filled:before*/.codicon-circle-small-filled.sc-kol-icon-default:before {\n content: \"\\eb8a\";\n}\n\n/*!@.codicon-debug-stackframe-dot:before*/.codicon-debug-stackframe-dot.sc-kol-icon-default:before {\n content: \"\\eb8a\";\n}\n\n/*!@.codicon-debug-stackframe:before*/.codicon-debug-stackframe.sc-kol-icon-default:before {\n content: \"\\eb8b\";\n}\n\n/*!@.codicon-debug-stackframe-focused:before*/.codicon-debug-stackframe-focused.sc-kol-icon-default:before {\n content: \"\\eb8b\";\n}\n\n/*!@.codicon-debug-breakpoint-unsupported:before*/.codicon-debug-breakpoint-unsupported.sc-kol-icon-default:before {\n content: \"\\eb8c\";\n}\n\n/*!@.codicon-symbol-string:before*/.codicon-symbol-string.sc-kol-icon-default:before {\n content: \"\\eb8d\";\n}\n\n/*!@.codicon-debug-reverse-continue:before*/.codicon-debug-reverse-continue.sc-kol-icon-default:before {\n content: \"\\eb8e\";\n}\n\n/*!@.codicon-debug-step-back:before*/.codicon-debug-step-back.sc-kol-icon-default:before {\n content: \"\\eb8f\";\n}\n\n/*!@.codicon-debug-restart-frame:before*/.codicon-debug-restart-frame.sc-kol-icon-default:before {\n content: \"\\eb90\";\n}\n\n/*!@.codicon-debug-alt:before*/.codicon-debug-alt.sc-kol-icon-default:before {\n content: \"\\eb91\";\n}\n\n/*!@.codicon-call-incoming:before*/.codicon-call-incoming.sc-kol-icon-default:before {\n content: \"\\eb92\";\n}\n\n/*!@.codicon-call-outgoing:before*/.codicon-call-outgoing.sc-kol-icon-default:before {\n content: \"\\eb93\";\n}\n\n/*!@.codicon-menu:before*/.codicon-menu.sc-kol-icon-default:before {\n content: \"\\eb94\";\n}\n\n/*!@.codicon-expand-all:before*/.codicon-expand-all.sc-kol-icon-default:before {\n content: \"\\eb95\";\n}\n\n/*!@.codicon-feedback:before*/.codicon-feedback.sc-kol-icon-default:before {\n content: \"\\eb96\";\n}\n\n/*!@.codicon-group-by-ref-type:before*/.codicon-group-by-ref-type.sc-kol-icon-default:before {\n content: \"\\eb97\";\n}\n\n/*!@.codicon-ungroup-by-ref-type:before*/.codicon-ungroup-by-ref-type.sc-kol-icon-default:before {\n content: \"\\eb98\";\n}\n\n/*!@.codicon-account:before*/.codicon-account.sc-kol-icon-default:before {\n content: \"\\eb99\";\n}\n\n/*!@.codicon-bell-dot:before*/.codicon-bell-dot.sc-kol-icon-default:before {\n content: \"\\eb9a\";\n}\n\n/*!@.codicon-debug-console:before*/.codicon-debug-console.sc-kol-icon-default:before {\n content: \"\\eb9b\";\n}\n\n/*!@.codicon-library:before*/.codicon-library.sc-kol-icon-default:before {\n content: \"\\eb9c\";\n}\n\n/*!@.codicon-output:before*/.codicon-output.sc-kol-icon-default:before {\n content: \"\\eb9d\";\n}\n\n/*!@.codicon-run-all:before*/.codicon-run-all.sc-kol-icon-default:before {\n content: \"\\eb9e\";\n}\n\n/*!@.codicon-sync-ignored:before*/.codicon-sync-ignored.sc-kol-icon-default:before {\n content: \"\\eb9f\";\n}\n\n/*!@.codicon-pinned:before*/.codicon-pinned.sc-kol-icon-default:before {\n content: \"\\eba0\";\n}\n\n/*!@.codicon-github-inverted:before*/.codicon-github-inverted.sc-kol-icon-default:before {\n content: \"\\eba1\";\n}\n\n/*!@.codicon-server-process:before*/.codicon-server-process.sc-kol-icon-default:before {\n content: \"\\eba2\";\n}\n\n/*!@.codicon-server-environment:before*/.codicon-server-environment.sc-kol-icon-default:before {\n content: \"\\eba3\";\n}\n\n/*!@.codicon-pass:before*/.codicon-pass.sc-kol-icon-default:before {\n content: \"\\eba4\";\n}\n\n/*!@.codicon-issue-closed:before*/.codicon-issue-closed.sc-kol-icon-default:before {\n content: \"\\eba4\";\n}\n\n/*!@.codicon-stop-circle:before*/.codicon-stop-circle.sc-kol-icon-default:before {\n content: \"\\eba5\";\n}\n\n/*!@.codicon-play-circle:before*/.codicon-play-circle.sc-kol-icon-default:before {\n content: \"\\eba6\";\n}\n\n/*!@.codicon-record:before*/.codicon-record.sc-kol-icon-default:before {\n content: \"\\eba7\";\n}\n\n/*!@.codicon-debug-alt-small:before*/.codicon-debug-alt-small.sc-kol-icon-default:before {\n content: \"\\eba8\";\n}\n\n/*!@.codicon-vm-connect:before*/.codicon-vm-connect.sc-kol-icon-default:before {\n content: \"\\eba9\";\n}\n\n/*!@.codicon-cloud:before*/.codicon-cloud.sc-kol-icon-default:before {\n content: \"\\ebaa\";\n}\n\n/*!@.codicon-merge:before*/.codicon-merge.sc-kol-icon-default:before {\n content: \"\\ebab\";\n}\n\n/*!@.codicon-export:before*/.codicon-export.sc-kol-icon-default:before {\n content: \"\\ebac\";\n}\n\n/*!@.codicon-graph-left:before*/.codicon-graph-left.sc-kol-icon-default:before {\n content: \"\\ebad\";\n}\n\n/*!@.codicon-magnet:before*/.codicon-magnet.sc-kol-icon-default:before {\n content: \"\\ebae\";\n}\n\n/*!@.codicon-notebook:before*/.codicon-notebook.sc-kol-icon-default:before {\n content: \"\\ebaf\";\n}\n\n/*!@.codicon-redo:before*/.codicon-redo.sc-kol-icon-default:before {\n content: \"\\ebb0\";\n}\n\n/*!@.codicon-check-all:before*/.codicon-check-all.sc-kol-icon-default:before {\n content: \"\\ebb1\";\n}\n\n/*!@.codicon-pinned-dirty:before*/.codicon-pinned-dirty.sc-kol-icon-default:before {\n content: \"\\ebb2\";\n}\n\n/*!@.codicon-pass-filled:before*/.codicon-pass-filled.sc-kol-icon-default:before {\n content: \"\\ebb3\";\n}\n\n/*!@.codicon-circle-large-filled:before*/.codicon-circle-large-filled.sc-kol-icon-default:before {\n content: \"\\ebb4\";\n}\n\n/*!@.codicon-circle-large-outline:before*/.codicon-circle-large-outline.sc-kol-icon-default:before {\n content: \"\\ebb5\";\n}\n\n/*!@.codicon-combine:before*/.codicon-combine.sc-kol-icon-default:before {\n content: \"\\ebb6\";\n}\n\n/*!@.codicon-gather:before*/.codicon-gather.sc-kol-icon-default:before {\n content: \"\\ebb6\";\n}\n\n/*!@.codicon-table:before*/.codicon-table.sc-kol-icon-default:before {\n content: \"\\ebb7\";\n}\n\n/*!@.codicon-variable-group:before*/.codicon-variable-group.sc-kol-icon-default:before {\n content: \"\\ebb8\";\n}\n\n/*!@.codicon-type-hierarchy:before*/.codicon-type-hierarchy.sc-kol-icon-default:before {\n content: \"\\ebb9\";\n}\n\n/*!@.codicon-type-hierarchy-sub:before*/.codicon-type-hierarchy-sub.sc-kol-icon-default:before {\n content: \"\\ebba\";\n}\n\n/*!@.codicon-type-hierarchy-super:before*/.codicon-type-hierarchy-super.sc-kol-icon-default:before {\n content: \"\\ebbb\";\n}\n\n/*!@.codicon-git-pull-request-create:before*/.codicon-git-pull-request-create.sc-kol-icon-default:before {\n content: \"\\ebbc\";\n}\n\n/*!@.codicon-run-above:before*/.codicon-run-above.sc-kol-icon-default:before {\n content: \"\\ebbd\";\n}\n\n/*!@.codicon-run-below:before*/.codicon-run-below.sc-kol-icon-default:before {\n content: \"\\ebbe\";\n}\n\n/*!@.codicon-notebook-template:before*/.codicon-notebook-template.sc-kol-icon-default:before {\n content: \"\\ebbf\";\n}\n\n/*!@.codicon-debug-rerun:before*/.codicon-debug-rerun.sc-kol-icon-default:before {\n content: \"\\ebc0\";\n}\n\n/*!@.codicon-workspace-trusted:before*/.codicon-workspace-trusted.sc-kol-icon-default:before {\n content: \"\\ebc1\";\n}\n\n/*!@.codicon-workspace-untrusted:before*/.codicon-workspace-untrusted.sc-kol-icon-default:before {\n content: \"\\ebc2\";\n}\n\n/*!@.codicon-workspace-unknown:before*/.codicon-workspace-unknown.sc-kol-icon-default:before {\n content: \"\\ebc3\";\n}\n\n/*!@.codicon-terminal-cmd:before*/.codicon-terminal-cmd.sc-kol-icon-default:before {\n content: \"\\ebc4\";\n}\n\n/*!@.codicon-terminal-debian:before*/.codicon-terminal-debian.sc-kol-icon-default:before {\n content: \"\\ebc5\";\n}\n\n/*!@.codicon-terminal-linux:before*/.codicon-terminal-linux.sc-kol-icon-default:before {\n content: \"\\ebc6\";\n}\n\n/*!@.codicon-terminal-powershell:before*/.codicon-terminal-powershell.sc-kol-icon-default:before {\n content: \"\\ebc7\";\n}\n\n/*!@.codicon-terminal-tmux:before*/.codicon-terminal-tmux.sc-kol-icon-default:before {\n content: \"\\ebc8\";\n}\n\n/*!@.codicon-terminal-ubuntu:before*/.codicon-terminal-ubuntu.sc-kol-icon-default:before {\n content: \"\\ebc9\";\n}\n\n/*!@.codicon-terminal-bash:before*/.codicon-terminal-bash.sc-kol-icon-default:before {\n content: \"\\ebca\";\n}\n\n/*!@.codicon-arrow-swap:before*/.codicon-arrow-swap.sc-kol-icon-default:before {\n content: \"\\ebcb\";\n}\n\n/*!@.codicon-copy:before*/.codicon-copy.sc-kol-icon-default:before {\n content: \"\\ebcc\";\n}\n\n/*!@.codicon-person-add:before*/.codicon-person-add.sc-kol-icon-default:before {\n content: \"\\ebcd\";\n}\n\n/*!@.codicon-filter-filled:before*/.codicon-filter-filled.sc-kol-icon-default:before {\n content: \"\\ebce\";\n}\n\n/*!@.codicon-wand:before*/.codicon-wand.sc-kol-icon-default:before {\n content: \"\\ebcf\";\n}\n\n/*!@.codicon-debug-line-by-line:before*/.codicon-debug-line-by-line.sc-kol-icon-default:before {\n content: \"\\ebd0\";\n}\n\n/*!@.codicon-inspect:before*/.codicon-inspect.sc-kol-icon-default:before {\n content: \"\\ebd1\";\n}\n\n/*!@.codicon-layers:before*/.codicon-layers.sc-kol-icon-default:before {\n content: \"\\ebd2\";\n}\n\n/*!@.codicon-layers-dot:before*/.codicon-layers-dot.sc-kol-icon-default:before {\n content: \"\\ebd3\";\n}\n\n/*!@.codicon-layers-active:before*/.codicon-layers-active.sc-kol-icon-default:before {\n content: \"\\ebd4\";\n}\n\n/*!@.codicon-compass:before*/.codicon-compass.sc-kol-icon-default:before {\n content: \"\\ebd5\";\n}\n\n/*!@.codicon-compass-dot:before*/.codicon-compass-dot.sc-kol-icon-default:before {\n content: \"\\ebd6\";\n}\n\n/*!@.codicon-compass-active:before*/.codicon-compass-active.sc-kol-icon-default:before {\n content: \"\\ebd7\";\n}\n\n/*!@.codicon-azure:before*/.codicon-azure.sc-kol-icon-default:before {\n content: \"\\ebd8\";\n}\n\n/*!@.codicon-issue-draft:before*/.codicon-issue-draft.sc-kol-icon-default:before {\n content: \"\\ebd9\";\n}\n\n/*!@.codicon-git-pull-request-closed:before*/.codicon-git-pull-request-closed.sc-kol-icon-default:before {\n content: \"\\ebda\";\n}\n\n/*!@.codicon-git-pull-request-draft:before*/.codicon-git-pull-request-draft.sc-kol-icon-default:before {\n content: \"\\ebdb\";\n}\n\n/*!@.codicon-debug-all:before*/.codicon-debug-all.sc-kol-icon-default:before {\n content: \"\\ebdc\";\n}\n\n/*!@.codicon-debug-coverage:before*/.codicon-debug-coverage.sc-kol-icon-default:before {\n content: \"\\ebdd\";\n}\n\n/*!@.codicon-run-errors:before*/.codicon-run-errors.sc-kol-icon-default:before {\n content: \"\\ebde\";\n}\n\n/*!@.codicon-folder-library:before*/.codicon-folder-library.sc-kol-icon-default:before {\n content: \"\\ebdf\";\n}\n\n/*!@.codicon-debug-continue-small:before*/.codicon-debug-continue-small.sc-kol-icon-default:before {\n content: \"\\ebe0\";\n}\n\n/*!@.codicon-beaker-stop:before*/.codicon-beaker-stop.sc-kol-icon-default:before {\n content: \"\\ebe1\";\n}\n\n/*!@.codicon-graph-line:before*/.codicon-graph-line.sc-kol-icon-default:before {\n content: \"\\ebe2\";\n}\n\n/*!@.codicon-graph-scatter:before*/.codicon-graph-scatter.sc-kol-icon-default:before {\n content: \"\\ebe3\";\n}\n\n/*!@.codicon-pie-chart:before*/.codicon-pie-chart.sc-kol-icon-default:before {\n content: \"\\ebe4\";\n}\n\n/*!@.codicon-bracket:before*/.codicon-bracket.sc-kol-icon-default:before {\n content: \"\\eb0f\";\n}\n\n/*!@.codicon-bracket-dot:before*/.codicon-bracket-dot.sc-kol-icon-default:before {\n content: \"\\ebe5\";\n}\n\n/*!@.codicon-bracket-error:before*/.codicon-bracket-error.sc-kol-icon-default:before {\n content: \"\\ebe6\";\n}\n\n/*!@.codicon-lock-small:before*/.codicon-lock-small.sc-kol-icon-default:before {\n content: \"\\ebe7\";\n}\n\n/*!@.codicon-azure-devops:before*/.codicon-azure-devops.sc-kol-icon-default:before {\n content: \"\\ebe8\";\n}\n\n/*!@.codicon-verified-filled:before*/.codicon-verified-filled.sc-kol-icon-default:before {\n content: \"\\ebe9\";\n}\n\n/*!@.codicon-newline:before*/.codicon-newline.sc-kol-icon-default:before {\n content: \"\\ebea\";\n}\n\n/*!@.codicon-layout:before*/.codicon-layout.sc-kol-icon-default:before {\n content: \"\\ebeb\";\n}\n\n/*!@.codicon-layout-activitybar-left:before*/.codicon-layout-activitybar-left.sc-kol-icon-default:before {\n content: \"\\ebec\";\n}\n\n/*!@.codicon-layout-activitybar-right:before*/.codicon-layout-activitybar-right.sc-kol-icon-default:before {\n content: \"\\ebed\";\n}\n\n/*!@.codicon-layout-panel-left:before*/.codicon-layout-panel-left.sc-kol-icon-default:before {\n content: \"\\ebee\";\n}\n\n/*!@.codicon-layout-panel-center:before*/.codicon-layout-panel-center.sc-kol-icon-default:before {\n content: \"\\ebef\";\n}\n\n/*!@.codicon-layout-panel-justify:before*/.codicon-layout-panel-justify.sc-kol-icon-default:before {\n content: \"\\ebf0\";\n}\n\n/*!@.codicon-layout-panel-right:before*/.codicon-layout-panel-right.sc-kol-icon-default:before {\n content: \"\\ebf1\";\n}\n\n/*!@.codicon-layout-panel:before*/.codicon-layout-panel.sc-kol-icon-default:before {\n content: \"\\ebf2\";\n}\n\n/*!@.codicon-layout-sidebar-left:before*/.codicon-layout-sidebar-left.sc-kol-icon-default:before {\n content: \"\\ebf3\";\n}\n\n/*!@.codicon-layout-sidebar-right:before*/.codicon-layout-sidebar-right.sc-kol-icon-default:before {\n content: \"\\ebf4\";\n}\n\n/*!@.codicon-layout-statusbar:before*/.codicon-layout-statusbar.sc-kol-icon-default:before {\n content: \"\\ebf5\";\n}\n\n/*!@.codicon-layout-menubar:before*/.codicon-layout-menubar.sc-kol-icon-default:before {\n content: \"\\ebf6\";\n}\n\n/*!@.codicon-layout-centered:before*/.codicon-layout-centered.sc-kol-icon-default:before {\n content: \"\\ebf7\";\n}\n\n/*!@.codicon-target:before*/.codicon-target.sc-kol-icon-default:before {\n content: \"\\ebf8\";\n}\n\n/*!@.codicon-indent:before*/.codicon-indent.sc-kol-icon-default:before {\n content: \"\\ebf9\";\n}\n\n/*!@.codicon-record-small:before*/.codicon-record-small.sc-kol-icon-default:before {\n content: \"\\ebfa\";\n}\n\n/*!@.codicon-error-small:before*/.codicon-error-small.sc-kol-icon-default:before {\n content: \"\\ebfb\";\n}\n\n/*!@.codicon-arrow-circle-down:before*/.codicon-arrow-circle-down.sc-kol-icon-default:before {\n content: \"\\ebfc\";\n}\n\n/*!@.codicon-arrow-circle-left:before*/.codicon-arrow-circle-left.sc-kol-icon-default:before {\n content: \"\\ebfd\";\n}\n\n/*!@.codicon-arrow-circle-right:before*/.codicon-arrow-circle-right.sc-kol-icon-default:before {\n content: \"\\ebfe\";\n}\n\n/*!@.codicon-arrow-circle-up:before*/.codicon-arrow-circle-up.sc-kol-icon-default:before {\n content: \"\\ebff\";\n}\n\n/*!@.codicon-layout-sidebar-right-off:before*/.codicon-layout-sidebar-right-off.sc-kol-icon-default:before {\n content: \"\\ec00\";\n}\n\n/*!@.codicon-layout-panel-off:before*/.codicon-layout-panel-off.sc-kol-icon-default:before {\n content: \"\\ec01\";\n}\n\n/*!@.codicon-layout-sidebar-left-off:before*/.codicon-layout-sidebar-left-off.sc-kol-icon-default:before {\n content: \"\\ec02\";\n}\n\n/*!@.codicon-blank:before*/.codicon-blank.sc-kol-icon-default:before {\n content: \"\\ec03\";\n}\n\n/*!@.codicon-heart-filled:before*/.codicon-heart-filled.sc-kol-icon-default:before {\n content: \"\\ec04\";\n}\n\n/*!@.codicon-map:before*/.codicon-map.sc-kol-icon-default:before {\n content: \"\\ec05\";\n}\n\n/*!@.codicon-map-filled:before*/.codicon-map-filled.sc-kol-icon-default:before {\n content: \"\\ec06\";\n}\n\n/*!@.codicon-circle-small:before*/.codicon-circle-small.sc-kol-icon-default:before {\n content: \"\\ec07\";\n}\n\n/*!@.codicon-bell-slash:before*/.codicon-bell-slash.sc-kol-icon-default:before {\n content: \"\\ec08\";\n}\n\n/*!@.codicon-bell-slash-dot:before*/.codicon-bell-slash-dot.sc-kol-icon-default:before {\n content: \"\\ec09\";\n}\n\n/*!@.codicon-comment-unresolved:before*/.codicon-comment-unresolved.sc-kol-icon-default:before {\n content: \"\\ec0a\";\n}\n\n/*!@.codicon-git-pull-request-go-to-changes:before*/.codicon-git-pull-request-go-to-changes.sc-kol-icon-default:before {\n content: \"\\ec0b\";\n}\n\n/*!@.codicon-git-pull-request-new-changes:before*/.codicon-git-pull-request-new-changes.sc-kol-icon-default:before {\n content: \"\\ec0c\";\n}\n\n@layer kol-component {\n \n .sc-kol-icon-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n color: inherit;\n display: contents;\n height: 1em;\n line-height: inherit;\n width: 1em;\n }\n .sc-kol-icon-default-h > i {\n height: 1em;\n width: 1em;\n }\n \n .sc-kol-icon-default-h > i,\n .sc-kol-icon-default-h > i:before {\n font-size: inherit !important;\n }\n}";
|
|
7128
|
+
var KolIconDefaultStyle0 = defaultStyleCss$A;
|
|
7106
7129
|
|
|
7107
7130
|
class KolIcon {
|
|
7108
7131
|
constructor(hostRef) {
|
|
@@ -7116,7 +7139,7 @@ class KolIcon {
|
|
|
7116
7139
|
}
|
|
7117
7140
|
render() {
|
|
7118
7141
|
const ariaShow = this.state._label.length > 0;
|
|
7119
|
-
return (hAsync(Host, { key: '
|
|
7142
|
+
return (hAsync(Host, { key: '572ba8a20d7e148034c7564d0b8d672aac7f3c30', exportparts: "icon", class: "kol-icon" }, hAsync("i", { key: 'ec9325d8bb003986a44fdffc42eb4d7eaa91e1ab', "aria-hidden": ariaShow ? undefined : 'true', "aria-label": ariaShow ? this.state._label : undefined, class: this.state._icons, part: "icon", role: "img" })));
|
|
7120
7143
|
}
|
|
7121
7144
|
validateIcons(value) {
|
|
7122
7145
|
watchString(this, '_icons', value, {
|
|
@@ -7153,8 +7176,8 @@ class KolIcon {
|
|
|
7153
7176
|
}; }
|
|
7154
7177
|
}
|
|
7155
7178
|
|
|
7156
|
-
const defaultStyleCss$
|
|
7157
|
-
var KolImageDefaultStyle0 = defaultStyleCss$
|
|
7179
|
+
const defaultStyleCss$z = "@layer kol-component {\n .sc-kol-image-default-h {\n display: inline-block;\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n img {\n max-height: 100%;\n max-width: 100%;\n }\n}";
|
|
7180
|
+
var KolImageDefaultStyle0 = defaultStyleCss$z;
|
|
7158
7181
|
|
|
7159
7182
|
class KolImage {
|
|
7160
7183
|
constructor(hostRef) {
|
|
@@ -7197,7 +7220,7 @@ class KolImage {
|
|
|
7197
7220
|
this.validateSrcset(this._srcset);
|
|
7198
7221
|
}
|
|
7199
7222
|
render() {
|
|
7200
|
-
return (hAsync(Host, { key: '
|
|
7223
|
+
return (hAsync(Host, { key: '35060e13dba448cc0f1a193663308482db063a03', class: "kol-image" }, hAsync("img", { key: '27dd05459ce46a822b26e9221bb4fd62e9434359', alt: this.state._alt, loading: this.state._loading, sizes: this.state._sizes, src: this.state._src, srcset: this.state._srcset })));
|
|
7201
7224
|
}
|
|
7202
7225
|
static get watchers() { return {
|
|
7203
7226
|
"_alt": ["validateAlt"],
|
|
@@ -7226,15 +7249,15 @@ class KolImage {
|
|
|
7226
7249
|
}; }
|
|
7227
7250
|
}
|
|
7228
7251
|
|
|
7229
|
-
const defaultStyleCss$
|
|
7230
|
-
var KolIndentedTextDefaultStyle0 = defaultStyleCss$
|
|
7252
|
+
const defaultStyleCss$y = "@layer kol-global {\n .sc-kol-indented-text-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-indented-text-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-indented-text-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-indented-text-default-h {\n display: block;\n }\n}\n@layer kol-component {\n .sc-kol-indented-text-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .sc-kol-indented-text-default-h > div {\n border-left-style: solid;\n padding-left: 0.5em;\n }\n}";
|
|
7253
|
+
var KolIndentedTextDefaultStyle0 = defaultStyleCss$y;
|
|
7231
7254
|
|
|
7232
7255
|
class KolIndentedText {
|
|
7233
7256
|
constructor(hostRef) {
|
|
7234
7257
|
registerInstance(this, hostRef);
|
|
7235
7258
|
}
|
|
7236
7259
|
render() {
|
|
7237
|
-
return (hAsync(Host, { key: '
|
|
7260
|
+
return (hAsync(Host, { key: '9b496304e5e30ad3df9ea7f7b948a26abf246e06', class: "kol-indented-text" }, hAsync(KolIndentedTextWcTag, { key: '9952d49cbac923332d7cfd16e58697ef64f38f89' }, hAsync("slot", { key: 'baf3eb43467b6b9dc861c6943785d9966772b5ef' }))));
|
|
7238
7261
|
}
|
|
7239
7262
|
static get style() { return {
|
|
7240
7263
|
default: KolIndentedTextDefaultStyle0
|
|
@@ -7255,7 +7278,7 @@ class KolIndentedTextWc {
|
|
|
7255
7278
|
this.state = {};
|
|
7256
7279
|
}
|
|
7257
7280
|
render() {
|
|
7258
|
-
return (hAsync(Host, { key: '
|
|
7281
|
+
return (hAsync(Host, { key: '64921f12c416fdba4dec29db15cca84fc8277ae4', class: "kol-indented-text-wc" }, hAsync("div", { key: '6f201cf35b3d217e079087e306ae1679dc17ec75' }, hAsync("slot", { key: 'ad4a24a8f8755694b514ac378cee2ecb90ee2722' }))));
|
|
7259
7282
|
}
|
|
7260
7283
|
static get cmpMeta() { return {
|
|
7261
7284
|
"$flags$": 4,
|
|
@@ -7391,8 +7414,8 @@ class InputCheckboxController extends InputCheckboxRadioController {
|
|
|
7391
7414
|
}
|
|
7392
7415
|
}
|
|
7393
7416
|
|
|
7394
|
-
const defaultStyleCss$
|
|
7395
|
-
var KolInputCheckboxDefaultStyle0 = defaultStyleCss$
|
|
7417
|
+
const defaultStyleCss$x = "@layer kol-global {\n .sc-kol-input-checkbox-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-checkbox-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-checkbox-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .required label > span::after,\n .required legend > span::after {\n content: \"*\";\n }\n}\n@layer kol-component {\n .sc-kol-input-checkbox-default-h {\n display: block;\n }\n}\n@layer kol-component {\n input,\n textarea {\n cursor: text;\n }\n input[type=checkbox],\n input[type=color],\n input[type=file],\n input[type=radio],\n input[type=range],\n label,\n option,\n select {\n cursor: pointer;\n }\n \n \n \n input[type=color],\n input[type=date],\n input[type=datetime-local],\n input[type=email],\n input[type=file],\n input[type=month],\n input[type=number],\n input[type=password],\n input[type=search],\n input[type=tel],\n input[type=text],\n input[type=time],\n input[type=url],\n input[type=week],\n select,\n select[multiple] option,\n textarea {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n width: 100%;\n }\n \n input[type=file] {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n }\n \n select[multiple] option {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n }\n}\n@layer kol-component {\n .sc-kol-input-checkbox-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n label {\n cursor: pointer;\n }\n .kol-input {\n align-items: center;\n display: grid;\n justify-items: left;\n }\n .kol-input.default,\n .kol-input.switch {\n grid-template-columns: auto 1fr;\n }\n .kol-input .input {\n align-items: center;\n display: grid;\n order: 1;\n }\n .kol-input .input div {\n display: inline-flex;\n }\n .kol-input .input input {\n margin: 0;\n }\n .kol-input label {\n order: 2;\n }\n .kol-input .hint,\n .kol-input.error > .kol-alert {\n grid-column: span 2;\n }\n .kol-input .kol-alert.error {\n order: 3;\n }\n .kol-input .hint {\n order: 4;\n }\n input {\n border-style: solid;\n border-width: 2px;\n line-height: 24px;\n }\n input[type=checkbox] {\n appearance: none;\n background-color: #fff;\n cursor: pointer;\n transition: 0.5s;\n }\n input[type=checkbox]:before {\n content: \"\";\n cursor: pointer;\n }\n input[type=checkbox]:disabled:before {\n cursor: not-allowed;\n }\n .kol-input.required .tooltip-content .span-label::after {\n content: \"*\";\n }\n}\n@layer kol-component {\n .button {\n display: grid;\n grid-template-columns: var(--a11y-min-size) auto;\n grid-template-areas: \"error error\" \"input label\" \"hint hint\";\n }\n .button:focus-within {\n \n cursor: inherit;\n outline-color: black;\n outline-style: solid;\n }\n .button > .error {\n grid-area: error;\n }\n .button > label {\n grid-area: label;\n }\n .button > .input {\n grid-area: input;\n }\n .button > .hint {\n grid-area: hint;\n }\n .button .icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n }\n}\n@layer kol-component {\n .default .checkbox-container {\n align-items: center;\n display: flex;\n height: var(--a11y-min-size);\n justify-content: center;\n position: relative;\n width: var(--a11y-min-size);\n }\n .default .icon {\n display: block;\n inset: auto;\n position: absolute;\n z-index: 1;\n }\n .default:not(.checked):not(.indeterminate) .icon::part(icon) {\n display: none;\n }\n .default .checkbox-input-element {\n width: 22px;\n height: 22px;\n }\n}\n@layer kol-component {\n .switch .input {\n position: relative;\n }\n .switch input[type=checkbox] {\n display: inline-block;\n height: 1.7em;\n min-width: 3.2em;\n position: relative;\n width: 3.2em;\n }\n .switch input[type=checkbox]::before {\n background-color: #000;\n height: 1.2em;\n left: calc(0.25em - 2px);\n top: calc(0.25em - 2px);\n position: absolute;\n transition: 0.5s;\n width: 1.2em;\n }\n .switch input[type=checkbox]:checked::before {\n transform: translateX(1.5em);\n }\n .switch input[type=checkbox]:indeterminate::before {\n transform: translateX(0.75em);\n }\n .switch .icon {\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 1.2em;\n height: 1.2em;\n position: absolute;\n z-index: 1;\n top: 50%;\n left: 4px;\n transform: translate(0, -50%);\n transition: 0.5s;\n color: #000;\n }\n .switch.checked .icon {\n transform: translate(1.5em, -50%);\n }\n .switch.indeterminate .icon {\n transform: translate(0.75em, -50%);\n }\n}\n\n@layer kol-global {\n .sc-kol-input-checkbox-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-checkbox-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-checkbox-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-input-checkbox-default-h {\n display: block;\n }\n}\n@layer kol-component {\n .kol-alert-wc {\n display: grid;\n }\n .kol-alert-wc .heading {\n display: flex;\n place-items: center;\n }\n .kol-alert-wc .heading > div {\n flex-grow: 1;\n }\n .close {\n \n outline: transparent solid 1px;\n }\n}";
|
|
7418
|
+
var KolInputCheckboxDefaultStyle0 = defaultStyleCss$x;
|
|
7396
7419
|
|
|
7397
7420
|
class KolInputCheckbox {
|
|
7398
7421
|
getModelValue() {
|
|
@@ -7411,13 +7434,13 @@ class KolInputCheckbox {
|
|
|
7411
7434
|
render() {
|
|
7412
7435
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
7413
7436
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
7414
|
-
return (hAsync(Host, { key: '
|
|
7437
|
+
return (hAsync(Host, { key: '20f63d4b1e1ce9c8ccc96acffbec53914f0f623c', class: "kol-input-checkbox" }, hAsync(KolInputWcTag, { key: 'e7e02f3f1aaafc66b2e7aadb48c9b2860b8bdce6', class: {
|
|
7415
7438
|
checkbox: true,
|
|
7416
7439
|
[this.state._variant]: true,
|
|
7417
7440
|
'hide-label': !!this.state._hideLabel,
|
|
7418
7441
|
checked: this.state._checked,
|
|
7419
7442
|
indeterminate: this.state._indeterminate,
|
|
7420
|
-
}, "data-role": this.state._variant === 'button' ? 'button' : undefined, _accessKey: this.state._accessKey, _alert: this.state._alert, _disabled: this.state._disabled, _msg: this.state._msg, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _id: this.state._id, _label: this.state._label, _required: this.state._required, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched }, hAsync("span", { key: '
|
|
7443
|
+
}, "data-role": this.state._variant === 'button' ? 'button' : undefined, _accessKey: this.state._accessKey, _alert: this.state._alert, _disabled: this.state._disabled, _msg: this.state._msg, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _id: this.state._id, _label: this.state._label, _required: this.state._required, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched }, hAsync("span", { key: '78aa1e72043e97d0730bb8d726fbd5419d1398a8', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedAccessKey, { accessKey: this.state._accessKey, label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, this.state._accessKey))) : (hAsync("span", null, this.state._label))), hAsync("label", { key: '48c6b88a5c719a2b53bd61f318393b565ceefd97', slot: "input", class: "checkbox-container" }, hAsync(KolIconTag, { key: '39d29836ec7ec12fecd16a7f1b434486e0dc8169', class: "icon", _icons: this.state._indeterminate ? this.state._icons.indeterminate : this.state._checked ? this.state._icons.checked : this.state._icons.unchecked, _label: "" }), hAsync("input", Object.assign({ key: 'c8c9c71e4aae70674de97709768e2f4023b6bae1', class: `checkbox-input-element${this.state._variant === 'button' ? ' visually-hidden' : ''}`, ref: this.catchRef, title: "", accessKey: this.state._accessKey, "aria-describedby": ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, "aria-label": this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, checked: this.state._checked, disabled: this.state._disabled, id: this.state._id, indeterminate: this.state._indeterminate, name: this.state._name, required: this.state._required, tabIndex: this.state._tabIndex, type: "checkbox" }, this.controller.onFacade, { onInput: this.onInput, onChange: this.onChange, onClick: undefined }))))));
|
|
7421
7444
|
}
|
|
7422
7445
|
constructor(hostRef) {
|
|
7423
7446
|
registerInstance(this, hostRef);
|
|
@@ -7636,8 +7659,8 @@ class InputColorController extends InputIconController {
|
|
|
7636
7659
|
}
|
|
7637
7660
|
}
|
|
7638
7661
|
|
|
7639
|
-
const defaultStyleCss$
|
|
7640
|
-
var KolInputColorDefaultStyle0 = defaultStyleCss$
|
|
7662
|
+
const defaultStyleCss$w = "@layer kol-global {\n .sc-kol-input-color-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-color-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-color-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .required label > span::after,\n .required legend > span::after {\n content: \"*\";\n }\n}\n@layer kol-component {\n .sc-kol-input-color-default-h {\n display: block;\n }\n}\n@layer kol-component {\n input,\n textarea {\n cursor: text;\n }\n input[type=checkbox],\n input[type=color],\n input[type=file],\n input[type=radio],\n input[type=range],\n label,\n option,\n select {\n cursor: pointer;\n }\n \n \n \n input[type=color],\n input[type=date],\n input[type=datetime-local],\n input[type=email],\n input[type=file],\n input[type=month],\n input[type=number],\n input[type=password],\n input[type=search],\n input[type=tel],\n input[type=text],\n input[type=time],\n input[type=url],\n input[type=week],\n select,\n select[multiple] option,\n textarea {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n width: 100%;\n }\n \n input[type=file] {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n }\n \n select[multiple] option {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n }\n}\n@layer kol-component {\n .kol-input {\n display: grid;\n }\n .kol-input .input-slot {\n flex-grow: 1;\n }\n input:not([type=checkbox], [type=radio]),\n select:not([multiple], [size]) {\n height: 2.75em;\n }\n input:focus,\n option:focus,\n select:focus,\n textarea:focus {\n outline: 0;\n }\n .input {\n display: flex;\n align-items: center;\n }\n .input > .kol-icon {\n display: grid;\n height: var(--a11y-min-size);\n place-items: center;\n }\n .kol-input.required .input-tooltip .span-label::after {\n content: \"*\";\n }\n}\n\n@layer kol-global {\n .sc-kol-input-color-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-color-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-color-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-input-color-default-h {\n display: block;\n }\n}\n@layer kol-component {\n .kol-alert-wc {\n display: grid;\n }\n .kol-alert-wc .heading {\n display: flex;\n place-items: center;\n }\n .kol-alert-wc .heading > div {\n flex-grow: 1;\n }\n .close {\n \n outline: transparent solid 1px;\n }\n}\n@layer kol-component {\n .sc-kol-input-color-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n div.input {\n cursor: pointer;\n }\n}";
|
|
7663
|
+
var KolInputColorDefaultStyle0 = defaultStyleCss$w;
|
|
7641
7664
|
|
|
7642
7665
|
class KolInputColor {
|
|
7643
7666
|
async getValue() {
|
|
@@ -7655,10 +7678,10 @@ class KolInputColor {
|
|
|
7655
7678
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
7656
7679
|
const hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
|
|
7657
7680
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
7658
|
-
return (hAsync(Host, { key: '
|
|
7681
|
+
return (hAsync(Host, { key: 'f2f019fd529bbd1c04cbe4dba57e976425baccb2', class: "kol-input-color" }, hAsync(KolInputWcTag, { key: '17731b0a4294ff7e12572f85473b516cfb19ac03', class: {
|
|
7659
7682
|
color: true,
|
|
7660
7683
|
'hide-label': !!this.state._hideLabel,
|
|
7661
|
-
}, _accessKey: this.state._accessKey, _disabled: this.state._disabled, _msg: this.state._msg, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _hideError: this.state._hideError, _id: this.state._id, _label: this.state._label, _suggestions: this.state._suggestions, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '
|
|
7684
|
+
}, _accessKey: this.state._accessKey, _disabled: this.state._disabled, _msg: this.state._msg, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _hideError: this.state._hideError, _id: this.state._id, _label: this.state._label, _suggestions: this.state._suggestions, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '05fa6538aba2aeee262aa52e336b7f0696dab51a', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedAccessKey, { accessKey: this.state._accessKey, label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, this.state._accessKey))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: 'd309ef6118bce12c124374daa62aa85a1f61b75b', slot: "input" }, hAsync("input", Object.assign({ key: '08e3db7c37aa928d127ebf5d9d578029b591c311', ref: this.catchRef, title: "", accessKey: this.state._accessKey, "aria-describedby": ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, "aria-label": this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, autoCapitalize: "off", autoComplete: this.state._autoComplete, autoCorrect: "off", disabled: this.state._disabled, id: this.state._id, list: hasSuggestions ? `${this.state._id}-list` : undefined, name: this.state._name, slot: "input", spellcheck: "false", type: "color", value: this.state._value }, this.controller.onFacade))))));
|
|
7662
7685
|
}
|
|
7663
7686
|
constructor(hostRef) {
|
|
7664
7687
|
registerInstance(this, hostRef);
|
|
@@ -7956,8 +7979,8 @@ InputDateController.isoTimeRegex = /^[0-2]\d:[0-5]\d(:[0-5]\d(?:\.\d+)?)?/;
|
|
|
7956
7979
|
InputDateController.isoWeekRegex = /^\d{4}-W(?:[0-4]\d|5[0-3])$/;
|
|
7957
7980
|
InputDateController.DEFAULT_MAX_DATE = new Date(9999, 11, 31, 23, 59, 59);
|
|
7958
7981
|
|
|
7959
|
-
const defaultStyleCss$
|
|
7960
|
-
var KolInputDateDefaultStyle0 = defaultStyleCss$
|
|
7982
|
+
const defaultStyleCss$v = "@layer kol-global {\n .sc-kol-input-date-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-date-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-date-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .required label > span::after,\n .required legend > span::after {\n content: \"*\";\n }\n}\n@layer kol-component {\n .sc-kol-input-date-default-h {\n display: block;\n }\n}\n@layer kol-component {\n input,\n textarea {\n cursor: text;\n }\n input[type=checkbox],\n input[type=color],\n input[type=file],\n input[type=radio],\n input[type=range],\n label,\n option,\n select {\n cursor: pointer;\n }\n \n \n \n input[type=color],\n input[type=date],\n input[type=datetime-local],\n input[type=email],\n input[type=file],\n input[type=month],\n input[type=number],\n input[type=password],\n input[type=search],\n input[type=tel],\n input[type=text],\n input[type=time],\n input[type=url],\n input[type=week],\n select,\n select[multiple] option,\n textarea {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n width: 100%;\n }\n \n input[type=file] {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n }\n \n select[multiple] option {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n }\n}\n@layer kol-component {\n .kol-input {\n display: grid;\n }\n .kol-input .input-slot {\n flex-grow: 1;\n }\n input:not([type=checkbox], [type=radio]),\n select:not([multiple], [size]) {\n height: 2.75em;\n }\n input:focus,\n option:focus,\n select:focus,\n textarea:focus {\n outline: 0;\n }\n .input {\n display: flex;\n align-items: center;\n }\n .input > .kol-icon {\n display: grid;\n height: var(--a11y-min-size);\n place-items: center;\n }\n .kol-input.required .input-tooltip .span-label::after {\n content: \"*\";\n }\n}\n\n@layer kol-global {\n .sc-kol-input-date-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-date-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-date-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-input-date-default-h {\n display: block;\n }\n}\n@layer kol-component {\n .kol-alert-wc {\n display: grid;\n }\n .kol-alert-wc .heading {\n display: flex;\n place-items: center;\n }\n .kol-alert-wc .heading > div {\n flex-grow: 1;\n }\n .close {\n \n outline: transparent solid 1px;\n }\n}\n@layer kol-component {\n .sc-kol-input-date-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-number {\n display: block;\n }\n}";
|
|
7983
|
+
var KolInputDateDefaultStyle0 = defaultStyleCss$v;
|
|
7961
7984
|
|
|
7962
7985
|
class KolInputDate {
|
|
7963
7986
|
async getValue() {
|
|
@@ -7971,14 +7994,21 @@ class KolInputDate {
|
|
|
7971
7994
|
var _a;
|
|
7972
7995
|
(_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus();
|
|
7973
7996
|
}
|
|
7997
|
+
async reset() {
|
|
7998
|
+
this.state = Object.assign(Object.assign({}, this.state), { _value: null });
|
|
7999
|
+
this.controller.setFormAssociatedValue('');
|
|
8000
|
+
if (this.inputRef) {
|
|
8001
|
+
this.inputRef.value = '';
|
|
8002
|
+
}
|
|
8003
|
+
}
|
|
7974
8004
|
render() {
|
|
7975
8005
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
7976
8006
|
const hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
|
|
7977
8007
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
7978
|
-
return (hAsync(Host, { key: '
|
|
8008
|
+
return (hAsync(Host, { key: '702d112074b21ebebe3d0bfd1c72b84072b5699c', class: { 'kol-input-date': true, 'has-value': this.state._hasValue } }, hAsync(KolInputWcTag, { key: '80a45b6fd612ff657a8b81a6ca6feb68584a9a67', class: {
|
|
7979
8009
|
[this.state._type]: true,
|
|
7980
8010
|
'hide-label': !!this.state._hideLabel,
|
|
7981
|
-
}, _accessKey: this.state._accessKey, _disabled: this.state._disabled, _msg: this.state._msg, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _suggestions: this.state._suggestions, _readOnly: this.state._readOnly, _required: this.state._required, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched }, hAsync("span", { key: '
|
|
8011
|
+
}, _accessKey: this.state._accessKey, _disabled: this.state._disabled, _msg: this.state._msg, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _suggestions: this.state._suggestions, _readOnly: this.state._readOnly, _required: this.state._required, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched }, hAsync("span", { key: '8adae5fcf7811188438a4169ec5a631e83707b81', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedAccessKey, { accessKey: this.state._accessKey, label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, this.state._accessKey))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '7ba09a8bf14dbd25550538eb6f5e6435b0a9c020', slot: "input" }, hAsync("input", Object.assign({ key: '1155a4248a5517e5e3c525d34f68baa24c42eea6', ref: this.catchRef, title: "", accessKey: this.state._accessKey, "aria-describedby": ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, "aria-label": this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, autoCapitalize: "off", autoComplete: this.state._autoComplete, autoCorrect: "off", disabled: this.state._disabled, id: this.state._id, list: hasSuggestions ? `${this.state._id}-list` : undefined, max: this.state._max, min: this.state._min, name: this.state._name, readOnly: this.state._readOnly, required: this.state._required, step: this.state._step, spellcheck: "false", type: this.state._type, value: this.state._value || undefined }, this.controller.onFacade, { onKeyDown: this.onKeyDown }))))));
|
|
7982
8012
|
}
|
|
7983
8013
|
constructor(hostRef) {
|
|
7984
8014
|
registerInstance(this, hostRef);
|
|
@@ -8185,7 +8215,8 @@ class KolInputDate {
|
|
|
8185
8215
|
"state": [32],
|
|
8186
8216
|
"getValue": [64],
|
|
8187
8217
|
"focus": [64],
|
|
8188
|
-
"kolFocus": [64]
|
|
8218
|
+
"kolFocus": [64],
|
|
8219
|
+
"reset": [64]
|
|
8189
8220
|
},
|
|
8190
8221
|
"$listeners$": undefined,
|
|
8191
8222
|
"$lazyBundleId$": "-",
|
|
@@ -8293,8 +8324,8 @@ class InputEmailController extends InputTextEmailController {
|
|
|
8293
8324
|
}
|
|
8294
8325
|
}
|
|
8295
8326
|
|
|
8296
|
-
const defaultStyleCss$
|
|
8297
|
-
var KolInputEmailDefaultStyle0 = defaultStyleCss$
|
|
8327
|
+
const defaultStyleCss$u = "@layer kol-global {\n .sc-kol-input-email-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-email-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-email-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .required label > span::after,\n .required legend > span::after {\n content: \"*\";\n }\n}\n@layer kol-component {\n .sc-kol-input-email-default-h {\n display: block;\n }\n}\n@layer kol-component {\n input,\n textarea {\n cursor: text;\n }\n input[type=checkbox],\n input[type=color],\n input[type=file],\n input[type=radio],\n input[type=range],\n label,\n option,\n select {\n cursor: pointer;\n }\n \n \n \n input[type=color],\n input[type=date],\n input[type=datetime-local],\n input[type=email],\n input[type=file],\n input[type=month],\n input[type=number],\n input[type=password],\n input[type=search],\n input[type=tel],\n input[type=text],\n input[type=time],\n input[type=url],\n input[type=week],\n select,\n select[multiple] option,\n textarea {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n width: 100%;\n }\n \n input[type=file] {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n }\n \n select[multiple] option {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n }\n}\n@layer kol-component {\n .kol-input {\n display: grid;\n }\n .kol-input .input-slot {\n flex-grow: 1;\n }\n input:not([type=checkbox], [type=radio]),\n select:not([multiple], [size]) {\n height: 2.75em;\n }\n input:focus,\n option:focus,\n select:focus,\n textarea:focus {\n outline: 0;\n }\n .input {\n display: flex;\n align-items: center;\n }\n .input > .kol-icon {\n display: grid;\n height: var(--a11y-min-size);\n place-items: center;\n }\n .kol-input.required .input-tooltip .span-label::after {\n content: \"*\";\n }\n}\n\n@layer kol-global {\n .sc-kol-input-email-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-email-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-email-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-input-email-default-h {\n display: block;\n }\n}\n@layer kol-component {\n .kol-alert-wc {\n display: grid;\n }\n .kol-alert-wc .heading {\n display: flex;\n place-items: center;\n }\n .kol-alert-wc .heading > div {\n flex-grow: 1;\n }\n .close {\n \n outline: transparent solid 1px;\n }\n}\n@layer kol-component {\n .sc-kol-input-email-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n}";
|
|
8328
|
+
var KolInputEmailDefaultStyle0 = defaultStyleCss$u;
|
|
8298
8329
|
|
|
8299
8330
|
class KolInputEmail {
|
|
8300
8331
|
async getValue() {
|
|
@@ -8312,10 +8343,10 @@ class KolInputEmail {
|
|
|
8312
8343
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
8313
8344
|
const hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
|
|
8314
8345
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
8315
|
-
return (hAsync(Host, { key: '
|
|
8346
|
+
return (hAsync(Host, { key: '9805e2271b7c500f82bf4139a0e79ad31250abd5', class: {
|
|
8316
8347
|
'kol-input-email': true,
|
|
8317
8348
|
'has-value': this.state._hasValue,
|
|
8318
|
-
} }, hAsync(KolInputWcTag, { key: '
|
|
8349
|
+
} }, hAsync(KolInputWcTag, { key: '46d39246c8d3341d6ac8eb84713192d45ea7bf43', class: { email: true, 'hide-label': !!this.state._hideLabel }, _accessKey: this.state._accessKey, _alert: this.state._alert, _currentLength: this.state._currentLength, _disabled: this.state._disabled, _msg: this.state._msg, _hideError: this.state._hideError, _hasCounter: this.state._hasCounter, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _suggestions: this.state._suggestions, _maxLength: this.state._maxLength, _readOnly: this.state._readOnly, _required: this.state._required, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '6c1435823dc4605fd616197f134c7bcea25b9413', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedAccessKey, { accessKey: this.state._accessKey, label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, this.state._accessKey))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '268d7946d7710ddc33fcddd426d9b69c838f84a7', slot: "input" }, hAsync("input", Object.assign({ key: 'b9a448da358a703ab14370de43fc7d66c6add4a5', ref: this.catchRef, title: "", accessKey: this.state._accessKey, "aria-describedby": ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, "aria-label": this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, autoCapitalize: "off", autoComplete: this.state._autoComplete, autoCorrect: "off", disabled: this.state._disabled, multiple: this.state._multiple, id: this.state._id, list: hasSuggestions ? `${this.state._id}-list` : undefined, maxlength: this.state._maxLength, name: this.state._name, pattern: this.state._pattern, placeholder: this.state._placeholder, readOnly: this.state._readOnly, required: this.state._required, spellcheck: "false", type: "email", value: this.state._value }, this.controller.onFacade, { onKeyDown: this.onKeyDown, onInput: this.onInput }))))));
|
|
8319
8350
|
}
|
|
8320
8351
|
constructor(hostRef) {
|
|
8321
8352
|
registerInstance(this, hostRef);
|
|
@@ -8564,8 +8595,8 @@ class InputFileController extends InputIconController {
|
|
|
8564
8595
|
}
|
|
8565
8596
|
}
|
|
8566
8597
|
|
|
8567
|
-
const defaultStyleCss$
|
|
8568
|
-
var KolInputFileDefaultStyle0 = defaultStyleCss$
|
|
8598
|
+
const defaultStyleCss$t = "@charset \"UTF-8\";\n\n@layer kol-global {\n .sc-kol-input-file-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-file-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-file-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .required label > span::after,\n .required legend > span::after {\n content: \"*\";\n }\n}\n@layer kol-component {\n .sc-kol-input-file-default-h {\n display: block;\n }\n}\n@layer kol-component {\n input,\n textarea {\n cursor: text;\n }\n input[type=checkbox],\n input[type=color],\n input[type=file],\n input[type=radio],\n input[type=range],\n label,\n option,\n select {\n cursor: pointer;\n }\n \n \n \n input[type=color],\n input[type=date],\n input[type=datetime-local],\n input[type=email],\n input[type=file],\n input[type=month],\n input[type=number],\n input[type=password],\n input[type=search],\n input[type=tel],\n input[type=text],\n input[type=time],\n input[type=url],\n input[type=week],\n select,\n select[multiple] option,\n textarea {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n width: 100%;\n }\n \n input[type=file] {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n }\n \n select[multiple] option {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n }\n}\n@layer kol-component {\n .kol-input {\n display: grid;\n }\n .kol-input .input-slot {\n flex-grow: 1;\n }\n input:not([type=checkbox], [type=radio]),\n select:not([multiple], [size]) {\n height: 2.75em;\n }\n input:focus,\n option:focus,\n select:focus,\n textarea:focus {\n outline: 0;\n }\n .input {\n display: flex;\n align-items: center;\n }\n .input > .kol-icon {\n display: grid;\n height: var(--a11y-min-size);\n place-items: center;\n }\n .kol-input.required .input-tooltip .span-label::after {\n content: \"*\";\n }\n}\n\n@layer kol-global {\n .sc-kol-input-file-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-file-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-file-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-input-file-default-h {\n display: block;\n }\n}\n@layer kol-component {\n .kol-alert-wc {\n display: grid;\n }\n .kol-alert-wc .heading {\n display: flex;\n place-items: center;\n }\n .kol-alert-wc .heading > div {\n flex-grow: 1;\n }\n .close {\n \n outline: transparent solid 1px;\n }\n}\n@layer kol-component {\n .sc-kol-input-file-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n label input[type=file]::-webkit-file-upload-button {\n display: none;\n }\n label input[type=file]:before {\n content: \"Datei auswählen\";\n }\n label input[multiple]:before {\n content: \"Dateien auswählen\";\n }\n div.input {\n cursor: pointer;\n }\n}";
|
|
8599
|
+
var KolInputFileDefaultStyle0 = defaultStyleCss$t;
|
|
8569
8600
|
|
|
8570
8601
|
class KolInputFile {
|
|
8571
8602
|
async getValue() {
|
|
@@ -8582,10 +8613,10 @@ class KolInputFile {
|
|
|
8582
8613
|
render() {
|
|
8583
8614
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
8584
8615
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
8585
|
-
return (hAsync(Host, { key: '
|
|
8616
|
+
return (hAsync(Host, { key: 'efceaa84a757cd53737d20b7220f61736e15aad3', class: "kol-input-file" }, hAsync(KolInputWcTag, { key: '12f42cbaa35e9c8520f0b0f6e66d791e287c0563', class: {
|
|
8586
8617
|
file: true,
|
|
8587
8618
|
'hide-label': !!this.state._hideLabel,
|
|
8588
|
-
}, _accessKey: this.state._accessKey, _disabled: this.state._disabled, _msg: this.state._msg, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _required: this.state._required, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '
|
|
8619
|
+
}, _accessKey: this.state._accessKey, _disabled: this.state._disabled, _msg: this.state._msg, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _required: this.state._required, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: 'd08326c76f8c30a2ba6d080a5d6dd27abcffd03f', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedAccessKey, { accessKey: this.state._accessKey, label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, this.state._accessKey))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: 'c676203deb04e250d3d268c874fbd7ea0941b704', slot: "input" }, hAsync("input", Object.assign({ key: '361467cb53b3337e413bccd182cc24c0adef2208', ref: this.catchRef, title: "", accept: this.state._accept, accessKey: this.state._accessKey, "aria-describedby": ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, "aria-label": this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, autoCapitalize: "off", autoCorrect: "off", disabled: this.state._disabled, id: this.state._id, multiple: this.state._multiple, name: this.state._name, required: this.state._required, spellcheck: "false", type: "file", value: this.state._value }, this.controller.onFacade, { onChange: this.onChange, onInput: this.onInput }))))));
|
|
8589
8620
|
}
|
|
8590
8621
|
constructor(hostRef) {
|
|
8591
8622
|
registerInstance(this, hostRef);
|
|
@@ -8848,8 +8879,8 @@ class InputNumberController extends InputIconController {
|
|
|
8848
8879
|
}
|
|
8849
8880
|
}
|
|
8850
8881
|
|
|
8851
|
-
const defaultStyleCss$
|
|
8852
|
-
var KolInputNumberDefaultStyle0 = defaultStyleCss$
|
|
8882
|
+
const defaultStyleCss$s = "@layer kol-global {\n .sc-kol-input-number-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-number-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-number-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .required label > span::after,\n .required legend > span::after {\n content: \"*\";\n }\n}\n@layer kol-component {\n .sc-kol-input-number-default-h {\n display: block;\n }\n}\n@layer kol-component {\n input,\n textarea {\n cursor: text;\n }\n input[type=checkbox],\n input[type=color],\n input[type=file],\n input[type=radio],\n input[type=range],\n label,\n option,\n select {\n cursor: pointer;\n }\n \n \n \n input[type=color],\n input[type=date],\n input[type=datetime-local],\n input[type=email],\n input[type=file],\n input[type=month],\n input[type=number],\n input[type=password],\n input[type=search],\n input[type=tel],\n input[type=text],\n input[type=time],\n input[type=url],\n input[type=week],\n select,\n select[multiple] option,\n textarea {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n width: 100%;\n }\n \n input[type=file] {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n }\n \n select[multiple] option {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n }\n}\n@layer kol-component {\n .kol-input {\n display: grid;\n }\n .kol-input .input-slot {\n flex-grow: 1;\n }\n input:not([type=checkbox], [type=radio]),\n select:not([multiple], [size]) {\n height: 2.75em;\n }\n input:focus,\n option:focus,\n select:focus,\n textarea:focus {\n outline: 0;\n }\n .input {\n display: flex;\n align-items: center;\n }\n .input > .kol-icon {\n display: grid;\n height: var(--a11y-min-size);\n place-items: center;\n }\n .kol-input.required .input-tooltip .span-label::after {\n content: \"*\";\n }\n}\n\n@layer kol-global {\n .sc-kol-input-number-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-number-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-number-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-input-number-default-h {\n display: block;\n }\n}\n@layer kol-component {\n .kol-alert-wc {\n display: grid;\n }\n .kol-alert-wc .heading {\n display: flex;\n place-items: center;\n }\n .kol-alert-wc .heading > div {\n flex-grow: 1;\n }\n .close {\n \n outline: transparent solid 1px;\n }\n}\n@layer kol-component {\n .sc-kol-input-number-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n}";
|
|
8883
|
+
var KolInputNumberDefaultStyle0 = defaultStyleCss$s;
|
|
8853
8884
|
|
|
8854
8885
|
class KolInputNumber {
|
|
8855
8886
|
async getValue() {
|
|
@@ -8867,13 +8898,13 @@ class KolInputNumber {
|
|
|
8867
8898
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
8868
8899
|
const hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
|
|
8869
8900
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
8870
|
-
return (hAsync(Host, { key: '
|
|
8901
|
+
return (hAsync(Host, { key: '81000a7bf494e4abd5281aeac94e738eb637ccd6', class: {
|
|
8871
8902
|
'kol-input-number': true,
|
|
8872
8903
|
'has-value': this.state._hasValue,
|
|
8873
|
-
} }, hAsync(KolInputWcTag, { key: '
|
|
8904
|
+
} }, hAsync(KolInputWcTag, { key: '11abee4d50763dd2fa4173ca2fe8bef11804dba5', class: {
|
|
8874
8905
|
number: true,
|
|
8875
8906
|
'hide-label': !!this.state._hideLabel,
|
|
8876
|
-
}, _accessKey: this.state._accessKey, _disabled: this.state._disabled, _msg: this.state._msg, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _suggestions: this.state._suggestions, _readOnly: this.state._readOnly, _required: this.state._required, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched }, hAsync("span", { key: '
|
|
8907
|
+
}, _accessKey: this.state._accessKey, _disabled: this.state._disabled, _msg: this.state._msg, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _suggestions: this.state._suggestions, _readOnly: this.state._readOnly, _required: this.state._required, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched }, hAsync("span", { key: '71697783e12295452d0d88fedb0e8238566d8563', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedAccessKey, { accessKey: this.state._accessKey, label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, this.state._accessKey))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: 'fce83e82a2b487c1ea9bf293f40deaf82559f892', slot: "input" }, hAsync("input", Object.assign({ key: 'c8d50acdffc50266bc1b4a13ae660c1fa43ad851', ref: this.catchRef, title: "", accessKey: this.state._accessKey, "aria-describedby": ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, "aria-label": this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, autoCapitalize: "off", autoComplete: this.state._autoComplete, autoCorrect: "off", disabled: this.state._disabled, id: this.state._id, list: hasSuggestions ? `${this.state._id}-list` : undefined, max: this.state._max, min: this.state._min, name: this.state._name, readOnly: this.state._readOnly, required: this.state._required, placeholder: this.state._placeholder, step: this.state._step, spellcheck: "false", type: "number", value: this.state._value }, this.controller.onFacade, { onKeyDown: this.onKeyDown }))))));
|
|
8877
8908
|
}
|
|
8878
8909
|
constructor(hostRef) {
|
|
8879
8910
|
registerInstance(this, hostRef);
|
|
@@ -9088,8 +9119,8 @@ class KolInputNumber {
|
|
|
9088
9119
|
}; }
|
|
9089
9120
|
}
|
|
9090
9121
|
|
|
9091
|
-
const defaultStyleCss$
|
|
9092
|
-
var KolInputPasswordDefaultStyle0 = defaultStyleCss$
|
|
9122
|
+
const defaultStyleCss$r = "@layer kol-global {\n .sc-kol-input-password-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-password-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-password-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .required label > span::after,\n .required legend > span::after {\n content: \"*\";\n }\n}\n@layer kol-component {\n .sc-kol-input-password-default-h {\n display: block;\n }\n}\n@layer kol-component {\n input,\n textarea {\n cursor: text;\n }\n input[type=checkbox],\n input[type=color],\n input[type=file],\n input[type=radio],\n input[type=range],\n label,\n option,\n select {\n cursor: pointer;\n }\n \n \n \n input[type=color],\n input[type=date],\n input[type=datetime-local],\n input[type=email],\n input[type=file],\n input[type=month],\n input[type=number],\n input[type=password],\n input[type=search],\n input[type=tel],\n input[type=text],\n input[type=time],\n input[type=url],\n input[type=week],\n select,\n select[multiple] option,\n textarea {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n width: 100%;\n }\n \n input[type=file] {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n }\n \n select[multiple] option {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n }\n}\n@layer kol-component {\n .kol-input {\n display: grid;\n }\n .kol-input .input-slot {\n flex-grow: 1;\n }\n input:not([type=checkbox], [type=radio]),\n select:not([multiple], [size]) {\n height: 2.75em;\n }\n input:focus,\n option:focus,\n select:focus,\n textarea:focus {\n outline: 0;\n }\n .input {\n display: flex;\n align-items: center;\n }\n .input > .kol-icon {\n display: grid;\n height: var(--a11y-min-size);\n place-items: center;\n }\n .kol-input.required .input-tooltip .span-label::after {\n content: \"*\";\n }\n}\n\n@layer kol-global {\n .sc-kol-input-password-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-password-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-password-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-input-password-default-h {\n display: block;\n }\n}\n@layer kol-component {\n .kol-alert-wc {\n display: grid;\n }\n .kol-alert-wc .heading {\n display: flex;\n place-items: center;\n }\n .kol-alert-wc .heading > div {\n flex-grow: 1;\n }\n .close {\n \n outline: transparent solid 1px;\n }\n}\n@layer kol-component {\n .sc-kol-input-password-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .password-toggle-button {\n position: absolute;\n transform: translateX(-100%);\n }\n .kol-tooltip-wc {\n --kol-tooltip-width: 10rem;\n }\n}";
|
|
9123
|
+
var KolInputPasswordDefaultStyle0 = defaultStyleCss$r;
|
|
9093
9124
|
|
|
9094
9125
|
class KolInputPassword {
|
|
9095
9126
|
async getValue() {
|
|
@@ -9107,13 +9138,13 @@ class KolInputPassword {
|
|
|
9107
9138
|
var _a;
|
|
9108
9139
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
9109
9140
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
9110
|
-
return (hAsync(Host, { key: '
|
|
9141
|
+
return (hAsync(Host, { key: '20558e28f4159cd21468a4065c4a4030ae716fcb', class: {
|
|
9111
9142
|
'kol-input-password': true,
|
|
9112
9143
|
'has-value': this.state._hasValue,
|
|
9113
|
-
} }, hAsync(KolInputWcTag, { key: '
|
|
9144
|
+
} }, hAsync(KolInputWcTag, { key: '80c0a71ec8d29bbcfb41f7a4c75f8e9c14dd84a2', class: {
|
|
9114
9145
|
'hide-label': !!this.state._hideLabel,
|
|
9115
9146
|
password: true,
|
|
9116
|
-
}, _accessKey: this.state._accessKey, _currentLength: this.state._currentLength, _disabled: this.state._disabled, _msg: this.state._msg, _hasCounter: this.state._hasCounter, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _maxLength: this.state._maxLength, _readOnly: this.state._readOnly, _required: this.state._required, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '
|
|
9147
|
+
}, _accessKey: this.state._accessKey, _currentLength: this.state._currentLength, _disabled: this.state._disabled, _msg: this.state._msg, _hasCounter: this.state._hasCounter, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _maxLength: this.state._maxLength, _readOnly: this.state._readOnly, _required: this.state._required, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '9abe59941ecefc250a48aed7b456af4c3621618e', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedAccessKey, { accessKey: this.state._accessKey, label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, this.state._accessKey))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '70e566ef7a8df355ac04633ab9ac2ccc9037e008', slot: "input" }, hAsync("input", Object.assign({ key: '5a9714fd29f34c9d632adf8577f066651278fdb4', ref: this.catchRef, title: "", accessKey: this.state._accessKey, "aria-describedby": ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, "aria-label": this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, autoCapitalize: "off", autoComplete: this.state._autoComplete, autoCorrect: "off", disabled: this.state._disabled, id: this.state._id, maxlength: this.state._maxLength, name: this.state._name, pattern: this.state._pattern, placeholder: this.state._placeholder, readOnly: this.state._readOnly, required: this.state._required, spellcheck: "false", type: this._passwordVisible ? 'text' : 'password', value: this.state._value }, this.controller.onFacade, { onKeyDown: this.onKeyDown, onInput: this.onInput })), this._variant === 'visibility-toggle' && this.inputRef && ((_a = this.inputRef.value) === null || _a === void 0 ? void 0 : _a.length) > 0 ? (hAsync(KolButtonWcTag, { class: "password-toggle-button", _label: this._passwordVisible ? translate('kol-hide-password') : translate('kol-show-password'), _variant: "ghost", _on: {
|
|
9117
9148
|
onClick: () => {
|
|
9118
9149
|
this._passwordVisible = !this._passwordVisible;
|
|
9119
9150
|
},
|
|
@@ -9343,8 +9374,8 @@ const FormFieldMsg = ({ _alert, _msg, _hideError, _id }) => (hAsync(KolAlertWcTa
|
|
|
9343
9374
|
'visually-hidden': _hideError === true,
|
|
9344
9375
|
} }, _msg), (_msg === null || _msg === void 0 ? void 0 : _msg._description) || undefined));
|
|
9345
9376
|
|
|
9346
|
-
const defaultStyleCss$
|
|
9347
|
-
var KolInputRadioDefaultStyle0 = defaultStyleCss$
|
|
9377
|
+
const defaultStyleCss$q = "@layer kol-global {\n .sc-kol-input-radio-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-radio-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-radio-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .required label > span::after,\n .required legend > span::after {\n content: \"*\";\n }\n}\n@layer kol-component {\n .sc-kol-input-radio-default-h {\n display: block;\n }\n}\n@layer kol-component {\n input,\n textarea {\n cursor: text;\n }\n input[type=checkbox],\n input[type=color],\n input[type=file],\n input[type=radio],\n input[type=range],\n label,\n option,\n select {\n cursor: pointer;\n }\n \n \n \n input[type=color],\n input[type=date],\n input[type=datetime-local],\n input[type=email],\n input[type=file],\n input[type=month],\n input[type=number],\n input[type=password],\n input[type=search],\n input[type=tel],\n input[type=text],\n input[type=time],\n input[type=url],\n input[type=week],\n select,\n select[multiple] option,\n textarea {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n width: 100%;\n }\n \n input[type=file] {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n }\n \n select[multiple] option {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n }\n}\n\n@layer kol-global {\n .sc-kol-input-radio-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-radio-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-radio-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-input-radio-default-h {\n display: block;\n }\n}\n@layer kol-component {\n .kol-alert-wc {\n display: grid;\n }\n .kol-alert-wc .heading {\n display: flex;\n place-items: center;\n }\n .kol-alert-wc .heading > div {\n flex-grow: 1;\n }\n .close {\n \n outline: transparent solid 1px;\n }\n}\n@layer kol-component {\n .sc-kol-input-radio-default-h {\n --border-width: 2px;\n --input-size: 1.5em;\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input .icons {\n display: none;\n }\n label {\n cursor: pointer;\n }\n input {\n appearance: none;\n border-width: var(--border-width);\n border-style: solid;\n border-radius: 100%;\n cursor: pointer;\n display: flex;\n height: var(--input-size);\n margin: 0;\n min-height: var(--input-size);\n min-width: var(--input-size);\n padding: 0;\n width: var(--input-size);\n }\n input:before {\n border-radius: 100%;\n content: \"\";\n margin: auto;\n height: calc(var(--input-size) / 2);\n width: calc(var(--input-size) / 2);\n }\n input:checked:before {\n background-color: #000;\n }\n @media (forced-colors: active) {\n input:checked:before {\n \n background: selectedItem !important;\n }\n }\n fieldset {\n display: flex;\n }\n fieldset.vertical {\n flex-direction: column;\n }\n fieldset .input-slot {\n align-items: center;\n display: flex;\n }\n \n .required label > span::after {\n content: \"\";\n }\n}";
|
|
9378
|
+
var KolInputRadioDefaultStyle0 = defaultStyleCss$q;
|
|
9348
9379
|
|
|
9349
9380
|
class KolInputRadio {
|
|
9350
9381
|
async getValue() {
|
|
@@ -9360,27 +9391,28 @@ class KolInputRadio {
|
|
|
9360
9391
|
render() {
|
|
9361
9392
|
const { ariaDescribedBy, hasError } = getRenderStates(this.state);
|
|
9362
9393
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
9363
|
-
|
|
9394
|
+
const hasHint = typeof this._hint === 'string' && this._hint.length > 0;
|
|
9395
|
+
return (hAsync(Host, { key: '8d94c2bfd3910da2f843f83fbbc6a0a8ba99a9e1', class: "kol-input-radio" }, hAsync("fieldset", { key: '60af273b8ba191f863533eb0827dccea6a575068', class: {
|
|
9364
9396
|
fieldset: true,
|
|
9365
9397
|
disabled: this.state._disabled === true,
|
|
9366
9398
|
error: hasError === true,
|
|
9367
9399
|
required: this.state._required === true,
|
|
9368
9400
|
'hidden-error': this._hideError === true,
|
|
9369
9401
|
[this.state._orientation]: true,
|
|
9370
|
-
} }, hAsync("legend", { key: '
|
|
9402
|
+
} }, hAsync("legend", { key: 'fd900cabfadbae5f70bcee600392cb5dd389b7b4', class: "block w-full mb-1 leading-normal" }, hAsync("span", { key: '72b4bb6c92d7d1a7be86f4f9949d94e93939181f' }, hAsync("span", { key: 'a6f1ab66019aaabc60191f8e580077e238f5d2fb', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this._accessKey === 'string' ? (hAsync(InternalUnderlinedAccessKey, { accessKey: this._accessKey, label: this._label })) : (this._label)))), this.state._options.map((option, index) => {
|
|
9371
9403
|
const customId = `${this.state._id}-${index}`;
|
|
9372
9404
|
const slotName = `radio-${index}`;
|
|
9373
9405
|
const selected = this.state._value === option.value;
|
|
9374
9406
|
return (hAsync(KolInputWcTag, { class: {
|
|
9375
9407
|
radio: true,
|
|
9376
9408
|
disabled: Boolean(this.state._disabled || option.disabled),
|
|
9377
|
-
}, key: customId, _accessKey: this.state._accessKey, _disabled: this.state._disabled || option.disabled, _hideLabel: this.state._hideLabel, _hint:
|
|
9409
|
+
}, key: customId, _accessKey: this.state._accessKey, _disabled: this.state._disabled || option.disabled, _hideLabel: this.state._hideLabel, _hint: option.hint, _id: customId, _label: option.label, _renderNoLabel: true, _required: this.state._required, _slotName: slotName, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched }, hAsync("div", { slot: slotName, class: "radio-input-wrapper" }, hAsync("input", Object.assign({ ref: this.state._value === option.value ? this.catchRef : undefined, title: "", accessKey: this.state._accessKey, "aria-describedby": ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, "aria-label": this.state._hideLabel && typeof option.label === 'string' ? option.label : undefined, type: "radio", id: customId, checked: selected, name: this.state._name || this.state._id, disabled: this.state._disabled || option.disabled, required: this.state._required, tabIndex: this.state._tabIndex, value: `-${index}` }, this.controller.onFacade, { onChange: this.onChange, onClick: undefined, onInput: this.onInput, onKeyDown: this.onKeyDown.bind(this) })), hAsync("label", { class: "radio-label", htmlFor: `${customId}`, style: {
|
|
9378
9410
|
height: this.state._hideLabel ? '0' : undefined,
|
|
9379
9411
|
margin: this.state._hideLabel ? '0' : undefined,
|
|
9380
9412
|
padding: this.state._hideLabel ? '0' : undefined,
|
|
9381
9413
|
visibility: this.state._hideLabel ? 'hidden' : undefined,
|
|
9382
9414
|
} }, hAsync("span", null, hAsync("span", { class: "radio-label-span-inner" }, option.label))))));
|
|
9383
|
-
}), hasError && hAsync(FormFieldMsg, { key: '
|
|
9415
|
+
}), hasError && hAsync(FormFieldMsg, { key: '6072e96fde527eb74d64848f8f7f21414a676129', _alert: this.state._alert, _hideError: this.state._hideError, _msg: this.state._msg, _id: this.state._id }), hasHint && hAsync("span", { key: 'd83437c8308c51c9bae5c64263d7d5bdd8a0d085', class: "hint" }, this.state._hint))));
|
|
9384
9416
|
}
|
|
9385
9417
|
constructor(hostRef) {
|
|
9386
9418
|
registerInstance(this, hostRef);
|
|
@@ -9613,8 +9645,8 @@ class InputRangeController extends InputIconController {
|
|
|
9613
9645
|
}
|
|
9614
9646
|
}
|
|
9615
9647
|
|
|
9616
|
-
const defaultStyleCss$
|
|
9617
|
-
var KolInputRangeDefaultStyle0 = defaultStyleCss$
|
|
9648
|
+
const defaultStyleCss$p = "@layer kol-global {\n .sc-kol-input-range-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-range-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-range-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-input-range-default-h {\n display: block;\n }\n}\n\n@layer kol-global {\n .sc-kol-input-range-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-range-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-range-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .required label > span::after,\n .required legend > span::after {\n content: \"*\";\n }\n}\n@layer kol-component {\n .sc-kol-input-range-default-h {\n display: block;\n }\n}\n@layer kol-component {\n input,\n textarea {\n cursor: text;\n }\n input[type=checkbox],\n input[type=color],\n input[type=file],\n input[type=radio],\n input[type=range],\n label,\n option,\n select {\n cursor: pointer;\n }\n \n \n \n input[type=color],\n input[type=date],\n input[type=datetime-local],\n input[type=email],\n input[type=file],\n input[type=month],\n input[type=number],\n input[type=password],\n input[type=search],\n input[type=tel],\n input[type=text],\n input[type=time],\n input[type=url],\n input[type=week],\n select,\n select[multiple] option,\n textarea {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n width: 100%;\n }\n \n input[type=file] {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n }\n \n select[multiple] option {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n }\n}\n@layer kol-component {\n .kol-input {\n display: grid;\n }\n .kol-input .input-slot {\n flex-grow: 1;\n }\n input:not([type=checkbox], [type=radio]),\n select:not([multiple], [size]) {\n height: 2.75em;\n }\n input:focus,\n option:focus,\n select:focus,\n textarea:focus {\n outline: 0;\n }\n .input {\n display: flex;\n align-items: center;\n }\n .input > .kol-icon {\n display: grid;\n height: var(--a11y-min-size);\n place-items: center;\n }\n .kol-input.required .input-tooltip .span-label::after {\n content: \"*\";\n }\n}\n@layer kol-component {\n .kol-alert-wc {\n display: grid;\n }\n .kol-alert-wc .heading {\n display: flex;\n place-items: center;\n }\n .kol-alert-wc .heading > div {\n flex-grow: 1;\n }\n .close {\n \n outline: transparent solid 1px;\n }\n}\n@layer kol-component {\n .sc-kol-input-range-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .inputs-wrapper {\n align-items: center;\n display: flex;\n flex-direction: row;\n }\n input[type=number] {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n width: var(--kolibri-input-range--input-number--width);\n }\n \n input[type=range] {\n appearance: none;\n background-color: #d3d3d3;\n border: 1px solid #000;\n display: inline-block;\n flex-grow: 1;\n height: calc(8rem / var(--kolibri-root-font-size, 16));\n line-height: 1.5em;\n padding: 0;\n margin: 0;\n \n width: 0;\n }\n input[type=range]::-webkit-slider-thumb {\n box-sizing: border-box;\n background-color: #000;\n height: 20px;\n width: 20px;\n border-radius: 20px;\n cursor: pointer;\n -webkit-appearance: none;\n }\n input[type=range]::-moz-range-thumb {\n box-sizing: border-box;\n background-color: #000;\n height: 20px;\n width: 20px;\n border-radius: 20px;\n cursor: pointer;\n -moz-appearance: none;\n }\n}\n\n@media (prefers-contrast: more) {\n /*!@::-webkit-slider-thumb*/.sc-kol-input-range-default::-webkit-slider-thumb {\n outline: 1px solid currentColor;\n }\n}";
|
|
9649
|
+
var KolInputRangeDefaultStyle0 = defaultStyleCss$p;
|
|
9618
9650
|
|
|
9619
9651
|
class KolInputRange {
|
|
9620
9652
|
async focus() {
|
|
@@ -9650,13 +9682,13 @@ class KolInputRange {
|
|
|
9650
9682
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
9651
9683
|
const hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
|
|
9652
9684
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
9653
|
-
return (hAsync(Host, { key: '
|
|
9685
|
+
return (hAsync(Host, { key: '28889eca78824731dd9ab19d00dea0827a5afcea', class: "kol-input-range" }, hAsync(KolInputWcTag, { key: '3b719c8e9c17e2a2599a985eea5ddda2bb65cd9c', class: {
|
|
9654
9686
|
range: true,
|
|
9655
9687
|
'hide-label': !!this.state._hideLabel,
|
|
9656
|
-
}, _accessKey: this.state._accessKey, _disabled: this.state._disabled, _msg: this.state._msg, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched }, hAsync("span", { key: '
|
|
9688
|
+
}, _accessKey: this.state._accessKey, _disabled: this.state._disabled, _msg: this.state._msg, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched }, hAsync("span", { key: '4b1b79528c72048a8e265a3037bb28577a465fec', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedAccessKey, { accessKey: this.state._accessKey, label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, this.state._accessKey))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '4c7010af2b340fdaac426e586cb1564465516007', slot: "input" }, hAsync("div", { key: '9905736abf063cd1f59a6e03a7e59103491f9bf0', class: "inputs-wrapper", style: {
|
|
9657
9689
|
'--kolibri-input-range--input-number--width': `${this.state._max}`.length + 0.5 + 'em',
|
|
9658
|
-
} }, hAsync("input", Object.assign({ key: '
|
|
9659
|
-
hAsync("datalist", { key: '
|
|
9690
|
+
} }, hAsync("input", Object.assign({ key: '815809e5edd806b6a870e7bfef7cc104188baa59', ref: this.catchInputRangeRef, title: "", accessKey: this.state._accessKey, "aria-describedby": ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, "aria-label": this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, "aria-hidden": "true", autoCapitalize: "off", autoComplete: this.state._autoComplete, autoCorrect: "off", disabled: this.state._disabled, list: hasSuggestions ? `${this.state._id}-list` : undefined, max: this.state._max, min: this.state._min, name: this.state._name ? `${this.state._name}-range` : undefined, spellcheck: "false", step: this.state._step, tabIndex: -1, type: "range", value: this.state._value }, this.controller.onFacade, { onChange: this.onChange })), hAsync("input", Object.assign({ key: '6e9cbf94d8cc18700889f51af680ca3ba7a3cf18', ref: this.catchInputNumberRef, title: "", accessKey: this.state._accessKey, "aria-describedby": ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, "aria-label": this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, autoCapitalize: "off", autoComplete: this.state._autoComplete, autoCorrect: "off", disabled: this.state._disabled, id: this.state._id, list: hasSuggestions ? `${this.state._id}-list` : undefined, max: this.state._max, min: this.state._min, name: this.state._name ? `${this.state._name}-number` : undefined, step: this.state._step, type: "number", value: this.state._value }, this.controller.onFacade, { onKeyDown: this.onKeyDown, onChange: this.onChange }))), hasSuggestions && [
|
|
9691
|
+
hAsync("datalist", { key: 'bb323dab931690da57ce688ba59c1016ec5e9df3', id: `${this.state._id}-list` }, this.state._suggestions.map((option) => (hAsync("option", { value: option })))),
|
|
9660
9692
|
]))));
|
|
9661
9693
|
}
|
|
9662
9694
|
constructor(hostRef) {
|
|
@@ -9861,8 +9893,8 @@ class KolInputRange {
|
|
|
9861
9893
|
}; }
|
|
9862
9894
|
}
|
|
9863
9895
|
|
|
9864
|
-
const defaultStyleCss$
|
|
9865
|
-
var KolInputTextDefaultStyle0 = defaultStyleCss$
|
|
9896
|
+
const defaultStyleCss$o = "@layer kol-global {\n .sc-kol-input-text-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-text-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-text-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .required label > span::after,\n .required legend > span::after {\n content: \"*\";\n }\n}\n@layer kol-component {\n .sc-kol-input-text-default-h {\n display: block;\n }\n}\n@layer kol-component {\n input,\n textarea {\n cursor: text;\n }\n input[type=checkbox],\n input[type=color],\n input[type=file],\n input[type=radio],\n input[type=range],\n label,\n option,\n select {\n cursor: pointer;\n }\n \n \n \n input[type=color],\n input[type=date],\n input[type=datetime-local],\n input[type=email],\n input[type=file],\n input[type=month],\n input[type=number],\n input[type=password],\n input[type=search],\n input[type=tel],\n input[type=text],\n input[type=time],\n input[type=url],\n input[type=week],\n select,\n select[multiple] option,\n textarea {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n width: 100%;\n }\n \n input[type=file] {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n }\n \n select[multiple] option {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n }\n}\n@layer kol-component {\n .kol-input {\n display: grid;\n }\n .kol-input .input-slot {\n flex-grow: 1;\n }\n input:not([type=checkbox], [type=radio]),\n select:not([multiple], [size]) {\n height: 2.75em;\n }\n input:focus,\n option:focus,\n select:focus,\n textarea:focus {\n outline: 0;\n }\n .input {\n display: flex;\n align-items: center;\n }\n .input > .kol-icon {\n display: grid;\n height: var(--a11y-min-size);\n place-items: center;\n }\n .kol-input.required .input-tooltip .span-label::after {\n content: \"*\";\n }\n}\n\n@layer kol-global {\n .sc-kol-input-text-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-input-text-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-input-text-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-input-text-default-h {\n display: block;\n }\n}\n@layer kol-component {\n .kol-alert-wc {\n display: grid;\n }\n .kol-alert-wc .heading {\n display: flex;\n place-items: center;\n }\n .kol-alert-wc .heading > div {\n flex-grow: 1;\n }\n .close {\n \n outline: transparent solid 1px;\n }\n}\n@layer kol-component {\n .sc-kol-input-text-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n}";
|
|
9897
|
+
var KolInputTextDefaultStyle0 = defaultStyleCss$o;
|
|
9866
9898
|
|
|
9867
9899
|
class KolInputText {
|
|
9868
9900
|
async getValue() {
|
|
@@ -9880,13 +9912,13 @@ class KolInputText {
|
|
|
9880
9912
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
9881
9913
|
const hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
|
|
9882
9914
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
9883
|
-
return (hAsync(Host, { key: '
|
|
9915
|
+
return (hAsync(Host, { key: '81f68808536bc1b058df7c8f3f45885330654323', class: {
|
|
9884
9916
|
'has-value': this.state._hasValue,
|
|
9885
9917
|
'kol-input-text': true,
|
|
9886
|
-
} }, hAsync(KolInputWcTag, { key: '
|
|
9918
|
+
} }, hAsync(KolInputWcTag, { key: '3fbe1c4558e8c9181df57b9b6fa3c98265c57441', class: {
|
|
9887
9919
|
[this.state._type]: true,
|
|
9888
9920
|
'hide-label': !!this.state._hideLabel,
|
|
9889
|
-
}, _accessKey: this.state._accessKey, _currentLength: this.state._currentLength, _disabled: this.state._disabled, _hasCounter: this.state._hasCounter, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _maxLength: this.state._maxLength, _msg: this.state._msg, _readOnly: this.state._readOnly, _required: this.state._required, _smartButton: this.state._smartButton, _suggestions: this.state._suggestions, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '
|
|
9921
|
+
}, _accessKey: this.state._accessKey, _currentLength: this.state._currentLength, _disabled: this.state._disabled, _hasCounter: this.state._hasCounter, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _maxLength: this.state._maxLength, _msg: this.state._msg, _readOnly: this.state._readOnly, _required: this.state._required, _smartButton: this.state._smartButton, _suggestions: this.state._suggestions, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '6739ff81c71402010ebea531690a10cf390a2d85', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedAccessKey, { accessKey: this.state._accessKey, label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, this.state._accessKey))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '6edb007258975353d3ed10117fade186045edb3f', slot: "input" }, hAsync("input", Object.assign({ key: 'dbf8ca12d391e22caec74363b3a63f72ebcefdbe', ref: this.catchRef, title: "", accessKey: this.state._accessKey, "aria-describedby": ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, "aria-label": this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, autoCapitalize: "off", autoComplete: this.state._autoComplete, autoCorrect: "off", disabled: this.state._disabled, id: this.state._id, list: hasSuggestions ? `${this.state._id}-list` : undefined, maxlength: this.state._maxLength, name: this.state._name, pattern: this.state._pattern, placeholder: this.state._placeholder, readOnly: this.state._readOnly, required: this.state._required, spellcheck: "false", type: this.state._type, value: this.state._value }, this.controller.onFacade, { onChange: this.onChange, onInput: this.onInput, onKeyDown: this.onKeyDown }))))));
|
|
9890
9922
|
}
|
|
9891
9923
|
constructor(hostRef) {
|
|
9892
9924
|
registerInstance(this, hostRef);
|
|
@@ -10161,18 +10193,18 @@ class KolInputWc {
|
|
|
10161
10193
|
const hasExpertSlot = showExpertSlot(this._label);
|
|
10162
10194
|
const hasHint = typeof this._hint === 'string' && this._hint.length > 0;
|
|
10163
10195
|
const useTooltopInsteadOfLabel = !hasExpertSlot && this._hideLabel;
|
|
10164
|
-
return (hAsync(Host, { key: '
|
|
10196
|
+
return (hAsync(Host, { key: 'cb5a010dca6149a054367c7244be69a4e9facb6b', class: clsx('kol-input', this.getModifierClassNameByMsgType(), {
|
|
10165
10197
|
disabled: this._disabled === true,
|
|
10166
10198
|
error: hasError === true,
|
|
10167
10199
|
'read-only': this._readOnly === true,
|
|
10168
10200
|
required: this._required === true,
|
|
10169
10201
|
touched: this._touched === true,
|
|
10170
10202
|
'hidden-error': this._hideError === true,
|
|
10171
|
-
}) }, hAsync("label", { key: '
|
|
10203
|
+
}) }, hAsync("label", { key: 'e9d576ee7f951415fc80678196a94a243908d9a1', class: "input-label", id: !useTooltopInsteadOfLabel ? `${this._id}-label` : undefined, hidden: useTooltopInsteadOfLabel, htmlFor: this._id }, hAsync("span", { key: '8af0c623f1c552deb3cbb306c5370c8cc05539be', class: "input-label-span" }, hAsync("slot", { key: '123d4cd6e4f6e6a0e805e13a3e79a39bf049ff85', name: "label" }))), hasHint && (hAsync("span", { key: '4475d87afadc2d721a34511aa96cd5775d150c39', class: "hint", id: `${this._id}-hint` }, this._hint)), hAsync("div", { key: 'eee25913b496676e874a5123ef132048c2535b8a', class: {
|
|
10172
10204
|
input: true,
|
|
10173
10205
|
'icon-left': typeof ((_e = this._icons) === null || _e === void 0 ? void 0 : _e.left) === 'object',
|
|
10174
10206
|
'icon-right': typeof ((_f = this._icons) === null || _f === void 0 ? void 0 : _f.right) === 'object',
|
|
10175
|
-
} }, ((_g = this._icons) === null || _g === void 0 ? void 0 : _g.left) && (hAsync(KolIconTag, { key: '
|
|
10207
|
+
} }, ((_g = this._icons) === null || _g === void 0 ? void 0 : _g.left) && (hAsync(KolIconTag, { key: '84326de1ed7d3542ab0c868ba5bcc88d66d09ed2', _label: "", _icons: ((_h = this._icons) === null || _h === void 0 ? void 0 : _h.left).icon, style: this.getIconStyles((_j = this._icons) === null || _j === void 0 ? void 0 : _j.left) })), hAsync("div", { key: '4499d53591ef3ca4c86603481f65b09a0f65a5a9', ref: this.catchInputSlot, id: this.slotName, class: "input-slot" }), typeof this._smartButton === 'object' && this._smartButton !== null && (hAsync(KolButtonWcTag, { key: 'cc02b46988087722bb62674e02d0a2a0922d8033', _customClass: this._smartButton._customClass, _disabled: this._smartButton._disabled, _icons: this._smartButton._icons, _hideLabel: true, _id: this._smartButton._id, _label: this._smartButton._label, _on: this._smartButton._on, _tooltipAlign: this._smartButton._tooltipAlign, _variant: this._smartButton._variant })), ((_k = this._icons) === null || _k === void 0 ? void 0 : _k.right) && (hAsync(KolIconTag, { key: '7425d45bd0da5363927ff85980f47e5728c9245c', _label: "", _icons: ((_l = this._icons) === null || _l === void 0 ? void 0 : _l.right).icon, style: this.getIconStyles((_m = this._icons) === null || _m === void 0 ? void 0 : _m.right) }))), useTooltopInsteadOfLabel && (hAsync(KolTooltipWcTag, { key: '66bfb816c06ec291dae8683d1f4dabf81fb4376c', "aria-hidden": "true", class: "input-tooltip", _accessKey: this._accessKey, _align: this._tooltipAlign, _id: this._hideLabel ? `${this._id}-label` : undefined, _label: this._label })), showFormFieldMsg && hAsync(FormFieldMsg, { key: 'afbfc9cb6af4e93cf18cbff41a7114ae17043af8', _alert: this._alert, _hideError: this._hideError, _msg: this._msg, _id: this._id }), Array.isArray(this._suggestions) && this._suggestions.length > 0 && (hAsync("datalist", { key: '7de41a5df7e95fe2ecd4756a93584fa59155efe1', id: `${this._id}-list` }, this._suggestions.map((option) => (hAsync("option", { value: option }))))), this._hasCounter && (hAsync("span", { key: '71add6996f301ab9fba5e209857af8de6220f04e', class: "counter", "aria-atomic": "true", "aria-live": "polite" }, this._currentLength, this._maxLength && (hAsync(Fragment, null, hAsync("span", { key: 'd85c7df7a5777868da9158baef1720a5a6ee65b4', "aria-label": translate('kol-of'), role: "img" }, "/"), this._maxLength)), ' ', hAsync("span", { key: '67a67f48cb70ca08ef15200f838cb6de85030eb8' }, translate('kol-characters'))))));
|
|
10176
10208
|
}
|
|
10177
10209
|
getModifierClassNameByMsgType() {
|
|
10178
10210
|
var _a, _b;
|
|
@@ -10219,8 +10251,8 @@ class KolInputWc {
|
|
|
10219
10251
|
}; }
|
|
10220
10252
|
}
|
|
10221
10253
|
|
|
10222
|
-
const defaultStyleCss$
|
|
10223
|
-
var KolKolibriDefaultStyle0 = defaultStyleCss$
|
|
10254
|
+
const defaultStyleCss$n = "@layer kol-global {\n .sc-kol-kolibri-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-kolibri-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-kolibri-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-kolibri-default-h {\n display: inline-block;\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n text {\n font-size: 90px;\n letter-spacing: normal;\n word-spacing: normal;\n }\n svg {\n max-height: 100%;\n }\n}";
|
|
10255
|
+
var KolKolibriDefaultStyle0 = defaultStyleCss$n;
|
|
10224
10256
|
|
|
10225
10257
|
class KolKolibri {
|
|
10226
10258
|
constructor(hostRef) {
|
|
@@ -10251,7 +10283,7 @@ class KolKolibri {
|
|
|
10251
10283
|
}
|
|
10252
10284
|
render() {
|
|
10253
10285
|
const fillColor = `rgb(${this.state._color.red},${this.state._color.green},${this.state._color.blue})`;
|
|
10254
|
-
return (hAsync(Host, { key: '
|
|
10286
|
+
return (hAsync(Host, { key: '7c64ab523666d0cd00a81bca1f281c2e215ecc39', class: "kol-kolibri" }, hAsync("svg", { key: '9b51646c464589413b39e5201a65bc0baa9d3644', role: "img", "aria-label": translate('kol-kolibri-logo'), xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 600 600", fill: fillColor }, hAsync("path", { key: '2d294d232570be79963ea19a439548abdf126041', d: "M353 322L213 304V434L353 322Z" }), hAsync("path", { key: '4427d1479ce3268ab5343c116047911c29316280', d: "M209 564V304L149 434L209 564Z" }), hAsync("path", { key: '9a8b7bfa3ff220d5ea0519ad815d1dd936ed3b0b', d: "M357 316L417 250L361 210L275 244L357 316Z" }), hAsync("path", { key: 'bc689798ee2fab3af7808c4f55c60e3660ab071b', d: "M329 218L237 92L250 222L272 241L329 218Z" }), hAsync("path", { key: '973759e8e0badb1ad93be3a929bb5b8fdfd4f12a', d: "M353 318L35 36L213 300L353 318Z" }), hAsync("path", { key: '491889b18b288acfa7bbd2e919ce81bb459b6b48', d: "M391 286L565 272L421 252L391 286Z" }), this.state._labeled === true && (hAsync("text", { key: 'e2db348c1de6e003c054b6aafe4697e778171290', x: "250", y: "525", fill: fillColor }, "KoliBri")))));
|
|
10255
10287
|
}
|
|
10256
10288
|
validateColor(value) {
|
|
10257
10289
|
validateColor(this, value, {
|
|
@@ -10291,8 +10323,8 @@ class KolKolibri {
|
|
|
10291
10323
|
}; }
|
|
10292
10324
|
}
|
|
10293
10325
|
|
|
10294
|
-
const defaultStyleCss$
|
|
10295
|
-
var KolLinkDefaultStyle0 = defaultStyleCss$
|
|
10326
|
+
const defaultStyleCss$m = "@layer kol-global {\n .sc-kol-link-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-link-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-link-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-link-default-h {\n display: inline-block;\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n :is(a, button) {\n align-items: baseline;\n display: inline-flex;\n place-items: center;\n text-align: left;\n text-decoration-line: none;\n }\n :is(a, button) .kol-span-wc .span-label {\n text-decoration-line: underline;\n }\n a:is(:focus, :hover):not([aria-disabled]) .kol-span-wc .span-label,\n button:is(:focus, :hover):not([disabled]) .kol-span-wc .span-label {\n text-decoration-thickness: 0.2em;\n }\n .skip {\n left: -99999px;\n overflow: hidden;\n position: absolute;\n z-index: 9999999;\n line-height: 1em;\n }\n .skip:focus {\n background-color: #fff;\n left: unset;\n padding: 1em;\n position: unset;\n }\n .kol-icon.external-link-icon {\n display: inline-flex;\n }\n}";
|
|
10327
|
+
var KolLinkDefaultStyle0 = defaultStyleCss$m;
|
|
10296
10328
|
|
|
10297
10329
|
class KolLink {
|
|
10298
10330
|
constructor(hostRef) {
|
|
@@ -10302,6 +10334,7 @@ class KolLink {
|
|
|
10302
10334
|
};
|
|
10303
10335
|
this._accessKey = undefined;
|
|
10304
10336
|
this._ariaCurrentValue = undefined;
|
|
10337
|
+
this._ariaDescription = undefined;
|
|
10305
10338
|
this._disabled = false;
|
|
10306
10339
|
this._download = undefined;
|
|
10307
10340
|
this._hideLabel = false;
|
|
@@ -10322,7 +10355,7 @@ class KolLink {
|
|
|
10322
10355
|
await ((_a = this.linkWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
|
|
10323
10356
|
}
|
|
10324
10357
|
render() {
|
|
10325
|
-
return (hAsync(Host, { key: '
|
|
10358
|
+
return (hAsync(Host, { key: '5b334d85642030f026e064f34cbdd08f7808ff28', class: "kol-link" }, hAsync(KolLinkWcTag, { key: '3e73251313ea33ba37f793e368670549359a0cb0', ref: this.catchRef, _accessKey: this._accessKey, _ariaCurrentValue: this._ariaCurrentValue, _ariaDescription: this._ariaDescription, _disabled: this._disabled, _download: this._download, _hideLabel: this._hideLabel, _href: this._href, _icons: this._icons, _label: this._label, _on: this._on, _role: this._role, _tabIndex: this._tabIndex, _target: this._target, _tooltipAlign: this._tooltipAlign }, hAsync("slot", { key: '22adfc508721f3c9b4beb818a95a3e1da9405d04', name: "expert", slot: "expert" }))));
|
|
10326
10359
|
}
|
|
10327
10360
|
static get style() { return {
|
|
10328
10361
|
default: KolLinkDefaultStyle0
|
|
@@ -10333,6 +10366,7 @@ class KolLink {
|
|
|
10333
10366
|
"$members$": {
|
|
10334
10367
|
"_accessKey": [1, "_access-key"],
|
|
10335
10368
|
"_ariaCurrentValue": [1, "_aria-current-value"],
|
|
10369
|
+
"_ariaDescription": [1, "_aria-description"],
|
|
10336
10370
|
"_disabled": [4],
|
|
10337
10371
|
"_download": [1],
|
|
10338
10372
|
"_hideLabel": [4, "_hide-label"],
|
|
@@ -10353,8 +10387,8 @@ class KolLink {
|
|
|
10353
10387
|
}; }
|
|
10354
10388
|
}
|
|
10355
10389
|
|
|
10356
|
-
const defaultStyleCss$
|
|
10357
|
-
var KolLinkButtonDefaultStyle0 = defaultStyleCss$
|
|
10390
|
+
const defaultStyleCss$l = "@charset \"UTF-8\";\n\n@layer kol-global {\n .sc-kol-link-button-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-link-button-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-link-button-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-link-button-default-h {\n font-style: calc(16rem / var(--kolibri-root-font-size, 16));\n display: inline-block;\n }\n :is(a, button) {\n display: inline-flex;\n place-items: center;\n text-align: center;\n text-decoration-line: none;\n }\n :is(a, button)::before {\n \n content: \"\";\n }\n \n :is(a, button) > .kol-span-wc {\n margin: auto;\n width: 100%;\n }\n}";
|
|
10391
|
+
var KolLinkButtonDefaultStyle0 = defaultStyleCss$l;
|
|
10358
10392
|
|
|
10359
10393
|
class KolLinkButton {
|
|
10360
10394
|
constructor(hostRef) {
|
|
@@ -10364,6 +10398,7 @@ class KolLinkButton {
|
|
|
10364
10398
|
};
|
|
10365
10399
|
this._accessKey = undefined;
|
|
10366
10400
|
this._ariaCurrentValue = undefined;
|
|
10401
|
+
this._ariaDescription = undefined;
|
|
10367
10402
|
this._customClass = undefined;
|
|
10368
10403
|
this._disabled = false;
|
|
10369
10404
|
this._download = undefined;
|
|
@@ -10386,11 +10421,11 @@ class KolLinkButton {
|
|
|
10386
10421
|
await ((_a = this.linkWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
|
|
10387
10422
|
}
|
|
10388
10423
|
render() {
|
|
10389
|
-
return (hAsync(Host, { key: '
|
|
10424
|
+
return (hAsync(Host, { key: 'aaa71aa908dc2f9b2333ef32a980b19db8901aa1', class: "kol-link-button" }, hAsync(KolLinkWcTag, { key: '98bb9faeac2a860088009e7bf1906b3efc723db6', ref: this.catchRef, class: {
|
|
10390
10425
|
button: true,
|
|
10391
10426
|
[this._variant]: this._variant !== 'custom',
|
|
10392
10427
|
[this._customClass]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,
|
|
10393
|
-
}, _accessKey: this._accessKey, _ariaCurrentValue: this._ariaCurrentValue, _disabled: this._disabled, _download: this._download, _hideLabel: this._hideLabel, _href: this._href, _icons: this._icons, _label: this._label, _on: this._on, _role: "button", _tabIndex: this._tabIndex, _target: this._target, _tooltipAlign: this._tooltipAlign }, hAsync("slot", { key: '
|
|
10428
|
+
}, _accessKey: this._accessKey, _ariaCurrentValue: this._ariaCurrentValue, _ariaDescription: this._ariaDescription, _disabled: this._disabled, _download: this._download, _hideLabel: this._hideLabel, _href: this._href, _icons: this._icons, _label: this._label, _on: this._on, _role: "button", _tabIndex: this._tabIndex, _target: this._target, _tooltipAlign: this._tooltipAlign }, hAsync("slot", { key: '75eb4d6455e80bba999110d3f744b60f7bde2803', name: "expert", slot: "expert" }))));
|
|
10394
10429
|
}
|
|
10395
10430
|
static get style() { return {
|
|
10396
10431
|
default: KolLinkButtonDefaultStyle0
|
|
@@ -10401,6 +10436,7 @@ class KolLinkButton {
|
|
|
10401
10436
|
"$members$": {
|
|
10402
10437
|
"_accessKey": [1, "_access-key"],
|
|
10403
10438
|
"_ariaCurrentValue": [1, "_aria-current-value"],
|
|
10439
|
+
"_ariaDescription": [1, "_aria-description"],
|
|
10404
10440
|
"_customClass": [1, "_custom-class"],
|
|
10405
10441
|
"_disabled": [4],
|
|
10406
10442
|
"_download": [1],
|
|
@@ -10423,8 +10459,8 @@ class KolLinkButton {
|
|
|
10423
10459
|
}; }
|
|
10424
10460
|
}
|
|
10425
10461
|
|
|
10426
|
-
const defaultStyleCss$
|
|
10427
|
-
var KolLinkGroupDefaultStyle0 = defaultStyleCss$
|
|
10462
|
+
const defaultStyleCss$k = "@layer kol-global {\n .sc-kol-link-group-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-link-group-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-link-group-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-link-group-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n ul {\n list-style: none;\n margin: 0;\n padding: 0;\n }\n :is(ol, ul).horizontal {\n display: flex;\n flex-wrap: wrap;\n }\n :is(ol, ul).horizontal li {\n margin-left: calc(20rem / var(--kolibri-root-font-size, 16));\n margin-right: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n :is(ol, ul).horizontal li:first-child {\n margin-left: 0;\n }\n :is(ol, ul).horizontal li:last-child {\n margin-right: 0;\n }\n :is(ol, ul).vertical li {\n margin-left: calc(28rem / var(--kolibri-root-font-size, 16));\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n li.list-none {\n list-style-type: none !important;\n margin-left: 0;\n }\n}";
|
|
10463
|
+
var KolLinkGroupDefaultStyle0 = defaultStyleCss$k;
|
|
10428
10464
|
|
|
10429
10465
|
const ListItem = (props) => {
|
|
10430
10466
|
const list = [];
|
|
@@ -10454,10 +10490,10 @@ class KolLinkGroup {
|
|
|
10454
10490
|
}
|
|
10455
10491
|
render() {
|
|
10456
10492
|
const ListTag = this.isUl ? 'ul' : 'ol';
|
|
10457
|
-
return (hAsync(Host, { key: '
|
|
10493
|
+
return (hAsync(Host, { key: '166b42082d8da56cb526c76d8b0631a3f5ccfd5d', class: "kol-link-group" }, hAsync(ListTag, { key: 'b417e8bc884c5bba727fbc8b62e37dfcdd3eab37', "aria-label": this.state._label, class: {
|
|
10458
10494
|
vertical: this.state._orientation === 'vertical',
|
|
10459
10495
|
horizontal: this.state._orientation === 'horizontal',
|
|
10460
|
-
} }, hAsync(ListItem, { key: '
|
|
10496
|
+
} }, hAsync(ListItem, { key: '9c08949729ef120301d176f6ccbdaca785edfa31', links: this.state._links, orientation: this.state._orientation, listStyleType: this.state._listStyleType }))));
|
|
10461
10497
|
}
|
|
10462
10498
|
validateLabel(value, _oldValue, initial = false) {
|
|
10463
10499
|
if (!initial && this.state._label) {
|
|
@@ -10545,6 +10581,7 @@ const onLocationChange = (callback, eager = true) => {
|
|
|
10545
10581
|
class KolLinkWc {
|
|
10546
10582
|
constructor(hostRef) {
|
|
10547
10583
|
registerInstance(this, hostRef);
|
|
10584
|
+
this.internalDescriptionById = nonce();
|
|
10548
10585
|
this.catchRef = (ref) => {
|
|
10549
10586
|
this.anchorRef = ref;
|
|
10550
10587
|
};
|
|
@@ -10575,6 +10612,7 @@ class KolLinkWc {
|
|
|
10575
10612
|
};
|
|
10576
10613
|
this._accessKey = undefined;
|
|
10577
10614
|
this._ariaCurrentValue = undefined;
|
|
10615
|
+
this._ariaDescription = undefined;
|
|
10578
10616
|
this._ariaExpanded = undefined;
|
|
10579
10617
|
this._ariaOwns = undefined;
|
|
10580
10618
|
this._disabled = false;
|
|
@@ -10599,15 +10637,17 @@ class KolLinkWc {
|
|
|
10599
10637
|
(_a = this.anchorRef) === null || _a === void 0 ? void 0 : _a.focus();
|
|
10600
10638
|
}
|
|
10601
10639
|
render() {
|
|
10640
|
+
var _a, _b;
|
|
10602
10641
|
const { isExternal, tagAttrs } = this.getRenderValues();
|
|
10603
10642
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
10604
|
-
|
|
10643
|
+
const hasAriaDescription = Boolean((_b = (_a = this.state._ariaDescription) === null || _a === void 0 ? void 0 : _a.trim()) === null || _b === void 0 ? void 0 : _b.length);
|
|
10644
|
+
return (hAsync(Host, { key: 'ca779101a7b0a1fc00ba4c487f485bf64c021e2a', class: "kol-link-wc" }, hAsync("a", Object.assign({ key: '26fbff98d2ce402df318eb6aa8d3b1c5faadb96d', ref: this.catchRef }, tagAttrs, { accessKey: this.state._accessKey, "aria-current": this.state._ariaCurrent, "aria-describedby": hasAriaDescription ? this.internalDescriptionById : undefined, "aria-disabled": this.state._disabled ? 'true' : undefined, "aria-expanded": typeof this.state._ariaExpanded === 'boolean' ? String(this.state._ariaExpanded) : undefined, "aria-owns": this.state._ariaOwns, "aria-label": this.state._hideLabel && typeof this.state._label === 'string'
|
|
10605
10645
|
? `${this.state._label}${isExternal ? ` (${translate('kol-open-link-in-tab')})` : ''}`
|
|
10606
10646
|
: undefined, class: {
|
|
10607
10647
|
disabled: this.state._disabled === true,
|
|
10608
10648
|
'external-link': isExternal,
|
|
10609
10649
|
'hide-label': this.state._hideLabel === true,
|
|
10610
|
-
} }, this.state._on, { onClick: this.onClick, onKeyPress: this.onClick, role: this.state._role, tabIndex: this.state._disabled ? -1 : this.state._tabIndex }), hAsync(KolSpanWcTag, { key: '
|
|
10650
|
+
} }, this.state._on, { onClick: this.onClick, onKeyPress: this.onClick, role: this.state._role, tabIndex: this.state._disabled ? -1 : this.state._tabIndex }), hAsync(KolSpanWcTag, { key: 'ae5fd2b9494d8af7e734ff604bb6d0bdbe9d2918', _accessKey: this.state._accessKey, _icons: this.state._icons, _hideLabel: this.state._hideLabel, _label: hasExpertSlot ? '' : this.state._label || this.state._href }, hAsync("slot", { key: 'e663545748652867f7bda05b95dc780624afd694', name: "expert", slot: "expert" })), isExternal && (hAsync(KolIconTag, { key: '9272168a80f7d7ea1695edbd148d77c712e3af6c', class: "external-link-icon", _label: this.state._hideLabel ? '' : translate('kol-open-link-in-tab'), _icons: 'codicon codicon-link-external', "aria-hidden": this.state._hideLabel }))), hAsync(KolTooltipWcTag, { key: '9cd2d8d555edd92377a24c433b76d0de5dcdeb6f', "aria-hidden": "true", hidden: hasExpertSlot || !this.state._hideLabel, _accessKey: this.state._accessKey, _align: this.state._tooltipAlign, _label: this.state._label || this.state._href }), hasAriaDescription && (hAsync("span", { key: '58b50fd2c3e3c3bc4956bcbdc248c0237b3cddcf', class: "visually-hidden", id: this.internalDescriptionById }, this.state._ariaDescription))));
|
|
10611
10651
|
}
|
|
10612
10652
|
validateAccessKey(value) {
|
|
10613
10653
|
validateAccessKey(this, value);
|
|
@@ -10615,6 +10655,9 @@ class KolLinkWc {
|
|
|
10615
10655
|
validateAriaCurrentValue(value) {
|
|
10616
10656
|
validateAriaCurrentValue(this, value);
|
|
10617
10657
|
}
|
|
10658
|
+
validateAriaDescription(value) {
|
|
10659
|
+
validateAriaDescription(this, value);
|
|
10660
|
+
}
|
|
10618
10661
|
validateAriaExpanded(value) {
|
|
10619
10662
|
validateAriaExpanded(this, value);
|
|
10620
10663
|
}
|
|
@@ -10659,6 +10702,7 @@ class KolLinkWc {
|
|
|
10659
10702
|
componentWillLoad() {
|
|
10660
10703
|
this.validateAccessKey(this._accessKey);
|
|
10661
10704
|
this.validateAriaCurrentValue(this._ariaCurrentValue);
|
|
10705
|
+
this.validateAriaDescription(this._ariaDescription);
|
|
10662
10706
|
this.validateAriaExpanded(this._ariaExpanded);
|
|
10663
10707
|
this.validateAriaOwns(this._ariaOwns);
|
|
10664
10708
|
this.validateDisabled(this._disabled);
|
|
@@ -10684,6 +10728,7 @@ class KolLinkWc {
|
|
|
10684
10728
|
static get watchers() { return {
|
|
10685
10729
|
"_accessKey": ["validateAccessKey"],
|
|
10686
10730
|
"_ariaCurrentValue": ["validateAriaCurrentValue"],
|
|
10731
|
+
"_ariaDescription": ["validateAriaDescription"],
|
|
10687
10732
|
"_ariaExpanded": ["validateAriaExpanded"],
|
|
10688
10733
|
"_ariaOwns": ["validateAriaOwns"],
|
|
10689
10734
|
"_disabled": ["validateDisabled"],
|
|
@@ -10704,6 +10749,7 @@ class KolLinkWc {
|
|
|
10704
10749
|
"$members$": {
|
|
10705
10750
|
"_accessKey": [1, "_access-key"],
|
|
10706
10751
|
"_ariaCurrentValue": [1, "_aria-current-value"],
|
|
10752
|
+
"_ariaDescription": [1, "_aria-description"],
|
|
10707
10753
|
"_ariaExpanded": [4, "_aria-expanded"],
|
|
10708
10754
|
"_ariaOwns": [1, "_aria-owns"],
|
|
10709
10755
|
"_disabled": [4],
|
|
@@ -10893,8 +10939,8 @@ BUND_LOGO_TEXT_MAP.set(Bundesanstalt['Bundesinstitut für Arzneimittel und Mediz
|
|
|
10893
10939
|
BUND_LOGO_TEXT_MAP.set(Bundesanstalt['Bundesinstitut für Bevölkerungsforschung'], ['Bundesinstitut', 'für Bevölkerungsforschung']);
|
|
10894
10940
|
BUND_LOGO_TEXT_MAP.set(Bundesanstalt['Bundesinstitut für Sportwissenschaft'], ['Bundesinstitut', 'für Sportwissenschaft']);
|
|
10895
10941
|
|
|
10896
|
-
const defaultStyleCss$
|
|
10897
|
-
var KolLogoDefaultStyle0 = defaultStyleCss$
|
|
10942
|
+
const defaultStyleCss$j = "@layer kol-global {\n .sc-kol-logo-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-logo-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-logo-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-logo-default-h {\n display: inline-block;\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n text {\n font-size: 16px;\n letter-spacing: normal;\n word-spacing: normal;\n }\n svg {\n max-height: 100%;\n }\n}";
|
|
10943
|
+
var KolLogoDefaultStyle0 = defaultStyleCss$j;
|
|
10898
10944
|
|
|
10899
10945
|
function enumToArray(enumeration, enumAsMap = new Map()) {
|
|
10900
10946
|
Object.entries(enumeration).map(([key, value]) => {
|
|
@@ -10933,7 +10979,7 @@ class KolLogo {
|
|
|
10933
10979
|
}
|
|
10934
10980
|
render() {
|
|
10935
10981
|
var _a;
|
|
10936
|
-
return (hAsync(Host, { key: '
|
|
10982
|
+
return (hAsync(Host, { key: '00b2dfecc3fed5fee1ddc678ad5db466657135ee', class: "kol-logo" }, hAsync("svg", { key: '29ce4e5b38c73d080bc5d9f7e507eded70be7bf2', "aria-label": translate('kol-logo-description', { placeholders: { orgShort: this.state._org, orgLong: getAriaLabel(this.state._org) } }), role: "img", viewBox: "0 0 225 100" }, hAsync("rect", { key: 'f9bcc15e299ef767fe534152d6a36a3517935031', width: "100%", height: "100%", fill: "white" }), hAsync("svg", { key: 'b190c40b40a6e69b71f9ebfa90b61facb3467a70', x: "0", y: "4", height: "75" }, hAsync(Adler, { key: '7c7e7966dd2dbe3190ec696ac91bb6826b69d94b' })), hAsync("svg", { key: '226145289c46d420828acc8f6c19dec591d182d6', x: "40.5", y: "3.5", height: "100" }, hAsync("rect", { key: '1ea801500c85982d2e23125e50de12d9fc2404be', width: "5", height: "30" }), hAsync("rect", { key: '31aa33e4820eeb8e20b3a6eb5d3081fc028f7506', y: "30", width: "5", height: "30", fill: "red" }), hAsync("rect", { key: '091e80d86aff989e495a1e06d290d50ca56fbdd9', y: "60", width: "5", height: "30", fill: "#fc0" })), hAsync("svg", { key: '5946b2fce0cd19428ed71f504032c9cf3f8a6a20', x: "50", y: "0" }, hAsync("text", { key: '665d760de83898f8766ab3c73b89c00008e7cd8b', x: "0", y: "-0.05em", "font-family": "BundesSans Web", style: { backgroundColor: 'white', color: 'black' } }, BUND_LOGO_TEXT_MAP.has(this.state._org) ? (hAsync("tspan", null, (_a = BUND_LOGO_TEXT_MAP.get(this.state._org)) === null || _a === void 0 ? void 0 : _a.map((text, index) => {
|
|
10937
10983
|
return (hAsync("tspan", { x: "0", dy: "1.1em", key: `kol-logo-text-${index}` }, text));
|
|
10938
10984
|
}))) : (hAsync("tspan", { fill: "red" }, hAsync("tspan", { x: "0", dy: "1.1em" }, "Der Schl\u00FCsselwert"), hAsync("tspan", { x: "0", dy: "1.1em", "font-weight": "bold" }, "'", this.state._org, "'"), hAsync("tspan", { x: "0", dy: "1.1em" }, "ist nicht definiert."), hAsync("tspan", { x: "0", dy: "1.1em" }, "oder freigegeben."))))))));
|
|
10939
10985
|
}
|
|
@@ -10956,129 +11002,12 @@ class KolLogo {
|
|
|
10956
11002
|
}; }
|
|
10957
11003
|
}
|
|
10958
11004
|
|
|
10959
|
-
|
|
10960
|
-
|
|
10961
|
-
this.lockedElements = new Map();
|
|
10962
|
-
this.modalStack = new Map();
|
|
10963
|
-
}
|
|
10964
|
-
lockElement(htmlElement) {
|
|
10965
|
-
const tabIndex = htmlElement.getAttribute('tabindex');
|
|
10966
|
-
if (htmlElement instanceof HTMLAnchorElement ||
|
|
10967
|
-
htmlElement instanceof HTMLButtonElement ||
|
|
10968
|
-
htmlElement instanceof HTMLInputElement ||
|
|
10969
|
-
htmlElement instanceof HTMLSelectElement ||
|
|
10970
|
-
htmlElement instanceof HTMLTextAreaElement ||
|
|
10971
|
-
typeof tabIndex === 'string' ||
|
|
10972
|
-
htmlElement.dataset.kolModal !== undefined) {
|
|
10973
|
-
if (typeof tabIndex === 'string') {
|
|
10974
|
-
this.lockedElements.set(htmlElement, {
|
|
10975
|
-
tabIndex,
|
|
10976
|
-
});
|
|
10977
|
-
}
|
|
10978
|
-
else {
|
|
10979
|
-
this.lockedElements.set(htmlElement, {});
|
|
10980
|
-
}
|
|
10981
|
-
htmlElement.setAttribute('tabindex', '-1');
|
|
10982
|
-
htmlElement.setAttribute('aria-hidden', 'true');
|
|
10983
|
-
htmlElement.style.userSelect = 'none';
|
|
10984
|
-
}
|
|
10985
|
-
}
|
|
10986
|
-
unlockElement(value, htmlElement) {
|
|
10987
|
-
if (typeof value.tabIndex === 'string') {
|
|
10988
|
-
htmlElement.setAttribute('tabindex', value.tabIndex);
|
|
10989
|
-
}
|
|
10990
|
-
else {
|
|
10991
|
-
htmlElement.removeAttribute('tabindex');
|
|
10992
|
-
}
|
|
10993
|
-
htmlElement.removeAttribute('aria-hidden');
|
|
10994
|
-
htmlElement.style.userSelect = 'unset';
|
|
10995
|
-
this.lockedElements.delete(htmlElement);
|
|
10996
|
-
}
|
|
10997
|
-
unlockLockedElements(lockedElements) {
|
|
10998
|
-
lockedElements.forEach(this.unlockElement.bind(this));
|
|
10999
|
-
}
|
|
11000
|
-
lockFocus(hostElement, excludeElement) {
|
|
11001
|
-
try {
|
|
11002
|
-
if (hostElement !== excludeElement && (hostElement instanceof HTMLElement || hostElement instanceof ShadowRoot)) {
|
|
11003
|
-
if (hostElement instanceof HTMLElement) {
|
|
11004
|
-
this.lockElement(hostElement);
|
|
11005
|
-
this.lockFocus(hostElement.shadowRoot, excludeElement);
|
|
11006
|
-
}
|
|
11007
|
-
for (let i = 0; i < hostElement.children.length; i++) {
|
|
11008
|
-
this.lockFocus(hostElement.children[i], excludeElement);
|
|
11009
|
-
}
|
|
11010
|
-
}
|
|
11011
|
-
}
|
|
11012
|
-
catch (error) {
|
|
11013
|
-
}
|
|
11014
|
-
}
|
|
11015
|
-
renderModalIfExists(activeElement) {
|
|
11016
|
-
if (activeElement instanceof HTMLElement) {
|
|
11017
|
-
if (this.lockedElements.has(activeElement)) {
|
|
11018
|
-
this.unlockElement(this.lockedElements.get(activeElement), activeElement);
|
|
11019
|
-
}
|
|
11020
|
-
const timeout = setTimeout(() => {
|
|
11021
|
-
clearTimeout(timeout);
|
|
11022
|
-
activeElement.focus();
|
|
11023
|
-
}, 500);
|
|
11024
|
-
}
|
|
11025
|
-
this.unlockLockedElements(this.lockedElements);
|
|
11026
|
-
if (this.modalStack.size > 0) {
|
|
11027
|
-
const modalKeys = Array.from(this.modalStack.keys());
|
|
11028
|
-
const modalRef = modalKeys[modalKeys.length - 1];
|
|
11029
|
-
this.modalStack.forEach((_value, htmlElement) => {
|
|
11030
|
-
if (modalRef === htmlElement) {
|
|
11031
|
-
htmlElement.style.display = 'inline';
|
|
11032
|
-
}
|
|
11033
|
-
else {
|
|
11034
|
-
htmlElement.style.display = `none`;
|
|
11035
|
-
}
|
|
11036
|
-
});
|
|
11037
|
-
getDocument().body.style.maxHeight = '100vh';
|
|
11038
|
-
getDocument().body.style.overflow = 'hidden';
|
|
11039
|
-
this.lockFocus(getDocument().body, modalRef);
|
|
11040
|
-
}
|
|
11041
|
-
else {
|
|
11042
|
-
getDocument().body.style.maxHeight = 'unset';
|
|
11043
|
-
getDocument().body.style.overflow = 'unset';
|
|
11044
|
-
}
|
|
11045
|
-
}
|
|
11046
|
-
openModal(modalRef, activeElement) {
|
|
11047
|
-
if (modalRef instanceof HTMLElement === false) {
|
|
11048
|
-
Log.warn(`[KolModalService] The DOM reference of the modal is not valid.`);
|
|
11049
|
-
}
|
|
11050
|
-
else {
|
|
11051
|
-
this.modalStack.set(modalRef, {
|
|
11052
|
-
activeElement,
|
|
11053
|
-
});
|
|
11054
|
-
this.renderModalIfExists();
|
|
11055
|
-
}
|
|
11056
|
-
}
|
|
11057
|
-
closeModal(modalRef) {
|
|
11058
|
-
var _a;
|
|
11059
|
-
if (modalRef instanceof HTMLElement === false) {
|
|
11060
|
-
Log.warn(`[KolModalService] The DOM reference of the modal is not valid.`);
|
|
11061
|
-
}
|
|
11062
|
-
else {
|
|
11063
|
-
const activeElement = (_a = this.modalStack.get(modalRef)) === null || _a === void 0 ? void 0 : _a.activeElement;
|
|
11064
|
-
this.modalStack.delete(modalRef);
|
|
11065
|
-
this.renderModalIfExists(activeElement);
|
|
11066
|
-
}
|
|
11067
|
-
}
|
|
11068
|
-
}
|
|
11069
|
-
|
|
11070
|
-
const defaultStyleCss$h = "@layer kol-global {\n .sc-kol-modal-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-modal-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-modal-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-modal-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .overlay {\n background-color: rgba(0, 0, 0, 0.33);\n display: flex;\n height: 100%;\n inset: 0;\n position: fixed;\n width: 100%;\n z-index: 100;\n }\n .modal {\n margin: auto;\n max-height: 100%;\n max-width: 100%;\n }\n}";
|
|
11071
|
-
var KolModalDefaultStyle0 = defaultStyleCss$h;
|
|
11005
|
+
const defaultStyleCss$i = "@layer kol-global {\n .sc-kol-modal-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-modal-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-modal-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-modal-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-modal {\n border: 0;\n padding: 0;\n }\n .kol-modal::backdrop {\n background-color: rgba(0, 0, 0, 0.33);\n }\n}";
|
|
11006
|
+
var KolModalDefaultStyle0 = defaultStyleCss$i;
|
|
11072
11007
|
|
|
11073
|
-
const modalService = new ModalService();
|
|
11074
11008
|
class KolModal {
|
|
11075
11009
|
constructor(hostRef) {
|
|
11076
11010
|
registerInstance(this, hostRef);
|
|
11077
|
-
this.onKeyDown = (event) => {
|
|
11078
|
-
if (event && event.code === 'Escape') {
|
|
11079
|
-
this._activeElement = null;
|
|
11080
|
-
}
|
|
11081
|
-
};
|
|
11082
11011
|
this._activeElement = undefined;
|
|
11083
11012
|
this._label = undefined;
|
|
11084
11013
|
this._on = undefined;
|
|
@@ -11090,40 +11019,44 @@ class KolModal {
|
|
|
11090
11019
|
};
|
|
11091
11020
|
}
|
|
11092
11021
|
componentDidRender() {
|
|
11093
|
-
|
|
11094
|
-
|
|
11095
|
-
|
|
11096
|
-
}
|
|
11097
|
-
else {
|
|
11098
|
-
modalService.closeModal(this.hostElement);
|
|
11099
|
-
}
|
|
11022
|
+
var _a;
|
|
11023
|
+
if (this.state._activeElement) {
|
|
11024
|
+
(_a = this.refDialog) === null || _a === void 0 ? void 0 : _a.showModal();
|
|
11100
11025
|
}
|
|
11101
11026
|
}
|
|
11102
11027
|
disconnectedCallback() {
|
|
11103
|
-
|
|
11104
|
-
|
|
11105
|
-
|
|
11028
|
+
void this.closeModal();
|
|
11029
|
+
}
|
|
11030
|
+
handleNativeCloseEvent() {
|
|
11031
|
+
var _a, _b;
|
|
11032
|
+
(_b = (_a = this.state._on) === null || _a === void 0 ? void 0 : _a.onClose) === null || _b === void 0 ? void 0 : _b.call(_a);
|
|
11033
|
+
}
|
|
11034
|
+
async openModal() {
|
|
11035
|
+
var _a;
|
|
11036
|
+
(_a = this.refDialog) === null || _a === void 0 ? void 0 : _a.showModal();
|
|
11037
|
+
}
|
|
11038
|
+
async closeModal() {
|
|
11039
|
+
var _a, _b;
|
|
11040
|
+
this._activeElement = null;
|
|
11041
|
+
(_b = (_a = this.refDialog) === null || _a === void 0 ? void 0 : _a.close) === null || _b === void 0 ? void 0 : _b.call(_a);
|
|
11106
11042
|
}
|
|
11107
11043
|
render() {
|
|
11108
|
-
return (hAsync(
|
|
11109
|
-
this.
|
|
11110
|
-
}
|
|
11044
|
+
return (hAsync("dialog", { key: '5033fc2965dfda66c31938ba52d631f1b9ecc902', class: "kol-modal", ref: (el) => {
|
|
11045
|
+
this.refDialog = el;
|
|
11046
|
+
}, style: {
|
|
11111
11047
|
width: this.state._width,
|
|
11112
|
-
}, "aria-label": this.state._label,
|
|
11113
|
-
if (el) {
|
|
11114
|
-
el.setAttribute('tabindex', '0');
|
|
11115
|
-
setTimeout(() => el.focus(), 250);
|
|
11116
|
-
}
|
|
11117
|
-
} }, hAsync("slot", { key: 'cbd31db78f6c1070fad845022b3efd6f247ead54' }))))));
|
|
11048
|
+
}, "aria-label": this.state._label, onClose: this.handleNativeCloseEvent.bind(this) }, hAsync("div", { key: 'a891311e24e9946af4976e61f5c30de3c9403f5c' }, hAsync("slot", { key: '6f6f37bb1b8a723b0c1dafbc880989c153214fae' }))));
|
|
11118
11049
|
}
|
|
11119
11050
|
validateActiveElement(value) {
|
|
11120
11051
|
watchValidator(this, '_activeElement', (value) => typeof value === 'object' || value === null, new Set(['HTMLElement', 'null']), value, {
|
|
11121
11052
|
defaultValue: null,
|
|
11122
11053
|
hooks: {
|
|
11123
11054
|
afterPatch: () => {
|
|
11124
|
-
|
|
11125
|
-
|
|
11126
|
-
|
|
11055
|
+
if (this.state._activeElement) {
|
|
11056
|
+
void this.openModal();
|
|
11057
|
+
}
|
|
11058
|
+
else {
|
|
11059
|
+
void this.closeModal();
|
|
11127
11060
|
}
|
|
11128
11061
|
},
|
|
11129
11062
|
},
|
|
@@ -11136,7 +11069,6 @@ class KolModal {
|
|
|
11136
11069
|
}
|
|
11137
11070
|
validateOn(value) {
|
|
11138
11071
|
if (typeof value === 'object' && value !== null) {
|
|
11139
|
-
featureHint('[KolTabs] Prüfen, wie man auch einen EventCallback einzeln ändern kann.');
|
|
11140
11072
|
const callbacks = {};
|
|
11141
11073
|
if (typeof value.onClose === 'function' || value.onClose === true) {
|
|
11142
11074
|
callbacks.onClose = value.onClose;
|
|
@@ -11172,7 +11104,9 @@ class KolModal {
|
|
|
11172
11104
|
"_label": [1],
|
|
11173
11105
|
"_on": [16],
|
|
11174
11106
|
"_width": [1],
|
|
11175
|
-
"state": [32]
|
|
11107
|
+
"state": [32],
|
|
11108
|
+
"openModal": [64],
|
|
11109
|
+
"closeModal": [64]
|
|
11176
11110
|
},
|
|
11177
11111
|
"$listeners$": undefined,
|
|
11178
11112
|
"$lazyBundleId$": "-",
|
|
@@ -11180,8 +11114,8 @@ class KolModal {
|
|
|
11180
11114
|
}; }
|
|
11181
11115
|
}
|
|
11182
11116
|
|
|
11183
|
-
const defaultStyleCss$
|
|
11184
|
-
var KolNavDefaultStyle0 = defaultStyleCss$
|
|
11117
|
+
const defaultStyleCss$h = "@layer kol-global {\n .sc-kol-nav-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-nav-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-nav-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-nav-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .sc-kol-nav-default-h > div {\n display: grid;\n place-items: center;\n }\n :not(.is-compact) nav {\n width: 100%;\n }\n .list {\n display: flex;\n list-style: none;\n margin: 0;\n padding: 0;\n }\n .list.vertical {\n flex-direction: column;\n }\n .entry {\n display: flex;\n }\n .entry-item {\n flex-grow: 1;\n }\n}";
|
|
11118
|
+
var KolNavDefaultStyle0 = defaultStyleCss$h;
|
|
11185
11119
|
|
|
11186
11120
|
const entryIsLink = (entryProps) => {
|
|
11187
11121
|
return typeof entryProps._href === 'string';
|
|
@@ -11289,11 +11223,11 @@ class KolNav {
|
|
|
11289
11223
|
const collapsible = this.state._collapsible === true;
|
|
11290
11224
|
const hideLabel = this.state._hideLabel === true;
|
|
11291
11225
|
const orientation = this.state._orientation;
|
|
11292
|
-
return (hAsync(Host, { key: '
|
|
11226
|
+
return (hAsync(Host, { key: 'e5df59a6b0f2955c7ffe0a1b8ae05828d089a03a', class: "kol-nav" }, hAsync("div", { key: '5d82a8a378240b280609a81899cb8252983ee0b9', class: {
|
|
11293
11227
|
nav: true,
|
|
11294
11228
|
[orientation]: true,
|
|
11295
11229
|
'is-compact': this.state._hideLabel,
|
|
11296
|
-
} }, hAsync("nav", { key: '
|
|
11230
|
+
} }, hAsync("nav", { key: '10ccef9a51a0c52f74edeacca8c484cded85ccdd', "aria-label": this.state._label, id: "nav" }, hAsync(this.linkList, { key: '64913625fc3f3d8ffd61edd3cb6c720b816e1d79', collapsible: collapsible, hideLabel: hideLabel, deep: 0, links: this.state._links, orientation: orientation })), hasCompactButton && (hAsync("div", { key: 'e6578b70620b8039bc1b9ec85eb994eac960d675', class: "compact" }, hAsync(KolButtonTag, { key: '9fa2d5bb11c1ae77020d7329cb0fd70050b4e58d', _ariaControls: "nav", _ariaExpanded: !hideLabel, _icons: hideLabel ? 'codicon codicon-chevron-right' : 'codicon codicon-chevron-left', _hideLabel: true, _label: translate(hideLabel ? 'kol-nav-maximize' : 'kol-nav-minimize'), _on: {
|
|
11297
11231
|
onClick: () => {
|
|
11298
11232
|
this.state = Object.assign(Object.assign({}, this.state), { _hideLabel: this.state._hideLabel === false });
|
|
11299
11233
|
},
|
|
@@ -11374,8 +11308,8 @@ class KolNav {
|
|
|
11374
11308
|
}; }
|
|
11375
11309
|
}
|
|
11376
11310
|
|
|
11377
|
-
const defaultStyleCss$
|
|
11378
|
-
var KolPaginationDefaultStyle0 = defaultStyleCss$
|
|
11311
|
+
const defaultStyleCss$g = "@charset \"UTF-8\";\n\n@layer kol-global {\n .sc-kol-pagination-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-pagination-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-pagination-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-pagination-default-h {\n align-items: center;\n display: grid;\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n gap: calc(16rem / var(--kolibri-root-font-size, 16));\n grid-template-columns: 1fr auto;\n }\n .navigation-list {\n align-items: center;\n display: inline-flex;\n flex-wrap: wrap;\n gap: 0.5em;\n list-style: none;\n margin: 0;\n padding: 0;\n }\n .separator:before {\n content: \"•••\";\n }\n}";
|
|
11312
|
+
var KolPaginationDefaultStyle0 = defaultStyleCss$g;
|
|
11379
11313
|
|
|
11380
11314
|
const leftDoubleArrowIcon = {
|
|
11381
11315
|
left: 'codicon codicon-debug-reverse-continue',
|
|
@@ -13760,11 +13694,11 @@ class KolPopover {
|
|
|
13760
13694
|
registerInstance(this, hostRef);
|
|
13761
13695
|
this.hidePopoverByEscape = (event) => {
|
|
13762
13696
|
if (event.key === 'Escape')
|
|
13763
|
-
this.hidePopover();
|
|
13697
|
+
this.hidePopover(event);
|
|
13764
13698
|
};
|
|
13765
13699
|
this.hidePopoverByClickOutside = (event) => {
|
|
13766
13700
|
if (this.host && !this.host.contains(event.target)) {
|
|
13767
|
-
this.hidePopover();
|
|
13701
|
+
this.hidePopover(event);
|
|
13768
13702
|
}
|
|
13769
13703
|
};
|
|
13770
13704
|
this.catchHostAndTriggerElement = (element) => {
|
|
@@ -13780,9 +13714,11 @@ class KolPopover {
|
|
|
13780
13714
|
this.arrowElement = element;
|
|
13781
13715
|
};
|
|
13782
13716
|
this._align = 'top';
|
|
13717
|
+
this._on = undefined;
|
|
13783
13718
|
this._show = false;
|
|
13784
13719
|
this.state = {
|
|
13785
13720
|
_align: 'top',
|
|
13721
|
+
_on: {},
|
|
13786
13722
|
_show: false,
|
|
13787
13723
|
_visible: false,
|
|
13788
13724
|
};
|
|
@@ -13799,12 +13735,13 @@ class KolPopover {
|
|
|
13799
13735
|
this.state = Object.assign(Object.assign({}, this.state), { _visible: true });
|
|
13800
13736
|
}
|
|
13801
13737
|
}
|
|
13802
|
-
hidePopover() {
|
|
13803
|
-
var _a;
|
|
13738
|
+
hidePopover(event) {
|
|
13739
|
+
var _a, _b, _c;
|
|
13804
13740
|
this.state = Object.assign(Object.assign({}, this.state), { _visible: false });
|
|
13805
13741
|
this._show = false;
|
|
13806
13742
|
(_a = this.triggerElement) === null || _a === void 0 ? void 0 : _a.focus();
|
|
13807
13743
|
this.removeListenersToBody();
|
|
13744
|
+
(_c = (_b = this.state._on) === null || _b === void 0 ? void 0 : _b.onClose) === null || _c === void 0 ? void 0 : _c.call(_b, event);
|
|
13808
13745
|
}
|
|
13809
13746
|
addListenersToBody() {
|
|
13810
13747
|
var _a;
|
|
@@ -13825,11 +13762,14 @@ class KolPopover {
|
|
|
13825
13762
|
});
|
|
13826
13763
|
}
|
|
13827
13764
|
render() {
|
|
13828
|
-
return (hAsync(Host, { key: '
|
|
13765
|
+
return (hAsync(Host, { key: '08aee53cfe44cbf919c23ead27450c60503f3ae9', ref: this.catchHostAndTriggerElement, class: "kol-popover" }, hAsync("div", { key: '2d9e3ca85b144564023029ef1cd89d78059bea4b', class: { popover: true, show: this.state._visible }, ref: this.catchPopoverElement, hidden: !this.state._show }, hAsync("div", { key: '5174ee3c34a5ab1b130f0a2412cb595dd312fe9b', class: `arrow ${this.state._align}`, ref: this.catchArrowElement }), hAsync("slot", { key: 'a1756190c8f58cfbb7f318a1f93b494843f4c3db' }))));
|
|
13829
13766
|
}
|
|
13830
13767
|
validateAlign(value) {
|
|
13831
13768
|
validateAlign(this, value);
|
|
13832
13769
|
}
|
|
13770
|
+
validateOn(value) {
|
|
13771
|
+
validatePopoverCallbacks(this, value);
|
|
13772
|
+
}
|
|
13833
13773
|
validateShow(value) {
|
|
13834
13774
|
validateShow(this, value);
|
|
13835
13775
|
if (value)
|
|
@@ -13841,6 +13781,7 @@ class KolPopover {
|
|
|
13841
13781
|
}
|
|
13842
13782
|
static get watchers() { return {
|
|
13843
13783
|
"_align": ["validateAlign"],
|
|
13784
|
+
"_on": ["validateOn"],
|
|
13844
13785
|
"_show": ["validateShow"]
|
|
13845
13786
|
}; }
|
|
13846
13787
|
static get style() { return KolPopoverWcStyle0; }
|
|
@@ -13849,6 +13790,7 @@ class KolPopover {
|
|
|
13849
13790
|
"$tagName$": "kol-popover-wc",
|
|
13850
13791
|
"$members$": {
|
|
13851
13792
|
"_align": [1],
|
|
13793
|
+
"_on": [16],
|
|
13852
13794
|
"_show": [1540],
|
|
13853
13795
|
"state": [32]
|
|
13854
13796
|
},
|
|
@@ -13858,8 +13800,8 @@ class KolPopover {
|
|
|
13858
13800
|
}; }
|
|
13859
13801
|
}
|
|
13860
13802
|
|
|
13861
|
-
const defaultStyleCss$
|
|
13862
|
-
var KolProgressDefaultStyle0 = defaultStyleCss$
|
|
13803
|
+
const defaultStyleCss$f = "@layer kol-global {\n .sc-kol-progress-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-progress-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-progress-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-progress-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n progress {\n display: block;\n height: 0;\n overflow: hidden;\n width: 0;\n }\n .bar {\n width: 150px;\n }\n .bar .border {\n fill: transparent;\n stroke: black;\n }\n .bar .background {\n fill: lightgray;\n stroke: white;\n }\n .bar .progress {\n fill: #0075ff;\n stroke: transparent;\n transition: 250ms ease-in-out 50ms;\n }\n .cycle .background {\n fill: transparent;\n stroke: lightgray;\n }\n .cycle .border {\n fill: transparent;\n stroke: black;\n }\n .cycle .whitespace {\n fill: transparent;\n stroke: white;\n }\n .cycle .progress {\n fill: transparent;\n stroke: #0075ff;\n transform-origin: 50% 50%;\n transform: rotate(-90deg);\n transition: 250ms ease-in-out 50ms;\n }\n \n @media (prefers-reduced-motion) {\n .progress {\n transition-duration: 0s;\n transition-delay: 0s;\n }\n }\n}";
|
|
13804
|
+
var KolProgressDefaultStyle0 = defaultStyleCss$f;
|
|
13863
13805
|
|
|
13864
13806
|
const VALID_VARIANTS = Object.keys(KoliBriProgressVariantEnum);
|
|
13865
13807
|
const CycleSvg = ({ state }) => {
|
|
@@ -13901,7 +13843,7 @@ class KolProcess {
|
|
|
13901
13843
|
};
|
|
13902
13844
|
}
|
|
13903
13845
|
render() {
|
|
13904
|
-
return (hAsync(Host, { key: '
|
|
13846
|
+
return (hAsync(Host, { key: 'dd9bd33793492d68c12244d65bc496b3854a5ff8', class: "kol-progress" }, createProgressSVG(this.state), hAsync("progress", { key: '11bcc7740948e6cda74526ad8941166834771cde', "aria-busy": this.state._value < this.state._max ? 'true' : 'false', max: this.state._max, value: this.state._value }), hAsync("span", { key: '6bbf5a8e7dc9ac05f7e64f5a4e67241a48aa44b2', "aria-live": "polite", "aria-relevant": "removals text", class: "visually-hidden" }, this.state._liveValue, " von ", this.state._max, " ", this.state._unit)));
|
|
13905
13847
|
}
|
|
13906
13848
|
validateLabel(value) {
|
|
13907
13849
|
validateLabel(this, value);
|
|
@@ -13970,8 +13912,8 @@ class KolProcess {
|
|
|
13970
13912
|
}; }
|
|
13971
13913
|
}
|
|
13972
13914
|
|
|
13973
|
-
const defaultStyleCss$
|
|
13974
|
-
var KolQuoteDefaultStyle0 = defaultStyleCss$
|
|
13915
|
+
const defaultStyleCss$e = "@charset \"UTF-8\";\n\n@layer kol-global {\n .sc-kol-quote-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-quote-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-quote-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-quote-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n cite,\n figure,\n q + figcaption {\n display: inline;\n margin: 0;\n padding: 0;\n }\n blockquote:before {\n content: open-quote;\n }\n blockquote::after {\n content: close-quote;\n }\n cite:before {\n content: \"—\";\n }\n .block cite:before {\n padding-right: 0.5em;\n }\n .inline cite:before {\n padding: 0.5em;\n }\n}";
|
|
13916
|
+
var KolQuoteDefaultStyle0 = defaultStyleCss$e;
|
|
13975
13917
|
|
|
13976
13918
|
class KolQuote {
|
|
13977
13919
|
constructor(hostRef) {
|
|
@@ -14010,9 +13952,9 @@ class KolQuote {
|
|
|
14010
13952
|
}
|
|
14011
13953
|
render() {
|
|
14012
13954
|
const hasExpertSlot = showExpertSlot(this.state._quote);
|
|
14013
|
-
return (hAsync(Host, { key: '
|
|
13955
|
+
return (hAsync(Host, { key: '08232b44e1ee7d5f3acfc4fcd846fa85a9731b0f', class: "kol-quote" }, hAsync("figure", { key: '23b315c6c5b6ca342fa0c88b08c8d335ffb032d6', class: {
|
|
14014
13956
|
[this.state._variant]: true,
|
|
14015
|
-
} }, this.state._variant === 'block' ? (hAsync("blockquote", { cite: this.state._href }, this.state._quote, hAsync("span", { "aria-hidden": !hasExpertSlot ? 'true' : undefined, hidden: !hasExpertSlot }, hAsync("slot", { name: "expert" })))) : (hAsync("q", { cite: this.state._href }, this.state._quote, hAsync("span", { "aria-hidden": !hasExpertSlot ? 'true' : undefined, hidden: !hasExpertSlot }, hAsync("slot", { name: "expert" })))), typeof this.state._label === 'string' && this.state._label.length > 0 && (hAsync("figcaption", { key: '
|
|
13957
|
+
} }, this.state._variant === 'block' ? (hAsync("blockquote", { cite: this.state._href }, this.state._quote, hAsync("span", { "aria-hidden": !hasExpertSlot ? 'true' : undefined, hidden: !hasExpertSlot }, hAsync("slot", { name: "expert" })))) : (hAsync("q", { cite: this.state._href }, this.state._quote, hAsync("span", { "aria-hidden": !hasExpertSlot ? 'true' : undefined, hidden: !hasExpertSlot }, hAsync("slot", { name: "expert" })))), typeof this.state._label === 'string' && this.state._label.length > 0 && (hAsync("figcaption", { key: '5c5b876fb1ec7230f478e3283e056ae72dfba220' }, hAsync("cite", { key: 'b264ba94846f2b895d6d400b7d4f642445111cbf' }, hAsync(KolLinkTag, { key: 'b32b9d1716549f5a3b3d9b96ac74e534eb03cf60', _href: this.state._href, _label: this.state._label, _target: "_blank" })))))));
|
|
14016
13958
|
}
|
|
14017
13959
|
static get watchers() { return {
|
|
14018
13960
|
"_label": ["validateLabel"],
|
|
@@ -14108,76 +14050,555 @@ class SelectController extends InputIconController {
|
|
|
14108
14050
|
},
|
|
14109
14051
|
});
|
|
14110
14052
|
}
|
|
14111
|
-
componentWillLoad() {
|
|
14112
|
-
super.componentWillLoad();
|
|
14113
|
-
this.validateOptions(this.component._options);
|
|
14114
|
-
this.validateMultiple(this.component._multiple);
|
|
14115
|
-
this.validateRequired(this.component._required);
|
|
14116
|
-
this.validateRows(this.component._rows);
|
|
14117
|
-
this.validateValue(this.component._value);
|
|
14053
|
+
componentWillLoad() {
|
|
14054
|
+
super.componentWillLoad();
|
|
14055
|
+
this.validateOptions(this.component._options);
|
|
14056
|
+
this.validateMultiple(this.component._multiple);
|
|
14057
|
+
this.validateRequired(this.component._required);
|
|
14058
|
+
this.validateRows(this.component._rows);
|
|
14059
|
+
this.validateValue(this.component._value);
|
|
14060
|
+
}
|
|
14061
|
+
}
|
|
14062
|
+
|
|
14063
|
+
const defaultStyleCss$d = "@layer kol-global {\n .sc-kol-select-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-select-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-select-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .required label > span::after,\n .required legend > span::after {\n content: \"*\";\n }\n}\n@layer kol-component {\n .sc-kol-select-default-h {\n display: block;\n }\n}\n@layer kol-component {\n input,\n textarea {\n cursor: text;\n }\n input[type=checkbox],\n input[type=color],\n input[type=file],\n input[type=radio],\n input[type=range],\n label,\n option,\n select {\n cursor: pointer;\n }\n \n \n \n input[type=color],\n input[type=date],\n input[type=datetime-local],\n input[type=email],\n input[type=file],\n input[type=month],\n input[type=number],\n input[type=password],\n input[type=search],\n input[type=tel],\n input[type=text],\n input[type=time],\n input[type=url],\n input[type=week],\n select,\n select[multiple] option,\n textarea {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n width: 100%;\n }\n \n input[type=file] {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n }\n \n select[multiple] option {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n }\n}\n@layer kol-component {\n .kol-input {\n display: grid;\n }\n .kol-input .input-slot {\n flex-grow: 1;\n }\n input:not([type=checkbox], [type=radio]),\n select:not([multiple], [size]) {\n height: 2.75em;\n }\n input:focus,\n option:focus,\n select:focus,\n textarea:focus {\n outline: 0;\n }\n .input {\n display: flex;\n align-items: center;\n }\n .input > .kol-icon {\n display: grid;\n height: var(--a11y-min-size);\n place-items: center;\n }\n .kol-input.required .input-tooltip .span-label::after {\n content: \"*\";\n }\n}\n\n@layer kol-global {\n .sc-kol-select-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-select-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-select-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-select-default-h {\n display: block;\n }\n}\n@layer kol-component {\n .kol-alert-wc {\n display: grid;\n }\n .kol-alert-wc .heading {\n display: flex;\n place-items: center;\n }\n .kol-alert-wc .heading > div {\n flex-grow: 1;\n }\n .close {\n \n outline: transparent solid 1px;\n }\n}\n@layer kol-component {\n .sc-kol-select-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n}";
|
|
14064
|
+
var KolSelectDefaultStyle0 = defaultStyleCss$d;
|
|
14065
|
+
|
|
14066
|
+
const isSelected = (valueList, optionValue) => {
|
|
14067
|
+
return Array.isArray(valueList) && valueList.includes(optionValue);
|
|
14068
|
+
};
|
|
14069
|
+
class KolSelect {
|
|
14070
|
+
async getValue() {
|
|
14071
|
+
return this.state._value;
|
|
14072
|
+
}
|
|
14073
|
+
async focus() {
|
|
14074
|
+
await this.kolFocus();
|
|
14075
|
+
}
|
|
14076
|
+
async kolFocus() {
|
|
14077
|
+
var _a;
|
|
14078
|
+
(_a = this.selectRef) === null || _a === void 0 ? void 0 : _a.focus();
|
|
14079
|
+
}
|
|
14080
|
+
renderOptgroup(optgroup, preKey) {
|
|
14081
|
+
var _a;
|
|
14082
|
+
return (hAsync("optgroup", { disabled: optgroup.disabled, label: optgroup.label }, (_a = optgroup.options) === null || _a === void 0 ? void 0 : _a.map((option, index) => {
|
|
14083
|
+
const key = `${preKey}-${index}`;
|
|
14084
|
+
if (Array.isArray(option.options)) {
|
|
14085
|
+
return this.renderOptgroup(option, key);
|
|
14086
|
+
}
|
|
14087
|
+
else {
|
|
14088
|
+
return (hAsync("option", { disabled: option.disabled, key: key, selected: isSelected(this.state._value, option.value), value: key }, option.label));
|
|
14089
|
+
}
|
|
14090
|
+
})));
|
|
14091
|
+
}
|
|
14092
|
+
render() {
|
|
14093
|
+
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
14094
|
+
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
14095
|
+
return (hAsync(Host, { key: '5c65d97077bdf5a3d3464e1e99b1250ee73f5854', class: { 'kol-select': true, 'has-value': this.state._hasValue } }, hAsync(KolInputWcTag, { key: 'a25c65cad1afdb4af663dc4f1f1d59953cb5541d', class: {
|
|
14096
|
+
'hide-label': !!this.state._hideLabel,
|
|
14097
|
+
select: true,
|
|
14098
|
+
}, _accessKey: this.state._accessKey, _disabled: this.state._disabled, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _msg: this.state._msg, _required: this.state._required, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.selectRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: 'e17163aa892c06a4cb4cc436646a9a6987426ba4', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedAccessKey, { accessKey: this.state._accessKey, label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, this.state._accessKey))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '6bb946f289f25dfb3eae4d59d090d6d087f90cce', slot: "input" }, hAsync("form", { key: '3779103b74a973a67e5c20f0882a78c3c0a84a01', onSubmit: (event) => {
|
|
14099
|
+
event.preventDefault();
|
|
14100
|
+
propagateSubmitEventToForm({
|
|
14101
|
+
form: this.host,
|
|
14102
|
+
ref: this.selectRef,
|
|
14103
|
+
});
|
|
14104
|
+
} }, hAsync("input", { key: '77a378acca5561f63e8ae062e0de4e068fd50b96', type: "submit", hidden: true }), hAsync("select", Object.assign({ key: '89d75cef3db8e79fdb8a29948a23b88c4225eac5', ref: this.catchRef, title: "", accessKey: this.state._accessKey, "aria-describedby": ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, "aria-label": this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, autoCapitalize: "off", autoCorrect: "off", disabled: this.state._disabled, id: this.state._id, multiple: this.state._multiple, name: this.state._name, required: this.state._required, size: this.state._rows, spellcheck: "false" }, this.controller.onFacade, { onInput: this.onInput.bind(this), onChange: this.onChange.bind(this) }), this.state._options.map((option, index) => {
|
|
14105
|
+
const key = `-${index}`;
|
|
14106
|
+
if (Array.isArray(option.options)) {
|
|
14107
|
+
return this.renderOptgroup(option, key);
|
|
14108
|
+
}
|
|
14109
|
+
else {
|
|
14110
|
+
return (hAsync("option", { disabled: option.disabled, key: key, selected: isSelected(this.state._value, option.value), value: key }, option.label));
|
|
14111
|
+
}
|
|
14112
|
+
})))))));
|
|
14113
|
+
}
|
|
14114
|
+
constructor(hostRef) {
|
|
14115
|
+
registerInstance(this, hostRef);
|
|
14116
|
+
this.catchRef = (ref) => {
|
|
14117
|
+
this.selectRef = ref;
|
|
14118
|
+
};
|
|
14119
|
+
this._accessKey = undefined;
|
|
14120
|
+
this._alert = true;
|
|
14121
|
+
this._disabled = false;
|
|
14122
|
+
this._error = undefined;
|
|
14123
|
+
this._hideError = false;
|
|
14124
|
+
this._hideLabel = false;
|
|
14125
|
+
this._hint = '';
|
|
14126
|
+
this._icons = undefined;
|
|
14127
|
+
this._id = undefined;
|
|
14128
|
+
this._label = undefined;
|
|
14129
|
+
this._msg = undefined;
|
|
14130
|
+
this._multiple = false;
|
|
14131
|
+
this._name = undefined;
|
|
14132
|
+
this._on = undefined;
|
|
14133
|
+
this._options = undefined;
|
|
14134
|
+
this._required = false;
|
|
14135
|
+
this._rows = undefined;
|
|
14136
|
+
this._syncValueBySelector = undefined;
|
|
14137
|
+
this._tabIndex = undefined;
|
|
14138
|
+
this._tooltipAlign = 'top';
|
|
14139
|
+
this._touched = false;
|
|
14140
|
+
this._value = undefined;
|
|
14141
|
+
this.state = {
|
|
14142
|
+
_hasValue: false,
|
|
14143
|
+
_hideError: false,
|
|
14144
|
+
_id: `id-${nonce()}`,
|
|
14145
|
+
_label: '',
|
|
14146
|
+
_multiple: false,
|
|
14147
|
+
_options: [],
|
|
14148
|
+
_value: [],
|
|
14149
|
+
};
|
|
14150
|
+
this.controller = new SelectController(this, 'select', this.host);
|
|
14151
|
+
}
|
|
14152
|
+
validateAccessKey(value) {
|
|
14153
|
+
this.controller.validateAccessKey(value);
|
|
14154
|
+
}
|
|
14155
|
+
validateAlert(value) {
|
|
14156
|
+
this.controller.validateAlert(value);
|
|
14157
|
+
}
|
|
14158
|
+
validateDisabled(value) {
|
|
14159
|
+
this.controller.validateDisabled(value);
|
|
14160
|
+
}
|
|
14161
|
+
validateError(value) {
|
|
14162
|
+
this.controller.validateError(value);
|
|
14163
|
+
}
|
|
14164
|
+
validateHideError(value) {
|
|
14165
|
+
this.controller.validateHideError(value);
|
|
14166
|
+
}
|
|
14167
|
+
validateHideLabel(value) {
|
|
14168
|
+
this.controller.validateHideLabel(value);
|
|
14169
|
+
}
|
|
14170
|
+
validateHint(value) {
|
|
14171
|
+
this.controller.validateHint(value);
|
|
14172
|
+
}
|
|
14173
|
+
validateIcons(value) {
|
|
14174
|
+
this.controller.validateIcons(value);
|
|
14175
|
+
}
|
|
14176
|
+
validateId(value) {
|
|
14177
|
+
this.controller.validateId(value);
|
|
14178
|
+
}
|
|
14179
|
+
validateLabel(value) {
|
|
14180
|
+
this.controller.validateLabel(value);
|
|
14181
|
+
}
|
|
14182
|
+
validateMsg(value) {
|
|
14183
|
+
this.controller.validateMsg(value);
|
|
14184
|
+
}
|
|
14185
|
+
validateMultiple(value) {
|
|
14186
|
+
this.controller.validateMultiple(value);
|
|
14187
|
+
}
|
|
14188
|
+
validateName(value) {
|
|
14189
|
+
this.controller.validateName(value);
|
|
14190
|
+
}
|
|
14191
|
+
validateOn(value) {
|
|
14192
|
+
this.controller.validateOn(value);
|
|
14193
|
+
}
|
|
14194
|
+
validateOptions(value) {
|
|
14195
|
+
this.controller.validateOptions(value);
|
|
14196
|
+
}
|
|
14197
|
+
validateRequired(value) {
|
|
14198
|
+
this.controller.validateRequired(value);
|
|
14199
|
+
}
|
|
14200
|
+
validateRows(value) {
|
|
14201
|
+
this.controller.validateRows(value);
|
|
14202
|
+
}
|
|
14203
|
+
validateSyncValueBySelector(value) {
|
|
14204
|
+
this.controller.validateSyncValueBySelector(value);
|
|
14205
|
+
}
|
|
14206
|
+
validateTabIndex(value) {
|
|
14207
|
+
this.controller.validateTabIndex(value);
|
|
14208
|
+
}
|
|
14209
|
+
validateTouched(value) {
|
|
14210
|
+
this.controller.validateTouched(value);
|
|
14211
|
+
}
|
|
14212
|
+
validateValue(value) {
|
|
14213
|
+
this.controller.validateValue(value);
|
|
14214
|
+
}
|
|
14215
|
+
componentWillLoad() {
|
|
14216
|
+
this._alert = this._alert === true;
|
|
14217
|
+
this._touched = this._touched === true;
|
|
14218
|
+
this.controller.componentWillLoad();
|
|
14219
|
+
this.state._hasValue = !!this.state._value;
|
|
14220
|
+
this.controller.addValueChangeListener((v) => (this.state._hasValue = !!v));
|
|
14221
|
+
}
|
|
14222
|
+
onInput(event) {
|
|
14223
|
+
var _a, _b, _c;
|
|
14224
|
+
this._value = Array.from(((_a = this.selectRef) === null || _a === void 0 ? void 0 : _a.options) || [])
|
|
14225
|
+
.filter((option) => option.selected === true)
|
|
14226
|
+
.map((option) => { var _a; return (_a = this.controller.getOptionByKey(option.value)) === null || _a === void 0 ? void 0 : _a.value; });
|
|
14227
|
+
tryToDispatchKoliBriEvent('input', this.host, this._value);
|
|
14228
|
+
(_c = (_b = this.state._on) === null || _b === void 0 ? void 0 : _b.onInput) === null || _c === void 0 ? void 0 : _c.call(_b, event, this._value);
|
|
14229
|
+
}
|
|
14230
|
+
onChange(event) {
|
|
14231
|
+
var _a, _b;
|
|
14232
|
+
stopPropagation(event);
|
|
14233
|
+
tryToDispatchKoliBriEvent('change', this.host, this._value);
|
|
14234
|
+
this.controller.setFormAssociatedValue(this._value);
|
|
14235
|
+
(_b = (_a = this.state._on) === null || _a === void 0 ? void 0 : _a.onChange) === null || _b === void 0 ? void 0 : _b.call(_a, event, this._value);
|
|
14236
|
+
}
|
|
14237
|
+
get host() { return getElement(this); }
|
|
14238
|
+
static get watchers() { return {
|
|
14239
|
+
"_accessKey": ["validateAccessKey"],
|
|
14240
|
+
"_alert": ["validateAlert"],
|
|
14241
|
+
"_disabled": ["validateDisabled"],
|
|
14242
|
+
"_error": ["validateError"],
|
|
14243
|
+
"_hideError": ["validateHideError"],
|
|
14244
|
+
"_hideLabel": ["validateHideLabel"],
|
|
14245
|
+
"_hint": ["validateHint"],
|
|
14246
|
+
"_icons": ["validateIcons"],
|
|
14247
|
+
"_id": ["validateId"],
|
|
14248
|
+
"_label": ["validateLabel"],
|
|
14249
|
+
"_msg": ["validateMsg"],
|
|
14250
|
+
"_multiple": ["validateMultiple"],
|
|
14251
|
+
"_name": ["validateName"],
|
|
14252
|
+
"_on": ["validateOn"],
|
|
14253
|
+
"_options": ["validateOptions"],
|
|
14254
|
+
"_required": ["validateRequired"],
|
|
14255
|
+
"_rows": ["validateRows"],
|
|
14256
|
+
"_syncValueBySelector": ["validateSyncValueBySelector"],
|
|
14257
|
+
"_tabIndex": ["validateTabIndex"],
|
|
14258
|
+
"_touched": ["validateTouched"],
|
|
14259
|
+
"_value": ["validateValue"]
|
|
14260
|
+
}; }
|
|
14261
|
+
static get style() { return {
|
|
14262
|
+
default: KolSelectDefaultStyle0
|
|
14263
|
+
}; }
|
|
14264
|
+
static get cmpMeta() { return {
|
|
14265
|
+
"$flags$": 41,
|
|
14266
|
+
"$tagName$": "kol-select",
|
|
14267
|
+
"$members$": {
|
|
14268
|
+
"_accessKey": [1, "_access-key"],
|
|
14269
|
+
"_alert": [1540],
|
|
14270
|
+
"_disabled": [4],
|
|
14271
|
+
"_error": [1],
|
|
14272
|
+
"_hideError": [1540, "_hide-error"],
|
|
14273
|
+
"_hideLabel": [4, "_hide-label"],
|
|
14274
|
+
"_hint": [1],
|
|
14275
|
+
"_icons": [1],
|
|
14276
|
+
"_id": [1],
|
|
14277
|
+
"_label": [1],
|
|
14278
|
+
"_msg": [16],
|
|
14279
|
+
"_multiple": [4],
|
|
14280
|
+
"_name": [1],
|
|
14281
|
+
"_on": [16],
|
|
14282
|
+
"_options": [1],
|
|
14283
|
+
"_required": [4],
|
|
14284
|
+
"_rows": [2],
|
|
14285
|
+
"_syncValueBySelector": [1, "_sync-value-by-selector"],
|
|
14286
|
+
"_tabIndex": [2, "_tab-index"],
|
|
14287
|
+
"_tooltipAlign": [1, "_tooltip-align"],
|
|
14288
|
+
"_touched": [1540],
|
|
14289
|
+
"_value": [1025],
|
|
14290
|
+
"state": [32],
|
|
14291
|
+
"getValue": [64],
|
|
14292
|
+
"focus": [64],
|
|
14293
|
+
"kolFocus": [64]
|
|
14294
|
+
},
|
|
14295
|
+
"$listeners$": undefined,
|
|
14296
|
+
"$lazyBundleId$": "-",
|
|
14297
|
+
"$attrsToReflect$": [["_alert", "_alert"], ["_hideError", "_hide-error"], ["_touched", "_touched"]]
|
|
14298
|
+
}; }
|
|
14299
|
+
}
|
|
14300
|
+
|
|
14301
|
+
class SingleSelectController extends InputIconController {
|
|
14302
|
+
constructor(component, name, host) {
|
|
14303
|
+
super(component, name, host);
|
|
14304
|
+
this.keyOptionMap = new Map();
|
|
14305
|
+
this.afterPatchOptions = (value, _state, _component, key) => {
|
|
14306
|
+
if (key === '_value') {
|
|
14307
|
+
this.setFormAssociatedValue(value);
|
|
14308
|
+
}
|
|
14309
|
+
};
|
|
14310
|
+
this.beforePatchOptions = (_value, nextState) => {
|
|
14311
|
+
const options = nextState.has('_options') ? nextState.get('_options') : this.component.state._options;
|
|
14312
|
+
if (Array.isArray(options) && options.length > 0) {
|
|
14313
|
+
this.keyOptionMap.clear();
|
|
14314
|
+
fillKeyOptionMap(this.keyOptionMap, options);
|
|
14315
|
+
}
|
|
14316
|
+
};
|
|
14317
|
+
this.component = component;
|
|
14318
|
+
}
|
|
14319
|
+
validateOptions(value) {
|
|
14320
|
+
validateOptions(this.component, value, {
|
|
14321
|
+
hooks: {
|
|
14322
|
+
afterPatch: this.afterPatchOptions,
|
|
14323
|
+
beforePatch: this.beforePatchOptions,
|
|
14324
|
+
},
|
|
14325
|
+
});
|
|
14326
|
+
}
|
|
14327
|
+
validateRequired(value) {
|
|
14328
|
+
watchBoolean(this.component, '_required', value);
|
|
14329
|
+
}
|
|
14330
|
+
validateValue(value) {
|
|
14331
|
+
watchString(this.component, '_value', value);
|
|
14332
|
+
}
|
|
14333
|
+
validateMsg(value) {
|
|
14334
|
+
validateMsg(this.component, value);
|
|
14335
|
+
}
|
|
14336
|
+
validatePlaceholder(value) {
|
|
14337
|
+
watchString(this.component, '_placeholder', value);
|
|
14338
|
+
}
|
|
14339
|
+
componentWillLoad() {
|
|
14340
|
+
super.componentWillLoad();
|
|
14341
|
+
this.validateOptions(this.component._options);
|
|
14342
|
+
this.validateRequired(this.component._required);
|
|
14343
|
+
this.validateValue(this.component._value);
|
|
14344
|
+
this.validatePlaceholder(this.component._placeholder);
|
|
14345
|
+
}
|
|
14346
|
+
}
|
|
14347
|
+
|
|
14348
|
+
const defaultStyleCss$c = "@layer kol-global {\n .sc-kol-single-select-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-single-select-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-single-select-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .required label > span::after,\n .required legend > span::after {\n content: \"*\";\n }\n}\n@layer kol-component {\n .sc-kol-single-select-default-h {\n display: block;\n }\n}\n@layer kol-component {\n input,\n textarea {\n cursor: text;\n }\n input[type=checkbox],\n input[type=color],\n input[type=file],\n input[type=radio],\n input[type=range],\n label,\n option,\n select {\n cursor: pointer;\n }\n \n \n \n input[type=color],\n input[type=date],\n input[type=datetime-local],\n input[type=email],\n input[type=file],\n input[type=month],\n input[type=number],\n input[type=password],\n input[type=search],\n input[type=tel],\n input[type=text],\n input[type=time],\n input[type=url],\n input[type=week],\n select,\n select[multiple] option,\n textarea {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n width: 100%;\n }\n \n input[type=file] {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n }\n \n select[multiple] option {\n padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n }\n}\n@layer kol-component {\n .kol-input {\n display: grid;\n }\n .kol-input .input-slot {\n flex-grow: 1;\n }\n input:not([type=checkbox], [type=radio]),\n select:not([multiple], [size]) {\n height: 2.75em;\n }\n input:focus,\n option:focus,\n select:focus,\n textarea:focus {\n outline: 0;\n }\n .input {\n display: flex;\n align-items: center;\n }\n .input > .kol-icon {\n display: grid;\n height: var(--a11y-min-size);\n place-items: center;\n }\n .kol-input.required .input-tooltip .span-label::after {\n content: \"*\";\n }\n}\n@layer kol-component {\n .sc-kol-single-select-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .single-select {\n position: relative;\n }\n .single-select.disabled, .single-select.disabled * {\n cursor: not-allowed !important;\n }\n .single-select__group {\n display: inline-flex;\n align-items: center;\n }\n .single-select__input {\n flex-grow: 1;\n }\n .single-select__button {\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .single-select__listbox {\n display: block;\n position: absolute;\n list-style-type: none;\n margin: 0;\n padding: 0;\n overflow-y: auto;\n overflow-x: hidden;\n z-index: 2;\n background-color: white;\n max-height: calc(250rem / var(--kolibri-root-font-size, 16));\n }\n .single-select__item.highlighted {\n background-color: #f0f0f0;\n }\n .single-select__listbox--cursor-hidden .single-select__item {\n cursor: none !important;\n }\n .single-select__no-results-message {\n cursor: default;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: calc(50rem / var(--kolibri-root-font-size, 16));\n }\n}";
|
|
14349
|
+
var KolSingleSelectDefaultStyle0 = defaultStyleCss$c;
|
|
14350
|
+
|
|
14351
|
+
class KolSingleSelect {
|
|
14352
|
+
async getValue() {
|
|
14353
|
+
return this.state._value;
|
|
14354
|
+
}
|
|
14355
|
+
async kolFocus() {
|
|
14356
|
+
var _a;
|
|
14357
|
+
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
14358
|
+
}
|
|
14359
|
+
onBlur() {
|
|
14360
|
+
var _a;
|
|
14361
|
+
if (Array.isArray(this.state._options) && this.state._options.length > 0 && !this.state._options.some((option) => option.label === this._inputValue)) {
|
|
14362
|
+
this._inputValue = (_a = this.state._options.find((option) => option.value === this.state._value)) === null || _a === void 0 ? void 0 : _a.label;
|
|
14363
|
+
this._filteredOptions = [...this.state._options];
|
|
14364
|
+
}
|
|
14365
|
+
this._isOpen = false;
|
|
14366
|
+
}
|
|
14367
|
+
clearSelection() {
|
|
14368
|
+
if (this.state._disabled) {
|
|
14369
|
+
return;
|
|
14370
|
+
}
|
|
14371
|
+
else {
|
|
14372
|
+
this._focusedOptionIndex = -1;
|
|
14373
|
+
this.state._value = '';
|
|
14374
|
+
this._inputValue = '';
|
|
14375
|
+
this._filteredOptions = [...this.state._options];
|
|
14376
|
+
this.controller.setFormAssociatedValue(this.state._value);
|
|
14377
|
+
}
|
|
14378
|
+
}
|
|
14379
|
+
selectOption(event, option) {
|
|
14380
|
+
this.state._value = option.value;
|
|
14381
|
+
this._inputValue = option.label;
|
|
14382
|
+
this.controller.onFacade.onChange(event, option.value);
|
|
14383
|
+
this.controller.onFacade.onInput(event, false, option.value);
|
|
14384
|
+
this._filteredOptions = [...this.state._options];
|
|
14385
|
+
this.controller.setFormAssociatedValue(this.state._value);
|
|
14386
|
+
}
|
|
14387
|
+
onInput(event) {
|
|
14388
|
+
const target = event.target;
|
|
14389
|
+
this._inputValue = target.value;
|
|
14390
|
+
this._isOpen = true;
|
|
14391
|
+
this.setFilteredOptionsByQuery(target.value);
|
|
14392
|
+
this._focusedOptionIndex = -1;
|
|
14393
|
+
}
|
|
14394
|
+
handleKeyDownDropdown(event) {
|
|
14395
|
+
if (event.key.length === 1 && /[a-z0-9]/i.test(event.key)) {
|
|
14396
|
+
event.preventDefault();
|
|
14397
|
+
this._isOpen = true;
|
|
14398
|
+
this.focusSuggestionStartingWith(event.key);
|
|
14399
|
+
}
|
|
14400
|
+
}
|
|
14401
|
+
setFilteredOptionsByQuery(query) {
|
|
14402
|
+
if ((query === null || query === void 0 ? void 0 : query.trim()) === '') {
|
|
14403
|
+
this._filteredOptions = [...this.state._options];
|
|
14404
|
+
}
|
|
14405
|
+
else if (Array.isArray(this.state._options) && this.state._options.length > 0 && query.length > 0) {
|
|
14406
|
+
this._filteredOptions = this.state._options.filter((option) => {
|
|
14407
|
+
var _a, _b;
|
|
14408
|
+
return (_b = (_a = option.label) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === null || _b === void 0 ? void 0 : _b.includes(query === null || query === void 0 ? void 0 : query.toLowerCase());
|
|
14409
|
+
});
|
|
14410
|
+
}
|
|
14411
|
+
}
|
|
14412
|
+
moveFocus(delta) {
|
|
14413
|
+
if (!this._filteredOptions) {
|
|
14414
|
+
return;
|
|
14415
|
+
}
|
|
14416
|
+
let newIndex = this._focusedOptionIndex + delta;
|
|
14417
|
+
if (newIndex >= this._filteredOptions.length) {
|
|
14418
|
+
newIndex = 0;
|
|
14419
|
+
}
|
|
14420
|
+
if (newIndex < 0) {
|
|
14421
|
+
newIndex = this._filteredOptions.length - 1;
|
|
14422
|
+
}
|
|
14423
|
+
this._focusedOptionIndex = newIndex;
|
|
14424
|
+
this.focusOption(this._focusedOptionIndex);
|
|
14425
|
+
}
|
|
14426
|
+
focusOption(index) {
|
|
14427
|
+
if (this.refOptions) {
|
|
14428
|
+
const optionElement = this.refOptions[index];
|
|
14429
|
+
optionElement === null || optionElement === void 0 ? void 0 : optionElement.focus();
|
|
14430
|
+
}
|
|
14431
|
+
}
|
|
14432
|
+
focusSuggestionStartingWith(char) {
|
|
14433
|
+
const charLowerCase = char.toLowerCase();
|
|
14434
|
+
const index = Array.isArray(this._filteredOptions) && this._filteredOptions.findIndex((option) => option.label.toLowerCase().startsWith(charLowerCase));
|
|
14435
|
+
if (typeof index === 'number') {
|
|
14436
|
+
this._focusedOptionIndex = index;
|
|
14437
|
+
this.focusOption(index);
|
|
14438
|
+
}
|
|
14118
14439
|
}
|
|
14119
|
-
|
|
14120
|
-
|
|
14121
|
-
const
|
|
14122
|
-
|
|
14123
|
-
|
|
14124
|
-
|
|
14125
|
-
|
|
14126
|
-
}
|
|
14127
|
-
|
|
14128
|
-
|
|
14129
|
-
|
|
14440
|
+
render() {
|
|
14441
|
+
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
14442
|
+
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
14443
|
+
return (hAsync(Host, { key: '6632738ce79fd7abfc1b0bc067904d544cde10ba', class: "kol-single-select" }, hAsync("div", { key: '36a27b4a40e8852831420282a0cb85f3edc3d60a', class: `single-select ${this.state._disabled === true ? 'disabled' : ''} ` }, hAsync(KolInputWcTag, { key: 'afa776c0f013c322fb2a19a7ca305bb58a2701ef', _accessKey: this.state._accessKey, _disabled: this.state._disabled, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _msg: this.state._msg, _required: this.state._required, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, role: `presentation` }, hAsync("span", { key: 'ab137cc937967e4c69e1cb38078f2f7d906c0cf2', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedAccessKey, { accessKey: this.state._accessKey, label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, this.state._accessKey))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '9e6f4178c2000d3c858fca7e8a782b255d739fdb', slot: "input" }, hAsync("div", { key: '363af0c87cafb931c104aa6645dfb4b394149cc2', class: "single-select__group" }, hAsync("input", Object.assign({ key: '19117c459f3879cf93bf0b83daae0b5d2135319f', ref: this.catchRef, class: "single-select__input", type: "text", "aria-autocomplete": "both", "aria-controls": "listbox", value: this._inputValue, accessKey: this.state._accessKey, "aria-describedby": ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, "aria-label": this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, "aria-activedescendant": this._isOpen && this._focusedOptionIndex >= 0 ? `option-${this._focusedOptionIndex}` : undefined, autoCapitalize: "off", autoCorrect: "off", disabled: this.state._disabled, name: this.state._name, required: this.state._required, spellcheck: "false" }, this.controller.onFacade, { onInput: this.onInput.bind(this), onChange: this.onChange.bind(this), placeholder: this.state._placeholder, onClick: this.toggleListbox.bind(this) })), this._inputValue && (hAsync(KolIconTag, { key: '3d7d302de15eb18d75c0576fefd97a95bb1f845f', _icons: "codicon codicon-close", _label: translate('kol-delete-selection'), onClick: () => {
|
|
14444
|
+
var _a;
|
|
14445
|
+
this.clearSelection();
|
|
14446
|
+
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
14447
|
+
}, class: "single-select__delete" })), hAsync("button", { key: '19bc6add00f14fe17e1592ede5d2f57888c6f24d', tabindex: "-1", class: "single-select__button", onClick: this.toggleListbox.bind(this), disabled: this.state._disabled }, hAsync(KolIconTag, { key: '4ff71a635386b7c68e2b4e941fd49d2410d6d973', _icons: "codicon codicon-triangle-down", _label: translate('kol-dropdown') }))), this._isOpen && !(this.state._disabled === true) && (hAsync("ul", { key: 'dfd6401798800cd78eb68a1b42d969a6b098b058', role: "listbox", class: clsx('single-select__listbox', this.blockSuggestionMouseOver && 'single-select__listbox--cursor-hidden'), onKeyDown: this.handleKeyDownDropdown.bind(this) }, Array.isArray(this._filteredOptions) && this._filteredOptions.length > 0 ? (this._filteredOptions.map((option, index) => (hAsync("li", { id: `option-${index}`, key: `-${index}`, ref: (el) => {
|
|
14448
|
+
if (el)
|
|
14449
|
+
this.refOptions[index] = el;
|
|
14450
|
+
}, tabIndex: -1, role: "option", "aria-selected": this.state._value === option.value, onClick: (event) => {
|
|
14451
|
+
var _a;
|
|
14452
|
+
this.selectOption(event, option);
|
|
14453
|
+
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
14454
|
+
this.toggleListbox(event);
|
|
14455
|
+
}, onMouseOver: () => {
|
|
14456
|
+
if (!this.blockSuggestionMouseOver) {
|
|
14457
|
+
this._focusedOptionIndex = index;
|
|
14458
|
+
this.focusOption(index);
|
|
14459
|
+
}
|
|
14460
|
+
}, onFocus: () => {
|
|
14461
|
+
this._focusedOptionIndex = index;
|
|
14462
|
+
this.focusOption(index);
|
|
14463
|
+
}, class: "single-select__item", onKeyDown: (e) => {
|
|
14464
|
+
var _a;
|
|
14465
|
+
if (e.key === 'Enter' || e.key === 'NumpadEnter') {
|
|
14466
|
+
this.selectOption(e, option);
|
|
14467
|
+
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
14468
|
+
this.toggleListbox(e);
|
|
14469
|
+
e.preventDefault();
|
|
14470
|
+
}
|
|
14471
|
+
} }, hAsync("input", { class: "visually-hidden", type: "radio", name: "options", id: `option-radio-${index}`, value: option.value, checked: this.state._value === option.value || index === this._focusedOptionIndex }), hAsync("label", { htmlFor: `option-radio-${index}`, class: "radio-label" }, option.label))))) : (hAsync("li", { class: "single-select__no-results-message" }, translate('kol-no-results-message'), " ")))))))));
|
|
14130
14472
|
}
|
|
14131
|
-
|
|
14132
|
-
|
|
14473
|
+
handleFocusOut() {
|
|
14474
|
+
setTimeout(() => {
|
|
14475
|
+
var _a;
|
|
14476
|
+
if (!((_a = this.host) === null || _a === void 0 ? void 0 : _a.contains(document.activeElement))) {
|
|
14477
|
+
this.onBlur();
|
|
14478
|
+
}
|
|
14479
|
+
}, 0);
|
|
14133
14480
|
}
|
|
14134
|
-
|
|
14135
|
-
|
|
14136
|
-
(_a = this.selectRef) === null || _a === void 0 ? void 0 : _a.focus();
|
|
14481
|
+
handleWindowBlur() {
|
|
14482
|
+
this.onBlur();
|
|
14137
14483
|
}
|
|
14138
|
-
|
|
14139
|
-
var _a;
|
|
14140
|
-
|
|
14141
|
-
|
|
14142
|
-
|
|
14143
|
-
|
|
14484
|
+
handleKeyDown(event) {
|
|
14485
|
+
var _a, _b;
|
|
14486
|
+
const handleEvent = (isOpen, callback) => {
|
|
14487
|
+
var _a;
|
|
14488
|
+
event.preventDefault();
|
|
14489
|
+
if (isOpen !== undefined) {
|
|
14490
|
+
this._isOpen = isOpen;
|
|
14491
|
+
if (!isOpen) {
|
|
14492
|
+
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
14493
|
+
}
|
|
14144
14494
|
}
|
|
14145
|
-
|
|
14146
|
-
|
|
14495
|
+
callback === null || callback === void 0 ? void 0 : callback();
|
|
14496
|
+
};
|
|
14497
|
+
switch (event.key) {
|
|
14498
|
+
case 'Down':
|
|
14499
|
+
case 'ArrowDown': {
|
|
14500
|
+
this.blockSuggestionMouseOver = true;
|
|
14501
|
+
handleEvent(true, () => this.moveFocus(1));
|
|
14502
|
+
break;
|
|
14147
14503
|
}
|
|
14148
|
-
|
|
14149
|
-
|
|
14150
|
-
|
|
14151
|
-
|
|
14152
|
-
|
|
14153
|
-
|
|
14154
|
-
|
|
14155
|
-
|
|
14156
|
-
|
|
14157
|
-
|
|
14158
|
-
|
|
14159
|
-
|
|
14160
|
-
|
|
14504
|
+
case 'Up':
|
|
14505
|
+
case 'ArrowUp': {
|
|
14506
|
+
this.blockSuggestionMouseOver = true;
|
|
14507
|
+
handleEvent(true, () => this.moveFocus(-1));
|
|
14508
|
+
break;
|
|
14509
|
+
}
|
|
14510
|
+
case 'Tab':
|
|
14511
|
+
if (this._isOpen) {
|
|
14512
|
+
this._isOpen = !this._isOpen;
|
|
14513
|
+
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
14514
|
+
}
|
|
14515
|
+
break;
|
|
14516
|
+
case 'Esc':
|
|
14517
|
+
case 'Escape': {
|
|
14518
|
+
handleEvent(false);
|
|
14519
|
+
break;
|
|
14520
|
+
}
|
|
14521
|
+
case ' ': {
|
|
14522
|
+
if (this._isOpen) {
|
|
14523
|
+
if (Array.isArray(this._filteredOptions) && this._filteredOptions.length > 0) {
|
|
14524
|
+
this.selectOption(event, this._filteredOptions[this._focusedOptionIndex]);
|
|
14525
|
+
(_b = this.refInput) === null || _b === void 0 ? void 0 : _b.focus();
|
|
14526
|
+
handleEvent(false);
|
|
14527
|
+
}
|
|
14528
|
+
}
|
|
14529
|
+
else {
|
|
14530
|
+
this.toggleListbox(event);
|
|
14531
|
+
}
|
|
14532
|
+
break;
|
|
14533
|
+
}
|
|
14534
|
+
case 'NumpadEnter':
|
|
14535
|
+
case 'Enter': {
|
|
14536
|
+
this.toggleListbox(event);
|
|
14537
|
+
break;
|
|
14538
|
+
}
|
|
14539
|
+
case 'Home': {
|
|
14540
|
+
this.blockSuggestionMouseOver = true;
|
|
14541
|
+
handleEvent(undefined, () => {
|
|
14542
|
+
if (this._isOpen) {
|
|
14543
|
+
this._focusedOptionIndex = 0;
|
|
14544
|
+
this.focusOption(this._focusedOptionIndex);
|
|
14545
|
+
}
|
|
14161
14546
|
});
|
|
14162
|
-
|
|
14163
|
-
const key = `-${index}`;
|
|
14164
|
-
if (Array.isArray(option.options)) {
|
|
14165
|
-
return this.renderOptgroup(option, key);
|
|
14547
|
+
break;
|
|
14166
14548
|
}
|
|
14167
|
-
|
|
14168
|
-
|
|
14549
|
+
case 'End': {
|
|
14550
|
+
this.blockSuggestionMouseOver = true;
|
|
14551
|
+
handleEvent(undefined, () => {
|
|
14552
|
+
if (this._isOpen) {
|
|
14553
|
+
this._focusedOptionIndex = this._filteredOptions ? this._filteredOptions.length - 1 : 0;
|
|
14554
|
+
this.focusOption(this._focusedOptionIndex);
|
|
14555
|
+
}
|
|
14556
|
+
});
|
|
14557
|
+
break;
|
|
14169
14558
|
}
|
|
14170
|
-
|
|
14559
|
+
case 'PageUp': {
|
|
14560
|
+
this.blockSuggestionMouseOver = true;
|
|
14561
|
+
handleEvent(undefined, () => this._isOpen && this.moveFocus(-10));
|
|
14562
|
+
break;
|
|
14563
|
+
}
|
|
14564
|
+
case 'PageDown': {
|
|
14565
|
+
this.blockSuggestionMouseOver = true;
|
|
14566
|
+
handleEvent(undefined, () => this._isOpen && this.moveFocus(10));
|
|
14567
|
+
break;
|
|
14568
|
+
}
|
|
14569
|
+
}
|
|
14171
14570
|
}
|
|
14172
14571
|
constructor(hostRef) {
|
|
14173
14572
|
registerInstance(this, hostRef);
|
|
14573
|
+
this.refOptions = [];
|
|
14174
14574
|
this.catchRef = (ref) => {
|
|
14175
|
-
this.
|
|
14575
|
+
this.refInput = ref;
|
|
14576
|
+
};
|
|
14577
|
+
this.toggleListbox = (event) => {
|
|
14578
|
+
var _a;
|
|
14579
|
+
event === null || event === void 0 ? void 0 : event.preventDefault();
|
|
14580
|
+
if (this.state._disabled) {
|
|
14581
|
+
return;
|
|
14582
|
+
}
|
|
14583
|
+
else {
|
|
14584
|
+
this._isOpen = !this._isOpen;
|
|
14585
|
+
if (this._isOpen) {
|
|
14586
|
+
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
14587
|
+
const selectedIndex = Array.isArray(this._filteredOptions) ? this._filteredOptions.findIndex((option) => option.label === this._inputValue) : -1;
|
|
14588
|
+
this._focusedOptionIndex = selectedIndex >= 0 ? selectedIndex : 0;
|
|
14589
|
+
this.focusOption(this._focusedOptionIndex);
|
|
14590
|
+
}
|
|
14591
|
+
}
|
|
14176
14592
|
};
|
|
14593
|
+
this._focusedOptionIndex = -1;
|
|
14594
|
+
this._isOpen = false;
|
|
14595
|
+
this._filteredOptions = [];
|
|
14596
|
+
this._inputValue = '';
|
|
14597
|
+
this.blockSuggestionMouseOver = false;
|
|
14177
14598
|
this._accessKey = undefined;
|
|
14599
|
+
this._placeholder = undefined;
|
|
14178
14600
|
this._alert = true;
|
|
14179
14601
|
this._disabled = false;
|
|
14180
|
-
this._error = undefined;
|
|
14181
14602
|
this._hideError = false;
|
|
14182
14603
|
this._hideLabel = false;
|
|
14183
14604
|
this._hint = '';
|
|
@@ -14185,27 +14606,26 @@ class KolSelect {
|
|
|
14185
14606
|
this._id = undefined;
|
|
14186
14607
|
this._label = undefined;
|
|
14187
14608
|
this._msg = undefined;
|
|
14188
|
-
this._multiple = false;
|
|
14189
14609
|
this._name = undefined;
|
|
14190
14610
|
this._on = undefined;
|
|
14191
14611
|
this._options = undefined;
|
|
14192
14612
|
this._required = false;
|
|
14193
|
-
this._rows = undefined;
|
|
14194
14613
|
this._syncValueBySelector = undefined;
|
|
14195
14614
|
this._tabIndex = undefined;
|
|
14196
14615
|
this._tooltipAlign = 'top';
|
|
14197
14616
|
this._touched = false;
|
|
14198
14617
|
this._value = undefined;
|
|
14199
14618
|
this.state = {
|
|
14200
|
-
_hasValue: false,
|
|
14201
14619
|
_hideError: false,
|
|
14202
14620
|
_id: `id-${nonce()}`,
|
|
14203
14621
|
_label: '',
|
|
14204
|
-
_multiple: false,
|
|
14205
14622
|
_options: [],
|
|
14206
|
-
_value:
|
|
14623
|
+
_value: '',
|
|
14207
14624
|
};
|
|
14208
|
-
this.controller = new
|
|
14625
|
+
this.controller = new SingleSelectController(this, 'single-select', this.host);
|
|
14626
|
+
}
|
|
14627
|
+
validatePlaceholder(value) {
|
|
14628
|
+
this.controller.validatePlaceholder(value);
|
|
14209
14629
|
}
|
|
14210
14630
|
validateAccessKey(value) {
|
|
14211
14631
|
this.controller.validateAccessKey(value);
|
|
@@ -14216,9 +14636,6 @@ class KolSelect {
|
|
|
14216
14636
|
validateDisabled(value) {
|
|
14217
14637
|
this.controller.validateDisabled(value);
|
|
14218
14638
|
}
|
|
14219
|
-
validateError(value) {
|
|
14220
|
-
this.controller.validateError(value);
|
|
14221
|
-
}
|
|
14222
14639
|
validateHideError(value) {
|
|
14223
14640
|
this.controller.validateHideError(value);
|
|
14224
14641
|
}
|
|
@@ -14240,9 +14657,6 @@ class KolSelect {
|
|
|
14240
14657
|
validateMsg(value) {
|
|
14241
14658
|
this.controller.validateMsg(value);
|
|
14242
14659
|
}
|
|
14243
|
-
validateMultiple(value) {
|
|
14244
|
-
this.controller.validateMultiple(value);
|
|
14245
|
-
}
|
|
14246
14660
|
validateName(value) {
|
|
14247
14661
|
this.controller.validateName(value);
|
|
14248
14662
|
}
|
|
@@ -14251,13 +14665,11 @@ class KolSelect {
|
|
|
14251
14665
|
}
|
|
14252
14666
|
validateOptions(value) {
|
|
14253
14667
|
this.controller.validateOptions(value);
|
|
14668
|
+
this._filteredOptions = value;
|
|
14254
14669
|
}
|
|
14255
14670
|
validateRequired(value) {
|
|
14256
14671
|
this.controller.validateRequired(value);
|
|
14257
14672
|
}
|
|
14258
|
-
validateRows(value) {
|
|
14259
|
-
this.controller.validateRows(value);
|
|
14260
|
-
}
|
|
14261
14673
|
validateSyncValueBySelector(value) {
|
|
14262
14674
|
this.controller.validateSyncValueBySelector(value);
|
|
14263
14675
|
}
|
|
@@ -14269,35 +14681,40 @@ class KolSelect {
|
|
|
14269
14681
|
}
|
|
14270
14682
|
validateValue(value) {
|
|
14271
14683
|
this.controller.validateValue(value);
|
|
14684
|
+
this.oldValue = value;
|
|
14685
|
+
}
|
|
14686
|
+
handleMouseEvent() {
|
|
14687
|
+
this.blockSuggestionMouseOver = false;
|
|
14272
14688
|
}
|
|
14273
14689
|
componentWillLoad() {
|
|
14690
|
+
this.refOptions = [];
|
|
14274
14691
|
this._alert = this._alert === true;
|
|
14275
14692
|
this._touched = this._touched === true;
|
|
14276
14693
|
this.controller.componentWillLoad();
|
|
14277
|
-
this.
|
|
14278
|
-
this.
|
|
14279
|
-
|
|
14280
|
-
|
|
14281
|
-
|
|
14282
|
-
|
|
14283
|
-
.filter((option) => option.selected === true)
|
|
14284
|
-
.map((option) => { var _a; return (_a = this.controller.getOptionByKey(option.value)) === null || _a === void 0 ? void 0 : _a.value; });
|
|
14285
|
-
tryToDispatchKoliBriEvent('input', this.host, this._value);
|
|
14286
|
-
(_c = (_b = this.state._on) === null || _b === void 0 ? void 0 : _b.onInput) === null || _c === void 0 ? void 0 : _c.call(_b, event, this._value);
|
|
14694
|
+
this.oldValue = this._value;
|
|
14695
|
+
this._filteredOptions = this._options;
|
|
14696
|
+
if (Array.isArray(this._options)) {
|
|
14697
|
+
const matchedOption = this._options.find((option) => option.value === this._value);
|
|
14698
|
+
this._inputValue = matchedOption ? matchedOption.label : '';
|
|
14699
|
+
}
|
|
14287
14700
|
}
|
|
14288
14701
|
onChange(event) {
|
|
14289
|
-
var _a, _b;
|
|
14702
|
+
var _a, _b, _c, _d;
|
|
14703
|
+
if (this.oldValue !== ((_a = this.refInput) === null || _a === void 0 ? void 0 : _a.value)) {
|
|
14704
|
+
this.oldValue = (_b = this.refInput) === null || _b === void 0 ? void 0 : _b.value;
|
|
14705
|
+
}
|
|
14290
14706
|
stopPropagation(event);
|
|
14291
14707
|
tryToDispatchKoliBriEvent('change', this.host, this._value);
|
|
14292
|
-
this.
|
|
14293
|
-
|
|
14708
|
+
if (typeof ((_c = this.state._on) === null || _c === void 0 ? void 0 : _c.onChange) === 'function' && !this._isOpen) {
|
|
14709
|
+
this.state._on.onChange(event, this._value && this.oldValue !== ((_d = this.refInput) === null || _d === void 0 ? void 0 : _d.value));
|
|
14710
|
+
}
|
|
14294
14711
|
}
|
|
14295
14712
|
get host() { return getElement(this); }
|
|
14296
14713
|
static get watchers() { return {
|
|
14714
|
+
"_placeholder": ["validatePlaceholder"],
|
|
14297
14715
|
"_accessKey": ["validateAccessKey"],
|
|
14298
14716
|
"_alert": ["validateAlert"],
|
|
14299
14717
|
"_disabled": ["validateDisabled"],
|
|
14300
|
-
"_error": ["validateError"],
|
|
14301
14718
|
"_hideError": ["validateHideError"],
|
|
14302
14719
|
"_hideLabel": ["validateHideLabel"],
|
|
14303
14720
|
"_hint": ["validateHint"],
|
|
@@ -14305,28 +14722,26 @@ class KolSelect {
|
|
|
14305
14722
|
"_id": ["validateId"],
|
|
14306
14723
|
"_label": ["validateLabel"],
|
|
14307
14724
|
"_msg": ["validateMsg"],
|
|
14308
|
-
"_multiple": ["validateMultiple"],
|
|
14309
14725
|
"_name": ["validateName"],
|
|
14310
14726
|
"_on": ["validateOn"],
|
|
14311
14727
|
"_options": ["validateOptions"],
|
|
14312
14728
|
"_required": ["validateRequired"],
|
|
14313
|
-
"_rows": ["validateRows"],
|
|
14314
14729
|
"_syncValueBySelector": ["validateSyncValueBySelector"],
|
|
14315
14730
|
"_tabIndex": ["validateTabIndex"],
|
|
14316
14731
|
"_touched": ["validateTouched"],
|
|
14317
14732
|
"_value": ["validateValue"]
|
|
14318
14733
|
}; }
|
|
14319
14734
|
static get style() { return {
|
|
14320
|
-
default:
|
|
14735
|
+
default: KolSingleSelectDefaultStyle0
|
|
14321
14736
|
}; }
|
|
14322
14737
|
static get cmpMeta() { return {
|
|
14323
14738
|
"$flags$": 41,
|
|
14324
|
-
"$tagName$": "kol-select",
|
|
14739
|
+
"$tagName$": "kol-single-select",
|
|
14325
14740
|
"$members$": {
|
|
14326
14741
|
"_accessKey": [1, "_access-key"],
|
|
14742
|
+
"_placeholder": [1],
|
|
14327
14743
|
"_alert": [1540],
|
|
14328
14744
|
"_disabled": [4],
|
|
14329
|
-
"_error": [1],
|
|
14330
14745
|
"_hideError": [1540, "_hide-error"],
|
|
14331
14746
|
"_hideLabel": [4, "_hide-label"],
|
|
14332
14747
|
"_hint": [1],
|
|
@@ -14334,23 +14749,24 @@ class KolSelect {
|
|
|
14334
14749
|
"_id": [1],
|
|
14335
14750
|
"_label": [1],
|
|
14336
14751
|
"_msg": [16],
|
|
14337
|
-
"_multiple": [4],
|
|
14338
14752
|
"_name": [1],
|
|
14339
14753
|
"_on": [16],
|
|
14340
14754
|
"_options": [1],
|
|
14341
14755
|
"_required": [4],
|
|
14342
|
-
"_rows": [2],
|
|
14343
14756
|
"_syncValueBySelector": [1, "_sync-value-by-selector"],
|
|
14344
14757
|
"_tabIndex": [2, "_tab-index"],
|
|
14345
14758
|
"_tooltipAlign": [1, "_tooltip-align"],
|
|
14346
14759
|
"_touched": [1540],
|
|
14347
14760
|
"_value": [1025],
|
|
14761
|
+
"_isOpen": [32],
|
|
14762
|
+
"_filteredOptions": [32],
|
|
14763
|
+
"_inputValue": [32],
|
|
14764
|
+
"blockSuggestionMouseOver": [32],
|
|
14348
14765
|
"state": [32],
|
|
14349
14766
|
"getValue": [64],
|
|
14350
|
-
"focus": [64],
|
|
14351
14767
|
"kolFocus": [64]
|
|
14352
14768
|
},
|
|
14353
|
-
"$listeners$":
|
|
14769
|
+
"$listeners$": [[8, "focusout", "handleFocusOut"], [8, "blur", "handleWindowBlur"], [0, "keydown", "handleKeyDown"], [1, "mousemove", "handleMouseEvent"]],
|
|
14354
14770
|
"$lazyBundleId$": "-",
|
|
14355
14771
|
"$attrsToReflect$": [["_alert", "_alert"], ["_hideError", "_hide-error"], ["_touched", "_touched"]]
|
|
14356
14772
|
}; }
|
|
@@ -14370,7 +14786,7 @@ class KolSkipNav {
|
|
|
14370
14786
|
};
|
|
14371
14787
|
}
|
|
14372
14788
|
render() {
|
|
14373
|
-
return (hAsync(Host, { key: '
|
|
14789
|
+
return (hAsync(Host, { key: '4e6cc58e69b97bfdafd1f342755908836984e6c0', class: "kol-skip-nav" }, hAsync("nav", { key: '436a02841a32b66e829b2f80021a0530cd404f68', "aria-label": this.state._label }, hAsync("ul", { key: 'f3475e1b8c53cb26b3cd00b21c1ce5eac570bc61' }, this.state._links.map((link, index) => {
|
|
14374
14790
|
return (hAsync("li", { key: index }, hAsync(KolLinkWcTag, Object.assign({}, link))));
|
|
14375
14791
|
})))));
|
|
14376
14792
|
}
|
|
@@ -22758,10 +23174,10 @@ class KolSpanWc {
|
|
|
22758
23174
|
render() {
|
|
22759
23175
|
var _a, _b, _c, _d, _e;
|
|
22760
23176
|
const hideExpertSlot = !showExpertSlot(this.state._label);
|
|
22761
|
-
return (hAsync(Host, { key: '
|
|
23177
|
+
return (hAsync(Host, { key: '0a15150866920a51833e591397e7ff1624c89fc7', class: {
|
|
22762
23178
|
'kol-span-wc': true,
|
|
22763
23179
|
'hide-label': !!this.state._hideLabel,
|
|
22764
|
-
} }, this.state._icons.top && (hAsync(KolIconTag, { key: '
|
|
23180
|
+
} }, this.state._icons.top && (hAsync(KolIconTag, { key: 'a13817ec7df7d39bbe765123bd36bbb1f58aa237', class: "icon top", style: this.state._icons.top.style, _label: (_a = this.state._icons.top.label) !== null && _a !== void 0 ? _a : '', _icons: this.state._icons.top.icon })), hAsync("span", { key: '6f86eba44456d1ab64d17a679c5c6e124dc1e66c' }, this.state._icons.left && (hAsync(KolIconTag, { key: 'd08648696cbde3838c671d1166bd216faf4a5bd4', class: "icon left", style: this.state._icons.left.style, _label: (_b = this.state._icons.left.label) !== null && _b !== void 0 ? _b : '', _icons: this.state._icons.left.icon })), !this.state._hideLabel && hideExpertSlot ? (this.state._allowMarkdown && typeof this.state._label === 'string' && this.state._label.length > 0 ? (hAsync("span", { class: "span-label md", innerHTML: md(this.state._label) })) : (hAsync("span", { class: "span-label" }, this.state._accessKey && this.state._label.length ? (hAsync(InternalUnderlinedAccessKey, { label: this.state._label, accessKey: this.state._accessKey })) : (((_c = this.state._label) !== null && _c !== void 0 ? _c : ''))))) : (''), hAsync("span", { key: 'f39592d70030926a72ab412e4c57cee3e3ff61ce', "aria-hidden": hideExpertSlot ? 'true' : undefined, class: "span-label", hidden: hideExpertSlot }, hAsync("slot", { key: 'c5db531a6ffa0c7f57b2b519a639243b18e80f21', name: "expert" })), this.state._accessKey && (hAsync("span", { key: '2c95c5bef57088bf228232a3ee4b1c8ecaa733e0', class: "access-key-hint", "aria-hidden": "true" }, this.state._accessKey)), this.state._icons.right && (hAsync(KolIconTag, { key: 'e308c7c357ce1877d0ab1d41fca33ba829c21b81', class: "icon right", style: this.state._icons.right.style, _label: (_d = this.state._icons.right.label) !== null && _d !== void 0 ? _d : '', _icons: this.state._icons.right.icon }))), this.state._icons.bottom && (hAsync(KolIconTag, { key: 'c2712ceb758105651d8164daf8cd558b29c2e2ab', class: "icon bottom", style: this.state._icons.bottom.style, _label: (_e = this.state._icons.bottom.label) !== null && _e !== void 0 ? _e : '', _icons: this.state._icons.bottom.icon }))));
|
|
22765
23181
|
}
|
|
22766
23182
|
validateAccessKey(value) {
|
|
22767
23183
|
validateAccessKey(this, value);
|
|
@@ -22815,7 +23231,7 @@ class KolSpanWc {
|
|
|
22815
23231
|
}; }
|
|
22816
23232
|
}
|
|
22817
23233
|
|
|
22818
|
-
const defaultStyleCss$a = "@layer kol-global {\n .sc-kol-spin-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-spin-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-spin-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .spin.cycle {\n width: calc(48rem / var(--kolibri-root-font-size, 16));\n height: calc(48rem / var(--kolibri-root-font-size, 16));\n }\n .spin.cycle > .loader {\n display: block;\n width: 100%;\n height: 100%;\n border-radius: 50%;\n position: relative;\n animation: 2s linear infinite rotate;\n }\n .spin.cycle > .loader::before {\n content: \"\";\n box-sizing: border-box;\n position: absolute;\n inset: 0px;\n border-radius: 50%;\n border: 5px solid #333;\n animation: 3s linear infinite prixClipFix;\n }\n @keyframes rotate {\n 100% {\n transform: rotate(360deg);\n }\n }\n @keyframes prixClipFix {\n 0% {\n border-color: #fff;\n clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);\n }\n 25% {\n border-color: #666;\n clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);\n }\n 50% {\n border-color: #
|
|
23234
|
+
const defaultStyleCss$a = "@layer kol-global {\n .sc-kol-spin-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-spin-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-spin-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .spin.cycle {\n width: calc(48rem / var(--kolibri-root-font-size, 16));\n height: calc(48rem / var(--kolibri-root-font-size, 16));\n }\n .spin.cycle > .loader {\n display: block;\n width: 100%;\n height: 100%;\n border-radius: 50%;\n position: relative;\n animation: 2s linear infinite rotate;\n }\n .spin.cycle > .loader::before {\n content: \"\";\n box-sizing: border-box;\n position: absolute;\n inset: 0px;\n border-radius: 50%;\n border: 5px solid #333;\n animation: 3s linear infinite prixClipFix;\n }\n @keyframes rotate {\n 100% {\n transform: rotate(360deg);\n }\n }\n @keyframes prixClipFix {\n 0% {\n border-color: #fff;\n clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);\n }\n 25% {\n border-color: #666;\n clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);\n }\n 50% {\n border-color: #000;\n clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%);\n }\n 75% {\n border-color: #000;\n clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%);\n }\n 100% {\n border-color: #000;\n clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);\n }\n }\n \n @media (prefers-reduced-motion) {\n .spin.cycle > .loader {\n animation-duration: 4s;\n }\n .spin.cycle > .loader::before {\n animation-duration: 6s;\n }\n }\n}\n@layer kol-component {\n .spin.dot {\n height: calc(16rem / var(--kolibri-root-font-size, 16));\n width: calc(48rem / var(--kolibri-root-font-size, 16));\n }\n .spin.dot > span {\n animation-timing-function: cubic-bezier(0, 1, 1, 0);\n border-radius: 50%;\n border: calc(0.16rem / var(--kolibri-root-font-size, 16)) solid #fff;\n height: calc(12.8rem / var(--kolibri-root-font-size, 16));\n position: absolute;\n top: calc(0.16rem / var(--kolibri-root-font-size, 16));\n width: calc(12.8rem / var(--kolibri-root-font-size, 16));\n }\n .spin.dot > span:first-child {\n background-color: #000;\n z-index: 0;\n animation: 1s infinite spin1;\n left: calc(0.16rem / var(--kolibri-root-font-size, 16));\n }\n .spin.dot > span:nth-child(2) {\n background-color: #000;\n z-index: 1;\n animation: 1s infinite spin2;\n left: calc(0.16rem / var(--kolibri-root-font-size, 16));\n }\n .spin.dot > span:nth-child(3) {\n background-color: #000;\n z-index: 1;\n animation: 1s infinite spin2;\n left: calc(17.6rem / var(--kolibri-root-font-size, 16));\n }\n .spin.dot > span:nth-child(4) {\n background-color: #666;\n z-index: 0;\n animation: 1s infinite spin3;\n left: calc(33.6rem / var(--kolibri-root-font-size, 16));\n }\n @keyframes spin1 {\n 0% {\n transform: scale(0);\n }\n 100% {\n transform: scale(1);\n }\n }\n @keyframes spin2 {\n 0% {\n transform: translate(0, 0);\n }\n 100% {\n transform: translate(calc(16rem / var(--kolibri-root-font-size, 16)), 0);\n }\n }\n @keyframes spin3 {\n 0% {\n transform: scale(1);\n }\n 100% {\n transform: scale(0);\n }\n }\n \n @media (prefers-reduced-motion) {\n .spin.dot > span:first-child,\n .spin.dot > span:nth-child(2),\n .spin.dot > span:nth-child(3),\n .spin.dot > span:nth-child(4) {\n animation-duration: 2s;\n }\n }\n}\n@layer kol-component {\n .sc-kol-spin-default-h {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .spin {\n display: block;\n padding: calc(2rem / var(--kolibri-root-font-size, 16));\n position: relative;\n }\n}";
|
|
22819
23235
|
var KolSpinDefaultStyle0 = defaultStyleCss$a;
|
|
22820
23236
|
|
|
22821
23237
|
function renderSpin(variant) {
|
|
@@ -22839,7 +23255,7 @@ class KolSpin {
|
|
|
22839
23255
|
};
|
|
22840
23256
|
}
|
|
22841
23257
|
render() {
|
|
22842
|
-
return (hAsync(Host, { key: '
|
|
23258
|
+
return (hAsync(Host, { key: '1341f6f7b72ff1c95f3a73f163364342172d5cad', class: "kol-spin" }, this.state._show ? (hAsync("span", { "aria-busy": "true", "aria-label": translate('kol-action-running'), "aria-live": "polite", class: {
|
|
22843
23259
|
spin: true,
|
|
22844
23260
|
[this.state._variant]: true,
|
|
22845
23261
|
}, role: "alert" }, renderSpin(this.state._variant))) : (this.showToggled && hAsync("span", { "aria-label": translate('kol-action-done'), "aria-busy": "false", "aria-live": "polite", role: "alert" }))));
|
|
@@ -22876,7 +23292,7 @@ class KolSpin {
|
|
|
22876
23292
|
}; }
|
|
22877
23293
|
}
|
|
22878
23294
|
|
|
22879
|
-
const defaultStyleCss$9 = "@layer kol-global {\n .sc-kol-split-button-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-split-button-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-split-button-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-split-button-default-h {\n display: flex;\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n position: relative;\n }\n .
|
|
23295
|
+
const defaultStyleCss$9 = "@layer kol-global {\n .sc-kol-split-button-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-split-button-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-split-button-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-split-button-default-h {\n display: flex;\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n position: relative;\n }\n .split-button-root {\n display: flex;\n position: relative;\n }\n .main-button {\n flex-grow: 1;\n text-align: left;\n }\n .kol-popover .popover {\n margin-top: calc(2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-popover .arrow {\n display: none;\n }\n}";
|
|
22880
23296
|
var KolSplitButtonDefaultStyle0 = defaultStyleCss$9;
|
|
22881
23297
|
|
|
22882
23298
|
class KolSplitButton {
|
|
@@ -22894,32 +23310,11 @@ class KolSplitButton {
|
|
|
22894
23310
|
},
|
|
22895
23311
|
};
|
|
22896
23312
|
this.clickToggleHandler = { onClick: () => this.toggleDropdown() };
|
|
22897
|
-
this.
|
|
22898
|
-
|
|
22899
|
-
this.dropdown.style.height = `${this.dropdownContent.clientHeight}px`;
|
|
22900
|
-
this.state = Object.assign(Object.assign({}, this.state), { _show: true });
|
|
22901
|
-
}
|
|
22902
|
-
};
|
|
22903
|
-
this.closeDropdown = () => {
|
|
22904
|
-
if (this.dropdown && this.dropdownContent) {
|
|
22905
|
-
this.dropdown.style.height = ``;
|
|
22906
|
-
this.state = Object.assign(Object.assign({}, this.state), { _show: false });
|
|
22907
|
-
}
|
|
22908
|
-
};
|
|
22909
|
-
this.toggleDropdown = (value) => {
|
|
22910
|
-
const openIt = typeof value === 'boolean' ? value : !this.state._show;
|
|
22911
|
-
if (openIt)
|
|
22912
|
-
this.openDropdown();
|
|
22913
|
-
else
|
|
22914
|
-
this.closeDropdown();
|
|
23313
|
+
this.toggleDropdown = () => {
|
|
23314
|
+
this.state = Object.assign(Object.assign({}, this.state), { _show: !this.state._show });
|
|
22915
23315
|
};
|
|
22916
|
-
this.
|
|
22917
|
-
|
|
22918
|
-
this.dropdown = e;
|
|
22919
|
-
setTimeout(() => {
|
|
22920
|
-
this.dropdownContent = e.firstChild;
|
|
22921
|
-
});
|
|
22922
|
-
}
|
|
23316
|
+
this.handleOnClose = () => {
|
|
23317
|
+
this.state = Object.assign(Object.assign({}, this.state), { _show: false });
|
|
22923
23318
|
};
|
|
22924
23319
|
this._ariaControls = undefined;
|
|
22925
23320
|
this._ariaExpanded = undefined;
|
|
@@ -22945,12 +23340,15 @@ class KolSplitButton {
|
|
|
22945
23340
|
}
|
|
22946
23341
|
render() {
|
|
22947
23342
|
const i18nDropdownLabel = 'kol-split-button-dropdown-label';
|
|
22948
|
-
return (hAsync(Host, { key: '
|
|
23343
|
+
return (hAsync(Host, { key: '37ae6c094c635a1bc78d02370e730ccf1ec2cdc0', class: "kol-split-button" }, hAsync("div", { key: 'ed9ac9cc52557bc2387384da318969459239cb78', class: "split-button-root" }, hAsync(KolButtonWcTag, { key: 'a84ee1b2813033b3efbe3de9efff5580ecea9a10', class: {
|
|
22949
23344
|
'main-button': true,
|
|
22950
23345
|
button: true,
|
|
22951
23346
|
[this._variant]: this._variant !== 'custom',
|
|
22952
23347
|
[this._customClass]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,
|
|
22953
|
-
}, _ariaControls: this._ariaControls, _ariaExpanded: this._ariaExpanded, _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _icons: this._icons, _hideLabel: this._hideLabel, _label: this._label, _name: this._name, _on: this.clickButtonHandler, _role: this._role, _syncValueBySelector: this._syncValueBySelector, _tabIndex: this._tabIndex, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _variant: this._variant }), hAsync("div", { key: '
|
|
23348
|
+
}, _ariaControls: this._ariaControls, _ariaExpanded: this._ariaExpanded, _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _icons: this._icons, _hideLabel: this._hideLabel, _label: this._label, _name: this._name, _on: this.clickButtonHandler, _role: this._role, _syncValueBySelector: this._syncValueBySelector, _tabIndex: this._tabIndex, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _variant: this._variant }), hAsync("div", { key: 'f9339fd48f7356ae13778c0106b5a5df9eacbaaa', class: "horizontal-line" }), hAsync(KolButtonWcTag, { key: '7094c820ed1d5310d7c64c3c1fbe31b8be9c56d6', class: "secondary-button", _disabled: this._disabled, _hideLabel: true, _icons: "codicon codicon-triangle-down", _label: this.state._show ? translate(`${i18nDropdownLabel}-close`) : translate(`${i18nDropdownLabel}-open`), _on: this.clickToggleHandler })), hAsync(KolPopoverWcTag, { key: '826390e11aea4835fe3b1e44902901b915d740d6', _show: this.state._show, _on: { onClose: this.handleOnClose }, _align: "bottom" }, hAsync("slot", { key: '8156ebb3e9cc9b7171e566b15511114348e38ebb' }))));
|
|
23349
|
+
}
|
|
23350
|
+
closePopup() {
|
|
23351
|
+
this.handleOnClose();
|
|
22954
23352
|
}
|
|
22955
23353
|
static get style() { return {
|
|
22956
23354
|
default: KolSplitButtonDefaultStyle0
|
|
@@ -22977,7 +23375,8 @@ class KolSplitButton {
|
|
|
22977
23375
|
"_type": [1],
|
|
22978
23376
|
"_value": [8],
|
|
22979
23377
|
"_variant": [1],
|
|
22980
|
-
"state": [32]
|
|
23378
|
+
"state": [32],
|
|
23379
|
+
"closePopup": [64]
|
|
22981
23380
|
},
|
|
22982
23381
|
"$listeners$": undefined,
|
|
22983
23382
|
"$lazyBundleId$": "-",
|
|
@@ -22996,7 +23395,7 @@ class KolSymbol {
|
|
|
22996
23395
|
};
|
|
22997
23396
|
}
|
|
22998
23397
|
render() {
|
|
22999
|
-
return (hAsync(Host, { key: '
|
|
23398
|
+
return (hAsync(Host, { key: '0cf724ad64920f8a2a9818302ad4ec9d428c52b2', class: "kol-symbol" }, hAsync("span", { key: '46cacaa73fc9b86e9f008d69216dd4b14ca58210', "aria-label": this.state._label, role: "term" }, this.state._symbol)));
|
|
23000
23399
|
}
|
|
23001
23400
|
validateLabel(value) {
|
|
23002
23401
|
validateLabel(this, value, {
|
|
@@ -23045,7 +23444,7 @@ class KolTable {
|
|
|
23045
23444
|
this._on = undefined;
|
|
23046
23445
|
}
|
|
23047
23446
|
render() {
|
|
23048
|
-
return (hAsync(KolTableStatefulTag, { key: '
|
|
23447
|
+
return (hAsync(KolTableStatefulTag, { key: '6c05308ac2b733a308a73068d193f1cec829406a', _allowMultiSort: this._allowMultiSort, _data: this._data, _dataFoot: this._dataFoot, _headers: this._headers, _label: this._label, _minWidth: this._minWidth, _pagination: this._pagination, _paginationPosition: this._paginationPosition, _selection: this._selection, _on: this._on }));
|
|
23049
23448
|
}
|
|
23050
23449
|
static get cmpMeta() { return {
|
|
23051
23450
|
"$flags$": 9,
|
|
@@ -23089,9 +23488,10 @@ var Events;
|
|
|
23089
23488
|
Events["onSort"] = "onSort";
|
|
23090
23489
|
Events["onSelectionChange"] = "onSelectionChange";
|
|
23091
23490
|
Events["onSubmit"] = "onSubmit";
|
|
23491
|
+
Events["onClose"] = "onClose";
|
|
23092
23492
|
})(Events || (Events = {}));
|
|
23093
23493
|
|
|
23094
|
-
const defaultStyleCss$8 = "@layer kol-global {\n .sc-kol-table-stateful-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-table-stateful-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-table-stateful-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-table-stateful-default-h {\n display: block;\n }\n}\n@layer kol-component {\n :root {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n div.pagination .kol-pagination {\n display: flex;\n flex-wrap: wrap;\n }\n div.pagination,\n div.pagination > div:last-child {\n display: grid;\n place-items: center;\n }\n @media (max-width: 1024px) {\n div.pagination .kol-pagination {\n flex-direction: column;\n }\n }\n @media (min-width: 1024px) {\n div.pagination,\n div.pagination > div:last-child {\n grid-auto-flow: column;\n }\n div.pagination .kol-pagination {\n display: flex;\n }\n }\n}\n@layer kol-component {\n .sc-kol-table-stateful-default-h,\n .kol-table-stateless-wc {\n display: block;\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .table {\n max-width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n }\n table {\n width: 100%;\n }\n caption {\n text-align: start;\n }\n .focus-element {\n font-size: 0;\n }\n .focus-element:focus {\n outline: 0 !important;\n }\n .table:has(.focus-element:focus) {\n \n outline: 5px auto Highlight;\n outline: 5px auto -webkit-focus-ring-color;\n outline-offset: 2px;\n }\n .table-sort-button .button {\n color: inherit;\n }\n tbody th,\n th.align-left {\n text-align: left;\n }\n tbody th .table-sort-button .button-inner,\n th.align-left .table-sort-button .button-inner {\n justify-items: start;\n }\n th.align-center {\n text-align: center;\n }\n th.align-center .table-sort-button .button-inner {\n justify-items: center;\n }\n th.align-right {\n text-align: right;\n }\n th.align-right .table-sort-button .button-inner {\n justify-items: end;\n }\n .selection-header-cell {\n width: 0;\n }\n .selection-cell {\n white-space: nowrap;\n }\n}";
|
|
23494
|
+
const defaultStyleCss$8 = "@layer kol-global {\n .sc-kol-table-stateful-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-table-stateful-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-table-stateful-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-table-stateful-default-h {\n display: block;\n }\n}\n@layer kol-component {\n :root {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n div.pagination .kol-pagination {\n display: flex;\n flex-wrap: wrap;\n }\n div.pagination,\n div.pagination > div:last-child {\n display: grid;\n place-items: center;\n }\n @media (max-width: 1024px) {\n div.pagination .kol-pagination {\n flex-direction: column;\n }\n }\n @media (min-width: 1024px) {\n div.pagination,\n div.pagination > div:last-child {\n grid-auto-flow: column;\n }\n div.pagination .kol-pagination {\n display: flex;\n }\n }\n}\n@layer kol-component {\n .sc-kol-table-stateful-default-h,\n .kol-table-stateless-wc {\n display: block;\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .table {\n max-width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n }\n table {\n width: 100%;\n }\n caption {\n text-align: start;\n }\n .focus-element {\n font-size: 0;\n }\n .focus-element:focus {\n outline: 0 !important;\n }\n .table:has(.focus-element:focus) {\n \n outline: 5px auto Highlight;\n outline: 5px auto -webkit-focus-ring-color;\n outline-offset: 2px;\n }\n .table-sort-button .button {\n color: inherit;\n }\n tbody th,\n th.align-left {\n text-align: left;\n }\n tbody th .table-sort-button .button-inner,\n th.align-left .table-sort-button .button-inner {\n justify-items: start;\n }\n th.align-center {\n text-align: center;\n }\n th.align-center .table-sort-button .button-inner {\n justify-items: center;\n }\n th.align-right {\n text-align: right;\n }\n th.align-right .table-sort-button .button-inner {\n justify-items: end;\n }\n .selection-header-cell {\n width: 0;\n }\n .selection-cell {\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n white-space: nowrap;\n }\n .input label {\n align-items: center;\n cursor: pointer;\n display: flex;\n height: var(--a11y-min-size);\n justify-content: center;\n position: relative;\n width: var(--a11y-min-size);\n }\n .input .icon {\n display: block;\n inset: auto;\n position: absolute;\n z-index: 1;\n }\n .input input {\n appearance: none;\n border-style: solid;\n cursor: pointer;\n margin: 0;\n }\n .input input:before {\n content: \"\";\n }\n .input input[type=checkbox] {\n position: relative;\n display: flex;\n height: calc(var(--a11y-min-size) / 2);\n width: calc(var(--a11y-min-size) / 2);\n align-items: center;\n justify-content: center;\n background-color: rgb(255, 255, 255);\n border-width: 2px;\n line-height: 24px;\n transition: all 0.5s ease 0s;\n }\n .input input[type=radio] {\n display: flex;\n border-width: 2px;\n border-radius: 100%;\n height: 1.5em;\n min-height: 1.5em;\n min-width: 1.5em;\n padding: 0;\n width: 1.5em;\n }\n .input input[type=radio]:before {\n border-radius: 100%;\n margin: auto;\n height: 0.75em;\n width: 0.75em;\n }\n .input input[type=radio]:checked:before {\n background-color: #000;\n }\n @media (forced-colors: active) {\n .input input[type=radio]:checked:before {\n \n background: selectedItem !important;\n }\n }\n}";
|
|
23095
23495
|
var KolTableStatefulDefaultStyle0 = defaultStyleCss$8;
|
|
23096
23496
|
|
|
23097
23497
|
const PAGINATION_OPTIONS = [10, 20, 50, 100];
|
|
@@ -23099,6 +23499,9 @@ const paginationValidator = (value) => value === true || value === '' || (typeof
|
|
|
23099
23499
|
class KolTableStateful {
|
|
23100
23500
|
constructor(hostRef) {
|
|
23101
23501
|
registerInstance(this, hostRef);
|
|
23502
|
+
this.catchRef = (ref) => {
|
|
23503
|
+
this.tableWcRef = ref;
|
|
23504
|
+
};
|
|
23102
23505
|
this.sortDirections = new Map();
|
|
23103
23506
|
this.sortData = [];
|
|
23104
23507
|
this.showPagination = false;
|
|
@@ -23135,6 +23538,9 @@ class KolTableStateful {
|
|
|
23135
23538
|
setState(this, '_pageSize', pageSize);
|
|
23136
23539
|
},
|
|
23137
23540
|
};
|
|
23541
|
+
this.onSelectionChange = (event) => {
|
|
23542
|
+
event.stopPropagation();
|
|
23543
|
+
};
|
|
23138
23544
|
this.updateSortedData = (cell = this.sortedColumnHead) => {
|
|
23139
23545
|
if (this.disableSort) {
|
|
23140
23546
|
setState(this, '_sortedData', this.state._data);
|
|
@@ -23348,6 +23754,14 @@ class KolTableStateful {
|
|
|
23348
23754
|
},
|
|
23349
23755
|
});
|
|
23350
23756
|
}
|
|
23757
|
+
componentDidLoad() {
|
|
23758
|
+
var _a;
|
|
23759
|
+
(_a = this.tableWcRef) === null || _a === void 0 ? void 0 : _a.addEventListener('kol-selection-change', this.onSelectionChange);
|
|
23760
|
+
}
|
|
23761
|
+
disconnectedCallback() {
|
|
23762
|
+
var _a;
|
|
23763
|
+
(_a = this.tableWcRef) === null || _a === void 0 ? void 0 : _a.removeEventListener('kol-selection-change', this.onSelectionChange);
|
|
23764
|
+
}
|
|
23351
23765
|
componentWillLoad() {
|
|
23352
23766
|
this.validateAllowMultiSort(this._allowMultiSort);
|
|
23353
23767
|
this.validateData(this._data);
|
|
@@ -23358,6 +23772,7 @@ class KolTableStateful {
|
|
|
23358
23772
|
this.validatePagination(this._pagination);
|
|
23359
23773
|
this.validatePaginationPosition(this._paginationPosition);
|
|
23360
23774
|
this.validateSelection(this._selection);
|
|
23775
|
+
this.validateOn(this._on);
|
|
23361
23776
|
}
|
|
23362
23777
|
selectDisplayedData(data, pageSize, page) {
|
|
23363
23778
|
if (typeof pageSize === 'number' && pageSize > 0 && typeof page === 'number' && page > 0) {
|
|
@@ -23406,17 +23821,23 @@ class KolTableStateful {
|
|
|
23406
23821
|
}
|
|
23407
23822
|
getSelectedData(selectedKeys) {
|
|
23408
23823
|
var _a;
|
|
23409
|
-
|
|
23410
|
-
|
|
23824
|
+
const selection = this.state._selection;
|
|
23825
|
+
if (selection) {
|
|
23826
|
+
const keyPropertyName = (_a = selection.keyPropertyName) !== null && _a !== void 0 ? _a : 'id';
|
|
23827
|
+
const data = this.state._sortedData.filter((item) => selectedKeys.includes(item[keyPropertyName]));
|
|
23828
|
+
if ((selection === null || selection === void 0 ? void 0 : selection.multiple) === false) {
|
|
23829
|
+
return data[0];
|
|
23830
|
+
}
|
|
23411
23831
|
if (keyPropertyName)
|
|
23412
|
-
return
|
|
23832
|
+
return data;
|
|
23413
23833
|
}
|
|
23414
|
-
return
|
|
23834
|
+
return null;
|
|
23415
23835
|
}
|
|
23416
23836
|
handleSelectionChange(event, value) {
|
|
23417
23837
|
var _a;
|
|
23418
|
-
|
|
23419
|
-
|
|
23838
|
+
const selection = this.state._selection;
|
|
23839
|
+
if (selection)
|
|
23840
|
+
this.state = Object.assign(Object.assign({}, this.state), { _selection: Object.assign(Object.assign({}, selection), { selectedKeys: typeof value === 'object' ? value : [value] }) });
|
|
23420
23841
|
const selectedData = this.getSelectedData(value);
|
|
23421
23842
|
tryToDispatchKoliBriEvent('selection-change', this.host, selectedData);
|
|
23422
23843
|
if (typeof ((_a = this.state._on) === null || _a === void 0 ? void 0 : _a[Events.onSelectionChange]) === 'function') {
|
|
@@ -23426,8 +23847,7 @@ class KolTableStateful {
|
|
|
23426
23847
|
async getSelection() {
|
|
23427
23848
|
var _a;
|
|
23428
23849
|
const selectedKeys = ((_a = this.state._selection) === null || _a === void 0 ? void 0 : _a.selectedKeys) || [];
|
|
23429
|
-
|
|
23430
|
-
return selectedData;
|
|
23850
|
+
return this.getSelectedData(selectedKeys);
|
|
23431
23851
|
}
|
|
23432
23852
|
render() {
|
|
23433
23853
|
var _a, _b, _c, _d;
|
|
@@ -23438,7 +23858,7 @@ class KolTableStateful {
|
|
|
23438
23858
|
horizontal: (_c = this.state._headers.horizontal) === null || _c === void 0 ? void 0 : _c.map((row) => row.map((cell) => (Object.assign(Object.assign({}, cell), { sortDirection: this.getHeaderCellSortState(cell) })))),
|
|
23439
23859
|
vertical: (_d = this.state._headers.vertical) === null || _d === void 0 ? void 0 : _d.map((column) => column.map((cell) => (Object.assign(Object.assign({}, cell), { sortDirection: this.getHeaderCellSortState(cell) })))),
|
|
23440
23860
|
};
|
|
23441
|
-
return (hAsync(Host, { key: '
|
|
23861
|
+
return (hAsync(Host, { key: '06dd5f12e9182fe2db630dcdd0f2645d4867b8e5', class: "kol-table-stateful" }, this.pageEndSlice > 0 && this.showPagination && paginationTop, hAsync(KolTableStatelessWcTag, { key: '565eef88ba587eb4aa76b629c01c1d9e1ccf5d98', ref: this.catchRef, _data: displayedData, _headerCells: headerCells, _label: this.state._label, _dataFoot: this.state._dataFoot, _minWidth: this.state._minWidth, _on: {
|
|
23442
23862
|
onSort: (_, payload) => {
|
|
23443
23863
|
this.handleSort(payload);
|
|
23444
23864
|
},
|
|
@@ -23486,7 +23906,7 @@ class KolTableStateful {
|
|
|
23486
23906
|
}; }
|
|
23487
23907
|
}
|
|
23488
23908
|
|
|
23489
|
-
const defaultStyleCss$7 = "@layer kol-global {\n .sc-kol-table-stateless-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-table-stateless-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-table-stateless-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-table-stateless-default-h {\n display: block;\n }\n}\n\n@layer kol-global {\n .sc-kol-table-stateless-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-table-stateless-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-table-stateless-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-table-stateless-default-h {\n display: block;\n }\n}\n@layer kol-component {\n .sc-kol-table-stateless-default-h,\n .kol-table-stateless-wc {\n display: block;\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .table {\n max-width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n }\n table {\n width: 100%;\n }\n caption {\n text-align: start;\n }\n .focus-element {\n font-size: 0;\n }\n .focus-element:focus {\n outline: 0 !important;\n }\n .table:has(.focus-element:focus) {\n \n outline: 5px auto Highlight;\n outline: 5px auto -webkit-focus-ring-color;\n outline-offset: 2px;\n }\n .table-sort-button .button {\n color: inherit;\n }\n tbody th,\n th.align-left {\n text-align: left;\n }\n tbody th .table-sort-button .button-inner,\n th.align-left .table-sort-button .button-inner {\n justify-items: start;\n }\n th.align-center {\n text-align: center;\n }\n th.align-center .table-sort-button .button-inner {\n justify-items: center;\n }\n th.align-right {\n text-align: right;\n }\n th.align-right .table-sort-button .button-inner {\n justify-items: end;\n }\n .selection-header-cell {\n width: 0;\n }\n .selection-cell {\n white-space: nowrap;\n }\n}";
|
|
23909
|
+
const defaultStyleCss$7 = "@layer kol-global {\n .sc-kol-table-stateless-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-table-stateless-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-table-stateless-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-table-stateless-default-h {\n display: block;\n }\n}\n\n@layer kol-global {\n .sc-kol-table-stateless-default-h {\n \n --a11y-min-size: 44px;\n \n background-color: white;\n color: black;\n \n font-family: Verdana;\n }\n * {\n \n hyphens: auto;\n \n letter-spacing: inherit;\n \n word-break: break-word;\n \n word-spacing: inherit;\n }\n \n \n \n \n \n [role=button],\n button:not([role=link]),\n .kol-input .input {\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n \n a,\n button,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n input,\n option,\n select,\n textarea {\n \n font-family: inherit;\n \n font-size: inherit;\n }\n}\n\n/*!@.visually-hidden*/.visually-hidden.sc-kol-table-stateless-default {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n@layer kol-global {\n \n :is(a, button) {\n background-color: transparent;\n border: none;\n margin: 0;\n padding: 0;\n width: 100%; \n }\n \n [hidden] {\n display: none !important;\n }\n}\n@layer kol-global {\n .sc-kol-table-stateless-default-h {\n \n max-width: 100%;\n }\n * {\n \n box-sizing: border-box;\n }\n \n .kol-span-wc {\n display: grid;\n place-items: center;\n }\n \n .kol-span-wc > span {\n display: flex;\n place-items: center;\n }\n a,\n button {\n cursor: pointer;\n }\n \n .hide-label > .kol-span-wc > span > span {\n display: none;\n }\n \n button:disabled {\n color: unset;\n }\n .disabled label,\n .disabled:focus-within label,\n [aria-disabled=true],\n [aria-disabled=true]:focus,\n [disabled],\n [disabled]:focus {\n cursor: not-allowed;\n opacity: 0.5;\n outline: none;\n }\n [aria-disabled=true]:focus .kol-span-wc,\n [disabled]:focus .kol-span-wc {\n outline: none !important;\n }\n}\n@layer kol-component {\n .sc-kol-table-stateless-default-h {\n display: block;\n }\n}\n@layer kol-component {\n .sc-kol-table-stateless-default-h,\n .kol-table-stateless-wc {\n display: block;\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .table {\n max-width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n }\n table {\n width: 100%;\n }\n caption {\n text-align: start;\n }\n .focus-element {\n font-size: 0;\n }\n .focus-element:focus {\n outline: 0 !important;\n }\n .table:has(.focus-element:focus) {\n \n outline: 5px auto Highlight;\n outline: 5px auto -webkit-focus-ring-color;\n outline-offset: 2px;\n }\n .table-sort-button .button {\n color: inherit;\n }\n tbody th,\n th.align-left {\n text-align: left;\n }\n tbody th .table-sort-button .button-inner,\n th.align-left .table-sort-button .button-inner {\n justify-items: start;\n }\n th.align-center {\n text-align: center;\n }\n th.align-center .table-sort-button .button-inner {\n justify-items: center;\n }\n th.align-right {\n text-align: right;\n }\n th.align-right .table-sort-button .button-inner {\n justify-items: end;\n }\n .selection-header-cell {\n width: 0;\n }\n .selection-cell {\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n white-space: nowrap;\n }\n .input label {\n align-items: center;\n cursor: pointer;\n display: flex;\n height: var(--a11y-min-size);\n justify-content: center;\n position: relative;\n width: var(--a11y-min-size);\n }\n .input .icon {\n display: block;\n inset: auto;\n position: absolute;\n z-index: 1;\n }\n .input input {\n appearance: none;\n border-style: solid;\n cursor: pointer;\n margin: 0;\n }\n .input input:before {\n content: \"\";\n }\n .input input[type=checkbox] {\n position: relative;\n display: flex;\n height: calc(var(--a11y-min-size) / 2);\n width: calc(var(--a11y-min-size) / 2);\n align-items: center;\n justify-content: center;\n background-color: rgb(255, 255, 255);\n border-width: 2px;\n line-height: 24px;\n transition: all 0.5s ease 0s;\n }\n .input input[type=radio] {\n display: flex;\n border-width: 2px;\n border-radius: 100%;\n height: 1.5em;\n min-height: 1.5em;\n min-width: 1.5em;\n padding: 0;\n width: 1.5em;\n }\n .input input[type=radio]:before {\n border-radius: 100%;\n margin: auto;\n height: 0.75em;\n width: 0.75em;\n }\n .input input[type=radio]:checked:before {\n background-color: #000;\n }\n @media (forced-colors: active) {\n .input input[type=radio]:checked:before {\n \n background: selectedItem !important;\n }\n }\n}";
|
|
23490
23910
|
var KolTableStatelessDefaultStyle0 = defaultStyleCss$7;
|
|
23491
23911
|
|
|
23492
23912
|
class KolTableStateless$1 {
|
|
@@ -23501,7 +23921,7 @@ class KolTableStateless$1 {
|
|
|
23501
23921
|
this._selection = undefined;
|
|
23502
23922
|
}
|
|
23503
23923
|
render() {
|
|
23504
|
-
return (hAsync(Host, { key: '
|
|
23924
|
+
return (hAsync(Host, { key: 'bc31faa17c1bc6a0140e1bf45809f7ec68d3f4e2', class: "kol-table-stateless" }, hAsync(KolTableStatelessWcTag, { key: '5266f761e857f72bfc92a5621df322b294e97e17', _data: this._data, _dataFoot: this._dataFoot, _headerCells: this._headerCells, _label: this._label, _minWidth: this._minWidth, _on: this._on, _selection: this._selection })));
|
|
23505
23925
|
}
|
|
23506
23926
|
static get style() { return {
|
|
23507
23927
|
default: KolTableStatelessDefaultStyle0
|
|
@@ -23812,56 +24232,66 @@ class KolTableStateless {
|
|
|
23812
24232
|
}
|
|
23813
24233
|
renderSelectionCell(row, rowIndex) {
|
|
23814
24234
|
var _a, _b, _c;
|
|
23815
|
-
|
|
24235
|
+
const selection = this.state._selection;
|
|
24236
|
+
if (!selection)
|
|
23816
24237
|
return '';
|
|
23817
|
-
const keyPropertyName = (_a =
|
|
23818
|
-
const
|
|
23819
|
-
if (!
|
|
24238
|
+
const keyPropertyName = (_a = selection.keyPropertyName) !== null && _a !== void 0 ? _a : 'id';
|
|
24239
|
+
const firstCellData = (_b = row[0]) === null || _b === void 0 ? void 0 : _b.data;
|
|
24240
|
+
if (!firstCellData)
|
|
23820
24241
|
return '';
|
|
23821
|
-
const keyProperty =
|
|
23822
|
-
const
|
|
23823
|
-
const
|
|
23824
|
-
|
|
23825
|
-
|
|
23826
|
-
|
|
23827
|
-
|
|
23828
|
-
|
|
23829
|
-
|
|
23830
|
-
|
|
23831
|
-
|
|
23832
|
-
|
|
23833
|
-
|
|
23834
|
-
|
|
23835
|
-
|
|
24242
|
+
const keyProperty = firstCellData[keyPropertyName];
|
|
24243
|
+
const isMultiple = selection.multiple || selection.multiple === undefined;
|
|
24244
|
+
const selected = (_c = selection === null || selection === void 0 ? void 0 : selection.selectedKeys) === null || _c === void 0 ? void 0 : _c.includes(keyProperty);
|
|
24245
|
+
const label = selection.label(firstCellData);
|
|
24246
|
+
const props = {
|
|
24247
|
+
name: 'selection',
|
|
24248
|
+
checked: selected,
|
|
24249
|
+
id: keyProperty,
|
|
24250
|
+
['aria-label']: label,
|
|
24251
|
+
};
|
|
24252
|
+
return (hAsync("td", { key: `tbody-${rowIndex}-selection`, class: "selection-cell" }, hAsync("div", { class: `input ${selected ? 'checked' : ''}` }, isMultiple ? (hAsync("label", { class: "checkbox-container" }, hAsync(KolIconTag, { class: "icon", _icons: `codicon ${selected ? 'codicon-check' : ''}`, _label: "" }), hAsync("input", Object.assign({}, props, { type: "checkbox", onInput: (event) => {
|
|
24253
|
+
var _a, _b, _c;
|
|
24254
|
+
const updatedSelectedKeys = !selected
|
|
24255
|
+
? [...((_a = selection === null || selection === void 0 ? void 0 : selection.selectedKeys) !== null && _a !== void 0 ? _a : []), keyProperty]
|
|
24256
|
+
: (_b = selection === null || selection === void 0 ? void 0 : selection.selectedKeys) === null || _b === void 0 ? void 0 : _b.filter((key) => key !== keyProperty);
|
|
24257
|
+
tryToDispatchKoliBriEvent('selection-change', this.host, updatedSelectedKeys);
|
|
24258
|
+
if (typeof ((_c = this.state._on) === null || _c === void 0 ? void 0 : _c[Events.onSelectionChange]) === 'function') {
|
|
24259
|
+
this.state._on[Events.onSelectionChange](event, updatedSelectedKeys !== null && updatedSelectedKeys !== void 0 ? updatedSelectedKeys : []);
|
|
24260
|
+
}
|
|
24261
|
+
} })))) : (hAsync("label", { class: "radio-container" }, hAsync("input", Object.assign({}, props, { type: "radio", onInput: (event) => {
|
|
24262
|
+
var _a;
|
|
24263
|
+
tryToDispatchKoliBriEvent('selection-change', this.host, keyProperty);
|
|
24264
|
+
if (typeof ((_a = this.state._on) === null || _a === void 0 ? void 0 : _a[Events.onSelectionChange]) === 'function') {
|
|
24265
|
+
this.state._on[Events.onSelectionChange](event, keyProperty);
|
|
24266
|
+
}
|
|
24267
|
+
} })))), hAsync(KolTooltipWcTag, { "aria-hidden": "true", class: "input-tooltip", _align: "right", _id: `${keyProperty}-label`, _label: label }))));
|
|
23836
24268
|
}
|
|
23837
24269
|
renderHeadingSelectionCell() {
|
|
23838
|
-
var _a;
|
|
23839
|
-
|
|
23840
|
-
|
|
23841
|
-
|
|
24270
|
+
var _a, _b;
|
|
24271
|
+
const selection = this.state._selection;
|
|
24272
|
+
if (!selection || (!selection.multiple && selection.multiple !== undefined))
|
|
24273
|
+
return hAsync("th", { key: `thead-0` });
|
|
24274
|
+
const keyPropertyName = (_a = selection.keyPropertyName) !== null && _a !== void 0 ? _a : 'id';
|
|
24275
|
+
const selectedKeyLength = (_b = selection.selectedKeys) === null || _b === void 0 ? void 0 : _b.length;
|
|
23842
24276
|
const dataLength = this.state._data.length;
|
|
23843
24277
|
const isChecked = selectedKeyLength === dataLength;
|
|
23844
|
-
const
|
|
23845
|
-
let translationKey = 'kol-table-selection-
|
|
23846
|
-
if (isChecked && !
|
|
24278
|
+
const indeterminate = selectedKeyLength !== 0 && !isChecked;
|
|
24279
|
+
let translationKey = 'kol-table-selection-indeterminate';
|
|
24280
|
+
if (isChecked && !indeterminate) {
|
|
23847
24281
|
translationKey = 'kol-table-selection-none';
|
|
23848
24282
|
}
|
|
23849
24283
|
if (selectedKeyLength === 0) {
|
|
23850
24284
|
translationKey = 'kol-table-selection-all';
|
|
23851
24285
|
}
|
|
23852
|
-
|
|
23853
|
-
|
|
23854
|
-
|
|
23855
|
-
|
|
23856
|
-
|
|
23857
|
-
|
|
23858
|
-
|
|
23859
|
-
|
|
23860
|
-
|
|
23861
|
-
this.state._on[Events.onSelectionChange](event, selections.map((el) => el === null || el === void 0 ? void 0 : el.id));
|
|
23862
|
-
}
|
|
23863
|
-
},
|
|
23864
|
-
} })));
|
|
24286
|
+
const label = translate(translationKey);
|
|
24287
|
+
return (hAsync("th", { key: `thead-0-selection`, class: "selection-cell selection-control" }, hAsync("div", { class: `input ${indeterminate ? 'indeterminate' : isChecked ? 'checked' : ''}` }, hAsync("label", { class: "checkbox-container" }, hAsync(KolIconTag, { class: "icon", _icons: `codicon ${indeterminate ? 'codicon-remove' : isChecked ? 'codicon-check' : ''}`, _label: "" }), hAsync("input", { name: "selection", checked: isChecked && !indeterminate, "aria-label": label, type: "checkbox", onInput: (event) => {
|
|
24288
|
+
var _a;
|
|
24289
|
+
const selections = !isChecked ? this.state._data.map((el) => el === null || el === void 0 ? void 0 : el[keyPropertyName]) : [];
|
|
24290
|
+
tryToDispatchKoliBriEvent('selection-change', this.host, selections);
|
|
24291
|
+
if (typeof ((_a = this.state._on) === null || _a === void 0 ? void 0 : _a[Events.onSelectionChange]) === 'function') {
|
|
24292
|
+
this.state._on[Events.onSelectionChange](event, selections);
|
|
24293
|
+
}
|
|
24294
|
+
} })), hAsync(KolTooltipWcTag, { "aria-hidden": "true", class: "input-tooltip", _align: "right", _id: `${translationKey}-label`, _label: label }))));
|
|
23865
24295
|
}
|
|
23866
24296
|
renderHeadingCell(cell, rowIndex, colIndex) {
|
|
23867
24297
|
let ariaSort = undefined;
|
|
@@ -23901,9 +24331,9 @@ class KolTableStateless {
|
|
|
23901
24331
|
}
|
|
23902
24332
|
render() {
|
|
23903
24333
|
const dataField = this.createDataField(this.state._data, this.state._headerCells);
|
|
23904
|
-
return (hAsync(Host, { key: '
|
|
24334
|
+
return (hAsync(Host, { key: 'f85ebbd2b4eec795d4964c70a7a7f8a198cb869d', class: "kol-table-stateless-wc" }, hAsync("div", { key: 'c52014d109db7569fae4c0973e0e34477841766c', ref: (element) => (this.tableDivElement = element), class: "table", tabindex: this.tableDivElementHasScrollbar ? '-1' : undefined }, hAsync("table", { key: 'b4a41732a9ec6000838e8288e3ccff3ccf04be5f', style: {
|
|
23905
24335
|
minWidth: this.state._minWidth,
|
|
23906
|
-
} }, hAsync("div", { key: '
|
|
24336
|
+
} }, hAsync("div", { key: '8a32442c4a628c954ac7c3d7760305ba9888beff', class: "focus-element", tabindex: this.tableDivElementHasScrollbar ? '0' : undefined, "aria-describedby": "caption" }, "\u00A0"), hAsync("caption", { key: 'befbf4e6dffc310bcac6f03e9f8e1ffc085a874c', id: "caption" }, this.state._label), Array.isArray(this.state._headerCells.horizontal) && (hAsync("thead", { key: 'fff15522007732fb25994abbdcb495cf12c16ac8' }, this.state._headerCells.horizontal.map((cols, rowIndex) => (hAsync("tr", { key: `thead-${rowIndex}` }, this.state._selection && this.renderHeadingSelectionCell(), cols.map((cell, colIndex) => {
|
|
23907
24337
|
if (cell.asTd === true) {
|
|
23908
24338
|
return (hAsync("td", { key: `thead-${rowIndex}-${colIndex}-${cell.label}`, class: {
|
|
23909
24339
|
[cell.textAlign]: typeof cell.textAlign === 'string' && cell.textAlign.length > 0,
|
|
@@ -23919,7 +24349,7 @@ class KolTableStateless {
|
|
|
23919
24349
|
else {
|
|
23920
24350
|
return this.renderHeadingCell(cell, rowIndex, colIndex);
|
|
23921
24351
|
}
|
|
23922
|
-
})))))), hAsync("tbody", { key: '
|
|
24352
|
+
})))))), hAsync("tbody", { key: '002e28758e482e0f3d7268066dbaff3974eabb2a' }, dataField.map(this.renderTableRow)), this.renderFoot()))));
|
|
23923
24353
|
}
|
|
23924
24354
|
get host() { return getElement(this); }
|
|
23925
24355
|
static get watchers() { return {
|
|
@@ -24110,11 +24540,11 @@ class KolTabs {
|
|
|
24110
24540
|
} }))));
|
|
24111
24541
|
}
|
|
24112
24542
|
render() {
|
|
24113
|
-
return (hAsync(Host, { key: '
|
|
24543
|
+
return (hAsync(Host, { key: '22ca75e66e106214c5c2217a6a0adab34eda3bae', class: "kol-tabs" }, hAsync("div", { key: '0e277a0bb2bec27aeb29ad0fec3d736936fb4269', ref: (el) => {
|
|
24114
24544
|
this.tabPanelsElement = el;
|
|
24115
24545
|
}, class: {
|
|
24116
24546
|
[`tabs-align-${this.state._align}`]: true,
|
|
24117
|
-
} }, this.renderButtonGroup(), hAsync("div", { key: '
|
|
24547
|
+
} }, this.renderButtonGroup(), hAsync("div", { key: '9fa8c95bf70a8cb254818edb27864975979e5830', class: "tabs-content", ref: this.catchTabPanelHost }))));
|
|
24118
24548
|
}
|
|
24119
24549
|
validateAlign(value) {
|
|
24120
24550
|
validateAlign(this, value);
|
|
@@ -24326,7 +24756,7 @@ class KolTextarea {
|
|
|
24326
24756
|
render() {
|
|
24327
24757
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
24328
24758
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
24329
|
-
return (hAsync(Host, { key: '
|
|
24759
|
+
return (hAsync(Host, { key: '1acff0b5b2cd42f3ac647cc5e417c2e9c255b0bf', class: { 'kol-textarea': true, 'has-value': this.state._hasValue } }, hAsync(KolInputWcTag, { key: '87ed73dbc8ea546bb02acafe72b59f5baf66f577', class: { textarea: true, 'hide-label': !!this.state._hideLabel, 'has-counter': !!this.state._hasCounter }, _accessKey: this.state._accessKey, _alert: this.state._alert, _currentLength: this.state._currentLength, _disabled: this.state._disabled, _hideError: this.state._hideError, _hasCounter: this.state._hasCounter, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _maxLength: this.state._maxLength, _msg: this.state._msg, _readOnly: this.state._readOnly, _required: this.state._required, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.textareaRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '181700f6d9d2c3579ccec39b7879426469bdd9e2', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedAccessKey, { accessKey: this.state._accessKey, label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, this.state._accessKey))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '00acee7946e4d3a53827b7a5c8172ccfec49f8c2', slot: "input" }, hAsync("textarea", Object.assign({ key: '044957d12fd0edef8d2d68a492bd2a21f6997fe5', ref: this.catchRef, title: "", accessKey: this.state._accessKey, "aria-describedby": ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, "aria-label": this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, autoCapitalize: "off", autoCorrect: "off", disabled: this.state._disabled, id: this.state._id, maxlength: this.state._maxLength, name: this.state._name, readOnly: this.state._readOnly, required: this.state._required, rows: this.state._rows, placeholder: this.state._placeholder, spellcheck: "false" }, this.controller.onFacade, { onInput: this.onInput, style: {
|
|
24330
24760
|
resize: this.state._resize,
|
|
24331
24761
|
}, value: this.state._value }))))));
|
|
24332
24762
|
}
|
|
@@ -24613,7 +25043,7 @@ class KolToastContainer {
|
|
|
24613
25043
|
}
|
|
24614
25044
|
}
|
|
24615
25045
|
render() {
|
|
24616
|
-
return (hAsync(Host, { key: '
|
|
25046
|
+
return (hAsync(Host, { key: '69ede64a0d0e5bfcd817e943d5a7cb4512c4deb4', class: "kol-toast-container" }, this.state._toastStates.length > 1 && (hAsync(KolButtonTag, { key: 'a05a1e8f4e8f3609ea815dfce9110f59791fa82e', _label: translate('kol-toast-close-all'), class: "close-all", _on: {
|
|
24617
25047
|
onClick: () => {
|
|
24618
25048
|
void this.closeAll();
|
|
24619
25049
|
},
|
|
@@ -24665,7 +25095,7 @@ class KolToolbar {
|
|
|
24665
25095
|
this._items = undefined;
|
|
24666
25096
|
}
|
|
24667
25097
|
render() {
|
|
24668
|
-
return (hAsync(Host, { key: '
|
|
25098
|
+
return (hAsync(Host, { key: '7b35047b6a4b216bc65b19c4d61551a78bf18649', class: "kol-toolbar" }, hAsync("div", { key: '5862588a0e355d5eb844283ab4e9a152a0773b7a', class: "toolbar", role: "toolbar", "aria-label": this.state._label }, this.state._items.map(this.renderItem))));
|
|
24669
25099
|
}
|
|
24670
25100
|
validateLabel(value) {
|
|
24671
25101
|
validateLabel(this, value);
|
|
@@ -24866,7 +25296,7 @@ class KolTooltipWc {
|
|
|
24866
25296
|
this.showOrHideTooltip();
|
|
24867
25297
|
}
|
|
24868
25298
|
render() {
|
|
24869
|
-
return (hAsync(Host, { key: '
|
|
25299
|
+
return (hAsync(Host, { key: 'bff5943ece35d93b5c8ea604af0171e9b0044fbc', class: "kol-tooltip-wc" }, this.state._label !== '' && (hAsync("div", { key: '11a90c4acfa2dbe2ffe61e1d10f0fe2cc30e6e99', class: "tooltip-floating", ref: this.catchTooltipElement }, hAsync("div", { key: 'faef6b2e53cb2e8fa90ab559dc08a3a77cd607e8', class: "tooltip-area tooltip-arrow", ref: this.catchArrowElement }), hAsync(KolSpanWcTag, { key: 'b89fbc1f793a6952886e6b9f8e1671645194e18f', class: "tooltip-area tooltip-content", id: this.state._id, _accessKey: this._accessKey, _label: this.state._label })))));
|
|
24870
25300
|
}
|
|
24871
25301
|
validateAccessKey(value) {
|
|
24872
25302
|
validateAccessKey(this, value);
|
|
@@ -24945,7 +25375,7 @@ class KolTree {
|
|
|
24945
25375
|
this._label = undefined;
|
|
24946
25376
|
}
|
|
24947
25377
|
render() {
|
|
24948
|
-
return (hAsync(Host, { key: '
|
|
25378
|
+
return (hAsync(Host, { key: '8429fa6589ac19c9e91cd8788a46066b239b19da', class: "kol-tree" }, hAsync(KolTreeWcTag, { key: '62e9fbaa416ac2537bfb6609359f27364331ed67', _label: this._label }, hAsync("slot", { key: 'e3c3fbdc4df65a07c8c556b01c94e05056105df8' }))));
|
|
24949
25379
|
}
|
|
24950
25380
|
static get style() { return {
|
|
24951
25381
|
default: KolTreeDefaultStyle0
|
|
@@ -24993,7 +25423,7 @@ class KolTreeItem {
|
|
|
24993
25423
|
return (_b = (await ((_a = this.element) === null || _a === void 0 ? void 0 : _a.isOpen()))) !== null && _b !== void 0 ? _b : false;
|
|
24994
25424
|
}
|
|
24995
25425
|
render() {
|
|
24996
|
-
return (hAsync(KolTreeItemWcTag, { key: '
|
|
25426
|
+
return (hAsync(KolTreeItemWcTag, { key: '3a1302f63ebb3210cb2bcd499036b6c07a9e8dfa', class: "kol-tree-item", _active: this._active, _label: this._label, _open: this._open, _href: this._href, ref: (element) => (this.element = element) }, hAsync("slot", { key: 'dd9f9d77adbf0bb012d76f0e0faa67f918fe8cc1' })));
|
|
24997
25427
|
}
|
|
24998
25428
|
static get style() { return {
|
|
24999
25429
|
default: KolTreeItemDefaultStyle0
|
|
@@ -25021,9 +25451,6 @@ class KolTreeItemWc {
|
|
|
25021
25451
|
constructor(hostRef) {
|
|
25022
25452
|
registerInstance(this, hostRef);
|
|
25023
25453
|
this.groupId = `tree-group-${nonce()}`;
|
|
25024
|
-
this.renderIcon = (props) => {
|
|
25025
|
-
return hAsync(KolIconTag, { class: "toggle-button-icon", _label: props.label, _icons: props.icon });
|
|
25026
|
-
};
|
|
25027
25454
|
this.level = undefined;
|
|
25028
25455
|
this.state = {
|
|
25029
25456
|
_active: false,
|
|
@@ -25039,16 +25466,13 @@ class KolTreeItemWc {
|
|
|
25039
25466
|
}
|
|
25040
25467
|
render() {
|
|
25041
25468
|
const { _href, _active, _hasChildren, _open, _label } = this.state;
|
|
25042
|
-
return (hAsync(Host, { key: '
|
|
25469
|
+
return (hAsync(Host, { key: '80b4d8b5633b98cf7ebc12c3c9e50cd5a2617d4a', onSlotchange: this.handleSlotchange.bind(this), class: "kol-tree-item-wc" }, hAsync("li", { key: '0dc520638d2452cc5687e192300192b22322dd25', class: "tree-item", style: {
|
|
25043
25470
|
'--level': `${this.level}`,
|
|
25044
|
-
} }, hAsync(KolLinkWcTag, { key: '
|
|
25471
|
+
} }, hAsync(KolLinkWcTag, { key: '6cf78c51ec92daaa5d29830eb1e6dd0147c12ee4', class: {
|
|
25045
25472
|
'tree-link': true,
|
|
25046
25473
|
'first-level': this.level === 0,
|
|
25047
25474
|
active: Boolean(_active),
|
|
25048
|
-
}, _href: _href, _label: "", _role: "treeitem", _tabIndex: _active ? 0 : -1, _ariaExpanded: _open, _ariaOwns: _hasChildren ? this.groupId : undefined, ref: (element) => (this.linkElement = element) }, hAsync("span", { key: '
|
|
25049
|
-
icon: `codicon codicon-${_open ? 'chevron-down' : 'chevron-right'}`,
|
|
25050
|
-
label: _open ? 'Vorschläge öffnen' : 'Vorschläge schließen',
|
|
25051
|
-
}))), ' ', _label)), hAsync("ul", { key: '2b414e97ffa358b9332573194d450cf8c548a6d6', hidden: !_hasChildren || !_open, role: "group", id: this.groupId }, hAsync("slot", { key: '8ea7a3d44e0acb4626b23070dd044b17688313c5' })))));
|
|
25475
|
+
}, _href: _href, _label: "", _role: "treeitem", _tabIndex: _active ? 0 : -1, _ariaExpanded: _hasChildren ? _open : undefined, _ariaOwns: _hasChildren ? this.groupId : undefined, ref: (element) => (this.linkElement = element) }, hAsync("span", { key: '7681b6f5f59dc63fc025c2e6bf589478cd8e8db2', slot: "expert" }, _hasChildren && (hAsync("span", { key: 'e2504c3cd286758f562bad3238ded934ef4482f2', class: "toggle-button", onClick: (event) => (_open ? void this.handleCollapseClick(event) : void this.handleExpandClick(event)) }, hAsync(KolIconTag, { key: '892da807da1e116a0c6c6b1566f7db6e087886ff', class: "toggle-button-icon", _icons: `codicon codicon-${_open ? 'chevron-down' : 'chevron-right'}`, _label: '' }))), ' ', _label)), hAsync("ul", { key: '45db8c2f2dd4681e7ec0c130df25b0f97c3553ac', hidden: !_hasChildren || !_open, role: "group", id: this.groupId }, hAsync("slot", { key: '3052b7252e4188563fb2253a738421a3238da9a3' })))));
|
|
25052
25476
|
}
|
|
25053
25477
|
validateActive(value) {
|
|
25054
25478
|
validateActive(this, value || false);
|
|
@@ -25153,7 +25577,7 @@ class KolTreeWc {
|
|
|
25153
25577
|
validateLabel(this, value);
|
|
25154
25578
|
}
|
|
25155
25579
|
render() {
|
|
25156
|
-
return (hAsync(Host, { key: '
|
|
25580
|
+
return (hAsync(Host, { key: '82bb52022bfdb49097211e6c467e470f83ec0556', onSlotchange: this.handleSlotchange.bind(this), class: "kol-tree-wc" }, hAsync("nav", { key: 'ac29f20bba3f93dca3929f0eded5d99a3f2d7073', class: "tree", "aria-label": this.state._label }, hAsync("ul", { key: 'f5c927ab966ebf1c5d5a6b325f1321fee59eb816', class: "treeview-navigation", role: "tree", "aria-label": this.state._label }, hAsync("slot", { key: '05ebe01c9fb3ec3293f7a45bf96aff8ebf9e8f0e' })))));
|
|
25157
25581
|
}
|
|
25158
25582
|
static isTreeItem(element) {
|
|
25159
25583
|
return (element === null || element === void 0 ? void 0 : element.tagName) === KolTreeItemTag.toUpperCase();
|
|
@@ -25348,7 +25772,7 @@ class KolVersion {
|
|
|
25348
25772
|
};
|
|
25349
25773
|
}
|
|
25350
25774
|
render() {
|
|
25351
|
-
return (hAsync(Host, { key: '
|
|
25775
|
+
return (hAsync(Host, { key: 'cf55dcd0e6bd1ba92ded64e876dcb98a31c0a549', class: "kol-version" }, hAsync(KolBadgeTag, { key: '0a38f83859051a625c416a50acc1a0ab40c69247', _color: "#bec5c9", _icons: {
|
|
25352
25776
|
left: { icon: 'codicon codicon-versions', label: translate('kol-version') },
|
|
25353
25777
|
}, _label: this.state._label })));
|
|
25354
25778
|
}
|
|
@@ -25428,6 +25852,7 @@ registerComponents([
|
|
|
25428
25852
|
KolProcess,
|
|
25429
25853
|
KolQuote,
|
|
25430
25854
|
KolSelect,
|
|
25855
|
+
KolSingleSelect,
|
|
25431
25856
|
KolSkipNav,
|
|
25432
25857
|
KolSpanWc,
|
|
25433
25858
|
KolSpin,
|