@haiilo/catalyst 10.35.0 → 10.36.1
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/catalyst/catalyst.esm.js +1 -1
- package/dist/catalyst/catalyst.esm.js.map +1 -1
- package/dist/catalyst/p-7f3bcfb9.js +3 -0
- package/dist/{esm/index-30afba72.js.map → catalyst/p-7f3bcfb9.js.map} +1 -1
- package/dist/catalyst/{p-98a95fb7.entry.js → p-a66b6ce8.entry.js} +3 -3
- package/dist/catalyst/p-a66b6ce8.entry.js.map +1 -0
- package/dist/cjs/cat-alert_30.cjs.entry.js +52 -12
- package/dist/cjs/cat-alert_30.cjs.entry.js.map +1 -1
- package/dist/cjs/catalyst.cjs.js +2 -2
- package/dist/cjs/{index-0c9af7fb.js → index-1094f0fc.js} +30 -2
- package/dist/cjs/index-1094f0fc.js.map +1 -0
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/collection/components/cat-checkbox/cat-checkbox.js +6 -2
- package/dist/collection/components/cat-checkbox/cat-checkbox.js.map +1 -1
- package/dist/collection/components/cat-input/cat-input.js +8 -4
- package/dist/collection/components/cat-input/cat-input.js.map +1 -1
- package/dist/collection/components/cat-select/cat-select.js +4 -4
- package/dist/collection/components/cat-textarea/cat-textarea.js +7 -3
- package/dist/collection/components/cat-textarea/cat-textarea.js.map +1 -1
- package/dist/collection/components/cat-toggle/cat-toggle.js +6 -2
- package/dist/collection/components/cat-toggle/cat-toggle.js.map +1 -1
- package/dist/collection/components/cat-tooltip/cat-tooltip.js +1 -1
- package/dist/components/cat-checkbox2.js +7 -3
- package/dist/components/cat-checkbox2.js.map +1 -1
- package/dist/components/cat-input2.js +9 -5
- package/dist/components/cat-input2.js.map +1 -1
- package/dist/components/cat-textarea.js +8 -4
- package/dist/components/cat-textarea.js.map +1 -1
- package/dist/components/cat-toggle.js +7 -3
- package/dist/components/cat-toggle.js.map +1 -1
- package/dist/esm/cat-alert_30.entry.js +52 -12
- package/dist/esm/cat-alert_30.entry.js.map +1 -1
- package/dist/esm/catalyst.js +3 -3
- package/dist/esm/{index-30afba72.js → index-e8c0ddf2.js} +30 -2
- package/dist/esm/index-e8c0ddf2.js.map +1 -0
- package/dist/esm/loader.js +3 -3
- package/dist/types/components/cat-checkbox/cat-checkbox.d.ts +1 -0
- package/dist/types/components/cat-input/cat-input.d.ts +1 -0
- package/dist/types/components/cat-textarea/cat-textarea.d.ts +1 -0
- package/dist/types/components/cat-toggle/cat-toggle.d.ts +1 -0
- package/package.json +4 -4
- package/dist/catalyst/p-98a95fb7.entry.js.map +0 -1
- package/dist/catalyst/p-c3a9aef7.js +0 -3
- package/dist/catalyst/p-c3a9aef7.js.map +0 -1
- package/dist/cjs/index-0c9af7fb.js.map +0 -1
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const index = require('./index-
|
|
5
|
+
const index = require('./index-1094f0fc.js');
|
|
6
6
|
const of = require('./of-958251e4.js');
|
|
7
7
|
|
|
8
8
|
const ObjectUnsubscribedError = of.createErrorClass((_super) => function ObjectUnsubscribedErrorImpl() {
|
|
@@ -1354,6 +1354,13 @@ const CatCheckbox = class {
|
|
|
1354
1354
|
this.catChange = index.createEvent(this, "catChange", 7);
|
|
1355
1355
|
this.catFocus = index.createEvent(this, "catFocus", 7);
|
|
1356
1356
|
this.catBlur = index.createEvent(this, "catBlur", 7);
|
|
1357
|
+
if (hostRef.$hostElement$["s-ei"]) {
|
|
1358
|
+
this.internals = hostRef.$hostElement$["s-ei"];
|
|
1359
|
+
}
|
|
1360
|
+
else {
|
|
1361
|
+
this.internals = hostRef.$hostElement$.attachInternals();
|
|
1362
|
+
hostRef.$hostElement$["s-ei"] = this.internals;
|
|
1363
|
+
}
|
|
1357
1364
|
this._id = `cat-checkbox-${nextUniqueId$a++}`;
|
|
1358
1365
|
this.hasSlottedLabel = false;
|
|
1359
1366
|
this.hasSlottedHint = false;
|
|
@@ -1382,6 +1389,7 @@ const CatCheckbox = class {
|
|
|
1382
1389
|
this.updateResolved();
|
|
1383
1390
|
}
|
|
1384
1391
|
componentWillRender() {
|
|
1392
|
+
this.internals.setFormValue(this.checked ? (this.value ?? 'on') : (this.noValue ?? null));
|
|
1385
1393
|
this.hasSlottedLabel = !!this.hostElement.querySelector('[slot="label"]');
|
|
1386
1394
|
this.hasSlottedHint = !!this.hostElement.querySelector('[slot="hint"]');
|
|
1387
1395
|
}
|
|
@@ -1403,19 +1411,20 @@ const CatCheckbox = class {
|
|
|
1403
1411
|
this.input.blur();
|
|
1404
1412
|
}
|
|
1405
1413
|
render() {
|
|
1406
|
-
return (index.h(index.Host, { key: '
|
|
1414
|
+
return (index.h(index.Host, { key: '05b68d962533497b453115b800e3ea303158212c' }, index.h("label", { key: 'd15945284e20c6d58cf2df7688b036b2e5425f0f', htmlFor: this.id, class: {
|
|
1407
1415
|
'is-hidden': this.labelHidden,
|
|
1408
1416
|
'is-disabled': this.disabled,
|
|
1409
1417
|
'label-left': this.labelLeft,
|
|
1410
1418
|
'align-center': this.alignment === 'center',
|
|
1411
1419
|
'align-end': this.alignment === 'bottom'
|
|
1412
|
-
} }, index.h("input", { key: '
|
|
1420
|
+
} }, index.h("input", { key: 'a5d6f3093e75db63e7c300253518e42106760a52', "data-test": this.testId, ...this.nativeAttributes, part: "input", ref: el => (this.input = el), id: this.id, type: "checkbox", name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, indeterminate: this.indeterminate, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), index.h("span", { key: '0c65b6e371a36520133fd172be153df28196491d', class: "box", "aria-hidden": "true" }, index.h("svg", { key: '044cab34d712b243c9329922482df42694950cfc', class: "check", viewBox: "0 0 12 10" }, index.h("polyline", { key: 'a573d56014dc292b1f41cb1b01f28d814b4a5516', points: "1.5 6 4.5 9 10.5 1" })), index.h("svg", { key: 'f09647dc93bfb204ce076dc77ec32ca9d024ea65', class: "dash", viewBox: "0 0 12 10" }, index.h("polyline", { key: '9cb83216b18ba26d53936911c73e2f3de67916c3', points: "1.5 5 10.5 5" }))), index.h("span", { key: '84c1bee050ca233c8fdda98ceace71de343a350d', class: { label: true, 'label-wrapper': !this.hasSlottedLabel }, part: "label" }, (this.hasSlottedLabel && index.h("slot", { key: '61a771b1bad26a055baed80e762c0aaac09bc3f4', name: "label" })) || this.label, index.h("span", { key: '5a330f42046052f38bb46e149fc029daa8fb8f3e', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (index.h("span", { key: '4579818c0b721db3e9f177c9510072eaef451dba', class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (index.h("span", { key: 'a5ca8a8bc0753aef66d36f86f6c61c31ec4a4069', class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.required'), ")"))))), this.hasHint && (index.h("div", { key: '15312bf5c2d948928fb70e6055b28ae996ffdd1b', class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, index.h("div", { key: 'f1bf992ec81de9aa642093aafa8bd8da73d237f8', class: "box-placeholder" }), index.h(CatFormHint, { key: '66354c340d274a802a21eac6d95b1e4390cfde71', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }) })))));
|
|
1413
1421
|
}
|
|
1414
1422
|
get hasHint() {
|
|
1415
1423
|
return !!this.hint || !!this.hasSlottedHint;
|
|
1416
1424
|
}
|
|
1417
1425
|
onInput() {
|
|
1418
1426
|
this.checked = this.input.checked;
|
|
1427
|
+
this.internals.setFormValue(this.input.checked ? (this.value ?? 'on') : (this.noValue ?? null));
|
|
1419
1428
|
this.indeterminate = this.input.indeterminate;
|
|
1420
1429
|
this.updateResolved();
|
|
1421
1430
|
this.catChange.emit(this.resolvedValue);
|
|
@@ -1429,6 +1438,7 @@ const CatCheckbox = class {
|
|
|
1429
1438
|
updateResolved() {
|
|
1430
1439
|
this.resolvedValue = this.checked ? (this.value ?? true) : (this.noValue ?? false);
|
|
1431
1440
|
}
|
|
1441
|
+
static get formAssociated() { return true; }
|
|
1432
1442
|
get hostElement() { return index.getElement(this); }
|
|
1433
1443
|
};
|
|
1434
1444
|
CatCheckbox.style = CatCheckboxStyle0;
|
|
@@ -10515,6 +10525,13 @@ const CatInput = class {
|
|
|
10515
10525
|
this.catChange = index.createEvent(this, "catChange", 7);
|
|
10516
10526
|
this.catFocus = index.createEvent(this, "catFocus", 7);
|
|
10517
10527
|
this.catBlur = index.createEvent(this, "catBlur", 7);
|
|
10528
|
+
if (hostRef.$hostElement$["s-ei"]) {
|
|
10529
|
+
this.internals = hostRef.$hostElement$["s-ei"];
|
|
10530
|
+
}
|
|
10531
|
+
else {
|
|
10532
|
+
this.internals = hostRef.$hostElement$.attachInternals();
|
|
10533
|
+
hostRef.$hostElement$["s-ei"] = this.internals;
|
|
10534
|
+
}
|
|
10518
10535
|
this._id = `cat-input-${nextUniqueId$7++}`;
|
|
10519
10536
|
this.hasSlottedLabel = false;
|
|
10520
10537
|
this.hasSlottedHint = false;
|
|
@@ -10559,6 +10576,7 @@ const CatInput = class {
|
|
|
10559
10576
|
this.onErrorsChanged(this.errors, undefined, false);
|
|
10560
10577
|
}
|
|
10561
10578
|
componentWillRender() {
|
|
10579
|
+
this.internals.setFormValue(this.value ?? null);
|
|
10562
10580
|
this.hasSlottedLabel = !!this.hostElement.querySelector('[slot="label"]');
|
|
10563
10581
|
this.hasSlottedHint = !!this.hostElement.querySelector('[slot="hint"]');
|
|
10564
10582
|
this.hasSlottedCounter = !!this.hostElement.querySelector('[slot="counter"]');
|
|
@@ -10614,19 +10632,19 @@ const CatInput = class {
|
|
|
10614
10632
|
}
|
|
10615
10633
|
render() {
|
|
10616
10634
|
this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;
|
|
10617
|
-
return (index.h("div", { key: '
|
|
10635
|
+
return (index.h("div", { key: '72c7cf2c86831c1aca03467ec92149fa0a58b05a', class: {
|
|
10618
10636
|
'input-field': true,
|
|
10619
10637
|
'input-horizontal': this.horizontal
|
|
10620
|
-
} }, index.h("div", { key: '
|
|
10638
|
+
} }, index.h("div", { key: '7cc76563550305d886b1a18d2344bf59b27f6fc2', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (index.h("label", { key: '247ad3243e98e5ecf1002e59a84f8f2d1b4f17f4', htmlFor: this.id, part: "label" }, index.h("span", { key: '0d5f489a87735fc11c9dbacf9acded6d7523926a', class: "label-wrapper" }, (this.hasSlottedLabel && index.h("slot", { key: '3ade7278530f2b79a3dda8db8923392b84629feb', name: "label" })) || this.label, index.h("div", { key: '0c1bea5d04c65ceace3ba7a10f7d513301709f86', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (index.h("span", { key: '437f7c224b323514b2a4dcca8ffd6cdc83d3c384', class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (index.h("span", { key: 'cbc29c60d0f624bcceb1b5e55ba6bc38afc8d514', class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.required'), ")")), (this.maxLength || this.hasSlottedCounter) && (index.h("div", { key: 'f00cdace4e8f842019d7ffae484aca11925e2bc2', class: "label-character-count", "aria-hidden": "true" }, this.hasSlottedCounter ? (index.h("slot", { name: "counter" })) : (`${this.value?.length ?? 0}/${this.maxLength}`)))))))), index.h("div", { key: '8c961aaf1d0451118d9f5ae583a228be54b320eb', class: "input-container" }, index.h("div", { key: '6e9e98caaabea18e4a71b8b09baea5355f2eac7b', class: "input-outer-wrapper" }, index.h("div", { key: '38a5db004dbee08ce542dd36bf0da13156887e26', class: {
|
|
10621
10639
|
'input-wrapper': true,
|
|
10622
10640
|
'input-round': this.round,
|
|
10623
10641
|
'input-readonly': this.readonly,
|
|
10624
10642
|
'input-disabled': this.disabled,
|
|
10625
10643
|
'input-invalid': this.invalid
|
|
10626
|
-
}, onClick: () => this.input.focus() }, this.textPrefix && (index.h("span", { key: '
|
|
10644
|
+
}, onClick: () => this.input.focus() }, this.textPrefix && (index.h("span", { key: '350c53ffd8b59df4aa63d23c44213425df9add95', class: "text-prefix", part: "prefix" }, this.textPrefix)), this.icon && !this.iconRight && (index.h("cat-icon", { key: '5f4794dac4ded82db99a395f1fe34fa9d393498f', icon: this.icon, class: "icon-prefix", size: "l", onClick: () => this.doFocus() })), index.h("div", { key: '5514838423e9ecfed27f877edc2bedaeeebb1584', class: "input-inner-wrapper" }, index.h("input", { key: '2dd5de3d46df35470caf488d3f48b5339081c537', "data-test": this.testId, ...this.nativeAttributes, part: "input", ref: el => (this.input = el), id: this.id, class: {
|
|
10627
10645
|
'has-clearable': this.clearable && !this.disabled && !this.readonly && !!this.value,
|
|
10628
10646
|
'has-toggle-password': this.togglePassword && !this.disabled && !this.readonly && !!this.value
|
|
10629
|
-
}, autocomplete: this.autoComplete, disabled: this.disabled, max: this.max, maxlength: this.maxLength, min: this.min, minlength: this.minLength, name: this.name, placeholder: this.placeholder, readonly: this.readonly, required: this.required, type: this.isPasswordShown ? 'text' : this.type, value: this.value, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-invalid": this.invalid ? 'true' : undefined, "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), this.clearable && !this.disabled && !this.readonly && this.value && (index.h("cat-button", { key: '
|
|
10647
|
+
}, autocomplete: this.autoComplete, disabled: this.disabled, max: this.max, maxlength: this.maxLength, min: this.min, minlength: this.minLength, name: this.name, placeholder: this.placeholder, readonly: this.readonly, required: this.required, type: this.isPasswordShown ? 'text' : this.type, value: this.value, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-invalid": this.invalid ? 'true' : undefined, "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), this.clearable && !this.disabled && !this.readonly && this.value && (index.h("cat-button", { key: '0392b61e401ad12bcc32fe6de7f2acdf49184093', class: "clearable", icon: "$cat:input-close", "icon-only": "true", size: "s", variant: "text", "a11y-label": of.catI18nRegistry.t('input.clear'), onClick: this.clear.bind(this), "data-dropdown-no-close": true })), this.togglePassword && !this.disabled && !this.readonly && this.value && (index.h("cat-button", { key: 'c33c6b188af0d2ccbf67b4a3527d7dc53af8a1fb', class: "toggle-password", icon: this.isPasswordShown ? '$cat:input-password-hide' : '$cat:input-password-show', "icon-only": "true", size: "s", variant: "text", "a11y-label": of.catI18nRegistry.t(this.isPasswordShown ? 'input.hidePassword' : 'input.showPassword'), onClick: this.doTogglePassword.bind(this) }))), this.loading && index.h("cat-spinner", { key: '3c51656392e532a3a16efcc5dbf181c40b96ed32', size: "m", class: "icon-loading" }), !this.invalid && this.icon && this.iconRight && (index.h("cat-icon", { key: 'f3a527250b2ab0ae5bb56217366cabe00c5e7bee', icon: this.icon, class: "icon-suffix", size: "l", onClick: () => this.doFocus() })), this.invalid && (index.h("cat-icon", { key: '063104b3c65eceb1260109c0f55944ca39c5c2ac', icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l" })), this.textSuffix && (index.h("span", { key: '0508e322d57cc28a245a8e1fe2f16e02af04679b', class: "text-suffix", part: "suffix" }, this.textSuffix))), index.h("slot", { key: 'b5ea42f17934631b97c05c0ccfbadd8a1554d779', name: "addon" })), this.hasHint && (index.h(CatFormHint, { key: '549e082c4e1ff946d2d26ce3843db26af96333d3', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }), errorMap: this.errorMap })))));
|
|
10630
10648
|
}
|
|
10631
10649
|
get hasHint() {
|
|
10632
10650
|
return !!this.hint || !!this.hasSlottedHint || this.invalid;
|
|
@@ -10636,6 +10654,7 @@ const CatInput = class {
|
|
|
10636
10654
|
}
|
|
10637
10655
|
onInput() {
|
|
10638
10656
|
this.value = this.input.value;
|
|
10657
|
+
this.internals.setFormValue(this.input.value);
|
|
10639
10658
|
this.catChange.emit(this.value);
|
|
10640
10659
|
this.showErrorsIfTimeout();
|
|
10641
10660
|
}
|
|
@@ -10679,6 +10698,7 @@ const CatInput = class {
|
|
|
10679
10698
|
return undefined;
|
|
10680
10699
|
}
|
|
10681
10700
|
static get delegatesFocus() { return true; }
|
|
10701
|
+
static get formAssociated() { return true; }
|
|
10682
10702
|
get hostElement() { return index.getElement(this); }
|
|
10683
10703
|
static get watchers() { return {
|
|
10684
10704
|
"errors": ["onErrorsChanged"]
|
|
@@ -13568,6 +13588,13 @@ const CatTextarea = class {
|
|
|
13568
13588
|
this.catChange = index.createEvent(this, "catChange", 7);
|
|
13569
13589
|
this.catFocus = index.createEvent(this, "catFocus", 7);
|
|
13570
13590
|
this.catBlur = index.createEvent(this, "catBlur", 7);
|
|
13591
|
+
if (hostRef.$hostElement$["s-ei"]) {
|
|
13592
|
+
this.internals = hostRef.$hostElement$["s-ei"];
|
|
13593
|
+
}
|
|
13594
|
+
else {
|
|
13595
|
+
this.internals = hostRef.$hostElement$.attachInternals();
|
|
13596
|
+
hostRef.$hostElement$["s-ei"] = this.internals;
|
|
13597
|
+
}
|
|
13571
13598
|
this._id = `cat-textarea-${nextUniqueId$2++}`;
|
|
13572
13599
|
this.hasSlottedLabel = false;
|
|
13573
13600
|
this.hasSlottedHint = false;
|
|
@@ -13601,6 +13628,7 @@ const CatTextarea = class {
|
|
|
13601
13628
|
this.onErrorsChanged(this.errors, undefined, false);
|
|
13602
13629
|
}
|
|
13603
13630
|
componentWillRender() {
|
|
13631
|
+
this.internals.setFormValue(this.value ?? null);
|
|
13604
13632
|
this.hasSlottedLabel = !!this.hostElement.querySelector('[slot="label"]');
|
|
13605
13633
|
this.hasSlottedHint = !!this.hostElement.querySelector('[slot="hint"]');
|
|
13606
13634
|
this.hasSlottedCounter = !!this.hostElement.querySelector('[slot="counter"]');
|
|
@@ -13647,15 +13675,15 @@ const CatTextarea = class {
|
|
|
13647
13675
|
}
|
|
13648
13676
|
render() {
|
|
13649
13677
|
this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;
|
|
13650
|
-
return (index.h(index.Host, { key: '
|
|
13678
|
+
return (index.h(index.Host, { key: '15b9959f246c2252a40612928bcbbb3062f5ee33' }, index.h("div", { key: '559389b16d2ffbc57f220f042a8bf5406ab38c46', class: {
|
|
13651
13679
|
'textarea-field': true,
|
|
13652
13680
|
'textarea-horizontal': this.horizontal
|
|
13653
|
-
} }, index.h("div", { key: '
|
|
13681
|
+
} }, index.h("div", { key: '5b02ba0adc0df7aa500f4031bbeab1b2c7ab8c12', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (index.h("label", { key: '3b40ff524f852b431f6e98197810503d981ee315', htmlFor: this.id, part: "label" }, index.h("span", { key: 'afcad9c98545e36b1d1f199bf166145114932df1', class: "label-wrapper" }, (this.hasSlottedLabel && index.h("slot", { key: '6846020e1fa1600ff7bbc2cabc789b7289aed021', name: "label" })) || this.label, index.h("div", { key: '92ea11607812b8f3892aee8c0ce4ac2ca8dd5e02', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (index.h("span", { key: '47ea9bca97afbfe7fa4433260311342425fbfeda', class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (index.h("span", { key: '9c084e2bc9f2cd6c601bd43d2dc01af7ce9bfa7d', class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.required'), ")")), (this.maxLength || this.hasSlottedCounter) && (index.h("div", { key: '1de2f7b5006f76b79b730fa75eff5829e29dc113', class: "label-character-count", "aria-hidden": "true" }, this.hasSlottedCounter ? (index.h("slot", { name: "counter" })) : (`${this.value?.length ?? 0}/${this.maxLength}`)))))))), index.h("div", { key: 'b06f84a61994d2648a154b50fc2b75bb440901ff', class: "textarea-container" }, index.h("div", { key: '7e64f6176bd76f10c20c7fc952ba1ac55ad2e401', class: {
|
|
13654
13682
|
'textarea-wrapper': true,
|
|
13655
13683
|
'textarea-readonly': this.readonly,
|
|
13656
13684
|
'textarea-disabled': this.disabled,
|
|
13657
13685
|
'textarea-invalid': this.invalid
|
|
13658
|
-
} }, index.h("textarea", { key: '
|
|
13686
|
+
} }, index.h("textarea", { key: '04189852da504f91cb6219aefb58c1ed393996f1', "data-test": this.testId, ...this.nativeAttributes, part: "textarea", ref: el => (this.textarea = el), id: this.id, disabled: this.disabled, autocomplete: this.autoComplete, maxlength: this.maxLength, minlength: this.minLength, name: this.name, placeholder: this.placeholder, readonly: this.readonly, required: this.required, rows: this.rows, value: this.value, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-invalid": this.invalid ? 'true' : undefined, "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), this.invalid && (index.h("cat-icon", { key: '794c3208f8a8db16c912960b643a6f5207496111', icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l", onClick: () => this.textarea.focus() }))), this.hasHint && (index.h(CatFormHint, { key: '96a271ee88d1608283efbc5f8913586da8e787e3', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }), errorMap: this.errorMap }))))));
|
|
13659
13687
|
}
|
|
13660
13688
|
get hasHint() {
|
|
13661
13689
|
return !!this.hint || !!this.hasSlottedHint || this.invalid;
|
|
@@ -13665,6 +13693,7 @@ const CatTextarea = class {
|
|
|
13665
13693
|
}
|
|
13666
13694
|
onInput() {
|
|
13667
13695
|
this.value = this.textarea.value;
|
|
13696
|
+
this.internals.setFormValue(this.textarea.value);
|
|
13668
13697
|
this.catChange.emit(this.value);
|
|
13669
13698
|
this.showErrorsIfTimeout();
|
|
13670
13699
|
}
|
|
@@ -13696,6 +13725,7 @@ const CatTextarea = class {
|
|
|
13696
13725
|
}
|
|
13697
13726
|
}
|
|
13698
13727
|
static get delegatesFocus() { return true; }
|
|
13728
|
+
static get formAssociated() { return true; }
|
|
13699
13729
|
get hostElement() { return index.getElement(this); }
|
|
13700
13730
|
static get watchers() { return {
|
|
13701
13731
|
"errors": ["onErrorsChanged"]
|
|
@@ -13981,6 +14011,13 @@ const CatToggle = class {
|
|
|
13981
14011
|
this.catChange = index.createEvent(this, "catChange", 7);
|
|
13982
14012
|
this.catFocus = index.createEvent(this, "catFocus", 7);
|
|
13983
14013
|
this.catBlur = index.createEvent(this, "catBlur", 7);
|
|
14014
|
+
if (hostRef.$hostElement$["s-ei"]) {
|
|
14015
|
+
this.internals = hostRef.$hostElement$["s-ei"];
|
|
14016
|
+
}
|
|
14017
|
+
else {
|
|
14018
|
+
this.internals = hostRef.$hostElement$.attachInternals();
|
|
14019
|
+
hostRef.$hostElement$["s-ei"] = this.internals;
|
|
14020
|
+
}
|
|
13984
14021
|
this._id = `cat-toggle-${nextUniqueId$1++}`;
|
|
13985
14022
|
this.hasSlottedLabel = false;
|
|
13986
14023
|
this.hasSlottedHint = false;
|
|
@@ -14007,6 +14044,7 @@ const CatToggle = class {
|
|
|
14007
14044
|
this.updateResolved();
|
|
14008
14045
|
}
|
|
14009
14046
|
componentWillRender() {
|
|
14047
|
+
this.internals.setFormValue(this.checked ? (this.value ?? 'on') : (this.noValue ?? null));
|
|
14010
14048
|
this.hasSlottedLabel = !!this.hostElement.querySelector('[slot="label"]');
|
|
14011
14049
|
this.hasSlottedHint = !!this.hostElement.querySelector('[slot="hint"]');
|
|
14012
14050
|
}
|
|
@@ -14029,19 +14067,20 @@ const CatToggle = class {
|
|
|
14029
14067
|
}
|
|
14030
14068
|
render() {
|
|
14031
14069
|
this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;
|
|
14032
|
-
return (index.h(index.Host, { key: '
|
|
14070
|
+
return (index.h(index.Host, { key: '4648a8de33b6a63ba94cd5fd15b6e3e65986470d' }, index.h("label", { key: '063aa2a20504db693e4ae6d96733f96217dcc4b4', htmlFor: this.id, class: {
|
|
14033
14071
|
'is-hidden': this.labelHidden,
|
|
14034
14072
|
'is-disabled': this.disabled,
|
|
14035
14073
|
'label-left': this.labelLeft,
|
|
14036
14074
|
'align-center': this.alignment === 'center',
|
|
14037
14075
|
'align-end': this.alignment === 'bottom'
|
|
14038
|
-
} }, index.h("input", { key: '
|
|
14076
|
+
} }, index.h("input", { key: 'd7ed53b6668b5335621e92fe648f28d34e43d371', "data-test": this.testId, ...this.nativeAttributes, part: "input", ref: el => (this.input = el), id: this.id, type: "checkbox", name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, class: "form-check-input", role: "switch", onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), index.h("span", { key: '852f811c47488c5ee7ba5536c79c82502dd18f92', class: "toggle" }), index.h("span", { key: '00efe1901a1b2ad93b24362124c7d5b604ca62a9', class: "label", part: "label" }, (this.hasSlottedLabel && index.h("slot", { key: '039e0fdcd80e110bb1b2ab6ac74472ff9d2e82f4', name: "label" })) || this.label)), this.hasHint && (index.h("div", { key: '4c59d7a015ac1d0c9430e569244ba20bd71886e2', class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, index.h("div", { key: '53f611eaded0a9048c79d82a444144c104589208', class: "toggle-placeholder" }), index.h(CatFormHint, { key: '250ebfbbbeafe28c1e47c857c6af1ee2429edcb5', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }) })))));
|
|
14039
14077
|
}
|
|
14040
14078
|
get hasHint() {
|
|
14041
14079
|
return !!this.hint || !!this.hasSlottedHint;
|
|
14042
14080
|
}
|
|
14043
14081
|
onInput() {
|
|
14044
14082
|
this.checked = this.input.checked;
|
|
14083
|
+
this.internals.setFormValue(this.input.checked ? (this.value ?? 'on') : (this.noValue ?? null));
|
|
14045
14084
|
this.updateResolved();
|
|
14046
14085
|
this.catChange.emit(this.resolvedValue);
|
|
14047
14086
|
}
|
|
@@ -14055,6 +14094,7 @@ const CatToggle = class {
|
|
|
14055
14094
|
this.resolvedValue = this.checked ? (this.value ?? true) : (this.noValue ?? false);
|
|
14056
14095
|
}
|
|
14057
14096
|
static get delegatesFocus() { return true; }
|
|
14097
|
+
static get formAssociated() { return true; }
|
|
14058
14098
|
get hostElement() { return index.getElement(this); }
|
|
14059
14099
|
};
|
|
14060
14100
|
CatToggle.style = CatToggleStyle0;
|