@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.mjs
CHANGED
|
@@ -3834,6 +3834,10 @@ const validateAriaCurrentValue = (component, value) => {
|
|
|
3834
3834
|
});
|
|
3835
3835
|
};
|
|
3836
3836
|
|
|
3837
|
+
const validateAriaDescription = (component, value) => {
|
|
3838
|
+
watchString(component, '_ariaDescription', value);
|
|
3839
|
+
};
|
|
3840
|
+
|
|
3837
3841
|
const validateAriaExpanded = (component, value) => {
|
|
3838
3842
|
watchBoolean(component, '_ariaExpanded', value);
|
|
3839
3843
|
};
|
|
@@ -4206,6 +4210,10 @@ const validatePaginationPosition = (component, value) => {
|
|
|
4206
4210
|
});
|
|
4207
4211
|
};
|
|
4208
4212
|
|
|
4213
|
+
const validatePopoverCallbacks = (component, value) => {
|
|
4214
|
+
watchValidator(component, `_on`, (value) => typeof value === 'object' && value !== null, new Set(['PopoverCallbacksPropType {Events.onClose}']), value);
|
|
4215
|
+
};
|
|
4216
|
+
|
|
4209
4217
|
const validateReadOnly = (component, value) => {
|
|
4210
4218
|
watchBoolean(component, '_readOnly', value);
|
|
4211
4219
|
};
|
|
@@ -4370,11 +4378,11 @@ let KolHeadingWcTag = 'kol-heading-wc';
|
|
|
4370
4378
|
let KolIconTag = 'kol-icon';
|
|
4371
4379
|
let KolIndentedTextTag = 'kol-indented-text';
|
|
4372
4380
|
let KolIndentedTextWcTag = 'kol-indented-text-wc';
|
|
4373
|
-
let KolInputCheckboxTag = 'kol-input-checkbox';
|
|
4374
4381
|
let KolInputWcTag = 'kol-input';
|
|
4375
4382
|
let KolLinkTag = 'kol-link';
|
|
4376
4383
|
let KolLinkWcTag = 'kol-link-wc';
|
|
4377
4384
|
let KolPaginationTag = 'kol-pagination';
|
|
4385
|
+
let KolPopoverWcTag = 'kol-popover-wc';
|
|
4378
4386
|
let KolSelectTag = 'kol-select';
|
|
4379
4387
|
let KolSpanWcTag = 'kol-span-wc';
|
|
4380
4388
|
let KolTableStatefulTag = 'kol-table-stateful';
|
|
@@ -4385,8 +4393,8 @@ let KolTreeItemWcTag = 'kol-tree-item-wc';
|
|
|
4385
4393
|
let KolTreeTag = 'kol-tree';
|
|
4386
4394
|
let KolTreeWcTag = 'kol-tree-wc';
|
|
4387
4395
|
|
|
4388
|
-
const defaultStyleCss$
|
|
4389
|
-
var KolAbbrDefaultStyle0 = defaultStyleCss$
|
|
4396
|
+
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}";
|
|
4397
|
+
var KolAbbrDefaultStyle0 = defaultStyleCss$P;
|
|
4390
4398
|
|
|
4391
4399
|
class KolAbbr {
|
|
4392
4400
|
constructor(hostRef) {
|
|
@@ -4444,8 +4452,8 @@ const watchHeadingLevel = (component, value) => {
|
|
|
4444
4452
|
});
|
|
4445
4453
|
};
|
|
4446
4454
|
|
|
4447
|
-
const defaultStyleCss$
|
|
4448
|
-
var KolAccordionDefaultStyle0 = defaultStyleCss$
|
|
4455
|
+
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}";
|
|
4456
|
+
var KolAccordionDefaultStyle0 = defaultStyleCss$O;
|
|
4449
4457
|
|
|
4450
4458
|
featureHint(`[KolAccordion] Anfrage nach einer KolAccordionGroup bei dem immer nur ein Accordion geöffnet ist.
|
|
4451
4459
|
|
|
@@ -4548,8 +4556,8 @@ class KolAccordion {
|
|
|
4548
4556
|
}; }
|
|
4549
4557
|
}
|
|
4550
4558
|
|
|
4551
|
-
const defaultStyleCss$
|
|
4552
|
-
var KolAlertDefaultStyle0 = defaultStyleCss$
|
|
4559
|
+
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}";
|
|
4560
|
+
var KolAlertDefaultStyle0 = defaultStyleCss$N;
|
|
4553
4561
|
|
|
4554
4562
|
class KolAlert {
|
|
4555
4563
|
constructor(hostRef) {
|
|
@@ -4631,13 +4639,15 @@ var locale_de = {
|
|
|
4631
4639
|
'table-visible-range': 'Einträge {{start}} bis {{end}} von {{total}}',
|
|
4632
4640
|
'table-selection-all': 'Alle auswählen',
|
|
4633
4641
|
'table-selection-none': 'Alle abwählen',
|
|
4634
|
-
'table-selection-
|
|
4642
|
+
'table-selection-indeterminate': 'Alle auswählen bei teilweiser Auswahl',
|
|
4635
4643
|
dropdown: 'Auswahlliste',
|
|
4636
4644
|
'nav-label-open': 'Untermenü zu {{label}} öffnen',
|
|
4637
4645
|
'nav-label-close': 'Untermenü zu {{label}} schließen',
|
|
4638
4646
|
'close-alert': 'Benachrichtigung {{label}} schließen',
|
|
4639
4647
|
'show-password': 'einblenden',
|
|
4640
4648
|
'hide-password': 'ausblenden',
|
|
4649
|
+
'no-results-message': 'Keine Ergebnisse gefunden.',
|
|
4650
|
+
'delete-selection': 'Auswahl entfernen',
|
|
4641
4651
|
};
|
|
4642
4652
|
|
|
4643
4653
|
var locale_en = {
|
|
@@ -4681,13 +4691,15 @@ var locale_en = {
|
|
|
4681
4691
|
'table-visible-range': 'Entries {{start}} to {{end}} of {{total}}',
|
|
4682
4692
|
'table-selection-all': 'Select all',
|
|
4683
4693
|
'table-selection-none': 'Deselect all',
|
|
4684
|
-
'table-selection-
|
|
4694
|
+
'table-selection-indeterminate': 'Select all with partial selection',
|
|
4685
4695
|
dropdown: 'Dropdown',
|
|
4686
4696
|
'nav-label-open': 'Submenu for {{label}} open',
|
|
4687
4697
|
'nav-label-close': 'Submenu for {{label}} close',
|
|
4688
|
-
'close-alert': '
|
|
4698
|
+
'close-alert': 'Close notification {{label}}',
|
|
4689
4699
|
'show-password': 'Show',
|
|
4690
4700
|
'hide-password': 'Hide',
|
|
4701
|
+
'no-results-message': 'No results found.',
|
|
4702
|
+
'delete-selection': 'Delete selection',
|
|
4691
4703
|
};
|
|
4692
4704
|
|
|
4693
4705
|
const mapLocaleKeys = (locale) => Object.keys(locale).reduce((a, c) => ((a[`${'kol'}-${c}`] = locale[c]), a), {});
|
|
@@ -4806,7 +4818,7 @@ class KolAlertWc {
|
|
|
4806
4818
|
};
|
|
4807
4819
|
}
|
|
4808
4820
|
render() {
|
|
4809
|
-
var _a;
|
|
4821
|
+
var _a, _b;
|
|
4810
4822
|
if (this.state._alert) {
|
|
4811
4823
|
try {
|
|
4812
4824
|
Log.debug(['Navigator should vibrate ...', navigator.vibrate([100, 75, 100, 75, 100])]);
|
|
@@ -4824,11 +4836,11 @@ class KolAlertWc {
|
|
|
4824
4836
|
[this.state._type]: true,
|
|
4825
4837
|
[this.state._variant]: true,
|
|
4826
4838
|
hasCloser: !!this.state._hasCloser,
|
|
4827
|
-
}, 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: '
|
|
4839
|
+
}, 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: {
|
|
4828
4840
|
left: {
|
|
4829
4841
|
icon: 'codicon codicon-close',
|
|
4830
4842
|
},
|
|
4831
|
-
}, _label: translate('kol-close-alert', { placeholders: { label: this.state._label } }), _on: this.on, _tooltipAlign: "left" }))), this.state._variant === 'card' && (hAsync("div", { key: '
|
|
4843
|
+
}, _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' })))));
|
|
4832
4844
|
}
|
|
4833
4845
|
validateAlert(value) {
|
|
4834
4846
|
watchBoolean(this, '_alert', value);
|
|
@@ -4892,8 +4904,8 @@ class KolAlertWc {
|
|
|
4892
4904
|
}; }
|
|
4893
4905
|
}
|
|
4894
4906
|
|
|
4895
|
-
const defaultStyleCss$
|
|
4896
|
-
var KolAvatarDefaultStyle0 = defaultStyleCss$
|
|
4907
|
+
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}";
|
|
4908
|
+
var KolAvatarDefaultStyle0 = defaultStyleCss$M;
|
|
4897
4909
|
|
|
4898
4910
|
class KolAvatar {
|
|
4899
4911
|
constructor(hostRef) {
|
|
@@ -4979,8 +4991,8 @@ class KolAvatarWc {
|
|
|
4979
4991
|
}; }
|
|
4980
4992
|
}
|
|
4981
4993
|
|
|
4982
|
-
const defaultStyleCss$
|
|
4983
|
-
var KolBadgeDefaultStyle0 = defaultStyleCss$
|
|
4994
|
+
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}";
|
|
4995
|
+
var KolBadgeDefaultStyle0 = defaultStyleCss$L;
|
|
4984
4996
|
|
|
4985
4997
|
featureHint(`[KolBadge] Optimierung des _color-Properties (rgba, rgb, hex usw.).`);
|
|
4986
4998
|
class KolBadge {
|
|
@@ -5080,8 +5092,8 @@ const watchNavLinks = (className, component, value) => {
|
|
|
5080
5092
|
uiUxHintMillerscheZahl(className, component.state._links.length);
|
|
5081
5093
|
};
|
|
5082
5094
|
|
|
5083
|
-
const defaultStyleCss$
|
|
5084
|
-
var KolBreadcrumbDefaultStyle0 = defaultStyleCss$
|
|
5095
|
+
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}";
|
|
5096
|
+
var KolBreadcrumbDefaultStyle0 = defaultStyleCss$K;
|
|
5085
5097
|
|
|
5086
5098
|
class KolBreadcrumb {
|
|
5087
5099
|
constructor(hostRef) {
|
|
@@ -5141,8 +5153,8 @@ class KolBreadcrumb {
|
|
|
5141
5153
|
}; }
|
|
5142
5154
|
}
|
|
5143
5155
|
|
|
5144
|
-
const defaultStyleCss$
|
|
5145
|
-
var KolButtonDefaultStyle0 = defaultStyleCss$
|
|
5156
|
+
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}";
|
|
5157
|
+
var KolButtonDefaultStyle0 = defaultStyleCss$J;
|
|
5146
5158
|
|
|
5147
5159
|
class KolButton {
|
|
5148
5160
|
constructor(hostRef) {
|
|
@@ -5152,6 +5164,7 @@ class KolButton {
|
|
|
5152
5164
|
};
|
|
5153
5165
|
this._accessKey = undefined;
|
|
5154
5166
|
this._ariaControls = undefined;
|
|
5167
|
+
this._ariaDescription = undefined;
|
|
5155
5168
|
this._ariaExpanded = undefined;
|
|
5156
5169
|
this._ariaSelected = undefined;
|
|
5157
5170
|
this._customClass = undefined;
|
|
@@ -5181,11 +5194,11 @@ class KolButton {
|
|
|
5181
5194
|
await ((_a = this.buttonWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
|
|
5182
5195
|
}
|
|
5183
5196
|
render() {
|
|
5184
|
-
return (hAsync(Host, { key: '
|
|
5197
|
+
return (hAsync(Host, { key: '515bfb8d7870ebf2aca5f0c4d824e26d580c7d5d', class: "kol-button" }, hAsync(KolButtonWcTag, { key: 'd072d81aac487b8534b42ef47df1cfa016352290', ref: this.catchRef, class: {
|
|
5185
5198
|
button: true,
|
|
5186
5199
|
[this._variant]: this._variant !== 'custom',
|
|
5187
5200
|
[this._customClass]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,
|
|
5188
|
-
}, _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: '
|
|
5201
|
+
}, _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" }))));
|
|
5189
5202
|
}
|
|
5190
5203
|
static get style() { return {
|
|
5191
5204
|
default: KolButtonDefaultStyle0
|
|
@@ -5196,6 +5209,7 @@ class KolButton {
|
|
|
5196
5209
|
"$members$": {
|
|
5197
5210
|
"_accessKey": [1, "_access-key"],
|
|
5198
5211
|
"_ariaControls": [1, "_aria-controls"],
|
|
5212
|
+
"_ariaDescription": [1, "_aria-description"],
|
|
5199
5213
|
"_ariaExpanded": [4, "_aria-expanded"],
|
|
5200
5214
|
"_ariaSelected": [4, "_aria-selected"],
|
|
5201
5215
|
"_customClass": [1, "_custom-class"],
|
|
@@ -5223,8 +5237,8 @@ class KolButton {
|
|
|
5223
5237
|
}; }
|
|
5224
5238
|
}
|
|
5225
5239
|
|
|
5226
|
-
const defaultStyleCss$
|
|
5227
|
-
var KolButtonGroupDefaultStyle0 = defaultStyleCss$
|
|
5240
|
+
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}";
|
|
5241
|
+
var KolButtonGroupDefaultStyle0 = defaultStyleCss$I;
|
|
5228
5242
|
|
|
5229
5243
|
class KolButtonGroup {
|
|
5230
5244
|
constructor(hostRef) {
|
|
@@ -5266,8 +5280,8 @@ class KolButtonGroupWc {
|
|
|
5266
5280
|
}; }
|
|
5267
5281
|
}
|
|
5268
5282
|
|
|
5269
|
-
const defaultStyleCss$
|
|
5270
|
-
var KolButtonLinkDefaultStyle0 = defaultStyleCss$
|
|
5283
|
+
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}";
|
|
5284
|
+
var KolButtonLinkDefaultStyle0 = defaultStyleCss$H;
|
|
5271
5285
|
|
|
5272
5286
|
class KolButtonLink {
|
|
5273
5287
|
constructor(hostRef) {
|
|
@@ -5277,6 +5291,7 @@ class KolButtonLink {
|
|
|
5277
5291
|
};
|
|
5278
5292
|
this._accessKey = undefined;
|
|
5279
5293
|
this._ariaControls = undefined;
|
|
5294
|
+
this._ariaDescription = undefined;
|
|
5280
5295
|
this._ariaExpanded = undefined;
|
|
5281
5296
|
this._ariaSelected = undefined;
|
|
5282
5297
|
this._disabled = false;
|
|
@@ -5304,7 +5319,7 @@ class KolButtonLink {
|
|
|
5304
5319
|
await ((_a = this.buttonWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
|
|
5305
5320
|
}
|
|
5306
5321
|
render() {
|
|
5307
|
-
return (hAsync(Host, { key: '
|
|
5322
|
+
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" }))));
|
|
5308
5323
|
}
|
|
5309
5324
|
static get style() { return {
|
|
5310
5325
|
default: KolButtonLinkDefaultStyle0
|
|
@@ -5315,6 +5330,7 @@ class KolButtonLink {
|
|
|
5315
5330
|
"$members$": {
|
|
5316
5331
|
"_accessKey": [1, "_access-key"],
|
|
5317
5332
|
"_ariaControls": [1, "_aria-controls"],
|
|
5333
|
+
"_ariaDescription": [1, "_aria-description"],
|
|
5318
5334
|
"_ariaExpanded": [4, "_aria-expanded"],
|
|
5319
5335
|
"_ariaSelected": [4, "_aria-selected"],
|
|
5320
5336
|
"_disabled": [4],
|
|
@@ -5449,6 +5465,7 @@ const isAssociatedTagName = (name) => name === 'KOL-BUTTON' ||
|
|
|
5449
5465
|
name === 'KOL-INPUT-RANGE' ||
|
|
5450
5466
|
name === 'KOL-INPUT-TEXT' ||
|
|
5451
5467
|
name === 'KOL-SELECT' ||
|
|
5468
|
+
name === 'KOL-SINGLE-SELECT' ||
|
|
5452
5469
|
name === 'KOL-TEXTAREA';
|
|
5453
5470
|
class AssociatedInputController {
|
|
5454
5471
|
constructor(component, type, host) {
|
|
@@ -5467,7 +5484,7 @@ class AssociatedInputController {
|
|
|
5467
5484
|
this.component = component;
|
|
5468
5485
|
this.host = this.findHostWithShadowRoot(host);
|
|
5469
5486
|
this.type = type;
|
|
5470
|
-
if (this.experimentalMode && isAssociatedTagName((_a = this.host) === null || _a === void 0 ? void 0 : _a.tagName)) {
|
|
5487
|
+
if (this.experimentalMode && isAssociatedTagName((_a = this.host) === null || _a === void 0 ? void 0 : _a.tagName) && component._name) {
|
|
5471
5488
|
(_b = this.host) === null || _b === void 0 ? void 0 : _b.querySelectorAll('input,select,textarea').forEach((el) => {
|
|
5472
5489
|
var _a;
|
|
5473
5490
|
(_a = this.host) === null || _a === void 0 ? void 0 : _a.removeChild(el);
|
|
@@ -5494,6 +5511,7 @@ class AssociatedInputController {
|
|
|
5494
5511
|
this.formAssociated = document.createElement('textarea');
|
|
5495
5512
|
break;
|
|
5496
5513
|
case 'checkbox':
|
|
5514
|
+
case 'single-select':
|
|
5497
5515
|
case 'combobox':
|
|
5498
5516
|
default:
|
|
5499
5517
|
this.formAssociated = document.createElement('input');
|
|
@@ -5612,17 +5630,20 @@ class KolButtonWc {
|
|
|
5612
5630
|
(_a = this.buttonRef) === null || _a === void 0 ? void 0 : _a.focus();
|
|
5613
5631
|
}
|
|
5614
5632
|
render() {
|
|
5633
|
+
var _a, _b;
|
|
5615
5634
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
5616
|
-
|
|
5635
|
+
const hasAriaDescription = Boolean((_b = (_a = this.state._ariaDescription) === null || _a === void 0 ? void 0 : _a.trim()) === null || _b === void 0 ? void 0 : _b.length);
|
|
5636
|
+
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: {
|
|
5617
5637
|
button: true,
|
|
5618
5638
|
disabled: this.state._disabled === true,
|
|
5619
5639
|
[this.state._variant]: this.state._variant !== 'custom',
|
|
5620
5640
|
[this.state._customClass]: this.state._variant === 'custom' && typeof this.state._customClass === 'string' && this.state._customClass.length > 0,
|
|
5621
5641
|
'hide-label': this.state._hideLabel === true,
|
|
5622
|
-
}, 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: '
|
|
5642
|
+
}, 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))));
|
|
5623
5643
|
}
|
|
5624
5644
|
constructor(hostRef) {
|
|
5625
5645
|
registerInstance(this, hostRef);
|
|
5646
|
+
this.internalDescriptionById = nonce();
|
|
5626
5647
|
this.catchRef = (ref) => {
|
|
5627
5648
|
this.buttonRef = ref;
|
|
5628
5649
|
};
|
|
@@ -5652,6 +5673,7 @@ class KolButtonWc {
|
|
|
5652
5673
|
};
|
|
5653
5674
|
this._accessKey = undefined;
|
|
5654
5675
|
this._ariaControls = undefined;
|
|
5676
|
+
this._ariaDescription = undefined;
|
|
5655
5677
|
this._ariaExpanded = undefined;
|
|
5656
5678
|
this._ariaSelected = undefined;
|
|
5657
5679
|
this._customClass = undefined;
|
|
@@ -5684,6 +5706,9 @@ class KolButtonWc {
|
|
|
5684
5706
|
validateAriaControls(value) {
|
|
5685
5707
|
validateAriaControls(this, value);
|
|
5686
5708
|
}
|
|
5709
|
+
validateAriaDescription(value) {
|
|
5710
|
+
validateAriaDescription(this, value);
|
|
5711
|
+
}
|
|
5687
5712
|
validateAriaExpanded(value) {
|
|
5688
5713
|
validateAriaExpanded(this, value);
|
|
5689
5714
|
}
|
|
@@ -5741,6 +5766,7 @@ class KolButtonWc {
|
|
|
5741
5766
|
componentWillLoad() {
|
|
5742
5767
|
this.validateAccessKey(this._accessKey);
|
|
5743
5768
|
this.validateAriaControls(this._ariaControls);
|
|
5769
|
+
this.validateAriaDescription(this._ariaDescription);
|
|
5744
5770
|
this.validateAriaExpanded(this._ariaExpanded);
|
|
5745
5771
|
this.validateAriaSelected(this._ariaSelected);
|
|
5746
5772
|
this.validateCustomClass(this._customClass);
|
|
@@ -5763,6 +5789,7 @@ class KolButtonWc {
|
|
|
5763
5789
|
static get watchers() { return {
|
|
5764
5790
|
"_accessKey": ["validateAccessKey"],
|
|
5765
5791
|
"_ariaControls": ["validateAriaControls"],
|
|
5792
|
+
"_ariaDescription": ["validateAriaDescription"],
|
|
5766
5793
|
"_ariaExpanded": ["validateAriaExpanded"],
|
|
5767
5794
|
"_ariaSelected": ["validateAriaSelected"],
|
|
5768
5795
|
"_customClass": ["validateCustomClass"],
|
|
@@ -5787,6 +5814,7 @@ class KolButtonWc {
|
|
|
5787
5814
|
"$members$": {
|
|
5788
5815
|
"_accessKey": [1, "_access-key"],
|
|
5789
5816
|
"_ariaControls": [1, "_aria-controls"],
|
|
5817
|
+
"_ariaDescription": [1, "_aria-description"],
|
|
5790
5818
|
"_ariaExpanded": [4, "_aria-expanded"],
|
|
5791
5819
|
"_ariaSelected": [4, "_aria-selected"],
|
|
5792
5820
|
"_customClass": [1, "_custom-class"],
|
|
@@ -5813,8 +5841,8 @@ class KolButtonWc {
|
|
|
5813
5841
|
}; }
|
|
5814
5842
|
}
|
|
5815
5843
|
|
|
5816
|
-
const defaultStyleCss$
|
|
5817
|
-
var KolCardDefaultStyle0 = defaultStyleCss$
|
|
5844
|
+
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}";
|
|
5845
|
+
var KolCardDefaultStyle0 = defaultStyleCss$G;
|
|
5818
5846
|
|
|
5819
5847
|
class KolCard {
|
|
5820
5848
|
constructor(hostRef) {
|
|
@@ -5838,7 +5866,7 @@ class KolCard {
|
|
|
5838
5866
|
};
|
|
5839
5867
|
}
|
|
5840
5868
|
render() {
|
|
5841
|
-
return (hAsync(Host, { key: '
|
|
5869
|
+
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: {
|
|
5842
5870
|
left: {
|
|
5843
5871
|
icon: 'codicon codicon-close',
|
|
5844
5872
|
},
|
|
@@ -5972,14 +6000,7 @@ class InputController extends ControlledInputController {
|
|
|
5972
6000
|
watchString(this.component, '_hint', value);
|
|
5973
6001
|
}
|
|
5974
6002
|
validateId(value) {
|
|
5975
|
-
watchString(this.component, '_id', value, {
|
|
5976
|
-
hooks: {
|
|
5977
|
-
afterPatch: () => {
|
|
5978
|
-
this.setAttribute('id', this.formAssociated, this.component.state._id);
|
|
5979
|
-
},
|
|
5980
|
-
},
|
|
5981
|
-
minLength: 1,
|
|
5982
|
-
});
|
|
6003
|
+
watchString(this.component, '_id', value, { minLength: 1 });
|
|
5983
6004
|
if (value === '' || typeof value === 'undefined') {
|
|
5984
6005
|
devHint(`A unique ID on the input fields is not strictly required, but it might be relevant for E2E tests.`);
|
|
5985
6006
|
}
|
|
@@ -6185,8 +6206,8 @@ const getRenderStates = (state) => {
|
|
|
6185
6206
|
|
|
6186
6207
|
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}
|
|
6187
6208
|
|
|
6188
|
-
const defaultStyleCss$
|
|
6189
|
-
var KolComboboxDefaultStyle0 = defaultStyleCss$
|
|
6209
|
+
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}";
|
|
6210
|
+
var KolComboboxDefaultStyle0 = defaultStyleCss$F;
|
|
6190
6211
|
|
|
6191
6212
|
class KolCombobox {
|
|
6192
6213
|
async getValue() {
|
|
@@ -6222,10 +6243,12 @@ class KolCombobox {
|
|
|
6222
6243
|
this._filteredSuggestions = [...this._suggestions];
|
|
6223
6244
|
}
|
|
6224
6245
|
else {
|
|
6225
|
-
this._filteredSuggestions = this._suggestions
|
|
6226
|
-
|
|
6227
|
-
|
|
6228
|
-
|
|
6246
|
+
this._filteredSuggestions = Array.isArray(this._suggestions)
|
|
6247
|
+
? this._suggestions.filter((option) => {
|
|
6248
|
+
return option.toLowerCase().includes(query.toLowerCase());
|
|
6249
|
+
})
|
|
6250
|
+
: this._filteredSuggestions;
|
|
6251
|
+
this._isOpen = this._filteredSuggestions && this._filteredSuggestions.length > 0 ? true : false;
|
|
6229
6252
|
}
|
|
6230
6253
|
}
|
|
6231
6254
|
moveFocus(delta) {
|
|
@@ -6260,7 +6283,7 @@ class KolCombobox {
|
|
|
6260
6283
|
render() {
|
|
6261
6284
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
6262
6285
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
6263
|
-
return (hAsync(Host, { key: '
|
|
6286
|
+
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) &&
|
|
6264
6287
|
this._filteredSuggestions.length > 0 &&
|
|
6265
6288
|
this._filteredSuggestions.map((option, index) => (hAsync("li", { id: `option-${index}`, key: `-${index}`, ref: (el) => {
|
|
6266
6289
|
if (el)
|
|
@@ -6555,7 +6578,7 @@ class KolCombobox {
|
|
|
6555
6578
|
"_msg": [16],
|
|
6556
6579
|
"_name": [1],
|
|
6557
6580
|
"_on": [16],
|
|
6558
|
-
"_suggestions": [
|
|
6581
|
+
"_suggestions": [1],
|
|
6559
6582
|
"_required": [4],
|
|
6560
6583
|
"_syncValueBySelector": [1, "_sync-value-by-selector"],
|
|
6561
6584
|
"_tabIndex": [2, "_tab-index"],
|
|
@@ -6641,8 +6664,8 @@ class DetailsAnimationController {
|
|
|
6641
6664
|
}
|
|
6642
6665
|
}
|
|
6643
6666
|
|
|
6644
|
-
const defaultStyleCss$
|
|
6645
|
-
var KolDetailsDefaultStyle0 = defaultStyleCss$
|
|
6667
|
+
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}";
|
|
6668
|
+
var KolDetailsDefaultStyle0 = defaultStyleCss$E;
|
|
6646
6669
|
|
|
6647
6670
|
class KolDetails {
|
|
6648
6671
|
constructor(hostRef) {
|
|
@@ -6689,10 +6712,10 @@ class KolDetails {
|
|
|
6689
6712
|
(_a = this.summaryElement) === null || _a === void 0 ? void 0 : _a.focus();
|
|
6690
6713
|
}
|
|
6691
6714
|
render() {
|
|
6692
|
-
return (hAsync(Host, { key: '
|
|
6715
|
+
return (hAsync(Host, { key: '2acc7482e04c1586f0eaa18394d4f0b6319d5eca', class: "kol-details" }, hAsync("details", { key: 'f81c39a0976ff683933b79267b3cc8ab5f9c79e1', ref: this.catchDetails, class: {
|
|
6693
6716
|
disabled: this.state._disabled === true,
|
|
6694
6717
|
open: this.state._open === true,
|
|
6695
|
-
}, onToggle: this.handleToggle }, hAsync("summary", { key: '
|
|
6718
|
+
}, 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' }))))));
|
|
6696
6719
|
}
|
|
6697
6720
|
validateDisabled(value) {
|
|
6698
6721
|
validateDisabled(this, value);
|
|
@@ -6752,8 +6775,8 @@ class KolDetails {
|
|
|
6752
6775
|
}; }
|
|
6753
6776
|
}
|
|
6754
6777
|
|
|
6755
|
-
const defaultStyleCss$
|
|
6756
|
-
var KolDrawerDefaultStyle0 = defaultStyleCss$
|
|
6778
|
+
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}";
|
|
6779
|
+
var KolDrawerDefaultStyle0 = defaultStyleCss$D;
|
|
6757
6780
|
|
|
6758
6781
|
class KolDrawer {
|
|
6759
6782
|
constructor(hostRef) {
|
|
@@ -6797,7 +6820,7 @@ class KolDrawer {
|
|
|
6797
6820
|
}
|
|
6798
6821
|
render() {
|
|
6799
6822
|
const isModal = this.state._modal;
|
|
6800
|
-
return (hAsync(Host, { key: '
|
|
6823
|
+
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())));
|
|
6801
6824
|
}
|
|
6802
6825
|
validateLabel(value) {
|
|
6803
6826
|
validateLabel(this, value, {
|
|
@@ -6884,8 +6907,8 @@ class KolDrawer {
|
|
|
6884
6907
|
}; }
|
|
6885
6908
|
}
|
|
6886
6909
|
|
|
6887
|
-
const defaultStyleCss$
|
|
6888
|
-
var KolFormDefaultStyle0 = defaultStyleCss$
|
|
6910
|
+
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}";
|
|
6911
|
+
var KolFormDefaultStyle0 = defaultStyleCss$C;
|
|
6889
6912
|
|
|
6890
6913
|
class KolForm {
|
|
6891
6914
|
constructor(hostRef) {
|
|
@@ -6924,10 +6947,10 @@ class KolForm {
|
|
|
6924
6947
|
this.state = {};
|
|
6925
6948
|
}
|
|
6926
6949
|
render() {
|
|
6927
|
-
return (hAsync(Host, { key: '
|
|
6950
|
+
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) => {
|
|
6928
6951
|
if (index === 0)
|
|
6929
6952
|
this.errorListElement = el;
|
|
6930
|
-
} })))))))), hAsync("form", { key: '
|
|
6953
|
+
} })))))))), 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' }))));
|
|
6931
6954
|
}
|
|
6932
6955
|
async focusErrorList() {
|
|
6933
6956
|
setTimeout(() => {
|
|
@@ -6983,8 +7006,8 @@ class KolForm {
|
|
|
6983
7006
|
}; }
|
|
6984
7007
|
}
|
|
6985
7008
|
|
|
6986
|
-
const defaultStyleCss$
|
|
6987
|
-
var KolHeadingDefaultStyle0 = defaultStyleCss$
|
|
7009
|
+
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}";
|
|
7010
|
+
var KolHeadingDefaultStyle0 = defaultStyleCss$B;
|
|
6988
7011
|
|
|
6989
7012
|
class KolHeading {
|
|
6990
7013
|
constructor(hostRef) {
|
|
@@ -6995,7 +7018,7 @@ class KolHeading {
|
|
|
6995
7018
|
this._variant = undefined;
|
|
6996
7019
|
}
|
|
6997
7020
|
render() {
|
|
6998
|
-
return (hAsync(KolHeadingWcTag, { key: '
|
|
7021
|
+
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" })));
|
|
6999
7022
|
}
|
|
7000
7023
|
static get style() { return {
|
|
7001
7024
|
default: KolHeadingDefaultStyle0
|
|
@@ -7073,7 +7096,7 @@ class KolHeadingWc {
|
|
|
7073
7096
|
this.validateVariant(this._variant);
|
|
7074
7097
|
}
|
|
7075
7098
|
render() {
|
|
7076
|
-
return (hAsync(Host, { key: '
|
|
7099
|
+
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))));
|
|
7077
7100
|
}
|
|
7078
7101
|
static get watchers() { return {
|
|
7079
7102
|
"_label": ["validateLabel"],
|
|
@@ -7097,8 +7120,8 @@ class KolHeadingWc {
|
|
|
7097
7120
|
}; }
|
|
7098
7121
|
}
|
|
7099
7122
|
|
|
7100
|
-
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}";
|
|
7101
|
-
var KolIconDefaultStyle0 = defaultStyleCss$
|
|
7123
|
+
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}";
|
|
7124
|
+
var KolIconDefaultStyle0 = defaultStyleCss$A;
|
|
7102
7125
|
|
|
7103
7126
|
class KolIcon {
|
|
7104
7127
|
constructor(hostRef) {
|
|
@@ -7112,7 +7135,7 @@ class KolIcon {
|
|
|
7112
7135
|
}
|
|
7113
7136
|
render() {
|
|
7114
7137
|
const ariaShow = this.state._label.length > 0;
|
|
7115
|
-
return (hAsync(Host, { key: '
|
|
7138
|
+
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" })));
|
|
7116
7139
|
}
|
|
7117
7140
|
validateIcons(value) {
|
|
7118
7141
|
watchString(this, '_icons', value, {
|
|
@@ -7149,8 +7172,8 @@ class KolIcon {
|
|
|
7149
7172
|
}; }
|
|
7150
7173
|
}
|
|
7151
7174
|
|
|
7152
|
-
const defaultStyleCss$
|
|
7153
|
-
var KolImageDefaultStyle0 = defaultStyleCss$
|
|
7175
|
+
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}";
|
|
7176
|
+
var KolImageDefaultStyle0 = defaultStyleCss$z;
|
|
7154
7177
|
|
|
7155
7178
|
class KolImage {
|
|
7156
7179
|
constructor(hostRef) {
|
|
@@ -7193,7 +7216,7 @@ class KolImage {
|
|
|
7193
7216
|
this.validateSrcset(this._srcset);
|
|
7194
7217
|
}
|
|
7195
7218
|
render() {
|
|
7196
|
-
return (hAsync(Host, { key: '
|
|
7219
|
+
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 })));
|
|
7197
7220
|
}
|
|
7198
7221
|
static get watchers() { return {
|
|
7199
7222
|
"_alt": ["validateAlt"],
|
|
@@ -7222,15 +7245,15 @@ class KolImage {
|
|
|
7222
7245
|
}; }
|
|
7223
7246
|
}
|
|
7224
7247
|
|
|
7225
|
-
const defaultStyleCss$
|
|
7226
|
-
var KolIndentedTextDefaultStyle0 = defaultStyleCss$
|
|
7248
|
+
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}";
|
|
7249
|
+
var KolIndentedTextDefaultStyle0 = defaultStyleCss$y;
|
|
7227
7250
|
|
|
7228
7251
|
class KolIndentedText {
|
|
7229
7252
|
constructor(hostRef) {
|
|
7230
7253
|
registerInstance(this, hostRef);
|
|
7231
7254
|
}
|
|
7232
7255
|
render() {
|
|
7233
|
-
return (hAsync(Host, { key: '
|
|
7256
|
+
return (hAsync(Host, { key: '9b496304e5e30ad3df9ea7f7b948a26abf246e06', class: "kol-indented-text" }, hAsync(KolIndentedTextWcTag, { key: '9952d49cbac923332d7cfd16e58697ef64f38f89' }, hAsync("slot", { key: 'baf3eb43467b6b9dc861c6943785d9966772b5ef' }))));
|
|
7234
7257
|
}
|
|
7235
7258
|
static get style() { return {
|
|
7236
7259
|
default: KolIndentedTextDefaultStyle0
|
|
@@ -7251,7 +7274,7 @@ class KolIndentedTextWc {
|
|
|
7251
7274
|
this.state = {};
|
|
7252
7275
|
}
|
|
7253
7276
|
render() {
|
|
7254
|
-
return (hAsync(Host, { key: '
|
|
7277
|
+
return (hAsync(Host, { key: '64921f12c416fdba4dec29db15cca84fc8277ae4', class: "kol-indented-text-wc" }, hAsync("div", { key: '6f201cf35b3d217e079087e306ae1679dc17ec75' }, hAsync("slot", { key: 'ad4a24a8f8755694b514ac378cee2ecb90ee2722' }))));
|
|
7255
7278
|
}
|
|
7256
7279
|
static get cmpMeta() { return {
|
|
7257
7280
|
"$flags$": 4,
|
|
@@ -7387,8 +7410,8 @@ class InputCheckboxController extends InputCheckboxRadioController {
|
|
|
7387
7410
|
}
|
|
7388
7411
|
}
|
|
7389
7412
|
|
|
7390
|
-
const defaultStyleCss$
|
|
7391
|
-
var KolInputCheckboxDefaultStyle0 = defaultStyleCss$
|
|
7413
|
+
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}";
|
|
7414
|
+
var KolInputCheckboxDefaultStyle0 = defaultStyleCss$x;
|
|
7392
7415
|
|
|
7393
7416
|
class KolInputCheckbox {
|
|
7394
7417
|
getModelValue() {
|
|
@@ -7407,13 +7430,13 @@ class KolInputCheckbox {
|
|
|
7407
7430
|
render() {
|
|
7408
7431
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
7409
7432
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
7410
|
-
return (hAsync(Host, { key: '
|
|
7433
|
+
return (hAsync(Host, { key: '20f63d4b1e1ce9c8ccc96acffbec53914f0f623c', class: "kol-input-checkbox" }, hAsync(KolInputWcTag, { key: 'e7e02f3f1aaafc66b2e7aadb48c9b2860b8bdce6', class: {
|
|
7411
7434
|
checkbox: true,
|
|
7412
7435
|
[this.state._variant]: true,
|
|
7413
7436
|
'hide-label': !!this.state._hideLabel,
|
|
7414
7437
|
checked: this.state._checked,
|
|
7415
7438
|
indeterminate: this.state._indeterminate,
|
|
7416
|
-
}, "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: '
|
|
7439
|
+
}, "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 }))))));
|
|
7417
7440
|
}
|
|
7418
7441
|
constructor(hostRef) {
|
|
7419
7442
|
registerInstance(this, hostRef);
|
|
@@ -7632,8 +7655,8 @@ class InputColorController extends InputIconController {
|
|
|
7632
7655
|
}
|
|
7633
7656
|
}
|
|
7634
7657
|
|
|
7635
|
-
const defaultStyleCss$
|
|
7636
|
-
var KolInputColorDefaultStyle0 = defaultStyleCss$
|
|
7658
|
+
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}";
|
|
7659
|
+
var KolInputColorDefaultStyle0 = defaultStyleCss$w;
|
|
7637
7660
|
|
|
7638
7661
|
class KolInputColor {
|
|
7639
7662
|
async getValue() {
|
|
@@ -7651,10 +7674,10 @@ class KolInputColor {
|
|
|
7651
7674
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
7652
7675
|
const hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
|
|
7653
7676
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
7654
|
-
return (hAsync(Host, { key: '
|
|
7677
|
+
return (hAsync(Host, { key: 'f2f019fd529bbd1c04cbe4dba57e976425baccb2', class: "kol-input-color" }, hAsync(KolInputWcTag, { key: '17731b0a4294ff7e12572f85473b516cfb19ac03', class: {
|
|
7655
7678
|
color: true,
|
|
7656
7679
|
'hide-label': !!this.state._hideLabel,
|
|
7657
|
-
}, _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: '
|
|
7680
|
+
}, _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))))));
|
|
7658
7681
|
}
|
|
7659
7682
|
constructor(hostRef) {
|
|
7660
7683
|
registerInstance(this, hostRef);
|
|
@@ -7952,8 +7975,8 @@ InputDateController.isoTimeRegex = /^[0-2]\d:[0-5]\d(:[0-5]\d(?:\.\d+)?)?/;
|
|
|
7952
7975
|
InputDateController.isoWeekRegex = /^\d{4}-W(?:[0-4]\d|5[0-3])$/;
|
|
7953
7976
|
InputDateController.DEFAULT_MAX_DATE = new Date(9999, 11, 31, 23, 59, 59);
|
|
7954
7977
|
|
|
7955
|
-
const defaultStyleCss$
|
|
7956
|
-
var KolInputDateDefaultStyle0 = defaultStyleCss$
|
|
7978
|
+
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}";
|
|
7979
|
+
var KolInputDateDefaultStyle0 = defaultStyleCss$v;
|
|
7957
7980
|
|
|
7958
7981
|
class KolInputDate {
|
|
7959
7982
|
async getValue() {
|
|
@@ -7967,14 +7990,21 @@ class KolInputDate {
|
|
|
7967
7990
|
var _a;
|
|
7968
7991
|
(_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus();
|
|
7969
7992
|
}
|
|
7993
|
+
async reset() {
|
|
7994
|
+
this.state = Object.assign(Object.assign({}, this.state), { _value: null });
|
|
7995
|
+
this.controller.setFormAssociatedValue('');
|
|
7996
|
+
if (this.inputRef) {
|
|
7997
|
+
this.inputRef.value = '';
|
|
7998
|
+
}
|
|
7999
|
+
}
|
|
7970
8000
|
render() {
|
|
7971
8001
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
7972
8002
|
const hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
|
|
7973
8003
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
7974
|
-
return (hAsync(Host, { key: '
|
|
8004
|
+
return (hAsync(Host, { key: '702d112074b21ebebe3d0bfd1c72b84072b5699c', class: { 'kol-input-date': true, 'has-value': this.state._hasValue } }, hAsync(KolInputWcTag, { key: '80a45b6fd612ff657a8b81a6ca6feb68584a9a67', class: {
|
|
7975
8005
|
[this.state._type]: true,
|
|
7976
8006
|
'hide-label': !!this.state._hideLabel,
|
|
7977
|
-
}, _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: '
|
|
8007
|
+
}, _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 }))))));
|
|
7978
8008
|
}
|
|
7979
8009
|
constructor(hostRef) {
|
|
7980
8010
|
registerInstance(this, hostRef);
|
|
@@ -8181,7 +8211,8 @@ class KolInputDate {
|
|
|
8181
8211
|
"state": [32],
|
|
8182
8212
|
"getValue": [64],
|
|
8183
8213
|
"focus": [64],
|
|
8184
|
-
"kolFocus": [64]
|
|
8214
|
+
"kolFocus": [64],
|
|
8215
|
+
"reset": [64]
|
|
8185
8216
|
},
|
|
8186
8217
|
"$listeners$": undefined,
|
|
8187
8218
|
"$lazyBundleId$": "-",
|
|
@@ -8289,8 +8320,8 @@ class InputEmailController extends InputTextEmailController {
|
|
|
8289
8320
|
}
|
|
8290
8321
|
}
|
|
8291
8322
|
|
|
8292
|
-
const defaultStyleCss$
|
|
8293
|
-
var KolInputEmailDefaultStyle0 = defaultStyleCss$
|
|
8323
|
+
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}";
|
|
8324
|
+
var KolInputEmailDefaultStyle0 = defaultStyleCss$u;
|
|
8294
8325
|
|
|
8295
8326
|
class KolInputEmail {
|
|
8296
8327
|
async getValue() {
|
|
@@ -8308,10 +8339,10 @@ class KolInputEmail {
|
|
|
8308
8339
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
8309
8340
|
const hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
|
|
8310
8341
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
8311
|
-
return (hAsync(Host, { key: '
|
|
8342
|
+
return (hAsync(Host, { key: '9805e2271b7c500f82bf4139a0e79ad31250abd5', class: {
|
|
8312
8343
|
'kol-input-email': true,
|
|
8313
8344
|
'has-value': this.state._hasValue,
|
|
8314
|
-
} }, hAsync(KolInputWcTag, { key: '
|
|
8345
|
+
} }, 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 }))))));
|
|
8315
8346
|
}
|
|
8316
8347
|
constructor(hostRef) {
|
|
8317
8348
|
registerInstance(this, hostRef);
|
|
@@ -8560,8 +8591,8 @@ class InputFileController extends InputIconController {
|
|
|
8560
8591
|
}
|
|
8561
8592
|
}
|
|
8562
8593
|
|
|
8563
|
-
const defaultStyleCss$
|
|
8564
|
-
var KolInputFileDefaultStyle0 = defaultStyleCss$
|
|
8594
|
+
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}";
|
|
8595
|
+
var KolInputFileDefaultStyle0 = defaultStyleCss$t;
|
|
8565
8596
|
|
|
8566
8597
|
class KolInputFile {
|
|
8567
8598
|
async getValue() {
|
|
@@ -8578,10 +8609,10 @@ class KolInputFile {
|
|
|
8578
8609
|
render() {
|
|
8579
8610
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
8580
8611
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
8581
|
-
return (hAsync(Host, { key: '
|
|
8612
|
+
return (hAsync(Host, { key: 'efceaa84a757cd53737d20b7220f61736e15aad3', class: "kol-input-file" }, hAsync(KolInputWcTag, { key: '12f42cbaa35e9c8520f0b0f6e66d791e287c0563', class: {
|
|
8582
8613
|
file: true,
|
|
8583
8614
|
'hide-label': !!this.state._hideLabel,
|
|
8584
|
-
}, _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: '
|
|
8615
|
+
}, _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 }))))));
|
|
8585
8616
|
}
|
|
8586
8617
|
constructor(hostRef) {
|
|
8587
8618
|
registerInstance(this, hostRef);
|
|
@@ -8844,8 +8875,8 @@ class InputNumberController extends InputIconController {
|
|
|
8844
8875
|
}
|
|
8845
8876
|
}
|
|
8846
8877
|
|
|
8847
|
-
const defaultStyleCss$
|
|
8848
|
-
var KolInputNumberDefaultStyle0 = defaultStyleCss$
|
|
8878
|
+
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}";
|
|
8879
|
+
var KolInputNumberDefaultStyle0 = defaultStyleCss$s;
|
|
8849
8880
|
|
|
8850
8881
|
class KolInputNumber {
|
|
8851
8882
|
async getValue() {
|
|
@@ -8863,13 +8894,13 @@ class KolInputNumber {
|
|
|
8863
8894
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
8864
8895
|
const hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
|
|
8865
8896
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
8866
|
-
return (hAsync(Host, { key: '
|
|
8897
|
+
return (hAsync(Host, { key: '81000a7bf494e4abd5281aeac94e738eb637ccd6', class: {
|
|
8867
8898
|
'kol-input-number': true,
|
|
8868
8899
|
'has-value': this.state._hasValue,
|
|
8869
|
-
} }, hAsync(KolInputWcTag, { key: '
|
|
8900
|
+
} }, hAsync(KolInputWcTag, { key: '11abee4d50763dd2fa4173ca2fe8bef11804dba5', class: {
|
|
8870
8901
|
number: true,
|
|
8871
8902
|
'hide-label': !!this.state._hideLabel,
|
|
8872
|
-
}, _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: '
|
|
8903
|
+
}, _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 }))))));
|
|
8873
8904
|
}
|
|
8874
8905
|
constructor(hostRef) {
|
|
8875
8906
|
registerInstance(this, hostRef);
|
|
@@ -9084,8 +9115,8 @@ class KolInputNumber {
|
|
|
9084
9115
|
}; }
|
|
9085
9116
|
}
|
|
9086
9117
|
|
|
9087
|
-
const defaultStyleCss$
|
|
9088
|
-
var KolInputPasswordDefaultStyle0 = defaultStyleCss$
|
|
9118
|
+
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}";
|
|
9119
|
+
var KolInputPasswordDefaultStyle0 = defaultStyleCss$r;
|
|
9089
9120
|
|
|
9090
9121
|
class KolInputPassword {
|
|
9091
9122
|
async getValue() {
|
|
@@ -9103,13 +9134,13 @@ class KolInputPassword {
|
|
|
9103
9134
|
var _a;
|
|
9104
9135
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
9105
9136
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
9106
|
-
return (hAsync(Host, { key: '
|
|
9137
|
+
return (hAsync(Host, { key: '20558e28f4159cd21468a4065c4a4030ae716fcb', class: {
|
|
9107
9138
|
'kol-input-password': true,
|
|
9108
9139
|
'has-value': this.state._hasValue,
|
|
9109
|
-
} }, hAsync(KolInputWcTag, { key: '
|
|
9140
|
+
} }, hAsync(KolInputWcTag, { key: '80c0a71ec8d29bbcfb41f7a4c75f8e9c14dd84a2', class: {
|
|
9110
9141
|
'hide-label': !!this.state._hideLabel,
|
|
9111
9142
|
password: true,
|
|
9112
|
-
}, _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: '
|
|
9143
|
+
}, _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: {
|
|
9113
9144
|
onClick: () => {
|
|
9114
9145
|
this._passwordVisible = !this._passwordVisible;
|
|
9115
9146
|
},
|
|
@@ -9339,8 +9370,8 @@ const FormFieldMsg = ({ _alert, _msg, _hideError, _id }) => (hAsync(KolAlertWcTa
|
|
|
9339
9370
|
'visually-hidden': _hideError === true,
|
|
9340
9371
|
} }, _msg), (_msg === null || _msg === void 0 ? void 0 : _msg._description) || undefined));
|
|
9341
9372
|
|
|
9342
|
-
const defaultStyleCss$
|
|
9343
|
-
var KolInputRadioDefaultStyle0 = defaultStyleCss$
|
|
9373
|
+
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}";
|
|
9374
|
+
var KolInputRadioDefaultStyle0 = defaultStyleCss$q;
|
|
9344
9375
|
|
|
9345
9376
|
class KolInputRadio {
|
|
9346
9377
|
async getValue() {
|
|
@@ -9356,27 +9387,28 @@ class KolInputRadio {
|
|
|
9356
9387
|
render() {
|
|
9357
9388
|
const { ariaDescribedBy, hasError } = getRenderStates(this.state);
|
|
9358
9389
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
9359
|
-
|
|
9390
|
+
const hasHint = typeof this._hint === 'string' && this._hint.length > 0;
|
|
9391
|
+
return (hAsync(Host, { key: '8d94c2bfd3910da2f843f83fbbc6a0a8ba99a9e1', class: "kol-input-radio" }, hAsync("fieldset", { key: '60af273b8ba191f863533eb0827dccea6a575068', class: {
|
|
9360
9392
|
fieldset: true,
|
|
9361
9393
|
disabled: this.state._disabled === true,
|
|
9362
9394
|
error: hasError === true,
|
|
9363
9395
|
required: this.state._required === true,
|
|
9364
9396
|
'hidden-error': this._hideError === true,
|
|
9365
9397
|
[this.state._orientation]: true,
|
|
9366
|
-
} }, hAsync("legend", { key: '
|
|
9398
|
+
} }, 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) => {
|
|
9367
9399
|
const customId = `${this.state._id}-${index}`;
|
|
9368
9400
|
const slotName = `radio-${index}`;
|
|
9369
9401
|
const selected = this.state._value === option.value;
|
|
9370
9402
|
return (hAsync(KolInputWcTag, { class: {
|
|
9371
9403
|
radio: true,
|
|
9372
9404
|
disabled: Boolean(this.state._disabled || option.disabled),
|
|
9373
|
-
}, key: customId, _accessKey: this.state._accessKey, _disabled: this.state._disabled || option.disabled, _hideLabel: this.state._hideLabel, _hint:
|
|
9405
|
+
}, 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: {
|
|
9374
9406
|
height: this.state._hideLabel ? '0' : undefined,
|
|
9375
9407
|
margin: this.state._hideLabel ? '0' : undefined,
|
|
9376
9408
|
padding: this.state._hideLabel ? '0' : undefined,
|
|
9377
9409
|
visibility: this.state._hideLabel ? 'hidden' : undefined,
|
|
9378
9410
|
} }, hAsync("span", null, hAsync("span", { class: "radio-label-span-inner" }, option.label))))));
|
|
9379
|
-
}), hasError && hAsync(FormFieldMsg, { key: '
|
|
9411
|
+
}), 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))));
|
|
9380
9412
|
}
|
|
9381
9413
|
constructor(hostRef) {
|
|
9382
9414
|
registerInstance(this, hostRef);
|
|
@@ -9609,8 +9641,8 @@ class InputRangeController extends InputIconController {
|
|
|
9609
9641
|
}
|
|
9610
9642
|
}
|
|
9611
9643
|
|
|
9612
|
-
const defaultStyleCss$
|
|
9613
|
-
var KolInputRangeDefaultStyle0 = defaultStyleCss$
|
|
9644
|
+
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}";
|
|
9645
|
+
var KolInputRangeDefaultStyle0 = defaultStyleCss$p;
|
|
9614
9646
|
|
|
9615
9647
|
class KolInputRange {
|
|
9616
9648
|
async focus() {
|
|
@@ -9646,13 +9678,13 @@ class KolInputRange {
|
|
|
9646
9678
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
9647
9679
|
const hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
|
|
9648
9680
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
9649
|
-
return (hAsync(Host, { key: '
|
|
9681
|
+
return (hAsync(Host, { key: '28889eca78824731dd9ab19d00dea0827a5afcea', class: "kol-input-range" }, hAsync(KolInputWcTag, { key: '3b719c8e9c17e2a2599a985eea5ddda2bb65cd9c', class: {
|
|
9650
9682
|
range: true,
|
|
9651
9683
|
'hide-label': !!this.state._hideLabel,
|
|
9652
|
-
}, _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: '
|
|
9684
|
+
}, _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: {
|
|
9653
9685
|
'--kolibri-input-range--input-number--width': `${this.state._max}`.length + 0.5 + 'em',
|
|
9654
|
-
} }, hAsync("input", Object.assign({ key: '
|
|
9655
|
-
hAsync("datalist", { key: '
|
|
9686
|
+
} }, 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 && [
|
|
9687
|
+
hAsync("datalist", { key: 'bb323dab931690da57ce688ba59c1016ec5e9df3', id: `${this.state._id}-list` }, this.state._suggestions.map((option) => (hAsync("option", { value: option })))),
|
|
9656
9688
|
]))));
|
|
9657
9689
|
}
|
|
9658
9690
|
constructor(hostRef) {
|
|
@@ -9857,8 +9889,8 @@ class KolInputRange {
|
|
|
9857
9889
|
}; }
|
|
9858
9890
|
}
|
|
9859
9891
|
|
|
9860
|
-
const defaultStyleCss$
|
|
9861
|
-
var KolInputTextDefaultStyle0 = defaultStyleCss$
|
|
9892
|
+
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}";
|
|
9893
|
+
var KolInputTextDefaultStyle0 = defaultStyleCss$o;
|
|
9862
9894
|
|
|
9863
9895
|
class KolInputText {
|
|
9864
9896
|
async getValue() {
|
|
@@ -9876,13 +9908,13 @@ class KolInputText {
|
|
|
9876
9908
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
9877
9909
|
const hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
|
|
9878
9910
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
9879
|
-
return (hAsync(Host, { key: '
|
|
9911
|
+
return (hAsync(Host, { key: '81f68808536bc1b058df7c8f3f45885330654323', class: {
|
|
9880
9912
|
'has-value': this.state._hasValue,
|
|
9881
9913
|
'kol-input-text': true,
|
|
9882
|
-
} }, hAsync(KolInputWcTag, { key: '
|
|
9914
|
+
} }, hAsync(KolInputWcTag, { key: '3fbe1c4558e8c9181df57b9b6fa3c98265c57441', class: {
|
|
9883
9915
|
[this.state._type]: true,
|
|
9884
9916
|
'hide-label': !!this.state._hideLabel,
|
|
9885
|
-
}, _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: '
|
|
9917
|
+
}, _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 }))))));
|
|
9886
9918
|
}
|
|
9887
9919
|
constructor(hostRef) {
|
|
9888
9920
|
registerInstance(this, hostRef);
|
|
@@ -10157,18 +10189,18 @@ class KolInputWc {
|
|
|
10157
10189
|
const hasExpertSlot = showExpertSlot(this._label);
|
|
10158
10190
|
const hasHint = typeof this._hint === 'string' && this._hint.length > 0;
|
|
10159
10191
|
const useTooltopInsteadOfLabel = !hasExpertSlot && this._hideLabel;
|
|
10160
|
-
return (hAsync(Host, { key: '
|
|
10192
|
+
return (hAsync(Host, { key: 'cb5a010dca6149a054367c7244be69a4e9facb6b', class: clsx('kol-input', this.getModifierClassNameByMsgType(), {
|
|
10161
10193
|
disabled: this._disabled === true,
|
|
10162
10194
|
error: hasError === true,
|
|
10163
10195
|
'read-only': this._readOnly === true,
|
|
10164
10196
|
required: this._required === true,
|
|
10165
10197
|
touched: this._touched === true,
|
|
10166
10198
|
'hidden-error': this._hideError === true,
|
|
10167
|
-
}) }, hAsync("label", { key: '
|
|
10199
|
+
}) }, 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: {
|
|
10168
10200
|
input: true,
|
|
10169
10201
|
'icon-left': typeof ((_e = this._icons) === null || _e === void 0 ? void 0 : _e.left) === 'object',
|
|
10170
10202
|
'icon-right': typeof ((_f = this._icons) === null || _f === void 0 ? void 0 : _f.right) === 'object',
|
|
10171
|
-
} }, ((_g = this._icons) === null || _g === void 0 ? void 0 : _g.left) && (hAsync(KolIconTag, { key: '
|
|
10203
|
+
} }, ((_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'))))));
|
|
10172
10204
|
}
|
|
10173
10205
|
getModifierClassNameByMsgType() {
|
|
10174
10206
|
var _a, _b;
|
|
@@ -10215,8 +10247,8 @@ class KolInputWc {
|
|
|
10215
10247
|
}; }
|
|
10216
10248
|
}
|
|
10217
10249
|
|
|
10218
|
-
const defaultStyleCss$
|
|
10219
|
-
var KolKolibriDefaultStyle0 = defaultStyleCss$
|
|
10250
|
+
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}";
|
|
10251
|
+
var KolKolibriDefaultStyle0 = defaultStyleCss$n;
|
|
10220
10252
|
|
|
10221
10253
|
class KolKolibri {
|
|
10222
10254
|
constructor(hostRef) {
|
|
@@ -10247,7 +10279,7 @@ class KolKolibri {
|
|
|
10247
10279
|
}
|
|
10248
10280
|
render() {
|
|
10249
10281
|
const fillColor = `rgb(${this.state._color.red},${this.state._color.green},${this.state._color.blue})`;
|
|
10250
|
-
return (hAsync(Host, { key: '
|
|
10282
|
+
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")))));
|
|
10251
10283
|
}
|
|
10252
10284
|
validateColor(value) {
|
|
10253
10285
|
validateColor(this, value, {
|
|
@@ -10287,8 +10319,8 @@ class KolKolibri {
|
|
|
10287
10319
|
}; }
|
|
10288
10320
|
}
|
|
10289
10321
|
|
|
10290
|
-
const defaultStyleCss$
|
|
10291
|
-
var KolLinkDefaultStyle0 = defaultStyleCss$
|
|
10322
|
+
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}";
|
|
10323
|
+
var KolLinkDefaultStyle0 = defaultStyleCss$m;
|
|
10292
10324
|
|
|
10293
10325
|
class KolLink {
|
|
10294
10326
|
constructor(hostRef) {
|
|
@@ -10298,6 +10330,7 @@ class KolLink {
|
|
|
10298
10330
|
};
|
|
10299
10331
|
this._accessKey = undefined;
|
|
10300
10332
|
this._ariaCurrentValue = undefined;
|
|
10333
|
+
this._ariaDescription = undefined;
|
|
10301
10334
|
this._disabled = false;
|
|
10302
10335
|
this._download = undefined;
|
|
10303
10336
|
this._hideLabel = false;
|
|
@@ -10318,7 +10351,7 @@ class KolLink {
|
|
|
10318
10351
|
await ((_a = this.linkWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
|
|
10319
10352
|
}
|
|
10320
10353
|
render() {
|
|
10321
|
-
return (hAsync(Host, { key: '
|
|
10354
|
+
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" }))));
|
|
10322
10355
|
}
|
|
10323
10356
|
static get style() { return {
|
|
10324
10357
|
default: KolLinkDefaultStyle0
|
|
@@ -10329,6 +10362,7 @@ class KolLink {
|
|
|
10329
10362
|
"$members$": {
|
|
10330
10363
|
"_accessKey": [1, "_access-key"],
|
|
10331
10364
|
"_ariaCurrentValue": [1, "_aria-current-value"],
|
|
10365
|
+
"_ariaDescription": [1, "_aria-description"],
|
|
10332
10366
|
"_disabled": [4],
|
|
10333
10367
|
"_download": [1],
|
|
10334
10368
|
"_hideLabel": [4, "_hide-label"],
|
|
@@ -10349,8 +10383,8 @@ class KolLink {
|
|
|
10349
10383
|
}; }
|
|
10350
10384
|
}
|
|
10351
10385
|
|
|
10352
|
-
const defaultStyleCss$
|
|
10353
|
-
var KolLinkButtonDefaultStyle0 = defaultStyleCss$
|
|
10386
|
+
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}";
|
|
10387
|
+
var KolLinkButtonDefaultStyle0 = defaultStyleCss$l;
|
|
10354
10388
|
|
|
10355
10389
|
class KolLinkButton {
|
|
10356
10390
|
constructor(hostRef) {
|
|
@@ -10360,6 +10394,7 @@ class KolLinkButton {
|
|
|
10360
10394
|
};
|
|
10361
10395
|
this._accessKey = undefined;
|
|
10362
10396
|
this._ariaCurrentValue = undefined;
|
|
10397
|
+
this._ariaDescription = undefined;
|
|
10363
10398
|
this._customClass = undefined;
|
|
10364
10399
|
this._disabled = false;
|
|
10365
10400
|
this._download = undefined;
|
|
@@ -10382,11 +10417,11 @@ class KolLinkButton {
|
|
|
10382
10417
|
await ((_a = this.linkWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
|
|
10383
10418
|
}
|
|
10384
10419
|
render() {
|
|
10385
|
-
return (hAsync(Host, { key: '
|
|
10420
|
+
return (hAsync(Host, { key: 'aaa71aa908dc2f9b2333ef32a980b19db8901aa1', class: "kol-link-button" }, hAsync(KolLinkWcTag, { key: '98bb9faeac2a860088009e7bf1906b3efc723db6', ref: this.catchRef, class: {
|
|
10386
10421
|
button: true,
|
|
10387
10422
|
[this._variant]: this._variant !== 'custom',
|
|
10388
10423
|
[this._customClass]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,
|
|
10389
|
-
}, _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: '
|
|
10424
|
+
}, _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" }))));
|
|
10390
10425
|
}
|
|
10391
10426
|
static get style() { return {
|
|
10392
10427
|
default: KolLinkButtonDefaultStyle0
|
|
@@ -10397,6 +10432,7 @@ class KolLinkButton {
|
|
|
10397
10432
|
"$members$": {
|
|
10398
10433
|
"_accessKey": [1, "_access-key"],
|
|
10399
10434
|
"_ariaCurrentValue": [1, "_aria-current-value"],
|
|
10435
|
+
"_ariaDescription": [1, "_aria-description"],
|
|
10400
10436
|
"_customClass": [1, "_custom-class"],
|
|
10401
10437
|
"_disabled": [4],
|
|
10402
10438
|
"_download": [1],
|
|
@@ -10419,8 +10455,8 @@ class KolLinkButton {
|
|
|
10419
10455
|
}; }
|
|
10420
10456
|
}
|
|
10421
10457
|
|
|
10422
|
-
const defaultStyleCss$
|
|
10423
|
-
var KolLinkGroupDefaultStyle0 = defaultStyleCss$
|
|
10458
|
+
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}";
|
|
10459
|
+
var KolLinkGroupDefaultStyle0 = defaultStyleCss$k;
|
|
10424
10460
|
|
|
10425
10461
|
const ListItem = (props) => {
|
|
10426
10462
|
const list = [];
|
|
@@ -10450,10 +10486,10 @@ class KolLinkGroup {
|
|
|
10450
10486
|
}
|
|
10451
10487
|
render() {
|
|
10452
10488
|
const ListTag = this.isUl ? 'ul' : 'ol';
|
|
10453
|
-
return (hAsync(Host, { key: '
|
|
10489
|
+
return (hAsync(Host, { key: '166b42082d8da56cb526c76d8b0631a3f5ccfd5d', class: "kol-link-group" }, hAsync(ListTag, { key: 'b417e8bc884c5bba727fbc8b62e37dfcdd3eab37', "aria-label": this.state._label, class: {
|
|
10454
10490
|
vertical: this.state._orientation === 'vertical',
|
|
10455
10491
|
horizontal: this.state._orientation === 'horizontal',
|
|
10456
|
-
} }, hAsync(ListItem, { key: '
|
|
10492
|
+
} }, hAsync(ListItem, { key: '9c08949729ef120301d176f6ccbdaca785edfa31', links: this.state._links, orientation: this.state._orientation, listStyleType: this.state._listStyleType }))));
|
|
10457
10493
|
}
|
|
10458
10494
|
validateLabel(value, _oldValue, initial = false) {
|
|
10459
10495
|
if (!initial && this.state._label) {
|
|
@@ -10541,6 +10577,7 @@ const onLocationChange = (callback, eager = true) => {
|
|
|
10541
10577
|
class KolLinkWc {
|
|
10542
10578
|
constructor(hostRef) {
|
|
10543
10579
|
registerInstance(this, hostRef);
|
|
10580
|
+
this.internalDescriptionById = nonce();
|
|
10544
10581
|
this.catchRef = (ref) => {
|
|
10545
10582
|
this.anchorRef = ref;
|
|
10546
10583
|
};
|
|
@@ -10571,6 +10608,7 @@ class KolLinkWc {
|
|
|
10571
10608
|
};
|
|
10572
10609
|
this._accessKey = undefined;
|
|
10573
10610
|
this._ariaCurrentValue = undefined;
|
|
10611
|
+
this._ariaDescription = undefined;
|
|
10574
10612
|
this._ariaExpanded = undefined;
|
|
10575
10613
|
this._ariaOwns = undefined;
|
|
10576
10614
|
this._disabled = false;
|
|
@@ -10595,15 +10633,17 @@ class KolLinkWc {
|
|
|
10595
10633
|
(_a = this.anchorRef) === null || _a === void 0 ? void 0 : _a.focus();
|
|
10596
10634
|
}
|
|
10597
10635
|
render() {
|
|
10636
|
+
var _a, _b;
|
|
10598
10637
|
const { isExternal, tagAttrs } = this.getRenderValues();
|
|
10599
10638
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
10600
|
-
|
|
10639
|
+
const hasAriaDescription = Boolean((_b = (_a = this.state._ariaDescription) === null || _a === void 0 ? void 0 : _a.trim()) === null || _b === void 0 ? void 0 : _b.length);
|
|
10640
|
+
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'
|
|
10601
10641
|
? `${this.state._label}${isExternal ? ` (${translate('kol-open-link-in-tab')})` : ''}`
|
|
10602
10642
|
: undefined, class: {
|
|
10603
10643
|
disabled: this.state._disabled === true,
|
|
10604
10644
|
'external-link': isExternal,
|
|
10605
10645
|
'hide-label': this.state._hideLabel === true,
|
|
10606
|
-
} }, this.state._on, { onClick: this.onClick, onKeyPress: this.onClick, role: this.state._role, tabIndex: this.state._disabled ? -1 : this.state._tabIndex }), hAsync(KolSpanWcTag, { key: '
|
|
10646
|
+
} }, 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))));
|
|
10607
10647
|
}
|
|
10608
10648
|
validateAccessKey(value) {
|
|
10609
10649
|
validateAccessKey(this, value);
|
|
@@ -10611,6 +10651,9 @@ class KolLinkWc {
|
|
|
10611
10651
|
validateAriaCurrentValue(value) {
|
|
10612
10652
|
validateAriaCurrentValue(this, value);
|
|
10613
10653
|
}
|
|
10654
|
+
validateAriaDescription(value) {
|
|
10655
|
+
validateAriaDescription(this, value);
|
|
10656
|
+
}
|
|
10614
10657
|
validateAriaExpanded(value) {
|
|
10615
10658
|
validateAriaExpanded(this, value);
|
|
10616
10659
|
}
|
|
@@ -10655,6 +10698,7 @@ class KolLinkWc {
|
|
|
10655
10698
|
componentWillLoad() {
|
|
10656
10699
|
this.validateAccessKey(this._accessKey);
|
|
10657
10700
|
this.validateAriaCurrentValue(this._ariaCurrentValue);
|
|
10701
|
+
this.validateAriaDescription(this._ariaDescription);
|
|
10658
10702
|
this.validateAriaExpanded(this._ariaExpanded);
|
|
10659
10703
|
this.validateAriaOwns(this._ariaOwns);
|
|
10660
10704
|
this.validateDisabled(this._disabled);
|
|
@@ -10680,6 +10724,7 @@ class KolLinkWc {
|
|
|
10680
10724
|
static get watchers() { return {
|
|
10681
10725
|
"_accessKey": ["validateAccessKey"],
|
|
10682
10726
|
"_ariaCurrentValue": ["validateAriaCurrentValue"],
|
|
10727
|
+
"_ariaDescription": ["validateAriaDescription"],
|
|
10683
10728
|
"_ariaExpanded": ["validateAriaExpanded"],
|
|
10684
10729
|
"_ariaOwns": ["validateAriaOwns"],
|
|
10685
10730
|
"_disabled": ["validateDisabled"],
|
|
@@ -10700,6 +10745,7 @@ class KolLinkWc {
|
|
|
10700
10745
|
"$members$": {
|
|
10701
10746
|
"_accessKey": [1, "_access-key"],
|
|
10702
10747
|
"_ariaCurrentValue": [1, "_aria-current-value"],
|
|
10748
|
+
"_ariaDescription": [1, "_aria-description"],
|
|
10703
10749
|
"_ariaExpanded": [4, "_aria-expanded"],
|
|
10704
10750
|
"_ariaOwns": [1, "_aria-owns"],
|
|
10705
10751
|
"_disabled": [4],
|
|
@@ -10889,8 +10935,8 @@ BUND_LOGO_TEXT_MAP.set(Bundesanstalt['Bundesinstitut für Arzneimittel und Mediz
|
|
|
10889
10935
|
BUND_LOGO_TEXT_MAP.set(Bundesanstalt['Bundesinstitut für Bevölkerungsforschung'], ['Bundesinstitut', 'für Bevölkerungsforschung']);
|
|
10890
10936
|
BUND_LOGO_TEXT_MAP.set(Bundesanstalt['Bundesinstitut für Sportwissenschaft'], ['Bundesinstitut', 'für Sportwissenschaft']);
|
|
10891
10937
|
|
|
10892
|
-
const defaultStyleCss$
|
|
10893
|
-
var KolLogoDefaultStyle0 = defaultStyleCss$
|
|
10938
|
+
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}";
|
|
10939
|
+
var KolLogoDefaultStyle0 = defaultStyleCss$j;
|
|
10894
10940
|
|
|
10895
10941
|
function enumToArray(enumeration, enumAsMap = new Map()) {
|
|
10896
10942
|
Object.entries(enumeration).map(([key, value]) => {
|
|
@@ -10929,7 +10975,7 @@ class KolLogo {
|
|
|
10929
10975
|
}
|
|
10930
10976
|
render() {
|
|
10931
10977
|
var _a;
|
|
10932
|
-
return (hAsync(Host, { key: '
|
|
10978
|
+
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) => {
|
|
10933
10979
|
return (hAsync("tspan", { x: "0", dy: "1.1em", key: `kol-logo-text-${index}` }, text));
|
|
10934
10980
|
}))) : (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."))))))));
|
|
10935
10981
|
}
|
|
@@ -10952,129 +10998,12 @@ class KolLogo {
|
|
|
10952
10998
|
}; }
|
|
10953
10999
|
}
|
|
10954
11000
|
|
|
10955
|
-
|
|
10956
|
-
|
|
10957
|
-
this.lockedElements = new Map();
|
|
10958
|
-
this.modalStack = new Map();
|
|
10959
|
-
}
|
|
10960
|
-
lockElement(htmlElement) {
|
|
10961
|
-
const tabIndex = htmlElement.getAttribute('tabindex');
|
|
10962
|
-
if (htmlElement instanceof HTMLAnchorElement ||
|
|
10963
|
-
htmlElement instanceof HTMLButtonElement ||
|
|
10964
|
-
htmlElement instanceof HTMLInputElement ||
|
|
10965
|
-
htmlElement instanceof HTMLSelectElement ||
|
|
10966
|
-
htmlElement instanceof HTMLTextAreaElement ||
|
|
10967
|
-
typeof tabIndex === 'string' ||
|
|
10968
|
-
htmlElement.dataset.kolModal !== undefined) {
|
|
10969
|
-
if (typeof tabIndex === 'string') {
|
|
10970
|
-
this.lockedElements.set(htmlElement, {
|
|
10971
|
-
tabIndex,
|
|
10972
|
-
});
|
|
10973
|
-
}
|
|
10974
|
-
else {
|
|
10975
|
-
this.lockedElements.set(htmlElement, {});
|
|
10976
|
-
}
|
|
10977
|
-
htmlElement.setAttribute('tabindex', '-1');
|
|
10978
|
-
htmlElement.setAttribute('aria-hidden', 'true');
|
|
10979
|
-
htmlElement.style.userSelect = 'none';
|
|
10980
|
-
}
|
|
10981
|
-
}
|
|
10982
|
-
unlockElement(value, htmlElement) {
|
|
10983
|
-
if (typeof value.tabIndex === 'string') {
|
|
10984
|
-
htmlElement.setAttribute('tabindex', value.tabIndex);
|
|
10985
|
-
}
|
|
10986
|
-
else {
|
|
10987
|
-
htmlElement.removeAttribute('tabindex');
|
|
10988
|
-
}
|
|
10989
|
-
htmlElement.removeAttribute('aria-hidden');
|
|
10990
|
-
htmlElement.style.userSelect = 'unset';
|
|
10991
|
-
this.lockedElements.delete(htmlElement);
|
|
10992
|
-
}
|
|
10993
|
-
unlockLockedElements(lockedElements) {
|
|
10994
|
-
lockedElements.forEach(this.unlockElement.bind(this));
|
|
10995
|
-
}
|
|
10996
|
-
lockFocus(hostElement, excludeElement) {
|
|
10997
|
-
try {
|
|
10998
|
-
if (hostElement !== excludeElement && (hostElement instanceof HTMLElement || hostElement instanceof ShadowRoot)) {
|
|
10999
|
-
if (hostElement instanceof HTMLElement) {
|
|
11000
|
-
this.lockElement(hostElement);
|
|
11001
|
-
this.lockFocus(hostElement.shadowRoot, excludeElement);
|
|
11002
|
-
}
|
|
11003
|
-
for (let i = 0; i < hostElement.children.length; i++) {
|
|
11004
|
-
this.lockFocus(hostElement.children[i], excludeElement);
|
|
11005
|
-
}
|
|
11006
|
-
}
|
|
11007
|
-
}
|
|
11008
|
-
catch (error) {
|
|
11009
|
-
}
|
|
11010
|
-
}
|
|
11011
|
-
renderModalIfExists(activeElement) {
|
|
11012
|
-
if (activeElement instanceof HTMLElement) {
|
|
11013
|
-
if (this.lockedElements.has(activeElement)) {
|
|
11014
|
-
this.unlockElement(this.lockedElements.get(activeElement), activeElement);
|
|
11015
|
-
}
|
|
11016
|
-
const timeout = setTimeout(() => {
|
|
11017
|
-
clearTimeout(timeout);
|
|
11018
|
-
activeElement.focus();
|
|
11019
|
-
}, 500);
|
|
11020
|
-
}
|
|
11021
|
-
this.unlockLockedElements(this.lockedElements);
|
|
11022
|
-
if (this.modalStack.size > 0) {
|
|
11023
|
-
const modalKeys = Array.from(this.modalStack.keys());
|
|
11024
|
-
const modalRef = modalKeys[modalKeys.length - 1];
|
|
11025
|
-
this.modalStack.forEach((_value, htmlElement) => {
|
|
11026
|
-
if (modalRef === htmlElement) {
|
|
11027
|
-
htmlElement.style.display = 'inline';
|
|
11028
|
-
}
|
|
11029
|
-
else {
|
|
11030
|
-
htmlElement.style.display = `none`;
|
|
11031
|
-
}
|
|
11032
|
-
});
|
|
11033
|
-
getDocument().body.style.maxHeight = '100vh';
|
|
11034
|
-
getDocument().body.style.overflow = 'hidden';
|
|
11035
|
-
this.lockFocus(getDocument().body, modalRef);
|
|
11036
|
-
}
|
|
11037
|
-
else {
|
|
11038
|
-
getDocument().body.style.maxHeight = 'unset';
|
|
11039
|
-
getDocument().body.style.overflow = 'unset';
|
|
11040
|
-
}
|
|
11041
|
-
}
|
|
11042
|
-
openModal(modalRef, activeElement) {
|
|
11043
|
-
if (modalRef instanceof HTMLElement === false) {
|
|
11044
|
-
Log.warn(`[KolModalService] The DOM reference of the modal is not valid.`);
|
|
11045
|
-
}
|
|
11046
|
-
else {
|
|
11047
|
-
this.modalStack.set(modalRef, {
|
|
11048
|
-
activeElement,
|
|
11049
|
-
});
|
|
11050
|
-
this.renderModalIfExists();
|
|
11051
|
-
}
|
|
11052
|
-
}
|
|
11053
|
-
closeModal(modalRef) {
|
|
11054
|
-
var _a;
|
|
11055
|
-
if (modalRef instanceof HTMLElement === false) {
|
|
11056
|
-
Log.warn(`[KolModalService] The DOM reference of the modal is not valid.`);
|
|
11057
|
-
}
|
|
11058
|
-
else {
|
|
11059
|
-
const activeElement = (_a = this.modalStack.get(modalRef)) === null || _a === void 0 ? void 0 : _a.activeElement;
|
|
11060
|
-
this.modalStack.delete(modalRef);
|
|
11061
|
-
this.renderModalIfExists(activeElement);
|
|
11062
|
-
}
|
|
11063
|
-
}
|
|
11064
|
-
}
|
|
11065
|
-
|
|
11066
|
-
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}";
|
|
11067
|
-
var KolModalDefaultStyle0 = defaultStyleCss$h;
|
|
11001
|
+
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}";
|
|
11002
|
+
var KolModalDefaultStyle0 = defaultStyleCss$i;
|
|
11068
11003
|
|
|
11069
|
-
const modalService = new ModalService();
|
|
11070
11004
|
class KolModal {
|
|
11071
11005
|
constructor(hostRef) {
|
|
11072
11006
|
registerInstance(this, hostRef);
|
|
11073
|
-
this.onKeyDown = (event) => {
|
|
11074
|
-
if (event && event.code === 'Escape') {
|
|
11075
|
-
this._activeElement = null;
|
|
11076
|
-
}
|
|
11077
|
-
};
|
|
11078
11007
|
this._activeElement = undefined;
|
|
11079
11008
|
this._label = undefined;
|
|
11080
11009
|
this._on = undefined;
|
|
@@ -11086,40 +11015,44 @@ class KolModal {
|
|
|
11086
11015
|
};
|
|
11087
11016
|
}
|
|
11088
11017
|
componentDidRender() {
|
|
11089
|
-
|
|
11090
|
-
|
|
11091
|
-
|
|
11092
|
-
}
|
|
11093
|
-
else {
|
|
11094
|
-
modalService.closeModal(this.hostElement);
|
|
11095
|
-
}
|
|
11018
|
+
var _a;
|
|
11019
|
+
if (this.state._activeElement) {
|
|
11020
|
+
(_a = this.refDialog) === null || _a === void 0 ? void 0 : _a.showModal();
|
|
11096
11021
|
}
|
|
11097
11022
|
}
|
|
11098
11023
|
disconnectedCallback() {
|
|
11099
|
-
|
|
11100
|
-
|
|
11101
|
-
|
|
11024
|
+
void this.closeModal();
|
|
11025
|
+
}
|
|
11026
|
+
handleNativeCloseEvent() {
|
|
11027
|
+
var _a, _b;
|
|
11028
|
+
(_b = (_a = this.state._on) === null || _a === void 0 ? void 0 : _a.onClose) === null || _b === void 0 ? void 0 : _b.call(_a);
|
|
11029
|
+
}
|
|
11030
|
+
async openModal() {
|
|
11031
|
+
var _a;
|
|
11032
|
+
(_a = this.refDialog) === null || _a === void 0 ? void 0 : _a.showModal();
|
|
11033
|
+
}
|
|
11034
|
+
async closeModal() {
|
|
11035
|
+
var _a, _b;
|
|
11036
|
+
this._activeElement = null;
|
|
11037
|
+
(_b = (_a = this.refDialog) === null || _a === void 0 ? void 0 : _a.close) === null || _b === void 0 ? void 0 : _b.call(_a);
|
|
11102
11038
|
}
|
|
11103
11039
|
render() {
|
|
11104
|
-
return (hAsync(
|
|
11105
|
-
this.
|
|
11106
|
-
}
|
|
11040
|
+
return (hAsync("dialog", { key: '5033fc2965dfda66c31938ba52d631f1b9ecc902', class: "kol-modal", ref: (el) => {
|
|
11041
|
+
this.refDialog = el;
|
|
11042
|
+
}, style: {
|
|
11107
11043
|
width: this.state._width,
|
|
11108
|
-
}, "aria-label": this.state._label,
|
|
11109
|
-
if (el) {
|
|
11110
|
-
el.setAttribute('tabindex', '0');
|
|
11111
|
-
setTimeout(() => el.focus(), 250);
|
|
11112
|
-
}
|
|
11113
|
-
} }, hAsync("slot", { key: 'cbd31db78f6c1070fad845022b3efd6f247ead54' }))))));
|
|
11044
|
+
}, "aria-label": this.state._label, onClose: this.handleNativeCloseEvent.bind(this) }, hAsync("div", { key: 'a891311e24e9946af4976e61f5c30de3c9403f5c' }, hAsync("slot", { key: '6f6f37bb1b8a723b0c1dafbc880989c153214fae' }))));
|
|
11114
11045
|
}
|
|
11115
11046
|
validateActiveElement(value) {
|
|
11116
11047
|
watchValidator(this, '_activeElement', (value) => typeof value === 'object' || value === null, new Set(['HTMLElement', 'null']), value, {
|
|
11117
11048
|
defaultValue: null,
|
|
11118
11049
|
hooks: {
|
|
11119
11050
|
afterPatch: () => {
|
|
11120
|
-
|
|
11121
|
-
|
|
11122
|
-
|
|
11051
|
+
if (this.state._activeElement) {
|
|
11052
|
+
void this.openModal();
|
|
11053
|
+
}
|
|
11054
|
+
else {
|
|
11055
|
+
void this.closeModal();
|
|
11123
11056
|
}
|
|
11124
11057
|
},
|
|
11125
11058
|
},
|
|
@@ -11132,7 +11065,6 @@ class KolModal {
|
|
|
11132
11065
|
}
|
|
11133
11066
|
validateOn(value) {
|
|
11134
11067
|
if (typeof value === 'object' && value !== null) {
|
|
11135
|
-
featureHint('[KolTabs] Prüfen, wie man auch einen EventCallback einzeln ändern kann.');
|
|
11136
11068
|
const callbacks = {};
|
|
11137
11069
|
if (typeof value.onClose === 'function' || value.onClose === true) {
|
|
11138
11070
|
callbacks.onClose = value.onClose;
|
|
@@ -11168,7 +11100,9 @@ class KolModal {
|
|
|
11168
11100
|
"_label": [1],
|
|
11169
11101
|
"_on": [16],
|
|
11170
11102
|
"_width": [1],
|
|
11171
|
-
"state": [32]
|
|
11103
|
+
"state": [32],
|
|
11104
|
+
"openModal": [64],
|
|
11105
|
+
"closeModal": [64]
|
|
11172
11106
|
},
|
|
11173
11107
|
"$listeners$": undefined,
|
|
11174
11108
|
"$lazyBundleId$": "-",
|
|
@@ -11176,8 +11110,8 @@ class KolModal {
|
|
|
11176
11110
|
}; }
|
|
11177
11111
|
}
|
|
11178
11112
|
|
|
11179
|
-
const defaultStyleCss$
|
|
11180
|
-
var KolNavDefaultStyle0 = defaultStyleCss$
|
|
11113
|
+
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}";
|
|
11114
|
+
var KolNavDefaultStyle0 = defaultStyleCss$h;
|
|
11181
11115
|
|
|
11182
11116
|
const entryIsLink = (entryProps) => {
|
|
11183
11117
|
return typeof entryProps._href === 'string';
|
|
@@ -11285,11 +11219,11 @@ class KolNav {
|
|
|
11285
11219
|
const collapsible = this.state._collapsible === true;
|
|
11286
11220
|
const hideLabel = this.state._hideLabel === true;
|
|
11287
11221
|
const orientation = this.state._orientation;
|
|
11288
|
-
return (hAsync(Host, { key: '
|
|
11222
|
+
return (hAsync(Host, { key: 'e5df59a6b0f2955c7ffe0a1b8ae05828d089a03a', class: "kol-nav" }, hAsync("div", { key: '5d82a8a378240b280609a81899cb8252983ee0b9', class: {
|
|
11289
11223
|
nav: true,
|
|
11290
11224
|
[orientation]: true,
|
|
11291
11225
|
'is-compact': this.state._hideLabel,
|
|
11292
|
-
} }, hAsync("nav", { key: '
|
|
11226
|
+
} }, 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: {
|
|
11293
11227
|
onClick: () => {
|
|
11294
11228
|
this.state = Object.assign(Object.assign({}, this.state), { _hideLabel: this.state._hideLabel === false });
|
|
11295
11229
|
},
|
|
@@ -11370,8 +11304,8 @@ class KolNav {
|
|
|
11370
11304
|
}; }
|
|
11371
11305
|
}
|
|
11372
11306
|
|
|
11373
|
-
const defaultStyleCss$
|
|
11374
|
-
var KolPaginationDefaultStyle0 = defaultStyleCss$
|
|
11307
|
+
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}";
|
|
11308
|
+
var KolPaginationDefaultStyle0 = defaultStyleCss$g;
|
|
11375
11309
|
|
|
11376
11310
|
const leftDoubleArrowIcon = {
|
|
11377
11311
|
left: 'codicon codicon-debug-reverse-continue',
|
|
@@ -13756,11 +13690,11 @@ class KolPopover {
|
|
|
13756
13690
|
registerInstance(this, hostRef);
|
|
13757
13691
|
this.hidePopoverByEscape = (event) => {
|
|
13758
13692
|
if (event.key === 'Escape')
|
|
13759
|
-
this.hidePopover();
|
|
13693
|
+
this.hidePopover(event);
|
|
13760
13694
|
};
|
|
13761
13695
|
this.hidePopoverByClickOutside = (event) => {
|
|
13762
13696
|
if (this.host && !this.host.contains(event.target)) {
|
|
13763
|
-
this.hidePopover();
|
|
13697
|
+
this.hidePopover(event);
|
|
13764
13698
|
}
|
|
13765
13699
|
};
|
|
13766
13700
|
this.catchHostAndTriggerElement = (element) => {
|
|
@@ -13776,9 +13710,11 @@ class KolPopover {
|
|
|
13776
13710
|
this.arrowElement = element;
|
|
13777
13711
|
};
|
|
13778
13712
|
this._align = 'top';
|
|
13713
|
+
this._on = undefined;
|
|
13779
13714
|
this._show = false;
|
|
13780
13715
|
this.state = {
|
|
13781
13716
|
_align: 'top',
|
|
13717
|
+
_on: {},
|
|
13782
13718
|
_show: false,
|
|
13783
13719
|
_visible: false,
|
|
13784
13720
|
};
|
|
@@ -13795,12 +13731,13 @@ class KolPopover {
|
|
|
13795
13731
|
this.state = Object.assign(Object.assign({}, this.state), { _visible: true });
|
|
13796
13732
|
}
|
|
13797
13733
|
}
|
|
13798
|
-
hidePopover() {
|
|
13799
|
-
var _a;
|
|
13734
|
+
hidePopover(event) {
|
|
13735
|
+
var _a, _b, _c;
|
|
13800
13736
|
this.state = Object.assign(Object.assign({}, this.state), { _visible: false });
|
|
13801
13737
|
this._show = false;
|
|
13802
13738
|
(_a = this.triggerElement) === null || _a === void 0 ? void 0 : _a.focus();
|
|
13803
13739
|
this.removeListenersToBody();
|
|
13740
|
+
(_c = (_b = this.state._on) === null || _b === void 0 ? void 0 : _b.onClose) === null || _c === void 0 ? void 0 : _c.call(_b, event);
|
|
13804
13741
|
}
|
|
13805
13742
|
addListenersToBody() {
|
|
13806
13743
|
var _a;
|
|
@@ -13821,11 +13758,14 @@ class KolPopover {
|
|
|
13821
13758
|
});
|
|
13822
13759
|
}
|
|
13823
13760
|
render() {
|
|
13824
|
-
return (hAsync(Host, { key: '
|
|
13761
|
+
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' }))));
|
|
13825
13762
|
}
|
|
13826
13763
|
validateAlign(value) {
|
|
13827
13764
|
validateAlign(this, value);
|
|
13828
13765
|
}
|
|
13766
|
+
validateOn(value) {
|
|
13767
|
+
validatePopoverCallbacks(this, value);
|
|
13768
|
+
}
|
|
13829
13769
|
validateShow(value) {
|
|
13830
13770
|
validateShow(this, value);
|
|
13831
13771
|
if (value)
|
|
@@ -13837,6 +13777,7 @@ class KolPopover {
|
|
|
13837
13777
|
}
|
|
13838
13778
|
static get watchers() { return {
|
|
13839
13779
|
"_align": ["validateAlign"],
|
|
13780
|
+
"_on": ["validateOn"],
|
|
13840
13781
|
"_show": ["validateShow"]
|
|
13841
13782
|
}; }
|
|
13842
13783
|
static get style() { return KolPopoverWcStyle0; }
|
|
@@ -13845,6 +13786,7 @@ class KolPopover {
|
|
|
13845
13786
|
"$tagName$": "kol-popover-wc",
|
|
13846
13787
|
"$members$": {
|
|
13847
13788
|
"_align": [1],
|
|
13789
|
+
"_on": [16],
|
|
13848
13790
|
"_show": [1540],
|
|
13849
13791
|
"state": [32]
|
|
13850
13792
|
},
|
|
@@ -13854,8 +13796,8 @@ class KolPopover {
|
|
|
13854
13796
|
}; }
|
|
13855
13797
|
}
|
|
13856
13798
|
|
|
13857
|
-
const defaultStyleCss$
|
|
13858
|
-
var KolProgressDefaultStyle0 = defaultStyleCss$
|
|
13799
|
+
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}";
|
|
13800
|
+
var KolProgressDefaultStyle0 = defaultStyleCss$f;
|
|
13859
13801
|
|
|
13860
13802
|
const VALID_VARIANTS = Object.keys(KoliBriProgressVariantEnum);
|
|
13861
13803
|
const CycleSvg = ({ state }) => {
|
|
@@ -13897,7 +13839,7 @@ class KolProcess {
|
|
|
13897
13839
|
};
|
|
13898
13840
|
}
|
|
13899
13841
|
render() {
|
|
13900
|
-
return (hAsync(Host, { key: '
|
|
13842
|
+
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)));
|
|
13901
13843
|
}
|
|
13902
13844
|
validateLabel(value) {
|
|
13903
13845
|
validateLabel(this, value);
|
|
@@ -13966,8 +13908,8 @@ class KolProcess {
|
|
|
13966
13908
|
}; }
|
|
13967
13909
|
}
|
|
13968
13910
|
|
|
13969
|
-
const defaultStyleCss$
|
|
13970
|
-
var KolQuoteDefaultStyle0 = defaultStyleCss$
|
|
13911
|
+
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}";
|
|
13912
|
+
var KolQuoteDefaultStyle0 = defaultStyleCss$e;
|
|
13971
13913
|
|
|
13972
13914
|
class KolQuote {
|
|
13973
13915
|
constructor(hostRef) {
|
|
@@ -14006,9 +13948,9 @@ class KolQuote {
|
|
|
14006
13948
|
}
|
|
14007
13949
|
render() {
|
|
14008
13950
|
const hasExpertSlot = showExpertSlot(this.state._quote);
|
|
14009
|
-
return (hAsync(Host, { key: '
|
|
13951
|
+
return (hAsync(Host, { key: '08232b44e1ee7d5f3acfc4fcd846fa85a9731b0f', class: "kol-quote" }, hAsync("figure", { key: '23b315c6c5b6ca342fa0c88b08c8d335ffb032d6', class: {
|
|
14010
13952
|
[this.state._variant]: true,
|
|
14011
|
-
} }, 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: '
|
|
13953
|
+
} }, 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" })))))));
|
|
14012
13954
|
}
|
|
14013
13955
|
static get watchers() { return {
|
|
14014
13956
|
"_label": ["validateLabel"],
|
|
@@ -14104,76 +14046,555 @@ class SelectController extends InputIconController {
|
|
|
14104
14046
|
},
|
|
14105
14047
|
});
|
|
14106
14048
|
}
|
|
14107
|
-
componentWillLoad() {
|
|
14108
|
-
super.componentWillLoad();
|
|
14109
|
-
this.validateOptions(this.component._options);
|
|
14110
|
-
this.validateMultiple(this.component._multiple);
|
|
14111
|
-
this.validateRequired(this.component._required);
|
|
14112
|
-
this.validateRows(this.component._rows);
|
|
14113
|
-
this.validateValue(this.component._value);
|
|
14049
|
+
componentWillLoad() {
|
|
14050
|
+
super.componentWillLoad();
|
|
14051
|
+
this.validateOptions(this.component._options);
|
|
14052
|
+
this.validateMultiple(this.component._multiple);
|
|
14053
|
+
this.validateRequired(this.component._required);
|
|
14054
|
+
this.validateRows(this.component._rows);
|
|
14055
|
+
this.validateValue(this.component._value);
|
|
14056
|
+
}
|
|
14057
|
+
}
|
|
14058
|
+
|
|
14059
|
+
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}";
|
|
14060
|
+
var KolSelectDefaultStyle0 = defaultStyleCss$d;
|
|
14061
|
+
|
|
14062
|
+
const isSelected = (valueList, optionValue) => {
|
|
14063
|
+
return Array.isArray(valueList) && valueList.includes(optionValue);
|
|
14064
|
+
};
|
|
14065
|
+
class KolSelect {
|
|
14066
|
+
async getValue() {
|
|
14067
|
+
return this.state._value;
|
|
14068
|
+
}
|
|
14069
|
+
async focus() {
|
|
14070
|
+
await this.kolFocus();
|
|
14071
|
+
}
|
|
14072
|
+
async kolFocus() {
|
|
14073
|
+
var _a;
|
|
14074
|
+
(_a = this.selectRef) === null || _a === void 0 ? void 0 : _a.focus();
|
|
14075
|
+
}
|
|
14076
|
+
renderOptgroup(optgroup, preKey) {
|
|
14077
|
+
var _a;
|
|
14078
|
+
return (hAsync("optgroup", { disabled: optgroup.disabled, label: optgroup.label }, (_a = optgroup.options) === null || _a === void 0 ? void 0 : _a.map((option, index) => {
|
|
14079
|
+
const key = `${preKey}-${index}`;
|
|
14080
|
+
if (Array.isArray(option.options)) {
|
|
14081
|
+
return this.renderOptgroup(option, key);
|
|
14082
|
+
}
|
|
14083
|
+
else {
|
|
14084
|
+
return (hAsync("option", { disabled: option.disabled, key: key, selected: isSelected(this.state._value, option.value), value: key }, option.label));
|
|
14085
|
+
}
|
|
14086
|
+
})));
|
|
14087
|
+
}
|
|
14088
|
+
render() {
|
|
14089
|
+
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
14090
|
+
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
14091
|
+
return (hAsync(Host, { key: '5c65d97077bdf5a3d3464e1e99b1250ee73f5854', class: { 'kol-select': true, 'has-value': this.state._hasValue } }, hAsync(KolInputWcTag, { key: 'a25c65cad1afdb4af663dc4f1f1d59953cb5541d', class: {
|
|
14092
|
+
'hide-label': !!this.state._hideLabel,
|
|
14093
|
+
select: true,
|
|
14094
|
+
}, _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) => {
|
|
14095
|
+
event.preventDefault();
|
|
14096
|
+
propagateSubmitEventToForm({
|
|
14097
|
+
form: this.host,
|
|
14098
|
+
ref: this.selectRef,
|
|
14099
|
+
});
|
|
14100
|
+
} }, 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) => {
|
|
14101
|
+
const key = `-${index}`;
|
|
14102
|
+
if (Array.isArray(option.options)) {
|
|
14103
|
+
return this.renderOptgroup(option, key);
|
|
14104
|
+
}
|
|
14105
|
+
else {
|
|
14106
|
+
return (hAsync("option", { disabled: option.disabled, key: key, selected: isSelected(this.state._value, option.value), value: key }, option.label));
|
|
14107
|
+
}
|
|
14108
|
+
})))))));
|
|
14109
|
+
}
|
|
14110
|
+
constructor(hostRef) {
|
|
14111
|
+
registerInstance(this, hostRef);
|
|
14112
|
+
this.catchRef = (ref) => {
|
|
14113
|
+
this.selectRef = ref;
|
|
14114
|
+
};
|
|
14115
|
+
this._accessKey = undefined;
|
|
14116
|
+
this._alert = true;
|
|
14117
|
+
this._disabled = false;
|
|
14118
|
+
this._error = undefined;
|
|
14119
|
+
this._hideError = false;
|
|
14120
|
+
this._hideLabel = false;
|
|
14121
|
+
this._hint = '';
|
|
14122
|
+
this._icons = undefined;
|
|
14123
|
+
this._id = undefined;
|
|
14124
|
+
this._label = undefined;
|
|
14125
|
+
this._msg = undefined;
|
|
14126
|
+
this._multiple = false;
|
|
14127
|
+
this._name = undefined;
|
|
14128
|
+
this._on = undefined;
|
|
14129
|
+
this._options = undefined;
|
|
14130
|
+
this._required = false;
|
|
14131
|
+
this._rows = undefined;
|
|
14132
|
+
this._syncValueBySelector = undefined;
|
|
14133
|
+
this._tabIndex = undefined;
|
|
14134
|
+
this._tooltipAlign = 'top';
|
|
14135
|
+
this._touched = false;
|
|
14136
|
+
this._value = undefined;
|
|
14137
|
+
this.state = {
|
|
14138
|
+
_hasValue: false,
|
|
14139
|
+
_hideError: false,
|
|
14140
|
+
_id: `id-${nonce()}`,
|
|
14141
|
+
_label: '',
|
|
14142
|
+
_multiple: false,
|
|
14143
|
+
_options: [],
|
|
14144
|
+
_value: [],
|
|
14145
|
+
};
|
|
14146
|
+
this.controller = new SelectController(this, 'select', this.host);
|
|
14147
|
+
}
|
|
14148
|
+
validateAccessKey(value) {
|
|
14149
|
+
this.controller.validateAccessKey(value);
|
|
14150
|
+
}
|
|
14151
|
+
validateAlert(value) {
|
|
14152
|
+
this.controller.validateAlert(value);
|
|
14153
|
+
}
|
|
14154
|
+
validateDisabled(value) {
|
|
14155
|
+
this.controller.validateDisabled(value);
|
|
14156
|
+
}
|
|
14157
|
+
validateError(value) {
|
|
14158
|
+
this.controller.validateError(value);
|
|
14159
|
+
}
|
|
14160
|
+
validateHideError(value) {
|
|
14161
|
+
this.controller.validateHideError(value);
|
|
14162
|
+
}
|
|
14163
|
+
validateHideLabel(value) {
|
|
14164
|
+
this.controller.validateHideLabel(value);
|
|
14165
|
+
}
|
|
14166
|
+
validateHint(value) {
|
|
14167
|
+
this.controller.validateHint(value);
|
|
14168
|
+
}
|
|
14169
|
+
validateIcons(value) {
|
|
14170
|
+
this.controller.validateIcons(value);
|
|
14171
|
+
}
|
|
14172
|
+
validateId(value) {
|
|
14173
|
+
this.controller.validateId(value);
|
|
14174
|
+
}
|
|
14175
|
+
validateLabel(value) {
|
|
14176
|
+
this.controller.validateLabel(value);
|
|
14177
|
+
}
|
|
14178
|
+
validateMsg(value) {
|
|
14179
|
+
this.controller.validateMsg(value);
|
|
14180
|
+
}
|
|
14181
|
+
validateMultiple(value) {
|
|
14182
|
+
this.controller.validateMultiple(value);
|
|
14183
|
+
}
|
|
14184
|
+
validateName(value) {
|
|
14185
|
+
this.controller.validateName(value);
|
|
14186
|
+
}
|
|
14187
|
+
validateOn(value) {
|
|
14188
|
+
this.controller.validateOn(value);
|
|
14189
|
+
}
|
|
14190
|
+
validateOptions(value) {
|
|
14191
|
+
this.controller.validateOptions(value);
|
|
14192
|
+
}
|
|
14193
|
+
validateRequired(value) {
|
|
14194
|
+
this.controller.validateRequired(value);
|
|
14195
|
+
}
|
|
14196
|
+
validateRows(value) {
|
|
14197
|
+
this.controller.validateRows(value);
|
|
14198
|
+
}
|
|
14199
|
+
validateSyncValueBySelector(value) {
|
|
14200
|
+
this.controller.validateSyncValueBySelector(value);
|
|
14201
|
+
}
|
|
14202
|
+
validateTabIndex(value) {
|
|
14203
|
+
this.controller.validateTabIndex(value);
|
|
14204
|
+
}
|
|
14205
|
+
validateTouched(value) {
|
|
14206
|
+
this.controller.validateTouched(value);
|
|
14207
|
+
}
|
|
14208
|
+
validateValue(value) {
|
|
14209
|
+
this.controller.validateValue(value);
|
|
14210
|
+
}
|
|
14211
|
+
componentWillLoad() {
|
|
14212
|
+
this._alert = this._alert === true;
|
|
14213
|
+
this._touched = this._touched === true;
|
|
14214
|
+
this.controller.componentWillLoad();
|
|
14215
|
+
this.state._hasValue = !!this.state._value;
|
|
14216
|
+
this.controller.addValueChangeListener((v) => (this.state._hasValue = !!v));
|
|
14217
|
+
}
|
|
14218
|
+
onInput(event) {
|
|
14219
|
+
var _a, _b, _c;
|
|
14220
|
+
this._value = Array.from(((_a = this.selectRef) === null || _a === void 0 ? void 0 : _a.options) || [])
|
|
14221
|
+
.filter((option) => option.selected === true)
|
|
14222
|
+
.map((option) => { var _a; return (_a = this.controller.getOptionByKey(option.value)) === null || _a === void 0 ? void 0 : _a.value; });
|
|
14223
|
+
tryToDispatchKoliBriEvent('input', this.host, this._value);
|
|
14224
|
+
(_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);
|
|
14225
|
+
}
|
|
14226
|
+
onChange(event) {
|
|
14227
|
+
var _a, _b;
|
|
14228
|
+
stopPropagation(event);
|
|
14229
|
+
tryToDispatchKoliBriEvent('change', this.host, this._value);
|
|
14230
|
+
this.controller.setFormAssociatedValue(this._value);
|
|
14231
|
+
(_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);
|
|
14232
|
+
}
|
|
14233
|
+
get host() { return getElement(this); }
|
|
14234
|
+
static get watchers() { return {
|
|
14235
|
+
"_accessKey": ["validateAccessKey"],
|
|
14236
|
+
"_alert": ["validateAlert"],
|
|
14237
|
+
"_disabled": ["validateDisabled"],
|
|
14238
|
+
"_error": ["validateError"],
|
|
14239
|
+
"_hideError": ["validateHideError"],
|
|
14240
|
+
"_hideLabel": ["validateHideLabel"],
|
|
14241
|
+
"_hint": ["validateHint"],
|
|
14242
|
+
"_icons": ["validateIcons"],
|
|
14243
|
+
"_id": ["validateId"],
|
|
14244
|
+
"_label": ["validateLabel"],
|
|
14245
|
+
"_msg": ["validateMsg"],
|
|
14246
|
+
"_multiple": ["validateMultiple"],
|
|
14247
|
+
"_name": ["validateName"],
|
|
14248
|
+
"_on": ["validateOn"],
|
|
14249
|
+
"_options": ["validateOptions"],
|
|
14250
|
+
"_required": ["validateRequired"],
|
|
14251
|
+
"_rows": ["validateRows"],
|
|
14252
|
+
"_syncValueBySelector": ["validateSyncValueBySelector"],
|
|
14253
|
+
"_tabIndex": ["validateTabIndex"],
|
|
14254
|
+
"_touched": ["validateTouched"],
|
|
14255
|
+
"_value": ["validateValue"]
|
|
14256
|
+
}; }
|
|
14257
|
+
static get style() { return {
|
|
14258
|
+
default: KolSelectDefaultStyle0
|
|
14259
|
+
}; }
|
|
14260
|
+
static get cmpMeta() { return {
|
|
14261
|
+
"$flags$": 41,
|
|
14262
|
+
"$tagName$": "kol-select",
|
|
14263
|
+
"$members$": {
|
|
14264
|
+
"_accessKey": [1, "_access-key"],
|
|
14265
|
+
"_alert": [1540],
|
|
14266
|
+
"_disabled": [4],
|
|
14267
|
+
"_error": [1],
|
|
14268
|
+
"_hideError": [1540, "_hide-error"],
|
|
14269
|
+
"_hideLabel": [4, "_hide-label"],
|
|
14270
|
+
"_hint": [1],
|
|
14271
|
+
"_icons": [1],
|
|
14272
|
+
"_id": [1],
|
|
14273
|
+
"_label": [1],
|
|
14274
|
+
"_msg": [16],
|
|
14275
|
+
"_multiple": [4],
|
|
14276
|
+
"_name": [1],
|
|
14277
|
+
"_on": [16],
|
|
14278
|
+
"_options": [1],
|
|
14279
|
+
"_required": [4],
|
|
14280
|
+
"_rows": [2],
|
|
14281
|
+
"_syncValueBySelector": [1, "_sync-value-by-selector"],
|
|
14282
|
+
"_tabIndex": [2, "_tab-index"],
|
|
14283
|
+
"_tooltipAlign": [1, "_tooltip-align"],
|
|
14284
|
+
"_touched": [1540],
|
|
14285
|
+
"_value": [1025],
|
|
14286
|
+
"state": [32],
|
|
14287
|
+
"getValue": [64],
|
|
14288
|
+
"focus": [64],
|
|
14289
|
+
"kolFocus": [64]
|
|
14290
|
+
},
|
|
14291
|
+
"$listeners$": undefined,
|
|
14292
|
+
"$lazyBundleId$": "-",
|
|
14293
|
+
"$attrsToReflect$": [["_alert", "_alert"], ["_hideError", "_hide-error"], ["_touched", "_touched"]]
|
|
14294
|
+
}; }
|
|
14295
|
+
}
|
|
14296
|
+
|
|
14297
|
+
class SingleSelectController extends InputIconController {
|
|
14298
|
+
constructor(component, name, host) {
|
|
14299
|
+
super(component, name, host);
|
|
14300
|
+
this.keyOptionMap = new Map();
|
|
14301
|
+
this.afterPatchOptions = (value, _state, _component, key) => {
|
|
14302
|
+
if (key === '_value') {
|
|
14303
|
+
this.setFormAssociatedValue(value);
|
|
14304
|
+
}
|
|
14305
|
+
};
|
|
14306
|
+
this.beforePatchOptions = (_value, nextState) => {
|
|
14307
|
+
const options = nextState.has('_options') ? nextState.get('_options') : this.component.state._options;
|
|
14308
|
+
if (Array.isArray(options) && options.length > 0) {
|
|
14309
|
+
this.keyOptionMap.clear();
|
|
14310
|
+
fillKeyOptionMap(this.keyOptionMap, options);
|
|
14311
|
+
}
|
|
14312
|
+
};
|
|
14313
|
+
this.component = component;
|
|
14314
|
+
}
|
|
14315
|
+
validateOptions(value) {
|
|
14316
|
+
validateOptions(this.component, value, {
|
|
14317
|
+
hooks: {
|
|
14318
|
+
afterPatch: this.afterPatchOptions,
|
|
14319
|
+
beforePatch: this.beforePatchOptions,
|
|
14320
|
+
},
|
|
14321
|
+
});
|
|
14322
|
+
}
|
|
14323
|
+
validateRequired(value) {
|
|
14324
|
+
watchBoolean(this.component, '_required', value);
|
|
14325
|
+
}
|
|
14326
|
+
validateValue(value) {
|
|
14327
|
+
watchString(this.component, '_value', value);
|
|
14328
|
+
}
|
|
14329
|
+
validateMsg(value) {
|
|
14330
|
+
validateMsg(this.component, value);
|
|
14331
|
+
}
|
|
14332
|
+
validatePlaceholder(value) {
|
|
14333
|
+
watchString(this.component, '_placeholder', value);
|
|
14334
|
+
}
|
|
14335
|
+
componentWillLoad() {
|
|
14336
|
+
super.componentWillLoad();
|
|
14337
|
+
this.validateOptions(this.component._options);
|
|
14338
|
+
this.validateRequired(this.component._required);
|
|
14339
|
+
this.validateValue(this.component._value);
|
|
14340
|
+
this.validatePlaceholder(this.component._placeholder);
|
|
14341
|
+
}
|
|
14342
|
+
}
|
|
14343
|
+
|
|
14344
|
+
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}";
|
|
14345
|
+
var KolSingleSelectDefaultStyle0 = defaultStyleCss$c;
|
|
14346
|
+
|
|
14347
|
+
class KolSingleSelect {
|
|
14348
|
+
async getValue() {
|
|
14349
|
+
return this.state._value;
|
|
14350
|
+
}
|
|
14351
|
+
async kolFocus() {
|
|
14352
|
+
var _a;
|
|
14353
|
+
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
14354
|
+
}
|
|
14355
|
+
onBlur() {
|
|
14356
|
+
var _a;
|
|
14357
|
+
if (Array.isArray(this.state._options) && this.state._options.length > 0 && !this.state._options.some((option) => option.label === this._inputValue)) {
|
|
14358
|
+
this._inputValue = (_a = this.state._options.find((option) => option.value === this.state._value)) === null || _a === void 0 ? void 0 : _a.label;
|
|
14359
|
+
this._filteredOptions = [...this.state._options];
|
|
14360
|
+
}
|
|
14361
|
+
this._isOpen = false;
|
|
14362
|
+
}
|
|
14363
|
+
clearSelection() {
|
|
14364
|
+
if (this.state._disabled) {
|
|
14365
|
+
return;
|
|
14366
|
+
}
|
|
14367
|
+
else {
|
|
14368
|
+
this._focusedOptionIndex = -1;
|
|
14369
|
+
this.state._value = '';
|
|
14370
|
+
this._inputValue = '';
|
|
14371
|
+
this._filteredOptions = [...this.state._options];
|
|
14372
|
+
this.controller.setFormAssociatedValue(this.state._value);
|
|
14373
|
+
}
|
|
14374
|
+
}
|
|
14375
|
+
selectOption(event, option) {
|
|
14376
|
+
this.state._value = option.value;
|
|
14377
|
+
this._inputValue = option.label;
|
|
14378
|
+
this.controller.onFacade.onChange(event, option.value);
|
|
14379
|
+
this.controller.onFacade.onInput(event, false, option.value);
|
|
14380
|
+
this._filteredOptions = [...this.state._options];
|
|
14381
|
+
this.controller.setFormAssociatedValue(this.state._value);
|
|
14382
|
+
}
|
|
14383
|
+
onInput(event) {
|
|
14384
|
+
const target = event.target;
|
|
14385
|
+
this._inputValue = target.value;
|
|
14386
|
+
this._isOpen = true;
|
|
14387
|
+
this.setFilteredOptionsByQuery(target.value);
|
|
14388
|
+
this._focusedOptionIndex = -1;
|
|
14389
|
+
}
|
|
14390
|
+
handleKeyDownDropdown(event) {
|
|
14391
|
+
if (event.key.length === 1 && /[a-z0-9]/i.test(event.key)) {
|
|
14392
|
+
event.preventDefault();
|
|
14393
|
+
this._isOpen = true;
|
|
14394
|
+
this.focusSuggestionStartingWith(event.key);
|
|
14395
|
+
}
|
|
14396
|
+
}
|
|
14397
|
+
setFilteredOptionsByQuery(query) {
|
|
14398
|
+
if ((query === null || query === void 0 ? void 0 : query.trim()) === '') {
|
|
14399
|
+
this._filteredOptions = [...this.state._options];
|
|
14400
|
+
}
|
|
14401
|
+
else if (Array.isArray(this.state._options) && this.state._options.length > 0 && query.length > 0) {
|
|
14402
|
+
this._filteredOptions = this.state._options.filter((option) => {
|
|
14403
|
+
var _a, _b;
|
|
14404
|
+
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());
|
|
14405
|
+
});
|
|
14406
|
+
}
|
|
14407
|
+
}
|
|
14408
|
+
moveFocus(delta) {
|
|
14409
|
+
if (!this._filteredOptions) {
|
|
14410
|
+
return;
|
|
14411
|
+
}
|
|
14412
|
+
let newIndex = this._focusedOptionIndex + delta;
|
|
14413
|
+
if (newIndex >= this._filteredOptions.length) {
|
|
14414
|
+
newIndex = 0;
|
|
14415
|
+
}
|
|
14416
|
+
if (newIndex < 0) {
|
|
14417
|
+
newIndex = this._filteredOptions.length - 1;
|
|
14418
|
+
}
|
|
14419
|
+
this._focusedOptionIndex = newIndex;
|
|
14420
|
+
this.focusOption(this._focusedOptionIndex);
|
|
14421
|
+
}
|
|
14422
|
+
focusOption(index) {
|
|
14423
|
+
if (this.refOptions) {
|
|
14424
|
+
const optionElement = this.refOptions[index];
|
|
14425
|
+
optionElement === null || optionElement === void 0 ? void 0 : optionElement.focus();
|
|
14426
|
+
}
|
|
14427
|
+
}
|
|
14428
|
+
focusSuggestionStartingWith(char) {
|
|
14429
|
+
const charLowerCase = char.toLowerCase();
|
|
14430
|
+
const index = Array.isArray(this._filteredOptions) && this._filteredOptions.findIndex((option) => option.label.toLowerCase().startsWith(charLowerCase));
|
|
14431
|
+
if (typeof index === 'number') {
|
|
14432
|
+
this._focusedOptionIndex = index;
|
|
14433
|
+
this.focusOption(index);
|
|
14434
|
+
}
|
|
14114
14435
|
}
|
|
14115
|
-
|
|
14116
|
-
|
|
14117
|
-
const
|
|
14118
|
-
|
|
14119
|
-
|
|
14120
|
-
|
|
14121
|
-
|
|
14122
|
-
}
|
|
14123
|
-
|
|
14124
|
-
|
|
14125
|
-
|
|
14436
|
+
render() {
|
|
14437
|
+
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
14438
|
+
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
14439
|
+
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: () => {
|
|
14440
|
+
var _a;
|
|
14441
|
+
this.clearSelection();
|
|
14442
|
+
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
14443
|
+
}, 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) => {
|
|
14444
|
+
if (el)
|
|
14445
|
+
this.refOptions[index] = el;
|
|
14446
|
+
}, tabIndex: -1, role: "option", "aria-selected": this.state._value === option.value, onClick: (event) => {
|
|
14447
|
+
var _a;
|
|
14448
|
+
this.selectOption(event, option);
|
|
14449
|
+
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
14450
|
+
this.toggleListbox(event);
|
|
14451
|
+
}, onMouseOver: () => {
|
|
14452
|
+
if (!this.blockSuggestionMouseOver) {
|
|
14453
|
+
this._focusedOptionIndex = index;
|
|
14454
|
+
this.focusOption(index);
|
|
14455
|
+
}
|
|
14456
|
+
}, onFocus: () => {
|
|
14457
|
+
this._focusedOptionIndex = index;
|
|
14458
|
+
this.focusOption(index);
|
|
14459
|
+
}, class: "single-select__item", onKeyDown: (e) => {
|
|
14460
|
+
var _a;
|
|
14461
|
+
if (e.key === 'Enter' || e.key === 'NumpadEnter') {
|
|
14462
|
+
this.selectOption(e, option);
|
|
14463
|
+
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
14464
|
+
this.toggleListbox(e);
|
|
14465
|
+
e.preventDefault();
|
|
14466
|
+
}
|
|
14467
|
+
} }, 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'), " ")))))))));
|
|
14126
14468
|
}
|
|
14127
|
-
|
|
14128
|
-
|
|
14469
|
+
handleFocusOut() {
|
|
14470
|
+
setTimeout(() => {
|
|
14471
|
+
var _a;
|
|
14472
|
+
if (!((_a = this.host) === null || _a === void 0 ? void 0 : _a.contains(document.activeElement))) {
|
|
14473
|
+
this.onBlur();
|
|
14474
|
+
}
|
|
14475
|
+
}, 0);
|
|
14129
14476
|
}
|
|
14130
|
-
|
|
14131
|
-
|
|
14132
|
-
(_a = this.selectRef) === null || _a === void 0 ? void 0 : _a.focus();
|
|
14477
|
+
handleWindowBlur() {
|
|
14478
|
+
this.onBlur();
|
|
14133
14479
|
}
|
|
14134
|
-
|
|
14135
|
-
var _a;
|
|
14136
|
-
|
|
14137
|
-
|
|
14138
|
-
|
|
14139
|
-
|
|
14480
|
+
handleKeyDown(event) {
|
|
14481
|
+
var _a, _b;
|
|
14482
|
+
const handleEvent = (isOpen, callback) => {
|
|
14483
|
+
var _a;
|
|
14484
|
+
event.preventDefault();
|
|
14485
|
+
if (isOpen !== undefined) {
|
|
14486
|
+
this._isOpen = isOpen;
|
|
14487
|
+
if (!isOpen) {
|
|
14488
|
+
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
14489
|
+
}
|
|
14140
14490
|
}
|
|
14141
|
-
|
|
14142
|
-
|
|
14491
|
+
callback === null || callback === void 0 ? void 0 : callback();
|
|
14492
|
+
};
|
|
14493
|
+
switch (event.key) {
|
|
14494
|
+
case 'Down':
|
|
14495
|
+
case 'ArrowDown': {
|
|
14496
|
+
this.blockSuggestionMouseOver = true;
|
|
14497
|
+
handleEvent(true, () => this.moveFocus(1));
|
|
14498
|
+
break;
|
|
14143
14499
|
}
|
|
14144
|
-
|
|
14145
|
-
|
|
14146
|
-
|
|
14147
|
-
|
|
14148
|
-
|
|
14149
|
-
|
|
14150
|
-
|
|
14151
|
-
|
|
14152
|
-
|
|
14153
|
-
|
|
14154
|
-
|
|
14155
|
-
|
|
14156
|
-
|
|
14500
|
+
case 'Up':
|
|
14501
|
+
case 'ArrowUp': {
|
|
14502
|
+
this.blockSuggestionMouseOver = true;
|
|
14503
|
+
handleEvent(true, () => this.moveFocus(-1));
|
|
14504
|
+
break;
|
|
14505
|
+
}
|
|
14506
|
+
case 'Tab':
|
|
14507
|
+
if (this._isOpen) {
|
|
14508
|
+
this._isOpen = !this._isOpen;
|
|
14509
|
+
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
14510
|
+
}
|
|
14511
|
+
break;
|
|
14512
|
+
case 'Esc':
|
|
14513
|
+
case 'Escape': {
|
|
14514
|
+
handleEvent(false);
|
|
14515
|
+
break;
|
|
14516
|
+
}
|
|
14517
|
+
case ' ': {
|
|
14518
|
+
if (this._isOpen) {
|
|
14519
|
+
if (Array.isArray(this._filteredOptions) && this._filteredOptions.length > 0) {
|
|
14520
|
+
this.selectOption(event, this._filteredOptions[this._focusedOptionIndex]);
|
|
14521
|
+
(_b = this.refInput) === null || _b === void 0 ? void 0 : _b.focus();
|
|
14522
|
+
handleEvent(false);
|
|
14523
|
+
}
|
|
14524
|
+
}
|
|
14525
|
+
else {
|
|
14526
|
+
this.toggleListbox(event);
|
|
14527
|
+
}
|
|
14528
|
+
break;
|
|
14529
|
+
}
|
|
14530
|
+
case 'NumpadEnter':
|
|
14531
|
+
case 'Enter': {
|
|
14532
|
+
this.toggleListbox(event);
|
|
14533
|
+
break;
|
|
14534
|
+
}
|
|
14535
|
+
case 'Home': {
|
|
14536
|
+
this.blockSuggestionMouseOver = true;
|
|
14537
|
+
handleEvent(undefined, () => {
|
|
14538
|
+
if (this._isOpen) {
|
|
14539
|
+
this._focusedOptionIndex = 0;
|
|
14540
|
+
this.focusOption(this._focusedOptionIndex);
|
|
14541
|
+
}
|
|
14157
14542
|
});
|
|
14158
|
-
|
|
14159
|
-
const key = `-${index}`;
|
|
14160
|
-
if (Array.isArray(option.options)) {
|
|
14161
|
-
return this.renderOptgroup(option, key);
|
|
14543
|
+
break;
|
|
14162
14544
|
}
|
|
14163
|
-
|
|
14164
|
-
|
|
14545
|
+
case 'End': {
|
|
14546
|
+
this.blockSuggestionMouseOver = true;
|
|
14547
|
+
handleEvent(undefined, () => {
|
|
14548
|
+
if (this._isOpen) {
|
|
14549
|
+
this._focusedOptionIndex = this._filteredOptions ? this._filteredOptions.length - 1 : 0;
|
|
14550
|
+
this.focusOption(this._focusedOptionIndex);
|
|
14551
|
+
}
|
|
14552
|
+
});
|
|
14553
|
+
break;
|
|
14165
14554
|
}
|
|
14166
|
-
|
|
14555
|
+
case 'PageUp': {
|
|
14556
|
+
this.blockSuggestionMouseOver = true;
|
|
14557
|
+
handleEvent(undefined, () => this._isOpen && this.moveFocus(-10));
|
|
14558
|
+
break;
|
|
14559
|
+
}
|
|
14560
|
+
case 'PageDown': {
|
|
14561
|
+
this.blockSuggestionMouseOver = true;
|
|
14562
|
+
handleEvent(undefined, () => this._isOpen && this.moveFocus(10));
|
|
14563
|
+
break;
|
|
14564
|
+
}
|
|
14565
|
+
}
|
|
14167
14566
|
}
|
|
14168
14567
|
constructor(hostRef) {
|
|
14169
14568
|
registerInstance(this, hostRef);
|
|
14569
|
+
this.refOptions = [];
|
|
14170
14570
|
this.catchRef = (ref) => {
|
|
14171
|
-
this.
|
|
14571
|
+
this.refInput = ref;
|
|
14572
|
+
};
|
|
14573
|
+
this.toggleListbox = (event) => {
|
|
14574
|
+
var _a;
|
|
14575
|
+
event === null || event === void 0 ? void 0 : event.preventDefault();
|
|
14576
|
+
if (this.state._disabled) {
|
|
14577
|
+
return;
|
|
14578
|
+
}
|
|
14579
|
+
else {
|
|
14580
|
+
this._isOpen = !this._isOpen;
|
|
14581
|
+
if (this._isOpen) {
|
|
14582
|
+
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
14583
|
+
const selectedIndex = Array.isArray(this._filteredOptions) ? this._filteredOptions.findIndex((option) => option.label === this._inputValue) : -1;
|
|
14584
|
+
this._focusedOptionIndex = selectedIndex >= 0 ? selectedIndex : 0;
|
|
14585
|
+
this.focusOption(this._focusedOptionIndex);
|
|
14586
|
+
}
|
|
14587
|
+
}
|
|
14172
14588
|
};
|
|
14589
|
+
this._focusedOptionIndex = -1;
|
|
14590
|
+
this._isOpen = false;
|
|
14591
|
+
this._filteredOptions = [];
|
|
14592
|
+
this._inputValue = '';
|
|
14593
|
+
this.blockSuggestionMouseOver = false;
|
|
14173
14594
|
this._accessKey = undefined;
|
|
14595
|
+
this._placeholder = undefined;
|
|
14174
14596
|
this._alert = true;
|
|
14175
14597
|
this._disabled = false;
|
|
14176
|
-
this._error = undefined;
|
|
14177
14598
|
this._hideError = false;
|
|
14178
14599
|
this._hideLabel = false;
|
|
14179
14600
|
this._hint = '';
|
|
@@ -14181,27 +14602,26 @@ class KolSelect {
|
|
|
14181
14602
|
this._id = undefined;
|
|
14182
14603
|
this._label = undefined;
|
|
14183
14604
|
this._msg = undefined;
|
|
14184
|
-
this._multiple = false;
|
|
14185
14605
|
this._name = undefined;
|
|
14186
14606
|
this._on = undefined;
|
|
14187
14607
|
this._options = undefined;
|
|
14188
14608
|
this._required = false;
|
|
14189
|
-
this._rows = undefined;
|
|
14190
14609
|
this._syncValueBySelector = undefined;
|
|
14191
14610
|
this._tabIndex = undefined;
|
|
14192
14611
|
this._tooltipAlign = 'top';
|
|
14193
14612
|
this._touched = false;
|
|
14194
14613
|
this._value = undefined;
|
|
14195
14614
|
this.state = {
|
|
14196
|
-
_hasValue: false,
|
|
14197
14615
|
_hideError: false,
|
|
14198
14616
|
_id: `id-${nonce()}`,
|
|
14199
14617
|
_label: '',
|
|
14200
|
-
_multiple: false,
|
|
14201
14618
|
_options: [],
|
|
14202
|
-
_value:
|
|
14619
|
+
_value: '',
|
|
14203
14620
|
};
|
|
14204
|
-
this.controller = new
|
|
14621
|
+
this.controller = new SingleSelectController(this, 'single-select', this.host);
|
|
14622
|
+
}
|
|
14623
|
+
validatePlaceholder(value) {
|
|
14624
|
+
this.controller.validatePlaceholder(value);
|
|
14205
14625
|
}
|
|
14206
14626
|
validateAccessKey(value) {
|
|
14207
14627
|
this.controller.validateAccessKey(value);
|
|
@@ -14212,9 +14632,6 @@ class KolSelect {
|
|
|
14212
14632
|
validateDisabled(value) {
|
|
14213
14633
|
this.controller.validateDisabled(value);
|
|
14214
14634
|
}
|
|
14215
|
-
validateError(value) {
|
|
14216
|
-
this.controller.validateError(value);
|
|
14217
|
-
}
|
|
14218
14635
|
validateHideError(value) {
|
|
14219
14636
|
this.controller.validateHideError(value);
|
|
14220
14637
|
}
|
|
@@ -14236,9 +14653,6 @@ class KolSelect {
|
|
|
14236
14653
|
validateMsg(value) {
|
|
14237
14654
|
this.controller.validateMsg(value);
|
|
14238
14655
|
}
|
|
14239
|
-
validateMultiple(value) {
|
|
14240
|
-
this.controller.validateMultiple(value);
|
|
14241
|
-
}
|
|
14242
14656
|
validateName(value) {
|
|
14243
14657
|
this.controller.validateName(value);
|
|
14244
14658
|
}
|
|
@@ -14247,13 +14661,11 @@ class KolSelect {
|
|
|
14247
14661
|
}
|
|
14248
14662
|
validateOptions(value) {
|
|
14249
14663
|
this.controller.validateOptions(value);
|
|
14664
|
+
this._filteredOptions = value;
|
|
14250
14665
|
}
|
|
14251
14666
|
validateRequired(value) {
|
|
14252
14667
|
this.controller.validateRequired(value);
|
|
14253
14668
|
}
|
|
14254
|
-
validateRows(value) {
|
|
14255
|
-
this.controller.validateRows(value);
|
|
14256
|
-
}
|
|
14257
14669
|
validateSyncValueBySelector(value) {
|
|
14258
14670
|
this.controller.validateSyncValueBySelector(value);
|
|
14259
14671
|
}
|
|
@@ -14265,35 +14677,40 @@ class KolSelect {
|
|
|
14265
14677
|
}
|
|
14266
14678
|
validateValue(value) {
|
|
14267
14679
|
this.controller.validateValue(value);
|
|
14680
|
+
this.oldValue = value;
|
|
14681
|
+
}
|
|
14682
|
+
handleMouseEvent() {
|
|
14683
|
+
this.blockSuggestionMouseOver = false;
|
|
14268
14684
|
}
|
|
14269
14685
|
componentWillLoad() {
|
|
14686
|
+
this.refOptions = [];
|
|
14270
14687
|
this._alert = this._alert === true;
|
|
14271
14688
|
this._touched = this._touched === true;
|
|
14272
14689
|
this.controller.componentWillLoad();
|
|
14273
|
-
this.
|
|
14274
|
-
this.
|
|
14275
|
-
|
|
14276
|
-
|
|
14277
|
-
|
|
14278
|
-
|
|
14279
|
-
.filter((option) => option.selected === true)
|
|
14280
|
-
.map((option) => { var _a; return (_a = this.controller.getOptionByKey(option.value)) === null || _a === void 0 ? void 0 : _a.value; });
|
|
14281
|
-
tryToDispatchKoliBriEvent('input', this.host, this._value);
|
|
14282
|
-
(_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);
|
|
14690
|
+
this.oldValue = this._value;
|
|
14691
|
+
this._filteredOptions = this._options;
|
|
14692
|
+
if (Array.isArray(this._options)) {
|
|
14693
|
+
const matchedOption = this._options.find((option) => option.value === this._value);
|
|
14694
|
+
this._inputValue = matchedOption ? matchedOption.label : '';
|
|
14695
|
+
}
|
|
14283
14696
|
}
|
|
14284
14697
|
onChange(event) {
|
|
14285
|
-
var _a, _b;
|
|
14698
|
+
var _a, _b, _c, _d;
|
|
14699
|
+
if (this.oldValue !== ((_a = this.refInput) === null || _a === void 0 ? void 0 : _a.value)) {
|
|
14700
|
+
this.oldValue = (_b = this.refInput) === null || _b === void 0 ? void 0 : _b.value;
|
|
14701
|
+
}
|
|
14286
14702
|
stopPropagation(event);
|
|
14287
14703
|
tryToDispatchKoliBriEvent('change', this.host, this._value);
|
|
14288
|
-
this.
|
|
14289
|
-
|
|
14704
|
+
if (typeof ((_c = this.state._on) === null || _c === void 0 ? void 0 : _c.onChange) === 'function' && !this._isOpen) {
|
|
14705
|
+
this.state._on.onChange(event, this._value && this.oldValue !== ((_d = this.refInput) === null || _d === void 0 ? void 0 : _d.value));
|
|
14706
|
+
}
|
|
14290
14707
|
}
|
|
14291
14708
|
get host() { return getElement(this); }
|
|
14292
14709
|
static get watchers() { return {
|
|
14710
|
+
"_placeholder": ["validatePlaceholder"],
|
|
14293
14711
|
"_accessKey": ["validateAccessKey"],
|
|
14294
14712
|
"_alert": ["validateAlert"],
|
|
14295
14713
|
"_disabled": ["validateDisabled"],
|
|
14296
|
-
"_error": ["validateError"],
|
|
14297
14714
|
"_hideError": ["validateHideError"],
|
|
14298
14715
|
"_hideLabel": ["validateHideLabel"],
|
|
14299
14716
|
"_hint": ["validateHint"],
|
|
@@ -14301,28 +14718,26 @@ class KolSelect {
|
|
|
14301
14718
|
"_id": ["validateId"],
|
|
14302
14719
|
"_label": ["validateLabel"],
|
|
14303
14720
|
"_msg": ["validateMsg"],
|
|
14304
|
-
"_multiple": ["validateMultiple"],
|
|
14305
14721
|
"_name": ["validateName"],
|
|
14306
14722
|
"_on": ["validateOn"],
|
|
14307
14723
|
"_options": ["validateOptions"],
|
|
14308
14724
|
"_required": ["validateRequired"],
|
|
14309
|
-
"_rows": ["validateRows"],
|
|
14310
14725
|
"_syncValueBySelector": ["validateSyncValueBySelector"],
|
|
14311
14726
|
"_tabIndex": ["validateTabIndex"],
|
|
14312
14727
|
"_touched": ["validateTouched"],
|
|
14313
14728
|
"_value": ["validateValue"]
|
|
14314
14729
|
}; }
|
|
14315
14730
|
static get style() { return {
|
|
14316
|
-
default:
|
|
14731
|
+
default: KolSingleSelectDefaultStyle0
|
|
14317
14732
|
}; }
|
|
14318
14733
|
static get cmpMeta() { return {
|
|
14319
14734
|
"$flags$": 41,
|
|
14320
|
-
"$tagName$": "kol-select",
|
|
14735
|
+
"$tagName$": "kol-single-select",
|
|
14321
14736
|
"$members$": {
|
|
14322
14737
|
"_accessKey": [1, "_access-key"],
|
|
14738
|
+
"_placeholder": [1],
|
|
14323
14739
|
"_alert": [1540],
|
|
14324
14740
|
"_disabled": [4],
|
|
14325
|
-
"_error": [1],
|
|
14326
14741
|
"_hideError": [1540, "_hide-error"],
|
|
14327
14742
|
"_hideLabel": [4, "_hide-label"],
|
|
14328
14743
|
"_hint": [1],
|
|
@@ -14330,23 +14745,24 @@ class KolSelect {
|
|
|
14330
14745
|
"_id": [1],
|
|
14331
14746
|
"_label": [1],
|
|
14332
14747
|
"_msg": [16],
|
|
14333
|
-
"_multiple": [4],
|
|
14334
14748
|
"_name": [1],
|
|
14335
14749
|
"_on": [16],
|
|
14336
14750
|
"_options": [1],
|
|
14337
14751
|
"_required": [4],
|
|
14338
|
-
"_rows": [2],
|
|
14339
14752
|
"_syncValueBySelector": [1, "_sync-value-by-selector"],
|
|
14340
14753
|
"_tabIndex": [2, "_tab-index"],
|
|
14341
14754
|
"_tooltipAlign": [1, "_tooltip-align"],
|
|
14342
14755
|
"_touched": [1540],
|
|
14343
14756
|
"_value": [1025],
|
|
14757
|
+
"_isOpen": [32],
|
|
14758
|
+
"_filteredOptions": [32],
|
|
14759
|
+
"_inputValue": [32],
|
|
14760
|
+
"blockSuggestionMouseOver": [32],
|
|
14344
14761
|
"state": [32],
|
|
14345
14762
|
"getValue": [64],
|
|
14346
|
-
"focus": [64],
|
|
14347
14763
|
"kolFocus": [64]
|
|
14348
14764
|
},
|
|
14349
|
-
"$listeners$":
|
|
14765
|
+
"$listeners$": [[8, "focusout", "handleFocusOut"], [8, "blur", "handleWindowBlur"], [0, "keydown", "handleKeyDown"], [1, "mousemove", "handleMouseEvent"]],
|
|
14350
14766
|
"$lazyBundleId$": "-",
|
|
14351
14767
|
"$attrsToReflect$": [["_alert", "_alert"], ["_hideError", "_hide-error"], ["_touched", "_touched"]]
|
|
14352
14768
|
}; }
|
|
@@ -14366,7 +14782,7 @@ class KolSkipNav {
|
|
|
14366
14782
|
};
|
|
14367
14783
|
}
|
|
14368
14784
|
render() {
|
|
14369
|
-
return (hAsync(Host, { key: '
|
|
14785
|
+
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) => {
|
|
14370
14786
|
return (hAsync("li", { key: index }, hAsync(KolLinkWcTag, Object.assign({}, link))));
|
|
14371
14787
|
})))));
|
|
14372
14788
|
}
|
|
@@ -22754,10 +23170,10 @@ class KolSpanWc {
|
|
|
22754
23170
|
render() {
|
|
22755
23171
|
var _a, _b, _c, _d, _e;
|
|
22756
23172
|
const hideExpertSlot = !showExpertSlot(this.state._label);
|
|
22757
|
-
return (hAsync(Host, { key: '
|
|
23173
|
+
return (hAsync(Host, { key: '0a15150866920a51833e591397e7ff1624c89fc7', class: {
|
|
22758
23174
|
'kol-span-wc': true,
|
|
22759
23175
|
'hide-label': !!this.state._hideLabel,
|
|
22760
|
-
} }, this.state._icons.top && (hAsync(KolIconTag, { key: '
|
|
23176
|
+
} }, 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 }))));
|
|
22761
23177
|
}
|
|
22762
23178
|
validateAccessKey(value) {
|
|
22763
23179
|
validateAccessKey(this, value);
|
|
@@ -22811,7 +23227,7 @@ class KolSpanWc {
|
|
|
22811
23227
|
}; }
|
|
22812
23228
|
}
|
|
22813
23229
|
|
|
22814
|
-
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: #
|
|
23230
|
+
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}";
|
|
22815
23231
|
var KolSpinDefaultStyle0 = defaultStyleCss$a;
|
|
22816
23232
|
|
|
22817
23233
|
function renderSpin(variant) {
|
|
@@ -22835,7 +23251,7 @@ class KolSpin {
|
|
|
22835
23251
|
};
|
|
22836
23252
|
}
|
|
22837
23253
|
render() {
|
|
22838
|
-
return (hAsync(Host, { key: '
|
|
23254
|
+
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: {
|
|
22839
23255
|
spin: true,
|
|
22840
23256
|
[this.state._variant]: true,
|
|
22841
23257
|
}, role: "alert" }, renderSpin(this.state._variant))) : (this.showToggled && hAsync("span", { "aria-label": translate('kol-action-done'), "aria-busy": "false", "aria-live": "polite", role: "alert" }))));
|
|
@@ -22872,7 +23288,7 @@ class KolSpin {
|
|
|
22872
23288
|
}; }
|
|
22873
23289
|
}
|
|
22874
23290
|
|
|
22875
|
-
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 .
|
|
23291
|
+
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}";
|
|
22876
23292
|
var KolSplitButtonDefaultStyle0 = defaultStyleCss$9;
|
|
22877
23293
|
|
|
22878
23294
|
class KolSplitButton {
|
|
@@ -22890,32 +23306,11 @@ class KolSplitButton {
|
|
|
22890
23306
|
},
|
|
22891
23307
|
};
|
|
22892
23308
|
this.clickToggleHandler = { onClick: () => this.toggleDropdown() };
|
|
22893
|
-
this.
|
|
22894
|
-
|
|
22895
|
-
this.dropdown.style.height = `${this.dropdownContent.clientHeight}px`;
|
|
22896
|
-
this.state = Object.assign(Object.assign({}, this.state), { _show: true });
|
|
22897
|
-
}
|
|
22898
|
-
};
|
|
22899
|
-
this.closeDropdown = () => {
|
|
22900
|
-
if (this.dropdown && this.dropdownContent) {
|
|
22901
|
-
this.dropdown.style.height = ``;
|
|
22902
|
-
this.state = Object.assign(Object.assign({}, this.state), { _show: false });
|
|
22903
|
-
}
|
|
22904
|
-
};
|
|
22905
|
-
this.toggleDropdown = (value) => {
|
|
22906
|
-
const openIt = typeof value === 'boolean' ? value : !this.state._show;
|
|
22907
|
-
if (openIt)
|
|
22908
|
-
this.openDropdown();
|
|
22909
|
-
else
|
|
22910
|
-
this.closeDropdown();
|
|
23309
|
+
this.toggleDropdown = () => {
|
|
23310
|
+
this.state = Object.assign(Object.assign({}, this.state), { _show: !this.state._show });
|
|
22911
23311
|
};
|
|
22912
|
-
this.
|
|
22913
|
-
|
|
22914
|
-
this.dropdown = e;
|
|
22915
|
-
setTimeout(() => {
|
|
22916
|
-
this.dropdownContent = e.firstChild;
|
|
22917
|
-
});
|
|
22918
|
-
}
|
|
23312
|
+
this.handleOnClose = () => {
|
|
23313
|
+
this.state = Object.assign(Object.assign({}, this.state), { _show: false });
|
|
22919
23314
|
};
|
|
22920
23315
|
this._ariaControls = undefined;
|
|
22921
23316
|
this._ariaExpanded = undefined;
|
|
@@ -22941,12 +23336,15 @@ class KolSplitButton {
|
|
|
22941
23336
|
}
|
|
22942
23337
|
render() {
|
|
22943
23338
|
const i18nDropdownLabel = 'kol-split-button-dropdown-label';
|
|
22944
|
-
return (hAsync(Host, { key: '
|
|
23339
|
+
return (hAsync(Host, { key: '37ae6c094c635a1bc78d02370e730ccf1ec2cdc0', class: "kol-split-button" }, hAsync("div", { key: 'ed9ac9cc52557bc2387384da318969459239cb78', class: "split-button-root" }, hAsync(KolButtonWcTag, { key: 'a84ee1b2813033b3efbe3de9efff5580ecea9a10', class: {
|
|
22945
23340
|
'main-button': true,
|
|
22946
23341
|
button: true,
|
|
22947
23342
|
[this._variant]: this._variant !== 'custom',
|
|
22948
23343
|
[this._customClass]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,
|
|
22949
|
-
}, _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: '
|
|
23344
|
+
}, _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' }))));
|
|
23345
|
+
}
|
|
23346
|
+
closePopup() {
|
|
23347
|
+
this.handleOnClose();
|
|
22950
23348
|
}
|
|
22951
23349
|
static get style() { return {
|
|
22952
23350
|
default: KolSplitButtonDefaultStyle0
|
|
@@ -22973,7 +23371,8 @@ class KolSplitButton {
|
|
|
22973
23371
|
"_type": [1],
|
|
22974
23372
|
"_value": [8],
|
|
22975
23373
|
"_variant": [1],
|
|
22976
|
-
"state": [32]
|
|
23374
|
+
"state": [32],
|
|
23375
|
+
"closePopup": [64]
|
|
22977
23376
|
},
|
|
22978
23377
|
"$listeners$": undefined,
|
|
22979
23378
|
"$lazyBundleId$": "-",
|
|
@@ -22992,7 +23391,7 @@ class KolSymbol {
|
|
|
22992
23391
|
};
|
|
22993
23392
|
}
|
|
22994
23393
|
render() {
|
|
22995
|
-
return (hAsync(Host, { key: '
|
|
23394
|
+
return (hAsync(Host, { key: '0cf724ad64920f8a2a9818302ad4ec9d428c52b2', class: "kol-symbol" }, hAsync("span", { key: '46cacaa73fc9b86e9f008d69216dd4b14ca58210', "aria-label": this.state._label, role: "term" }, this.state._symbol)));
|
|
22996
23395
|
}
|
|
22997
23396
|
validateLabel(value) {
|
|
22998
23397
|
validateLabel(this, value, {
|
|
@@ -23041,7 +23440,7 @@ class KolTable {
|
|
|
23041
23440
|
this._on = undefined;
|
|
23042
23441
|
}
|
|
23043
23442
|
render() {
|
|
23044
|
-
return (hAsync(KolTableStatefulTag, { key: '
|
|
23443
|
+
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 }));
|
|
23045
23444
|
}
|
|
23046
23445
|
static get cmpMeta() { return {
|
|
23047
23446
|
"$flags$": 9,
|
|
@@ -23085,9 +23484,10 @@ var Events;
|
|
|
23085
23484
|
Events["onSort"] = "onSort";
|
|
23086
23485
|
Events["onSelectionChange"] = "onSelectionChange";
|
|
23087
23486
|
Events["onSubmit"] = "onSubmit";
|
|
23487
|
+
Events["onClose"] = "onClose";
|
|
23088
23488
|
})(Events || (Events = {}));
|
|
23089
23489
|
|
|
23090
|
-
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}";
|
|
23490
|
+
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}";
|
|
23091
23491
|
var KolTableStatefulDefaultStyle0 = defaultStyleCss$8;
|
|
23092
23492
|
|
|
23093
23493
|
const PAGINATION_OPTIONS = [10, 20, 50, 100];
|
|
@@ -23095,6 +23495,9 @@ const paginationValidator = (value) => value === true || value === '' || (typeof
|
|
|
23095
23495
|
class KolTableStateful {
|
|
23096
23496
|
constructor(hostRef) {
|
|
23097
23497
|
registerInstance(this, hostRef);
|
|
23498
|
+
this.catchRef = (ref) => {
|
|
23499
|
+
this.tableWcRef = ref;
|
|
23500
|
+
};
|
|
23098
23501
|
this.sortDirections = new Map();
|
|
23099
23502
|
this.sortData = [];
|
|
23100
23503
|
this.showPagination = false;
|
|
@@ -23131,6 +23534,9 @@ class KolTableStateful {
|
|
|
23131
23534
|
setState(this, '_pageSize', pageSize);
|
|
23132
23535
|
},
|
|
23133
23536
|
};
|
|
23537
|
+
this.onSelectionChange = (event) => {
|
|
23538
|
+
event.stopPropagation();
|
|
23539
|
+
};
|
|
23134
23540
|
this.updateSortedData = (cell = this.sortedColumnHead) => {
|
|
23135
23541
|
if (this.disableSort) {
|
|
23136
23542
|
setState(this, '_sortedData', this.state._data);
|
|
@@ -23344,6 +23750,14 @@ class KolTableStateful {
|
|
|
23344
23750
|
},
|
|
23345
23751
|
});
|
|
23346
23752
|
}
|
|
23753
|
+
componentDidLoad() {
|
|
23754
|
+
var _a;
|
|
23755
|
+
(_a = this.tableWcRef) === null || _a === void 0 ? void 0 : _a.addEventListener('kol-selection-change', this.onSelectionChange);
|
|
23756
|
+
}
|
|
23757
|
+
disconnectedCallback() {
|
|
23758
|
+
var _a;
|
|
23759
|
+
(_a = this.tableWcRef) === null || _a === void 0 ? void 0 : _a.removeEventListener('kol-selection-change', this.onSelectionChange);
|
|
23760
|
+
}
|
|
23347
23761
|
componentWillLoad() {
|
|
23348
23762
|
this.validateAllowMultiSort(this._allowMultiSort);
|
|
23349
23763
|
this.validateData(this._data);
|
|
@@ -23354,6 +23768,7 @@ class KolTableStateful {
|
|
|
23354
23768
|
this.validatePagination(this._pagination);
|
|
23355
23769
|
this.validatePaginationPosition(this._paginationPosition);
|
|
23356
23770
|
this.validateSelection(this._selection);
|
|
23771
|
+
this.validateOn(this._on);
|
|
23357
23772
|
}
|
|
23358
23773
|
selectDisplayedData(data, pageSize, page) {
|
|
23359
23774
|
if (typeof pageSize === 'number' && pageSize > 0 && typeof page === 'number' && page > 0) {
|
|
@@ -23402,17 +23817,23 @@ class KolTableStateful {
|
|
|
23402
23817
|
}
|
|
23403
23818
|
getSelectedData(selectedKeys) {
|
|
23404
23819
|
var _a;
|
|
23405
|
-
|
|
23406
|
-
|
|
23820
|
+
const selection = this.state._selection;
|
|
23821
|
+
if (selection) {
|
|
23822
|
+
const keyPropertyName = (_a = selection.keyPropertyName) !== null && _a !== void 0 ? _a : 'id';
|
|
23823
|
+
const data = this.state._sortedData.filter((item) => selectedKeys.includes(item[keyPropertyName]));
|
|
23824
|
+
if ((selection === null || selection === void 0 ? void 0 : selection.multiple) === false) {
|
|
23825
|
+
return data[0];
|
|
23826
|
+
}
|
|
23407
23827
|
if (keyPropertyName)
|
|
23408
|
-
return
|
|
23828
|
+
return data;
|
|
23409
23829
|
}
|
|
23410
|
-
return
|
|
23830
|
+
return null;
|
|
23411
23831
|
}
|
|
23412
23832
|
handleSelectionChange(event, value) {
|
|
23413
23833
|
var _a;
|
|
23414
|
-
|
|
23415
|
-
|
|
23834
|
+
const selection = this.state._selection;
|
|
23835
|
+
if (selection)
|
|
23836
|
+
this.state = Object.assign(Object.assign({}, this.state), { _selection: Object.assign(Object.assign({}, selection), { selectedKeys: typeof value === 'object' ? value : [value] }) });
|
|
23416
23837
|
const selectedData = this.getSelectedData(value);
|
|
23417
23838
|
tryToDispatchKoliBriEvent('selection-change', this.host, selectedData);
|
|
23418
23839
|
if (typeof ((_a = this.state._on) === null || _a === void 0 ? void 0 : _a[Events.onSelectionChange]) === 'function') {
|
|
@@ -23422,8 +23843,7 @@ class KolTableStateful {
|
|
|
23422
23843
|
async getSelection() {
|
|
23423
23844
|
var _a;
|
|
23424
23845
|
const selectedKeys = ((_a = this.state._selection) === null || _a === void 0 ? void 0 : _a.selectedKeys) || [];
|
|
23425
|
-
|
|
23426
|
-
return selectedData;
|
|
23846
|
+
return this.getSelectedData(selectedKeys);
|
|
23427
23847
|
}
|
|
23428
23848
|
render() {
|
|
23429
23849
|
var _a, _b, _c, _d;
|
|
@@ -23434,7 +23854,7 @@ class KolTableStateful {
|
|
|
23434
23854
|
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) })))),
|
|
23435
23855
|
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) })))),
|
|
23436
23856
|
};
|
|
23437
|
-
return (hAsync(Host, { key: '
|
|
23857
|
+
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: {
|
|
23438
23858
|
onSort: (_, payload) => {
|
|
23439
23859
|
this.handleSort(payload);
|
|
23440
23860
|
},
|
|
@@ -23482,7 +23902,7 @@ class KolTableStateful {
|
|
|
23482
23902
|
}; }
|
|
23483
23903
|
}
|
|
23484
23904
|
|
|
23485
|
-
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}";
|
|
23905
|
+
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}";
|
|
23486
23906
|
var KolTableStatelessDefaultStyle0 = defaultStyleCss$7;
|
|
23487
23907
|
|
|
23488
23908
|
class KolTableStateless$1 {
|
|
@@ -23497,7 +23917,7 @@ class KolTableStateless$1 {
|
|
|
23497
23917
|
this._selection = undefined;
|
|
23498
23918
|
}
|
|
23499
23919
|
render() {
|
|
23500
|
-
return (hAsync(Host, { key: '
|
|
23920
|
+
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 })));
|
|
23501
23921
|
}
|
|
23502
23922
|
static get style() { return {
|
|
23503
23923
|
default: KolTableStatelessDefaultStyle0
|
|
@@ -23808,56 +24228,66 @@ class KolTableStateless {
|
|
|
23808
24228
|
}
|
|
23809
24229
|
renderSelectionCell(row, rowIndex) {
|
|
23810
24230
|
var _a, _b, _c;
|
|
23811
|
-
|
|
24231
|
+
const selection = this.state._selection;
|
|
24232
|
+
if (!selection)
|
|
23812
24233
|
return '';
|
|
23813
|
-
const keyPropertyName = (_a =
|
|
23814
|
-
const
|
|
23815
|
-
if (!
|
|
24234
|
+
const keyPropertyName = (_a = selection.keyPropertyName) !== null && _a !== void 0 ? _a : 'id';
|
|
24235
|
+
const firstCellData = (_b = row[0]) === null || _b === void 0 ? void 0 : _b.data;
|
|
24236
|
+
if (!firstCellData)
|
|
23816
24237
|
return '';
|
|
23817
|
-
const keyProperty =
|
|
23818
|
-
const
|
|
23819
|
-
const
|
|
23820
|
-
|
|
23821
|
-
|
|
23822
|
-
|
|
23823
|
-
|
|
23824
|
-
|
|
23825
|
-
|
|
23826
|
-
|
|
23827
|
-
|
|
23828
|
-
|
|
23829
|
-
|
|
23830
|
-
|
|
23831
|
-
|
|
24238
|
+
const keyProperty = firstCellData[keyPropertyName];
|
|
24239
|
+
const isMultiple = selection.multiple || selection.multiple === undefined;
|
|
24240
|
+
const selected = (_c = selection === null || selection === void 0 ? void 0 : selection.selectedKeys) === null || _c === void 0 ? void 0 : _c.includes(keyProperty);
|
|
24241
|
+
const label = selection.label(firstCellData);
|
|
24242
|
+
const props = {
|
|
24243
|
+
name: 'selection',
|
|
24244
|
+
checked: selected,
|
|
24245
|
+
id: keyProperty,
|
|
24246
|
+
['aria-label']: label,
|
|
24247
|
+
};
|
|
24248
|
+
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) => {
|
|
24249
|
+
var _a, _b, _c;
|
|
24250
|
+
const updatedSelectedKeys = !selected
|
|
24251
|
+
? [...((_a = selection === null || selection === void 0 ? void 0 : selection.selectedKeys) !== null && _a !== void 0 ? _a : []), keyProperty]
|
|
24252
|
+
: (_b = selection === null || selection === void 0 ? void 0 : selection.selectedKeys) === null || _b === void 0 ? void 0 : _b.filter((key) => key !== keyProperty);
|
|
24253
|
+
tryToDispatchKoliBriEvent('selection-change', this.host, updatedSelectedKeys);
|
|
24254
|
+
if (typeof ((_c = this.state._on) === null || _c === void 0 ? void 0 : _c[Events.onSelectionChange]) === 'function') {
|
|
24255
|
+
this.state._on[Events.onSelectionChange](event, updatedSelectedKeys !== null && updatedSelectedKeys !== void 0 ? updatedSelectedKeys : []);
|
|
24256
|
+
}
|
|
24257
|
+
} })))) : (hAsync("label", { class: "radio-container" }, hAsync("input", Object.assign({}, props, { type: "radio", onInput: (event) => {
|
|
24258
|
+
var _a;
|
|
24259
|
+
tryToDispatchKoliBriEvent('selection-change', this.host, keyProperty);
|
|
24260
|
+
if (typeof ((_a = this.state._on) === null || _a === void 0 ? void 0 : _a[Events.onSelectionChange]) === 'function') {
|
|
24261
|
+
this.state._on[Events.onSelectionChange](event, keyProperty);
|
|
24262
|
+
}
|
|
24263
|
+
} })))), hAsync(KolTooltipWcTag, { "aria-hidden": "true", class: "input-tooltip", _align: "right", _id: `${keyProperty}-label`, _label: label }))));
|
|
23832
24264
|
}
|
|
23833
24265
|
renderHeadingSelectionCell() {
|
|
23834
|
-
var _a;
|
|
23835
|
-
|
|
23836
|
-
|
|
23837
|
-
|
|
24266
|
+
var _a, _b;
|
|
24267
|
+
const selection = this.state._selection;
|
|
24268
|
+
if (!selection || (!selection.multiple && selection.multiple !== undefined))
|
|
24269
|
+
return hAsync("th", { key: `thead-0` });
|
|
24270
|
+
const keyPropertyName = (_a = selection.keyPropertyName) !== null && _a !== void 0 ? _a : 'id';
|
|
24271
|
+
const selectedKeyLength = (_b = selection.selectedKeys) === null || _b === void 0 ? void 0 : _b.length;
|
|
23838
24272
|
const dataLength = this.state._data.length;
|
|
23839
24273
|
const isChecked = selectedKeyLength === dataLength;
|
|
23840
|
-
const
|
|
23841
|
-
let translationKey = 'kol-table-selection-
|
|
23842
|
-
if (isChecked && !
|
|
24274
|
+
const indeterminate = selectedKeyLength !== 0 && !isChecked;
|
|
24275
|
+
let translationKey = 'kol-table-selection-indeterminate';
|
|
24276
|
+
if (isChecked && !indeterminate) {
|
|
23843
24277
|
translationKey = 'kol-table-selection-none';
|
|
23844
24278
|
}
|
|
23845
24279
|
if (selectedKeyLength === 0) {
|
|
23846
24280
|
translationKey = 'kol-table-selection-all';
|
|
23847
24281
|
}
|
|
23848
|
-
|
|
23849
|
-
|
|
23850
|
-
|
|
23851
|
-
|
|
23852
|
-
|
|
23853
|
-
|
|
23854
|
-
|
|
23855
|
-
|
|
23856
|
-
|
|
23857
|
-
this.state._on[Events.onSelectionChange](event, selections.map((el) => el === null || el === void 0 ? void 0 : el.id));
|
|
23858
|
-
}
|
|
23859
|
-
},
|
|
23860
|
-
} })));
|
|
24282
|
+
const label = translate(translationKey);
|
|
24283
|
+
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) => {
|
|
24284
|
+
var _a;
|
|
24285
|
+
const selections = !isChecked ? this.state._data.map((el) => el === null || el === void 0 ? void 0 : el[keyPropertyName]) : [];
|
|
24286
|
+
tryToDispatchKoliBriEvent('selection-change', this.host, selections);
|
|
24287
|
+
if (typeof ((_a = this.state._on) === null || _a === void 0 ? void 0 : _a[Events.onSelectionChange]) === 'function') {
|
|
24288
|
+
this.state._on[Events.onSelectionChange](event, selections);
|
|
24289
|
+
}
|
|
24290
|
+
} })), hAsync(KolTooltipWcTag, { "aria-hidden": "true", class: "input-tooltip", _align: "right", _id: `${translationKey}-label`, _label: label }))));
|
|
23861
24291
|
}
|
|
23862
24292
|
renderHeadingCell(cell, rowIndex, colIndex) {
|
|
23863
24293
|
let ariaSort = undefined;
|
|
@@ -23897,9 +24327,9 @@ class KolTableStateless {
|
|
|
23897
24327
|
}
|
|
23898
24328
|
render() {
|
|
23899
24329
|
const dataField = this.createDataField(this.state._data, this.state._headerCells);
|
|
23900
|
-
return (hAsync(Host, { key: '
|
|
24330
|
+
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: {
|
|
23901
24331
|
minWidth: this.state._minWidth,
|
|
23902
|
-
} }, hAsync("div", { key: '
|
|
24332
|
+
} }, 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) => {
|
|
23903
24333
|
if (cell.asTd === true) {
|
|
23904
24334
|
return (hAsync("td", { key: `thead-${rowIndex}-${colIndex}-${cell.label}`, class: {
|
|
23905
24335
|
[cell.textAlign]: typeof cell.textAlign === 'string' && cell.textAlign.length > 0,
|
|
@@ -23915,7 +24345,7 @@ class KolTableStateless {
|
|
|
23915
24345
|
else {
|
|
23916
24346
|
return this.renderHeadingCell(cell, rowIndex, colIndex);
|
|
23917
24347
|
}
|
|
23918
|
-
})))))), hAsync("tbody", { key: '
|
|
24348
|
+
})))))), hAsync("tbody", { key: '002e28758e482e0f3d7268066dbaff3974eabb2a' }, dataField.map(this.renderTableRow)), this.renderFoot()))));
|
|
23919
24349
|
}
|
|
23920
24350
|
get host() { return getElement(this); }
|
|
23921
24351
|
static get watchers() { return {
|
|
@@ -24106,11 +24536,11 @@ class KolTabs {
|
|
|
24106
24536
|
} }))));
|
|
24107
24537
|
}
|
|
24108
24538
|
render() {
|
|
24109
|
-
return (hAsync(Host, { key: '
|
|
24539
|
+
return (hAsync(Host, { key: '22ca75e66e106214c5c2217a6a0adab34eda3bae', class: "kol-tabs" }, hAsync("div", { key: '0e277a0bb2bec27aeb29ad0fec3d736936fb4269', ref: (el) => {
|
|
24110
24540
|
this.tabPanelsElement = el;
|
|
24111
24541
|
}, class: {
|
|
24112
24542
|
[`tabs-align-${this.state._align}`]: true,
|
|
24113
|
-
} }, this.renderButtonGroup(), hAsync("div", { key: '
|
|
24543
|
+
} }, this.renderButtonGroup(), hAsync("div", { key: '9fa8c95bf70a8cb254818edb27864975979e5830', class: "tabs-content", ref: this.catchTabPanelHost }))));
|
|
24114
24544
|
}
|
|
24115
24545
|
validateAlign(value) {
|
|
24116
24546
|
validateAlign(this, value);
|
|
@@ -24322,7 +24752,7 @@ class KolTextarea {
|
|
|
24322
24752
|
render() {
|
|
24323
24753
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
24324
24754
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
24325
|
-
return (hAsync(Host, { key: '
|
|
24755
|
+
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: {
|
|
24326
24756
|
resize: this.state._resize,
|
|
24327
24757
|
}, value: this.state._value }))))));
|
|
24328
24758
|
}
|
|
@@ -24609,7 +25039,7 @@ class KolToastContainer {
|
|
|
24609
25039
|
}
|
|
24610
25040
|
}
|
|
24611
25041
|
render() {
|
|
24612
|
-
return (hAsync(Host, { key: '
|
|
25042
|
+
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: {
|
|
24613
25043
|
onClick: () => {
|
|
24614
25044
|
void this.closeAll();
|
|
24615
25045
|
},
|
|
@@ -24661,7 +25091,7 @@ class KolToolbar {
|
|
|
24661
25091
|
this._items = undefined;
|
|
24662
25092
|
}
|
|
24663
25093
|
render() {
|
|
24664
|
-
return (hAsync(Host, { key: '
|
|
25094
|
+
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))));
|
|
24665
25095
|
}
|
|
24666
25096
|
validateLabel(value) {
|
|
24667
25097
|
validateLabel(this, value);
|
|
@@ -24862,7 +25292,7 @@ class KolTooltipWc {
|
|
|
24862
25292
|
this.showOrHideTooltip();
|
|
24863
25293
|
}
|
|
24864
25294
|
render() {
|
|
24865
|
-
return (hAsync(Host, { key: '
|
|
25295
|
+
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 })))));
|
|
24866
25296
|
}
|
|
24867
25297
|
validateAccessKey(value) {
|
|
24868
25298
|
validateAccessKey(this, value);
|
|
@@ -24941,7 +25371,7 @@ class KolTree {
|
|
|
24941
25371
|
this._label = undefined;
|
|
24942
25372
|
}
|
|
24943
25373
|
render() {
|
|
24944
|
-
return (hAsync(Host, { key: '
|
|
25374
|
+
return (hAsync(Host, { key: '8429fa6589ac19c9e91cd8788a46066b239b19da', class: "kol-tree" }, hAsync(KolTreeWcTag, { key: '62e9fbaa416ac2537bfb6609359f27364331ed67', _label: this._label }, hAsync("slot", { key: 'e3c3fbdc4df65a07c8c556b01c94e05056105df8' }))));
|
|
24945
25375
|
}
|
|
24946
25376
|
static get style() { return {
|
|
24947
25377
|
default: KolTreeDefaultStyle0
|
|
@@ -24989,7 +25419,7 @@ class KolTreeItem {
|
|
|
24989
25419
|
return (_b = (await ((_a = this.element) === null || _a === void 0 ? void 0 : _a.isOpen()))) !== null && _b !== void 0 ? _b : false;
|
|
24990
25420
|
}
|
|
24991
25421
|
render() {
|
|
24992
|
-
return (hAsync(KolTreeItemWcTag, { key: '
|
|
25422
|
+
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' })));
|
|
24993
25423
|
}
|
|
24994
25424
|
static get style() { return {
|
|
24995
25425
|
default: KolTreeItemDefaultStyle0
|
|
@@ -25017,9 +25447,6 @@ class KolTreeItemWc {
|
|
|
25017
25447
|
constructor(hostRef) {
|
|
25018
25448
|
registerInstance(this, hostRef);
|
|
25019
25449
|
this.groupId = `tree-group-${nonce()}`;
|
|
25020
|
-
this.renderIcon = (props) => {
|
|
25021
|
-
return hAsync(KolIconTag, { class: "toggle-button-icon", _label: props.label, _icons: props.icon });
|
|
25022
|
-
};
|
|
25023
25450
|
this.level = undefined;
|
|
25024
25451
|
this.state = {
|
|
25025
25452
|
_active: false,
|
|
@@ -25035,16 +25462,13 @@ class KolTreeItemWc {
|
|
|
25035
25462
|
}
|
|
25036
25463
|
render() {
|
|
25037
25464
|
const { _href, _active, _hasChildren, _open, _label } = this.state;
|
|
25038
|
-
return (hAsync(Host, { key: '
|
|
25465
|
+
return (hAsync(Host, { key: '80b4d8b5633b98cf7ebc12c3c9e50cd5a2617d4a', onSlotchange: this.handleSlotchange.bind(this), class: "kol-tree-item-wc" }, hAsync("li", { key: '0dc520638d2452cc5687e192300192b22322dd25', class: "tree-item", style: {
|
|
25039
25466
|
'--level': `${this.level}`,
|
|
25040
|
-
} }, hAsync(KolLinkWcTag, { key: '
|
|
25467
|
+
} }, hAsync(KolLinkWcTag, { key: '6cf78c51ec92daaa5d29830eb1e6dd0147c12ee4', class: {
|
|
25041
25468
|
'tree-link': true,
|
|
25042
25469
|
'first-level': this.level === 0,
|
|
25043
25470
|
active: Boolean(_active),
|
|
25044
|
-
}, _href: _href, _label: "", _role: "treeitem", _tabIndex: _active ? 0 : -1, _ariaExpanded: _open, _ariaOwns: _hasChildren ? this.groupId : undefined, ref: (element) => (this.linkElement = element) }, hAsync("span", { key: '
|
|
25045
|
-
icon: `codicon codicon-${_open ? 'chevron-down' : 'chevron-right'}`,
|
|
25046
|
-
label: _open ? 'Vorschläge öffnen' : 'Vorschläge schließen',
|
|
25047
|
-
}))), ' ', _label)), hAsync("ul", { key: '2b414e97ffa358b9332573194d450cf8c548a6d6', hidden: !_hasChildren || !_open, role: "group", id: this.groupId }, hAsync("slot", { key: '8ea7a3d44e0acb4626b23070dd044b17688313c5' })))));
|
|
25471
|
+
}, _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' })))));
|
|
25048
25472
|
}
|
|
25049
25473
|
validateActive(value) {
|
|
25050
25474
|
validateActive(this, value || false);
|
|
@@ -25149,7 +25573,7 @@ class KolTreeWc {
|
|
|
25149
25573
|
validateLabel(this, value);
|
|
25150
25574
|
}
|
|
25151
25575
|
render() {
|
|
25152
|
-
return (hAsync(Host, { key: '
|
|
25576
|
+
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' })))));
|
|
25153
25577
|
}
|
|
25154
25578
|
static isTreeItem(element) {
|
|
25155
25579
|
return (element === null || element === void 0 ? void 0 : element.tagName) === KolTreeItemTag.toUpperCase();
|
|
@@ -25344,7 +25768,7 @@ class KolVersion {
|
|
|
25344
25768
|
};
|
|
25345
25769
|
}
|
|
25346
25770
|
render() {
|
|
25347
|
-
return (hAsync(Host, { key: '
|
|
25771
|
+
return (hAsync(Host, { key: 'cf55dcd0e6bd1ba92ded64e876dcb98a31c0a549', class: "kol-version" }, hAsync(KolBadgeTag, { key: '0a38f83859051a625c416a50acc1a0ab40c69247', _color: "#bec5c9", _icons: {
|
|
25348
25772
|
left: { icon: 'codicon codicon-versions', label: translate('kol-version') },
|
|
25349
25773
|
}, _label: this.state._label })));
|
|
25350
25774
|
}
|
|
@@ -25424,6 +25848,7 @@ registerComponents([
|
|
|
25424
25848
|
KolProcess,
|
|
25425
25849
|
KolQuote,
|
|
25426
25850
|
KolSelect,
|
|
25851
|
+
KolSingleSelect,
|
|
25427
25852
|
KolSkipNav,
|
|
25428
25853
|
KolSpanWc,
|
|
25429
25854
|
KolSpin,
|