@haiilo/catalyst 14.5.1 → 14.5.3

package/dist/esm/cat-alert_32.entry.js

@@ -42,7 +42,7 @@ const CatAlert = class {
         setAttributeDefault(this, 'role', this.mapRole.get(this.color));
     }
     render() {
-        return (h(Host, { key: '69fa5ac520b7473f3e64c7aa08f1f706a0e84777' }, !this.noIcon && h("cat-icon", { key: '6350faf2c7748f5366040eb861b999adb094f746', size: "l", icon: this.icon || this.mapIcon.get(this.color) }), h("div", { key: '566add2aa7d14f4118104a1f1ed43ae7600cd0b0', class: "content" }, h("slot", { key: '18cb577bd42e5386ddac4a6226426bcab9260415' }))));
+        return (h(Host, { key: '02844ee6d6dc5d365bee542ee873280b2b7040fc' }, !this.noIcon && h("cat-icon", { key: 'e3497771224d89279b9d4d1f4d83014066504ede', size: "l", icon: this.icon || this.mapIcon.get(this.color) }), h("div", { key: '219d03b29ec237228366c2df596c148429685483', class: "content" }, h("slot", { key: '13a11b580fe9a6ac0707e49120809e97e3b05cd5' }))));
     }
     get hostElement() { return getElement(this); }
 };
