@haiilo/catalyst 13.0.2 → 13.1.0

package/dist/components/cat-select2.js

@@ -452,18 +452,18 @@ const CatSelect = /*@__PURE__*/ proxyCustomElement(class CatSelect extends HTMLE
     }
     render() {
         this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;
-        return (h(Host, { key: '26022563ab88a3584535797b754b7570bf3b0ffb' }, h("div", { key: '30e3e1146a9e2bd53b60142ce7d565f52721f50b', class: {
+        return (h(Host, { key: '93b8cc474d53cf5c950a5ee2ee9b51cf5956288e' }, h("div", { key: 'ce1bc0a70b577af3926a459aa1734bbc6200b2bd', class: {
                 'select-field': true,
                 'select-horizontal': this.horizontal ?? this.fallbackHorizontal ?? false,
                 'select-multiple': this.multiple
-            } }, h("div", { key: '603019e3284146af3556483b4a590b226f6281d3', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (h("label", { key: 'b32f7093c998f3b9e33471a421f009251dfba91c', htmlFor: `select-${this.id}-input`, part: "label" }, h("span", { key: 'eceec9df59454df362376ab4984b56c646c58a96', class: "label-wrapper" }, (this.hasSlottedLabel && h("slot", { key: '79f2b4e2bbaae0df29f13ca7b3c0a08d3b119b5b', name: "label" })) || this.label, h("div", { key: 'b715203cb490813f5968794780cc7b471ef46ddf', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (h("span", { key: 'e3b6242d4db7efe62863b74ecaa939525db2352f', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (h("span", { key: '874922172fa58538c312c2068cbe3ef528deea6f', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.required'), ")"))))))), h("div", { key: '0f40b72819c7a4128af2d983c75f1f618d50dcf4', class: "select-container" }, h("div", { key: '15d154a43a203ed531076e1bc3843354de9df8ec', 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) }, h("div", { key: 'bb93b1a8eac29220805d402b2404f34d415b118d', class: "select-wrapper-inner" }, this.multiple && this.state.selection.length ? (h("div", { id: `select-pillbox-${this.id}`, role: "listbox", "aria-orientation": "horizontal", class: "select-pills" }, this.state.selection.map((item, i) => (h("span", { class: {
+            } }, h("div", { key: '49dd5bf7a639d1c44ccc5a35eb9efcbc362dfc71', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (h("label", { key: '9fdb7777067c530a46d920ce49eba63ec890bf57', htmlFor: `select-${this.id}-input`, part: "label" }, h("span", { key: 'ed19b3d78c7d9c0f610884a824cd90f4b4a7f1cb', class: "label-wrapper" }, (this.hasSlottedLabel && h("slot", { key: '39b9b19d3505885c873825b939b9f5334cadf351', name: "label" })) || this.label, h("div", { key: '8db9f030a2278e733e2186d8d386a3bc5e94702b', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (h("span", { key: '5f3196c0a8c55b6dc55031e958cd30193858500f', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (h("span", { key: '8434806d6d457a85ee342cecf75e3d8cd4453bb2', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.required'), ")"))))))), h("div", { key: '294b26a82988b0d35e98eb75e0d64227aa92bf7f', class: "select-container" }, h("div", { key: 'bc97d26c6da84a26e90897384895ede9b2091fc0', 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) }, h("div", { key: 'e6c2dd7b1e3053501ab9c84a7c651c87bc1367c0', class: "select-wrapper-inner" }, this.multiple && this.state.selection.length ? (h("div", { id: `select-pillbox-${this.id}`, role: "listbox", "aria-orientation": "horizontal", class: "select-pills" }, this.state.selection.map((item, i) => (h("span", { class: {
                 pill: true,
                 'select-no-open': true,
                 'select-option-active': this.state.activeSelectionIndex === i
-            }, role: "option", "aria-selected": "true", id: `select-${this.id}-selection-${i}` }, item.render.avatar ? (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, h("span", null, item.render.label), !this.disabled && (h("cat-button", { size: "xs", variant: "text", icon: "$cat:select-clear", iconOnly: true, a11yLabel: 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 ? (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, h("input", { key: '703737039954b5b57bcc96dafbb210ef1cc38b3c', "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 && h("cat-spinner", { key: '54bd05a2e7b16b3ee3af8bf4bc3a1cc6eeb55c55' }), this.invalid && (h("cat-icon", { key: '3160286e240c29181a2468124207ca61f273ef08', icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l" })), (this.state.selection.length || this.state.term.length) &&
+            }, role: "option", "aria-selected": "true", id: `select-${this.id}-selection-${i}` }, item.render.avatar ? (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, h("span", null, item.render.label), !this.disabled && (h("cat-button", { size: "xs", variant: "text", icon: "$cat:select-clear", iconOnly: true, a11yLabel: 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 ? (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, h("input", { key: '59735a765001238dddda82e9c12b9e76ba099684', "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 && h("cat-spinner", { key: 'e43f723bd8149aea563ab01453bc47aefb2d4771' }), this.invalid && (h("cat-icon", { key: '602808e09ac23bf6b1f2690c50b538c47a376a6c', icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l" })), (this.state.selection.length || this.state.term.length) &&
             !this.disabled &&
             !this.state.isResolving &&
-            this.clearable ? (h("cat-button", { id: `select-clear-btn-${this.id}`, iconOnly: true, icon: "$cat:input-close", variant: "text", size: "s", a11yLabel: catI18nRegistry.t('input.clear'), onCatClick: () => this.clearInput(), "data-dropdown-no-close": true })) : null, !this.state.isResolving && (h("cat-button", { key: '542d227a84df195890635f5bbd2f7ca92c06b1d5', iconOnly: true, icon: "$cat:select-open", class: { 'select-btn': true, 'select-btn-open': this.state.isOpen }, variant: "text", size: "s", a11yLabel: this.state.isOpen ? catI18nRegistry.t('select.close') : 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 && (h(CatFormHint, { key: '5f09b1dc7319b4bcffaf11d5de844c1bd775ce3a', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }), errorMap: this.errorMap })))), h("div", { key: '17870f81f4514ff338dab7e3c5269e2e9e0ad153', class: "select-dropdown", ref: el => (this.dropdown = el), style: { display: this.state.isOpen ? 'block' : undefined } }, this.state.isOpen && (h("cat-scrollable", { key: '203fd9329f77bafdc89cd05330a861c84230ea3b', class: "select-options-wrapper", scrolledBuffer: 56, noOverflowX: true, noOverscroll: true, noScrolledInit: true, onScrolledBottom: () => this.more$.next() }, h("ul", { key: 'dbdb7de9daf6ff390e09f49fbd6875dc33493e05', class: "select-options", role: "listbox", "aria-multiselectable": this.multiple, "aria-setsize": this.state.totalElements, id: `select-listbox-${this.id}` }, this.optionsList, this.state.isFirstLoading
+            this.clearable ? (h("cat-button", { id: `select-clear-btn-${this.id}`, iconOnly: true, icon: "$cat:input-close", variant: "text", size: "s", a11yLabel: catI18nRegistry.t('input.clear'), onCatClick: () => this.clearInput(), "data-dropdown-no-close": true })) : null, !this.state.isResolving && (h("cat-button", { key: 'b84edc71dde76b9f65fa019d698cd91b97db2390', iconOnly: true, icon: "$cat:select-open", class: { 'select-btn': true, 'select-btn-open': this.state.isOpen }, variant: "text", size: "s", a11yLabel: this.state.isOpen ? catI18nRegistry.t('select.close') : 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 && (h(CatFormHint, { key: 'a7d9d8e2a0a4333d9320d987c51792e9d8b13184', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }), errorMap: this.errorMap })))), h("div", { key: '6542000b357d4084d202af29010dd8a85dff5350', class: "select-dropdown", ref: el => (this.dropdown = el), style: { display: this.state.isOpen ? 'block' : undefined } }, this.state.isOpen && (h("cat-scrollable", { key: 'e449f1d397d1140e546b8e473b0649d9e8e2dbd7', class: "select-options-wrapper", scrolledBuffer: 56, noOverflowX: true, noOverscroll: true, noScrolledInit: true, onScrolledBottom: () => this.more$.next() }, h("ul", { key: 'c3c172ebe62fa6a08b1a4f7254b863efc83e8247', class: "select-options", role: "listbox", "aria-multiselectable": this.multiple, "aria-setsize": this.state.totalElements, id: `select-listbox-${this.id}` }, this.optionsList, this.state.isFirstLoading
             ? Array.from(Array(CatSelect.SKELETON_COUNT)).map(() => (h("li", { class: "select-option-loading" }, h("cat-skeleton", { variant: "body", lines: 1 }), h("cat-skeleton", { variant: "body", lines: 1 }))))
             : !this.state.options.length &&
                 !this.tags && (h("li", { class: "select-option-empty" }, this.noItems ? this.noItems : catI18nRegistry.t('select.empty')))))))));

package/dist/components/cat-skeleton2.js

@@ -22,7 +22,7 @@ const CatSkeleton = /*@__PURE__*/ proxyCustomElement(class CatSkeleton extends H
         this.size = 'm';
     }
     render() {
-        return (h(Host, { key: '95992890ce7b8c90068af979179fe6e512cd599c' }, Array.from(Array(this.count)).map(() => (h("div", { style: this.style, class: {
+        return (h(Host, { key: '402c7d7bcd6e39164d2f7f22755bc0ebb20aed35' }, Array.from(Array(this.count)).map(() => (h("div", { style: this.style, class: {
                 skeleton: true,
                 [`skeleton-${this.effect}`]: Boolean(this.effect),
                 [`skeleton-${this.variant}`]: Boolean(this.variant),

package/dist/components/cat-spinner2.js

@@ -17,9 +17,9 @@ const CatSpinner = /*@__PURE__*/ proxyCustomElement(class CatSpinner extends HTM
         this.value = 0;
     }
     render() {
-        return (h("span", { key: '8922d0ec7f5474084a39a8b3a4620bee426cea78', role: "progressbar", tabindex: "-1", "aria-label": this.a11yLabel, "aria-hidden": this.a11yLabel ? null : 'true', "aria-valuenow": this.value, "aria-valuemin": "0", "aria-valuemax": "100", class: {
+        return (h("span", { key: 'b5994c1a40fef1a165d628e728b1cb8cdff866ea', role: "progressbar", tabindex: "-1", "aria-label": this.a11yLabel, "aria-hidden": this.a11yLabel ? null : 'true', "aria-valuenow": this.value, "aria-valuemin": "0", "aria-valuemax": "100", class: {
                 [`spinner-${this.size}`]: this.size !== 'inline'
-            } }, h("svg", { key: '6a649c21b27b3dbad3c73a71936566e7e9648254', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 48 48" }, h("circle", { key: '3fb75a339ec6e18d0209e9da2cbf650f2dae4420', cx: "24", cy: "24", r: "21.5" }))));
+            } }, h("svg", { key: '0cd336a98d08ac723d34c29895847010f49245fc', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 48 48" }, h("circle", { key: 'c634cc4a518a6733fd5e68859e2154384ac6a1d1', cx: "24", cy: "24", r: "21.5" }))));
     }
     static get style() { return catSpinnerCss; }
 }, [1, "cat-spinner", {

package/dist/components/cat-tab.js

@@ -54,7 +54,7 @@ const CatTab$1 = /*@__PURE__*/ proxyCustomElement(class CatTab extends HTMLEleme
         this.catClick.emit(event);
     }
     render() {
-        return h(Host, { key: 'd74edadf291560111aff4a925b4147b377a24b63' });
+        return h(Host, { key: '954bacd020d1405745d1118cf5b09b9e8ddc93b0' });
     }
     get hostElement() { return this; }
     static get style() { return catTabCss; }

package/dist/components/cat-tabs.js

@@ -5,7 +5,7 @@ import { d as defineCustomElement$4 } from './cat-dropdown2.js';
 import { d as defineCustomElement$3 } from './cat-icon2.js';
 import { d as defineCustomElement$2 } from './cat-spinner2.js';
 
-const catTabsCss = ":host{display:flex;flex-direction:row;box-shadow:inset 0 -1px 0 0 rgb(var(--cat-border-color, 235, 236, 240))}:host([hidden]){display:none}:host([tabs-align=center]){justify-content:center}:host([tabs-align=right]){justify-content:end}:host([tabs-align=justify]) cat-button{flex:1 0 auto}.cat-tab,.cat-tab-more-button{display:inline-flex;flex-direction:column;align-items:center;justify-content:space-between;position:relative;transition:none}.cat-tab::after,.cat-tab-more-button::after{opacity:0;content:\"\";position:absolute;background:currentColor;left:0.75rem;right:0.75rem;bottom:0;height:2px}.cat-tab:hover::after,.cat-tab-more-button:hover::after{opacity:0.25}.cat-tab.cat-tab-active,.cat-tab-more-button.cat-tab-active{font-weight:700;color:rgb(var(--cat-primary-text-active, 2, 99, 113))}.cat-tab.cat-tab-active::after,.cat-tab-more-button.cat-tab-active::after{opacity:1}.cat-tab:first-of-type{margin-left:-0.75rem}.cat-tab:last-of-type{margin-right:-0.75rem}.cat-tab.cat-tab-error{color:rgb(var(--cat-danger-text-active, 174, 42, 10))}nav ul{list-style:none;margin:0;padding:0}.cat-tab-list{display:flex;width:100%}";
+const catTabsCss = ":host{display:flex;flex-direction:row;box-shadow:inset 0 -1px 0 0 rgb(var(--cat-border-color, 235, 236, 240))}:host([hidden]){display:none}:host([tabs-align=center]) .cat-tab-list{justify-content:center}:host([tabs-align=right]) .cat-tab-list{justify-content:end}:host([tabs-align=justify]) cat-button{flex:1 0 auto}.cat-tab,.cat-tab-more-button{display:inline-flex;flex-direction:column;align-items:center;justify-content:space-between;position:relative;transition:none}.cat-tab::after,.cat-tab-more-button::after{opacity:0;content:\"\";position:absolute;background:currentColor;left:0.75rem;right:0.75rem;bottom:0;height:2px}.cat-tab:hover::after,.cat-tab-more-button:hover::after{opacity:0.25}.cat-tab.cat-tab-active,.cat-tab-more-button.cat-tab-active{font-weight:700;color:rgb(var(--cat-primary-text-active, 2, 99, 113))}.cat-tab.cat-tab-active::after,.cat-tab-more-button.cat-tab-active::after{opacity:1}.cat-tab:first-of-type{margin-left:-0.75rem}.cat-tab:last-of-type{margin-right:-0.75rem}.cat-tab.cat-tab-error{color:rgb(var(--cat-danger-text-active, 174, 42, 10))}nav ul{list-style:none;margin:0;padding:0}.cat-tab-list{display:flex;width:100%}";
 
 const CatTabs$1 = /*@__PURE__*/ proxyCustomElement(class CatTabs extends HTMLElement {
     constructor() {
@@ -96,7 +96,7 @@ const CatTabs$1 = /*@__PURE__*/ proxyCustomElement(class CatTabs extends HTMLEle
     }
     render() {
         this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;
-        return (h(Host, { key: '7465fe19c1c67bd0f2c83ae15ed4d31e1e7610b7' }, h("div", { key: '3d0f4c19edd3549d3c9c8f83685b0c852770f594', role: "tablist", class: "cat-tab-list" }, this.tabs.map((tab, index) => {
+        return (h(Host, { key: 'df60c82a35f848e88f75062a56ec258ba79c1891' }, h("div", { key: 'd3d003bce6f44045168e6f32db9eea9a2c5a6c27', role: "tablist", class: "cat-tab-list" }, this.tabs.map((tab, index) => {
             return (h("cat-button", { buttonId: tab.id, part: "tab", class: {
                     'cat-tab': true,
                     'cat-tab-active': tab.id === this.activeTab,

package/dist/components/cat-tabs.js.map

@@ -1 +1 @@
-{"file":"cat-tabs.js","mappings":"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","names":["CatTabs","__stencil_proxyCustomElement","i18n"],"sources":["src/components/cat-tabs/cat-tabs.scss?tag=cat-tabs&encapsulation=shadow","src/components/cat-tabs/cat-tabs.tsx"],"sourcesContent":["@use 'variables' as *;\n@use 'mixins' as *;\n\n:host {\n  display: flex;\n  flex-direction: row;\n  box-shadow: inset 0 -1px 0 0 cat-token('color.ui.border.default');\n}\n\n:host([hidden]) {\n  display: none;\n}\n\n:host([tabs-align='center']) {\n  justify-content: center;\n}\n\n:host([tabs-align='right']) {\n  justify-content: end;\n}\n\n:host([tabs-align='justify']) {\n  cat-button {\n    flex: 1 0 auto;\n  }\n}\n\n.cat-tab,\n.cat-tab-more-button {\n  display: inline-flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: space-between;\n  position: relative;\n  transition: none;\n\n  &::after {\n    opacity: 0;\n    content: '';\n    position: absolute;\n    background: currentColor;\n    left: 0.75rem;\n    right: 0.75rem;\n    bottom: 0;\n    height: 2px;\n  }\n\n  &:hover::after {\n    opacity: 0.25;\n  }\n\n  &.cat-tab-active {\n    font-weight: 700;\n    color: cat-token('color.theme.primary.textActive');\n  }\n\n  &.cat-tab-active::after {\n    opacity: 1;\n  }\n}\n\n.cat-tab {\n  &:first-of-type {\n    margin-left: -0.75rem;\n  }\n\n  &:last-of-type {\n    margin-right: -0.75rem;\n  }\n\n  &.cat-tab-error {\n    color: cat-token('color.theme.danger.textActive');\n  }\n}\n\nnav {\n  ul {\n    list-style: none;\n    margin: 0;\n    padding: 0;\n  }\n}\n\n.cat-tab-list {\n  display: flex;\n  width: 100%;\n}\n","import { Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, State, Watch, h } from '@stencil/core';\nimport { catI18nRegistry as i18n } from '../cat-i18n/cat-i18n-registry';\n\n/**\n * Tabs are used to display multiple panels to be contained within a single\n * window, using tabs as a navigational element.\n *\n * @part tab - The header of the tab.\n * @part more - An optional more button to display additional tabs.\n */\n@Component({\n  tag: 'cat-tabs',\n  styleUrl: 'cat-tabs.scss',\n  shadow: {\n    delegatesFocus: true\n  }\n})\nexport class CatTabs {\n  private mutationObserver?: MutationObserver;\n  private moreDropdown?: HTMLCatDropdownElement;\n  private moreButton?: HTMLCatButtonElement;\n  private readonly resizedObserver = new ResizeObserver(() => this.adjustAdaptiveTabs());\n\n  @Element() hostElement!: HTMLElement;\n\n  @State() tabs: HTMLCatTabElement[] = [];\n  @State() hiddenTabs: HTMLCatTabElement[] = [];\n\n  /**\n   * The ID of the active tab.\n   */\n  @Prop({ mutable: true, reflect: true }) activeTab = '';\n\n  /**\n   * The alignment of the tabs.\n   */\n  @Prop() tabsAlign: 'left' | 'center' | 'right' | 'justify' = 'left';\n\n  /**\n   * Whether the visible items change according to the available space. A 'More' button is used to reveal hidden items.\n   */\n  @Prop() adaptive = false;\n\n  /**\n   * Whether the active tab should always be visible. Applied when adaptive is enabled.\n   * Has less priority than sticky if there is no space to show both.\n   */\n  @Prop() activeTabAlwaysVisible = false;\n\n  componentWillLoad(): void {\n    this.syncTabs();\n  }\n\n  componentDidLoad() {\n    this.mutationObserver = new MutationObserver(\n      mutations => mutations.some(value => value.target.nodeName === 'CAT-TAB') && this.syncTabs()\n    );\n    this.mutationObserver?.observe(this.hostElement, {\n      childList: true,\n      attributes: true,\n      subtree: true\n    });\n\n    if (this.adaptive) {\n      this.resizedObserver.observe(this.hostElement);\n      requestAnimationFrame(() => {\n        this.adjustAdaptiveTabs();\n      });\n    }\n  }\n\n  disconnectedCallback() {\n    this.mutationObserver?.disconnect();\n  }\n\n  @Watch('activeTab')\n  onActiveTabChange(id: string) {\n    const index = this.tabs.findIndex(tab => tab.id === id);\n    this.catChange.emit({ id, index, fromDropdown: !!this.hiddenTabs.find(tab => tab.id === id) });\n  }\n\n  @Listen('keydown')\n  onKeydown(event: KeyboardEvent): void {\n    if (['ArrowDown', 'ArrowUp', 'ArrowRight', 'ArrowLeft'].includes(event.key)) {\n      const elements = this.hostElement.shadowRoot?.querySelectorAll<HTMLCatButtonElement>('cat-button[role=\"tab\"]');\n      const targetElements = Array.from(elements ?? []).filter(button => !button.disabled);\n      const activeElement = this.hostElement.shadowRoot?.activeElement as HTMLCatButtonElement;\n      const activeIdx = activeElement ? targetElements.indexOf(activeElement) : -1;\n      const activeOff = ['ArrowDown', 'ArrowRight'].includes(event.key) ? 1 : -1;\n      const targetIdx = activeIdx < 0 ? 0 : (activeIdx + activeOff + targetElements.length) % targetElements.length;\n      targetElements[targetIdx].doFocus();\n      event.preventDefault();\n    }\n  }\n\n  /**\n   * Activates the tab with the given id.\n   *\n   * @param id The tab id.\n   */\n  @Method()\n  async setActive(id: string): Promise<void> {\n    this.activate(this.tabs.find(tab => tab.id === id));\n  }\n\n  /**\n   * Activates the tab with the given index.\n   *\n   * @param index The tab index.\n   */\n  @Method()\n  async setActiveIndex(index: number): Promise<void> {\n    this.activate(this.tabs[index]);\n  }\n\n  /**\n   * Recalculates visible and hidden adaptive tabs.\n   */\n  @Method()\n  async updateAdaptiveTabs(): Promise<void> {\n    if (this.adaptive) {\n      this.adjustAdaptiveTabs();\n    }\n  }\n\n  /**\n   * Emitted when active tab is changed.\n   */\n  @Event() catChange!: EventEmitter<{ id: string; index: number; fromDropdown: boolean }>;\n\n  render() {\n    this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;\n    return (\n      <Host>\n        <div role=\"tablist\" class=\"cat-tab-list\">\n          {this.tabs.map((tab: HTMLCatTabElement, index: number) => {\n            return (\n              <cat-button\n                buttonId={tab.id}\n                part=\"tab\"\n                class={{\n                  'cat-tab': true,\n                  'cat-tab-active': tab.id === this.activeTab,\n                  'cat-tab-error': tab.error,\n                  'cat-tab-sticky': tab.sticky\n                }}\n                active={tab.id === this.activeTab}\n                color={tab.error ? 'danger' : tab.id === this.activeTab ? 'primary' : 'secondary'}\n                variant=\"text\"\n                icon={tab.icon ? (tab.error ? '$cat:input-error' : tab.icon) : undefined}\n                iconOnly={tab.iconOnly}\n                iconRight={tab.iconRight}\n                url={tab.url}\n                disabled={tab.deactivated}\n                urlTarget={tab.urlTarget}\n                onCatClick={() => this.click(tab)}\n                testId={tab.testId}\n                nativeAttributes={{\n                  ...tab.nativeAttributes,\n                  role: 'tab',\n                  'aria-selected': String(tab.id === this.activeTab),\n                  'aria-setsize': String(this.tabs.length),\n                  'aria-posinset': String(index + 1)\n                }}\n                nativeContentAttributes={{ 'data-text': tab.label }}\n                data-dropdown-no-close\n              >\n                {tab.label}\n              </cat-button>\n            );\n          })}\n          {this.adaptive ? (\n            <cat-dropdown ref={el => (this.moreDropdown = el as HTMLCatDropdownElement)}>\n              <cat-button\n                ref={el => (this.moreButton = el as HTMLCatButtonElement)}\n                class={{\n                  'cat-tab-more-button': true,\n                  'cat-tab-active': !!this.hiddenTabs.find(tab => tab.id === this.activeTab)\n                }}\n                iconRight\n                icon={this.moreDropdown?.isOpen ? 'chevron-up-outlined' : 'chevron-down-outlined'}\n                slot=\"trigger\"\n                part=\"more\"\n                variant=\"text\"\n                color={this.hiddenTabs.find(tab => tab.id === this.activeTab) ? 'primary' : 'secondary'}\n              >\n                {i18n.t('tabs.more')}\n              </cat-button>\n              <nav slot=\"content\">\n                <ul>\n                  {this.hiddenTabs.map((tab: HTMLCatTabElement, index: number) => {\n                    return (\n                      <li>\n                        <cat-button\n                          class=\"cat-nav-item\"\n                          active={tab.id === this.activeTab}\n                          urlTarget={tab.urlTarget}\n                          onCatClick={() => this.click(tab)}\n                          testId={tab.testId}\n                          nativeAttributes={{\n                            ...tab.nativeAttributes,\n                            role: 'tab',\n                            'aria-selected': String(tab.id === this.activeTab),\n                            'aria-setsize': String(this.tabs.length),\n                            'aria-posinset': String(index + 1)\n                          }}\n                          nativeContentAttributes={{ 'data-text': tab.label }}\n                        >\n                          {tab.label}\n                        </cat-button>\n                      </li>\n                    );\n                  })}\n                </ul>\n              </nav>\n            </cat-dropdown>\n          ) : null}\n        </div>\n      </Host>\n    );\n  }\n\n  private adjustAdaptiveTabs() {\n    const tabs = this.hostElement.shadowRoot?.querySelectorAll('.cat-tab') as NodeListOf<HTMLCatButtonElement>;\n    if (!tabs?.length) {\n      return;\n    }\n\n    // show all hidden tabs for correct calculation\n    for (const tab of tabs) {\n      tab.style.display = 'inline-flex';\n    }\n    // show hidden \"more\" button for correct calculation\n    if (this.moreButton) {\n      this.moreButton.style.display = 'inline-flex';\n    }\n\n    const MORE_WIDTH = this.moreButton?.getBoundingClientRect().width || 0;\n    const visibleTabsIndexes: string[] = [];\n    const containerWidth = this.hostElement.clientWidth;\n    let fittingWidth = 0;\n\n    const stickyTabIndex = this.tabs.findIndex(tab => tab.sticky);\n    const stickyTabWidth = tabs.item(stickyTabIndex)?.getBoundingClientRect().width || 0;\n    const stickyTabIsVisible = stickyTabIndex > -1 && stickyTabWidth + MORE_WIDTH <= containerWidth;\n\n    const activeTabIndex = this.tabs.findIndex(tab => tab.id === this.activeTab);\n    const activeTabWidth = tabs.item(activeTabIndex)?.getBoundingClientRect().width || 0;\n    const activeTabIsVisible =\n      this.activeTabAlwaysVisible &&\n      activeTabIndex > -1 &&\n      activeTabWidth + stickyTabWidth + MORE_WIDTH <= containerWidth;\n\n    if (stickyTabIsVisible) {\n      fittingWidth += stickyTabWidth;\n      visibleTabsIndexes.push(stickyTabIndex.toString());\n    }\n\n    if (activeTabIsVisible && stickyTabIndex !== activeTabIndex) {\n      fittingWidth += activeTabWidth;\n      visibleTabsIndexes.push(activeTabIndex.toString());\n    }\n\n    for (const [index, tab] of tabs.entries()) {\n      if ((activeTabIsVisible && index === activeTabIndex) || (stickyTabIsVisible && index === stickyTabIndex)) {\n        continue;\n      }\n\n      const tabWidth = tab.getBoundingClientRect().width;\n\n      if (fittingWidth + tabWidth <= containerWidth) {\n        // tab fits within tabs parent\n        fittingWidth += tabWidth;\n        visibleTabsIndexes.push(index.toString());\n      } else if (fittingWidth + MORE_WIDTH <= containerWidth) {\n        // tab doesn't fit, but more button does\n        break;\n      } else {\n        // tab doesn't fit and more button doesn't fit either\n        // remove last fitting tab so that more button fits\n        visibleTabsIndexes.pop();\n        break;\n      }\n    }\n\n    this.hiddenTabs = this.tabs.filter((_, index) => !visibleTabsIndexes.includes(index.toString()));\n\n    if (this.moreButton) {\n      if (this.tabs.length > visibleTabsIndexes.length) {\n        this.moreButton.style.display = 'inline-flex';\n      } else {\n        this.moreButton.style.display = 'none';\n      }\n    }\n    for (const [index, tab] of tabs.entries()) {\n      if (!visibleTabsIndexes.includes(index.toString())) {\n        tab.style.display = 'none';\n      }\n    }\n  }\n\n  private syncTabs() {\n    this.tabs = Array.from(this.hostElement.querySelectorAll('cat-tab'));\n    this.activeTab = this.activeTab || this.tabs.filter(tab => this.canActivate(tab) && !tab.noActive)[0]?.id;\n    if (this.adaptive) {\n      this.adjustAdaptiveTabs();\n    }\n  }\n\n  private click(tab: HTMLCatTabElement) {\n    if (this.canActivate(tab)) {\n      tab.click();\n      if (!tab.noActive) {\n        this.activate(tab);\n      }\n    }\n  }\n\n  private activate(tab?: HTMLCatTabElement) {\n    if (!tab) {\n      this.activeTab = '';\n    } else if (this.canActivate(tab)) {\n      this.activeTab = tab.id;\n    }\n    if (this.adaptive) {\n      this.adjustAdaptiveTabs();\n    }\n  }\n\n  private canActivate(tab: HTMLCatTabElement) {\n    return !tab.deactivated && !tab.url && tab.id !== this.activeTab;\n  }\n}\n"],"version":3}
+{"file":"cat-tabs.js","mappings":"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","names":["CatTabs","__stencil_proxyCustomElement","i18n"],"sources":["src/components/cat-tabs/cat-tabs.scss?tag=cat-tabs&encapsulation=shadow","src/components/cat-tabs/cat-tabs.tsx"],"sourcesContent":["@use 'variables' as *;\n@use 'mixins' as *;\n\n:host {\n  display: flex;\n  flex-direction: row;\n  box-shadow: inset 0 -1px 0 0 cat-token('color.ui.border.default');\n}\n\n:host([hidden]) {\n  display: none;\n}\n\n:host([tabs-align='center']) {\n  .cat-tab-list {\n    justify-content: center;\n  }\n}\n\n:host([tabs-align='right']) {\n  .cat-tab-list {\n    justify-content: end;\n  }\n}\n\n:host([tabs-align='justify']) {\n  cat-button {\n    flex: 1 0 auto;\n  }\n}\n\n.cat-tab,\n.cat-tab-more-button {\n  display: inline-flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: space-between;\n  position: relative;\n  transition: none;\n\n  &::after {\n    opacity: 0;\n    content: '';\n    position: absolute;\n    background: currentColor;\n    left: 0.75rem;\n    right: 0.75rem;\n    bottom: 0;\n    height: 2px;\n  }\n\n  &:hover::after {\n    opacity: 0.25;\n  }\n\n  &.cat-tab-active {\n    font-weight: 700;\n    color: cat-token('color.theme.primary.textActive');\n  }\n\n  &.cat-tab-active::after {\n    opacity: 1;\n  }\n}\n\n.cat-tab {\n  &:first-of-type {\n    margin-left: -0.75rem;\n  }\n\n  &:last-of-type {\n    margin-right: -0.75rem;\n  }\n\n  &.cat-tab-error {\n    color: cat-token('color.theme.danger.textActive');\n  }\n}\n\nnav {\n  ul {\n    list-style: none;\n    margin: 0;\n    padding: 0;\n  }\n}\n\n.cat-tab-list {\n  display: flex;\n  width: 100%;\n}\n","import { Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, State, Watch, h } from '@stencil/core';\nimport { catI18nRegistry as i18n } from '../cat-i18n/cat-i18n-registry';\n\n/**\n * Tabs are used to display multiple panels to be contained within a single\n * window, using tabs as a navigational element.\n *\n * @part tab - The header of the tab.\n * @part more - An optional more button to display additional tabs.\n */\n@Component({\n  tag: 'cat-tabs',\n  styleUrl: 'cat-tabs.scss',\n  shadow: {\n    delegatesFocus: true\n  }\n})\nexport class CatTabs {\n  private mutationObserver?: MutationObserver;\n  private moreDropdown?: HTMLCatDropdownElement;\n  private moreButton?: HTMLCatButtonElement;\n  private readonly resizedObserver = new ResizeObserver(() => this.adjustAdaptiveTabs());\n\n  @Element() hostElement!: HTMLElement;\n\n  @State() tabs: HTMLCatTabElement[] = [];\n  @State() hiddenTabs: HTMLCatTabElement[] = [];\n\n  /**\n   * The ID of the active tab.\n   */\n  @Prop({ mutable: true, reflect: true }) activeTab = '';\n\n  /**\n   * The alignment of the tabs.\n   */\n  @Prop() tabsAlign: 'left' | 'center' | 'right' | 'justify' = 'left';\n\n  /**\n   * Whether the visible items change according to the available space. A 'More' button is used to reveal hidden items.\n   */\n  @Prop() adaptive = false;\n\n  /**\n   * Whether the active tab should always be visible. Applied when adaptive is enabled.\n   * Has less priority than sticky if there is no space to show both.\n   */\n  @Prop() activeTabAlwaysVisible = false;\n\n  componentWillLoad(): void {\n    this.syncTabs();\n  }\n\n  componentDidLoad() {\n    this.mutationObserver = new MutationObserver(\n      mutations => mutations.some(value => value.target.nodeName === 'CAT-TAB') && this.syncTabs()\n    );\n    this.mutationObserver?.observe(this.hostElement, {\n      childList: true,\n      attributes: true,\n      subtree: true\n    });\n\n    if (this.adaptive) {\n      this.resizedObserver.observe(this.hostElement);\n      requestAnimationFrame(() => {\n        this.adjustAdaptiveTabs();\n      });\n    }\n  }\n\n  disconnectedCallback() {\n    this.mutationObserver?.disconnect();\n  }\n\n  @Watch('activeTab')\n  onActiveTabChange(id: string) {\n    const index = this.tabs.findIndex(tab => tab.id === id);\n    this.catChange.emit({ id, index, fromDropdown: !!this.hiddenTabs.find(tab => tab.id === id) });\n  }\n\n  @Listen('keydown')\n  onKeydown(event: KeyboardEvent): void {\n    if (['ArrowDown', 'ArrowUp', 'ArrowRight', 'ArrowLeft'].includes(event.key)) {\n      const elements = this.hostElement.shadowRoot?.querySelectorAll<HTMLCatButtonElement>('cat-button[role=\"tab\"]');\n      const targetElements = Array.from(elements ?? []).filter(button => !button.disabled);\n      const activeElement = this.hostElement.shadowRoot?.activeElement as HTMLCatButtonElement;\n      const activeIdx = activeElement ? targetElements.indexOf(activeElement) : -1;\n      const activeOff = ['ArrowDown', 'ArrowRight'].includes(event.key) ? 1 : -1;\n      const targetIdx = activeIdx < 0 ? 0 : (activeIdx + activeOff + targetElements.length) % targetElements.length;\n      targetElements[targetIdx].doFocus();\n      event.preventDefault();\n    }\n  }\n\n  /**\n   * Activates the tab with the given id.\n   *\n   * @param id The tab id.\n   */\n  @Method()\n  async setActive(id: string): Promise<void> {\n    this.activate(this.tabs.find(tab => tab.id === id));\n  }\n\n  /**\n   * Activates the tab with the given index.\n   *\n   * @param index The tab index.\n   */\n  @Method()\n  async setActiveIndex(index: number): Promise<void> {\n    this.activate(this.tabs[index]);\n  }\n\n  /**\n   * Recalculates visible and hidden adaptive tabs.\n   */\n  @Method()\n  async updateAdaptiveTabs(): Promise<void> {\n    if (this.adaptive) {\n      this.adjustAdaptiveTabs();\n    }\n  }\n\n  /**\n   * Emitted when active tab is changed.\n   */\n  @Event() catChange!: EventEmitter<{ id: string; index: number; fromDropdown: boolean }>;\n\n  render() {\n    this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;\n    return (\n      <Host>\n        <div role=\"tablist\" class=\"cat-tab-list\">\n          {this.tabs.map((tab: HTMLCatTabElement, index: number) => {\n            return (\n              <cat-button\n                buttonId={tab.id}\n                part=\"tab\"\n                class={{\n                  'cat-tab': true,\n                  'cat-tab-active': tab.id === this.activeTab,\n                  'cat-tab-error': tab.error,\n                  'cat-tab-sticky': tab.sticky\n                }}\n                active={tab.id === this.activeTab}\n                color={tab.error ? 'danger' : tab.id === this.activeTab ? 'primary' : 'secondary'}\n                variant=\"text\"\n                icon={tab.icon ? (tab.error ? '$cat:input-error' : tab.icon) : undefined}\n                iconOnly={tab.iconOnly}\n                iconRight={tab.iconRight}\n                url={tab.url}\n                disabled={tab.deactivated}\n                urlTarget={tab.urlTarget}\n                onCatClick={() => this.click(tab)}\n                testId={tab.testId}\n                nativeAttributes={{\n                  ...tab.nativeAttributes,\n                  role: 'tab',\n                  'aria-selected': String(tab.id === this.activeTab),\n                  'aria-setsize': String(this.tabs.length),\n                  'aria-posinset': String(index + 1)\n                }}\n                nativeContentAttributes={{ 'data-text': tab.label }}\n                data-dropdown-no-close\n              >\n                {tab.label}\n              </cat-button>\n            );\n          })}\n          {this.adaptive ? (\n            <cat-dropdown ref={el => (this.moreDropdown = el as HTMLCatDropdownElement)}>\n              <cat-button\n                ref={el => (this.moreButton = el as HTMLCatButtonElement)}\n                class={{\n                  'cat-tab-more-button': true,\n                  'cat-tab-active': !!this.hiddenTabs.find(tab => tab.id === this.activeTab)\n                }}\n                iconRight\n                icon={this.moreDropdown?.isOpen ? 'chevron-up-outlined' : 'chevron-down-outlined'}\n                slot=\"trigger\"\n                part=\"more\"\n                variant=\"text\"\n                color={this.hiddenTabs.find(tab => tab.id === this.activeTab) ? 'primary' : 'secondary'}\n              >\n                {i18n.t('tabs.more')}\n              </cat-button>\n              <nav slot=\"content\">\n                <ul>\n                  {this.hiddenTabs.map((tab: HTMLCatTabElement, index: number) => {\n                    return (\n                      <li>\n                        <cat-button\n                          class=\"cat-nav-item\"\n                          active={tab.id === this.activeTab}\n                          urlTarget={tab.urlTarget}\n                          onCatClick={() => this.click(tab)}\n                          testId={tab.testId}\n                          nativeAttributes={{\n                            ...tab.nativeAttributes,\n                            role: 'tab',\n                            'aria-selected': String(tab.id === this.activeTab),\n                            'aria-setsize': String(this.tabs.length),\n                            'aria-posinset': String(index + 1)\n                          }}\n                          nativeContentAttributes={{ 'data-text': tab.label }}\n                        >\n                          {tab.label}\n                        </cat-button>\n                      </li>\n                    );\n                  })}\n                </ul>\n              </nav>\n            </cat-dropdown>\n          ) : null}\n        </div>\n      </Host>\n    );\n  }\n\n  private adjustAdaptiveTabs() {\n    const tabs = this.hostElement.shadowRoot?.querySelectorAll('.cat-tab') as NodeListOf<HTMLCatButtonElement>;\n    if (!tabs?.length) {\n      return;\n    }\n\n    // show all hidden tabs for correct calculation\n    for (const tab of tabs) {\n      tab.style.display = 'inline-flex';\n    }\n    // show hidden \"more\" button for correct calculation\n    if (this.moreButton) {\n      this.moreButton.style.display = 'inline-flex';\n    }\n\n    const MORE_WIDTH = this.moreButton?.getBoundingClientRect().width || 0;\n    const visibleTabsIndexes: string[] = [];\n    const containerWidth = this.hostElement.clientWidth;\n    let fittingWidth = 0;\n\n    const stickyTabIndex = this.tabs.findIndex(tab => tab.sticky);\n    const stickyTabWidth = tabs.item(stickyTabIndex)?.getBoundingClientRect().width || 0;\n    const stickyTabIsVisible = stickyTabIndex > -1 && stickyTabWidth + MORE_WIDTH <= containerWidth;\n\n    const activeTabIndex = this.tabs.findIndex(tab => tab.id === this.activeTab);\n    const activeTabWidth = tabs.item(activeTabIndex)?.getBoundingClientRect().width || 0;\n    const activeTabIsVisible =\n      this.activeTabAlwaysVisible &&\n      activeTabIndex > -1 &&\n      activeTabWidth + stickyTabWidth + MORE_WIDTH <= containerWidth;\n\n    if (stickyTabIsVisible) {\n      fittingWidth += stickyTabWidth;\n      visibleTabsIndexes.push(stickyTabIndex.toString());\n    }\n\n    if (activeTabIsVisible && stickyTabIndex !== activeTabIndex) {\n      fittingWidth += activeTabWidth;\n      visibleTabsIndexes.push(activeTabIndex.toString());\n    }\n\n    for (const [index, tab] of tabs.entries()) {\n      if ((activeTabIsVisible && index === activeTabIndex) || (stickyTabIsVisible && index === stickyTabIndex)) {\n        continue;\n      }\n\n      const tabWidth = tab.getBoundingClientRect().width;\n\n      if (fittingWidth + tabWidth <= containerWidth) {\n        // tab fits within tabs parent\n        fittingWidth += tabWidth;\n        visibleTabsIndexes.push(index.toString());\n      } else if (fittingWidth + MORE_WIDTH <= containerWidth) {\n        // tab doesn't fit, but more button does\n        break;\n      } else {\n        // tab doesn't fit and more button doesn't fit either\n        // remove last fitting tab so that more button fits\n        visibleTabsIndexes.pop();\n        break;\n      }\n    }\n\n    this.hiddenTabs = this.tabs.filter((_, index) => !visibleTabsIndexes.includes(index.toString()));\n\n    if (this.moreButton) {\n      if (this.tabs.length > visibleTabsIndexes.length) {\n        this.moreButton.style.display = 'inline-flex';\n      } else {\n        this.moreButton.style.display = 'none';\n      }\n    }\n    for (const [index, tab] of tabs.entries()) {\n      if (!visibleTabsIndexes.includes(index.toString())) {\n        tab.style.display = 'none';\n      }\n    }\n  }\n\n  private syncTabs() {\n    this.tabs = Array.from(this.hostElement.querySelectorAll('cat-tab'));\n    this.activeTab = this.activeTab || this.tabs.filter(tab => this.canActivate(tab) && !tab.noActive)[0]?.id;\n    if (this.adaptive) {\n      this.adjustAdaptiveTabs();\n    }\n  }\n\n  private click(tab: HTMLCatTabElement) {\n    if (this.canActivate(tab)) {\n      tab.click();\n      if (!tab.noActive) {\n        this.activate(tab);\n      }\n    }\n  }\n\n  private activate(tab?: HTMLCatTabElement) {\n    if (!tab) {\n      this.activeTab = '';\n    } else if (this.canActivate(tab)) {\n      this.activeTab = tab.id;\n    }\n    if (this.adaptive) {\n      this.adjustAdaptiveTabs();\n    }\n  }\n\n  private canActivate(tab: HTMLCatTabElement) {\n    return !tab.deactivated && !tab.url && tab.id !== this.activeTab;\n  }\n}\n"],"version":3}

package/dist/components/cat-tag.js

@@ -101,7 +101,7 @@ const CatTag$1 = /*@__PURE__*/ proxyCustomElement(class CatTag extends HTMLEleme
     }
     render() {
         this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;
-        return (h(Host, { key: '5eb9aa6c80d79cdba6bd20ae0b79638c0861ef0e' }, h("div", { key: 'b0bd4dc83d51bbd27fef6937cce2fbea8208f9c9', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (h("label", { key: 'feabda32a6a56ce3f4f26022c8f30d7756ad2259', htmlFor: `tags-${this.id}-input`, part: "label" }, h("span", { key: '98f9bf32af3a5b3bda34782c74b82fb9605a4b5a', class: "label-wrapper" }, (this.hasSlottedLabel && h("slot", { key: 'a0cedfdf881ef9fcf607aae4152775c91910674e', name: "label" })) || this.label, h("div", { key: '946141977311b9c0f5b8f6611f0e4c129e10f453', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (h("span", { key: '59ed9539872749595446aec9b54c6b1d64b00d2c', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (h("span", { key: '30b537fb9b3109f7725cc4442f5e25ef914497e0', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.required'), ")"))))))), h("div", { key: '17236d61b9e2283c5aa02a4655e819f78ae74c18', class: { 'input-wrapper': true, 'input-disabled': this.disabled, 'input-invalid': this.invalid } }, this.value?.map(value => (h("div", { class: "tag-pill" }, h("span", null, value), !this.disabled && (h("cat-button", { size: "xs", variant: "text", icon: "$cat:select-clear", iconOnly: true, a11yLabel: catI18nRegistry.t('select.deselect'), onClick: () => this.deselect(value), tabIndex: -1 }))))), h("div", { key: 'f7e629b2ea2fe84d9388c5f8f935cce18608ff26', class: "input-inner-wrapper" }, h("input", { key: '40aead3498b0c43515d98343865e64140e160559', "data-test": this.testId, ...this.nativeAttributes, part: "input", id: `tags-${this.id}-input`, class: "tags-input", role: "combobox", ref: el => (this.input = el), "aria-invalid": this.invalid ? 'true' : undefined, "aria-describedby": this.hasHint ? this.id + '-hint' : undefined, onInput: this.onInput.bind(this), onBlur: this.onBlur.bind(this), placeholder: this.placeholder, disabled: this.disabled }), this.clearable && !this.disabled && (this.value?.length ?? 0) > 0 && (h("cat-button", { key: 'edac732f3efc58c2814a40f9f5c8a5ae2ff9c6e3', class: "clearable", icon: "$cat:input-close", "icon-only": "true", size: "s", variant: "text", "a11y-label": catI18nRegistry.t('input.clear'), onClick: this.clear.bind(this), "data-dropdown-no-close": true })), this.invalid && h("cat-icon", { key: '831e9e21c8e0426c51da92ca958071b73e781e95', icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l" }))), this.hasHint && (h(CatFormHint, { key: '4587178ec4e9d41d2800d83b82b0a87f824be666', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }), errorMap: this.errorMap }))));
+        return (h(Host, { key: '334f8a2d604df123adb018f31b5528040d65180c' }, h("div", { key: '0140867da437b576a9b5593601abf65634badafe', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (h("label", { key: '9c2284a03aa281bd1c5060684909afffcc3be519', htmlFor: `tags-${this.id}-input`, part: "label" }, h("span", { key: '2e8bab18e8c5b776ab7a7af2805a48f25380ca14', class: "label-wrapper" }, (this.hasSlottedLabel && h("slot", { key: '285417cf1427d6bfab28f8e79d03d7ebb4a5581a', name: "label" })) || this.label, h("div", { key: '54284d1f7c2d39b3686471a77fe81cdff5a7ba6d', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (h("span", { key: '2bbb1dd5fbf63c3a11e5072cedd0016fb52a8bbf', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (h("span", { key: 'b800283d2560b788c5de2186bb0657612bf5902b', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.required'), ")"))))))), h("div", { key: '710a3d1df041fabfc099248a10fb581dc29867e8', class: { 'input-wrapper': true, 'input-disabled': this.disabled, 'input-invalid': this.invalid } }, this.value?.map(value => (h("div", { class: "tag-pill" }, h("span", null, value), !this.disabled && (h("cat-button", { size: "xs", variant: "text", icon: "$cat:select-clear", iconOnly: true, a11yLabel: catI18nRegistry.t('select.deselect'), onClick: () => this.deselect(value), tabIndex: -1 }))))), h("div", { key: '8201854379fedd97152173c5383eeba5a93ff43e', class: "input-inner-wrapper" }, h("input", { key: '11ca4d750d8f36560e5ff1a2a336f83a481dd3be', "data-test": this.testId, ...this.nativeAttributes, part: "input", id: `tags-${this.id}-input`, class: "tags-input", role: "combobox", ref: el => (this.input = el), "aria-invalid": this.invalid ? 'true' : undefined, "aria-describedby": this.hasHint ? this.id + '-hint' : undefined, onInput: this.onInput.bind(this), onBlur: this.onBlur.bind(this), placeholder: this.placeholder, disabled: this.disabled }), this.clearable && !this.disabled && (this.value?.length ?? 0) > 0 && (h("cat-button", { key: 'af93bc6cdc41b7bfaacef19549093bf8dc85e000', class: "clearable", icon: "$cat:input-close", "icon-only": "true", size: "s", variant: "text", "a11y-label": catI18nRegistry.t('input.clear'), onClick: this.clear.bind(this), "data-dropdown-no-close": true })), this.invalid && h("cat-icon", { key: '5df20d3094317ed268588a1cde317243e1390855', icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l" }))), this.hasHint && (h(CatFormHint, { key: 'c3fafb4299fc29ce029c92b34bc54df35a33ffb3', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }), errorMap: this.errorMap }))));
     }
     get hasHint() {
         return !!this.hint || !!this.hasSlottedHint || this.invalid;

package/dist/components/cat-textarea.js

@@ -111,15 +111,15 @@ const CatTextarea$1 = /*@__PURE__*/ proxyCustomElement(class CatTextarea extends
     }
     render() {
         this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;
-        return (h(Host, { key: 'df2bbdb2be8f1af6dd9a5d38211b0beac1486f22' }, h("div", { key: '36f4733a1b0de07c7fe76726559c54d6bf0b0432', class: {
+        return (h(Host, { key: 'ba2d56e2d7fcb9d4af66a24d5476132e2ebefcf4' }, h("div", { key: 'e60bdc9b54fb1de1ae27f1e93caa6802180a7b4a', class: {
                 'textarea-field': true,
                 'textarea-horizontal': this.horizontal ?? this.fallbackHorizontal ?? false
-            } }, h("div", { key: '2bde19fb319b809633677f67209102638551d16d', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (h("label", { key: '42cc3e519577b894939ce785727146f6321b643d', htmlFor: this.id, part: "label" }, h("span", { key: '3e99781d3715e74b04cc3cfdf8a8b4843e6f9e54', class: "label-wrapper" }, (this.hasSlottedLabel && h("slot", { key: '1041fac3a278327adbc3b65b1b5407e8465d9161', name: "label" })) || this.label, h("div", { key: 'eafd119e15dde304bba9ea4ae1a69f1e6d42ab76', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (h("span", { key: 'b0ad4ddd4b4076eb665182ce944c87336448b0e3', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (h("span", { key: 'b6c7fa413eafe1d54ee7256dfe4eb917f3a45292', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.required'), ")")), (this.maxLength || this.hasSlottedCounter) && (h("div", { key: '4a0200d29ab6672663a70a0bec80b4917cd3448e', class: "label-character-count", "aria-hidden": "true" }, this.hasSlottedCounter ? (h("slot", { name: "counter" })) : (`${this.value?.length ?? 0}/${this.maxLength}`)))))))), h("div", { key: 'cba0204f1e172d1638b72f0f83eba26a69aedfe7', class: "textarea-container" }, h("div", { key: '3098a2f1bfa160a9764d55ae08cf575a2c347006', class: {
+            } }, h("div", { key: '3611f3a9830ed34c86c3f165f01905f4d227b0be', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (h("label", { key: '77c4783b59f3d6965f0c01328db36d5c8518c0f6', htmlFor: this.id, part: "label" }, h("span", { key: 'd0df4164caa5f19838fdb5acfa5561fc95fdb1fe', class: "label-wrapper" }, (this.hasSlottedLabel && h("slot", { key: 'e958ec958b57ce4543f1178d8cfcb93b056a30d8', name: "label" })) || this.label, h("div", { key: '76f871899822b2bb400be7e88d4e08353c4edbe3', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (h("span", { key: 'd14451a2e39a13a8918892cd11645208c4cdc680', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (h("span", { key: 'b679e94fe20aeecc64f60bd3ecc2952b33639039', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.required'), ")")), (this.maxLength || this.hasSlottedCounter) && (h("div", { key: '3dce07d25a0aeddc7b91f8f8426cd21b7bd60c7e', class: "label-character-count", "aria-hidden": "true" }, this.hasSlottedCounter ? (h("slot", { name: "counter" })) : (`${this.value?.length ?? 0}/${this.maxLength}`)))))))), h("div", { key: '008b6ebfe6dca48aa581d249310c2dda8ba9dba1', class: "textarea-container" }, h("div", { key: 'ff921daa8769f7407e72b4519e31eb6570301b4d', class: {
                 'textarea-wrapper': true,
                 'textarea-readonly': this.readonly,
                 'textarea-disabled': this.disabled,
                 'textarea-invalid': this.invalid
-            } }, h("textarea", { key: '921a8bcfffdd27dabf2846320e350b8d582bddbb', "data-test": this.testId, ...this.nativeAttributes, part: "textarea", ref: el => (this.textarea = el), id: this.id, disabled: this.disabled, autocomplete: this.autoComplete, maxlength: this.maxLength, minlength: this.minLength, name: this.name, placeholder: this.placeholder, readonly: this.readonly, required: this.required, rows: this.rows, value: this.value, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-invalid": this.invalid ? 'true' : undefined, "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), this.invalid && (h("cat-icon", { key: '4f6b28c10e30401acbb392d15c7e7dc00bd9797e', icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l", onClick: () => this.textarea.focus() }))), this.hasHint && (h(CatFormHint, { key: '43ce202b036f9529d642ec528db62b9fde6d74e8', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }), errorMap: this.errorMap }))))));
+            } }, h("textarea", { key: '3ea5625a1f67ab98b4975b8f9095f33091d18455', "data-test": this.testId, ...this.nativeAttributes, part: "textarea", ref: el => (this.textarea = el), id: this.id, disabled: this.disabled, autocomplete: this.autoComplete, maxlength: this.maxLength, minlength: this.minLength, name: this.name, placeholder: this.placeholder, readonly: this.readonly, required: this.required, rows: this.rows, value: this.value, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-invalid": this.invalid ? 'true' : undefined, "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), this.invalid && (h("cat-icon", { key: '351dc18bfa3aaaa0d0cc5cf585b48334d0cf8cc9', icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l", onClick: () => this.textarea.focus() }))), this.hasHint && (h(CatFormHint, { key: '6e469529e9551d19f523f0fe9f23abc92855e92c', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }), errorMap: this.errorMap }))))));
     }
     get hasHint() {
         return !!this.hint || !!this.hasSlottedHint || this.invalid;

package/dist/components/cat-time.js

@@ -213,14 +213,14 @@ const CatTime$1 = /*@__PURE__*/ proxyCustomElement(class CatTime extends HTMLEle
     }
     render() {
         this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;
-        return (h(Host, { key: 'e97c59467d5b8fafc2d669d7d53b68a192ec1bf9' }, h("cat-input", { key: 'b7262a8ca4f20ee50ead2d36d823a835f6ae1a67', class: "cat-time-input", ref: el => (this.input = el), requiredMarker: this.requiredMarker, horizontal: this.horizontal ?? this.fallbackHorizontal, autoComplete: this.autoComplete, clearable: this.clearable, disabled: this.disabled, hint: this.hint, icon: this.icon, iconRight: this.iconRight, identifier: this.identifier, label: this.label, labelHidden: this.labelHidden, name: this.name, placeholder: this.placeholder, textPrefix: this.textPrefix, textSuffix: this.textSuffix, readonly: this.readonly, required: this.required, value: this.format(this.selectionTime, false), errors: this.errors, errorUpdate: this.errorUpdate, testId: this.testId, nativeAttributes: this.nativeAttributes, timeMaskOptions: this.timeMaskOptions, onCatFocus: e => this.catFocus.emit(e.detail), onCatBlur: e => this.onInputBlur(e.detail) }, h("span", { key: 'cde857253e5caa082367fca8acf598eb3fbcdc3d', slot: "label" }, this.hasSlottedLabel && h("slot", { key: 'd2c14ddcea08bdbf7c3693b4d4414c4720ab073c', name: "label" }), !this.hasSlottedLabel && this.label, h("span", { key: '66e1847bb5cbbd5c038a06b2f700021cc8f19db7', class: "label-aria" }, " (HH:mm)")), h("div", { key: '8155b1601a895c7596f12d2d8d36ef0b4195791d', slot: "addon", class: "cat-time-addon" }, this.locale.timeFormat === '12' && (h("cat-button", { key: '4e42649a84b347c5f4c07e7ab97c5740fdaeebbd', class: "cat-time-format", disabled: this.disabled || this.readonly, onCatClick: () => this.toggleAm() }, this.isAm ? this.localizedDayPeriods.am : this.localizedDayPeriods.pm)), h("cat-dropdown", { key: '72c398704e4170f4b14fb00b1bf1adbddc79ad9a', slot: "addon", placement: this.placement }, h("cat-button", { key: 'd355e258dd3fc0f383dca2000835c73a4e793805', slot: "trigger", class: "cat-time-toggle", disabled: this.disabled || this.readonly, icon: "$cat:timepicker-clock", iconOnly: true, a11yLabel: this.selectionTime ? `${this.locale.change}, ${this.format(this.selectionTime)}` : this.locale.choose }), h("nav", { key: '741cb059b2ed3eb24b4786d5c6649ab92d590830', slot: "content", class: "cat-nav" }, h("ul", { key: 'abddf3e0980567866616cd2c9df44826bbf6202c' }, this.timeArray().map(time => {
+        return (h(Host, { key: 'c900a10f9992512537bb54a55f380148c698bd2d' }, h("cat-input", { key: 'f6447d6a18225762b6adc85955584d4710a9ffa5', class: "cat-time-input", ref: el => (this.input = el), requiredMarker: this.requiredMarker, horizontal: this.horizontal ?? this.fallbackHorizontal, autoComplete: this.autoComplete, clearable: this.clearable, disabled: this.disabled, hint: this.hint, icon: this.icon, iconRight: this.iconRight, identifier: this.identifier, label: this.label, labelHidden: this.labelHidden, name: this.name, placeholder: this.placeholder, textPrefix: this.textPrefix, textSuffix: this.textSuffix, readonly: this.readonly, required: this.required, value: this.format(this.selectionTime, false), errors: this.errors, errorUpdate: this.errorUpdate, testId: this.testId, nativeAttributes: this.nativeAttributes, timeMaskOptions: this.timeMaskOptions, onCatFocus: e => this.catFocus.emit(e.detail), onCatBlur: e => this.onInputBlur(e.detail) }, h("span", { key: '328134e94616b73309294b1dbd60d9978b1fe32b', slot: "label" }, this.hasSlottedLabel && h("slot", { key: 'c7e48d1a65631ac9f05b30e6e03706771617a9eb', name: "label" }), !this.hasSlottedLabel && this.label, h("span", { key: '59dd274d4039d8ce890b95dd6f9efdc4fc68b456', class: "label-aria" }, " (HH:mm)")), h("div", { key: '962771fb4390695dfa17eef88cde5299dff060df', slot: "addon", class: "cat-time-addon" }, this.locale.timeFormat === '12' && (h("cat-button", { key: 'a0fa293b5c430efb3ee873da2f8c6ee9f6e22935', class: "cat-time-format", disabled: this.disabled || this.readonly, onCatClick: () => this.toggleAm() }, this.isAm ? this.localizedDayPeriods.am : this.localizedDayPeriods.pm)), h("cat-dropdown", { key: '14d7f7b5063d5f74d6f1272742badce87ed150ac', slot: "addon", placement: this.placement }, h("cat-button", { key: '1ae784a0d45b0ec92f57a1845a2c7f04097e6d3b', slot: "trigger", class: "cat-time-toggle", disabled: this.disabled || this.readonly, icon: "$cat:timepicker-clock", iconOnly: true, a11yLabel: this.selectionTime ? `${this.locale.change}, ${this.format(this.selectionTime)}` : this.locale.choose }), h("nav", { key: 'bfc501e88cd1941fffc3d10b8aed69d830c9bec6', slot: "content", class: "cat-nav" }, h("ul", { key: 'd65978850e0416d8de748293dcf12397b531fc54' }, this.timeArray().map(time => {
             const isoTime = formatIso(time);
             const disabled = isBefore(time, this.min ?? null) || isAfter(time, this.max ?? null);
             return (h("li", null, h("cat-button", { class: {
                     'cat-nav-item': true,
                     'time-disabled': disabled
                 }, disabled: disabled, active: isoTime === this.value, color: isoTime === this.value ? 'primary' : 'secondary', variant: isoTime === this.value ? 'filled' : 'outlined', onCatClick: () => this.select(time), "data-time": isoTime }, this.format(time))));
-        }))))), this.hasSlottedHint && (h("span", { key: '3d194dd408de4efe247e4f48c0aba2e4c40038c9', slot: "hint" }, h("slot", { key: '27e14b7a27643229e8bfea13081de35acab79b2a', name: "hint" }))))));
+        }))))), this.hasSlottedHint && (h("span", { key: 'b34b48f7db86956f9f9211a80ba7f0afb0dba10d', slot: "hint" }, h("slot", { key: 'd170ddd7ebe8a75af7b2410771d30bcc4c23bceb', name: "hint" }))))));
     }
     timeArray() {
         const result = [];

package/dist/components/cat-toggle.js

@@ -80,13 +80,13 @@ const CatToggle$1 = /*@__PURE__*/ proxyCustomElement(class CatToggle extends HTM
     }
     render() {
         this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;
-        return (h(Host, { key: '4648a8de33b6a63ba94cd5fd15b6e3e65986470d' }, h("label", { key: '063aa2a20504db693e4ae6d96733f96217dcc4b4', htmlFor: this.id, class: {
+        return (h(Host, { key: '7285035e8798acd7e31d9f244185f66dfd1e8ff2' }, h("label", { key: 'fcfa457a536a826b113493f2851e4fb92336f191', htmlFor: this.id, class: {
                 'is-hidden': this.labelHidden,
                 'is-disabled': this.disabled,
                 'label-left': this.labelLeft,
                 'align-center': this.alignment === 'center',
                 'align-end': this.alignment === 'bottom'
-            } }, h("input", { key: 'd7ed53b6668b5335621e92fe648f28d34e43d371', "data-test": this.testId, ...this.nativeAttributes, part: "input", ref: el => (this.input = el), id: this.id, type: "checkbox", name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, class: "form-check-input", role: "switch", onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), h("span", { key: '852f811c47488c5ee7ba5536c79c82502dd18f92', class: "toggle" }), h("span", { key: '00efe1901a1b2ad93b24362124c7d5b604ca62a9', class: "label", part: "label" }, (this.hasSlottedLabel && h("slot", { key: '039e0fdcd80e110bb1b2ab6ac74472ff9d2e82f4', name: "label" })) || this.label)), this.hasHint && (h("div", { key: '4c59d7a015ac1d0c9430e569244ba20bd71886e2', class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, h("div", { key: '53f611eaded0a9048c79d82a444144c104589208', class: "toggle-placeholder" }), h(CatFormHint, { key: '250ebfbbbeafe28c1e47c857c6af1ee2429edcb5', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }) })))));
+            } }, h("input", { key: 'db247c0b593b85237fa9f0c369d706d6fa16d7ec', "data-test": this.testId, ...this.nativeAttributes, part: "input", ref: el => (this.input = el), id: this.id, type: "checkbox", name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, class: "form-check-input", role: "switch", onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), h("span", { key: 'fa4934e1d6f40378b0d2b3aa3e08c1c1444579d3', class: "toggle" }), h("span", { key: 'e4c888660de8acf4ca9c0bf093eb9546bd67e994', class: "label", part: "label" }, (this.hasSlottedLabel && h("slot", { key: 'c2dbaa736eb123c5adcc9e0cda6cef89bf6fd4b8', name: "label" })) || this.label)), this.hasHint && (h("div", { key: '087543ee1d86ccc4739d8f33e5cf4de419818d43', class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, h("div", { key: '424513a88e130972ec5a6b64c7eb8639691258c2', class: "toggle-placeholder" }), h(CatFormHint, { key: 'a1c87e7ce6ed636f69760dbdbb4f54688b0fce4e', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }) })))));
     }
     get hasHint() {
         return !!this.hint || !!this.hasSlottedHint;

package/dist/components/cat-tooltip.js

@@ -75,12 +75,12 @@ const CatTooltip$1 = /*@__PURE__*/ proxyCustomElement(class CatTooltip extends H
         this.hideTooltip();
     }
     render() {
-        return (h(Host, { key: '48ac6350d679c11d238d55442d6455fc38eb44d7' }, h("slot", { key: '2ecd767bae2429800d94707498dd0d292b0bf5b4' }), h("div", { key: 'c59512dbe2c57622f7827aa143230dc1c5046281', ref: el => (this.tooltip = el), id: this.id, role: "tooltip", "aria-hidden": !this.open, "aria-live": this.open ? 'polite' : 'off', class: {
+        return (h(Host, { key: '8f34e0ba58b9cf70b4764914d5f3edd36ed42c10' }, h("slot", { key: 'd053bf106d2884336c1cdeb55215bd62dbd6eae7' }), h("div", { key: '9f310741fd56f1e4441c45125010176621da0c59', ref: el => (this.tooltip = el), id: this.id, role: "tooltip", "aria-hidden": !this.open, "aria-live": this.open ? 'polite' : 'off', class: {
                 tooltip: true,
                 'tooltip-hidden': this.inactive,
                 'tooltip-round': this.round,
                 [`tooltip-${this.size}`]: Boolean(this.size)
-            } }, h("slot", { key: 'a0bdd025ca40adac969daef4a0b06b9aa8452fac', name: "content" }, h("p", { key: '83786352e3219af4e7cde38a1c8247042d44c66a' }, this.content)))));
+            } }, h("slot", { key: 'c99bd5cee9a1961d39a20c2049ee43675efc4b67', name: "content" }, h("p", { key: '66051fb6e03a9292a7c829b53162d307af2a914e' }, this.content)))));
     }
     addListeners() {
         this.trigger?.addEventListener('focusin', this.boundShowListener);