@public-ui/hydrate 2.2.1-e6bb4064f6c9eed624b5929636c056bc0384b2af.0 → 2.2.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/index.js +113 -79
- package/dist/index.mjs +113 -79
- package/package.json +3 -3
package/dist/index.js
CHANGED
|
@@ -4239,7 +4239,12 @@ const validateMsg = (component, value) => {
|
|
|
4239
4239
|
}
|
|
4240
4240
|
catch (e) {
|
|
4241
4241
|
}
|
|
4242
|
-
watchValidator(component, `_msg`, (value) => isObject$1(value), new Set(['MsgPropType']), value
|
|
4242
|
+
watchValidator(component, `_msg`, (value) => isObject$1(value) && typeof (value === null || value === void 0 ? void 0 : value._description) === 'string', new Set(['MsgPropType']), value, {
|
|
4243
|
+
defaultValue: {
|
|
4244
|
+
_description: '',
|
|
4245
|
+
_type: 'error',
|
|
4246
|
+
},
|
|
4247
|
+
});
|
|
4243
4248
|
});
|
|
4244
4249
|
};
|
|
4245
4250
|
|
|
@@ -4293,6 +4298,12 @@ const validateShow = (component, value, hooks) => {
|
|
|
4293
4298
|
watchBoolean(component, '_show', value, hooks);
|
|
4294
4299
|
};
|
|
4295
4300
|
|
|
4301
|
+
const validateSpellCheck = (component, value) => {
|
|
4302
|
+
watchBoolean(component, '_spellCheck', value, {
|
|
4303
|
+
defaultValue: undefined,
|
|
4304
|
+
});
|
|
4305
|
+
};
|
|
4306
|
+
|
|
4296
4307
|
const validateSuggestions = (component, value) => {
|
|
4297
4308
|
watchJsonArrayString(component, '_suggestions', (item) => typeof item === 'string' || typeof item === 'number', value, undefined, {
|
|
4298
4309
|
hooks: {
|
|
@@ -6144,7 +6155,7 @@ class InputController extends ControlledInputController {
|
|
|
6144
6155
|
});
|
|
6145
6156
|
}
|
|
6146
6157
|
else {
|
|
6147
|
-
this.validateMsg();
|
|
6158
|
+
this.validateMsg(undefined);
|
|
6148
6159
|
}
|
|
6149
6160
|
}
|
|
6150
6161
|
validateHideError(value) {
|
|
@@ -6184,12 +6195,6 @@ class InputController extends ControlledInputController {
|
|
|
6184
6195
|
});
|
|
6185
6196
|
}
|
|
6186
6197
|
validateMsg(value) {
|
|
6187
|
-
if (value === undefined) {
|
|
6188
|
-
value = {
|
|
6189
|
-
_description: '',
|
|
6190
|
-
_type: 'error',
|
|
6191
|
-
};
|
|
6192
|
-
}
|
|
6193
6198
|
validateMsg(this.component, value);
|
|
6194
6199
|
}
|
|
6195
6200
|
validateOn(value) {
|
|
@@ -6219,7 +6224,9 @@ class InputController extends ControlledInputController {
|
|
|
6219
6224
|
this.validateAccessKey(this.component._accessKey);
|
|
6220
6225
|
this.validateAdjustHeight(this.component._adjustHeight);
|
|
6221
6226
|
this.validateError(this.component._error);
|
|
6222
|
-
|
|
6227
|
+
if (this.component._msg) {
|
|
6228
|
+
this.validateMsg(this.component._msg);
|
|
6229
|
+
}
|
|
6223
6230
|
this.validateDisabled(this.component._disabled);
|
|
6224
6231
|
this.validateHideError(this.component._hideError);
|
|
6225
6232
|
this.validateHideLabel(this.component._hideLabel);
|
|
@@ -6459,18 +6466,18 @@ class KolCombobox {
|
|
|
6459
6466
|
render() {
|
|
6460
6467
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
6461
6468
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
6462
|
-
return (hAsync(Host, { key: 'c3278c2069dbca97941ec443ad0facc36db203d8', class: "kol-combobox" }, hAsync("div", { key: '248c0d3e8d08db48834a704a3c5cf2178a92730d', class: clsx('combobox', this.state._disabled && 'combobox--disabled') }, hAsync(KolInputTag, { key: '5d8af20e02c638b8f631bb9ebef6bbefcd035f45', _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _disabled: this.state._disabled, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _msg: this.state._msg, _required: this.state._required, _shortKey: this.state._shortKey, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: 'bdb1fc5448a1b2c2b728fe52e3044507fb12720e', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' || typeof this.state._shortKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedBadgeText, { badgeText: buildBadgeTextString(this.state._accessKey, this.state._shortKey), label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, buildBadgeTextString(this.state._accessKey, this.state._shortKey)))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '7bf99311858263462241bee3bf5d024ba194f5e9', slot: "input" }, hAsync("div", { key: '9d3b73ddbfed9e8326c6b99d141acaf27dbba58f', class: "combobox__group" }, hAsync("input", Object.assign({ key: '
|
|
6469
|
+
return (hAsync(Host, { key: 'c3278c2069dbca97941ec443ad0facc36db203d8', class: "kol-combobox" }, hAsync("div", { key: '248c0d3e8d08db48834a704a3c5cf2178a92730d', class: clsx('combobox', this.state._disabled && 'combobox--disabled') }, hAsync(KolInputTag, { key: '5d8af20e02c638b8f631bb9ebef6bbefcd035f45', _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _disabled: this.state._disabled, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _msg: this.state._msg, _required: this.state._required, _shortKey: this.state._shortKey, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: 'bdb1fc5448a1b2c2b728fe52e3044507fb12720e', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' || typeof this.state._shortKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedBadgeText, { badgeText: buildBadgeTextString(this.state._accessKey, this.state._shortKey), label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, buildBadgeTextString(this.state._accessKey, this.state._shortKey)))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '7bf99311858263462241bee3bf5d024ba194f5e9', slot: "input" }, hAsync("div", { key: '9d3b73ddbfed9e8326c6b99d141acaf27dbba58f', class: "combobox__group" }, hAsync("input", Object.assign({ key: 'a1d739b73b806459f28b9b44c795d383545d23c9', ref: this.catchRef, class: "combobox__input", type: "text", role: "combobox", "aria-autocomplete": "both", "aria-expanded": this._isOpen ? 'true' : 'false', "aria-controls": "listbox", value: this.state._value, accessKey: this.state._accessKey, "aria-describedby": ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, "aria-label": this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, "aria-labelledby": this.state._id, "aria-activedescendant": this._isOpen && this._focusedOptionIndex >= 0 ? `option-${this._focusedOptionIndex}` : undefined, autoCapitalize: "off", autoCorrect: "off", disabled: this.state._disabled, id: this.state._id, name: this.state._name, required: this.state._required }, this.controller.onFacade, { onFocus: (event) => {
|
|
6463
6470
|
this.controller.onFacade.onFocus(event);
|
|
6464
6471
|
this.inputHasFocus = true;
|
|
6465
6472
|
}, onBlur: (event) => {
|
|
6466
6473
|
this.controller.onFacade.onBlur(event);
|
|
6467
6474
|
this.inputHasFocus = false;
|
|
6468
|
-
}, onChange: this.onChange.bind(this), onInput: this.onInput.bind(this), placeholder: this.state._placeholder })), hAsync("button", { key: '
|
|
6475
|
+
}, onChange: this.onChange.bind(this), onInput: this.onInput.bind(this), placeholder: this.state._placeholder })), hAsync("button", { key: '8a224c4f264cae4581cc66adec944460feaf89c6', tabindex: "-1", class: "combobox__icon", onClick: this.toggleListbox.bind(this), disabled: this.state._disabled }, hAsync(KolIconTag, { key: '622583975eb2d9a0f3dbb4d72d3eb1f421a3d5a1', _icons: "codicon codicon-triangle-down", _label: translate('kol-dropdown') }))), this._isOpen && !(this.state._disabled === true) && (hAsync("ul", { key: '8e7e8cd1f3e1cbcd99faf4b0060b108c85faefcc', role: "listbox", class: clsx('combobox__listbox', this.blockSuggestionMouseOver && 'combobox__listbox--cursor-hidden'), onKeyDown: this.handleKeyDownDropdown.bind(this) }, Array.isArray(this._filteredSuggestions) &&
|
|
6469
6476
|
this._filteredSuggestions.length > 0 &&
|
|
6470
6477
|
this._filteredSuggestions.map((option, index) => (hAsync("li", { id: `option-${index}`, key: `-${index}`, ref: (el) => {
|
|
6471
6478
|
if (el)
|
|
6472
6479
|
this.refSuggestions[index] = el;
|
|
6473
|
-
}, "data-index": index, tabIndex: -1, role: "option", "aria-selected": this.state._value === option, onClick: (e) => {
|
|
6480
|
+
}, "data-index": index, tabIndex: -1, role: "option", "aria-selected": this.state._value === option ? 'true' : undefined, onClick: (e) => {
|
|
6474
6481
|
this.selectOption(e, option);
|
|
6475
6482
|
this.toggleListbox();
|
|
6476
6483
|
}, onMouseOver: () => {
|
|
@@ -7850,7 +7857,7 @@ class KolInputColor {
|
|
|
7850
7857
|
return (hAsync(Host, { key: '267d32979240084675613c62100026e9c887ec99', class: "kol-input-color" }, hAsync(KolInputTag, { key: '9b0bb20397e411dca2d205beef02ce115a60977f', class: {
|
|
7851
7858
|
color: true,
|
|
7852
7859
|
'hide-label': !!this.state._hideLabel,
|
|
7853
|
-
}, _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _disabled: this.state._disabled, _msg: this.state._msg, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _hideError: this.state._hideError, _id: this.state._id, _label: this.state._label, _shortKey: this.state._shortKey, _suggestions: this.state._suggestions, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '7f0501edad65f345d2c3a6641093db2cdf5c0e63', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' || typeof this.state._shortKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedBadgeText, { badgeText: buildBadgeTextString(this.state._accessKey, this.state._shortKey), label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, buildBadgeTextString(this.state._accessKey, this.state._shortKey)))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: 'f1318bbdd622361e3b819bb90921079dbfc0575a', slot: "input" }, hAsync("input", Object.assign({ key: '
|
|
7860
|
+
}, _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _disabled: this.state._disabled, _msg: this.state._msg, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _hideError: this.state._hideError, _id: this.state._id, _label: this.state._label, _shortKey: this.state._shortKey, _suggestions: this.state._suggestions, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '7f0501edad65f345d2c3a6641093db2cdf5c0e63', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' || typeof this.state._shortKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedBadgeText, { badgeText: buildBadgeTextString(this.state._accessKey, this.state._shortKey), label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, buildBadgeTextString(this.state._accessKey, this.state._shortKey)))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: 'f1318bbdd622361e3b819bb90921079dbfc0575a', slot: "input" }, hAsync("input", Object.assign({ key: 'fcf10809a84c0d1c7e276480d6ccf38f85b8e261', 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", type: "color", value: this.state._value }, this.controller.onFacade, { onFocus: (event) => {
|
|
7854
7861
|
this.controller.onFacade.onFocus(event);
|
|
7855
7862
|
this.inputHasFocus = true;
|
|
7856
7863
|
}, onBlur: (event) => {
|
|
@@ -8226,7 +8233,7 @@ class KolInputDate {
|
|
|
8226
8233
|
return (hAsync(Host, { key: '023c36b654230fa048f8a42c481af8d66d719ff2', class: { 'kol-input-date': true, 'has-value': this.state._hasValue } }, hAsync(KolInputTag, { key: '8c62e80c2fb1d5d7556abf81c096973cb689c431', class: {
|
|
8227
8234
|
[this.state._type]: true,
|
|
8228
8235
|
'hide-label': !!this.state._hideLabel,
|
|
8229
|
-
}, _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _disabled: this.state._disabled, _msg: this.state._msg, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _suggestions: this.state._suggestions, _readOnly: this.state._readOnly, _required: this.state._required, _shortKey: this.state._shortKey, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched }, hAsync("span", { key: '5ddac8288007ae72d9a2c9d4232454fcf8ced485', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' || typeof this.state._shortKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedBadgeText, { badgeText: buildBadgeTextString(this.state._accessKey, this.state._shortKey), label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, buildBadgeTextString(this.state._accessKey || this.state._shortKey)))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '93501ba3e4b31203b9eaa8710e00052a4a44b4f8', slot: "input" }, hAsync("input", Object.assign({ key: '
|
|
8236
|
+
}, _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _disabled: this.state._disabled, _msg: this.state._msg, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _suggestions: this.state._suggestions, _readOnly: this.state._readOnly, _required: this.state._required, _shortKey: this.state._shortKey, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched }, hAsync("span", { key: '5ddac8288007ae72d9a2c9d4232454fcf8ced485', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' || typeof this.state._shortKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedBadgeText, { badgeText: buildBadgeTextString(this.state._accessKey, this.state._shortKey), label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, buildBadgeTextString(this.state._accessKey || this.state._shortKey)))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '93501ba3e4b31203b9eaa8710e00052a4a44b4f8', slot: "input" }, hAsync("input", Object.assign({ key: '975399701d3067bfaf1b273d0758dd2035730561', 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, type: this.state._type, value: this.state._value || undefined }, this.controller.onFacade, { onKeyDown: this.onKeyDown, onBlur: (event) => {
|
|
8230
8237
|
this.controller.onFacade.onBlur(event);
|
|
8231
8238
|
this.inputHasFocus = false;
|
|
8232
8239
|
}, onFocus: (event) => {
|
|
@@ -8567,13 +8574,16 @@ class InputTextController extends InputTextEmailController {
|
|
|
8567
8574
|
this.hasError = false;
|
|
8568
8575
|
this.component = component;
|
|
8569
8576
|
}
|
|
8577
|
+
validateSpellCheck(value) {
|
|
8578
|
+
validateSpellCheck(this.component, value);
|
|
8579
|
+
}
|
|
8570
8580
|
validateType(value) {
|
|
8571
8581
|
watchValidator(this.component, '_type', (value) => typeof value === 'string' && inputTextTypeOptions.includes(value), new Set([`String {${inputTextTypeOptions.join(', ')}`]), value);
|
|
8572
8582
|
}
|
|
8573
8583
|
componentWillLoad() {
|
|
8574
8584
|
super.componentWillLoad();
|
|
8585
|
+
this.validateSpellCheck(this.component._spellCheck);
|
|
8575
8586
|
this.validateType(this.component._type);
|
|
8576
|
-
this.validateHasCounter(this.component._hasCounter);
|
|
8577
8587
|
}
|
|
8578
8588
|
}
|
|
8579
8589
|
|
|
@@ -8613,7 +8623,7 @@ class KolInputEmail {
|
|
|
8613
8623
|
return (hAsync(Host, { key: '0a6dae92f7eceb1477c24f41f975e5554cf88ea9', class: {
|
|
8614
8624
|
'kol-input-email': true,
|
|
8615
8625
|
'has-value': this.state._hasValue,
|
|
8616
|
-
} }, hAsync(KolInputTag, { key: '0924c898848ac3aef5f738761bd3b62a681548eb', class: { email: true, 'hide-label': !!this.state._hideLabel }, _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _currentLength: this.state._currentLength, _disabled: this.state._disabled, _msg: this.state._msg, _hideError: this.state._hideError, _hasCounter: this.state._hasCounter, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _suggestions: this.state._suggestions, _maxLength: this.state._maxLength, _readOnly: this.state._readOnly, _required: this.state._required, _shortKey: this.state._shortKey, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: 'd64b8718e6f2e5bd518601ecee7617249e063dbe', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' || typeof this.state._shortKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedBadgeText, { badgeText: buildBadgeTextString(this.state._accessKey, this.state._shortKey), label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, buildBadgeTextString(this.state._accessKey, this.state._shortKey)))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '636e58b8611da6aaf134e94ead11934406bc44b4', slot: "input" }, hAsync("input", Object.assign({ key: '
|
|
8626
|
+
} }, hAsync(KolInputTag, { key: '0924c898848ac3aef5f738761bd3b62a681548eb', class: { email: true, 'hide-label': !!this.state._hideLabel }, _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _currentLength: this.state._currentLength, _disabled: this.state._disabled, _msg: this.state._msg, _hideError: this.state._hideError, _hasCounter: this.state._hasCounter, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _suggestions: this.state._suggestions, _maxLength: this.state._maxLength, _readOnly: this.state._readOnly, _required: this.state._required, _shortKey: this.state._shortKey, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: 'd64b8718e6f2e5bd518601ecee7617249e063dbe', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' || typeof this.state._shortKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedBadgeText, { badgeText: buildBadgeTextString(this.state._accessKey, this.state._shortKey), label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, buildBadgeTextString(this.state._accessKey, this.state._shortKey)))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '636e58b8611da6aaf134e94ead11934406bc44b4', slot: "input" }, hAsync("input", Object.assign({ key: '395b8ac51cb57f363548891fa6e0d49de33cbc17', 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, type: "email", value: this.state._value }, this.controller.onFacade, { onKeyDown: this.onKeyDown, onInput: this.onInput, onFocus: (event) => {
|
|
8617
8627
|
this.controller.onFacade.onFocus(event);
|
|
8618
8628
|
this.inputHasFocus = true;
|
|
8619
8629
|
}, onBlur: (event) => {
|
|
@@ -8903,7 +8913,7 @@ class KolInputFile {
|
|
|
8903
8913
|
return (hAsync(Host, { key: 'e5a5bf2cb09d060fa8558b234e03a8a3772ab394', class: "kol-input-file" }, hAsync(KolInputTag, { key: '306dd041fd374663109d6e0e1354d3e334dd3652', class: {
|
|
8904
8914
|
file: true,
|
|
8905
8915
|
'hide-label': !!this.state._hideLabel,
|
|
8906
|
-
}, _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _disabled: this.state._disabled, _msg: this.state._msg, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _required: this.state._required, _shortKey: this.state._shortKey, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '943463859848736c8d2c43a3a02de8e99c660904', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' || typeof this.state._shortKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedBadgeText, { badgeText: buildBadgeTextString(this.state._accessKey, this.state._shortKey), label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, buildBadgeTextString(this.state._accessKey, this.state._shortKey)))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: 'f0aa210f2d890e689994256cd87321f484162179', slot: "input" }, hAsync("input", Object.assign({ key: '
|
|
8916
|
+
}, _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _disabled: this.state._disabled, _msg: this.state._msg, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _required: this.state._required, _shortKey: this.state._shortKey, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '943463859848736c8d2c43a3a02de8e99c660904', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' || typeof this.state._shortKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedBadgeText, { badgeText: buildBadgeTextString(this.state._accessKey, this.state._shortKey), label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, buildBadgeTextString(this.state._accessKey, this.state._shortKey)))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: 'f0aa210f2d890e689994256cd87321f484162179', slot: "input" }, hAsync("input", Object.assign({ key: 'ae3ed46e21125c7c77335e8248882c0d6b84be79', 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, type: "file", value: this.state._value }, this.controller.onFacade, { onChange: this.onChange, onInput: this.onInput, onFocus: (event) => {
|
|
8907
8917
|
this.controller.onFacade.onFocus(event);
|
|
8908
8918
|
this.inputHasFocus = true;
|
|
8909
8919
|
}, onBlur: (event) => {
|
|
@@ -9211,7 +9221,7 @@ class KolInputNumber {
|
|
|
9211
9221
|
} }, hAsync(KolInputTag, { key: 'cca3c8727c315de0af6d0bfb46476b0ece3a590c', class: {
|
|
9212
9222
|
number: true,
|
|
9213
9223
|
'hide-label': !!this.state._hideLabel,
|
|
9214
|
-
}, _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _disabled: this.state._disabled, _msg: this.state._msg, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _suggestions: this.state._suggestions, _readOnly: this.state._readOnly, _required: this.state._required, _shortKey: this.state._shortKey, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched }, hAsync("span", { key: '77e22ae9678676a8f3db1a4c31ccf445af311d75', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' || typeof this.state._shortKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedBadgeText, { badgeText: buildBadgeTextString(this.state._accessKey, this.state._shortKey), label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, buildBadgeTextString(this.state._accessKey, this.state._shortKey)))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '6b717a3b135d57ffaccee69534077169ef8ba3f6', slot: "input" }, hAsync("input", Object.assign({ key: '
|
|
9224
|
+
}, _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _disabled: this.state._disabled, _msg: this.state._msg, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _suggestions: this.state._suggestions, _readOnly: this.state._readOnly, _required: this.state._required, _shortKey: this.state._shortKey, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched }, hAsync("span", { key: '77e22ae9678676a8f3db1a4c31ccf445af311d75', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' || typeof this.state._shortKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedBadgeText, { badgeText: buildBadgeTextString(this.state._accessKey, this.state._shortKey), label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, buildBadgeTextString(this.state._accessKey, this.state._shortKey)))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '6b717a3b135d57ffaccee69534077169ef8ba3f6', slot: "input" }, hAsync("input", Object.assign({ key: 'ec0c34b9fd6bb3da27f94541903201599d841ff5', 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, type: "number", value: this.state._value }, this.controller.onFacade, { onKeyDown: this.onKeyDown, onFocus: (event) => {
|
|
9215
9225
|
this.controller.onFacade.onFocus(event);
|
|
9216
9226
|
this.inputHasFocus = true;
|
|
9217
9227
|
}, onBlur: (event) => {
|
|
@@ -9462,7 +9472,6 @@ class KolInputPassword {
|
|
|
9462
9472
|
(_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus();
|
|
9463
9473
|
}
|
|
9464
9474
|
render() {
|
|
9465
|
-
var _a;
|
|
9466
9475
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
9467
9476
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
9468
9477
|
return (hAsync(Host, { key: 'e4bbac1ce3dd4e5d3f22168588a8932403474775', class: {
|
|
@@ -9471,17 +9480,17 @@ class KolInputPassword {
|
|
|
9471
9480
|
} }, hAsync(KolInputTag, { key: 'ea8e123c738e56d384e323e8896bae2d46fb39df', class: {
|
|
9472
9481
|
'hide-label': !!this.state._hideLabel,
|
|
9473
9482
|
password: true,
|
|
9474
|
-
}, _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _currentLength: this.state._currentLength, _disabled: this.state._disabled, _msg: this.state._msg, _hasCounter: this.state._hasCounter, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _maxLength: this.state._maxLength, _readOnly: this.state._readOnly, _required: this.state._required, _shortKey: this.state._shortKey, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '8b3ea92e78b33d8e2d715cd175db73d783f9dc29', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' || typeof this.state._shortKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedBadgeText, { badgeText: buildBadgeTextString(this.state._accessKey, this.state._shortKey), label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, buildBadgeTextString(this.state._accessKey, this.state._shortKey)))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: 'a531257549c04c2787ce78511af4cb50e3d4013e', slot: "input" }, hAsync("input", Object.assign({ key: '
|
|
9483
|
+
}, _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _currentLength: this.state._currentLength, _disabled: this.state._disabled, _msg: this.state._msg, _hasCounter: this.state._hasCounter, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _maxLength: this.state._maxLength, _readOnly: this.state._readOnly, _required: this.state._required, _shortKey: this.state._shortKey, _smartButton: this.state._smartButton, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '8b3ea92e78b33d8e2d715cd175db73d783f9dc29', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' || typeof this.state._shortKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedBadgeText, { badgeText: buildBadgeTextString(this.state._accessKey, this.state._shortKey), label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, buildBadgeTextString(this.state._accessKey, this.state._shortKey)))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: 'a531257549c04c2787ce78511af4cb50e3d4013e', slot: "input" }, hAsync("input", Object.assign({ key: '84bf423a5e3ee87cdf094124b064869f020b17a3', 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, type: this._passwordVisible ? 'text' : 'password', value: this.state._value }, this.controller.onFacade, { onKeyDown: this.onKeyDown, onInput: this.onInput, onFocus: (event) => {
|
|
9475
9484
|
this.controller.onFacade.onFocus(event);
|
|
9476
9485
|
this.inputHasFocus = true;
|
|
9477
9486
|
}, onBlur: (event) => {
|
|
9478
9487
|
this.controller.onFacade.onBlur(event);
|
|
9479
9488
|
this.inputHasFocus = false;
|
|
9480
|
-
} })), this._variant === 'visibility-toggle'
|
|
9489
|
+
} })), this._variant === 'visibility-toggle' ? (hAsync(KolButtonWcTag, { class: "password-toggle-button", _label: this._passwordVisible ? translate('kol-hide-password') : translate('kol-show-password'), _variant: "ghost", _disabled: this._disabled, _on: {
|
|
9481
9490
|
onClick: () => {
|
|
9482
9491
|
this._passwordVisible = !this._passwordVisible;
|
|
9483
9492
|
},
|
|
9484
|
-
}, _hideLabel: true, _icons: this._passwordVisible ? 'codicon codicon-eye-closed' : 'codicon codicon-eye-watch' })) :
|
|
9493
|
+
}, _hideLabel: true, _icons: this._passwordVisible ? 'codicon codicon-eye-closed' : 'codicon codicon-eye-watch' })) : null))));
|
|
9485
9494
|
}
|
|
9486
9495
|
constructor(hostRef) {
|
|
9487
9496
|
registerInstance(this, hostRef);
|
|
@@ -10055,20 +10064,20 @@ class KolInputRange {
|
|
|
10055
10064
|
'hide-label': !!this.state._hideLabel,
|
|
10056
10065
|
}, _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _disabled: this.state._disabled, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _msg: this.state._msg, _shortKey: this.state._shortKey, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched }, hAsync("span", { key: '5ff97f4eadb9d0268a86336bb1ec3c33220e9448', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' || typeof this.state._shortKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedBadgeText, { badgeText: buildBadgeTextString(this.state._accessKey, this.state._shortKey), label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, buildBadgeTextString(this.state._accessKey, this.state._shortKey)))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '9caa68963d809d85651a3711d6e00750c02012cf', slot: "input" }, hAsync("div", { key: '707405cdaa4fa35c2202af6566c00b5b18176a4a', class: "inputs-wrapper", style: {
|
|
10057
10066
|
'--kolibri-input-range--input-number--width': `${this.state._max}`.length + 0.5 + 'em',
|
|
10058
|
-
} }, hAsync("input", Object.assign({ key: '
|
|
10067
|
+
} }, hAsync("input", Object.assign({ key: '086f4e66a08820af1d83e352ace068d00f6b77c3', 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, step: this.state._step, tabIndex: -1, type: "range", value: this.state._value }, this.controller.onFacade, { onChange: this.onChange, onFocus: (event) => {
|
|
10059
10068
|
this.controller.onFacade.onFocus(event);
|
|
10060
10069
|
this.inputHasFocus = true;
|
|
10061
10070
|
}, onBlur: (event) => {
|
|
10062
10071
|
this.controller.onFacade.onBlur(event);
|
|
10063
10072
|
this.inputHasFocus = false;
|
|
10064
|
-
} })), hAsync("input", Object.assign({ key: '
|
|
10073
|
+
} })), hAsync("input", Object.assign({ key: '044b5512f8a5f38ff8042408a1e40a7e042a93a9', 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, onFocus: (event) => {
|
|
10065
10074
|
this.controller.onFacade.onFocus(event);
|
|
10066
10075
|
this.inputHasFocus = true;
|
|
10067
10076
|
}, onBlur: (event) => {
|
|
10068
10077
|
this.controller.onFacade.onBlur(event);
|
|
10069
10078
|
this.inputHasFocus = false;
|
|
10070
10079
|
} }))), hasSuggestions && [
|
|
10071
|
-
hAsync("datalist", { key: '
|
|
10080
|
+
hAsync("datalist", { key: '9ac1ec64cf00ea72f0df8562b5951693c77953f1', id: `${this.state._id}-list` }, this.state._suggestions.map((option) => (hAsync("option", { value: option })))),
|
|
10072
10081
|
]))));
|
|
10073
10082
|
}
|
|
10074
10083
|
constructor(hostRef) {
|
|
@@ -10306,13 +10315,13 @@ class KolInputText {
|
|
|
10306
10315
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
10307
10316
|
const hasSuggestions = Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
|
|
10308
10317
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
10309
|
-
return (hAsync(Host, { key: '
|
|
10318
|
+
return (hAsync(Host, { key: 'dfff639f5219d9a6b70417050414ae1114c3e426', class: {
|
|
10310
10319
|
'has-value': this.state._hasValue,
|
|
10311
10320
|
'kol-input-text': true,
|
|
10312
|
-
} }, hAsync(KolInputTag, { key: '
|
|
10321
|
+
} }, hAsync(KolInputTag, { key: 'b0b460bd253ce8e6b7b0c64167cf7b04914aa7ce', class: {
|
|
10313
10322
|
[this.state._type]: true,
|
|
10314
10323
|
'hide-label': !!this.state._hideLabel,
|
|
10315
|
-
}, _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _currentLength: this.state._currentLength, _disabled: this.state._disabled, _hasCounter: this.state._hasCounter, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _maxLength: this.state._maxLength, _msg: this.state._msg, _readOnly: this.state._readOnly, _required: this.state._required, _shortKey: this.state._shortKey, _smartButton: this.state._smartButton, _suggestions: this.state._suggestions, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '
|
|
10324
|
+
}, _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _currentLength: this.state._currentLength, _disabled: this.state._disabled, _hasCounter: this.state._hasCounter, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _maxLength: this.state._maxLength, _msg: this.state._msg, _readOnly: this.state._readOnly, _required: this.state._required, _shortKey: this.state._shortKey, _smartButton: this.state._smartButton, _suggestions: this.state._suggestions, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: '9fa94f23db0961dd372863f6c4f32ad1a63c5152', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' || typeof this.state._shortKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedBadgeText, { badgeText: buildBadgeTextString(this.state._accessKey, this.state._shortKey), label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, buildBadgeTextString(this.state._accessKey, this.state._shortKey)))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: 'a7d63ed3ba033b473eb7b7e22a24eabce9b6e8c2', slot: "input" }, hAsync("input", Object.assign({ key: 'dfc93edf65abe84c68878643827eca0ab0f505ba', ref: this.catchRef, title: "", accessKey: this.state._accessKey, "aria-describedby": ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, "aria-label": this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, autoCapitalize: "off", autoComplete: this.state._autoComplete, autoCorrect: "off", disabled: this.state._disabled, id: this.state._id, list: hasSuggestions ? `${this.state._id}-list` : undefined, maxlength: this.state._maxLength, name: this.state._name, pattern: this.state._pattern, placeholder: this.state._placeholder, readOnly: this.state._readOnly, required: this.state._required, spellcheck: this.state._spellCheck, type: this.state._type, value: this.state._value }, this.controller.onFacade, { onChange: this.onChange, onInput: this.onInput, onKeyDown: this.onKeyDown, onFocus: (event) => {
|
|
10316
10325
|
this.controller.onFacade.onFocus(event);
|
|
10317
10326
|
this.inputHasFocus = true;
|
|
10318
10327
|
}, onBlur: (event) => {
|
|
@@ -10365,6 +10374,7 @@ class KolInputText {
|
|
|
10365
10374
|
this._readOnly = false;
|
|
10366
10375
|
this._required = false;
|
|
10367
10376
|
this._shortKey = undefined;
|
|
10377
|
+
this._spellCheck = undefined;
|
|
10368
10378
|
this._suggestions = undefined;
|
|
10369
10379
|
this._smartButton = undefined;
|
|
10370
10380
|
this._syncValueBySelector = undefined;
|
|
@@ -10455,6 +10465,9 @@ class KolInputText {
|
|
|
10455
10465
|
validateShortKey(value) {
|
|
10456
10466
|
this.controller.validateShortKey(value);
|
|
10457
10467
|
}
|
|
10468
|
+
validateSpellCheck(value) {
|
|
10469
|
+
this.controller.validateSpellCheck(value);
|
|
10470
|
+
}
|
|
10458
10471
|
validateSuggestions(value) {
|
|
10459
10472
|
this.controller.validateSuggestions(value);
|
|
10460
10473
|
}
|
|
@@ -10508,6 +10521,7 @@ class KolInputText {
|
|
|
10508
10521
|
"_readOnly": ["validateReadOnly"],
|
|
10509
10522
|
"_required": ["validateRequired"],
|
|
10510
10523
|
"_shortKey": ["validateShortKey"],
|
|
10524
|
+
"_spellCheck": ["validateSpellCheck"],
|
|
10511
10525
|
"_suggestions": ["validateSuggestions"],
|
|
10512
10526
|
"_smartButton": ["validateSmartButton"],
|
|
10513
10527
|
"_syncValueBySelector": ["validateSyncValueBySelector"],
|
|
@@ -10544,6 +10558,7 @@ class KolInputText {
|
|
|
10544
10558
|
"_readOnly": [4, "_read-only"],
|
|
10545
10559
|
"_required": [4],
|
|
10546
10560
|
"_shortKey": [1, "_short-key"],
|
|
10561
|
+
"_spellCheck": [4, "_spell-check"],
|
|
10547
10562
|
"_suggestions": [1],
|
|
10548
10563
|
"_smartButton": [1, "_smart-button"],
|
|
10549
10564
|
"_syncValueBySelector": [1, "_sync-value-by-selector"],
|
|
@@ -10602,28 +10617,27 @@ class KolInputWc {
|
|
|
10602
10617
|
}
|
|
10603
10618
|
render() {
|
|
10604
10619
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
10605
|
-
const
|
|
10606
|
-
const
|
|
10607
|
-
const showFormFieldMsg = Boolean(hasError || (((_c = this._msg) === null || _c === void 0 ? void 0 : _c._type) !== 'error' && ((_d = this._msg) === null || _d === void 0 ? void 0 : _d._description)));
|
|
10620
|
+
const hasValidMsg = typeof this._msg === 'object' && this._msg !== null && typeof ((_a = this._msg) === null || _a === void 0 ? void 0 : _a._description) === 'string' && ((_b = this._msg) === null || _b === void 0 ? void 0 : _b._description.length) > 0;
|
|
10621
|
+
const showMsg = hasValidMsg && (this._touched === true || ((_c = this._msg) === null || _c === void 0 ? void 0 : _c._type) !== 'error');
|
|
10608
10622
|
const hasExpertSlot = showExpertSlot(this._label);
|
|
10609
10623
|
const hasHint = typeof this._hint === 'string' && this._hint.length > 0;
|
|
10610
10624
|
const useTooltopInsteadOfLabel = !hasExpertSlot && this._hideLabel;
|
|
10611
|
-
return (hAsync(Host, { key: '
|
|
10625
|
+
return (hAsync(Host, { key: 'f387b8c961abba887df0af3acdc992fdc780bf67', class: clsx('kol-input', this.getModifierClassNameByMsgType(showMsg), {
|
|
10612
10626
|
disabled: this._disabled === true,
|
|
10613
|
-
error:
|
|
10627
|
+
[((_d = this._msg) === null || _d === void 0 ? void 0 : _d._type) || 'error']: showMsg === true,
|
|
10614
10628
|
'read-only': this._readOnly === true,
|
|
10615
10629
|
required: this._required === true,
|
|
10616
10630
|
touched: this._touched === true,
|
|
10617
10631
|
'hidden-error': this._hideError === true,
|
|
10618
|
-
}) }, hAsync("label", { key: '
|
|
10632
|
+
}) }, hAsync("label", { key: '46d5a787dc011c63d78b23f5041d3bddd4bf35b9', class: "input-label", id: !useTooltopInsteadOfLabel ? `${this._id}-label` : undefined, hidden: useTooltopInsteadOfLabel, htmlFor: this._id }, hAsync("span", { key: 'd704939fe7f625fa71fcced90cfc57ad88f9d3f5', class: "input-label-span" }, hAsync("slot", { key: '717a440a4755fa1cc878ccc697a2339a236cc2ca', name: "label" }))), hasHint && (hAsync("span", { key: 'cf2a32a4850aa36c47640044ee8131cd039437f3', class: "hint", id: `${this._id}-hint` }, this._hint)), hAsync("div", { key: '908ad6c86b9f897a203babfa6a647482fd963ee7', class: {
|
|
10619
10633
|
input: true,
|
|
10620
10634
|
'icon-left': typeof ((_e = this._icons) === null || _e === void 0 ? void 0 : _e.left) === 'object',
|
|
10621
10635
|
'icon-right': typeof ((_f = this._icons) === null || _f === void 0 ? void 0 : _f.right) === 'object',
|
|
10622
|
-
} }, ((_g = this._icons) === null || _g === void 0 ? void 0 : _g.left) && (hAsync(KolIconTag, { key: '
|
|
10636
|
+
} }, ((_g = this._icons) === null || _g === void 0 ? void 0 : _g.left) && (hAsync(KolIconTag, { key: '8d34322e538ef59f93ea0d91c18865c09acdc806', _label: "", _icons: ((_h = this._icons) === null || _h === void 0 ? void 0 : _h.left).icon, style: this.getIconStyles((_j = this._icons) === null || _j === void 0 ? void 0 : _j.left) })), hAsync("div", { key: '63e0601882b3b4708004514ee16eea9d10eaa79e', ref: this.catchInputSlot, id: this.slotName, class: "input-slot" }), typeof this._smartButton === 'object' && this._smartButton !== null && (hAsync(KolButtonWcTag, { key: '90e62c7fd3205e54abeaf277ff6cb84cc9f808e2', _customClass: this._smartButton._customClass, _disabled: this._smartButton._disabled, _icons: this._smartButton._icons, _hideLabel: true, _id: this._smartButton._id, _label: this._smartButton._label, _on: this._smartButton._on, _tooltipAlign: this._smartButton._tooltipAlign, _variant: this._smartButton._variant })), ((_k = this._icons) === null || _k === void 0 ? void 0 : _k.right) && (hAsync(KolIconTag, { key: '78820371cd0eea944bba2249fa206dfa1f7ea9a8', _label: "", _icons: ((_l = this._icons) === null || _l === void 0 ? void 0 : _l.right).icon, style: this.getIconStyles((_m = this._icons) === null || _m === void 0 ? void 0 : _m.right) }))), useTooltopInsteadOfLabel && (hAsync(KolTooltipWcTag, { key: '23f8131f06b0ade72a2ac6de4bc45d87c537ecf8', "aria-hidden": "true", class: "input-tooltip", _badgeText: this._accessKey || this._shortKey, _align: this._tooltipAlign, _id: this._hideLabel ? `${this._id}-label` : undefined, _label: this._label })), showMsg && hAsync(KolFormFieldMsgFc, { key: 'd7913257b81e5b0ad00da22c589cf22e31ba809f', _alert: this._alert, _hideError: this._hideError, _msg: this._msg, _id: this._id }), Array.isArray(this._suggestions) && this._suggestions.length > 0 && (hAsync("datalist", { key: '3d900634935d030abd1d25b62bce6872989488b6', id: `${this._id}-list` }, this._suggestions.map((option) => (hAsync("option", { value: option }))))), this._hasCounter && (hAsync("span", { key: '72ffb636b35c38cae343fda5e00ad2726d23009c', class: "counter", "aria-atomic": "true", "aria-live": "polite", "data-testid": "input-counter" }, this._currentLength, this._maxLength && (hAsync(Fragment, null, hAsync("span", { key: '5316e7ddca828a22191faabf95d762261cd3e7e0', "aria-label": translate('kol-of'), role: "img" }, "/"), this._maxLength)), ' ', hAsync("span", { key: '2ec4c8bb02a35daffbea7a9d58d15a5e487b9652' }, translate('kol-characters'))))));
|
|
10623
10637
|
}
|
|
10624
|
-
getModifierClassNameByMsgType() {
|
|
10638
|
+
getModifierClassNameByMsgType(showMsg) {
|
|
10625
10639
|
var _a, _b;
|
|
10626
|
-
if ((_a = this._msg) === null || _a === void 0 ? void 0 : _a._type) {
|
|
10640
|
+
if (showMsg && ((_a = this._msg) === null || _a === void 0 ? void 0 : _a._type)) {
|
|
10627
10641
|
return {
|
|
10628
10642
|
default: 'msg-type-default',
|
|
10629
10643
|
info: 'msg-type-info',
|
|
@@ -14577,7 +14591,7 @@ class KolSelect {
|
|
|
14577
14591
|
form: this.host,
|
|
14578
14592
|
ref: this.selectRef,
|
|
14579
14593
|
});
|
|
14580
|
-
} }, hAsync("input", { key: '146ff341cfd1297a88aa014c307ba776807d1afd', type: "submit", hidden: true }), hAsync("select", Object.assign({ key: '
|
|
14594
|
+
} }, hAsync("input", { key: '146ff341cfd1297a88aa014c307ba776807d1afd', type: "submit", hidden: true }), hAsync("select", Object.assign({ key: '666ff4c9635d4779f06df8f1ab0bae0163fa449f', 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 }, this.controller.onFacade, { onInput: this.onInput.bind(this), onChange: this.onChange.bind(this), onFocus: (event) => {
|
|
14581
14595
|
this.controller.onFacade.onFocus(event);
|
|
14582
14596
|
this.inputHasFocus = true;
|
|
14583
14597
|
}, onBlur: (event) => {
|
|
@@ -14932,20 +14946,20 @@ class KolSingleSelect {
|
|
|
14932
14946
|
render() {
|
|
14933
14947
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
14934
14948
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
14935
|
-
return (hAsync(Host, { key: 'ec78d6ba606de5a637558504d9b8d389991bd5d1', class: "kol-single-select" }, hAsync("div", { key: 'ba04220b3ac54ff6b8497948854df6d884ec152c', class: `single-select ${this.state._disabled === true ? 'disabled' : ''} ` }, hAsync(KolInputTag, { key: 'c5ba4a1ee8facce73b47cdece06df4623b718be8', _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _disabled: this.state._disabled, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _msg: this.state._msg, _required: this.state._required, _shortKey: this.state._shortKey, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, role: `presentation` }, hAsync("span", { key: '103578ebf9a841970388a5c3969218f981897e6c', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' || typeof this.state._shortKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedBadgeText, { badgeText: buildBadgeTextString(this.state._accessKey || this.state._shortKey), label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, buildBadgeTextString(this.state._accessKey || this.state._shortKey)))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '191bf5b70972f84dc1359082b6538617986a0383', slot: "input" }, hAsync("div", { key: '50d8b9e371af7679ae853d2001b95c9bb8383398', class: "single-select__group" }, hAsync("input", Object.assign({ key: '
|
|
14949
|
+
return (hAsync(Host, { key: 'ec78d6ba606de5a637558504d9b8d389991bd5d1', class: "kol-single-select" }, hAsync("div", { key: 'ba04220b3ac54ff6b8497948854df6d884ec152c', class: `single-select ${this.state._disabled === true ? 'disabled' : ''} ` }, hAsync(KolInputTag, { key: 'c5ba4a1ee8facce73b47cdece06df4623b718be8', _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _disabled: this.state._disabled, _hideError: this.state._hideError, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _msg: this.state._msg, _required: this.state._required, _shortKey: this.state._shortKey, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, role: `presentation` }, hAsync("span", { key: '103578ebf9a841970388a5c3969218f981897e6c', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' || typeof this.state._shortKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedBadgeText, { badgeText: buildBadgeTextString(this.state._accessKey || this.state._shortKey), label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, buildBadgeTextString(this.state._accessKey || this.state._shortKey)))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '191bf5b70972f84dc1359082b6538617986a0383', slot: "input" }, hAsync("div", { key: '50d8b9e371af7679ae853d2001b95c9bb8383398', class: "single-select__group" }, hAsync("input", Object.assign({ key: '46d194911f251412811fc2f41989aa8a48f98c36', ref: this.catchRef, class: "single-select__input", type: "text", "aria-autocomplete": "both", "aria-controls": "listbox", value: this._inputValue, accessKey: this.state._accessKey, "aria-describedby": ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, "aria-label": this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, "aria-activedescendant": this._isOpen && this._focusedOptionIndex >= 0 ? `option-${this._focusedOptionIndex}` : undefined, autoCapitalize: "off", autoCorrect: "off", disabled: this.state._disabled, name: this.state._name, required: this.state._required }, this.controller.onFacade, { onInput: this.onInput.bind(this), onChange: this.onChange.bind(this), onClick: this.toggleListbox.bind(this), onFocus: (event) => {
|
|
14936
14950
|
this.controller.onFacade.onFocus(event);
|
|
14937
14951
|
this.inputHasFocus = true;
|
|
14938
14952
|
}, onBlur: (event) => {
|
|
14939
14953
|
this.controller.onFacade.onBlur(event);
|
|
14940
14954
|
this.inputHasFocus = false;
|
|
14941
|
-
}, placeholder: this.state._placeholder })), this._inputValue && (hAsync(KolIconTag, { key: '
|
|
14955
|
+
}, placeholder: this.state._placeholder })), this._inputValue && (hAsync(KolIconTag, { key: '8cff7aaaa6727a1cface8ba6ff14b2f46c4f379d', _icons: "codicon codicon-close", _label: translate('kol-delete-selection'), onClick: () => {
|
|
14942
14956
|
var _a;
|
|
14943
14957
|
this.clearSelection();
|
|
14944
14958
|
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
14945
|
-
}, class: "single-select__delete" })), hAsync("button", { key: '
|
|
14959
|
+
}, class: "single-select__delete" })), hAsync("button", { key: '6f04499addadb0afb347c4c9f59d9f96b5e949fd', tabindex: "-1", class: "single-select__button", onClick: this.toggleListbox.bind(this), disabled: this.state._disabled }, hAsync(KolIconTag, { key: 'b90af9338c0039ecd8802aba4e0b9a5a1b43437e', _icons: "codicon codicon-triangle-down", _label: translate('kol-dropdown') }))), this._isOpen && !(this.state._disabled === true) && (hAsync("ul", { key: '2625d07e9fabd15eb99ab6bd3321259d9f9f3720', role: "listbox", class: clsx('single-select__listbox', this.blockSuggestionMouseOver && 'single-select__listbox--cursor-hidden'), onKeyDown: this.handleKeyDownDropdown.bind(this) }, Array.isArray(this._filteredOptions) && this._filteredOptions.length > 0 ? (this._filteredOptions.map((option, index) => (hAsync("li", { id: `option-${index}`, key: `-${index}`, ref: (el) => {
|
|
14946
14960
|
if (el)
|
|
14947
14961
|
this.refOptions[index] = el;
|
|
14948
|
-
}, tabIndex: -1, role: "option", "aria-selected": this.state._value === option.value, onClick: (event) => {
|
|
14962
|
+
}, tabIndex: -1, role: "option", "aria-selected": this.state._value === option.value ? 'true' : undefined, onClick: (event) => {
|
|
14949
14963
|
var _a;
|
|
14950
14964
|
this.selectOption(event, option);
|
|
14951
14965
|
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
@@ -24626,7 +24640,7 @@ class KolTableStateless {
|
|
|
24626
24640
|
let max = 0;
|
|
24627
24641
|
horizontalHeaders.forEach((row) => {
|
|
24628
24642
|
let count = 0;
|
|
24629
|
-
row.forEach((col) => { var _a; return (count += (_a = col.colSpan) !== null && _a !== void 0 ? _a : 1); });
|
|
24643
|
+
Array.isArray(row) && row.forEach((col) => { var _a; return (count += (_a = col.colSpan) !== null && _a !== void 0 ? _a : 1); });
|
|
24630
24644
|
if (max < count) {
|
|
24631
24645
|
max = count;
|
|
24632
24646
|
}
|
|
@@ -24641,7 +24655,7 @@ class KolTableStateless {
|
|
|
24641
24655
|
let max = 0;
|
|
24642
24656
|
verticalHeaders.forEach((col) => {
|
|
24643
24657
|
let count = 0;
|
|
24644
|
-
col.forEach((row) => { var _a; return (count += (_a = row.rowSpan) !== null && _a !== void 0 ? _a : 1); });
|
|
24658
|
+
Array.isArray(col) && col.forEach((row) => { var _a; return (count += (_a = row.rowSpan) !== null && _a !== void 0 ? _a : 1); });
|
|
24645
24659
|
if (max < count) {
|
|
24646
24660
|
max = count;
|
|
24647
24661
|
}
|
|
@@ -24654,34 +24668,34 @@ class KolTableStateless {
|
|
|
24654
24668
|
}
|
|
24655
24669
|
return max;
|
|
24656
24670
|
}
|
|
24657
|
-
|
|
24658
|
-
const
|
|
24671
|
+
getThePrimaryHeadersWithKeysIfExists(headers) {
|
|
24672
|
+
const primaryHeadersWithKeys = [];
|
|
24659
24673
|
headers.forEach((cells) => {
|
|
24660
24674
|
cells.forEach((cell) => {
|
|
24661
24675
|
if (typeof cell.key === 'string') {
|
|
24662
|
-
|
|
24676
|
+
primaryHeadersWithKeys.push(cell);
|
|
24663
24677
|
}
|
|
24664
24678
|
});
|
|
24665
24679
|
});
|
|
24666
|
-
return
|
|
24680
|
+
return primaryHeadersWithKeys;
|
|
24667
24681
|
}
|
|
24668
|
-
|
|
24682
|
+
getPrimaryHeaders(headers) {
|
|
24669
24683
|
var _a, _b;
|
|
24670
|
-
let
|
|
24684
|
+
let primaryHeadersWithKeys = this.getThePrimaryHeadersWithKeysIfExists((_a = headers.horizontal) !== null && _a !== void 0 ? _a : []);
|
|
24671
24685
|
this.horizontal = true;
|
|
24672
|
-
if (
|
|
24673
|
-
|
|
24674
|
-
if (
|
|
24686
|
+
if (primaryHeadersWithKeys.length === 0) {
|
|
24687
|
+
primaryHeadersWithKeys = this.getThePrimaryHeadersWithKeysIfExists((_b = headers.vertical) !== null && _b !== void 0 ? _b : []);
|
|
24688
|
+
if (primaryHeadersWithKeys.length > 0) {
|
|
24675
24689
|
this.horizontal = false;
|
|
24676
24690
|
}
|
|
24677
24691
|
}
|
|
24678
|
-
return
|
|
24692
|
+
return primaryHeadersWithKeys;
|
|
24679
24693
|
}
|
|
24680
24694
|
createDataField(data, headers, isFoot) {
|
|
24681
24695
|
var _a;
|
|
24682
24696
|
headers.horizontal = Array.isArray(headers === null || headers === void 0 ? void 0 : headers.horizontal) ? headers.horizontal : [];
|
|
24683
24697
|
headers.vertical = Array.isArray(headers === null || headers === void 0 ? void 0 : headers.vertical) ? headers.vertical : [];
|
|
24684
|
-
const primaryHeader = this.
|
|
24698
|
+
const primaryHeader = this.getPrimaryHeaders(headers);
|
|
24685
24699
|
const maxCols = this.getNumberOfCols(headers.horizontal, data);
|
|
24686
24700
|
let maxRows = this.getNumberOfRows(headers.vertical, data);
|
|
24687
24701
|
let startRow = 0;
|
|
@@ -24843,6 +24857,13 @@ class KolTableStateless {
|
|
|
24843
24857
|
}
|
|
24844
24858
|
} })), hAsync(KolTooltipWcTag, { "aria-hidden": "true", class: "input-tooltip", _align: "right", _id: `${translationKey}-label`, _label: label }))));
|
|
24845
24859
|
}
|
|
24860
|
+
renderHeaderTdCell() {
|
|
24861
|
+
return (hAsync(Fragment, null, Array.isArray(this.state._headerCells.horizontal) &&
|
|
24862
|
+
this.state._headerCells.horizontal.length > 0 &&
|
|
24863
|
+
Array.isArray(this.state._headerCells.vertical) &&
|
|
24864
|
+
this.state._headerCells.vertical.length > 0 &&
|
|
24865
|
+
Array.isArray(this.state._headerCells.horizontal) && (hAsync("td", { "aria-hidden": "true", colSpan: this.state._headerCells.vertical.length, rowSpan: this.state._headerCells.horizontal.length }))));
|
|
24866
|
+
}
|
|
24846
24867
|
renderHeadingCell(cell, rowIndex, colIndex, isVertical) {
|
|
24847
24868
|
let ariaSort = undefined;
|
|
24848
24869
|
let sortButtonIcon = 'codicon codicon-fold';
|
|
@@ -24874,9 +24895,11 @@ class KolTableStateless {
|
|
|
24874
24895
|
} })) : (cell.label)));
|
|
24875
24896
|
}
|
|
24876
24897
|
renderSpacer(variant, cellDefs) {
|
|
24877
|
-
var _a;
|
|
24878
|
-
const
|
|
24879
|
-
|
|
24898
|
+
var _a, _b;
|
|
24899
|
+
const verticalHeaderColpan = ((_a = this.state._headerCells.vertical) === null || _a === void 0 ? void 0 : _a.length) || 0;
|
|
24900
|
+
const colspan = (_b = cellDefs === null || cellDefs === void 0 ? void 0 : cellDefs[0]) === null || _b === void 0 ? void 0 : _b.reduce((acc, row) => acc + (row.colSpan || 1), 0);
|
|
24901
|
+
const selectionCell = this.state._selection ? 1 : 0;
|
|
24902
|
+
return (hAsync("tr", { "aria-hidden": "true", class: `${variant}-spacer` }, hAsync("td", { colSpan: verticalHeaderColpan + colspan + selectionCell })));
|
|
24880
24903
|
}
|
|
24881
24904
|
renderFoot() {
|
|
24882
24905
|
if (!this.state._dataFoot || this.state._dataFoot.length === 0) {
|
|
@@ -24891,28 +24914,29 @@ class KolTableStateless {
|
|
|
24891
24914
|
render() {
|
|
24892
24915
|
const dataField = this.createDataField(this.state._data, this.state._headerCells);
|
|
24893
24916
|
this.checkboxRefs = [];
|
|
24894
|
-
return (hAsync(Host, { key: '
|
|
24917
|
+
return (hAsync(Host, { key: '482e452bd3bd6dd800bd0bd277618d543b932511', class: "kol-table-stateless-wc" }, hAsync("div", { key: 'd237bc287eb2dbb4c423857807f4ce2aa079f4d4', ref: (element) => (this.tableDivElement = element), class: "table", tabindex: this.tableDivElementHasScrollbar ? '-1' : undefined }, hAsync("table", { key: 'a4f3435eb7f8ebb7bea738fded143d2fd5ee1261', style: {
|
|
24895
24918
|
minWidth: this.state._minWidth,
|
|
24896
|
-
} }, hAsync("div", { key: '
|
|
24897
|
-
this.state._headerCells.horizontal.map((cols, rowIndex) => (hAsync("tr", { key: `thead-${rowIndex}` }, this.state._selection && this.renderHeadingSelectionCell(),
|
|
24898
|
-
|
|
24899
|
-
|
|
24900
|
-
|
|
24901
|
-
|
|
24902
|
-
|
|
24903
|
-
|
|
24904
|
-
|
|
24905
|
-
|
|
24906
|
-
|
|
24907
|
-
|
|
24908
|
-
|
|
24909
|
-
|
|
24910
|
-
|
|
24911
|
-
|
|
24912
|
-
|
|
24913
|
-
|
|
24919
|
+
} }, hAsync("div", { key: 'ad3995862452de82107201bca3cc1b0aadd0cf36', class: "focus-element", tabindex: this.tableDivElementHasScrollbar ? '0' : undefined, "aria-describedby": "caption" }, "\u00A0"), hAsync("caption", { key: 'c18a326a251676d7abea34f20c47187461d91748', id: "caption" }, this.state._label), Array.isArray(this.state._headerCells.horizontal) && (hAsync("thead", { key: '770b33b2bfd99cfb6693700cc77a919675101eb9' }, [
|
|
24920
|
+
this.state._headerCells.horizontal.map((cols, rowIndex) => (hAsync("tr", { key: `thead-${rowIndex}` }, this.state._selection && this.renderHeadingSelectionCell(), rowIndex === 0 && this.renderHeaderTdCell(), Array.isArray(cols) &&
|
|
24921
|
+
cols.map((cell, colIndex) => {
|
|
24922
|
+
if (cell.asTd === true) {
|
|
24923
|
+
return (hAsync("td", { key: `thead-${rowIndex}-${colIndex}-${cell.label}`, class: {
|
|
24924
|
+
[cell.textAlign]: typeof cell.textAlign === 'string' && cell.textAlign.length > 0,
|
|
24925
|
+
}, colSpan: cell.colSpan, rowSpan: cell.rowSpan, style: {
|
|
24926
|
+
textAlign: cell.textAlign,
|
|
24927
|
+
width: cell.width,
|
|
24928
|
+
}, ref: typeof cell.render === 'function'
|
|
24929
|
+
? (el) => {
|
|
24930
|
+
this.cellRender(cell, el);
|
|
24931
|
+
}
|
|
24932
|
+
: undefined }, typeof cell.render !== 'function' ? cell.label : ''));
|
|
24933
|
+
}
|
|
24934
|
+
else {
|
|
24935
|
+
return this.renderHeadingCell(cell, rowIndex, colIndex, false);
|
|
24936
|
+
}
|
|
24937
|
+
})))),
|
|
24914
24938
|
this.renderSpacer('head', this.state._headerCells.horizontal),
|
|
24915
|
-
])), hAsync("tbody", { key: '
|
|
24939
|
+
])), hAsync("tbody", { key: 'f0de4de3fd33fced22b3c29062357795409589be' }, dataField.map((row, rowIndex) => this.renderTableRow(row, rowIndex, true))), this.renderFoot()))));
|
|
24916
24940
|
}
|
|
24917
24941
|
get host() { return getElement(this); }
|
|
24918
24942
|
static get watchers() { return {
|
|
@@ -25308,6 +25332,9 @@ class TextareaController extends InputIconController {
|
|
|
25308
25332
|
validateRows(value) {
|
|
25309
25333
|
validateRows(this.component, value);
|
|
25310
25334
|
}
|
|
25335
|
+
validateSpellCheck(value) {
|
|
25336
|
+
validateSpellCheck(this.component, value);
|
|
25337
|
+
}
|
|
25311
25338
|
validateValue(value) {
|
|
25312
25339
|
watchString(this.component, '_value', value, {
|
|
25313
25340
|
hooks: {
|
|
@@ -25325,6 +25352,7 @@ class TextareaController extends InputIconController {
|
|
|
25325
25352
|
this.validateResize(this.component._resize);
|
|
25326
25353
|
this.validateRequired(this.component._required);
|
|
25327
25354
|
this.validateRows(this.component._rows);
|
|
25355
|
+
this.validateSpellCheck(this.component._spellCheck);
|
|
25328
25356
|
this.validateValue(this.component._value);
|
|
25329
25357
|
}
|
|
25330
25358
|
}
|
|
@@ -25356,7 +25384,7 @@ class KolTextarea {
|
|
|
25356
25384
|
render() {
|
|
25357
25385
|
const { ariaDescribedBy } = getRenderStates(this.state);
|
|
25358
25386
|
const hasExpertSlot = showExpertSlot(this.state._label);
|
|
25359
|
-
return (hAsync(Host, { key: '
|
|
25387
|
+
return (hAsync(Host, { key: '9770edffb4be5cea8a71c9a4bd75f24b5102c5bf', class: { 'kol-textarea': true, 'has-value': this.state._hasValue } }, hAsync(KolInputTag, { key: '33005094032fe05acb36aa4fb6265400ebf94c92', class: { textarea: true, 'hide-label': !!this.state._hideLabel, 'has-counter': !!this.state._hasCounter }, _accessKey: this.state._accessKey, _alert: this.showAsAlert(), _currentLength: this.state._currentLength, _disabled: this.state._disabled, _hideError: this.state._hideError, _hasCounter: this.state._hasCounter, _hideLabel: this.state._hideLabel, _hint: this.state._hint, _icons: this.state._icons, _id: this.state._id, _label: this.state._label, _maxLength: this.state._maxLength, _msg: this.state._msg, _readOnly: this.state._readOnly, _required: this.state._required, _shortKey: this.state._shortKey, _tooltipAlign: this._tooltipAlign, _touched: this.state._touched, onClick: () => { var _a; return (_a = this.textareaRef) === null || _a === void 0 ? void 0 : _a.focus(); }, role: `presentation` }, hAsync("span", { key: 'e061a13f3b3d7b111feb2a252f91f9a5a2696bd5', slot: "label" }, hasExpertSlot ? (hAsync("slot", { name: "expert" })) : typeof this.state._accessKey === 'string' || typeof this.state._shortKey === 'string' ? (hAsync(Fragment, null, hAsync(InternalUnderlinedBadgeText, { badgeText: buildBadgeTextString(this.state._accessKey || this.state._shortKey), label: this.state._label }), ' ', hAsync("span", { class: "access-key-hint", "aria-hidden": "true" }, buildBadgeTextString(this.state._accessKey || this.state._shortKey)))) : (hAsync("span", null, this.state._label))), hAsync("div", { key: '2b9c5e0fff5a6d27f044b5521277cb23ca0797b9', slot: "input" }, hAsync("textarea", Object.assign({ key: 'c03589fa5a0f9f26d71e8bc3d7c2af0990388968', 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: this.state._spellCheck }, this.controller.onFacade, { onInput: this.onInput, onFocus: (event) => {
|
|
25360
25388
|
this.controller.onFacade.onFocus(event);
|
|
25361
25389
|
this.inputHasFocus = true;
|
|
25362
25390
|
}, onBlur: (event) => {
|
|
@@ -25402,6 +25430,7 @@ class KolTextarea {
|
|
|
25402
25430
|
this._required = false;
|
|
25403
25431
|
this._rows = undefined;
|
|
25404
25432
|
this._shortKey = undefined;
|
|
25433
|
+
this._spellCheck = undefined;
|
|
25405
25434
|
this._syncValueBySelector = undefined;
|
|
25406
25435
|
this._tabIndex = undefined;
|
|
25407
25436
|
this._tooltipAlign = 'top';
|
|
@@ -25494,6 +25523,9 @@ class KolTextarea {
|
|
|
25494
25523
|
validateShortKey(value) {
|
|
25495
25524
|
this.controller.validateShortKey(value);
|
|
25496
25525
|
}
|
|
25526
|
+
validateSpellCheck(value) {
|
|
25527
|
+
this.controller.validateSpellCheck(value);
|
|
25528
|
+
}
|
|
25497
25529
|
validateSyncValueBySelector(value) {
|
|
25498
25530
|
this.controller.validateSyncValueBySelector(value);
|
|
25499
25531
|
}
|
|
@@ -25549,6 +25581,7 @@ class KolTextarea {
|
|
|
25549
25581
|
"_required": ["validateRequired"],
|
|
25550
25582
|
"_rows": ["validateRows"],
|
|
25551
25583
|
"_shortKey": ["validateShortKey"],
|
|
25584
|
+
"_spellCheck": ["validateSpellCheck"],
|
|
25552
25585
|
"_syncValueBySelector": ["validateSyncValueBySelector"],
|
|
25553
25586
|
"_tabIndex": ["validateTabIndex"],
|
|
25554
25587
|
"_touched": ["validateTouched"],
|
|
@@ -25583,6 +25616,7 @@ class KolTextarea {
|
|
|
25583
25616
|
"_required": [4],
|
|
25584
25617
|
"_rows": [1026],
|
|
25585
25618
|
"_shortKey": [1, "_short-key"],
|
|
25619
|
+
"_spellCheck": [4, "_spell-check"],
|
|
25586
25620
|
"_syncValueBySelector": [1, "_sync-value-by-selector"],
|
|
25587
25621
|
"_tabIndex": [2, "_tab-index"],
|
|
25588
25622
|
"_tooltipAlign": [1, "_tooltip-align"],
|