@@ -323,7 +323,7 @@ const CatBadge = class {
         }
     }
     render() {
-        return (h(Host, { key: 'b11c4ad289bf67783fe98e9e6b9ac0d390fc9cdb', "data-icon-badge": this.isIconBadge ? this.size : null }, this.hasPrefixIcon ? h("cat-icon", { icon: this.icon, size: this.iconSize, part: "prefix" }) : null, this.isIconBadge ? (h("cat-icon", { icon: this.icon, size: this.iconSize, class: "icon-only" })) : (h("slot", null)), this.hasSuffixIcon ? h("cat-icon", { icon: this.icon, size: this.iconSize, part: "prefix" }) : null));
+        return (h(Host, { key: '5c22fb2216adbb84af5bbcbc1cdc97a4fc2e7f2a', "data-icon-badge": this.isIconBadge ? this.size : null }, this.hasPrefixIcon ? h("cat-icon", { icon: this.icon, size: this.iconSize, part: "prefix" }) : null, this.isIconBadge ? (h("cat-icon", { icon: this.icon, size: this.iconSize, class: "icon-only" })) : (h("slot", null)), this.hasSuffixIcon ? h("cat-icon", { icon: this.icon, size: this.iconSize, part: "prefix" }) : null));
     }
     get hostElement() { return getElement(this); }
     static get watchers() { return {
@@ -555,7 +555,7 @@ const CatButtonGroup = class {
         this.buttonElements = [];
     }
     render() {
-        return (h(Host, { key: '3bf39dc84ed4e47a328927f937eb956ace5f6f71', role: "group", "aria-label": this.a11yLabel }, h("slot", { key: '843ae7ed619e04239a405250cd83f83e694bfde9', onSlotchange: this.onSlotChange.bind(this) })));
+        return (h(Host, { key: 'a34efc8e64ae1322adc48696bf2c04cc2d1e429c', role: "group", "aria-label": this.a11yLabel }, h("slot", { key: '9149f38be769cef00801abacbb03dd0c95850f12', onSlotchange: this.onSlotChange.bind(this) })));
     }
     onSlotChange() {
         this.buttonElements = Array.from(this.hostElement.querySelectorAll(':scope > cat-button, :scope > cat-tooltip > cat-button, :scope > cat-dropdown cat-button[slot="trigger"]'));
@@ -576,7 +576,7 @@ const CatCard = class {
         this.catLoad = createEvent(this, "catLoad");
     }
     render() {
-        return h("slot", { key: '462ccb0dce9a3bb536ff1f69caf8a04c02565344' });
+        return h("slot", { key: '2ddd44a7ce4d8c664f1161710a7a65461c37875f' });
     }
     componentDidLoad() {
         this.catLoad.emit();
@@ -692,13 +692,13 @@ const CatCheckbox = class {
         this.input.blur();
     }
     render() {
-        return (h(Host, { key: 'eb33a26363bc39edc83c1b1312c85f805e8e3894' }, h("label", { key: 'f8094c4c8859d30a4fe6096efad161a4503b2896', htmlFor: this.id, class: {
+        return (h(Host, { key: '3b747366d141c2e3c678f33841eca2983b9161c9' }, h("label", { key: '2ee8575df8a269ef821a980add768a668d3e208b', 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: '02c15b7985af4252f45ff04ebd977e3c09883949', "data-test": this.testId, ...this.nativeAttributes, part: "input", ref: el => (this.input = el), id: this.id, type: "checkbox", name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, indeterminate: this.indeterminate, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), h("span", { key: 'b4a30c339f54ab5ae1b7f9e31f6d0c409c6c2613', class: "box", "aria-hidden": "true" }, h("svg", { key: 'e3d0faed8b2d2d59fab9b8a2c011dd4d6aa5b338', class: "check", viewBox: "0 0 12 10" }, h("polyline", { key: '7f1d041823ce9ed4c4b1496b61de9c5767979ff7', points: "1.5 6 4.5 9 10.5 1" })), h("svg", { key: 'dd636bd06ab6cf5918edaacb63091d9eb09ae0af', class: "dash", viewBox: "0 0 12 10" }, h("polyline", { key: 'b46f113aae6d0e8e3bb5cd1a2740a7d7422ea749', points: "1.5 5 10.5 5" }))), h("span", { key: 'c0266346a2d7b22f8e18dba57737cd098217b08a', class: { label: true, 'label-wrapper': !this.hasSlottedLabel }, part: "label" }, (this.hasSlottedLabel && h("slot", { key: '2416235aa2a02df58f4d96337215725e426a729a', name: "label" })) || this.label, h("span", { key: '4da54bdb128f377225732f2c7d69bf205d5098c1', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (h("span", { key: '70b0dfdf0c4210394a09adb83866d6566a1df025', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (h("span", { key: 'a49f720ae915fd3054748184d89fbe9c784cc730', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.required'), ")"))))), this.hasHint && (h("div", { key: '10630551393491643e19ff001840aed935f78645', class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, h("div", { key: 'f4236a3a4c2f573bcd77311ed009e4d09ffb73af', class: "box-placeholder" }), h(CatFormHint, { key: '85c1227154f23e6e52a36fe7184fcb1ab999160e', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }) })))));
+            } }, h("input", { key: 'aad1de3b8d7dd4eeb0e72166ba1decd79bd25f18', "data-test": this.testId, ...this.nativeAttributes, part: "input", ref: el => (this.input = el), id: this.id, type: "checkbox", name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, indeterminate: this.indeterminate, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), h("span", { key: '387095d0a3fdb1820fdc7d3111c9475792865255', class: "box", "aria-hidden": "true" }, h("svg", { key: '94bc42f4729c8ac50d786029d1a2b4446371b1dd', class: "check", viewBox: "0 0 12 10" }, h("polyline", { key: 'b6c0c742108523bafa656aad76fde132748f673d', points: "1.5 6 4.5 9 10.5 1" })), h("svg", { key: '51d990d4002736670ea32bf9ee10f90918ea6856', class: "dash", viewBox: "0 0 12 10" }, h("polyline", { key: '882eb8cf57188490f0b57a052908c52780c708a3', points: "1.5 5 10.5 5" }))), h("span", { key: '36df32838873f91f1b86ed93f5f20e6f7fba8e83', class: { label: true, 'label-wrapper': !this.hasSlottedLabel }, part: "label" }, (this.hasSlottedLabel && h("slot", { key: '568163747405bb172ac389293d1e02eb586d2afe', name: "label" })) || this.label, h("span", { key: '1a95817d8a270fcfba8cdbd20832142358cf793c', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (h("span", { key: '59b897e56020aedf0dc7f5d847b16cb4059505d5', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (h("span", { key: '3482694fe72455fb0e0d96d7760cdd01044cb45c', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.required'), ")"))))), this.hasHint && (h("div", { key: 'f4d2064c5e48dc7131838e62baa941899fa7e3fc', class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, h("div", { key: '1909aa219d7476643da16e2985c5763c770ef382', class: "box-placeholder" }), h(CatFormHint, { key: 'bd850f88c63eadfc4f1082d71c0781db8cb558b6', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }) })))));
     }
     get hasHint() {
         return !!this.hint || !!this.hasSlottedHint;
@@ -935,14 +935,14 @@ const CatDate = class {
     }
     render() {
         this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;
-        return (h(Host, { key: '664187eb3780f94f61b463088cf6a056a3107af5' }, h("cat-input", { key: '42e6d9c9edff8a699c81d98873164eb755aeaeab', class: "cat-date-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, labelHidden: this.labelHidden, name: this.name, placeholder: this.placeholder, textPrefix: this.textPrefix, textSuffix: this.textSuffix, readonly: this.readonly, required: this.required, errors: this.errors, errorUpdate: this.errorUpdate, testId: this.testId, nativeAttributes: this.nativeAttributes, value: this.inputValue, dateMaskOptions: this.dateMaskOptions, onCatFocus: e => {
+        return (h(Host, { key: 'b579a4b31629206532b1a91ea9dd9b2634f0536b' }, h("cat-input", { key: '55c5c4dfaaa13d229e74d83569b6e99e7a5ce146', class: "cat-date-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, labelHidden: this.labelHidden, name: this.name, placeholder: this.placeholder, textPrefix: this.textPrefix, textSuffix: this.textSuffix, readonly: this.readonly, required: this.required, errors: this.errors, errorUpdate: this.errorUpdate, testId: this.testId, nativeAttributes: this.nativeAttributes, value: this.inputValue, dateMaskOptions: this.dateMaskOptions, onCatFocus: e => {
                 this.inputFocused = e.target === this.input;
                 e.stopPropagation();
                 this.catFocus.emit(e.detail);
             }, onCatBlur: e => {
                 e.stopPropagation();
                 this.onInputBlur(e.detail);
-            } }, h("span", { key: '36b14afb75c694a1559e4b5539a2bde0be1f59bc', slot: "label" }, this.label, h("span", { key: 'f541147e5515a679db3adcf4c93c52514b9c9cb3', class: "label-aria" }, " (", this.locale.formatStr, ")")), h("cat-dropdown", { key: '5a73b806ed95c3c6367a5b74d764b31cba4ded92', slot: "addon", placement: this.placement, arrowNavigation: "none", noResize: true, onCatOpen: () => this.dateInline?.resetView() }, h("cat-button", { key: 'ae9da7387e3baf2b1989c9b5d5c9b82d30257c69', slot: "trigger", icon: "$cat:datepicker-calendar", iconOnly: true, class: "cat-date-toggle", disabled: this.disabled, a11yLabel: this.getTriggerA11yLabel() }), h("div", { key: 'b255073bb1ce8e57def9f61c1b347880f9115533', slot: "content" }, h("cat-date-inline", { key: '07e019b2872994198e8cb56a54e12e24b2cb81a4', ref: el => (this.dateInline = el), min: this.min, max: this.max, value: this.value, hint: true, weeks: true, noClear: true, onCatChange: this.onDateChange.bind(this) }))))));
+            } }, h("span", { key: 'cb362f3eb82c46adb276ec16069b5f25181c342a', slot: "label" }, this.label, h("span", { key: '7c226f594c97ceda86dc5da3500ff78665381abc', class: "label-aria" }, " (", this.locale.formatStr, ")")), h("cat-dropdown", { key: '98f13bc9d41b2c3f946007bf5f2d42ac62faab9b', slot: "addon", placement: this.placement, arrowNavigation: "none", noResize: true, onCatOpen: () => this.dateInline?.resetView() }, h("cat-button", { key: 'a801df892743f0e60f4a205fde7c62546a24625b', slot: "trigger", icon: "$cat:datepicker-calendar", iconOnly: true, class: "cat-date-toggle", disabled: this.disabled, a11yLabel: this.getTriggerA11yLabel() }), h("div", { key: '5253067cb8500afa512d9e495610b17d08511edc', slot: "content" }, h("cat-date-inline", { key: '1867958d9ef4c9452a0f0ddcd8aed673f9c595b2', ref: el => (this.dateInline = el), min: this.min, max: this.max, value: this.value, hint: true, weeks: true, noClear: true, onCatChange: this.onDateChange.bind(this) }))))));
     }
     getTriggerA11yLabel() {
         const date = this.locale.fromLocalISO(this.value);
@@ -1766,12 +1766,12 @@ const CatDateInline = class {
         const [minDate, maxDate] = this.getMinMaxDate();
         const dateGrid = this.dateGrid(this.viewDate.getFullYear(), this.viewDate.getMonth());
         const [dateStart, dateEnd] = this.getValue();
-        return (h(Host, { key: '0f06004b6e4a37950a8933175e66694e685a254d', "aria-label": this.label || undefined }, h("div", { key: '50eb04ff252b57dfaca6fcd612e3f4b6defda40d', class: { 'label-container': true, 'label-hidden': this.labelHidden } }, (this.hasSlottedLabel || this.label) && (h("label", { key: 'f19844d5b24c2dc5de7b68d4de4988593582b6c3', id: `${this.id}-label`, htmlFor: this.id, part: "label", onClick: () => this.doFocus() }, h("span", { key: 'c5fd299ba527527ad4025d28fa3e74f7daba201f', class: "label-wrapper" }, (this.hasSlottedLabel && h("slot", { key: 'b20d1bd0440adac6f5c32e7cc11d5274882f913b', name: "label" })) || this.label, h("div", { key: '701a18fc68395264285e01d5bad7b111970f4f0a', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (h("span", { key: '2d82d9fa7ffca66b45f17201467b1d3ecf6ff0df', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (h("span", { key: '06094565395b6054d89cac6ce4399947387d2c88', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.required'), ")"))))))), h("div", { key: 'd5082f212000ef6738235d32a0bc117a06074573', class: { picker: true, 'picker-weeks': this.weeks }, id: this.id, "aria-describedby": `${this.id}-label` }, h("div", { key: 'd085532af173d7224e8b9f12e3fe332d3aba4030', class: "picker-head" }, h("cat-button", { key: '162d251a5a27bd2b14cb7e4a0dc1365ee55da01f', icon: "$cat:datepicker-year-prev", iconOnly: true, size: "xs", variant: "text", "a11y-label": this.locale.prevYear, disabled: isSameYear(this.viewDate, minDate), onClick: () => this.navigate('prev', 'year'), "data-dropdown-no-close": true }), h("cat-button", { key: 'eddfec3c6484b63c4292b688112966f23e0db900', icon: "$cat:datepicker-month-prev", iconOnly: true, size: "xs", variant: "text", "a11y-label": this.locale.prevMonth, disabled: isSameMonth(this.viewDate, minDate), onClick: () => this.navigate('prev', 'month'), "data-dropdown-no-close": true }), h("h3", { key: '874b1707cc80604429797ae273526d6db311619a' }, this.getHeadline()), h("cat-button", { key: '738f739252c1bd6e036aad7bfddbb76a86db3a17', icon: "$cat:datepicker-month-next", iconOnly: true, size: "xs", variant: "text", "a11y-label": this.locale.nextMonth, disabled: isSameMonth(this.viewDate, maxDate), onClick: () => this.navigate('next', 'month'), "data-dropdown-no-close": true }), h("cat-button", { key: '935f968b3a1ea7879a5aa38163d8edc4fcdaea64', icon: "$cat:datepicker-year-next", iconOnly: true, size: "xs", variant: "text", "a11y-label": this.locale.nextYear, disabled: isSameYear(this.viewDate, maxDate), onClick: () => this.navigate('next', 'year'), "data-dropdown-no-close": true })), h("div", { key: '7f9a940cf201568daed8b4b35e44e74f61967188', class: "picker-grid", onFocusin: () => this.setAriaLive(this.locale.arrowKeys) }, h("div", { key: '750c7dc2abe47cf05b75ba21e7c13ac153b07363', class: "picker-grid-head" }, Array.from(Array(7), (_, i) => {
+        return (h(Host, { key: 'ca4f74e4e26b4240c2ac5a88a5ff501f6f9fbfc0', "aria-label": this.label || undefined }, h("div", { key: '30d452f2a08102ce54cc169fe444f83ac24521c4', class: { 'label-container': true, 'label-hidden': this.labelHidden } }, (this.hasSlottedLabel || this.label) && (h("label", { key: '3e5f7c62688dafcdd99cf77477b84ddcfcb262f6', id: `${this.id}-label`, htmlFor: this.id, part: "label", onClick: () => this.doFocus() }, h("span", { key: '3c6ce82acb14c46c83d56f50dda4015b4d30874e', class: "label-wrapper" }, (this.hasSlottedLabel && h("slot", { key: '1540ccc41e02740a69023a2c5ca839320d03e70d', name: "label" })) || this.label, h("div", { key: '64708a81ac29b0ab9509dc2f7fc8709a7594b400', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (h("span", { key: '3f5da06e86b4c202f86c034ea74256e4f0c21dba', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (h("span", { key: 'd0a77ed00b40a9f676b4dbf27101783c038fea29', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.required'), ")"))))))), h("div", { key: 'b7f667802033e1c2fe55268b1d677789ea7ae8fc', class: { picker: true, 'picker-weeks': this.weeks }, id: this.id, "aria-describedby": `${this.id}-label` }, h("div", { key: '9ef0de6c6d7dd9d87c1002c63317a6ce0fc64cc4', class: "picker-head" }, h("cat-button", { key: '12455ccb1d3fa0f68f18e4103a84dd0542a013e1', icon: "$cat:datepicker-year-prev", iconOnly: true, size: "xs", variant: "text", "a11y-label": this.locale.prevYear, disabled: isSameYear(this.viewDate, minDate), onClick: () => this.navigate('prev', 'year'), "data-dropdown-no-close": true }), h("cat-button", { key: '313d660fb3fa61b1de67a7b6b12dae22b48a8299', icon: "$cat:datepicker-month-prev", iconOnly: true, size: "xs", variant: "text", "a11y-label": this.locale.prevMonth, disabled: isSameMonth(this.viewDate, minDate), onClick: () => this.navigate('prev', 'month'), "data-dropdown-no-close": true }), h("h3", { key: 'c7628a8f071cba27d3b8ee6ed9a9239d26d0ed6e' }, this.getHeadline()), h("cat-button", { key: '11fd72dc5bd661ac9189bb2e0cd3eba0a25ce8ab', icon: "$cat:datepicker-month-next", iconOnly: true, size: "xs", variant: "text", "a11y-label": this.locale.nextMonth, disabled: isSameMonth(this.viewDate, maxDate), onClick: () => this.navigate('next', 'month'), "data-dropdown-no-close": true }), h("cat-button", { key: '56936eff41884c6e5112587843518d2031b86eda', icon: "$cat:datepicker-year-next", iconOnly: true, size: "xs", variant: "text", "a11y-label": this.locale.nextYear, disabled: isSameYear(this.viewDate, maxDate), onClick: () => this.navigate('next', 'year'), "data-dropdown-no-close": true })), h("div", { key: 'c8de1f15b1885a396c19b24344da471336036874', class: "picker-grid", onFocusin: () => this.setAriaLive(this.locale.arrowKeys) }, h("div", { key: 'fcb71d996b515d8d0cb36d69249c1737f79599be', class: "picker-grid-head" }, Array.from(Array(7), (_, i) => {
             const day = (i + this.locale.weekInfo.firstDay) % 7;
             return h("abbr", { title: this.locale.days.long[day] }, this.locale.days.short[day]);
-        })), this.weeks && (h("div", { key: '661cecfeef5e835e2e95b267c39a8608e40789d1', class: "picker-grid-weeks" }, dateGrid
+        })), this.weeks && (h("div", { key: '2e9f70a7a94d7f19adfe5ad1a8c5079fbd0e25fd', class: "picker-grid-weeks" }, dateGrid
             .filter((_, i) => i % 7 === 0)
-            .map(day => (h("div", null, this.getWeekNumber(day)))))), h("div", { key: '215f61a30ec58c84d549181a8c216dc847bdbfa5', class: "picker-grid-days" }, dateGrid.map(day => {
+            .map(day => (h("div", null, this.getWeekNumber(day)))))), h("div", { key: '59b9726035ea9a1ab7aa99228c841817522692c1', class: "picker-grid-days" }, dateGrid.map(day => {
             const isStartDate = isSameDay(dateStart, day);
             const isEndDate = isSameDay(dateEnd, day);
             const isRange = !!dateStart && !!dateEnd && day > dateStart && day < dateEnd;
@@ -1788,7 +1788,7 @@ const CatDateInline = class {
                     'date-focusable': this.canFocus(day),
                     'date-disabled': !this.canClick(day)
                 }, nativeAttributes: !this.canFocus(day) ? { tabindex: '-1' } : {}, variant: isStartDate || isEndDate ? 'filled' : isToday ? 'outlined' : 'text', a11yLabel: this.locale.toLocalStr(day), active: isStartDate || isEndDate || isRange, color: isStartDate || isEndDate || isToday ? 'primary' : 'secondary', disabled: !this.canClick(day), onClick: () => this.select(day), "data-date": this.locale.toLocalISO(day) }, day.getDate()));
-        }))), h("div", { key: 'cede3e1fd2319aca96f3afccbab3113f17d4229b', class: "picker-foot" }, !this.noToday && this.canClick(this.locale.now()) && (h("cat-button", { key: '93dd8019983d1ae458706dbc62ad13e3131c29a5', size: "s", "data-dropdown-no-close": true, onClick: () => this.select(this.locale.now()) }, this.locale.today)), this.hint && h("p", { key: '4836275c3b11b58d94f31c1c1f00f5bb3e9645b5', class: "cursor-help" }, this.locale.arrowKeys), !this.noClear && (h("cat-button", { key: '58440f20e7ecd65dd8e2f136b11cb9b5a4379b79', size: "s", disabled: !this.value, "data-dropdown-no-close": true, onClick: () => this.clear() }, this.locale.clear)))), h("p", { key: '3a3507b2e3b4c0452e35f8eb78b2dd21c31e2c9d', class: "cursor-aria", "aria-live": "polite" })));
+        }))), h("div", { key: 'e879de98e8433a0ef17f715ff48686307f401634', class: "picker-foot" }, !this.noToday && this.canClick(this.locale.now()) && (h("cat-button", { key: '34c99fbd08c4ef2dab9a390c2d208f726a2d7645', size: "s", "data-dropdown-no-close": true, onClick: () => this.select(this.locale.now()) }, this.locale.today)), this.hint && h("p", { key: 'd958de3864e0c29daf885af05162ed3f123c08f2', class: "cursor-help" }, this.locale.arrowKeys), !this.noClear && (h("cat-button", { key: 'd7f3902bc982a060318fb3e51e9e2a00b43af618', size: "s", disabled: !this.value, "data-dropdown-no-close": true, onClick: () => this.clear() }, this.locale.clear)))), h("p", { key: '68f6e23f25d229b31afcfb2b1f51c8f42eb28282', class: "cursor-aria", "aria-live": "polite" })));
     }
     focus(date, focus = true) {
         const [minDate, maxDate] = this.getMinMaxDate();
@@ -4719,10 +4719,6 @@ const oppositeSideMap = {
   bottom: 'top',
   top: 'bottom'
 };
-const oppositeAlignmentMap = {
-  start: 'end',
-  end: 'start'
-};
 function clamp(start, value, end) {
   return max(start, min(value, end));
 }
@@ -4741,9 +4737,9 @@ function getOppositeAxis(axis) {
 function getAxisLength(axis) {
   return axis === 'y' ? 'height' : 'width';
 }
-const yAxisSides = /*#__PURE__*/new Set(['top', 'bottom']);
 function getSideAxis(placement) {
-  return yAxisSides.has(getSide(placement)) ? 'y' : 'x';
+  const firstChar = placement[0];
+  return firstChar === 't' || firstChar === 'b' ? 'y' : 'x';
 }
 function getAlignmentAxis(placement) {
   return getOppositeAxis(getSideAxis(placement));
@@ -4766,7 +4762,7 @@ function getExpandedPlacements(placement) {
   return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
 }
 function getOppositeAlignmentPlacement(placement) {
-  return placement.replace(/start|end/g, alignment => oppositeAlignmentMap[alignment]);
+  return placement.includes('start') ? placement.replace('start', 'end') : placement.replace('end', 'start');
 }
 const lrPlacement = ['left', 'right'];
 const rlPlacement = ['right', 'left'];
@@ -4797,7 +4793,8 @@ function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
   return list;
 }
 function getOppositePlacement(placement) {
-  return placement.replace(/left|right|bottom|top/g, side => oppositeSideMap[side]);
+  const side = getSide(placement);
+  return oppositeSideMap[side] + placement.slice(side.length);
 }
 function expandPaddingObject(padding) {
   return {
@@ -4956,6 +4953,9 @@ async function detectOverflow(state, options) {
   };
 }
 
+// Maximum number of resets that can occur before bailing to avoid infinite reset loops.
+const MAX_RESET_COUNT = 50;
+
 /**
  * Computes the `x` and `y` coordinates that will place the floating element
  * next to a given reference element.
@@ -4970,7 +4970,10 @@ const computePosition$1 = async (reference, floating, config) => {
     middleware = [],
     platform
   } = config;
-  const validMiddleware = middleware.filter(Boolean);
+  const platformWithDetectOverflow = platform.detectOverflow ? platform : {
+    ...platform,
+    detectOverflow
+  };
   const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(floating));
   let rects = await platform.getElementRects({
     reference,
@@ -4982,14 +4985,17 @@ const computePosition$1 = async (reference, floating, config) => {
     y
   } = computeCoordsFromPlacement(rects, placement, rtl);
   let statefulPlacement = placement;
-  let middlewareData = {};
   let resetCount = 0;
-  for (let i = 0; i < validMiddleware.length; i++) {
-    var _platform$detectOverf;
+  const middlewareData = {};
+  for (let i = 0; i < middleware.length; i++) {
+    const currentMiddleware = middleware[i];
+    if (!currentMiddleware) {
+      continue;
+    }
     const {
       name,
       fn
-    } = validMiddleware[i];
+    } = currentMiddleware;
     const {
       x: nextX,
       y: nextY,
@@ -5003,10 +5009,7 @@ const computePosition$1 = async (reference, floating, config) => {
       strategy,
       middlewareData,
       rects,
-      platform: {
-        ...platform,
-        detectOverflow: (_platform$detectOverf = platform.detectOverflow) != null ? _platform$detectOverf : detectOverflow
-      },
+      platform: platformWithDetectOverflow,
       elements: {
         reference,
         floating
@@ -5014,14 +5017,11 @@ const computePosition$1 = async (reference, floating, config) => {
     });
     x = nextX != null ? nextX : x;
     y = nextY != null ? nextY : y;
-    middlewareData = {
-      ...middlewareData,
-      [name]: {
-        ...middlewareData[name],
-        ...data
-      }
+    middlewareData[name] = {
+      ...middlewareData[name],
+      ...data
     };
-    if (reset && resetCount <= 50) {
+    if (reset && resetCount < MAX_RESET_COUNT) {
       resetCount++;
       if (typeof reset === 'object') {
         if (reset.placement) {
@@ -5476,7 +5476,6 @@ function isShadowRoot(value) {
   }
   return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
 }
-const invalidOverflowDisplayValues = /*#__PURE__*/new Set(['inline', 'contents']);
 function isOverflowElement(element) {
   const {
     overflow,
@@ -5484,32 +5483,35 @@ function isOverflowElement(element) {
     overflowY,
     display
   } = getComputedStyle$1(element);
-  return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !invalidOverflowDisplayValues.has(display);
+  return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && display !== 'inline' && display !== 'contents';
 }
-const tableElements = /*#__PURE__*/new Set(['table', 'td', 'th']);
 function isTableElement(element) {
-  return tableElements.has(getNodeName(element));
+  return /^(table|td|th)$/.test(getNodeName(element));
 }
-const topLayerSelectors = [':popover-open', ':modal'];
 function isTopLayer(element) {
-  return topLayerSelectors.some(selector => {
-    try {
-      return element.matches(selector);
-    } catch (_e) {
-      return false;
+  try {
+    if (element.matches(':popover-open')) {
+      return true;
     }
-  });
+  } catch (_e) {
+    // no-op
+  }
+  try {
+    return element.matches(':modal');
+  } catch (_e) {
+    return false;
+  }
 }
-const transformProperties = ['transform', 'translate', 'scale', 'rotate', 'perspective'];
-const willChangeValues = ['transform', 'translate', 'scale', 'rotate', 'perspective', 'filter'];
-const containValues = ['paint', 'layout', 'strict', 'content'];
+const willChangeRe = /transform|translate|scale|rotate|perspective|filter/;
+const containRe = /paint|layout|strict|content/;
+const isNotNone = value => !!value && value !== 'none';
+let isWebKitValue;
 function isContainingBlock(elementOrCss) {
-  const webkit = isWebKit();
   const css = isElement(elementOrCss) ? getComputedStyle$1(elementOrCss) : elementOrCss;
 
   // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
   // https://drafts.csswg.org/css-transforms-2/#individual-transforms
-  return transformProperties.some(value => css[value] ? css[value] !== 'none' : false) || (css.containerType ? css.containerType !== 'normal' : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== 'none' : false) || !webkit && (css.filter ? css.filter !== 'none' : false) || willChangeValues.some(value => (css.willChange || '').includes(value)) || containValues.some(value => (css.contain || '').includes(value));
+  return isNotNone(css.transform) || isNotNone(css.translate) || isNotNone(css.scale) || isNotNone(css.rotate) || isNotNone(css.perspective) || !isWebKit() && (isNotNone(css.backdropFilter) || isNotNone(css.filter)) || willChangeRe.test(css.willChange || '') || containRe.test(css.contain || '');
 }
 function getContainingBlock(element) {
   let currentNode = getParentNode(element);
@@ -5524,12 +5526,13 @@ function getContainingBlock(element) {
   return null;
 }
 function isWebKit() {
-  if (typeof CSS === 'undefined' || !CSS.supports) return false;
-  return CSS.supports('-webkit-backdrop-filter', 'none');
+  if (isWebKitValue == null) {
+    isWebKitValue = typeof CSS !== 'undefined' && CSS.supports && CSS.supports('-webkit-backdrop-filter', 'none');
+  }
+  return isWebKitValue;
 }
-const lastTraversableNodeNames = /*#__PURE__*/new Set(['html', 'body', '#document']);
 function isLastTraversableNode(node) {
-  return lastTraversableNodeNames.has(getNodeName(node));
+  return /^(html|body|#document)$/.test(getNodeName(node));
 }
 function getComputedStyle$1(element) {
   return getWindow(element).getComputedStyle(element);
@@ -5585,8 +5588,9 @@ function getOverflowAncestors(node, list, traverseIframes) {
   if (isBody) {
     const frameElement = getFrameElement(win);
     return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []);
+  } else {
+    return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
   }
-  return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
 }
 function getFrameElement(win) {
   return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
@@ -6422,7 +6426,7 @@ const CatDatepickerFlat = class {
     }
     render() {
         return [
-            h("cat-input", { key: 'd81f695ecf9eb3dd175a14070811b8ca99e13f67', 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.value, errors: this.errors, errorUpdate: this.errorUpdate, nativeAttributes: this.nativeAttributes, onCatChange: e => {
+            h("cat-input", { key: '199c9fd2a919b876106eaab58a37a6d286654c27', 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.value, errors: this.errors, errorUpdate: this.errorUpdate, nativeAttributes: this.nativeAttributes, onCatChange: e => {
                     e.stopPropagation();
                     this.value = e.detail || undefined;
                 }, onCatFocus: e => {
@@ -6431,8 +6435,8 @@ const CatDatepickerFlat = class {
                 }, onCatBlur: e => {
                     e.stopPropagation();
                     this.catBlur.emit(e.detail);
-                } }, this.hasSlottedLabel && (h("span", { key: '41f0dfcbe0a7ab562a80416a109ee6283d602147', slot: "label" }, h("slot", { key: '4148dec98c036b3f7d604b16c05dfed648ec16a3', name: "label" }))), this.hasSlottedHint && (h("span", { key: '8181253f8adadc606f0d66abe5bad5a85b7a0f7f', slot: "hint" }, h("slot", { key: 'c6807aed385298a19d67e1f2652de82473ea6f16', name: "hint" })))),
-            h("div", { key: '8b0f02c5f6cf61ad89dccd831937649c6740035c', ref: el => (this._calendarWrapper = el), class: "datepicker-wrapper" })
+                } }, this.hasSlottedLabel && (h("span", { key: 'aedecd1ff7f34f8f038df57c3fb42bdd3282273e', slot: "label" }, h("slot", { key: 'a86b6a3bd04da7fde60ddb19df4142e9ff39c0fe', name: "label" }))), this.hasSlottedHint && (h("span", { key: '70f4739871308bcd4fa88e265a2ec5c8e5eeff35', slot: "hint" }, h("slot", { key: '8cc4b602ae9064da5816653ca2dfb918329e26d3', name: "hint" })))),
+            h("div", { key: 'abc43645698cf1b209598f8a34432d6be0c9e519', ref: el => (this._calendarWrapper = el), class: "datepicker-wrapper" })
         ];
     }
     initDatepicker(input) {
@@ -6542,11 +6546,11 @@ const CatDatepickerInline = class {
         this.pickr = this.initDatepicker(this.input);
     }
     render() {
-        return (h(Host, { key: '22ff03e4cb6c74bc944e5022764308b6d2b2fe29' }, h("div", { key: '1c7e6b0beab570e1357014384ab8eaf76458858f', tabIndex: this.disabled || this.readonly ? -1 : undefined, class: {
+        return (h(Host, { key: '3a51929cf5486122309a0949df55b414bfa83462' }, h("div", { key: 'ad94b1019c6013d04af429702d23d996927567a9', tabIndex: this.disabled || this.readonly ? -1 : undefined, class: {
                 'datepicker-wrapper': true,
                 'datepicker-disabled': this.disabled,
                 'datepicker-readonly': this.readonly
-            } }, h("input", { key: '75edfdc337ba101bd0cb9afa1ddef11571e94bf9', ref: el => (this.input = el), value: this.value, disabled: this.disabled, readonly: this.readonly }))));
+            } }, h("input", { key: '0edefcd24538d19c49fb57eab6cb4ed5a19f22ce', ref: el => (this.input = el), value: this.value, disabled: this.disabled, readonly: this.readonly }))));
     }
     initDatepicker(input) {
         if (!input) {
@@ -7686,6 +7690,9 @@ const CatDropdown = class {
          * @internal
          */
         this.focusTrap = true;
+        this.boundWindowClickListener = this.windowClickListener.bind(this);
+        this.boundWindowMousedownListener = this.windowMousedownListener.bind(this);
+        this.boundWindowTouchStartListener = this.windowTouchStartListener.bind(this);
     }
     /**
      * Whether the dropdown is open.
@@ -7707,6 +7714,7 @@ const CatDropdown = class {
             path.includes(this.content) &&
             // check if click was not on a trigger for a sub-dropdown
             event.target?.slot !== 'trigger' &&
+            !event.target.subMenu &&
             // check if click was not an element marked with data-dropdown-no-close
             !path.slice(0, path.indexOf(this.content)).find(el => this.hasAttribute(el, 'data-dropdown-no-close'))) {
             this.close();
@@ -7717,13 +7725,13 @@ const CatDropdown = class {
             this.close();
         }
     }
-    globalClickHandler(event) {
+    windowClickListener(event) {
         this.handleClickOutside(event);
     }
-    globalMouseDownHandler(event) {
+    windowMousedownListener(event) {
         this.handleClickOutside(event);
     }
-    globalTouchStartHandler(event) {
+    windowTouchStartListener(event) {
         this.handleClickOutside(event);
     }
     /**
@@ -7761,6 +7769,8 @@ const CatDropdown = class {
                     : createFocusTrap(this.content, {
                         tabbableOptions: this.tabbableOptions,
                         allowOutsideClick: true,
+                        clickOutsideDeactivates: event => this.shouldCloseByClickEvent(event),
+                        onPostDeactivate: () => this.close(),
                         onPostActivate: () => this.catOpen.emit(),
                         setReturnFocus: elem => (!this.isFocusVisible || this.noReturnFocus ? false : this.trigger || elem),
                         isKeyForward: event => {
@@ -7786,6 +7796,7 @@ const CatDropdown = class {
                 this.trap.activate();
             }
             else {
+                this.addListeners();
                 this.catOpen.emit();
             }
         });
@@ -7804,6 +7815,7 @@ const CatDropdown = class {
         if (shouldReturnFocus) {
             this.trigger?.focus();
         }
+        this.removeListeners();
         // give CSS transition time to apply
         setTimeout(() => {
             this._isOpen = false;
@@ -7828,16 +7840,31 @@ const CatDropdown = class {
         this.cleanupFloatingUi = undefined;
     }
     render() {
-        return (h(Host, { key: 'b3cd898551dc3e6d5396db1a4a14bc97cf4a2024' }, h("slot", { key: '6875cfad353891deb54ebcd5155d7ea466384131', name: "anchor", ref: el => (this.anchorSlot = el) }), h("slot", { key: '93fdda4c49a7a956f72548699200feb309779081', name: "trigger", ref: el => (this.triggerSlot = el) }), h("div", { key: '13a68b5f706e61e87599c463e58f1bf932b2d261', id: this.contentId, class: { content: true, 'overflow-auto': !this.overflow, justified: this.justify, aligned: !this.justify }, ref: el => (this.content = el) }, h("slot", { key: '06357a4a970241938900853d78c88427c6a9e69a', name: "content" }))));
+        return (h(Host, { key: 'bd6c2271fbd5a3f9222cb9eb8c59d7113dc72c7a' }, h("slot", { key: '26b1d2b753fffa0f91c8ee505209c46880e9233b', name: "anchor", ref: el => (this.anchorSlot = el) }), h("slot", { key: 'ac3b213022083bdb89edf4583cc216a5308bb1d2', name: "trigger", ref: el => (this.triggerSlot = el) }), h("div", { key: 'c4849c420a3e248bc7192db3a059e3372b7612fb', id: this.contentId, class: { content: true, 'overflow-auto': !this.overflow, justified: this.justify, aligned: !this.justify }, ref: el => (this.content = el) }, h("slot", { key: '1bbcaa8a86c2726e61aff6236e01b3f4ac6004e9', name: "content" }))));
+    }
+    addListeners() {
+        window.addEventListener('click', this.boundWindowClickListener);
+        window.addEventListener('mousedown', this.boundWindowMousedownListener);
+        window.addEventListener('touchstart', this.boundWindowTouchStartListener);
+    }
+    removeListeners() {
+        window.removeEventListener('click', this.boundWindowClickListener);
+        window.removeEventListener('mousedown', this.boundWindowMousedownListener);
+        window.removeEventListener('touchstart', this.boundWindowTouchStartListener);
     }
     handleClickOutside(event) {
-        if (!this.noAutoClose &&
+        if (this.shouldCloseByClickEvent(event)) {
+            this.close();
+        }
+    }
+    shouldCloseByClickEvent(event) {
+        return (!this.noAutoClose &&
             // check if click was outside of the dropdown content
             !event.composedPath().includes(this.content) &&
+            // check if click was on trigger - this case is handled by trigger click listener
+            !event.composedPath().includes(this.trigger) &&
             // check if click was not on an element marked with data-dropdown-no-close
-            !event.composedPath().find(el => this.hasAttribute(el, 'data-dropdown-no-close'))) {
-            this.close();
-        }
+            !event.composedPath().find(el => this.hasAttribute(el, 'data-dropdown-no-close')));
     }
     get contentId() {
         return `cat-dropdown-${this.id}`;
@@ -7973,7 +8000,7 @@ const CatFormGroup = class {
         });
     }
     render() {
-        return (h(Host, { key: '256d7b8493d24b515d9989f6c0bfa3d2af99ba67', style: { '--label-size': this.labelSize } }, h("slot", { key: '806080ce0d61ce3b64819dcb50b7bc1651b31c98', onSlotchange: this.onSlotChange.bind(this) })));
+        return (h(Host, { key: 'cb3ed29df264b00c7740a97558ef5283a018c0c4', style: { '--label-size': this.labelSize } }, h("slot", { key: 'da29f356a770a8c5abc99719353e76ea565bf483', onSlotchange: this.onSlotChange.bind(this) })));
     }
     onSlotChange() {
         this.formElements = Array.from(this.hostElement.querySelectorAll('cat-input, cat-textarea, cat-select, cat-datepicker, cat-date, cat-time'));
@@ -8004,7 +8031,7 @@ const CatIcon = class {
         this.size = 'm';
     }
     render() {
-        return (h("span", { key: 'b7c7a3e889ebc12349f1b8f35c227feb1992f8a8', innerHTML: this.iconSrc || (this.icon ? catIconRegistry.getIcon(this.icon) : ''), "aria-label": this.a11yLabel, "aria-hidden": this.a11yLabel ? null : 'true', part: "icon", class: {
+        return (h("span", { key: '7d03b1a8d0443200d1daf1a77c14ed4d75a2f74e', innerHTML: this.iconSrc || (this.icon ? catIconRegistry.getIcon(this.icon) : ''), "aria-label": this.a11yLabel, "aria-hidden": this.a11yLabel ? null : 'true', part: "icon", class: {
                 icon: true,
                 [`icon-${this.size}`]: this.size !== 'inline'
             } }));
@@ -8323,17 +8350,19 @@ const CatMenu = class {
             return;
         }
         requestAnimationFrame(() => {
-            if (!this.isMenuItemInFocus()) {
+            if (!this.isMenuItemInFocus() &&
+                document.activeElement !== document.body &&
+                document.activeElement !== this.hostElement) {
                 this.dropdown?.close(false);
             }
         });
     }
     getDeepActiveElement() {
         let active = document.activeElement;
-        while (active?.shadowRoot?.activeElement && active.nodeName !== 'CAT-MENU-ITEM') {
+        while (active?.shadowRoot?.activeElement) {
             active = active.shadowRoot.activeElement;
         }
-        return active;
+        return active ? (findClosest('cat-menu-item', active) ?? active) : null;
     }
     onDocumentKeydown(event) {
         const navigationKeys = this.arrowNavigation === 'horizontal'
@@ -8401,10 +8430,10 @@ const CatMenu = class {
         this.catMenuItems = Array.from(this.hostElement.querySelectorAll('cat-menu-item'));
     }
     render() {
-        return (h(Host, { key: '1659f098d4d11e61119cde4f290bb89bf450f9d9' }, h("cat-dropdown", { key: 'a5ca6e28245167c0f208d1846c9f93a75991dee1', ref: el => (this.dropdown = el), focusTrap: false, placement: this.placement, justify: this.justify, arrowNavigation: "none", noResize: this.noResize, overflow: this.overflow, delayedTriggerInit: this.delayedTriggerInit, onCatOpen: this.onMenuOpen, onCatClose: () => this.catClose.emit() }, h("cat-button", { key: '63986a7d31784fdd59de48c79a5b5777cf198b94', slot: "trigger", part: "trigger", variant: this.triggerVariant, size: this.triggerSize, icon: this.triggerIcon ?? (this.triggerLabel === undefined ? 'more-horizontal-filled' : undefined), iconOnly: this.triggerIconOnly ?? this.triggerLabel === undefined, color: this.triggerColor, a11yLabel: this.triggerA11yLabel ?? this.triggerLabel, class: this.triggerClass, testId: this.triggerTestId, nativeAttributes: {
+        return (h(Host, { key: '7f6a8d695af0d7f30b7da9ba5558f0c6983e4315' }, h("cat-dropdown", { key: '722ec1a940599257082c2a7b586dd662e09aab39', ref: el => (this.dropdown = el), focusTrap: false, placement: this.placement, justify: this.justify, arrowNavigation: "none", noResize: this.noResize, overflow: this.overflow, delayedTriggerInit: this.delayedTriggerInit, onCatOpen: this.onMenuOpen, onCatClose: () => this.catClose.emit() }, h("cat-button", { key: 'a1562b313b53ae8a736f096e3717ee3de78b9862', slot: "trigger", part: "trigger", variant: this.triggerVariant, size: this.triggerSize, icon: this.triggerIcon ?? (this.triggerLabel === undefined ? 'more-horizontal-filled' : undefined), iconOnly: this.triggerIconOnly ?? this.triggerLabel === undefined, color: this.triggerColor, a11yLabel: this.triggerA11yLabel ?? this.triggerLabel, class: this.triggerClass, testId: this.triggerTestId, nativeAttributes: {
                 ...this.triggerNativeAttributes,
                 'aria-haspopup': 'menu'
-            }, disabled: this.disabled, onCatClick: this.onTriggerClick }, !this.triggerIconOnly && h("slot", { key: 'c10341a8bec971b814ec88044a89aa6752f3be23', name: "trigger-label" }, this.triggerLabel)), h("nav", { key: '265da5937ea993d27ccec21f9c0bc84439208d6c', role: "menu", slot: "content", class: "cat-menu-list", "aria-orientation": this.arrowNavigation }, h("ul", { key: '9b8edcb90028b39690be08961f25ea8c7a769752' }, h("slot", { key: 'f30590ff83386f30ba4539e76d621a80b0aefffd' }))))));
+            }, disabled: this.disabled, onCatClick: this.onTriggerClick }, !this.triggerIconOnly && h("slot", { key: 'f8cbc8e8841e4d9c2d28b38bae55bdbde2693a10', name: "trigger-label" }, this.triggerLabel)), h("nav", { key: 'bcd0eebb7e9bdbb23f2dbcfba7d6d13653789c06', role: "menu", slot: "content", class: "cat-menu-list", "aria-orientation": this.arrowNavigation }, h("ul", { key: '52ced18c6c0349795e1516090b33cd5c7bebb451' }, h("slot", { key: '3cedc5e3d1392fec9d49222165e9c96e7f40b0f2' }))))));
     }
     get hostElement() { return getElement(this); }
 };
@@ -8436,10 +8465,14 @@ const CatMenuItem = class {
          * Specifies that the menu item should be disabled.
          */
         this.disabled = false;
+        this.subMenu = false;
     }
     get id() {
         return this.identifier || this._id;
     }
+    onClick(event) {
+        this.catClick.emit(event);
+    }
     /**
      * Programmatically move focus to the menu item.
      */
@@ -8453,14 +8486,14 @@ const CatMenuItem = class {
         this.button?.doBlur();
     }
     render() {
-        return (h(Host, { key: '69db1c5c6d91ea31103639a5fe3cbb96da32aa40' }, h("li", { key: '88569a9541369cf5dbc7f79b562ef5b68c9905a3' }, h("cat-button", { key: '65b6e6c3ca873a07204f36b3cae69dfffbc51a0b', ref: el => (this.button = el), class: "cat-nav-item", buttonId: this.id, part: "menu-item", variant: this.variant, icon: this.icon, iconOnly: this.iconOnly, iconRight: this.iconRight, url: this.url, disabled: this.disabled, urlTarget: this.urlTarget, loading: this.loading, color: this.color, active: this.active, testId: this.testId, nativeAttributes: {
+        return (h(Host, { key: 'ff1abf6c6d74fc9d0bbc7491d64e0ad3373f6899' }, h("li", { key: '45089d058d664822cb67bc7bbf802b06333c351e' }, h("cat-button", { key: '47a83844fe837313f65115d95571f0e9b6f7591b', ref: el => (this.button = el), class: "cat-nav-item", buttonId: this.id, part: "menu-item", variant: this.variant, icon: this.icon, iconOnly: this.iconOnly, iconRight: this.iconRight, url: this.url, disabled: this.disabled, urlTarget: this.urlTarget, loading: this.loading, color: this.color, active: this.active, testId: this.testId, nativeAttributes: {
                 ...this.nativeAttributes,
                 role: 'menuitem',
                 tabindex: '-1'
-            }, onCatClick: this.onCatClick }, h("slot", { key: 'c8036dabc3f0cb762d96bee7797ac50f871ac44d' })))));
+            }, onCatClick: event => this.click(event) }, h("slot", { key: '49bc9f6cc4a5ed1293e261cefb67351342b805fb' })))));
     }
-    onCatClick(event) {
-        this.catClick.emit(event.detail);
+    click(event) {
+        event.stopPropagation();
     }
 };