@public-ui/hydrate 3.0.2-rc.1 → 3.0.2-rc.2
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 +73 -18
- package/dist/index.mjs +73 -18
- package/package.json +3 -3
package/dist/index.js
CHANGED
|
@@ -22522,7 +22522,7 @@ class KolPaginationWc {
|
|
|
22522
22522
|
});
|
|
22523
22523
|
};
|
|
22524
22524
|
this.onChangePageSize = (event, value) => {
|
|
22525
|
-
value = parseInt(value
|
|
22525
|
+
value = parseInt(value);
|
|
22526
22526
|
if (typeof value === 'number' && value > 0 && this._pageSize !== value) {
|
|
22527
22527
|
this._pageSize = value;
|
|
22528
22528
|
const timeout = setTimeout(() => {
|
|
@@ -22661,7 +22661,7 @@ class KolPaginationWc {
|
|
|
22661
22661
|
});
|
|
22662
22662
|
return (hAsync(Host, { class: "kol-pagination" }, hAsync("nav", { class: "kol-pagination__navigation", "aria-label": this.state._label }, hAsync("ul", { class: "kol-pagination__navigation-list" }, this.state._hasButtons.first && (hAsync("li", null, hAsync(KolButtonWcTag, { class: "kol-pagination__button kol-pagination__button--first", exportparts: "icon", _customClass: this.state._customClass, _disabled: this.state._page <= 1, _icons: leftDoubleArrowIcon, _hideLabel: true, _label: translate('kol-page-first'), _on: this.onGoToFirst, _tooltipAlign: this.state._tooltipAlign }))), this.state._hasButtons.previous && (hAsync("li", null, hAsync(KolButtonWcTag, { class: "kol-pagination__button kol-pagination__button--previous", exportparts: "icon", _customClass: this.state._customClass, _disabled: this.state._page <= 1, _icons: leftSingleArrow, _hideLabel: true, _label: translate('kol-page-back'), _on: this.onGoBackward, _tooltipAlign: this.state._tooltipAlign }))), pageButtons, this.state._hasButtons.next && (hAsync("li", null, hAsync(KolButtonWcTag, { class: "kol-pagination__button kol-pagination__button--next", exportparts: "icon", _customClass: this.state._customClass, _disabled: count <= this.state._page, _icons: rightSingleArrowIcon, _hideLabel: true, _label: translate('kol-page-next'), _on: this.onGoForward, _tooltipAlign: this.state._tooltipAlign }))), this.state._hasButtons.last && (hAsync("li", null, hAsync(KolButtonWcTag, { class: "kol-pagination__button kol-pagination__button--last", exportparts: "icon", _customClass: this.state._customClass, _disabled: count <= this.state._page, _icons: rightDoubleArrowIcon, _hideLabel: true, _label: translate('kol-page-last'), _on: this.onGoToEnd, _tooltipAlign: this.state._tooltipAlign }))))), ((_a = this.state._pageSizeOptions) === null || _a === void 0 ? void 0 : _a.length) > 0 && (hAsync(KolSelectTag, { class: "kol-pagination__page-size-select", _hideLabel: true, _id: `pagination-size-${this.nonce}`, _label: translate('kol-entries-per-site'), _options: this.state._pageSizeOptions, _on: {
|
|
22663
22663
|
onChange: this.onChangePageSize,
|
|
22664
|
-
}, _value:
|
|
22664
|
+
}, _value: this.state._pageSize }))));
|
|
22665
22665
|
}
|
|
22666
22666
|
getUnselectedPageButton(page) {
|
|
22667
22667
|
return (hAsync("li", { key: nonce() }, hAsync(KolButtonWcTag, { exportparts: "icon", _customClass: this.state._customClass, _label: "", _on: {
|
|
@@ -25471,6 +25471,10 @@ class SelectController extends InputIconController {
|
|
|
25471
25471
|
}
|
|
25472
25472
|
};
|
|
25473
25473
|
this.beforePatchOptions = (_value, nextState) => {
|
|
25474
|
+
const raw = nextState.get('_value');
|
|
25475
|
+
if (raw !== undefined && !Array.isArray(raw)) {
|
|
25476
|
+
nextState.set('_value', [raw]);
|
|
25477
|
+
}
|
|
25474
25478
|
const options = nextState.has('_options') ? nextState.get('_options') : this.component.state._options;
|
|
25475
25479
|
if (Array.isArray(options) && options.length > 0) {
|
|
25476
25480
|
this.keyOptionMap.clear();
|
|
@@ -25498,6 +25502,7 @@ class SelectController extends InputIconController {
|
|
|
25498
25502
|
});
|
|
25499
25503
|
}
|
|
25500
25504
|
validateMultiple(value) {
|
|
25505
|
+
this.assertComponentValueMatchesMultiplicity(value === true);
|
|
25501
25506
|
watchBoolean(this.component, '_multiple', value, {
|
|
25502
25507
|
hooks: {
|
|
25503
25508
|
afterPatch: this.afterPatchOptions,
|
|
@@ -25512,7 +25517,8 @@ class SelectController extends InputIconController {
|
|
|
25512
25517
|
validateRows(this.component, value);
|
|
25513
25518
|
}
|
|
25514
25519
|
validateValue(value) {
|
|
25515
|
-
|
|
25520
|
+
this.assertValueMatchesMultiplicity(value);
|
|
25521
|
+
watchJsonArrayString(this.component, '_value', () => true, value === undefined ? [] : Array.isArray(value) ? value : [value], undefined, {
|
|
25516
25522
|
hooks: {
|
|
25517
25523
|
afterPatch: this.afterPatchOptions,
|
|
25518
25524
|
beforePatch: this.beforePatchOptions,
|
|
@@ -25527,6 +25533,33 @@ class SelectController extends InputIconController {
|
|
|
25527
25533
|
this.validateRows(this.component._rows);
|
|
25528
25534
|
this.validateValue(this.component._value);
|
|
25529
25535
|
}
|
|
25536
|
+
assertValueMatchesMultiplicity(value) {
|
|
25537
|
+
const isArray = Array.isArray(value);
|
|
25538
|
+
const isMultiple = this.component._multiple === true;
|
|
25539
|
+
if (isMultiple) {
|
|
25540
|
+
if (value !== undefined && !isArray) {
|
|
25541
|
+
throw new Error(`↑ The schema for the property (_value) is not valid for multiple mode. Expected an array. The value will not be changed. (received = ${JSON.stringify(value)})`);
|
|
25542
|
+
}
|
|
25543
|
+
}
|
|
25544
|
+
else {
|
|
25545
|
+
if (isArray) {
|
|
25546
|
+
throw new Error(`↑ The schema for the property (_value) is not valid for single mode. Expected a single value. The value will not be changed. (received = ${JSON.stringify(value)})`);
|
|
25547
|
+
}
|
|
25548
|
+
}
|
|
25549
|
+
}
|
|
25550
|
+
assertComponentValueMatchesMultiplicity(isMultiple) {
|
|
25551
|
+
const rawValue = this.component._value;
|
|
25552
|
+
if (isMultiple) {
|
|
25553
|
+
if (rawValue !== undefined && !Array.isArray(rawValue)) {
|
|
25554
|
+
throw new Error(`↑ The schema for the property (_value) is not valid for multiple mode. Expected an array. The value will not be changed. (current = ${JSON.stringify(rawValue)})`);
|
|
25555
|
+
}
|
|
25556
|
+
}
|
|
25557
|
+
else {
|
|
25558
|
+
if (Array.isArray(rawValue)) {
|
|
25559
|
+
throw new Error(`↑ The schema for the property (_value) is not valid for single mode. Expected a single value. The value will not be changed. (current = ${JSON.stringify(rawValue)})`);
|
|
25560
|
+
}
|
|
25561
|
+
}
|
|
25562
|
+
}
|
|
25530
25563
|
}
|
|
25531
25564
|
|
|
25532
25565
|
const NativeOptionFc = (_a) => {
|
|
@@ -25609,7 +25642,12 @@ var KolSelectDefaultStyle0 = defaultStyleCss$d;
|
|
|
25609
25642
|
|
|
25610
25643
|
class KolSelect {
|
|
25611
25644
|
async getValue() {
|
|
25612
|
-
|
|
25645
|
+
if (this._multiple) {
|
|
25646
|
+
return this.state._value;
|
|
25647
|
+
}
|
|
25648
|
+
else {
|
|
25649
|
+
return Array.isArray(this.state._value) && this.state._value.length > 0 ? this.state._value[0] : this.state._value;
|
|
25650
|
+
}
|
|
25613
25651
|
}
|
|
25614
25652
|
async kolFocus() {
|
|
25615
25653
|
var _a;
|
|
@@ -25636,13 +25674,13 @@ class KolSelect {
|
|
|
25636
25674
|
} });
|
|
25637
25675
|
}
|
|
25638
25676
|
render() {
|
|
25639
|
-
return (hAsync(FormFieldStateWrapper, Object.assign({ key: '
|
|
25677
|
+
return (hAsync(FormFieldStateWrapper, Object.assign({ key: 'ee750f61ab5efaaeab5ce0d12f1e3245d247754d' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: '6de71358b80c74c26932b9fc10646d875bf30604', state: this.state }, hAsync("form", { key: '18fa34b10cf838d759485a347815f41d5dca4107', onSubmit: (event) => {
|
|
25640
25678
|
event.preventDefault();
|
|
25641
25679
|
propagateSubmitEventToForm({
|
|
25642
25680
|
form: this.host,
|
|
25643
25681
|
ref: this.selectRef,
|
|
25644
25682
|
});
|
|
25645
|
-
} }, hAsync("input", { key: '
|
|
25683
|
+
} }, hAsync("input", { key: 'ee1aaa654136323417f2c422ecb7c338d00e6f71', type: "submit", hidden: true }), hAsync(SelectStateWrapper, Object.assign({ key: '8a734360f69205b8d4da153962b70ad832e552de' }, this.getSelectProps()))))));
|
|
25646
25684
|
}
|
|
25647
25685
|
constructor(hostRef) {
|
|
25648
25686
|
registerInstance(this, hostRef);
|
|
@@ -25753,13 +25791,26 @@ class KolSelect {
|
|
|
25753
25791
|
}
|
|
25754
25792
|
onInput(event) {
|
|
25755
25793
|
var _a;
|
|
25756
|
-
|
|
25757
|
-
.filter((option) => option.selected
|
|
25794
|
+
const selectedValues = Array.from(((_a = this.selectRef) === null || _a === void 0 ? void 0 : _a.options) || [])
|
|
25795
|
+
.filter((option) => option.selected)
|
|
25758
25796
|
.map((option) => { var _a; return (_a = this.controller.getOptionByKey(option.value)) === null || _a === void 0 ? void 0 : _a.value; });
|
|
25759
|
-
|
|
25797
|
+
if (this._multiple) {
|
|
25798
|
+
this._value = selectedValues;
|
|
25799
|
+
this.controller.onFacade.onInput(event, true, selectedValues);
|
|
25800
|
+
}
|
|
25801
|
+
else {
|
|
25802
|
+
const singleValue = selectedValues.length > 0 ? selectedValues[0] : undefined;
|
|
25803
|
+
this._value = singleValue;
|
|
25804
|
+
this.controller.onFacade.onInput(event, true, singleValue);
|
|
25805
|
+
}
|
|
25760
25806
|
}
|
|
25761
25807
|
onChange(event) {
|
|
25762
|
-
|
|
25808
|
+
if (this._multiple) {
|
|
25809
|
+
this.controller.onFacade.onChange(event, this._value);
|
|
25810
|
+
}
|
|
25811
|
+
else {
|
|
25812
|
+
this.controller.onFacade.onChange(event, this._value);
|
|
25813
|
+
}
|
|
25763
25814
|
}
|
|
25764
25815
|
get host() { return getElement(this); }
|
|
25765
25816
|
static get watchers() { return {
|
|
@@ -25811,7 +25862,7 @@ class KolSelect {
|
|
|
25811
25862
|
"_tabIndex": [2, "_tab-index"],
|
|
25812
25863
|
"_tooltipAlign": [1, "_tooltip-align"],
|
|
25813
25864
|
"_touched": [1540],
|
|
25814
|
-
"_value": [
|
|
25865
|
+
"_value": [1544],
|
|
25815
25866
|
"state": [32],
|
|
25816
25867
|
"inputHasFocus": [32],
|
|
25817
25868
|
"getValue": [64],
|
|
@@ -25887,9 +25938,13 @@ class KolSingleSelect {
|
|
|
25887
25938
|
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
25888
25939
|
}
|
|
25889
25940
|
onBlur() {
|
|
25890
|
-
var _a;
|
|
25891
|
-
|
|
25892
|
-
|
|
25941
|
+
var _a, _b, _c;
|
|
25942
|
+
const matchingOption = (_a = this.state._options) === null || _a === void 0 ? void 0 : _a.find((option) => { var _a, _b; return ((_a = option.label) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === ((_b = this._inputValue) === null || _b === void 0 ? void 0 : _b.toLowerCase()); });
|
|
25943
|
+
if (matchingOption) {
|
|
25944
|
+
this.selectOption(matchingOption);
|
|
25945
|
+
}
|
|
25946
|
+
else {
|
|
25947
|
+
this._inputValue = (_c = (_b = this.state._options) === null || _b === void 0 ? void 0 : _b.find((option) => option.value === this._value)) === null || _c === void 0 ? void 0 : _c.label;
|
|
25893
25948
|
this._filteredOptions = [...this.state._options];
|
|
25894
25949
|
}
|
|
25895
25950
|
this._isOpen = false;
|
|
@@ -25906,8 +25961,8 @@ class KolSingleSelect {
|
|
|
25906
25961
|
this._value = emptyValue;
|
|
25907
25962
|
this._inputValue = '';
|
|
25908
25963
|
this._filteredOptions = [...this.state._options];
|
|
25909
|
-
this.controller.onFacade.onInput(new CustomEvent('input', { bubbles: true, detail: { name: this.state._name, value: emptyValue } }), true, emptyValue);
|
|
25910
|
-
this.controller.onFacade.onChange(new CustomEvent('change', { bubbles: true, detail: { name: this.state._name, value: emptyValue } }), emptyValue);
|
|
25964
|
+
this.controller.onFacade.onInput(new CustomEvent('input', { bubbles: true, detail: { name: this.state._name, value: emptyValue } }), true, { value: emptyValue });
|
|
25965
|
+
this.controller.onFacade.onChange(new CustomEvent('change', { bubbles: true, detail: { name: this.state._name, value: emptyValue } }), { value: emptyValue });
|
|
25911
25966
|
}
|
|
25912
25967
|
}
|
|
25913
25968
|
selectOption(option) {
|
|
@@ -25994,13 +26049,13 @@ class KolSingleSelect {
|
|
|
25994
26049
|
render() {
|
|
25995
26050
|
var _a;
|
|
25996
26051
|
const isDisabled = this.state._disabled === true;
|
|
25997
|
-
return (hAsync(FormFieldStateWrapper, Object.assign({ key: '
|
|
26052
|
+
return (hAsync(FormFieldStateWrapper, Object.assign({ key: '39b2848c0636fbafd9bfa27ad64a656a1cc52e8d' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: 'cd32fb229cc56a6dbf215f36bd8d4a844d82544b', state: this.state }, hAsync("div", { key: '32d4e95487ce6ea9bbd3f06ad4a322d18c7cefa1', class: "kol-single-select__group" }, hAsync(InputStateWrapper, Object.assign({ key: 'e7bae179cfa26e53ee953d1ee1ac2ae90f102797' }, this.getInputProps())), this._inputValue && !this.state._hideClearButton && (hAsync(KolIconTag, { key: '736590a943c6f67651ccfa8baa960d25eadcc481', _icons: "codicon codicon-close", "data-testid": "single-select-delete", _label: translate('kol-delete-selection'), onClick: () => {
|
|
25998
26053
|
var _a;
|
|
25999
26054
|
this.clearSelection();
|
|
26000
26055
|
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
26001
26056
|
}, class: clsx('kol-single-select__delete', {
|
|
26002
26057
|
'kol-single-select__delete--disabled': isDisabled,
|
|
26003
|
-
}) })), hAsync(CustomSuggestionsToggleFc, { key: '
|
|
26058
|
+
}) })), hAsync(CustomSuggestionsToggleFc, { key: '34d7ddddda47097b0cdc607e5db0c9afa9e4ae1c', onClick: this.toggleListbox.bind(this), disabled: isDisabled })), this._isOpen && !isDisabled && (hAsync(CustomSuggestionsOptionsGroupFc, { key: '4ce6e47c707649893ec1c10ec0cb89e81a363b31', blockSuggestionMouseOver: this.blockSuggestionMouseOver, onKeyDown: this.handleKeyDownDropdown.bind(this), style: { '--visible-options': `${(_a = this._rows) !== null && _a !== void 0 ? _a : 5}` } }, Array.isArray(this._filteredOptions) && this._filteredOptions.length > 0 ? (this._filteredOptions.map((option, index) => (hAsync(CustomSuggestionsOptionFc, { index: index, option: option.label, searchTerm: this._inputValue, ref: (el) => {
|
|
26004
26059
|
if (el)
|
|
26005
26060
|
this.refOptions[index] = el;
|
|
26006
26061
|
}, selected: this._value === option.value, onClick: (event) => {
|
package/dist/index.mjs
CHANGED
|
@@ -22518,7 +22518,7 @@ class KolPaginationWc {
|
|
|
22518
22518
|
});
|
|
22519
22519
|
};
|
|
22520
22520
|
this.onChangePageSize = (event, value) => {
|
|
22521
|
-
value = parseInt(value
|
|
22521
|
+
value = parseInt(value);
|
|
22522
22522
|
if (typeof value === 'number' && value > 0 && this._pageSize !== value) {
|
|
22523
22523
|
this._pageSize = value;
|
|
22524
22524
|
const timeout = setTimeout(() => {
|
|
@@ -22657,7 +22657,7 @@ class KolPaginationWc {
|
|
|
22657
22657
|
});
|
|
22658
22658
|
return (hAsync(Host, { class: "kol-pagination" }, hAsync("nav", { class: "kol-pagination__navigation", "aria-label": this.state._label }, hAsync("ul", { class: "kol-pagination__navigation-list" }, this.state._hasButtons.first && (hAsync("li", null, hAsync(KolButtonWcTag, { class: "kol-pagination__button kol-pagination__button--first", exportparts: "icon", _customClass: this.state._customClass, _disabled: this.state._page <= 1, _icons: leftDoubleArrowIcon, _hideLabel: true, _label: translate('kol-page-first'), _on: this.onGoToFirst, _tooltipAlign: this.state._tooltipAlign }))), this.state._hasButtons.previous && (hAsync("li", null, hAsync(KolButtonWcTag, { class: "kol-pagination__button kol-pagination__button--previous", exportparts: "icon", _customClass: this.state._customClass, _disabled: this.state._page <= 1, _icons: leftSingleArrow, _hideLabel: true, _label: translate('kol-page-back'), _on: this.onGoBackward, _tooltipAlign: this.state._tooltipAlign }))), pageButtons, this.state._hasButtons.next && (hAsync("li", null, hAsync(KolButtonWcTag, { class: "kol-pagination__button kol-pagination__button--next", exportparts: "icon", _customClass: this.state._customClass, _disabled: count <= this.state._page, _icons: rightSingleArrowIcon, _hideLabel: true, _label: translate('kol-page-next'), _on: this.onGoForward, _tooltipAlign: this.state._tooltipAlign }))), this.state._hasButtons.last && (hAsync("li", null, hAsync(KolButtonWcTag, { class: "kol-pagination__button kol-pagination__button--last", exportparts: "icon", _customClass: this.state._customClass, _disabled: count <= this.state._page, _icons: rightDoubleArrowIcon, _hideLabel: true, _label: translate('kol-page-last'), _on: this.onGoToEnd, _tooltipAlign: this.state._tooltipAlign }))))), ((_a = this.state._pageSizeOptions) === null || _a === void 0 ? void 0 : _a.length) > 0 && (hAsync(KolSelectTag, { class: "kol-pagination__page-size-select", _hideLabel: true, _id: `pagination-size-${this.nonce}`, _label: translate('kol-entries-per-site'), _options: this.state._pageSizeOptions, _on: {
|
|
22659
22659
|
onChange: this.onChangePageSize,
|
|
22660
|
-
}, _value:
|
|
22660
|
+
}, _value: this.state._pageSize }))));
|
|
22661
22661
|
}
|
|
22662
22662
|
getUnselectedPageButton(page) {
|
|
22663
22663
|
return (hAsync("li", { key: nonce() }, hAsync(KolButtonWcTag, { exportparts: "icon", _customClass: this.state._customClass, _label: "", _on: {
|
|
@@ -25467,6 +25467,10 @@ class SelectController extends InputIconController {
|
|
|
25467
25467
|
}
|
|
25468
25468
|
};
|
|
25469
25469
|
this.beforePatchOptions = (_value, nextState) => {
|
|
25470
|
+
const raw = nextState.get('_value');
|
|
25471
|
+
if (raw !== undefined && !Array.isArray(raw)) {
|
|
25472
|
+
nextState.set('_value', [raw]);
|
|
25473
|
+
}
|
|
25470
25474
|
const options = nextState.has('_options') ? nextState.get('_options') : this.component.state._options;
|
|
25471
25475
|
if (Array.isArray(options) && options.length > 0) {
|
|
25472
25476
|
this.keyOptionMap.clear();
|
|
@@ -25494,6 +25498,7 @@ class SelectController extends InputIconController {
|
|
|
25494
25498
|
});
|
|
25495
25499
|
}
|
|
25496
25500
|
validateMultiple(value) {
|
|
25501
|
+
this.assertComponentValueMatchesMultiplicity(value === true);
|
|
25497
25502
|
watchBoolean(this.component, '_multiple', value, {
|
|
25498
25503
|
hooks: {
|
|
25499
25504
|
afterPatch: this.afterPatchOptions,
|
|
@@ -25508,7 +25513,8 @@ class SelectController extends InputIconController {
|
|
|
25508
25513
|
validateRows(this.component, value);
|
|
25509
25514
|
}
|
|
25510
25515
|
validateValue(value) {
|
|
25511
|
-
|
|
25516
|
+
this.assertValueMatchesMultiplicity(value);
|
|
25517
|
+
watchJsonArrayString(this.component, '_value', () => true, value === undefined ? [] : Array.isArray(value) ? value : [value], undefined, {
|
|
25512
25518
|
hooks: {
|
|
25513
25519
|
afterPatch: this.afterPatchOptions,
|
|
25514
25520
|
beforePatch: this.beforePatchOptions,
|
|
@@ -25523,6 +25529,33 @@ class SelectController extends InputIconController {
|
|
|
25523
25529
|
this.validateRows(this.component._rows);
|
|
25524
25530
|
this.validateValue(this.component._value);
|
|
25525
25531
|
}
|
|
25532
|
+
assertValueMatchesMultiplicity(value) {
|
|
25533
|
+
const isArray = Array.isArray(value);
|
|
25534
|
+
const isMultiple = this.component._multiple === true;
|
|
25535
|
+
if (isMultiple) {
|
|
25536
|
+
if (value !== undefined && !isArray) {
|
|
25537
|
+
throw new Error(`↑ The schema for the property (_value) is not valid for multiple mode. Expected an array. The value will not be changed. (received = ${JSON.stringify(value)})`);
|
|
25538
|
+
}
|
|
25539
|
+
}
|
|
25540
|
+
else {
|
|
25541
|
+
if (isArray) {
|
|
25542
|
+
throw new Error(`↑ The schema for the property (_value) is not valid for single mode. Expected a single value. The value will not be changed. (received = ${JSON.stringify(value)})`);
|
|
25543
|
+
}
|
|
25544
|
+
}
|
|
25545
|
+
}
|
|
25546
|
+
assertComponentValueMatchesMultiplicity(isMultiple) {
|
|
25547
|
+
const rawValue = this.component._value;
|
|
25548
|
+
if (isMultiple) {
|
|
25549
|
+
if (rawValue !== undefined && !Array.isArray(rawValue)) {
|
|
25550
|
+
throw new Error(`↑ The schema for the property (_value) is not valid for multiple mode. Expected an array. The value will not be changed. (current = ${JSON.stringify(rawValue)})`);
|
|
25551
|
+
}
|
|
25552
|
+
}
|
|
25553
|
+
else {
|
|
25554
|
+
if (Array.isArray(rawValue)) {
|
|
25555
|
+
throw new Error(`↑ The schema for the property (_value) is not valid for single mode. Expected a single value. The value will not be changed. (current = ${JSON.stringify(rawValue)})`);
|
|
25556
|
+
}
|
|
25557
|
+
}
|
|
25558
|
+
}
|
|
25526
25559
|
}
|
|
25527
25560
|
|
|
25528
25561
|
const NativeOptionFc = (_a) => {
|
|
@@ -25605,7 +25638,12 @@ var KolSelectDefaultStyle0 = defaultStyleCss$d;
|
|
|
25605
25638
|
|
|
25606
25639
|
class KolSelect {
|
|
25607
25640
|
async getValue() {
|
|
25608
|
-
|
|
25641
|
+
if (this._multiple) {
|
|
25642
|
+
return this.state._value;
|
|
25643
|
+
}
|
|
25644
|
+
else {
|
|
25645
|
+
return Array.isArray(this.state._value) && this.state._value.length > 0 ? this.state._value[0] : this.state._value;
|
|
25646
|
+
}
|
|
25609
25647
|
}
|
|
25610
25648
|
async kolFocus() {
|
|
25611
25649
|
var _a;
|
|
@@ -25632,13 +25670,13 @@ class KolSelect {
|
|
|
25632
25670
|
} });
|
|
25633
25671
|
}
|
|
25634
25672
|
render() {
|
|
25635
|
-
return (hAsync(FormFieldStateWrapper, Object.assign({ key: '
|
|
25673
|
+
return (hAsync(FormFieldStateWrapper, Object.assign({ key: 'ee750f61ab5efaaeab5ce0d12f1e3245d247754d' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: '6de71358b80c74c26932b9fc10646d875bf30604', state: this.state }, hAsync("form", { key: '18fa34b10cf838d759485a347815f41d5dca4107', onSubmit: (event) => {
|
|
25636
25674
|
event.preventDefault();
|
|
25637
25675
|
propagateSubmitEventToForm({
|
|
25638
25676
|
form: this.host,
|
|
25639
25677
|
ref: this.selectRef,
|
|
25640
25678
|
});
|
|
25641
|
-
} }, hAsync("input", { key: '
|
|
25679
|
+
} }, hAsync("input", { key: 'ee1aaa654136323417f2c422ecb7c338d00e6f71', type: "submit", hidden: true }), hAsync(SelectStateWrapper, Object.assign({ key: '8a734360f69205b8d4da153962b70ad832e552de' }, this.getSelectProps()))))));
|
|
25642
25680
|
}
|
|
25643
25681
|
constructor(hostRef) {
|
|
25644
25682
|
registerInstance(this, hostRef);
|
|
@@ -25749,13 +25787,26 @@ class KolSelect {
|
|
|
25749
25787
|
}
|
|
25750
25788
|
onInput(event) {
|
|
25751
25789
|
var _a;
|
|
25752
|
-
|
|
25753
|
-
.filter((option) => option.selected
|
|
25790
|
+
const selectedValues = Array.from(((_a = this.selectRef) === null || _a === void 0 ? void 0 : _a.options) || [])
|
|
25791
|
+
.filter((option) => option.selected)
|
|
25754
25792
|
.map((option) => { var _a; return (_a = this.controller.getOptionByKey(option.value)) === null || _a === void 0 ? void 0 : _a.value; });
|
|
25755
|
-
|
|
25793
|
+
if (this._multiple) {
|
|
25794
|
+
this._value = selectedValues;
|
|
25795
|
+
this.controller.onFacade.onInput(event, true, selectedValues);
|
|
25796
|
+
}
|
|
25797
|
+
else {
|
|
25798
|
+
const singleValue = selectedValues.length > 0 ? selectedValues[0] : undefined;
|
|
25799
|
+
this._value = singleValue;
|
|
25800
|
+
this.controller.onFacade.onInput(event, true, singleValue);
|
|
25801
|
+
}
|
|
25756
25802
|
}
|
|
25757
25803
|
onChange(event) {
|
|
25758
|
-
|
|
25804
|
+
if (this._multiple) {
|
|
25805
|
+
this.controller.onFacade.onChange(event, this._value);
|
|
25806
|
+
}
|
|
25807
|
+
else {
|
|
25808
|
+
this.controller.onFacade.onChange(event, this._value);
|
|
25809
|
+
}
|
|
25759
25810
|
}
|
|
25760
25811
|
get host() { return getElement(this); }
|
|
25761
25812
|
static get watchers() { return {
|
|
@@ -25807,7 +25858,7 @@ class KolSelect {
|
|
|
25807
25858
|
"_tabIndex": [2, "_tab-index"],
|
|
25808
25859
|
"_tooltipAlign": [1, "_tooltip-align"],
|
|
25809
25860
|
"_touched": [1540],
|
|
25810
|
-
"_value": [
|
|
25861
|
+
"_value": [1544],
|
|
25811
25862
|
"state": [32],
|
|
25812
25863
|
"inputHasFocus": [32],
|
|
25813
25864
|
"getValue": [64],
|
|
@@ -25883,9 +25934,13 @@ class KolSingleSelect {
|
|
|
25883
25934
|
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
25884
25935
|
}
|
|
25885
25936
|
onBlur() {
|
|
25886
|
-
var _a;
|
|
25887
|
-
|
|
25888
|
-
|
|
25937
|
+
var _a, _b, _c;
|
|
25938
|
+
const matchingOption = (_a = this.state._options) === null || _a === void 0 ? void 0 : _a.find((option) => { var _a, _b; return ((_a = option.label) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === ((_b = this._inputValue) === null || _b === void 0 ? void 0 : _b.toLowerCase()); });
|
|
25939
|
+
if (matchingOption) {
|
|
25940
|
+
this.selectOption(matchingOption);
|
|
25941
|
+
}
|
|
25942
|
+
else {
|
|
25943
|
+
this._inputValue = (_c = (_b = this.state._options) === null || _b === void 0 ? void 0 : _b.find((option) => option.value === this._value)) === null || _c === void 0 ? void 0 : _c.label;
|
|
25889
25944
|
this._filteredOptions = [...this.state._options];
|
|
25890
25945
|
}
|
|
25891
25946
|
this._isOpen = false;
|
|
@@ -25902,8 +25957,8 @@ class KolSingleSelect {
|
|
|
25902
25957
|
this._value = emptyValue;
|
|
25903
25958
|
this._inputValue = '';
|
|
25904
25959
|
this._filteredOptions = [...this.state._options];
|
|
25905
|
-
this.controller.onFacade.onInput(new CustomEvent('input', { bubbles: true, detail: { name: this.state._name, value: emptyValue } }), true, emptyValue);
|
|
25906
|
-
this.controller.onFacade.onChange(new CustomEvent('change', { bubbles: true, detail: { name: this.state._name, value: emptyValue } }), emptyValue);
|
|
25960
|
+
this.controller.onFacade.onInput(new CustomEvent('input', { bubbles: true, detail: { name: this.state._name, value: emptyValue } }), true, { value: emptyValue });
|
|
25961
|
+
this.controller.onFacade.onChange(new CustomEvent('change', { bubbles: true, detail: { name: this.state._name, value: emptyValue } }), { value: emptyValue });
|
|
25907
25962
|
}
|
|
25908
25963
|
}
|
|
25909
25964
|
selectOption(option) {
|
|
@@ -25990,13 +26045,13 @@ class KolSingleSelect {
|
|
|
25990
26045
|
render() {
|
|
25991
26046
|
var _a;
|
|
25992
26047
|
const isDisabled = this.state._disabled === true;
|
|
25993
|
-
return (hAsync(FormFieldStateWrapper, Object.assign({ key: '
|
|
26048
|
+
return (hAsync(FormFieldStateWrapper, Object.assign({ key: '39b2848c0636fbafd9bfa27ad64a656a1cc52e8d' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: 'cd32fb229cc56a6dbf215f36bd8d4a844d82544b', state: this.state }, hAsync("div", { key: '32d4e95487ce6ea9bbd3f06ad4a322d18c7cefa1', class: "kol-single-select__group" }, hAsync(InputStateWrapper, Object.assign({ key: 'e7bae179cfa26e53ee953d1ee1ac2ae90f102797' }, this.getInputProps())), this._inputValue && !this.state._hideClearButton && (hAsync(KolIconTag, { key: '736590a943c6f67651ccfa8baa960d25eadcc481', _icons: "codicon codicon-close", "data-testid": "single-select-delete", _label: translate('kol-delete-selection'), onClick: () => {
|
|
25994
26049
|
var _a;
|
|
25995
26050
|
this.clearSelection();
|
|
25996
26051
|
(_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
25997
26052
|
}, class: clsx('kol-single-select__delete', {
|
|
25998
26053
|
'kol-single-select__delete--disabled': isDisabled,
|
|
25999
|
-
}) })), hAsync(CustomSuggestionsToggleFc, { key: '
|
|
26054
|
+
}) })), hAsync(CustomSuggestionsToggleFc, { key: '34d7ddddda47097b0cdc607e5db0c9afa9e4ae1c', onClick: this.toggleListbox.bind(this), disabled: isDisabled })), this._isOpen && !isDisabled && (hAsync(CustomSuggestionsOptionsGroupFc, { key: '4ce6e47c707649893ec1c10ec0cb89e81a363b31', blockSuggestionMouseOver: this.blockSuggestionMouseOver, onKeyDown: this.handleKeyDownDropdown.bind(this), style: { '--visible-options': `${(_a = this._rows) !== null && _a !== void 0 ? _a : 5}` } }, Array.isArray(this._filteredOptions) && this._filteredOptions.length > 0 ? (this._filteredOptions.map((option, index) => (hAsync(CustomSuggestionsOptionFc, { index: index, option: option.label, searchTerm: this._inputValue, ref: (el) => {
|
|
26000
26055
|
if (el)
|
|
26001
26056
|
this.refOptions[index] = el;
|
|
26002
26057
|
}, selected: this._value === option.value, onClick: (event) => {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@public-ui/hydrate",
|
|
3
|
-
"version": "3.0.2-rc.
|
|
3
|
+
"version": "3.0.2-rc.2",
|
|
4
4
|
"license": "EUPL-1.2",
|
|
5
5
|
"homepage": "https://public-ui.github.io",
|
|
6
6
|
"repository": {
|
|
@@ -46,10 +46,10 @@
|
|
|
46
46
|
],
|
|
47
47
|
"devDependencies": {
|
|
48
48
|
"rimraf": "6.0.1",
|
|
49
|
-
"@public-ui/components": "3.0.2-rc.
|
|
49
|
+
"@public-ui/components": "3.0.2-rc.2"
|
|
50
50
|
},
|
|
51
51
|
"peerDependencies": {
|
|
52
|
-
"@public-ui/components": "3.0.2-rc.
|
|
52
|
+
"@public-ui/components": "3.0.2-rc.2"
|
|
53
53
|
},
|
|
54
54
|
"sideEffects": false,
|
|
55
55
|
"type": "commonjs",
|