@haiilo/catalyst 13.4.0 → 13.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/catalyst/catalyst.esm.js +1 -1
- package/dist/catalyst/{p-8e3e3018.entry.js → p-06fc2818.entry.js} +2 -2
- package/dist/catalyst/{p-8e3e3018.entry.js.map → p-06fc2818.entry.js.map} +1 -1
- package/dist/cjs/cat-alert_30.cjs.entry.js +4 -4
- package/dist/cjs/cat-alert_30.cjs.entry.js.map +1 -1
- package/dist/collection/components/cat-select/cat-select.js +6 -5
- package/dist/collection/components/cat-select/cat-select.js.map +1 -1
- package/dist/components/cat-select2.js +4 -4
- package/dist/components/cat-select2.js.map +1 -1
- package/dist/esm/cat-alert_30.entry.js +4 -4
- package/dist/esm/cat-alert_30.entry.js.map +1 -1
- package/dist/types/components/cat-select/cat-select.d.ts +2 -1
- package/package.json +2 -2
|
@@ -9377,18 +9377,18 @@ const CatSelect = class {
|
|
|
9377
9377
|
}
|
|
9378
9378
|
render() {
|
|
9379
9379
|
this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;
|
|
9380
|
-
return (index.h(index.Host, { key: '
|
|
9380
|
+
return (index.h(index.Host, { key: '215ede88da2cebb283c993e3faee643f3e5b7ae6' }, index.h("div", { key: 'e4f86ba45a09130375e688cdda5a509e29dd5705', class: {
|
|
9381
9381
|
'select-field': true,
|
|
9382
9382
|
'select-horizontal': this.horizontal ?? this.fallbackHorizontal ?? false,
|
|
9383
9383
|
'select-multiple': this.multiple
|
|
9384
|
-
} }, index.h("div", { key: '
|
|
9384
|
+
} }, index.h("div", { key: '730db9e544791bc3563a8b03c7db255a4e62ffd1', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (index.h("label", { key: '3ad374f511cb5767e6ddb928af06b527a171d4fb', htmlFor: `select-${this.id}-input`, part: "label" }, index.h("span", { key: '82d60233996e17ae590b10aa7d43309ef6c8c70d', class: "label-wrapper" }, (this.hasSlottedLabel && index.h("slot", { key: '6f74a3be807d3c8ca40438783b606168388afdd9', name: "label" })) || this.label, index.h("div", { key: '29e7d188b60884152f0b711b11edf586b4b36758', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (index.h("span", { key: '1dde29bf60b45066c92758ce20b1b1978c8dee65', class: "label-optional", "aria-hidden": "true" }, "(", index$1.catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (index.h("span", { key: '52b359ac5d3d5da7c9e9f124e5be4e58d636142a', class: "label-optional", "aria-hidden": "true" }, "(", index$1.catI18nRegistry.t('input.required'), ")"))))))), index.h("div", { key: '16007a456de25c404b6035af56059f3dab7f8c24', class: "select-container" }, index.h("div", { key: 'ef90728e9b4f1ed89a73389696841c82eef49c07', class: { 'select-wrapper': true, 'select-disabled': this.disabled, 'select-invalid': this.invalid }, ref: el => (this.trigger = el), id: this.id, role: "combobox", "aria-expanded": this.state.isOpen || this.isPillboxActive(), "aria-controls": this.isPillboxActive() ? `select-pillbox-${this.id}` : `select-listbox-${this.id}`, "aria-required": this.required ? 'true' : false, "aria-activedescendant": this.activeDescendant, onClick: e => this.onClick(e) }, index.h("div", { key: '9e2259fa9144037f2ac16f5480591edc9cc76554', class: "select-wrapper-inner" }, this.multiple && this.state.selection.length ? (index.h("div", { id: `select-pillbox-${this.id}`, role: "listbox", "aria-orientation": "horizontal", class: "select-pills" }, this.state.selection.map((item, i) => (index.h("span", { class: {
|
|
9385
9385
|
pill: true,
|
|
9386
9386
|
'select-no-open': true,
|
|
9387
9387
|
'select-option-active': this.state.activeSelectionIndex === i
|
|
9388
|
-
}, role: "option", "aria-selected": "true", id: `select-${this.id}-selection-${i}` }, item.render.avatar ? (index.h("cat-avatar", { label: item.render.label, round: item.render.avatar.round, src: item.render.avatar.src, icon: item.render.avatar.icon, initials: item.render.avatar.initials ?? '' })) : null, index.h("span", null, item.render.label), !this.disabled && (index.h("cat-button", { size: "xs", variant: "text", icon: "$cat:select-clear", iconOnly: true, a11yLabel: index$1.catI18nRegistry.t('select.deselect'), onClick: () => this.deselect(item.item.id), tabIndex: -1, "data-dropdown-no-close": true }))))))) : this.state.selection.length && this.state.selection[0].render.avatar ? (index.h("cat-avatar", { label: this.state.selection[0].render.label, round: this.state.selection[0].render.avatar.round, src: this.state.selection[0].render.avatar.src, icon: this.state.selection[0].render.avatar.icon, initials: this.state.selection[0].render.avatar.initials ?? '' })) : null, index.h("input", { key: '
|
|
9388
|
+
}, role: "option", "aria-selected": "true", id: `select-${this.id}-selection-${i}` }, item.render.avatar ? (index.h("cat-avatar", { label: item.render.label, round: item.render.avatar.round, src: item.render.avatar.src, icon: item.render.avatar.icon, initials: item.render.avatar.initials ?? '' })) : null, index.h("span", null, item.render.label), !this.disabled && (index.h("cat-button", { size: "xs", variant: "text", icon: "$cat:select-clear", iconOnly: true, a11yLabel: index$1.catI18nRegistry.t('select.deselect'), onClick: () => this.deselect(item.item.id), tabIndex: -1, "data-dropdown-no-close": true }))))))) : this.state.selection.length && this.state.selection[0].render.avatar ? (index.h("cat-avatar", { label: this.state.selection[0].render.label, round: this.state.selection[0].render.avatar.round, src: this.state.selection[0].render.avatar.src, icon: this.state.selection[0].render.avatar.icon, initials: this.state.selection[0].render.avatar.initials ?? '' })) : null, index.h("input", { key: 'adce9fade21637c40a169627d2e94446e41c03c7', "data-test": this.testId, ...this.nativeAttributes, part: "input", id: `select-${this.id}-input`, class: "select-input", role: "combobox", ref: el => (this.input = el), "aria-controls": this.isPillboxActive() ? `select-pillbox-${this.id}` : `select-listbox-${this.id}`, "aria-activedescendant": this.activeDescendant, "aria-invalid": this.invalid ? 'true' : undefined, "aria-describedby": this.hasHint ? this.id + '-hint' : undefined, "aria-autocomplete": "list", onInput: this.onInput.bind(this), value: !this.multiple ? this.state.term : undefined, placeholder: this.placeholder, disabled: this.disabled || this.state.isResolving })), this.state.isResolving && index.h("cat-spinner", { key: '09d13fbbec90aa2a4a3564f317fb0936c60c31c8' }), this.invalid && (index.h("cat-icon", { key: '7ab71ea5f878af7ced8b5968dbe6b94f5d323c0e', icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l" })), (this.state.selection.length || this.state.term.length) &&
|
|
9389
9389
|
!this.disabled &&
|
|
9390
9390
|
!this.state.isResolving &&
|
|
9391
|
-
this.clearable ? (index.h("cat-button", { id: `select-clear-btn-${this.id}`, iconOnly: true, icon: "$cat:input-close", variant: "text", size: "s", a11yLabel: index$1.catI18nRegistry.t('input.clear'), onCatClick: () => this.clearInput(), "data-dropdown-no-close": true })) : null, !this.state.isResolving && (index.h("cat-button", { key: '
|
|
9391
|
+
this.clearable ? (index.h("cat-button", { id: `select-clear-btn-${this.id}`, iconOnly: true, icon: "$cat:input-close", variant: "text", size: "s", a11yLabel: index$1.catI18nRegistry.t('input.clear'), onCatClick: () => this.clearInput(), "data-dropdown-no-close": true })) : null, !this.state.isResolving && (index.h("cat-button", { key: '6101eccd484533f75887e7ca9b2c4953d2b0f059', iconOnly: true, icon: "$cat:select-open", class: { 'select-btn': true, 'select-btn-open': this.state.isOpen }, variant: "text", size: "s", a11yLabel: this.state.isOpen ? index$1.catI18nRegistry.t('select.close') : index$1.catI18nRegistry.t('select.open'), "aria-controls": `select-listbox-${this.id}`, "aria-expanded": this.state.isOpen, tabIndex: -1, disabled: this.disabled || this.state.isResolving, "data-dropdown-no-close": true }))), this.hasHint && (index.h(CatFormHint, { key: 'ae9a6eece52175949a71fa8cb04e291c569bb1e1', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }), errorMap: this.errorMap })))), index.h("div", { key: '6ae669a93391e05620aa240137e54c5673aa86fa', class: "select-dropdown", ref: el => (this.dropdown = el), style: { display: this.state.isOpen ? 'block' : undefined } }, this.state.isOpen && (index.h("cat-scrollable", { key: '9d9e7b7a48b72f6ee9ae734cad2956b896bd02e2', class: "select-options-wrapper", scrolledBuffer: 56, noOverflowX: true, noOverscroll: true, noScrolledInit: true, onScrolledBottom: () => this.more$.next() }, index.h("ul", { key: '0ec75e93c391b4e81cbacc7839850c6e453f6eb7', class: "select-options", role: "listbox", "aria-multiselectable": this.multiple, "aria-setsize": this.state.totalElements, id: `select-listbox-${this.id}` }, this.optionsList, this.state.isFirstLoading
|
|
9392
9392
|
? Array.from(Array(CatSelect.SKELETON_COUNT)).map(() => (index.h("li", { class: "select-option-loading" }, index.h("cat-skeleton", { variant: "body", lines: 1 }), index.h("cat-skeleton", { variant: "body", lines: 1 }))))
|
|
9393
9393
|
: !this.state.options.length &&
|
|
9394
9394
|
!this.tags && (index.h("li", { class: "select-option-empty" }, this.noItems ? this.noItems : index$1.catI18nRegistry.t('select.empty')))))))));
|