@public-ui/hydrate 1.7.16 → 1.7.18
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 +128 -112
- package/package.json +7 -4
package/dist/index.js
CHANGED
|
@@ -7311,21 +7311,16 @@ const getKoliBri$1 = () => {
|
|
|
7311
7311
|
};
|
|
7312
7312
|
const initKoliBri = () => {
|
|
7313
7313
|
initMeta();
|
|
7314
|
-
|
|
7315
|
-
Log.debug(`
|
|
7314
|
+
Log.debug(`
|
|
7316
7315
|
,--. ,--. ,--. ,--. ,-----. ,--.
|
|
7317
7316
|
| .' / ,---. | | \`--' | |) /_ ,--.--. \`--'
|
|
7318
7317
|
| . ' | .-. | | | ,--. | .-. \\ | .--' ,--.
|
|
7319
7318
|
| |\\ \\ | '-' | | | | | | '--' / | | | |
|
|
7320
7319
|
\`--' \`--´ \`---´ \`--' \`--' \`------´ \`--' \`--'
|
|
7321
|
-
🚹 The accessible HTML-Standard | 👉 https://public-ui.github.io | 1.7.
|
|
7320
|
+
🚹 The accessible HTML-Standard | 👉 https://public-ui.github.io | 1.7.18
|
|
7322
7321
|
`, {
|
|
7323
|
-
|
|
7324
|
-
|
|
7325
|
-
}
|
|
7326
|
-
else {
|
|
7327
|
-
console.warn(`You can only initialize KoliBri once.`);
|
|
7328
|
-
}
|
|
7322
|
+
forceLog: true,
|
|
7323
|
+
});
|
|
7329
7324
|
};
|
|
7330
7325
|
const renderDevAdvice = () => {
|
|
7331
7326
|
if (getKoliBri$1().adviceShown !== true) {
|
|
@@ -9636,6 +9631,27 @@ const validateTooltipAlign = (component, value) => {
|
|
|
9636
9631
|
validateAlignment(component, '_tooltipAlign', value);
|
|
9637
9632
|
};
|
|
9638
9633
|
|
|
9634
|
+
let KolAlertTag = 'kol-alert';
|
|
9635
|
+
let KolAlertWcTag = 'kol-alert-wc';
|
|
9636
|
+
let KolAvatarWcTag = 'kol-avatar-wc';
|
|
9637
|
+
let KolBadgeTag = 'kol-badge';
|
|
9638
|
+
let KolButtonGroupWcTag = 'kol-button-group-wc';
|
|
9639
|
+
let KolButtonLinkTextSwitchTag = 'kol-button-link-text-switch';
|
|
9640
|
+
let KolButtonTag = 'kol-button';
|
|
9641
|
+
let KolButtonWcTag = 'kol-button-wc';
|
|
9642
|
+
let KolHeadingWcTag = 'kol-heading-wc';
|
|
9643
|
+
let KolIconTag = 'kol-icon';
|
|
9644
|
+
let KolIndentedTextTag = 'kol-indented-text';
|
|
9645
|
+
let KolInputTag = 'kol-input';
|
|
9646
|
+
let KolInputRadioTag = 'kol-input-radio';
|
|
9647
|
+
let KolLinkTag = 'kol-link';
|
|
9648
|
+
let KolLinkWcTag = 'kol-link-wc';
|
|
9649
|
+
let KolPaginationTag = 'kol-pagination';
|
|
9650
|
+
let KolSelectTag = 'kol-select';
|
|
9651
|
+
let KolSpanWcTag = 'kol-span-wc';
|
|
9652
|
+
let KolToastTag = 'kol-toast';
|
|
9653
|
+
let KolTooltipWcTag = 'kol-tooltip-wc';
|
|
9654
|
+
|
|
9639
9655
|
const defaultStyleCss$J = "/*!@:host*/.sc-kol-abbr-default-h{--a11y-min-size:44px;background-color:white;color:black;font-family:Verdana}/*!@**/*.sc-kol-abbr-default{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}/*!@[role=button],\nbutton:not([role=link]),\n.kol-input .input*/[role=button].sc-kol-abbr-default,button.sc-kol-abbr-default:not([role=link]),.kol-input.sc-kol-abbr-default .input.sc-kol-abbr-default{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}/*!@a,\nbutton,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\ninput,\noption,\nselect,\ntextarea*/a.sc-kol-abbr-default,button.sc-kol-abbr-default,h1.sc-kol-abbr-default,h2.sc-kol-abbr-default,h3.sc-kol-abbr-default,h4.sc-kol-abbr-default,h5.sc-kol-abbr-default,h6.sc-kol-abbr-default,input.sc-kol-abbr-default,option.sc-kol-abbr-default,select.sc-kol-abbr-default,textarea.sc-kol-abbr-default{font-family:inherit;font-size:inherit}/*!@.visually-hidden*/.visually-hidden.sc-kol-abbr-default{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}/*!@:is(a, button)*/.sc-kol-abbr-default:is(a,button).sc-kol-abbr-default{background-color:transparent;border:none;margin:0;padding:0;width:100%}/*!@[hidden]*/[hidden].sc-kol-abbr-default{display:none !important}/*!@:host*/.sc-kol-abbr-default-h{max-width:100%}/*!@**/*.sc-kol-abbr-default{box-sizing:border-box}/*!@.kol-span-wc*/.kol-span-wc.sc-kol-abbr-default{display:grid;place-items:center}/*!@.kol-span-wc > span*/.kol-span-wc.sc-kol-abbr-default>span.sc-kol-abbr-default{display:flex;place-items:center}/*!@a,\nbutton*/a.sc-kol-abbr-default,button.sc-kol-abbr-default{cursor:pointer}/*!@.icon-only > .kol-span-wc > span > span*/.icon-only.sc-kol-abbr-default>.kol-span-wc.sc-kol-abbr-default>span.sc-kol-abbr-default>span.sc-kol-abbr-default{display:none}/*!@.hidden*/.hidden.sc-kol-abbr-default{display:none;visibility:hidden}/*!@:host > abbr*/.sc-kol-abbr-default-h>abbr.sc-kol-abbr-default{cursor:help}";
|
|
9640
9656
|
var KolAbbrDefaultStyle0 = defaultStyleCss$J;
|
|
9641
9657
|
|
|
@@ -9652,7 +9668,7 @@ class KolAbbr {
|
|
|
9652
9668
|
};
|
|
9653
9669
|
}
|
|
9654
9670
|
render() {
|
|
9655
|
-
return (hAsync(Host, { key: '
|
|
9671
|
+
return (hAsync(Host, { key: '4771794fd31f78288566cf35fb59a9907d10c816', class: "kol-abbr" }, hAsync("abbr", { key: 'f6ad6e44d01d7ce413dc7bd260efc9655ef41cdc', "aria-labelledby": this.nonce, role: "definition", tabindex: "0", title: this.state._label }, hAsync("span", { key: 'f40a47d7978f5700635e240a7f640b627a3d0718', title: "" }, hAsync("slot", { key: '6f12b398db6182f29f9c5429f33be8e9ff85caaa' }))), hAsync(KolTooltipWcTag, { key: '93e2bf4bab104f89c336566a4705d9af44f9c515', _align: this.state._tooltipAlign, _id: this.nonce, _label: this.state._label })));
|
|
9656
9672
|
}
|
|
9657
9673
|
validateLabel(value) {
|
|
9658
9674
|
validateLabel(this, value, {
|
|
@@ -9741,10 +9757,10 @@ class KolAccordion {
|
|
|
9741
9757
|
};
|
|
9742
9758
|
}
|
|
9743
9759
|
render() {
|
|
9744
|
-
return (hAsync(Host, { key: '
|
|
9760
|
+
return (hAsync(Host, { key: '8bc113713fe44637f69d401d0c0150de089c5db8', class: "kol-accordion" }, hAsync("div", { key: 'd2c04a7afd820d3b4cb3e06c850f739077fe5df6', class: {
|
|
9745
9761
|
accordion: true,
|
|
9746
9762
|
open: this.state._open === true,
|
|
9747
|
-
} }, hAsync(
|
|
9763
|
+
} }, hAsync(KolHeadingWcTag, { key: 'af17a3f5d59b5b872e31d447fa79b1fe5be31a53', _label: "", _level: this.state._level }, hAsync(KolButtonWcTag, { key: '1389b5c20e17568128e8e8e1758071d2161605a2', ref: this.catchRef, _ariaControls: this.nonce, _ariaExpanded: this.state._open, _icons: this.state._open ? 'codicon codicon-remove' : 'codicon codicon-add', _label: this.state._label, _on: { onClick: this.onClick } })), hAsync("div", { key: '7e96b34d45b60146ed4cb1af785a84087db75397', class: "header" }, hAsync("slot", { key: '0e0c9ab23ee4eb677ac45296444392649aa3af1d', name: "header" })), hAsync("div", { key: '30f99e86b974a4eeba8818deb1e27b8fe51c1779', class: "wrapper" }, hAsync("div", { key: '4fa3def2b2aa78c99ad241e0f6e47afc06dacce8', class: "animation-wrapper" }, hAsync("div", { key: '14d104214d253f936f75912b0d82318a856ba0d5', "aria-hidden": this.state._open === false ? 'true' : undefined, class: "content", id: this.nonce }, hAsync("slot", { key: 'deb78cc20c268e69c534e2d0c92db655727fc221', name: "content" }), " ", hAsync("slot", { key: '4d175471fd64ca9b32f2c254a4fd6f956e99b02a' })))))));
|
|
9748
9764
|
}
|
|
9749
9765
|
validateHeading(value) {
|
|
9750
9766
|
this.validateLabel(value);
|
|
@@ -9818,7 +9834,7 @@ class KolAlert {
|
|
|
9818
9834
|
};
|
|
9819
9835
|
}
|
|
9820
9836
|
render() {
|
|
9821
|
-
return (hAsync(Host, { key: '
|
|
9837
|
+
return (hAsync(Host, { key: 'cf53b5e010a60b8ef0017671a7da5b63bf54589b', class: "kol-alert" }, hAsync(KolAlertWcTag, { key: '338689038aa0f85f8b86488d742570e966b91a8c', _alert: this._alert, _hasCloser: this._hasCloser, _label: this._label || this._heading, _level: this._level, _on: this._on, _type: this._type, _variant: this._variant }, hAsync("slot", { key: '0c977d0f01a1918dc20207b35714f6cef6034554' }))));
|
|
9822
9838
|
}
|
|
9823
9839
|
static get style() { return {
|
|
9824
9840
|
default: KolAlertDefaultStyle0
|
|
@@ -12355,7 +12371,7 @@ const validateHasCloser = (component, value) => {
|
|
|
12355
12371
|
};
|
|
12356
12372
|
|
|
12357
12373
|
const Icon = (props) => {
|
|
12358
|
-
return hAsync(
|
|
12374
|
+
return hAsync(KolIconTag, { class: "heading-icon", _ariaLabel: typeof props.label === 'string' && props.label.length > 0 ? '' : props.ariaLabel, _icons: props.icon });
|
|
12359
12375
|
};
|
|
12360
12376
|
const AlertIcon = (props) => {
|
|
12361
12377
|
switch (props.type) {
|
|
@@ -12408,12 +12424,12 @@ class KolAlertWc {
|
|
|
12408
12424
|
this.validateAlert(false);
|
|
12409
12425
|
}, 10000);
|
|
12410
12426
|
}
|
|
12411
|
-
return (hAsync(Host, { key: '
|
|
12427
|
+
return (hAsync(Host, { key: 'f503dfe9179509f772a0c18ae8f2dbdf1c18c181', class: {
|
|
12412
12428
|
'kol-alert-wc': true,
|
|
12413
12429
|
[this.state._type]: true,
|
|
12414
12430
|
[this.state._variant]: true,
|
|
12415
12431
|
hasCloser: !!this.state._hasCloser,
|
|
12416
|
-
}, role: this.state._alert ? 'alert' : undefined }, hAsync("div", { key: '
|
|
12432
|
+
}, role: this.state._alert ? 'alert' : undefined }, hAsync("div", { key: '7440476a737e410f0a8a0b72b3de0138630b7994', class: "heading" }, hAsync(AlertIcon, { key: 'ad9792dbafba717d9d49d839d75b1a9343a3b20a', label: this.state._label, type: this.state._type }), hAsync("div", { key: 'a580afb1a63086617d5db6a45da80bcd38deb48d' }, typeof this.state._label === 'string' && ((_a = this.state._label) === null || _a === void 0 ? void 0 : _a.length) > 0 && (hAsync(KolHeadingWcTag, { _label: this.state._label, _level: this.state._level })), this.state._variant === 'msg' && (hAsync("div", { class: "content" }, hAsync("slot", null)))), this.state._hasCloser && (hAsync(KolButtonWcTag, { class: "close", _hideLabel: true, _icons: {
|
|
12417
12433
|
left: {
|
|
12418
12434
|
icon: 'codicon codicon-close',
|
|
12419
12435
|
},
|
|
@@ -12491,7 +12507,7 @@ class KolAvatar {
|
|
|
12491
12507
|
this._label = undefined;
|
|
12492
12508
|
}
|
|
12493
12509
|
render() {
|
|
12494
|
-
return (hAsync(Host, { key: '
|
|
12510
|
+
return (hAsync(Host, { key: '93dbc7d5bfa8c10984fb0ebf29cca0b7fddf5c25', class: "kol-avatar" }, hAsync(KolAvatarWcTag, { key: '01d73b3512e442809fb65fd0f35b3b24f4da758e', _src: this._src, _label: this._label })));
|
|
12495
12511
|
}
|
|
12496
12512
|
static get style() { return {
|
|
12497
12513
|
default: KolAvatarDefaultStyle0
|
|
@@ -13151,16 +13167,16 @@ class KolBadge {
|
|
|
13151
13167
|
};
|
|
13152
13168
|
}
|
|
13153
13169
|
renderSmartButton(props) {
|
|
13154
|
-
return (hAsync(
|
|
13170
|
+
return (hAsync(KolButtonWcTag, { _ariaControls: this.id, _customClass: props._customClass, _disabled: props._disabled, _hideLabel: true, _icons: props._icons || props._icon, _id: props._id, _label: props._label, _on: props._on, _tooltipAlign: props._tooltipAlign, _variant: props._variant }));
|
|
13155
13171
|
}
|
|
13156
13172
|
render() {
|
|
13157
13173
|
const hasSmartButton = typeof this.state._smartButton === 'object' && this.state._smartButton !== null;
|
|
13158
|
-
return (hAsync(Host, { key: '
|
|
13174
|
+
return (hAsync(Host, { key: '66f7af7a7c0b6dd9ad3fa5f9749beac9803a88cc', class: "kol-badge" }, hAsync("span", { key: '96ed66661294cb486970adbf4b1660a4af988686', class: {
|
|
13159
13175
|
'smart-button': typeof this.state._smartButton === 'object' && this.state._smartButton !== null,
|
|
13160
13176
|
}, style: {
|
|
13161
13177
|
backgroundColor: this.bgColorStr,
|
|
13162
13178
|
color: this.colorStr,
|
|
13163
|
-
} }, hAsync(
|
|
13179
|
+
} }, hAsync(KolSpanWcTag, { key: '9cef3a07368cd843c4917d4b9deada0af1ef1a62', id: hasSmartButton ? this.id : undefined, _allowMarkdown: true, _hideLabel: this._hideLabel || this._iconOnly, _icons: this._icons || this._icon, _label: this._label }), hasSmartButton && this.renderSmartButton(this.state._smartButton))));
|
|
13164
13180
|
}
|
|
13165
13181
|
validateColor(value) {
|
|
13166
13182
|
validateColor(this, value, {
|
|
@@ -13237,7 +13253,7 @@ class KolBreadcrumb {
|
|
|
13237
13253
|
this.renderLink = (link, index) => {
|
|
13238
13254
|
const lastIndex = this.state._links.length - 1;
|
|
13239
13255
|
const hideLabel = link._iconOnly || link._hideLabel;
|
|
13240
|
-
return (hAsync("li", { key: index }, index !== 0 && hAsync(
|
|
13256
|
+
return (hAsync("li", { key: index }, index !== 0 && hAsync(KolIconTag, { _label: "", _icons: "codicon codicon-chevron-right" }), index === lastIndex ? (hAsync("span", null, hideLabel ? (hAsync(KolIconTag, { _label: link._label, _icons: typeof link._icon === 'string' ? link._icon : 'codicon codicon-symbol-event' })) : (hAsync(Fragment, null, link._label)))) : (hAsync(KolLinkTag, Object.assign({}, link)))));
|
|
13241
13257
|
};
|
|
13242
13258
|
this._ariaLabel = undefined;
|
|
13243
13259
|
this._label = undefined;
|
|
@@ -13249,7 +13265,7 @@ class KolBreadcrumb {
|
|
|
13249
13265
|
}
|
|
13250
13266
|
render() {
|
|
13251
13267
|
var _a;
|
|
13252
|
-
return (hAsync(Host, { key: '
|
|
13268
|
+
return (hAsync(Host, { key: '8880ba6864727f37ca98f155989fc192487cf720', class: "kol-breadcrumb" }, hAsync("nav", { key: 'a5d2f04178c244986afd5f877ce0459a24b118bf', "aria-label": (_a = this.state._label) !== null && _a !== void 0 ? _a : '' }, hAsync("ul", { key: '548cafad0f76d3ba708bf8388596f45129530247' }, this.state._links.length === 0 && (hAsync("li", null, hAsync(KolIconTag, { _label: "", _icons: "codicon codicon-home" }), "\u2026")), this.state._links.map(this.renderLink)))));
|
|
13253
13269
|
}
|
|
13254
13270
|
validateAriaLabel(value) {
|
|
13255
13271
|
this.validateLabel(value);
|
|
@@ -13332,11 +13348,11 @@ class KolButton {
|
|
|
13332
13348
|
this._variant = 'normal';
|
|
13333
13349
|
}
|
|
13334
13350
|
render() {
|
|
13335
|
-
return (hAsync(Host, { key: '
|
|
13351
|
+
return (hAsync(Host, { key: '00077208a24dc1b778dcfd29e2133f81bdf4639b', class: "kol-button" }, hAsync(KolButtonWcTag, { key: '2849b258f5eccc021056db37017c3348077e7f18', ref: this.catchRef, class: {
|
|
13336
13352
|
button: true,
|
|
13337
13353
|
[this._variant]: this._variant !== 'custom',
|
|
13338
13354
|
[this._customClass]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,
|
|
13339
|
-
}, _accessKey: this._accessKey, _ariaControls: this._ariaControls, _ariaCurrent: this._ariaCurrent, _ariaExpanded: this._ariaExpanded, _ariaLabel: this._ariaLabel, _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _hideLabel: this._hideLabel || this._iconOnly, _icons: this._icons || this._icon, _iconAlign: this._iconAlign, _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: '
|
|
13355
|
+
}, _accessKey: this._accessKey, _ariaControls: this._ariaControls, _ariaCurrent: this._ariaCurrent, _ariaExpanded: this._ariaExpanded, _ariaLabel: this._ariaLabel, _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _hideLabel: this._hideLabel || this._iconOnly, _icons: this._icons || this._icon, _iconAlign: this._iconAlign, _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: '1ca9de6ce3d380c4d9ac8d426c1ebe74b2714e7c', name: "expert", slot: "expert" }))));
|
|
13340
13356
|
}
|
|
13341
13357
|
get host() { return getElement(this); }
|
|
13342
13358
|
static get style() { return {
|
|
@@ -13385,7 +13401,7 @@ class KolButtonGroup {
|
|
|
13385
13401
|
registerInstance(this, hostRef);
|
|
13386
13402
|
}
|
|
13387
13403
|
render() {
|
|
13388
|
-
return (hAsync(Host, { key: '
|
|
13404
|
+
return (hAsync(Host, { key: '3a66c19eb6512dbcc014b367a2dbda10f88b7dd6', class: "kol-button-group" }, hAsync(KolButtonGroupWcTag, { key: '002c90e0d0b16b44d60d9566839c67d40987a697' }, hAsync("slot", { key: 'f99161fceb50393a7564761be5a9530850c467bf' }))));
|
|
13389
13405
|
}
|
|
13390
13406
|
static get style() { return {
|
|
13391
13407
|
default: KolButtonGroupDefaultStyle0
|
|
@@ -13452,7 +13468,7 @@ class KolButtonLink {
|
|
|
13452
13468
|
this._value = undefined;
|
|
13453
13469
|
}
|
|
13454
13470
|
render() {
|
|
13455
|
-
return (hAsync(Host, { key: '
|
|
13471
|
+
return (hAsync(Host, { key: 'ce8b4d98428c96815cc218537bbeb256ee9b01c1', class: "kol-button-link" }, hAsync(KolButtonWcTag, { key: 'e88ba13498756fb0bf85d6069aa59eb8d2786527', ref: this.catchRef, _accessKey: this._accessKey, _ariaControls: this._ariaControls, _ariaCurrent: this._ariaCurrent, _ariaExpanded: this._ariaExpanded, _ariaLabel: this._ariaLabel, _ariaSelected: this._ariaSelected, _disabled: this._disabled, _icons: this._icons || this._icon, _hideLabel: this._hideLabel || this._iconOnly, _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: '97fe1ff646c6e5f869f9be1fc1db64aedb3a4a53', name: "expert", slot: "expert" }))));
|
|
13456
13472
|
}
|
|
13457
13473
|
get host() { return getElement(this); }
|
|
13458
13474
|
static get style() { return {
|
|
@@ -13493,13 +13509,13 @@ class KolButtonLink {
|
|
|
13493
13509
|
class KolButtonLinkTextSwitch {
|
|
13494
13510
|
constructor(hostRef) {
|
|
13495
13511
|
registerInstance(this, hostRef);
|
|
13496
|
-
this.button = (button) => hAsync(
|
|
13497
|
-
this.link = (link) => hAsync(
|
|
13498
|
-
this.text = (text) => hAsync(
|
|
13512
|
+
this.button = (button) => hAsync(KolButtonWcTag, Object.assign({}, button));
|
|
13513
|
+
this.link = (link) => hAsync(KolLinkWcTag, Object.assign({}, link));
|
|
13514
|
+
this.text = (text) => hAsync(KolSpanWcTag, Object.assign({}, text));
|
|
13499
13515
|
this._link = undefined;
|
|
13500
13516
|
}
|
|
13501
13517
|
render() {
|
|
13502
|
-
return hAsync(Host, { key: '
|
|
13518
|
+
return hAsync(Host, { key: 'b2ec27cbc1b52705d81d7447380a651690156b85', class: "kol-button-link-text-switch" }, this.renderContent());
|
|
13503
13519
|
}
|
|
13504
13520
|
renderContent() {
|
|
13505
13521
|
if (this._link._on) {
|
|
@@ -13936,13 +13952,13 @@ class AssociatedInputController {
|
|
|
13936
13952
|
class KolButtonWc {
|
|
13937
13953
|
render() {
|
|
13938
13954
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
13939
|
-
return (hAsync(Host, { key: '
|
|
13955
|
+
return (hAsync(Host, { key: '1f56e34b632d15e744fc953534c2bedd6fd2fae6', class: "kol-button-wc" }, hAsync("button", Object.assign({ key: 'e7b2c3489e47f8b1346715ddd26b442ea65b92ff', ref: this.catchRef, accessKey: this.state._accessKey, "aria-controls": this.state._ariaControls, "aria-current": mapStringOrBoolean2String(this.state._ariaCurrent), "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: {
|
|
13940
13956
|
button: true,
|
|
13941
13957
|
[this.state._variant]: this.state._variant !== 'custom',
|
|
13942
13958
|
[this.state._customClass]: this.state._variant === 'custom' && typeof this.state._customClass === 'string' && this.state._customClass.length > 0,
|
|
13943
13959
|
'icon-only': this.state._hideLabel === true,
|
|
13944
13960
|
'hide-label': this.state._hideLabel === true,
|
|
13945
|
-
}, 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(
|
|
13961
|
+
}, 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: '8cedd1ffd632930961c9c335818d25a4dca104e6', class: "button-inner", _icons: this.state._icons, _hideLabel: this.state._hideLabel, _label: hasExpertSlot ? '' : this.state._label }, hAsync("slot", { key: 'afe64c3f3878967cac6143044dd8554e01359b15', name: "expert", slot: "expert" }))), hAsync(KolTooltipWcTag, { key: 'afb489925d0b2a6acd671e9f2780d15dca65d0fc', "aria-hidden": "true", hidden: hasExpertSlot || !this.state._hideLabel, _align: this.state._tooltipAlign, _label: typeof this.state._label === 'string' ? this.state._label : '' })));
|
|
13946
13962
|
}
|
|
13947
13963
|
constructor(hostRef) {
|
|
13948
13964
|
registerInstance(this, hostRef);
|
|
@@ -14204,7 +14220,7 @@ class KolCard {
|
|
|
14204
14220
|
};
|
|
14205
14221
|
}
|
|
14206
14222
|
render() {
|
|
14207
|
-
return (hAsync(Host, { key: '
|
|
14223
|
+
return (hAsync(Host, { key: 'da32b0ed01193f42e03b2f832888f2f8f43da04f', class: "kol-card" }, hAsync("div", { key: 'ebd95e2fa5aa4284d849b4d224eecf57a6e1865e', class: "card" }, hAsync("div", { key: 'c9945158ac65a2349b6c98771e22b0360d1958e8', class: "header" }, hAsync(KolHeadingWcTag, { key: '95c331fb65b35f817d40b9f2dcb6b895474f3dcf', _label: this.state._label, _level: this.state._level }), hAsync("slot", { key: '4079d18c6d704b9da532e5c67b34c0634275b65d', name: "header" })), hAsync("div", { key: '88d3091a5ff8e470a039b432ff80133d30705ff9', class: "content" }, hAsync("slot", { key: '1d1a3dd3ff5309bb469b511a313b2a10b77adf28', name: "content" }), hAsync("slot", { key: 'f98e0f4bcb8779315d1dc1a62e01ae080e6bf1b9' })), this.state._hasFooter && (hAsync("div", { class: "footer" }, hAsync("slot", { name: "footer" }))), this.state._hasCloser && (hAsync(KolButtonWcTag, { class: "close", _hideLabel: true, _icons: {
|
|
14208
14224
|
left: {
|
|
14209
14225
|
icon: 'codicon codicon-close',
|
|
14210
14226
|
},
|
|
@@ -14375,9 +14391,9 @@ class KolDetails {
|
|
|
14375
14391
|
};
|
|
14376
14392
|
}
|
|
14377
14393
|
render() {
|
|
14378
|
-
return (hAsync(Host, { key: '
|
|
14394
|
+
return (hAsync(Host, { key: '7e913ad8f8e1e277ab20ba4e4404cf927e51bf1e', class: "kol-details" }, hAsync("details", { key: '395cb2b8246bf5b97d96d538bbadb356b2712fa8', ref: (el) => {
|
|
14379
14395
|
this.detailsElement = el;
|
|
14380
|
-
}, onToggle: this.handleToggle }, hAsync("summary", { key: '
|
|
14396
|
+
}, onToggle: this.handleToggle }, hAsync("summary", { key: '8d68e6a9661b189f4d51a84fedafacdd83b47643', ref: this.catchRef }, this.state._open ? (hAsync(KolIconTag, { _label: "", _icons: "codicon codicon-chevron-down" })) : (hAsync(KolIconTag, { _label: "", _icons: "codicon codicon-chevron-right" })), hAsync("span", { key: '56161ba3a9556a5736911b981c25257665ea06a4' }, this.state._label)), hAsync("div", { key: '616d04bc148caaab97ecf6dfc40eb66173d20e49', "aria-hidden": this.state._open === false ? 'true' : undefined, class: "content", ref: (element) => (this.contentElement = element) }, hAsync(KolIndentedTextTag, { key: 'eb523a93b16331ebd3497c4ab0802007b6e3c752' }, hAsync("slot", { key: '985cea4fe6e0be5ac2d8c2d4331c8a0624c7ca0d' }))))));
|
|
14381
14397
|
}
|
|
14382
14398
|
validateLabel(value) {
|
|
14383
14399
|
validateLabel(this, value, {
|
|
@@ -14475,10 +14491,10 @@ class KolForm {
|
|
|
14475
14491
|
this.state = {};
|
|
14476
14492
|
}
|
|
14477
14493
|
render() {
|
|
14478
|
-
return (hAsync(Host, { key: '
|
|
14494
|
+
return (hAsync(Host, { key: 'e9a4994caddee31eb645e66619838f6d384416c4', class: "kol-form" }, this._errorList && this._errorList.length > 0 && (hAsync(KolAlertTag, { _type: "error" }, translate('kol-error-list-message'), hAsync("nav", { "aria-label": translate('kol-error-list') }, hAsync("ul", null, this._errorList.map((error, index) => (hAsync("li", { key: index }, hAsync(KolLinkTag, { _href: error.selector, _label: error.message, _on: { onClick: this.handleLinkClick }, ref: (el) => {
|
|
14479
14495
|
if (index === 0)
|
|
14480
14496
|
this.errorListElement = el;
|
|
14481
|
-
} })))))))), hAsync("form", { key: '
|
|
14497
|
+
} })))))))), hAsync("form", { key: '4f12d5e388779b42990da9bd6769ac8fe3b3e90b', method: "post", onSubmit: this.onSubmit, onReset: this.onReset, autoComplete: "off", noValidate: true }, this.state._requiredText === true ? (hAsync("p", null, hAsync(KolIndentedTextTag, null, translate('kol-form-description')))) : typeof this.state._requiredText === 'string' && this.state._requiredText.length > 0 ? (hAsync("p", null, hAsync(KolIndentedTextTag, null, this.state._requiredText))) : null, hAsync("slot", { key: 'c26d0d28248fd890f85693eb4a15f1f52bf74bf3' }))));
|
|
14482
14498
|
}
|
|
14483
14499
|
focusErrorList() {
|
|
14484
14500
|
setTimeout(() => {
|
|
@@ -14542,7 +14558,7 @@ class KolHeading {
|
|
|
14542
14558
|
this._secondaryHeadline = undefined;
|
|
14543
14559
|
}
|
|
14544
14560
|
render() {
|
|
14545
|
-
return (hAsync(
|
|
14561
|
+
return (hAsync(KolHeadingWcTag, { key: '96f140bb13ef12cfb3b0f8eb27605578a1cd59a6', _label: this._label, _level: this._level, _secondaryHeadline: this._secondaryHeadline, class: "kol-heading" }, hAsync("slot", { key: '00ee080ce48966b7e2b57fb1ebe9739627d6e205' })));
|
|
14546
14562
|
}
|
|
14547
14563
|
static get style() { return {
|
|
14548
14564
|
default: KolHeadingDefaultStyle0
|
|
@@ -14726,7 +14742,7 @@ class KolIconFontAwesome {
|
|
|
14726
14742
|
this._part = undefined;
|
|
14727
14743
|
}
|
|
14728
14744
|
render() {
|
|
14729
|
-
return (hAsync(Host, { key: '
|
|
14745
|
+
return (hAsync(Host, { key: '2476138b883808e99d86524d7b04fdb2918b4729', class: "kol-icon-font-awesome" }, hAsync(KolIconTag, { key: 'efa2e47112189c743891a6bed006f3cb604e129f', exportparts: `icon${typeof this._part === 'string' ? `,${this._part}` : ''}`, _ariaLabel: this._ariaLabel, _icon: typeof this._prefix === 'string' && typeof this._icon === 'string' ? `${this._prefix} fa-${this._icon}` : undefined })));
|
|
14730
14746
|
}
|
|
14731
14747
|
static get cmpMeta() { return {
|
|
14732
14748
|
"$flags$": 0,
|
|
@@ -14751,7 +14767,7 @@ class KolIconIcofont {
|
|
|
14751
14767
|
this._part = undefined;
|
|
14752
14768
|
}
|
|
14753
14769
|
render() {
|
|
14754
|
-
return (hAsync(Host, { key: '
|
|
14770
|
+
return (hAsync(Host, { key: 'edec0b3bfdcfe6d2b7346adca3cbf8eb661f9ddc', class: "kol-icon-icofont" }, hAsync(KolIconTag, { key: 'e3c00132a29cdaa1b5e3a11ebd7d2e62a4905436', exportparts: `icon${typeof this._part === 'string' ? `,${this._part}` : ''}`, _ariaLabel: this._ariaLabel, _icon: typeof this._icon === 'string' ? `icofont-${this._icon}` : undefined })));
|
|
14755
14771
|
}
|
|
14756
14772
|
static get cmpMeta() { return {
|
|
14757
14773
|
"$flags$": 0,
|
|
@@ -14871,7 +14887,7 @@ class KolIndentedText {
|
|
|
14871
14887
|
}; }
|
|
14872
14888
|
}
|
|
14873
14889
|
|
|
14874
|
-
const FormFieldMsg = ({ _alert, _error, _hideError, _id }) => (hAsync(
|
|
14890
|
+
const FormFieldMsg = ({ _alert, _error, _hideError, _id }) => (hAsync(KolAlertTag, { "aria-hidden": "true", id: `${_id}-error`, _alert: _alert, _type: "error", class: {
|
|
14875
14891
|
error: true,
|
|
14876
14892
|
'visually-hidden': _hideError === true,
|
|
14877
14893
|
} }, _error));
|
|
@@ -14920,7 +14936,7 @@ class KolInput {
|
|
|
14920
14936
|
const hasExpertSlot = showExpertSlot(this._label);
|
|
14921
14937
|
const hasHint = typeof this._hint === 'string' && this._hint.length > 0;
|
|
14922
14938
|
const useTooltopInsteadOfLabel = !hasExpertSlot && this._hideLabel;
|
|
14923
|
-
return (hAsync(Host, { key: '
|
|
14939
|
+
return (hAsync(Host, { key: '56500b863e4f9b623f3f34426e5a7e63ebb214d1', class: {
|
|
14924
14940
|
'kol-input': true,
|
|
14925
14941
|
disabled: this._disabled === true,
|
|
14926
14942
|
error: hasError === true,
|
|
@@ -14928,11 +14944,11 @@ class KolInput {
|
|
|
14928
14944
|
required: this._required === true,
|
|
14929
14945
|
touched: this._touched === true,
|
|
14930
14946
|
'hidden-error': this._hideError === true,
|
|
14931
|
-
} }, hAsync("label", { key: '
|
|
14947
|
+
} }, hAsync("label", { key: '4602e2be026526d4946f5902f0854eca559ffcc9', class: "input-label", id: !useTooltopInsteadOfLabel ? `${this._id}-label` : undefined, hidden: useTooltopInsteadOfLabel, htmlFor: this._id }, hAsync("span", { key: 'ad0e36c7d5e72eca5d6531a630018eea1049b74f' }, hAsync("slot", { key: '059067b6f6240008cf61256b6da7a45e3897f5dc', name: "label" }))), hasHint && (hAsync("span", { class: "hint", id: `${this._id}-hint` }, this._hint)), hAsync("div", { key: 'bbf91d7a733cad07fb78ea94bad2e3f5bca9c6f3', class: {
|
|
14932
14948
|
input: true,
|
|
14933
14949
|
'icon-left': typeof ((_a = this.getIconsProp()) === null || _a === void 0 ? void 0 : _a.left) === 'object',
|
|
14934
14950
|
'icon-right': typeof ((_b = this.getIconsProp()) === null || _b === void 0 ? void 0 : _b.right) === 'object',
|
|
14935
|
-
} }, ((_c = this.getIconsProp()) === null || _c === void 0 ? void 0 : _c.left) && (hAsync(
|
|
14951
|
+
} }, ((_c = this.getIconsProp()) === null || _c === void 0 ? void 0 : _c.left) && (hAsync(KolIconTag, { _ariaLabel: "", _icons: ((_d = this.getIconsProp()) === null || _d === void 0 ? void 0 : _d.left).icon, style: this.getIconStyles((_e = this.getIconsProp()) === null || _e === void 0 ? void 0 : _e.left) })), hAsync("div", { key: 'c32f93858da49b57bf1acc12915b262a5d716ed0', ref: this.catchInputSlot, id: this.slotName, class: "input-slot" }), typeof this._smartButton === 'object' && this._smartButton !== null && (hAsync(KolButtonWcTag, { _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 })), ((_f = this.getIconsProp()) === null || _f === void 0 ? void 0 : _f.right) && (hAsync(KolIconTag, { _ariaLabel: "", _icons: ((_g = this.getIconsProp()) === null || _g === void 0 ? void 0 : _g.right).icon, style: this.getIconStyles((_h = this.getIconsProp()) === null || _h === void 0 ? void 0 : _h.right) }))), useTooltopInsteadOfLabel && (hAsync(KolTooltipWcTag, { "aria-hidden": "true", class: "input-tooltip", _align: this._tooltipAlign, _id: this._hideLabel ? `${this._id}-label` : undefined, _label: this._label })), hasError && hAsync(FormFieldMsg, { _alert: this._alert, _hideError: this._hideError, _error: this._error, _id: this._id }), Array.isArray(this._suggestions) && this._suggestions.length > 0 && (hAsync("datalist", { id: `${this._id}-list` }, this._suggestions.map((option) => (hAsync("option", { value: option }))))), this._hasCounter && (hAsync("span", { class: "counter", "aria-atomic": "true", "aria-live": "polite" }, this._currentLength, this._maxLength && (hAsync(Fragment, null, hAsync("span", { "aria-label": translate('kol-of'), role: "img" }, "/"), this._maxLength)), ' ', hAsync("span", null, translate('kol-characters'))))));
|
|
14936
14952
|
}
|
|
14937
14953
|
get host() { return getElement(this); }
|
|
14938
14954
|
static get cmpMeta() { return {
|
|
@@ -14975,7 +14991,7 @@ class KolInputAdapterLeanup {
|
|
|
14975
14991
|
deprecatedHint(`Die Komponente 'kol-input-adapter-leanup' mit dem Release v1.1.7 umgezogen. Lesen Sie hier, wie Sie sie migrieren: https://public-ui.github.io/docs/changelog/#117---30092022`);
|
|
14976
14992
|
}
|
|
14977
14993
|
render() {
|
|
14978
|
-
return (hAsync(Host, { key: '
|
|
14994
|
+
return (hAsync(Host, { key: 'cbf692b4b14bf790397e95a153dcb87016d003cc', class: "kol-input-adapter-leanup" }, hAsync(KolAlertTag, { key: '4c21191a4d0f94ce2408e9526c99aae86fa5873a', _type: "warning" }, "Die Komponente ", hAsync("code", { key: 'db084412fa31b5979e95b107253cfd400f4038ee' }, "kol-input-adapter-leanup"), " ist umgezogen. Lesen Sie hier, wie Sie sie migrieren:", ' ', hAsync(KolLinkTag, { key: 'bbbecc1f96f17f3cf3bce93f97f0a98b83316179', _href: "https://public-ui.github.io/docs/changelog#118---07102022", _label: "https://public-ui.github.io/docs/changelog#118---07102022", _target: "documentation" }))));
|
|
14979
14995
|
}
|
|
14980
14996
|
static get cmpMeta() { return {
|
|
14981
14997
|
"$flags$": 9,
|
|
@@ -15391,13 +15407,13 @@ class KolInputCheckbox {
|
|
|
15391
15407
|
render() {
|
|
15392
15408
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
15393
15409
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
15394
|
-
return (hAsync(Host, { key: '
|
|
15410
|
+
return (hAsync(Host, { key: 'e267a1de676e44aac8d5bbe71762bdcb2aa095e9', class: "kol-input-checkbox" }, hAsync(KolInputTag, { key: 'ed9851aa5ff3b7eb6b59667a47459d1f1512a290', class: {
|
|
15395
15411
|
checkbox: true,
|
|
15396
15412
|
[this.state._variant]: true,
|
|
15397
15413
|
'hide-label': !!this.state._hideLabel,
|
|
15398
15414
|
checked: this.state._checked,
|
|
15399
15415
|
indeterminate: this.state._indeterminate,
|
|
15400
|
-
}, "data-role": this.state._variant === 'button' ? 'button' : undefined, _alert: this.state._alert, _disabled: this.state._disabled, _error: this.state._error, _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: '
|
|
15416
|
+
}, "data-role": this.state._variant === 'button' ? 'button' : undefined, _alert: this.state._alert, _disabled: this.state._disabled, _error: this.state._error, _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: '46959e114cd05d2f498d45b883251cfb1edf144c', slot: "label" }, hasExpertSlot ? hAsync("slot", null) : this.state._label), hAsync("label", { key: '50b50793110c0c3860c921be1cc0161b3be37ad6', slot: "input", class: "checkbox-container" }, hAsync(KolIconTag, { key: 'f9f89491d20a62c3329890e79bd28e5872d1e8e7', 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: 'bd1d6c5df58fed8c311bffafc7382e570e472321', 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, { onChange: this.onChange, onClick: undefined }))))));
|
|
15401
15417
|
}
|
|
15402
15418
|
constructor(hostRef) {
|
|
15403
15419
|
registerInstance(this, hostRef);
|
|
@@ -15675,10 +15691,10 @@ class KolInputColor {
|
|
|
15675
15691
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
15676
15692
|
const hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
|
|
15677
15693
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
15678
|
-
return (hAsync(Host, { key: '
|
|
15694
|
+
return (hAsync(Host, { key: '57de82521909d334e56980a5efc05349e64a2c38', class: "kol-input-color" }, hAsync(KolInputTag, { key: 'ae206955ac3108a3efaf497bf3e097d1f1ab5a91', class: {
|
|
15679
15695
|
color: true,
|
|
15680
15696
|
'hide-label': !!this.state._hideLabel,
|
|
15681
|
-
}, _disabled: this.state._disabled, _error: this.state._error, _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.ref) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '
|
|
15697
|
+
}, _disabled: this.state._disabled, _error: this.state._error, _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.ref) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: 'bbbcb2edf55085966b2cbebfd8d8f3bfc87653eb', slot: "label" }, hasExpertSlot ? hAsync("slot", null) : this.state._label), hAsync("div", { key: '1e6905d4a729af74ed170e06e5ae2fbd6bc54873', slot: "input" }, hAsync("input", Object.assign({ key: '41b59fe3435488a2ffffd5d989be09655c9e35bf', 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))))));
|
|
15682
15698
|
}
|
|
15683
15699
|
constructor(hostRef) {
|
|
15684
15700
|
registerInstance(this, hostRef);
|
|
@@ -15994,10 +16010,10 @@ class KolInputDate {
|
|
|
15994
16010
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
15995
16011
|
const hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
|
|
15996
16012
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
15997
|
-
return (hAsync(Host, { key: '
|
|
16013
|
+
return (hAsync(Host, { key: '0d707c6a60048c83cfbc632f32d9347736b8f995', class: { 'kol-input-date': true, 'has-value': this.state._hasValue } }, hAsync(KolInputTag, { key: 'ed2745abb6f861167d48a1df77372c970097da26', class: {
|
|
15998
16014
|
[this.state._type]: true,
|
|
15999
16015
|
'hide-label': !!this.state._hideLabel,
|
|
16000
|
-
}, _disabled: this.state._disabled, _error: this.state._error, _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: '
|
|
16016
|
+
}, _disabled: this.state._disabled, _error: this.state._error, _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: '6c5f1e2945be6504614ecc4ed1b2cfddfb6becb4', slot: "label" }, hasExpertSlot ? hAsync("slot", null) : this.state._label), hAsync("div", { key: '9d50eaa2bf7c91a6aa75ba789d06b8a709065ae5', slot: "input" }, hAsync("input", Object.assign({ key: 'bddaf362f7459b4ae5223713c638796ff8a18292', 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 }, this.controller.onFacade, { onKeyDown: this.onKeyDown }))))));
|
|
16001
16017
|
}
|
|
16002
16018
|
constructor(hostRef) {
|
|
16003
16019
|
registerInstance(this, hostRef);
|
|
@@ -16341,10 +16357,10 @@ class KolInputEmail {
|
|
|
16341
16357
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
16342
16358
|
const hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
|
|
16343
16359
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
16344
|
-
return (hAsync(Host, { key: '
|
|
16360
|
+
return (hAsync(Host, { key: '76f11d09978947267e97ea9135d4fd261536346f', class: {
|
|
16345
16361
|
'kol-input-email': true,
|
|
16346
16362
|
'has-value': this.state._hasValue,
|
|
16347
|
-
} }, hAsync(
|
|
16363
|
+
} }, hAsync(KolInputTag, { key: '76747cb94f0bb7a79f2b83ff7f550af2d6175822', class: { email: true, 'hide-label': !!this.state._hideLabel }, _alert: this.state._alert, _currentLength: this.state._currentLength, _disabled: this.state._disabled, _error: this.state._error, _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.ref) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '73eebb5e1c959cd7e2e7381758050927963c2afe', slot: "label" }, hasExpertSlot ? hAsync("slot", null) : this.state._label), hAsync("div", { key: 'b4a11dbb48f8a39651c38a0561e97a0069486c97', slot: "input" }, hAsync("input", Object.assign({ key: 'ed8da0f8710c4f74bc397d8e299a73760b3290c3', 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, size: this.state._size, spellcheck: "false", type: "email", value: this.state._value }, this.controller.onFacade, { onKeyDown: this.onKeyDown, onInput: this.onInput }))))));
|
|
16348
16364
|
}
|
|
16349
16365
|
constructor(hostRef) {
|
|
16350
16366
|
registerInstance(this, hostRef);
|
|
@@ -16610,10 +16626,10 @@ class KolInputFile {
|
|
|
16610
16626
|
render() {
|
|
16611
16627
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
16612
16628
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
16613
|
-
return (hAsync(Host, { key: '
|
|
16629
|
+
return (hAsync(Host, { key: '5411cc43fcf5d55a0adadac427cc7368efcc2487', class: "kol-input-file" }, hAsync(KolInputTag, { key: '6c8e4d48ffd7114d8126c53ca987c64fdd819291', class: {
|
|
16614
16630
|
file: true,
|
|
16615
16631
|
'hide-label': !!this.state._hideLabel,
|
|
16616
|
-
}, _disabled: this.state._disabled, _error: this.state._error, _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.ref) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '
|
|
16632
|
+
}, _disabled: this.state._disabled, _error: this.state._error, _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.ref) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '35b859f24a85a70ab6d662dbb331b2587cb4d99b', slot: "label" }, hasExpertSlot ? hAsync("slot", null) : this.state._label), hAsync("div", { key: '29df375625809eed35f7e117a4f9df3a24c66310', slot: "input" }, hAsync("input", Object.assign({ key: '21ed20e744a484e77d683432ab5c3c28b1985f40', 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 }))))));
|
|
16617
16633
|
}
|
|
16618
16634
|
constructor(hostRef) {
|
|
16619
16635
|
registerInstance(this, hostRef);
|
|
@@ -16885,13 +16901,13 @@ class KolInputNumber {
|
|
|
16885
16901
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
16886
16902
|
const hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
|
|
16887
16903
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
16888
|
-
return (hAsync(Host, { key: '
|
|
16904
|
+
return (hAsync(Host, { key: 'f416d413e1d895f0b29939d233f7d508779c308b', class: {
|
|
16889
16905
|
'kol-input-number': true,
|
|
16890
16906
|
'has-value': this.state._hasValue,
|
|
16891
|
-
} }, hAsync(
|
|
16907
|
+
} }, hAsync(KolInputTag, { key: 'b4d02ab30d82444d77701e6eb4268a57c842afbf', class: {
|
|
16892
16908
|
[this.state._type]: true,
|
|
16893
16909
|
'hide-label': !!this.state._hideLabel,
|
|
16894
|
-
}, _disabled: this.state._disabled, _error: this.state._error, _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: '
|
|
16910
|
+
}, _disabled: this.state._disabled, _error: this.state._error, _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: 'e7a9a28a99a5790645389ef661b294624e7d1e7f', slot: "label" }, hasExpertSlot ? hAsync("slot", null) : this.state._label), hAsync("div", { key: 'd7521ed6c6738d12ee817843542dd3ad5902e8f7', slot: "input" }, hAsync("input", Object.assign({ key: 'baee7984df525cc59a507214d82308fb73305fba', 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: this.state._type, value: this.state._value }, this.controller.onFacade, { onKeyDown: this.onKeyDown }))))));
|
|
16895
16911
|
}
|
|
16896
16912
|
constructor(hostRef) {
|
|
16897
16913
|
registerInstance(this, hostRef);
|
|
@@ -17124,13 +17140,13 @@ class KolInputPassword {
|
|
|
17124
17140
|
render() {
|
|
17125
17141
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
17126
17142
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
17127
|
-
return (hAsync(Host, { key: '
|
|
17143
|
+
return (hAsync(Host, { key: '5f463d7999c77f44d9f67f45bdc9d7762d09e72a', class: {
|
|
17128
17144
|
'kol-input-password': true,
|
|
17129
17145
|
'has-value': this.state._hasValue,
|
|
17130
|
-
} }, hAsync(
|
|
17146
|
+
} }, hAsync(KolInputTag, { key: '16f5829ed56277ac65d3a9574a505c2131e83184', class: {
|
|
17131
17147
|
'hide-label': !!this.state._hideLabel,
|
|
17132
17148
|
password: true,
|
|
17133
|
-
}, _currentLength: this.state._currentLength, _disabled: this.state._disabled, _error: this.state._error, _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.ref) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '
|
|
17149
|
+
}, _currentLength: this.state._currentLength, _disabled: this.state._disabled, _error: this.state._error, _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.ref) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: 'e349d8b74dea95ede6dc9b3d4e38e218d917b0ac', slot: "label" }, hasExpertSlot ? hAsync("slot", null) : this.state._label), hAsync("div", { key: 'af2802d4ad4dcad2f5c12c95c2a63107e9aaf4a1', slot: "input" }, hAsync("input", Object.assign({ key: '3f496a5dff02cfd45f1f5a31d4cbb401fe648dc4', 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, size: this.state._size, spellcheck: "false", type: "password", value: this.state._value }, this.controller.onFacade, { onKeyDown: this.onKeyDown, onInput: this.onInput }))))));
|
|
17134
17150
|
}
|
|
17135
17151
|
constructor(hostRef) {
|
|
17136
17152
|
registerInstance(this, hostRef);
|
|
@@ -17353,16 +17369,16 @@ class KolInputRadio {
|
|
|
17353
17369
|
render() {
|
|
17354
17370
|
const { ariaDescribedBy, hasError } = getRenderStates(this.state);
|
|
17355
17371
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
17356
|
-
return (hAsync(Host, { key: '
|
|
17372
|
+
return (hAsync(Host, { key: 'fd9a2d1edcae053304517704269ce7f6abc07821', class: "kol-input-radio" }, hAsync("fieldset", { key: '8b22dac7eb5040d9beb4dfd48dbbea1cee944950', class: {
|
|
17357
17373
|
disabled: this.state._disabled === true,
|
|
17358
17374
|
error: hasError === true,
|
|
17359
17375
|
required: this.state._required === true,
|
|
17360
17376
|
'hidden-error': this._hideError === true,
|
|
17361
17377
|
[this.state._orientation]: true,
|
|
17362
|
-
} }, hAsync("legend", { key: '
|
|
17378
|
+
} }, hAsync("legend", { key: '95af9323c66afc4ba6221447713ec5e4f13db956', class: "block w-full mb-1 leading-normal" }, hAsync("span", { key: '394257d37f4b93a93aece7381874bad962bbd6be' }, hAsync("span", { key: '4aa51463f57cd657c0262d1940863a5f1b0750f2', slot: "label" }, hasExpertSlot ? hAsync("slot", null) : this.state._label))), this.state._options.map((option, index) => {
|
|
17363
17379
|
const customId = `${this.state._id}-${index}`;
|
|
17364
17380
|
const slotName = `radio-${index}`;
|
|
17365
|
-
return (hAsync(
|
|
17381
|
+
return (hAsync(KolInputTag, { class: {
|
|
17366
17382
|
radio: true,
|
|
17367
17383
|
disabled: Boolean(this.state._disabled || option.disabled),
|
|
17368
17384
|
}, key: customId, _disabled: this.state._disabled || option.disabled, _hideLabel: this.state._hideLabel, _hint: this.state._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: this.state._value === option.value, 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 })), hAsync("label", { class: "radio-label", htmlFor: `${customId}`, style: {
|
|
@@ -17565,7 +17581,7 @@ class KolInputRadioGroup {
|
|
|
17565
17581
|
deprecatedHint(`[KolInputRadioGroup] Die Komponenten Input-Radio-Group und Input-Radio werden zur Komponente Input-Radio zusammengeführt. Wir empfehlen den Tag <kol-input-radio> statt <kol-input-radio-group> zu verwenden.
|
|
17566
17582
|
|
|
17567
17583
|
Mit der Version 1.1 wird die Komponente KolInputRadioGroup aus der Bibliothek entfernt.`);
|
|
17568
|
-
return (hAsync(Host, { key: '
|
|
17584
|
+
return (hAsync(Host, { key: '46115e566dbc5f5a19f00ec37df1593b2dc75982', class: "kol-input-radio-group" }, hAsync(KolInputRadioTag, { key: 'd9e556c2d98676b582223f4875f309d083f51295', _accessKey: this._accessKey, _disabled: this._disabled, _error: this._error, _hideLabel: this._hideLabel, _id: this._id, _label: this._label, _list: this._list, _name: this._name, _on: this._on, _orientation: this._orientation, _required: this._required, _tabIndex: this._tabIndex, _touched: this._touched, _value: this._value }, hAsync("slot", { key: 'b63a8f2b8c14e1d5f95d7ea37177188c9892be9b' }))));
|
|
17569
17585
|
}
|
|
17570
17586
|
static get cmpMeta() { return {
|
|
17571
17587
|
"$flags$": 9,
|
|
@@ -17649,12 +17665,12 @@ class KolInputRange {
|
|
|
17649
17665
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
17650
17666
|
const hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
|
|
17651
17667
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
17652
|
-
return (hAsync(Host, { key: '
|
|
17668
|
+
return (hAsync(Host, { key: 'b5f2580bb36155124c1b67a2fff723f4ce7689c2', class: "kol-input-range" }, hAsync(KolInputTag, { key: '8bf248f20e39a97b77d4de1149d8fea7f9b9741a', class: {
|
|
17653
17669
|
range: true,
|
|
17654
17670
|
'hide-label': !!this.state._hideLabel,
|
|
17655
|
-
}, _disabled: this.state._disabled, _error: this.state._error, _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: '
|
|
17671
|
+
}, _disabled: this.state._disabled, _error: this.state._error, _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: '1c045418b6b3c994aee76360ef90726e77ef0d90', slot: "label" }, hasExpertSlot ? hAsync("slot", null) : this.state._label), hAsync("div", { key: '92bbd82fafdef83510b68ac60041d04b28ae6de8', slot: "input" }, hAsync("div", { key: '02d303b905994801e7a0f8594de6855703f679e4', class: "inputs-wrapper", style: {
|
|
17656
17672
|
'--kolibri-input-range--input-number--width': `${this.state._max}`.length + 0.5 + 'em',
|
|
17657
|
-
} }, hAsync("input", Object.assign({ key: '
|
|
17673
|
+
} }, hAsync("input", Object.assign({ key: 'e78ec8aebe411bf1f34af7fc34f5829d498ed50e', 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: '6b17919d8d0aa57f451ac5d43d562b432c551795', 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 && [
|
|
17658
17674
|
hAsync("datalist", { id: `${this.state._id}-list` }, this.state._suggestions.map((option) => (hAsync("option", { value: option })))),
|
|
17659
17675
|
]))));
|
|
17660
17676
|
}
|
|
@@ -17880,13 +17896,13 @@ class KolInputText {
|
|
|
17880
17896
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
17881
17897
|
const hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
|
|
17882
17898
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
17883
|
-
return (hAsync(Host, { key: '
|
|
17899
|
+
return (hAsync(Host, { key: '5c2dc93096975d2ee46148d1fd7cb2f458898697', class: {
|
|
17884
17900
|
'kol-input-text': true,
|
|
17885
17901
|
'has-value': this.state._hasValue,
|
|
17886
|
-
} }, hAsync(
|
|
17902
|
+
} }, hAsync(KolInputTag, { key: '20f6256134283074453b18f7eb6e8bc8850d48a6', class: {
|
|
17887
17903
|
[this.state._type]: true,
|
|
17888
17904
|
'hide-label': !!this.state._hideLabel,
|
|
17889
|
-
}, _currentLength: this.state._currentLength, _disabled: this.state._disabled, _error: this.state._error, _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.ref) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '
|
|
17905
|
+
}, _currentLength: this.state._currentLength, _disabled: this.state._disabled, _error: this.state._error, _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.ref) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '3bc1231c8748aefa7f3c0252eef4424249a440f8', slot: "label" }, hasExpertSlot ? hAsync("slot", null) : this.state._label), hAsync("div", { key: 'c4b4e1d170cd38e92331eb159cd6dc91dab7dd0d', slot: "input" }, hAsync("input", Object.assign({ key: '46da9a1ea3927db54ef87462e264020ab4f740c2', 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, size: this.state._size, spellcheck: "false", type: this.state._type, value: this.state._value }, this.controller.onFacade, { onChange: this.onChange, onInput: this.onInput, onKeyDown: this.onKeyDown }))))));
|
|
17890
17906
|
}
|
|
17891
17907
|
constructor(hostRef) {
|
|
17892
17908
|
registerInstance(this, hostRef);
|
|
@@ -18233,7 +18249,7 @@ class KolLink {
|
|
|
18233
18249
|
this._useCase = 'text';
|
|
18234
18250
|
}
|
|
18235
18251
|
render() {
|
|
18236
|
-
return (hAsync(Host, { key: '
|
|
18252
|
+
return (hAsync(Host, { key: '13f64c2dce2aa28260680451397413f8aa7849fd', class: "kol-link" }, hAsync(KolLinkWcTag, { key: '07a0d9c81e8fed8bbe623cc33c597a379a83303e', ref: this.catchRef, _ariaControls: this._ariaControls, _ariaCurrent: this._ariaCurrent, _ariaExpanded: this._ariaExpanded, _ariaLabel: this._ariaLabel, _ariaSelected: this._ariaSelected, _disabled: this._disabled, _download: this._download, _hideLabel: this._hideLabel, _href: this._href, _icons: this._icons || this._icon, _iconAlign: this._iconAlign, _label: this._label, _listenAriaCurrent: this._listenAriaCurrent, _on: this._on, _role: this._role, _selector: this._selector, _stealth: this._stealth, _tabIndex: this._tabIndex, _target: this._target, _tooltipAlign: this._tooltipAlign, _useCase: this._useCase }, hAsync("slot", { key: '250042bd86f06722a7e81e266605ca11fa3ccb71', name: "expert", slot: "expert" }), hAsync("slot", { key: '1aae653cdbdd850f7c8ed94b5134d04437e421bd', slot: "expert" }))));
|
|
18237
18253
|
}
|
|
18238
18254
|
get host() { return getElement(this); }
|
|
18239
18255
|
static get style() { return {
|
|
@@ -18304,11 +18320,11 @@ class KolLinkButton {
|
|
|
18304
18320
|
this._variant = 'normal';
|
|
18305
18321
|
}
|
|
18306
18322
|
render() {
|
|
18307
|
-
return (hAsync(Host, { key: '
|
|
18323
|
+
return (hAsync(Host, { key: 'bb4107ace445b160cda4168d6d8a441a01e65ad9', class: "kol-link-button" }, hAsync(KolLinkWcTag, { key: 'ba46a5fa8e72b3af8491daba75ba272dfb77fe3e', ref: this.catchRef, class: {
|
|
18308
18324
|
button: true,
|
|
18309
18325
|
[this._variant]: this._variant !== 'custom',
|
|
18310
18326
|
[this._customClass]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,
|
|
18311
|
-
}, _ariaControls: this._ariaControls, _ariaCurrent: this._ariaCurrent, _ariaExpanded: this._ariaExpanded, _ariaLabel: this._ariaLabel, _ariaSelected: this._ariaSelected, _disabled: this._disabled, _download: this._download, _hideLabel: this._hideLabel, _href: this._href, _icon: this._icon, _label: this._label, _listenAriaCurrent: this._listenAriaCurrent, _on: this._on, _role: "button", _tabIndex: this._tabIndex, _target: this._target, _tooltipAlign: this._tooltipAlign }, hAsync("slot", { key: '
|
|
18327
|
+
}, _ariaControls: this._ariaControls, _ariaCurrent: this._ariaCurrent, _ariaExpanded: this._ariaExpanded, _ariaLabel: this._ariaLabel, _ariaSelected: this._ariaSelected, _disabled: this._disabled, _download: this._download, _hideLabel: this._hideLabel, _href: this._href, _icon: this._icon, _label: this._label, _listenAriaCurrent: this._listenAriaCurrent, _on: this._on, _role: "button", _tabIndex: this._tabIndex, _target: this._target, _tooltipAlign: this._tooltipAlign }, hAsync("slot", { key: '042fcc828b16b22c56382eb336949c2b5cd72a35', name: "expert", slot: "expert" }))));
|
|
18312
18328
|
}
|
|
18313
18329
|
get host() { return getElement(this); }
|
|
18314
18330
|
static get style() { return {
|
|
@@ -18356,7 +18372,7 @@ const ListItem = (props) => {
|
|
|
18356
18372
|
'list-none': index === 0 && props.orientation === 'horizontal',
|
|
18357
18373
|
}, style: {
|
|
18358
18374
|
listStyleType: props.listStyleType,
|
|
18359
|
-
} }, hAsync(
|
|
18375
|
+
} }, hAsync(KolLinkTag, Object.assign({}, link)))));
|
|
18360
18376
|
});
|
|
18361
18377
|
return list;
|
|
18362
18378
|
};
|
|
@@ -18381,10 +18397,10 @@ class KolLinkGroup {
|
|
|
18381
18397
|
}
|
|
18382
18398
|
render() {
|
|
18383
18399
|
var _a;
|
|
18384
|
-
return (hAsync(Host, { key: '
|
|
18400
|
+
return (hAsync(Host, { key: 'cbaf856c753cb761eb2fd2e28af49bb78f094f7c', class: "kol-link-group" }, hAsync("nav", { key: 'a59422f9a8a92bc1368ad0c9b2302ffe8274169a', "aria-label": this.state._label, class: {
|
|
18385
18401
|
vertical: this.state._orientation === 'vertical',
|
|
18386
18402
|
horizontal: this.state._orientation === 'horizontal',
|
|
18387
|
-
} }, typeof this.state._heading === 'string' && ((_a = this.state._heading) === null || _a === void 0 ? void 0 : _a.length) > 0 && (hAsync(
|
|
18403
|
+
} }, typeof this.state._heading === 'string' && ((_a = this.state._heading) === null || _a === void 0 ? void 0 : _a.length) > 0 && (hAsync(KolHeadingWcTag, { _label: this.state._heading, _level: this.state._level })), this.isUl === false ? (hAsync("ol", null, hAsync(ListItem, { links: this.state._links, orientation: this.state._orientation, listStyleType: this.state._listStyleType }))) : (hAsync("ul", null, hAsync(ListItem, { links: this.state._links, orientation: this.state._orientation, listStyleType: this.state._listStyleType }))))));
|
|
18388
18404
|
}
|
|
18389
18405
|
validateAriaLabel(value) {
|
|
18390
18406
|
this.validateLabel(value);
|
|
@@ -18598,7 +18614,7 @@ class KolLinkWc {
|
|
|
18598
18614
|
render() {
|
|
18599
18615
|
const { isExternal, tagAttrs, goToProps } = this.getRenderValues();
|
|
18600
18616
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
18601
|
-
return (hAsync(Host, { key: '
|
|
18617
|
+
return (hAsync(Host, { key: 'c7bb8c6f8e6de0cdc4b1d36f3ec8cae3c890a2b7', class: "kol-link-wc" }, hAsync("a", Object.assign({ key: '5ec0558803295310d5f045178aaf7200da6461cd', ref: this.catchRef }, tagAttrs, { "aria-controls": this.state._ariaControls, "aria-current": this.state._ariaCurrent, "aria-expanded": mapBoolean2String(this.state._ariaExpanded), "aria-label": this.state._hideLabel && typeof this.state._label === 'string'
|
|
18602
18618
|
? `${this.state._label}${isExternal ? ` (${translate('kol-open-link-in-tab')})` : ''}`
|
|
18603
18619
|
: undefined, "aria-selected": mapBoolean2String(this.state._ariaSelected), class: {
|
|
18604
18620
|
disabled: this.state._disabled === true,
|
|
@@ -18606,7 +18622,7 @@ class KolLinkWc {
|
|
|
18606
18622
|
'icon-only': this.state._hideLabel === true,
|
|
18607
18623
|
'hide-label': this.state._hideLabel === true,
|
|
18608
18624
|
'external-link': isExternal,
|
|
18609
|
-
} }, this.state._on, { onClick: this.onClick, onKeyPress: this.onClick }, goToProps, { role: this.state._role, tabIndex: this.state._tabIndex }), hAsync(
|
|
18625
|
+
} }, this.state._on, { onClick: this.onClick, onKeyPress: this.onClick }, goToProps, { role: this.state._role, tabIndex: this.state._tabIndex }), hAsync(KolSpanWcTag, { key: '552fdf3105bfa275d0e12a98b23a0961fcf77b30', _icons: this.state._icons, _hideLabel: this.state._hideLabel, _label: hasExpertSlot ? '' : this.state._label || this.state._href }, hAsync("slot", { key: 'd58d1982444995c9c9f6b0abeaf615a633d36f98', name: "expert", slot: "expert" })), isExternal && (hAsync(KolIconTag, { 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: 'bbf9c7cb7eecdc8f4323fbf738c8a189b64fd923', "aria-hidden": "true", hidden: hasExpertSlot || !this.state._hideLabel, _align: this.state._tooltipAlign, _label: this.state._label || this.state._href })));
|
|
18610
18626
|
}
|
|
18611
18627
|
validateAriaControls(value) {
|
|
18612
18628
|
validateAriaControls(this, value);
|
|
@@ -19284,10 +19300,10 @@ class KolNav {
|
|
|
19284
19300
|
};
|
|
19285
19301
|
}
|
|
19286
19302
|
entry(collapsible, hideLabel, hasChildren, link, expanded) {
|
|
19287
|
-
return (hAsync("div", { class: { entry: true, 'hide-label': hideLabel } }, hAsync(
|
|
19303
|
+
return (hAsync("div", { class: { entry: true, 'hide-label': hideLabel } }, hAsync(KolButtonLinkTextSwitchTag, { _link: Object.assign(Object.assign({}, link), { _hideLabel: hideLabel }) }), hasChildren ? this.expandButton(collapsible, link, expanded) : ''));
|
|
19288
19304
|
}
|
|
19289
19305
|
expandButton(collapsible, link, expanded) {
|
|
19290
|
-
return (hAsync(
|
|
19306
|
+
return (hAsync(KolButtonWcTag, { class: "expand-button", _ariaExpanded: expanded, _disabled: !collapsible, _icons: 'codicon codicon-' + (expanded ? 'remove' : 'add'), _hideLabel: true, _label: `Untermenü zu ${link._label} ${expanded ? 'schließen' : 'öffnen'}`, _on: { onClick: () => this.onClick(link) } }));
|
|
19291
19307
|
}
|
|
19292
19308
|
li(collapsible, hideLabel, deep, index, link, orientation) {
|
|
19293
19309
|
const active = !!link._active;
|
|
@@ -19309,10 +19325,10 @@ class KolNav {
|
|
|
19309
19325
|
const collapsible = this.state._collapsible === true;
|
|
19310
19326
|
const hideLabel = this.state._hideLabel === true;
|
|
19311
19327
|
const orientation = this.state._orientation;
|
|
19312
|
-
return (hAsync(Host, { key: '
|
|
19328
|
+
return (hAsync(Host, { key: '22d1f41175666b6e540c1d93a92a88283e6bfced', class: "kol-nav" }, hAsync("div", { key: '42dcf20c3d0d157f08f5a09a5a4566755288a5a0', class: {
|
|
19313
19329
|
[orientation]: true,
|
|
19314
19330
|
[this.state._variant]: true,
|
|
19315
|
-
} }, hAsync("nav", { key: '
|
|
19331
|
+
} }, hAsync("nav", { key: '86c2c08a34f26948b8054c5735c4a673e22a6ddc', "aria-label": this.state._label, id: "nav" }, hAsync(this.linkList, { key: 'fe334ca90260312723e146b5bcc5194c741cd828', collapsible: collapsible, hideLabel: hideLabel, deep: 0, links: this.state._links, orientation: orientation })), hasCompactButton && (hAsync("div", { class: "compact" }, hAsync(KolButtonTag, { _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: {
|
|
19316
19332
|
onClick: () => {
|
|
19317
19333
|
this.state = Object.assign(Object.assign({}, this.state), { _hideLabel: this.state._hideLabel === false });
|
|
19318
19334
|
},
|
|
@@ -19587,19 +19603,19 @@ class KolPagination {
|
|
|
19587
19603
|
return null;
|
|
19588
19604
|
}
|
|
19589
19605
|
});
|
|
19590
|
-
return (hAsync(Host, { class: "kol-pagination" }, hAsync("nav", { "aria-label": this.state._label }, hAsync("ul", { class: "navigation-list" }, this.state._hasButtons.first && (hAsync("li", null, hAsync(
|
|
19606
|
+
return (hAsync(Host, { class: "kol-pagination" }, hAsync("nav", { "aria-label": this.state._label }, hAsync("ul", { class: "navigation-list" }, this.state._hasButtons.first && (hAsync("li", null, hAsync(KolButtonTag, { class: "first", exportparts: "icon", _customClass: this.state._customClass, _disabled: this.state._page <= 1, _icon: leftDoubleArrowIcon, _hideLabel: true, _label: translate('kol-page-first'), _on: this.onGoToFirst, _variant: this.state._variant, _tooltipAlign: this.state._tooltipAlign }))), this.state._hasButtons.previous && (hAsync("li", null, hAsync(KolButtonTag, { class: "previous", exportparts: "icon", _customClass: this.state._customClass, _disabled: this.state._page <= 1, _icon: leftSingleArrow, _hideLabel: true, _label: translate('kol-page-back'), _on: this.onGoBackward, _variant: this.state._variant, _tooltipAlign: this.state._tooltipAlign }))), pageButtons, this.state._hasButtons.next && (hAsync("li", null, hAsync(KolButtonTag, { class: "next", exportparts: "icon", _customClass: this.state._customClass, _disabled: count <= this.state._page, _icon: rightSingleArrowIcon, _hideLabel: true, _label: translate('kol-page-next'), _on: this.onGoForward, _variant: this.state._variant, _tooltipAlign: this.state._tooltipAlign }))), this.state._hasButtons.last && (hAsync("li", null, hAsync(KolButtonTag, { class: "last", exportparts: "icon", _customClass: this.state._customClass, _disabled: count <= this.state._page, _icon: rightDoubleArrowIcon, _hideLabel: true, _label: translate('kol-page-last'), _on: this.onGoToEnd, _variant: this.state._variant, _tooltipAlign: this.state._tooltipAlign }))))), ((_a = this.state._pageSizeOptions) === null || _a === void 0 ? void 0 : _a.length) > 0 && (hAsync(KolSelectTag, { _hideLabel: true, _id: `pagination-size-${this.nonce}`, _label: translate('kol-entries-per-site'), _list: this.state._pageSizeOptions, _on: {
|
|
19591
19607
|
onChange: this.onChangePageSize,
|
|
19592
19608
|
}, _value: [this.state._pageSize] }))));
|
|
19593
19609
|
}
|
|
19594
19610
|
getUnselectedPageButton(page) {
|
|
19595
|
-
return (hAsync("li", null, hAsync(
|
|
19611
|
+
return (hAsync("li", null, hAsync(KolButtonTag, { exportparts: "icon", key: `${this.nonce}-${page}`, _customClass: this.state._customClass, _label: "", _on: {
|
|
19596
19612
|
onClick: (event) => {
|
|
19597
19613
|
this.onClick(event, page);
|
|
19598
19614
|
},
|
|
19599
19615
|
}, _variant: this.state._variant }, hAsync("span", { slot: "expert" }, hAsync("span", { class: "visually-hidden" }, translate('kol-page')), " ", page))));
|
|
19600
19616
|
}
|
|
19601
19617
|
getSelectedPageButton(page) {
|
|
19602
|
-
return (hAsync("li", null, hAsync(
|
|
19618
|
+
return (hAsync("li", null, hAsync(KolButtonWcTag, { class: "selected", key: `${this.nonce}-selected`, _customClass: this.state._customClass, _disabled: true, _ariaCurrent: true, _label: "", _variant: this.state._variant }, hAsync("span", { slot: "expert" }, hAsync("span", { class: "visually-hidden" }, translate('kol-page')), " ", page))));
|
|
19603
19619
|
}
|
|
19604
19620
|
validateBoundaryCount(value) {
|
|
19605
19621
|
watchNumber(this, '_boundaryCount', Math.max(0, value !== null && value !== void 0 ? value : 1));
|
|
@@ -21547,9 +21563,9 @@ class KolQuote {
|
|
|
21547
21563
|
}
|
|
21548
21564
|
render() {
|
|
21549
21565
|
const hasExpertSlot = showExpertSlot(this.state._quote);
|
|
21550
|
-
return (hAsync(Host, { key: '
|
|
21566
|
+
return (hAsync(Host, { key: '6049061dced07c3e5e616f8b490cb627f534672f', class: "kol-quote" }, hAsync("figure", { key: '75f659f14469c7b337074ba17e669b8ecb621e05', class: {
|
|
21551
21567
|
[this.state._variant]: true,
|
|
21552
|
-
} }, 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", null, hAsync("cite", null, hAsync(
|
|
21568
|
+
} }, 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", null, hAsync("cite", null, hAsync(KolLinkTag, { _href: this.state._href, _label: this.state._label, _target: "_blank", class: "kol-link" })))))));
|
|
21553
21569
|
}
|
|
21554
21570
|
static get watchers() { return {
|
|
21555
21571
|
"_caption": ["validateCaption"],
|
|
@@ -21697,10 +21713,10 @@ class KolSelect {
|
|
|
21697
21713
|
render() {
|
|
21698
21714
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
21699
21715
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
21700
|
-
return (hAsync(Host, { key: '
|
|
21716
|
+
return (hAsync(Host, { key: '2a29b7776ff32a9ce033bcf43512cbc80c648de7', class: { 'kol-select': true, 'has-value': this.state._hasValue } }, hAsync(KolInputTag, { key: 'e09b17ca3e301bb6c7a257705767c66ca202c995', class: {
|
|
21701
21717
|
'hide-label': !!this.state._hideLabel,
|
|
21702
21718
|
select: true,
|
|
21703
|
-
}, _disabled: this.state._disabled, _error: this.state._error, _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, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.ref) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '
|
|
21719
|
+
}, _disabled: this.state._disabled, _error: this.state._error, _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, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.ref) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '34b47aa617fb07653e7596cd059301086350b6d5', slot: "label" }, hasExpertSlot ? hAsync("slot", null) : this.state._label), hAsync("div", { key: 'c06b756042b03781fedde5eca8c9a4eb36ec78bd', slot: "input" }, hAsync("select", Object.assign({ key: 'e799df570651eaf272b6b25d6c1385fc68a2d1ba', 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", style: {
|
|
21704
21720
|
height: this.state._height,
|
|
21705
21721
|
} }, this.controller.onFacade, { onChange: this.onChange }), this.state._options.map((option, index) => {
|
|
21706
21722
|
const key = `-${index}`;
|
|
@@ -21928,8 +21944,8 @@ class KolSkipNav {
|
|
|
21928
21944
|
};
|
|
21929
21945
|
}
|
|
21930
21946
|
render() {
|
|
21931
|
-
return (hAsync(Host, { key: '
|
|
21932
|
-
return (hAsync("li", { key: index }, hAsync(
|
|
21947
|
+
return (hAsync(Host, { key: '6bac1f8fc61116e7aa70c932bb6ecf73db61e709', class: "kol-skip-nav" }, hAsync("nav", { key: '7cc0e73452f3c84a2bcf077d2031e4a255653b33', "aria-label": this.state._label }, hAsync("ul", { key: '3be87f3e954fe9caa7a5c3b5237fa4ef53343a98' }, this.state._links.map((link, index) => {
|
|
21948
|
+
return (hAsync("li", { key: index }, hAsync(KolLinkWcTag, Object.assign({}, link))));
|
|
21933
21949
|
})))));
|
|
21934
21950
|
}
|
|
21935
21951
|
validateAriaLabel(value) {
|
|
@@ -21990,7 +22006,7 @@ class KolSpan {
|
|
|
21990
22006
|
this._label = undefined;
|
|
21991
22007
|
}
|
|
21992
22008
|
render() {
|
|
21993
|
-
return (hAsync(
|
|
22009
|
+
return (hAsync(KolSpanWcTag, { key: '097a1eaf05779657d5c2dd619303524613495627', _icons: this._icons || this._icon, _hideLabel: this._hideLabel, _label: this._label, class: "kol-span" }, hAsync("slot", { key: '288f7045039cb858f50352e1e8c870a5a71edb51', name: "expert", slot: "expert" })));
|
|
21994
22010
|
}
|
|
21995
22011
|
static get style() { return {
|
|
21996
22012
|
default: KolSpanDefaultStyle0
|
|
@@ -30356,11 +30372,11 @@ class KolSpanWc {
|
|
|
30356
30372
|
render() {
|
|
30357
30373
|
var _a, _b, _c, _d, _e;
|
|
30358
30374
|
const hideExpertSlot = !showExpertSlot(this.state._label);
|
|
30359
|
-
return (hAsync(Host, { key: '
|
|
30375
|
+
return (hAsync(Host, { key: 'ac73aaae07e32daea539c9aedd7789536421444c', class: {
|
|
30360
30376
|
'kol-span-wc': true,
|
|
30361
30377
|
'icon-only': !!this.state._hideLabel,
|
|
30362
30378
|
'hide-label': !!this.state._hideLabel,
|
|
30363
|
-
} }, this.state._icons.top && (hAsync(
|
|
30379
|
+
} }, this.state._icons.top && (hAsync(KolIconTag, { 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: '5368ee294217a776891d862d320d160a5862965f' }, this.state._icons.left && (hAsync(KolIconTag, { 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" }, (_c = this.state._label) !== null && _c !== void 0 ? _c : ''))) : (''), hAsync("span", { key: 'af58cc797c186da8dc524df4180be4c628265d6d', "aria-hidden": hideExpertSlot ? 'true' : undefined, class: "span-label", hidden: hideExpertSlot }, hAsync("slot", { key: '8231258bde52e28b2609ace935444cd5b90df63f', name: "expert" })), this.state._icons.right && (hAsync(KolIconTag, { 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, { 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 }))));
|
|
30364
30380
|
}
|
|
30365
30381
|
validateAllowMarkdown(value) {
|
|
30366
30382
|
watchBoolean(this, '_allowMarkdown', value, {
|
|
@@ -30569,12 +30585,12 @@ class KolSplitButton {
|
|
|
30569
30585
|
};
|
|
30570
30586
|
}
|
|
30571
30587
|
render() {
|
|
30572
|
-
return (hAsync(Host, { key: '
|
|
30588
|
+
return (hAsync(Host, { key: '58cd9f30418537a6d28c81df601547d8875f0610', class: "kol-split-button split-button" }, hAsync(KolButtonWcTag, { key: '00c0394ec242487837a2ec566099946cf2e853a8', class: {
|
|
30573
30589
|
'main-button': true,
|
|
30574
30590
|
button: true,
|
|
30575
30591
|
[this._variant]: this._variant !== 'custom',
|
|
30576
30592
|
[this._customClass]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,
|
|
30577
|
-
}, _accessKey: this._accessKey, _ariaControls: this._ariaControls, _ariaExpanded: this._ariaExpanded, _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _icons: this._icons || this._icon, _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: '
|
|
30593
|
+
}, _accessKey: this._accessKey, _ariaControls: this._ariaControls, _ariaExpanded: this._ariaExpanded, _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _icons: this._icons || this._icon, _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: '38b5ec47c9450ad2ffb8608a75009d7d05fc0439', class: "horizontal-line" }), hAsync(KolButtonWcTag, { key: 'c30a6ed993ef4b5fd08c5d5e54c904180a997fec', class: "secondary-button", _disabled: this._disabled, _hideLabel: true, _icons: "codicon codicon-triangle-down", _label: `dropdown ${this.state._show ? 'schließen' : 'öffnen'}`, _on: this.clickToggleHandler }), hAsync("div", { key: '0451daf78f8b8bcf57c89afd381c3c068c19a990', class: "popover", ref: this.catchDropdownElements }, hAsync("div", { key: '39789af55a6be666dced250ed5f3f3380aafe947', class: "popover-content" }, hAsync("slot", { key: '05832526edc7c122833183fbc8f3cd6d956c8b48' })))));
|
|
30578
30594
|
}
|
|
30579
30595
|
validateShowDropdown(value) {
|
|
30580
30596
|
this.validateShow(value);
|
|
@@ -30774,7 +30790,7 @@ class KolTable {
|
|
|
30774
30790
|
}, "aria-sort": sortDirection, "data-sort": `sort-${this.sortDirections.get(headerCell.sort)}` }, hAsync("div", { class: "w-full flex gap-1 items-center" }, hAsync("div", { class: {
|
|
30775
30791
|
'w-full': true,
|
|
30776
30792
|
[headerCell.textAlign]: typeof headerCell.textAlign === 'string' && headerCell.textAlign.length > 0,
|
|
30777
|
-
}, style: { textAlign: headerCell.textAlign } }, headerCell.label), !this.disableSort && typeof headerCell.sort === 'function' && (hAsync(
|
|
30793
|
+
}, style: { textAlign: headerCell.textAlign } }, headerCell.label), !this.disableSort && typeof headerCell.sort === 'function' && (hAsync(KolButtonTag, { exportparts: "icon", _icon: sortButtonIcon, _hideLabel: true, _label: translate('kol-change-order', { placeholders: { colLabel: headerCell.label } }), _on: {
|
|
30778
30794
|
onClick: () => {
|
|
30779
30795
|
if (typeof headerCell.sort === 'function') {
|
|
30780
30796
|
this.sortFunction = headerCell.sort;
|
|
@@ -31144,9 +31160,9 @@ class KolTable {
|
|
|
31144
31160
|
var _a, _b;
|
|
31145
31161
|
const displayedData = this.selectDisplayedData(this.state._sortedData, this.showPagination ? (_b = (_a = this.state._pagination) === null || _a === void 0 ? void 0 : _a._pageSize) !== null && _b !== void 0 ? _b : 10 : this.state._sortedData.length, this.state._pagination._page || 1);
|
|
31146
31162
|
const dataField = this.createDataField(displayedData, this.state._headers);
|
|
31147
|
-
return (hAsync(Host, { key: '
|
|
31163
|
+
return (hAsync(Host, { key: '199d3f5fe7a14ef4ffb3d94d5b5ec3b89e6c7a19', class: "kol-table" }, this.pageEndSlice > 0 && this.showPagination && (hAsync("div", { class: "pagination" }, hAsync("span", null, "Eintr\u00E4ge ", this.pageEndSlice > 0 ? this.pageStartSlice + 1 : 0, " bis ", this.pageEndSlice, " von", ' ', this.state._pagination._max || (Array.isArray(this.state._data) ? this.state._data.length : 0), " angezeigt"), hAsync("div", null, hAsync(KolPaginationTag, { _boundaryCount: this.state._pagination._boundaryCount, _customClass: this.state._pagination._customClass, _on: this.handlePagination, _page: this.state._pagination._page, _pageSize: this.state._pagination._pageSize, _pageSizeOptions: this.state._pagination._pageSizeOptions || PAGINATION_OPTIONS, _siblingCount: this.state._pagination._siblingCount, _tooltipAlign: "bottom", _max: this.state._pagination._max || this.state._pagination._total || this.state._data.length, _label: translate('kol-table-pagination-label', { placeholders: { label: this.state._label } }) })))), hAsync("div", { key: '2ff74916a3e4838c5701bf281783732f130e1667', ref: (element) => (this.tableDivElement = element), class: "table", tabindex: this.tableDivElementHasScrollbar ? '-1' : undefined }, hAsync("table", { key: '84cc14bf597a038244febff56e0441a5baa9dee9', style: {
|
|
31148
31164
|
minWidth: this.state._minWidth,
|
|
31149
|
-
} }, hAsync("div", { key: '
|
|
31165
|
+
} }, hAsync("div", { key: '1625347128e9328e5c2744bd5e6cdd1e69c8a265', class: "focus-element", tabindex: this.tableDivElementHasScrollbar ? '0' : undefined, "aria-describedby": "caption" }, "\u00A0"), hAsync("caption", { key: '11b73c10bda5634637d34a5b19f930ca34012186', id: "caption" }, this.state._label), Array.isArray(this.state._headers.horizontal) && (hAsync("thead", null, this.state._headers.horizontal.map((cols, rowIndex) => (hAsync("tr", { key: `thead-${rowIndex}` }, cols.map((col, colIndex) => {
|
|
31150
31166
|
if (col.asTd === true) {
|
|
31151
31167
|
return (hAsync("td", { key: `thead-${rowIndex}-${colIndex}-${col.label}`, class: {
|
|
31152
31168
|
[col.textAlign]: typeof col.textAlign === 'string' && col.textAlign.length > 0,
|
|
@@ -31177,7 +31193,7 @@ class KolTable {
|
|
|
31177
31193
|
}
|
|
31178
31194
|
return (hAsync("th", { class: col.textAlign ? `align-${col.textAlign}` : undefined, key: `thead-${rowIndex}-${colIndex}-${headerCell.label}`, scope: typeof headerCell.colSpan === 'number' && headerCell.colSpan > 1 ? 'colgroup' : 'col', colSpan: headerCell.colSpan, rowSpan: headerCell.rowSpan, style: {
|
|
31179
31195
|
width: col.width,
|
|
31180
|
-
}, "aria-sort": sortDirection, "data-sort": sortDirection ? `sort-${this.sortedColumnHead.sortDirection}` : 'sort-NOS' }, !this.disableSort && typeof headerCell.sort === 'function' ? (hAsync(
|
|
31196
|
+
}, "aria-sort": sortDirection, "data-sort": sortDirection ? `sort-${this.sortedColumnHead.sortDirection}` : 'sort-NOS' }, !this.disableSort && typeof headerCell.sort === 'function' ? (hAsync(KolButtonWcTag, { class: "table-sort-button", exportparts: "icon", _icons: { right: sortButtonIcon }, _label: col.label, _on: {
|
|
31181
31197
|
onClick: () => {
|
|
31182
31198
|
if (typeof headerCell.sort === 'function') {
|
|
31183
31199
|
this.sortFunction = headerCell.sort;
|
|
@@ -31196,7 +31212,7 @@ class KolTable {
|
|
|
31196
31212
|
},
|
|
31197
31213
|
} })) : (col.label)));
|
|
31198
31214
|
}
|
|
31199
|
-
})))))), hAsync("tbody", { key: '
|
|
31215
|
+
})))))), hAsync("tbody", { key: 'ba13876ccc6fe9aef28f9b4f83a8e1f769021781' }, dataField.map(this.renderTableRow)), this.state._dataFoot.length > 0 ? this.renderFoot() : ''))));
|
|
31200
31216
|
}
|
|
31201
31217
|
static get watchers() { return {
|
|
31202
31218
|
"_caption": ["validateCaption"],
|
|
@@ -31379,17 +31395,17 @@ class KolTabs {
|
|
|
31379
31395
|
};
|
|
31380
31396
|
}
|
|
31381
31397
|
renderButtonGroup() {
|
|
31382
|
-
return (hAsync(
|
|
31398
|
+
return (hAsync(KolButtonGroupWcTag, { role: "tablist", "aria-label": this.state._label, onKeyDown: this.onKeyDown, class: "kol-tabs" }, this.state._tabs.map((button, index) => (hAsync(KolButtonWcTag, { _disabled: button._disabled, _icons: button._icons || button._icon, _hideLabel: button._hideLabel || button._iconOnly, _label: button._label, _on: this.callbacks, _tabIndex: this.state._selected === index ? 0 : -1, _tooltipAlign: button._tooltipAlign, _variant: this.state._selected === index ? 'custom' : undefined, _customClass: this.state._selected === index ? 'selected' : undefined, _ariaControls: `tabpanel-${index}`, _ariaSelected: this.state._selected === index, _id: `${this.state._label.replace(/\s/g, '-')}-tab-${index}`, _role: "tab", _value: index }))), this.showCreateTab && (hAsync(KolButtonWcTag, { class: "create-button", _label: this.onCreateLabel, _on: {
|
|
31383
31399
|
onClick: this.onCreate,
|
|
31384
31400
|
} }))));
|
|
31385
31401
|
}
|
|
31386
31402
|
render() {
|
|
31387
|
-
return (hAsync(Host, { key: '
|
|
31403
|
+
return (hAsync(Host, { key: '19d0560b231f61e5555762d0b2800c275269252a' }, hAsync("div", { key: '88f38f561a8da7c75d6b933ae1471ed94a5d5bdd', ref: (el) => {
|
|
31388
31404
|
this.tabPanelsElement = el;
|
|
31389
31405
|
}, class: {
|
|
31390
31406
|
'kol-tabs-wc': true,
|
|
31391
31407
|
[`tabs-align-${this.state._align}`]: true,
|
|
31392
|
-
} }, this.renderButtonGroup(), hAsync("div", { key: '
|
|
31408
|
+
} }, this.renderButtonGroup(), hAsync("div", { key: 'bbedb0b400fed93e0d14e55ce5cac73906d3055a', ref: this.catchTabPanelHost }))));
|
|
31393
31409
|
}
|
|
31394
31410
|
validateAlign(value) {
|
|
31395
31411
|
validateAlign(this, value);
|
|
@@ -31605,7 +31621,7 @@ class KolTextarea {
|
|
|
31605
31621
|
render() {
|
|
31606
31622
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
31607
31623
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
31608
|
-
return (hAsync(Host, { key: '
|
|
31624
|
+
return (hAsync(Host, { key: 'a253654b37b01f03792490e67136ae2f0973f9d8', class: { 'kol-textarea': true, 'has-value': this.state._hasValue } }, hAsync(KolInputTag, { key: '61835c279b8643df2252405f6640743eba41d9df', class: { textarea: true, 'hide-label': !!this.state._hideLabel, 'has-counter': !!this.state._hasCounter }, _alert: this.state._alert, _currentLength: this.state._currentLength, _disabled: this.state._disabled, _error: this.state._error, _hideError: this.state._hideError, _hasCounter: this.state._hasCounter, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _id: this.state._id, _label: this.state._label, _maxLength: this.state._maxLength, _readOnly: this.state._readOnly, _required: this.state._required, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.ref) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: 'acbaf231a084b321bd71b010a23e0975aa325804', slot: "label" }, hasExpertSlot ? hAsync("slot", null) : this.state._label), hAsync("div", { key: '529523d402724af3c711ba9cba4308f8caacd087', slot: "input" }, hAsync("textarea", Object.assign({ key: '391aaeed358b89872391dd7cac734e0d2e152703', 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: {
|
|
31609
31625
|
resize: this.state._resize,
|
|
31610
31626
|
}, value: this.state._value }))))));
|
|
31611
31627
|
}
|
|
@@ -31892,7 +31908,7 @@ class KolToast {
|
|
|
31892
31908
|
this.validateType(this._type);
|
|
31893
31909
|
}
|
|
31894
31910
|
render() {
|
|
31895
|
-
return (hAsync(Host, { key: '
|
|
31911
|
+
return (hAsync(Host, { key: 'f991012d7373f9992f7d81f7dd256fb0980554b9', class: "kol-toast" }, this.state._show && (hAsync("div", null, hAsync(KolAlertTag, { _alert: this.state._alert, _label: this.state._label, _level: this.state._level, _hasCloser: this.state._hasCloser, _type: this.state._type, _variant: "card", _on: this.on, class: "kol-alert" }, hAsync("slot", null))))));
|
|
31896
31912
|
}
|
|
31897
31913
|
static get watchers() { return {
|
|
31898
31914
|
"_alert": ["validateAlert"],
|
|
@@ -31936,7 +31952,7 @@ const InternalToast = ({ toastState, onClose, key }) => {
|
|
|
31936
31952
|
}
|
|
31937
31953
|
};
|
|
31938
31954
|
return (hAsync("div", { class: `toast ${toastState.status}`, key: key },
|
|
31939
|
-
hAsync(
|
|
31955
|
+
hAsync(KolAlertTag, { class: "kol-alert alert", _alert: true, _label: toastState.toast.label, _level: 0, _hasCloser: true, _type: toastState.toast.type, _variant: "card", _on: { onClose } },
|
|
31940
31956
|
hAsync("div", { ref: handleRef }, typeof toastState.toast.description === 'string' ? toastState.toast.description : null))));
|
|
31941
31957
|
};
|
|
31942
31958
|
|
|
@@ -31984,7 +32000,7 @@ class KolToastContainer {
|
|
|
31984
32000
|
}, TRANSITION_TIMEOUT);
|
|
31985
32001
|
}
|
|
31986
32002
|
render() {
|
|
31987
|
-
return (hAsync(Host, { key: '
|
|
32003
|
+
return (hAsync(Host, { key: '4f344054231b03122bb00dff700f80b7deb18af6', class: "kol-toast-container" }, hAsync(Fragment, { key: '83360302077a462f2e979eda589058d828bc0abc' }, this.state._toastStates.length > 1 && (hAsync(KolButtonTag, { _label: translate('kol-toast-close-all'), class: "close-all", _on: {
|
|
31988
32004
|
onClick: () => {
|
|
31989
32005
|
void this.closeAll();
|
|
31990
32006
|
},
|
|
@@ -32168,7 +32184,7 @@ class KolTooltip {
|
|
|
32168
32184
|
this.showOrHideTooltip();
|
|
32169
32185
|
}
|
|
32170
32186
|
render() {
|
|
32171
|
-
return (hAsync(Host, { key: '
|
|
32187
|
+
return (hAsync(Host, { key: '7176ac17f84d9a8d882c85573562fdef625fdadf', class: "kol-tooltip-wc" }, this.state._label !== '' && (hAsync("div", { class: "tooltip-floating", ref: this.catchTooltipElement }, hAsync("div", { class: "tooltip-area tooltip-arrow", ref: this.catchArrowElement }), hAsync(KolSpanWcTag, { class: "tooltip-area tooltip-content", id: this.state._id, _label: this.state._label })))));
|
|
32172
32188
|
}
|
|
32173
32189
|
validateAlign(value) {
|
|
32174
32190
|
validateAlign(this, value);
|
|
@@ -32266,7 +32282,7 @@ class KolVersion {
|
|
|
32266
32282
|
};
|
|
32267
32283
|
}
|
|
32268
32284
|
render() {
|
|
32269
|
-
return (hAsync(Host, { key: '
|
|
32285
|
+
return (hAsync(Host, { key: 'ce91828565ef345180de4d847e5841ef34ddc258', class: "kol-version" }, hAsync(KolBadgeTag, { key: '90d88c9692de38dc98c7073eed62fa83a138a2cc', _color: Farbspektrum.Hellgrau, _icons: {
|
|
32270
32286
|
left: { icon: 'codicon codicon-versions', label: translate('kol-version') },
|
|
32271
32287
|
}, _label: this.state._label })));
|
|
32272
32288
|
}
|
|
@@ -32468,7 +32484,7 @@ class ToasterService {
|
|
|
32468
32484
|
this.document = document;
|
|
32469
32485
|
this.queue = new Set();
|
|
32470
32486
|
this.isOpen = false;
|
|
32471
|
-
this.toastElement = this.document.createElement(
|
|
32487
|
+
this.toastElement = this.document.createElement(KolToastTag);
|
|
32472
32488
|
this.toastElement.setAttribute('_level', '0');
|
|
32473
32489
|
this.toastElement.setAttribute('_show', 'false');
|
|
32474
32490
|
this.toastElement.setAttribute('_show-duration', '-1');
|
package/package.json
CHANGED
|
@@ -1,9 +1,12 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@public-ui/hydrate",
|
|
3
|
-
"version": "1.7.
|
|
3
|
+
"version": "1.7.18",
|
|
4
4
|
"license": "EUPL-1.2",
|
|
5
5
|
"homepage": "https://public-ui.github.io",
|
|
6
|
-
"repository":
|
|
6
|
+
"repository": {
|
|
7
|
+
"type": "git",
|
|
8
|
+
"url": "https://github.com/public-ui/kolibri"
|
|
9
|
+
},
|
|
7
10
|
"bugs": {
|
|
8
11
|
"url": "https://github.com/public-ui/kolibri/issues",
|
|
9
12
|
"email": "kolibri@itzbund.de"
|
|
@@ -42,11 +45,11 @@
|
|
|
42
45
|
"hydrate"
|
|
43
46
|
],
|
|
44
47
|
"devDependencies": {
|
|
45
|
-
"@public-ui/components": "1.7.
|
|
48
|
+
"@public-ui/components": "1.7.18",
|
|
46
49
|
"rimraf": "5.0.5"
|
|
47
50
|
},
|
|
48
51
|
"peerDependencies": {
|
|
49
|
-
"@public-ui/components": "1.7.
|
|
52
|
+
"@public-ui/components": "1.7.18"
|
|
50
53
|
},
|
|
51
54
|
"sideEffects": false,
|
|
52
55
|
"type": "commonjs",
|