@haiilo/catalyst 10.1.1 → 10.3.1

package/dist/cjs/{cat-alert_26.cjs.entry.js → cat-alert_28.cjs.entry.js}

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-eb056d5e.js');
-const of = require('./of-30c47b72.js');
+const index = require('./index-13aff0b4.js');
+const of = require('./of-45281229.js');
 
 const ObjectUnsubscribedError = of.createErrorClass((_super) => function ObjectUnsubscribedErrorImpl() {
     _super(this);
@@ -790,7 +790,8 @@ function setAttributeDefault(host, attr, value) {
     }
 }
 
-const catAlertCss = ":host{display:flex;gap:0.5rem;padding:1.25rem;border-radius:var(--cat-border-radius-l, 0.5rem)}:host([hidden]){display:none}:host(:focus-visible){outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:1px}.content{align-self:center;width:100%}::slotted(:last-child){margin-bottom:0 !important}:host([color=primary]){background-color:rgb(var(--cat-primary-bg, 0, 129, 148));color:rgb(var(--cat-primary-fill, 255, 255, 255));--cat-primary-text:var(--cat-primary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-primary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-primary-fill-active, 255, 255, 255);--cat-link-decoration:underline}:host([color=secondary]){background-color:rgb(var(--cat-secondary-bg, 105, 118, 135));color:rgb(var(--cat-secondary-fill, 255, 255, 255));--cat-primary-text:var(--cat-secondary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-secondary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-secondary-fill-active, 255, 255, 255);--cat-link-decoration:underline}:host([color=info]){background-color:rgb(var(--cat-success-bg, 0, 115, 230));color:rgb(var(--cat-success-fill, 255, 255, 255));--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}:host([color=success]){background-color:rgb(var(--cat-success-bg, 0, 132, 88));color:rgb(var(--cat-success-fill, 255, 255, 255));--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}:host([color=warning]){background-color:rgb(var(--cat-warning-bg, 255, 206, 128));color:rgb(var(--cat-warning-fill, 0, 0, 0));--cat-primary-text:var(--cat-warning-fill, 0, 0, 0);--cat-primary-text-hover:var(--cat-warning-fill-hover, 0, 0, 0);--cat-primary-text-active:var(--cat-warning-fill-active, 0, 0, 0);--cat-link-decoration:underline}:host([color=danger]){background-color:rgb(var(--cat-danger-bg, 217, 52, 13));color:rgb(var(--cat-danger-fill, 255, 255, 255));--cat-primary-text:var(--cat-danger-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-danger-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-danger-fill-active, 255, 255, 255);--cat-link-decoration:underline}";
+const catAlertCss = ":host{display:flex;gap:0.5rem;padding:1.25rem;border-radius:var(--cat-border-radius-l, 0.5rem)}:host([hidden]){display:none}:host(:focus-visible){outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:1px}.content{align-self:center;width:100%}::slotted(:last-child){margin-bottom:0 !important}:host([color=primary]){background-color:rgb(var(--cat-primary-bg, 0, 129, 148));color:rgb(var(--cat-primary-fill, 255, 255, 255));--cat-primary-text:var(--cat-primary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-primary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-primary-fill-active, 255, 255, 255);--cat-link-decoration:underline}:host([color=secondary]){background-color:rgb(var(--cat-secondary-bg, 105, 118, 135));color:rgb(var(--cat-secondary-fill, 255, 255, 255));--cat-primary-text:var(--cat-secondary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-secondary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-secondary-fill-active, 255, 255, 255);--cat-link-decoration:underline}:host([color=info]){background-color:rgb(var(--cat-info-bg, 0, 115, 230));color:rgb(var(--cat-info-fill, 255, 255, 255));--cat-primary-text:var(--cat-info-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-info-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-info-fill-active, 255, 255, 255);--cat-link-decoration:underline}:host([color=success]){background-color:rgb(var(--cat-success-bg, 0, 132, 88));color:rgb(var(--cat-success-fill, 255, 255, 255));--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}:host([color=warning]){background-color:rgb(var(--cat-warning-bg, 255, 206, 128));color:rgb(var(--cat-warning-fill, 0, 0, 0));--cat-primary-text:var(--cat-warning-fill, 0, 0, 0);--cat-primary-text-hover:var(--cat-warning-fill-hover, 0, 0, 0);--cat-primary-text-active:var(--cat-warning-fill-active, 0, 0, 0);--cat-link-decoration:underline}:host([color=danger]){background-color:rgb(var(--cat-danger-bg, 217, 52, 13));color:rgb(var(--cat-danger-fill, 255, 255, 255));--cat-primary-text:var(--cat-danger-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-danger-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-danger-fill-active, 255, 255, 255);--cat-link-decoration:underline}";
+const CatAlertStyle0 = catAlertCss;
 
 const CatAlert = class {
     constructor(hostRef) {
@@ -820,11 +821,11 @@ const CatAlert = class {
         setAttributeDefault(this, 'role', this.mapRole.get(this.color));
     }
     render() {
-        return (index.h(index.Host, null, !this.noIcon && index.h("cat-icon", { size: "l", icon: this.icon || this.mapIcon.get(this.color) }), index.h("div", { class: "content" }, index.h("slot", null))));
+        return (index.h(index.Host, { key: '65e08f5679d761056c71407b03b0b22fb5aa5c94' }, !this.noIcon && index.h("cat-icon", { size: "l", icon: this.icon || this.mapIcon.get(this.color) }), index.h("div", { key: 'b85309b1867b896244a0cda0ababb2e66ca2d01a', class: "content" }, index.h("slot", { key: 'ed88e2f275b189f5ae75ba3220b6f30be36699b4' }))));
     }
     get hostElement() { return index.getElement(this); }
 };
-CatAlert.style = catAlertCss;
+CatAlert.style = CatAlertStyle0;
 
 /**
  * Loads an image and wraps the result in a promise.
@@ -842,6 +843,7 @@ const loadImg = (src) => {
 };
 
 const catAvatarCss = ":host{display:contents}:host([hidden]){display:none}.avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--cat-border-radius-m, 0.25rem);text-decoration:inherit;color:var(--cat-avatar-fill, #515c6c);background-color:var(--cat-avatar-bg, #f2f4f7);background-size:cover;background-position:center;white-space:nowrap;overflow:hidden;vertical-align:middle;font-weight:600;-webkit-user-select:none;-ms-user-select:none;user-select:none;}.avatar:focus-visible{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:1px}.avatar-round{border-radius:50%}.avatar-xs{width:var(--cat-avatar-size, 1.5rem);height:var(--cat-avatar-size, 1.5rem);line-height:var(--cat-avatar-size, 1.5rem);font-size:var(--cat-avatar-font-size, 0.75rem)}.avatar-s{width:var(--cat-avatar-size, 2rem);height:var(--cat-avatar-size, 2rem);line-height:var(--cat-avatar-size, 2rem);font-size:var(--cat-avatar-font-size, 0.875rem)}.avatar-m{width:var(--cat-avatar-size, 2.5rem);height:var(--cat-avatar-size, 2.5rem);line-height:var(--cat-avatar-size, 2.5rem);font-size:var(--cat-avatar-font-size, 0.9375rem)}.avatar-l{width:var(--cat-avatar-size, 3rem);height:var(--cat-avatar-size, 3rem);line-height:var(--cat-avatar-size, 3rem);font-size:var(--cat-avatar-font-size, 1.125rem)}.avatar-xl{width:var(--cat-avatar-size, 3.5rem);height:var(--cat-avatar-size, 3.5rem);line-height:var(--cat-avatar-size, 3.5rem);font-size:var(--cat-avatar-font-size, 1.25rem)}";
+const CatAvatarStyle0 = catAvatarCss;
 
 const CatAvatar = class {
     constructor(hostRef) {
@@ -869,7 +871,7 @@ const CatAvatar = class {
     }
     componentWillRender() {
         if (!this.label) {
-            of.loglevel.warn('[A11y] Missing ARIA label on avatar', this);
+            of.log.warn('[A11y] Missing ARIA label on avatar', this);
         }
     }
     render() {
@@ -906,9 +908,10 @@ const CatAvatar = class {
         "src": ["onSrcChanged"]
     }; }
 };
-CatAvatar.style = catAvatarCss;
+CatAvatar.style = CatAvatarStyle0;
 
-const catBadgeCss = ":host([hidden]){display:none}:host{display:inline-flex;max-width:100%;vertical-align:baseline;align-items:center;justify-content:center;border-radius:var(--cat-border-radius-m, 0.25rem);text-decoration:none;line-height:1.5}:host slot{display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}:host([round]){border-radius:10rem}:host([variant=filled]){background-color:rgb(var(--bg));color:rgb(var(--fill));font-weight:600;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:greyscale}:host([variant=outlined]){background-color:white;color:rgb(var(--text));box-shadow:inset 0 0 0 1px rgba(var(--text), 0.2)}:host([color=primary]){--bg:var(--cat-primary-bg, 0, 129, 148);--fill:var(--cat-primary-fill, 255, 255, 255);--text:var(--cat-primary-text, 0, 129, 148)}:host([color=secondary]){--bg:var(--cat-secondary-bg, 105, 118, 135);--fill:var(--cat-secondary-fill, 255, 255, 255);--text:var(--cat-secondary-text, 0, 0, 0)}:host([color=info]){--bg:var(--cat-success-bg, 0, 115, 230);--fill:var(--cat-success-fill, 255, 255, 255);--text:var(--cat-success-text, 0, 115, 230)}:host([color=success]){--bg:var(--cat-success-bg, 0, 132, 88);--fill:var(--cat-success-fill, 255, 255, 255);--text:var(--cat-success-text, 0, 132, 88)}:host([color=warning]){--bg:var(--cat-warning-bg, 255, 206, 128);--fill:var(--cat-warning-fill, 0, 0, 0);--text:var(--cat-warning-text, 159, 97, 0)}:host([color=danger]){--bg:var(--cat-danger-bg, 217, 52, 13);--fill:var(--cat-danger-fill, 255, 255, 255);--text:var(--cat-danger-text, 217, 52, 13)}:host([size=xs]){height:1rem;min-width:1rem;font-size:0.75rem;padding:0 0.25rem}:host([size=s]){height:1.5rem;min-width:1.5rem;font-size:0.75rem;padding:0 0.5rem}:host([size=m]){height:2rem;min-width:2rem;font-size:0.875rem;padding:0 0.75rem}:host([size=l]){height:2.5rem;min-width:2.5rem;font-size:0.9375rem;padding:0 1rem}:host([size=xl]){height:3rem;min-width:3rem;font-size:1.125rem;padding:0 1rem}:host([pulse][variant=filled]){animation:1.5s ease 0s infinite normal none running pulse}:host([pulse][variant=outlined]){animation:1.5s ease 0s infinite normal none running pulse-outlined}@keyframes pulse{0%{box-shadow:0 0 0 0 rgb(var(--bg))}70%{box-shadow:transparent 0 0 0 0.5rem}100%{box-shadow:transparent 0 0 0 0}}@keyframes pulse-outlined{0%{box-shadow:0 0 0 0 rgb(var(--bg)), inset 0 0 0 1px rgba(var(--text), 0.2)}70%{box-shadow:transparent 0 0 0 0.5rem, inset 0 0 0 1px rgba(var(--text), 0.2)}100%{box-shadow:transparent 0 0 0 0, inset 0 0 0 1px rgba(var(--text), 0.2)}}";
+const catBadgeCss = ":host([hidden]){display:none}:host{display:inline-flex;max-width:100%;vertical-align:baseline;align-items:center;justify-content:center;border-radius:var(--cat-border-radius-m, 0.25rem);text-decoration:none;line-height:1.5}:host slot{display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}:host([round]){border-radius:10rem}:host([variant=filled]){background-color:rgb(var(--bg));color:rgb(var(--fill));font-weight:600;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:greyscale}:host([variant=outlined]){background-color:white;color:rgb(var(--text));box-shadow:inset 0 0 0 1px rgba(var(--text), 0.2)}:host([color=primary]){--bg:var(--cat-primary-bg, 0, 129, 148);--fill:var(--cat-primary-fill, 255, 255, 255);--text:var(--cat-primary-text, 0, 129, 148)}:host([color=secondary]){--bg:var(--cat-secondary-bg, 105, 118, 135);--fill:var(--cat-secondary-fill, 255, 255, 255);--text:var(--cat-secondary-text, 0, 0, 0)}:host([color=info]){--bg:var(--cat-info-bg, 0, 115, 230);--fill:var(--cat-info-fill, 255, 255, 255);--text:var(--cat-info-text, 0, 115, 230)}:host([color=success]){--bg:var(--cat-success-bg, 0, 132, 88);--fill:var(--cat-success-fill, 255, 255, 255);--text:var(--cat-success-text, 0, 132, 88)}:host([color=warning]){--bg:var(--cat-warning-bg, 255, 206, 128);--fill:var(--cat-warning-fill, 0, 0, 0);--text:var(--cat-warning-text, 159, 97, 0)}:host([color=danger]){--bg:var(--cat-danger-bg, 217, 52, 13);--fill:var(--cat-danger-fill, 255, 255, 255);--text:var(--cat-danger-text, 217, 52, 13)}:host([size=xs]){height:1rem;min-width:1rem;font-size:0.75rem;padding:0 0.25rem}:host([size=s]){height:1.5rem;min-width:1.5rem;font-size:0.75rem;padding:0 0.5rem}:host([size=m]){height:2rem;min-width:2rem;font-size:0.875rem;padding:0 0.75rem}:host([size=l]){height:2.5rem;min-width:2.5rem;font-size:0.9375rem;padding:0 1rem}:host([size=xl]){height:3rem;min-width:3rem;font-size:1.125rem;padding:0 1rem}:host([pulse][variant=filled]){animation:1.5s ease 0s infinite normal none running pulse}:host([pulse][variant=outlined]){animation:1.5s ease 0s infinite normal none running pulse-outlined}@keyframes pulse{0%{box-shadow:0 0 0 0 rgb(var(--bg))}70%{box-shadow:transparent 0 0 0 0.5rem}100%{box-shadow:transparent 0 0 0 0}}@keyframes pulse-outlined{0%{box-shadow:0 0 0 0 rgb(var(--bg)), inset 0 0 0 1px rgba(var(--text), 0.2)}70%{box-shadow:transparent 0 0 0 0.5rem, inset 0 0 0 1px rgba(var(--text), 0.2)}100%{box-shadow:transparent 0 0 0 0, inset 0 0 0 1px rgba(var(--text), 0.2)}}";
+const CatBadgeStyle0 = catBadgeCss;
 
 const CatBadge = class {
     constructor(hostRef) {
@@ -920,11 +923,11 @@ const CatBadge = class {
         this.pulse = false;
     }
     render() {
-        return index.h("slot", null);
+        return index.h("slot", { key: '8254c840d9f008183db57fc58dd3a092c7a0378c' });
     }
     get hostElement() { return index.getElement(this); }
 };
-CatBadge.style = catBadgeCss;
+CatBadge.style = CatBadgeStyle0;
 
 const _breakpoints = ['xs', 's', 'm', 'l', 'xl'];
 const Breakpoints = {
@@ -1037,11 +1040,12 @@ function createEmptyStyleRule(query) {
         }
     }
     catch (e) {
-        of.loglevel.error(e);
+        of.log.error(e);
     }
 }
 
-const catButtonCss = ":host{display:inline-block;max-width:100%;vertical-align:middle;-webkit-user-select:none;-ms-user-select:none;user-select:none;}:host([hidden]){display:none}.cat-button{position:relative;font:inherit;display:flex;align-items:center;justify-content:center;border:none;border-radius:var(--cat-border-radius-m, 0.25rem);text-decoration:none;width:100%;box-sizing:border-box;cursor:pointer;transition:color 125ms linear, border-color 125ms linear, background-color 125ms linear, box-shadow 125ms linear}.cat-button:focus-visible{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:1px}.cat-button-content{display:flex;flex-direction:column;min-width:0}.cat-button-content-inner{word-wrap:break-word;word-break:break-word}.cat-button-ellipsed .cat-button-content-inner{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.cat-button-disabled{cursor:not-allowed}.cat-button-round{border-radius:10rem}.cat-button-loading{cursor:default}.cat-button-loading cat-spinner{position:absolute}.cat-button-loading>*:not(cat-spinner){visibility:hidden}.cat-group-button-first{border-top-right-radius:0;border-bottom-right-radius:0}.cat-group-button-middle{border-radius:0}.cat-group-button-last{border-top-left-radius:0;border-bottom-left-radius:0}.cat-group-button:hover{z-index:1}.cat-group-button:focus-visible{z-index:2}.cat-button-filled{background-color:rgb(var(--bg));color:rgb(var(--fill));font-weight:var(--cat-font-weight-button, 600);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:greyscale}.cat-button-filled.cat-button-disabled{--bg:242, 244, 247;--fill:var(--cat-font-color-muted, 81, 92, 108)}.cat-button-outlined{background-color:white;box-shadow:inset 0 0 0 1px rgba(var(--base), 0.2);color:rgb(var(--text))}.cat-button-outlined.cat-button-disabled{--base:var(--cat-font-color-muted, 81, 92, 108);--text:var(--cat-font-color-muted, 81, 92, 108)}.cat-button-outlined:hover:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-outlined.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-outlined:active:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-text{background-color:transparent;color:rgb(var(--text));text-decoration:var(--cat-link-button-decoration, none)}.cat-button-text.cat-button-disabled{--text:var(--cat-font-color-muted, 81, 92, 108)}.cat-button-text:hover:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-text.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-link{background-color:transparent;color:rgb(var(--text))}.cat-button-link.cat-button-disabled{--text:var(--cat-font-color-muted, 81, 92, 108)}.cat-button-link:hover:not(.cat-button-disabled):not(.cat-button-loading){text-decoration:var(--cat-link-decoration-hover, underline)}.cat-button-link.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading){text-decoration:var(--cat-link-decoration-hover, underline)}.cat-button-primary{--bg:var(--cat-primary-bg, 0, 129, 148);--fill:var(--cat-primary-fill, 255, 255, 255);--text:var(--cat-primary-text, 0, 129, 148);--base:var(--cat-primary-text, 0, 129, 148)}.cat-button-primary:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-primary-bg-hover, 1, 115, 132);--fill:var(--cat-primary-fill-hover, 255, 255, 255);--text:var(--cat-primary-text-hover, 1, 115, 132)}.cat-button-primary.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-primary:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-primary-bg-active, 2, 99, 113);--fill:var(--cat-primary-fill-active, 255, 255, 255);--text:var(--cat-primary-text-active, 2, 99, 113)}.cat-button-secondary{--bg:var(--cat-secondary-bg, 105, 118, 135);--fill:var(--cat-secondary-fill, 255, 255, 255);--text:var(--cat-secondary-text, 0, 0, 0);--base:var(--cat-secondary-bg, 105, 118, 135)}.cat-button-secondary:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-secondary-bg-hover, 105, 118, 135);--fill:var(--cat-secondary-fill-hover, 255, 255, 255);--text:var(--cat-secondary-text-hover, 0, 0, 0)}.cat-button-secondary.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-secondary:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-secondary-bg-active, 105, 118, 135);--fill:var(--cat-secondary-fill-active, 255, 255, 255);--text:var(--cat-secondary-text-active, 0, 0, 0)}.cat-button-info{--bg:var(--cat-success-bg, 0, 115, 230);--fill:var(--cat-success-fill, 255, 255, 255);--text:var(--cat-success-text, 0, 115, 230);--base:var(--cat-success-text, 0, 115, 230)}.cat-button-info:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-success-bg-hover, 0, 107, 227);--fill:var(--cat-success-fill-hover, 255, 255, 255);--text:var(--cat-success-text-hover, 0, 107, 227)}.cat-button-info.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-info:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-success-bg-active, 0, 96, 223);--fill:var(--cat-success-fill-active, 255, 255, 255);--text:var(--cat-success-text-active, 0, 96, 223)}.cat-button-success{--bg:var(--cat-success-bg, 0, 132, 88);--fill:var(--cat-success-fill, 255, 255, 255);--text:var(--cat-success-text, 0, 132, 88);--base:var(--cat-success-text, 0, 132, 88)}.cat-button-success:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-success-bg-hover, 0, 117, 78);--fill:var(--cat-success-fill-hover, 255, 255, 255);--text:var(--cat-success-text-hover, 0, 117, 78)}.cat-button-success.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-success:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-success-bg-active, 0, 105, 70);--fill:var(--cat-success-fill-active, 255, 255, 255);--text:var(--cat-success-text-active, 0, 105, 70)}.cat-button-warning{--bg:var(--cat-warning-bg, 255, 206, 128);--fill:var(--cat-warning-fill, 0, 0, 0);--text:var(--cat-warning-text, 159, 97, 0);--base:var(--cat-warning-text, 159, 97, 0)}.cat-button-warning:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-warning-bg-hover, 255, 214, 148);--fill:var(--cat-warning-fill-hover, 0, 0, 0);--text:var(--cat-warning-text-hover, 159, 97, 0)}.cat-button-warning.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-warning:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-warning-bg-active, 255, 222, 168);--fill:var(--cat-warning-fill-active, 0, 0, 0);--text:var(--cat-warning-text-active, 159, 97, 0)}.cat-button-danger{--bg:var(--cat-danger-bg, 217, 52, 13);--fill:var(--cat-danger-fill, 255, 255, 255);--text:var(--cat-danger-text, 217, 52, 13);--base:var(--cat-danger-text, 217, 52, 13)}.cat-button-danger:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-danger-bg-hover, 194, 46, 11);--fill:var(--cat-danger-fill-hover, 255, 255, 255);--text:var(--cat-danger-text-hover, 194, 46, 11)}.cat-button-danger.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-danger:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-danger-bg-active, 174, 42, 10);--fill:var(--cat-danger-fill-active, 255, 255, 255);--text:var(--cat-danger-text-active, 174, 42, 10)}:host(.cat-button-pull:not([size])){margin:-0.625rem -0.75rem}:host(.cat-button-pull-h:not([size])){margin-left:-0.75rem;margin-right:-0.75rem}:host(.cat-button-pull-v:not([size])){margin-top:-0.625rem;margin-bottom:-0.625rem}:host(.cat-button-pull-t:not([size])){margin-top:-0.625rem}:host(.cat-button-pull-l:not([size])){margin-left:-0.75rem}:host(.cat-button-pull-b:not([size])){margin-bottom:-0.625rem}:host(.cat-button-pull-r:not([size])){margin-right:-0.75rem}.cat-button-xs{min-width:1.5rem;padding:0.1875rem 0.25rem;font-size:0.875rem;line-height:1.125rem;gap:0.25rem}.cat-button-xs.cat-button-icon{width:1.5rem;height:1.5rem;padding:0}:host(.cat-button-pull[size=xs]){margin:-0.1875rem -0.25rem}:host(.cat-button-pull-h[size=xs]){margin-left:-0.25rem;margin-right:-0.25rem}:host(.cat-button-pull-v[size=xs]){margin-top:-0.1875rem;margin-bottom:-0.1875rem}:host(.cat-button-pull-t[size=xs]){margin-top:-0.1875rem}:host(.cat-button-pull-l[size=xs]){margin-left:-0.25rem}:host(.cat-button-pull-b[size=xs]){margin-bottom:-0.1875rem}:host(.cat-button-pull-r[size=xs]){margin-right:-0.25rem}.cat-button-s{min-width:2rem;padding:0.375rem 0.5rem;font-size:0.9375rem;line-height:1.25rem;gap:0.25rem}.cat-button-s cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-s.cat-button-icon{width:2rem;height:2rem;padding:0}:host(.cat-button-pull[size=s]){margin:-0.375rem -0.5rem}:host(.cat-button-pull-h[size=s]){margin-left:-0.5rem;margin-right:-0.5rem}:host(.cat-button-pull-v[size=s]){margin-top:-0.375rem;margin-bottom:-0.375rem}:host(.cat-button-pull-t[size=s]){margin-top:-0.375rem}:host(.cat-button-pull-l[size=s]){margin-left:-0.5rem}:host(.cat-button-pull-b[size=s]){margin-bottom:-0.375rem}:host(.cat-button-pull-r[size=s]){margin-right:-0.5rem}.cat-button-m{min-width:2.5rem;padding:0.625rem 0.75rem;font-size:0.9375rem;line-height:1.25rem;gap:0.25rem}.cat-button-m cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-m.cat-button-icon{width:2.5rem;height:2.5rem;padding:0}:host(.cat-button-pull[size=m]){margin:-0.625rem -0.75rem}:host(.cat-button-pull-h[size=m]){margin-left:-0.75rem;margin-right:-0.75rem}:host(.cat-button-pull-v[size=m]){margin-top:-0.625rem;margin-bottom:-0.625rem}:host(.cat-button-pull-t[size=m]){margin-top:-0.625rem}:host(.cat-button-pull-l[size=m]){margin-left:-0.75rem}:host(.cat-button-pull-b[size=m]){margin-bottom:-0.625rem}:host(.cat-button-pull-r[size=m]){margin-right:-0.75rem}.cat-button-l{min-width:3rem;padding:0.875rem 1rem;font-size:0.9375rem;line-height:1.25rem;gap:0.25rem}.cat-button-l cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-l.cat-button-icon{width:3rem;height:3rem;padding:0}:host(.cat-button-pull[size=l]){margin:-0.875rem -1rem}:host(.cat-button-pull-h[size=l]){margin-left:-1rem;margin-right:-1rem}:host(.cat-button-pull-v[size=l]){margin-top:-0.875rem;margin-bottom:-0.875rem}:host(.cat-button-pull-t[size=l]){margin-top:-0.875rem}:host(.cat-button-pull-l[size=l]){margin-left:-1rem}:host(.cat-button-pull-b[size=l]){margin-bottom:-0.875rem}:host(.cat-button-pull-r[size=l]){margin-right:-1rem}.cat-button-xl{min-width:3.5rem;padding:1rem 1.25rem;font-size:1.125rem;line-height:1.5rem;gap:0.25rem}.cat-button-xl.cat-button-icon{width:3.5rem;height:3.5rem;padding:0}:host(.cat-button-pull[size=xl]){margin:-1rem -1.25rem}:host(.cat-button-pull-h[size=xl]){margin-left:-1.25rem;margin-right:-1.25rem}:host(.cat-button-pull-v[size=xl]){margin-top:-1rem;margin-bottom:-1rem}:host(.cat-button-pull-t[size=xl]){margin-top:-1rem}:host(.cat-button-pull-l[size=xl]){margin-left:-1.25rem}:host(.cat-button-pull-b[size=xl]){margin-bottom:-1rem}:host(.cat-button-pull-r[size=xl]){margin-right:-1.25rem}:host(.cat-tab)::part(button){padding:1.125rem 0.75rem;--cat-secondary-bg:transparent;--cat-primary-text:transparent;--cat-danger-text:transparent}:host(.cat-tab)::part(content)::before{content:attr(data-text);content:attr(data-text)/\"\";height:0;visibility:hidden;overflow:hidden;user-select:none;pointer-events:none;font-weight:700}:host(.cat-text-left) .cat-button{justify-content:left}:host(.cat-text-right) .cat-button{justify-content:right}:host(.cat-nav-item){width:100%}:host(.cat-nav-item) .cat-button{box-shadow:none;justify-content:left;gap:0.5rem}:host(.cat-nav-item) .cat-button:focus-visible{outline-offset:-2px}";
+const catButtonCss = ":host{display:inline-block;max-width:100%;vertical-align:middle;-webkit-user-select:none;-ms-user-select:none;user-select:none;}:host([hidden]){display:none}.cat-button{position:relative;font:inherit;display:flex;align-items:center;justify-content:center;border:none;border-radius:var(--cat-border-radius-m, 0.25rem);text-decoration:none;width:100%;box-sizing:border-box;cursor:pointer;transition:color 125ms linear, border-color 125ms linear, background-color 125ms linear, box-shadow 125ms linear}.cat-button:focus-visible{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:1px}.cat-button-content{display:flex;flex-direction:column;min-width:0}.cat-button-content-inner{word-wrap:break-word;word-break:break-word}.cat-button-ellipsed .cat-button-content-inner{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.cat-button-disabled{cursor:not-allowed}.cat-button-round{border-radius:10rem}.cat-button-loading{cursor:default}.cat-button-loading cat-spinner{position:absolute}.cat-button-loading>*:not(cat-spinner){visibility:hidden}.cat-group-button-first{border-top-right-radius:0;border-bottom-right-radius:0}.cat-group-button-middle{border-radius:0}.cat-group-button-last{border-top-left-radius:0;border-bottom-left-radius:0}.cat-group-button:hover{z-index:1}.cat-group-button:focus-visible{z-index:2}.cat-button-filled{background-color:rgb(var(--bg));color:rgb(var(--fill));font-weight:var(--cat-font-weight-button, 600);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:greyscale}.cat-button-filled.cat-button-disabled{--bg:242, 244, 247;--fill:var(--cat-font-color-muted, 81, 92, 108)}.cat-button-outlined{background-color:white;box-shadow:inset 0 0 0 1px rgba(var(--base), 0.2);color:rgb(var(--text))}.cat-button-outlined.cat-button-disabled{--base:var(--cat-font-color-muted, 81, 92, 108);--text:var(--cat-font-color-muted, 81, 92, 108)}.cat-button-outlined:hover:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-outlined.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-outlined:active:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-text{background-color:transparent;color:rgb(var(--text));text-decoration:var(--cat-link-button-decoration, none)}.cat-button-text.cat-button-disabled{--text:var(--cat-font-color-muted, 81, 92, 108)}.cat-button-text:hover:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-text.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-link{background-color:transparent;color:rgb(var(--text))}.cat-button-link.cat-button-disabled{--text:var(--cat-font-color-muted, 81, 92, 108)}.cat-button-link:hover:not(.cat-button-disabled):not(.cat-button-loading){text-decoration:var(--cat-link-decoration-hover, underline)}.cat-button-link.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading){text-decoration:var(--cat-link-decoration-hover, underline)}.cat-button-primary{--bg:var(--cat-primary-bg, 0, 129, 148);--fill:var(--cat-primary-fill, 255, 255, 255);--text:var(--cat-primary-text, 0, 129, 148);--base:var(--cat-primary-text, 0, 129, 148)}.cat-button-primary:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-primary-bg-hover, 1, 115, 132);--fill:var(--cat-primary-fill-hover, 255, 255, 255);--text:var(--cat-primary-text-hover, 1, 115, 132)}.cat-button-primary.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-primary:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-primary-bg-active, 2, 99, 113);--fill:var(--cat-primary-fill-active, 255, 255, 255);--text:var(--cat-primary-text-active, 2, 99, 113)}.cat-button-secondary{--bg:var(--cat-secondary-bg, 105, 118, 135);--fill:var(--cat-secondary-fill, 255, 255, 255);--text:var(--cat-secondary-text, 0, 0, 0);--base:var(--cat-secondary-bg, 105, 118, 135)}.cat-button-secondary:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-secondary-bg-hover, 105, 118, 135);--fill:var(--cat-secondary-fill-hover, 255, 255, 255);--text:var(--cat-secondary-text-hover, 0, 0, 0)}.cat-button-secondary.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-secondary:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-secondary-bg-active, 105, 118, 135);--fill:var(--cat-secondary-fill-active, 255, 255, 255);--text:var(--cat-secondary-text-active, 0, 0, 0)}.cat-button-info{--bg:var(--cat-info-bg, 0, 115, 230);--fill:var(--cat-info-fill, 255, 255, 255);--text:var(--cat-info-text, 0, 115, 230);--base:var(--cat-info-text, 0, 115, 230)}.cat-button-info:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-info-bg-hover, 0, 107, 227);--fill:var(--cat-info-fill-hover, 255, 255, 255);--text:var(--cat-info-text-hover, 0, 107, 227)}.cat-button-info.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-info:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-info-bg-active, 0, 96, 223);--fill:var(--cat-info-fill-active, 255, 255, 255);--text:var(--cat-info-text-active, 0, 96, 223)}.cat-button-success{--bg:var(--cat-success-bg, 0, 132, 88);--fill:var(--cat-success-fill, 255, 255, 255);--text:var(--cat-success-text, 0, 132, 88);--base:var(--cat-success-text, 0, 132, 88)}.cat-button-success:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-success-bg-hover, 0, 117, 78);--fill:var(--cat-success-fill-hover, 255, 255, 255);--text:var(--cat-success-text-hover, 0, 117, 78)}.cat-button-success.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-success:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-success-bg-active, 0, 105, 70);--fill:var(--cat-success-fill-active, 255, 255, 255);--text:var(--cat-success-text-active, 0, 105, 70)}.cat-button-warning{--bg:var(--cat-warning-bg, 255, 206, 128);--fill:var(--cat-warning-fill, 0, 0, 0);--text:var(--cat-warning-text, 159, 97, 0);--base:var(--cat-warning-text, 159, 97, 0)}.cat-button-warning:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-warning-bg-hover, 255, 214, 148);--fill:var(--cat-warning-fill-hover, 0, 0, 0);--text:var(--cat-warning-text-hover, 159, 97, 0)}.cat-button-warning.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-warning:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-warning-bg-active, 255, 222, 168);--fill:var(--cat-warning-fill-active, 0, 0, 0);--text:var(--cat-warning-text-active, 159, 97, 0)}.cat-button-danger{--bg:var(--cat-danger-bg, 217, 52, 13);--fill:var(--cat-danger-fill, 255, 255, 255);--text:var(--cat-danger-text, 217, 52, 13);--base:var(--cat-danger-text, 217, 52, 13)}.cat-button-danger:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-danger-bg-hover, 194, 46, 11);--fill:var(--cat-danger-fill-hover, 255, 255, 255);--text:var(--cat-danger-text-hover, 194, 46, 11)}.cat-button-danger.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-danger:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-danger-bg-active, 174, 42, 10);--fill:var(--cat-danger-fill-active, 255, 255, 255);--text:var(--cat-danger-text-active, 174, 42, 10)}:host(.cat-button-pull:not([size])){margin:-0.625rem -0.75rem}:host(.cat-button-pull-h:not([size])){margin-left:-0.75rem;margin-right:-0.75rem}:host(.cat-button-pull-v:not([size])){margin-top:-0.625rem;margin-bottom:-0.625rem}:host(.cat-button-pull-t:not([size])){margin-top:-0.625rem}:host(.cat-button-pull-l:not([size])){margin-left:-0.75rem}:host(.cat-button-pull-b:not([size])){margin-bottom:-0.625rem}:host(.cat-button-pull-r:not([size])){margin-right:-0.75rem}.cat-button-xs{min-width:1.5rem;padding:0.1875rem 0.25rem;font-size:0.875rem;line-height:1.125rem;gap:0.25rem}.cat-button-xs.cat-button-icon{width:1.5rem;height:1.5rem;padding:0}:host(.cat-button-pull[size=xs]){margin:-0.1875rem -0.25rem}:host(.cat-button-pull-h[size=xs]){margin-left:-0.25rem;margin-right:-0.25rem}:host(.cat-button-pull-v[size=xs]){margin-top:-0.1875rem;margin-bottom:-0.1875rem}:host(.cat-button-pull-t[size=xs]){margin-top:-0.1875rem}:host(.cat-button-pull-l[size=xs]){margin-left:-0.25rem}:host(.cat-button-pull-b[size=xs]){margin-bottom:-0.1875rem}:host(.cat-button-pull-r[size=xs]){margin-right:-0.25rem}.cat-button-s{min-width:2rem;padding:0.375rem 0.5rem;font-size:0.9375rem;line-height:1.25rem;gap:0.25rem}.cat-button-s cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-s.cat-button-icon{width:2rem;height:2rem;padding:0}:host(.cat-button-pull[size=s]){margin:-0.375rem -0.5rem}:host(.cat-button-pull-h[size=s]){margin-left:-0.5rem;margin-right:-0.5rem}:host(.cat-button-pull-v[size=s]){margin-top:-0.375rem;margin-bottom:-0.375rem}:host(.cat-button-pull-t[size=s]){margin-top:-0.375rem}:host(.cat-button-pull-l[size=s]){margin-left:-0.5rem}:host(.cat-button-pull-b[size=s]){margin-bottom:-0.375rem}:host(.cat-button-pull-r[size=s]){margin-right:-0.5rem}.cat-button-m{min-width:2.5rem;padding:0.625rem 0.75rem;font-size:0.9375rem;line-height:1.25rem;gap:0.25rem}.cat-button-m cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-m.cat-button-icon{width:2.5rem;height:2.5rem;padding:0}:host(.cat-button-pull[size=m]){margin:-0.625rem -0.75rem}:host(.cat-button-pull-h[size=m]){margin-left:-0.75rem;margin-right:-0.75rem}:host(.cat-button-pull-v[size=m]){margin-top:-0.625rem;margin-bottom:-0.625rem}:host(.cat-button-pull-t[size=m]){margin-top:-0.625rem}:host(.cat-button-pull-l[size=m]){margin-left:-0.75rem}:host(.cat-button-pull-b[size=m]){margin-bottom:-0.625rem}:host(.cat-button-pull-r[size=m]){margin-right:-0.75rem}.cat-button-l{min-width:3rem;padding:0.875rem 1rem;font-size:0.9375rem;line-height:1.25rem;gap:0.25rem}.cat-button-l cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-l.cat-button-icon{width:3rem;height:3rem;padding:0}:host(.cat-button-pull[size=l]){margin:-0.875rem -1rem}:host(.cat-button-pull-h[size=l]){margin-left:-1rem;margin-right:-1rem}:host(.cat-button-pull-v[size=l]){margin-top:-0.875rem;margin-bottom:-0.875rem}:host(.cat-button-pull-t[size=l]){margin-top:-0.875rem}:host(.cat-button-pull-l[size=l]){margin-left:-1rem}:host(.cat-button-pull-b[size=l]){margin-bottom:-0.875rem}:host(.cat-button-pull-r[size=l]){margin-right:-1rem}.cat-button-xl{min-width:3.5rem;padding:1rem 1.25rem;font-size:1.125rem;line-height:1.5rem;gap:0.25rem}.cat-button-xl.cat-button-icon{width:3.5rem;height:3.5rem;padding:0}:host(.cat-button-pull[size=xl]){margin:-1rem -1.25rem}:host(.cat-button-pull-h[size=xl]){margin-left:-1.25rem;margin-right:-1.25rem}:host(.cat-button-pull-v[size=xl]){margin-top:-1rem;margin-bottom:-1rem}:host(.cat-button-pull-t[size=xl]){margin-top:-1rem}:host(.cat-button-pull-l[size=xl]){margin-left:-1.25rem}:host(.cat-button-pull-b[size=xl]){margin-bottom:-1rem}:host(.cat-button-pull-r[size=xl]){margin-right:-1.25rem}:host(.cat-tab)::part(button){padding:1.125rem 0.75rem;--cat-secondary-bg:transparent;--cat-primary-text:transparent;--cat-danger-text:transparent}:host(.cat-tab)::part(content)::before{content:attr(data-text);content:attr(data-text)/\"\";height:0;visibility:hidden;overflow:hidden;user-select:none;pointer-events:none;font-weight:700}:host(.cat-text-left) .cat-button{justify-content:left}:host(.cat-text-right) .cat-button{justify-content:right}:host(.cat-nav-item){width:100%}:host(.cat-nav-item) .cat-button{box-shadow:none;justify-content:left;gap:0.5rem}:host(.cat-nav-item) .cat-button:focus-visible{outline-offset:-2px}:host(.cat-time-format) .cat-button{border-radius:0}:host(.cat-date-toggle) .cat-button,:host(.cat-time-toggle) .cat-button{margin-left:-1px;border-top-left-radius:0;border-bottom-left-radius:0}:host(.cat-date-item) .cat-button:hover,:host(.cat-date-toggle) .cat-button:hover,:host(.cat-time-format) .cat-button:hover,:host(.cat-time-toggle) .cat-button:hover{z-index:1}:host(.cat-date-item) .cat-button:focus-visible,:host(.cat-date-toggle) .cat-button:focus-visible,:host(.cat-time-format) .cat-button:focus-visible,:host(.cat-time-toggle) .cat-button:focus-visible{z-index:2}:host(.cat-date-item) .cat-button{padding-left:0;padding-right:0}";
+const CatButtonStyle0 = catButtonCss;
 
 const CatButton = class {
     constructor(hostRef) {
@@ -1096,7 +1100,7 @@ const CatButton = class {
     }
     componentWillRender() {
         if (this.isIconButton && !this.a11yLabel) {
-            of.loglevel.warn('[A11y] Missing ARIA label on icon button', this);
+            of.log.warn('[A11y] Missing ARIA label on icon button', this);
         }
     }
     haltDisabledEvents(event) {
@@ -1206,9 +1210,10 @@ const CatButton = class {
         "iconOnly": ["onIconOnlyChanged"]
     }; }
 };
-CatButton.style = catButtonCss;
+CatButton.style = CatButtonStyle0;
 
 const catButtonGroupCss = ":host{position:relative;display:inline-flex;vertical-align:middle}::slotted(cat-button[variant=outlined]),::slotted(cat-button:not([variant])){margin-right:-1px}::slotted(cat-button[variant=outlined]:last-child),::slotted(cat-button:not([variant]):last-child){margin-right:0}";
+const CatButtonGroupStyle0 = catButtonGroupCss;
 
 const CatButtonGroup = class {
     constructor(hostRef) {
@@ -1217,7 +1222,7 @@ const CatButtonGroup = class {
         this.a11yLabel = undefined;
     }
     render() {
-        return (index.h(index.Host, { role: "group", "aria-label": this.a11yLabel }, index.h("slot", { onSlotchange: this.onSlotChange.bind(this) })));
+        return (index.h(index.Host, { key: '736974e0eb79714f8718e90cb4b533cff13e123f', role: "group", "aria-label": this.a11yLabel }, index.h("slot", { key: '7894f468e3e265b67b7eb1c670966d4b55c97ce2', onSlotchange: this.onSlotChange.bind(this) })));
     }
     onSlotChange() {
         this.formElements = Array.from(this.hostElement.querySelectorAll('cat-button'));
@@ -1227,19 +1232,20 @@ const CatButtonGroup = class {
     }
     get hostElement() { return index.getElement(this); }
 };
-CatButtonGroup.style = catButtonGroupCss;
+CatButtonGroup.style = CatButtonGroupStyle0;
 
 const catCardCss = ":host{display:block;border-radius:var(--cat-border-radius-l, 0.5rem);background-color:white;padding:1.25rem}:host([hidden]){display:none}::slotted(:last-child){margin-bottom:0 !important}::slotted(nav),::slotted(nav:last-child){margin:-1rem -1rem !important}::slotted(.cat-card-pull){margin:-1.25rem !important;width:calc(100% + 2.5rem) !important;height:calc(100% + 2.5rem) !important}::slotted(.cat-card-pull-h){margin-left:-1.25rem !important;margin-right:-1.25rem !important;width:calc(100% + 2.5rem) !important}::slotted(.cat-card-pull-v){margin-top:-1.25rem !important;margin-bottom:-1.25rem !important;height:calc(100% + 2.5rem) !important}::slotted(.cat-card-pull-t){margin-top:-1.25rem !important}::slotted(.cat-card-pull-l){margin-left:-1.25rem !important}::slotted(.cat-card-pull-r){margin-right:-1.25rem !important}::slotted(.cat-card-pull-b){margin-bottom:-1.25rem !important}";
+const CatCardStyle0 = catCardCss;
 
 const CatCard = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return index.h("slot", null);
+        return index.h("slot", { key: '58d43efd186dd1e2ee48363f501298ebb761f3ba' });
     }
 };
-CatCard.style = catCardCss;
+CatCard.style = CatCardStyle0;
 
 /**
  * CatFormHint is a functional component that represents the hint area of form elements.
@@ -1260,6 +1266,7 @@ const CatFormHint = props => {
 };
 
 const catCheckboxCss = ".hint-wrapper{flex:0 1 auto;display:flex;gap:0.5rem}.hint-section{flex:1 1 auto;display:flex;flex-direction:column;gap:0.25rem;color:rgb(var(--cat-font-color-muted, 81, 92, 108));font-size:0.875rem;line-height:1.125rem}.hint-section .input-hint,.hint-section ::slotted([slot=hint]){margin:0 !important}:host{display:flex;flex-direction:column;gap:0.5rem}:host([hidden]){display:none}label{flex:0 1 auto;display:flex;gap:0.5rem;font-size:0.9375rem;line-height:1.25rem;font-weight:var(--cat-font-weight-body, 400);-webkit-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;position:relative}.label-left{flex-direction:row-reverse}.label-left input{right:1px;left:unset}input{position:absolute;width:1.25rem;height:1.25rem;margin:0;opacity:0;cursor:inherit;left:1px;top:0.5px}.box-placeholder{width:calc(1.25rem + 2px);flex-shrink:0}.box{flex:0 0 auto;display:flex;position:relative;height:1.25rem;width:1.25rem;background-color:white;border:1px solid rgb(var(--cat-border-color-dark, 215, 219, 224));border-radius:var(--cat-border-radius-s, 0.125rem);transition:background-color 125ms ease, border-color 125ms ease;pointer-events:none}.box svg{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:16px;stroke-dashoffset:16px;transition:all 125ms ease;width:50%;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%) scale(0.99)}:checked+.box{background-color:rgb(var(--cat-primary-bg, 0, 129, 148));border-color:rgb(var(--cat-primary-bg, 0, 129, 148));stroke:rgb(var(--cat-primary-fill, 255, 255, 255))}:checked+.box .check{stroke-dashoffset:0}:indeterminate+.box{background-color:rgb(var(--cat-primary-bg, 0, 129, 148));border-color:rgb(var(--cat-primary-bg, 0, 129, 148));stroke:rgb(var(--cat-primary-fill, 255, 255, 255))}:indeterminate+.box .check{stroke-dashoffset:16px}:indeterminate+.box .dash{stroke-dashoffset:0}:focus-visible+.box{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:1px}.is-disabled .box{background-color:#f2f4f7;border-color:rgb(var(--cat-border-color-dark, 215, 219, 224));stroke:rgb(var(--cat-font-color-muted, 81, 92, 108))}:host(.cat-error) .box{border:1px solid rgb(var(--cat-danger-bg, 217, 52, 13))}:host(.cat-error) :checked+.box,:host(.cat-error) :indeterminate+.box{background-color:rgb(var(--cat-danger-bg, 217, 52, 13));border-color:rgb(var(--cat-danger-bg, 217, 52, 13));stroke:rgb(var(--cat-danger-fill, 255, 255, 255))}.label{flex:1 1 auto;min-width:0}.is-hidden .label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.is-disabled{cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}";
+const CatCheckboxStyle0 = catCheckboxCss;
 
 let nextUniqueId$8 = 0;
 const CatCheckbox = class {
@@ -1296,7 +1303,7 @@ const CatCheckbox = class {
         this.hasSlottedLabel = !!this.hostElement.querySelector('[slot="label"]');
         this.hasSlottedHint = !!this.hostElement.querySelector('[slot="hint"]');
         if (!this.label && !this.hasSlottedLabel) {
-            of.loglevel.warn('[A11y] Missing ARIA label on checkbox', this);
+            of.log.warn('[A11y] Missing ARIA label on checkbox', this);
         }
     }
     /**
@@ -1317,7 +1324,7 @@ const CatCheckbox = class {
         this.input.blur();
     }
     render() {
-        return (index.h(index.Host, null, index.h("label", { htmlFor: this.id, class: { 'is-hidden': this.labelHidden, 'is-disabled': this.disabled, 'label-left': this.labelLeft } }, index.h("input", { ...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 }), index.h("span", { class: "box", "aria-hidden": "true" }, index.h("svg", { class: "check", viewBox: "0 0 12 10" }, index.h("polyline", { points: "1.5 6 4.5 9 10.5 1" })), index.h("svg", { class: "dash", viewBox: "0 0 12 10" }, index.h("polyline", { points: "1.5 5 10.5 5" }))), index.h("span", { class: "label", part: "label" }, (this.hasSlottedLabel && index.h("slot", { name: "label" })) || this.label)), this.hasHint && (index.h("div", { class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, index.h("div", { class: "box-placeholder" }), index.h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }) })))));
+        return (index.h(index.Host, { key: '4717606c6860aa834b0be517a990e7c9b3d12ca4' }, index.h("label", { key: 'f10b076bce44f869fac2ba524c9b84a9d35540d4', htmlFor: this.id, class: { 'is-hidden': this.labelHidden, 'is-disabled': this.disabled, 'label-left': this.labelLeft } }, index.h("input", { key: '9c1ce8476f5336e1bda998998233f1576fa04304', ...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 }), index.h("span", { key: '54bfdef569a5653d8cf49c8138907e17525f282e', class: "box", "aria-hidden": "true" }, index.h("svg", { key: 'cdd7a17cbd71c788af281f83f936cae6f8ce7e52', class: "check", viewBox: "0 0 12 10" }, index.h("polyline", { key: 'ee39ce12ece8d32ad5aca05183ab43b49ca278c7', points: "1.5 6 4.5 9 10.5 1" })), index.h("svg", { key: '5593c28f8cd548031d6b3823e9491a4bcc8246e3', class: "dash", viewBox: "0 0 12 10" }, index.h("polyline", { key: '49e30776717be8566e6a135bf791918a93a6f429', points: "1.5 5 10.5 5" }))), index.h("span", { key: '4461a4d9e42548e5acea1e991b044f7b135f9b67', class: "label", part: "label" }, (this.hasSlottedLabel && index.h("slot", { name: "label" })) || this.label)), this.hasHint && (index.h("div", { class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, index.h("div", { class: "box-placeholder" }), index.h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }) })))));
     }
     get hasHint() {
         return !!this.hint || !!this.hasSlottedHint;
@@ -1339,7 +1346,389 @@ const CatCheckbox = class {
     }
     get hostElement() { return index.getElement(this); }
 };
-CatCheckbox.style = catCheckboxCss;
+CatCheckbox.style = CatCheckboxStyle0;
+
+function getDays(language, weekday = 'long') {
+    const date = new Date();
+    const firstDayOfWeek = (date.getUTCDate() - date.getUTCDay() + 7) % 7;
+    const format = new Intl.DateTimeFormat(language, { weekday }).format;
+    return [...Array(7).keys()].map(day => format(new Date(date.getTime()).setUTCDate(firstDayOfWeek + day)));
+}
+function getMonths(language, month = 'long') {
+    const date = new Date(0);
+    const format = new Intl.DateTimeFormat(language, { month }).format;
+    return [...Array(12).keys()].map(month => format(new Date(date.getTime()).setUTCMonth(month)));
+}
+function getWeekInfo(language) {
+    const locale = new Intl.Locale(language);
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const weekInfo = locale.getWeekInfo?.() ?? locale.weekInfo;
+    return {
+        firstDay: weekInfo?.firstDay ?? 1,
+        minDays: weekInfo?.minDays ?? 4,
+        weekend: weekInfo?.weekend ?? [6, 7]
+    };
+}
+function getFormat$1(language) {
+    const format = new Intl.DateTimeFormat(language, { year: 'numeric', month: '2-digit', day: '2-digit' })
+        .format(new Date(3456, 10, 22))
+        .replace('3456', 'YYYY')
+        .replace('56', 'YY')
+        .replace('11', 'MM')
+        .replace('22', 'DD');
+    return /^(YYYY|YY|MM|DD)\W(YYYY|YY|MM|DD)\W(YYYY|YY|MM|DD)$/.test(format) ? format : 'DD-MM-YYYY';
+}
+function getLocale$2(language) {
+    return {
+        prevYear: of.catI18nRegistry.t('datepicker.prevYear'),
+        nextYear: of.catI18nRegistry.t('datepicker.nextYear'),
+        prevMonth: of.catI18nRegistry.t('datepicker.prevMonth'),
+        nextMonth: of.catI18nRegistry.t('datepicker.nextMonth'),
+        arrowKeys: of.catI18nRegistry.t('datepicker.arrowKeys'),
+        today: of.catI18nRegistry.t('datepicker.today'),
+        change: of.catI18nRegistry.t('datepicker.change'),
+        choose: of.catI18nRegistry.t('datepicker.choose'),
+        formatStr: getFormat$1(language),
+        weekInfo: getWeekInfo(language),
+        days: {
+            short: getDays(language, 'short'),
+            long: getDays(language, 'long')
+        },
+        months: {
+            short: getMonths(language, 'short'),
+            long: getMonths(language, 'long')
+        }
+    };
+}
+
+function isLeapYear(year) {
+    return (year % 4 === 0 && year % 100 !== 0) || year % 400 === 0;
+}
+function addDays(date, n) {
+    return new Date(date.getFullYear(), date.getMonth(), date.getDate() + n);
+}
+function addMonth(date, n) {
+    const [year, month, day] = [date.getFullYear(), date.getMonth(), date.getDate()];
+    const maxDays = [31, isLeapYear(year) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
+    const newDate = new Date(date);
+    newDate.setDate(1);
+    newDate.setMonth(newDate.getMonth() + n);
+    newDate.setDate(Math.min(day, maxDays[(month + (n % 12) + 12) % 12]));
+    return newDate;
+}
+function isSameYear(date1, date2) {
+    return !!date1 && !!date2 && date1.getFullYear() === date2.getFullYear();
+}
+function isSameMonth(date1, date2) {
+    return !!date1 && !!date2 && date1.getMonth() === date2.getMonth() && isSameYear(date1, date2);
+}
+function isSameDay(date1, date2) {
+    return !!date1 && !!date2 && date1.getDate() === date2.getDate() && isSameMonth(date1, date2);
+}
+function clampDate(min, date, max) {
+    return new Date(Math.min(Math.max(date.getTime(), min?.getTime() ?? -Infinity), max?.getTime() ?? Infinity));
+}
+
+const catDateCss = ":host{display:block}:host([hidden]){display:none}.label-aria{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.picker{padding:1rem;display:inline-flex;flex-direction:column}.picker-head{display:flex;gap:0.5rem;align-items:center}.picker-head h3{flex:1;text-align:center;margin:0}.picker-grid{display:grid;grid-template-rows:2rem repeat(6, 1fr);grid-template-columns:2rem repeat(7, 1fr);grid-template-areas:\". h h h h h h h\" \"w d d d d d d d\" \"w d d d d d d d\" \"w d d d d d d d\" \"w d d d d d d d\" \"w d d d d d d d\" \"w d d d d d d d\";margin:1rem 0 0.5rem}.picker-grid-head{grid-area:h;display:grid;grid-template-columns:repeat(7, 1fr);place-items:end center;padding-bottom:0.5rem}.picker-grid-weeks{grid-area:w;display:grid;grid-template-rows:repeat(6, 1fr);place-items:center right;padding-right:0.5rem}.picker-grid-days{grid-area:d;display:grid;grid-template-rows:repeat(6, 1fr);grid-template-columns:repeat(7, 1fr)}.picker-grid-head>*,.picker-grid-weeks>*{font-size:0.75rem;line-height:1rem;font-weight:600;color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important;text-decoration:none}.date-other{opacity:0.5}.date-disabled{opacity:0.25}.picker-foot{display:flex;gap:1rem;align-items:center}.cursor-help{flex:1;margin:0;font-size:0.875rem;line-height:1.125rem;font-weight:var(--cat-font-weight-body, 400);color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important;text-align:center}.cursor-help.cursor-right{text-align:right}.cursor-aria{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}";
+const CatDateStyle0 = catDateCss;
+
+const CatDate = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.catChange = index.createEvent(this, "catChange", 7);
+        this.catFocus = index.createEvent(this, "catFocus", 7);
+        this.catBlur = index.createEvent(this, "catBlur", 7);
+        this.language = of.catI18nRegistry.getLocale();
+        this.locale = getLocale$2(this.language);
+        this.isOpen = false;
+        // additonally store the focus date to ensure correct focus after potential re-render
+        this.focusDate = null;
+        this.hasSlottedLabel = false;
+        this.hasSlottedHint = false;
+        this.viewDate = this.now;
+        this.selectionDate = null;
+        this.requiredMarker = 'optional';
+        this.horizontal = false;
+        this.autoComplete = undefined;
+        this.clearable = false;
+        this.disabled = false;
+        this.hint = undefined;
+        this.icon = undefined;
+        this.iconRight = false;
+        this.identifier = undefined;
+        this.label = '';
+        this.labelHidden = false;
+        this.max = undefined;
+        this.min = undefined;
+        this.name = undefined;
+        this.placeholder = undefined;
+        this.textPrefix = undefined;
+        this.textSuffix = undefined;
+        this.readonly = false;
+        this.required = false;
+        this.value = undefined;
+        this.errors = undefined;
+        this.errorUpdate = 0;
+        this.nativeAttributes = undefined;
+        this.placement = 'bottom-end';
+    }
+    get maxDate() {
+        const [y, m, d] = this.max?.split('-').map(Number) || [];
+        return this.max ? new Date(y, m - 1, d) : null;
+    }
+    get minDate() {
+        const [y, m, d] = this.min?.split('-').map(Number) || [];
+        return this.min ? new Date(y, m - 1, d) : null;
+    }
+    get now() {
+        const date = new Date();
+        return new Date(date.getFullYear(), date.getMonth(), date.getDate());
+    }
+    get focusedDate() {
+        const [all, year, month, day] = this.hostElement.shadowRoot
+            ?.querySelector(`[data-date]:focus`)
+            ?.dataset.date?.match(/^(\d{4})-(\d{2})-(\d{2})/) ?? [];
+        return all ? new Date(Number(year), Number(month) - 1, Number(day)) : null;
+    }
+    componentWillLoad() {
+        const [match, year, month, day] = this.value?.match(/^(\d{4})-(\d{2})-(\d{2})/) ?? [];
+        if (match) {
+            this.select(new Date(Number(year), Number(month) - 1, Number(day)));
+        }
+    }
+    componentWillRender() {
+        this.hasSlottedLabel = !!this.hostElement.querySelector('[slot="label"]');
+        this.hasSlottedHint = !!this.hostElement.querySelector('[slot="hint"]');
+    }
+    componentDidLoad() {
+        const format = this.locale.formatStr.replace('YYYY', 'Y').replace('YY', 'y').replace('MM', 'm').replace('DD', 'd');
+        const [, p1, d1, p2, p3] = /(\w+)([^\w]+)(\w+)[^\w]+(\w+)/.exec(format) || [];
+        this.input?.mask({
+            date: true,
+            dateMin: this.min,
+            dateMax: this.max,
+            delimiter: d1,
+            datePattern: [p1, p2, p3]
+        });
+    }
+    componentDidRender() {
+        if (this.focusDate) {
+            this.hostElement.shadowRoot
+                ?.querySelector(`[data-date="${this.toLocalISO(this.focusDate)}"]`)
+                ?.doFocus();
+            this.focusDate = null;
+        }
+    }
+    onOpen() {
+        this.isOpen = true;
+        this.setAriaLive('');
+        const viewDate = this.selectionDate
+            ? new Date(this.selectionDate.getFullYear(), this.selectionDate.getMonth(), 1)
+            : this.now;
+        this.viewDate = clampDate(this.minDate, viewDate, this.maxDate);
+    }
+    onClose() {
+        this.isOpen = false;
+    }
+    onKeyDown(e) {
+        if (!this.isOpen || !['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown'].includes(e.key)) {
+            return;
+        }
+        const focused = this.focusedDate;
+        if (!focused) {
+            e.preventDefault();
+            this.focus(this.selectionDate || this.now);
+        }
+        else if (e.key === 'ArrowLeft') {
+            e.preventDefault();
+            this.focus(e.shiftKey ? addMonth(focused, -1) : addDays(focused, -1));
+        }
+        else if (e.key === 'ArrowRight') {
+            e.preventDefault();
+            this.focus(e.shiftKey ? addMonth(focused, 1) : addDays(focused, 1));
+        }
+        else if (e.key === 'ArrowUp') {
+            e.preventDefault();
+            this.focus(addDays(focused, -7));
+        }
+        else if (e.key === 'ArrowDown') {
+            e.preventDefault();
+            this.focus(addDays(focused, 7));
+        }
+    }
+    /**
+     * Select a date in the picker.
+     *
+     * @param date The date to select.
+     */
+    async select(date) {
+        const oldValue = this.value;
+        const newDate = clampDate(this.minDate, new Date(date.getFullYear(), date.getMonth(), date.getDate()), this.maxDate);
+        this.focus(newDate);
+        this.selectionDate = newDate;
+        this.value = newDate.toISOString();
+        if (oldValue !== this.value) {
+            this.catChange.emit(this.value);
+        }
+    }
+    /**
+     * Programmatically move focus to the input. Use this method instead of
+     * `input.focus()`.
+     *
+     * @param options An optional object providing options to control aspects of
+     * the focusing process.
+     */
+    async doFocus(options) {
+        this.input?.doFocus(options);
+    }
+    /**
+     * Programmatically remove focus from the input. Use this method instead of
+     * `input.blur()`.
+     */
+    async doBlur() {
+        this.input?.doBlur();
+    }
+    /**
+     * Clear the input.
+     */
+    async clear() {
+        this.input?.clear();
+    }
+    render() {
+        const dateGrid = this.dateGrid(this.viewDate.getFullYear(), this.viewDate.getMonth());
+        return (index.h(index.Host, { key: 'ebb5f193ca43bc3306449c91d2e391cb25b3287c' }, index.h("cat-input", { key: '27292844d077a8d79022074a191c47e72736d2c5', class: "cat-date-input", ref: el => (this.input = el), requiredMarker: this.requiredMarker, horizontal: this.horizontal, 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, nativeAttributes: this.nativeAttributes, value: this.getInputValue(), onCatFocus: e => this.catFocus.emit(e.detail), onCatBlur: e => this.onInputBlur(e.detail) }, index.h("span", { key: 'e9c9ad5b5374fcf944396a7ae45ae61775336be4', slot: "label" }, this.label, index.h("span", { key: '5a05917857fdc967bb122e0403f64b8b71ecf08a', class: "label-aria" }, " (", this.locale.formatStr, ")")), index.h("cat-dropdown", { key: 'ac1b7f5e1efae2648fa82acb31059ab41d0adb55', slot: "addon", placement: this.placement, arrowNavigation: "none", noResize: true }, index.h("cat-button", { key: 'bfaabd6f8120333b497b262894489628beb1d886', slot: "trigger", icon: "$cat:datepicker-calendar", iconOnly: true, class: "cat-date-toggle", disabled: this.disabled, a11yLabel: this.selectionDate
+                ? `${this.locale.change}, ${this.getA11yLabelDay(this.selectionDate)}`
+                : this.locale.choose }), index.h("div", { key: '9cfb02ca034584dcdd23fadb5f41ca598552a605', class: "picker", slot: "content" }, index.h("div", { key: '4d09c5f3ca84346bbcc68f4c83f3413159b8b608', class: "picker-head" }, index.h("cat-button", { key: '9e8d1695f1a882f2388a2b57ccd8cc51e8b52483', icon: "$cat:datepicker-year-prev", iconOnly: true, size: "xs", variant: "text", "a11y-label": this.locale.prevYear, disabled: isSameYear(this.viewDate, this.minDate), onClick: () => this.navigate('prev', 'year'), "data-dropdown-no-close": true }), index.h("cat-button", { key: '5af1b092c2f0d13e5c12d49699e85ea5dded7580', icon: "$cat:datepicker-month-prev", iconOnly: true, size: "xs", variant: "text", "a11y-label": this.locale.prevMonth, disabled: isSameMonth(this.viewDate, this.minDate), onClick: () => this.navigate('prev', 'month'), "data-dropdown-no-close": true }), index.h("h3", { key: 'cd730386e0fc19a4b12ee2910e6de7f079133584' }, this.getHeadline()), index.h("cat-button", { key: 'f0c76ac04573977e255956d2e377dd197080a5b8', icon: "$cat:datepicker-month-next", iconOnly: true, size: "xs", variant: "text", "a11y-label": this.locale.nextMonth, disabled: isSameMonth(this.viewDate, this.maxDate), onClick: () => this.navigate('next', 'month'), "data-dropdown-no-close": true }), index.h("cat-button", { key: 'd58917e0665df029acc6dac35e7ab05eab60f9d4', icon: "$cat:datepicker-year-next", iconOnly: true, size: "xs", variant: "text", "a11y-label": this.locale.nextYear, disabled: isSameYear(this.viewDate, this.maxDate), onClick: () => this.navigate('next', 'year'), "data-dropdown-no-close": true })), index.h("div", { key: '5307170ba72c90fceef4276aa5feb74dc569c74d', class: "picker-grid", onFocusin: () => this.setAriaLive(this.locale.arrowKeys) }, index.h("div", { key: 'acd6b0e720722ed3e3d013463645fe294a75b68d', class: "picker-grid-head" }, Array.from(Array(7), (_, i) => (index.h("abbr", { title: this.locale.days.long[i] }, this.locale.days.short[i])))), index.h("div", { key: 'a8b349d48f3595b7a29a037fb48b130dfb9af438', class: "picker-grid-weeks" }, dateGrid
+            .filter((_, i) => i % 7 === 0)
+            .map(day => (index.h("div", null, this.getWeekNumber(day))))), index.h("div", { key: '1e7750157710763ad977d866bb2e511b6ec44d03', class: "picker-grid-days" }, dateGrid.map(day => (index.h("cat-button", { class: {
+                'cat-date-item': true,
+                'date-other': !isSameMonth(this.viewDate, day),
+                'date-today': isSameDay(this.now, day),
+                'date-selected': isSameDay(this.selectionDate, day),
+                'date-focusable': this.canFocus(day),
+                'date-disabled': !this.canClick(day)
+            }, nativeAttributes: !this.canFocus(day) ? { tabindex: '-1' } : {}, variant: isSameDay(this.selectionDate, day) ? 'filled' : isSameDay(this.now, day) ? 'outlined' : 'text', a11yLabel: this.getA11yLabelDay(day), active: isSameDay(this.selectionDate, day), color: isSameDay(this.selectionDate, day) || isSameDay(this.now, day) ? 'primary' : 'secondary', disabled: !this.canClick(day), onClick: () => this.select(day), "data-date": this.toLocalISO(day) }, day.getDate()))))), index.h("div", { key: 'd8874097357312b5ddd4bda5e4018d3e642aaf99', class: "picker-foot" }, this.canClick(this.now) && (index.h("cat-button", { size: "s", "data-dropdown-no-close": true, onClick: () => this.select(this.now) }, this.locale.today)), index.h("p", { key: '42d936d44ef0cb07375415ae42a95565cd7f342b', class: {
+                'cursor-help': true,
+                'cursor-right': this.canClick(this.now)
+            } }, this.locale.arrowKeys), index.h("p", { key: '6df5566486d5082b3c2cb79fde22cedd7608c8bf', class: "cursor-aria", "aria-live": "polite" })))))));
+    }
+    parse(value) {
+        const [, p1, d1, p2, p3] = /(\w+)([^\w]+)(\w+)[^\w]+(\w+)/.exec(this.locale.formatStr) || [];
+        const formatParts = [p1, p2, p3];
+        const parts = value.split(d1).map(s => Number(s || 'x'));
+        let year = parts[formatParts.indexOf('YYYY') || formatParts.indexOf('YY')] || this.now.getFullYear();
+        const month = parts[formatParts.indexOf('MM')];
+        const day = parts[formatParts.indexOf('DD')];
+        if (!Number.isInteger(month) || !Number.isInteger(day)) {
+            return null;
+        }
+        else if (year < 100) {
+            year += year < 50 ? 2000 : 1900;
+        }
+        return new Date(year, month - 1, day);
+    }
+    focus(date) {
+        this.focusDate = clampDate(this.minDate, date, this.maxDate);
+        this.viewDate = new Date(this.focusDate.getFullYear(), this.focusDate.getMonth());
+        this.hostElement.shadowRoot
+            ?.querySelector(`[data-date="${this.toLocalISO(this.focusDate)}"]`)
+            ?.doFocus();
+    }
+    navigate(direction, period) {
+        this.viewDate = new Date(direction === 'prev'
+            ? period === 'year'
+                ? this.viewDate.setFullYear(this.viewDate.getFullYear() - 1)
+                : this.viewDate.setMonth(this.viewDate.getMonth() - 1)
+            : period === 'year'
+                ? this.viewDate.setFullYear(this.viewDate.getFullYear() + 1)
+                : this.viewDate.setMonth(this.viewDate.getMonth() + 1));
+        // announce the new month and year
+        this.setAriaLive(this.getHeadline());
+    }
+    setAriaLive(text) {
+        const node = this.hostElement.shadowRoot?.querySelector('.cursor-aria');
+        if (node) {
+            node.innerHTML = text;
+        }
+    }
+    onInputBlur(e) {
+        if (!this.input) {
+            return;
+        }
+        const oldValue = this.value;
+        const value = this.parse(this.input.value ?? '');
+        this.selectionDate = value ? clampDate(this.minDate, value, this.maxDate) : value;
+        this.value = this.selectionDate?.toISOString();
+        if (oldValue !== this.value) {
+            this.catChange.emit(this.value);
+        }
+        this.input.value = this.getInputValue();
+        this.catBlur.emit(e);
+    }
+    dateGrid(year, month) {
+        const firstDayOfWeek = new Date(year, month, 1).getDay();
+        const daysInMonth = new Date(year, month + 1, 0).getDate();
+        const days = [...Array(daysInMonth).keys()];
+        const daysBefore = [...Array(firstDayOfWeek).keys()].map(day => new Date(year, month, day - firstDayOfWeek).getDate());
+        const daysAfter = [...Array(42 - days.length - daysBefore.length).keys()];
+        return [
+            ...daysBefore.map(day => new Date(year, month - 1, day + 1)),
+            ...days.map(day => new Date(year, month, day + 1)),
+            ...daysAfter.map(day => new Date(year, month + 1, day + 1))
+        ];
+    }
+    getHeadline() {
+        return `${this.locale.months.long[this.viewDate.getMonth()]} ${this.viewDate.getFullYear()}`;
+    }
+    getInputValue() {
+        const format = new Intl.DateTimeFormat(this.language, { year: 'numeric', month: '2-digit', day: '2-digit' });
+        return this.selectionDate ? format.format(this.selectionDate) : '';
+    }
+    getA11yLabelDay(date) {
+        const format = new Intl.DateTimeFormat(this.language, {
+            year: 'numeric',
+            month: 'long',
+            day: 'numeric',
+            weekday: 'long'
+        });
+        return format.format(date);
+    }
+    getWeekNumber(date, iso8601 = true) {
+        const currentDate = new Date(date.getTime());
+        const dayNum = iso8601 ? currentDate.getDay() || 7 : currentDate.getDay();
+        currentDate.setDate(currentDate.getDate() + 4 - dayNum);
+        const yearStart = new Date(currentDate.getFullYear(), 0, 1);
+        return Math.ceil(((+currentDate - +yearStart) / 86400000 + 1) / 7);
+    }
+    canFocus(date) {
+        const now = this.now;
+        const focused = this.focusedDate;
+        if (focused && isSameMonth(focused, this.viewDate)) {
+            return isSameMonth(focused, date) && isSameDay(focused, date);
+        }
+        else if (this.selectionDate && isSameMonth(this.selectionDate, this.viewDate)) {
+            return isSameMonth(this.selectionDate, date) && isSameDay(this.selectionDate, date);
+        }
+        else if (isSameMonth(this.viewDate, now) && (!this.minDate || this.minDate <= now)) {
+            return isSameMonth(this.viewDate, date) && isSameDay(now, date);
+        }
+        const minDay = isSameMonth(date, this.minDate) ? this.minDate?.getDate() ?? 1 : 1;
+        return isSameMonth(this.viewDate, date) && date.getDate() === minDay;
+    }
+    canClick(date) {
+        const min = this.minDate;
+        const max = this.maxDate;
+        return (!min || min <= date) && (!max || max >= date);
+    }
+    toLocalISO(date) {
+        const year = date.getFullYear();
+        const month = (date.getMonth() + 1).toString().padStart(2, '0');
+        const day = date.getDate().toString().padStart(2, '0');
+        return `${year}-${month}-${day}`;
+    }
+    get hostElement() { return index.getElement(this); }
+};
+CatDate.style = CatDateStyle0;
 
 var HOOKS = [
     "onChange",
@@ -3903,7 +4292,9 @@ function findClosest(selector, element) {
     return nextElement ? findClosest(selector, nextElement) : null;
 }
 
-var weekSelect = of.createCommonjsModule(function (module, exports) {
+var weekSelect = {exports: {}};
+
+(function (module, exports) {
 (function (global, factory) {
   module.exports = factory() ;
 }(of.commonjsGlobal, (function () {
@@ -4000,11 +4391,13 @@ var weekSelect = of.createCommonjsModule(function (module, exports) {
   return weekSelectPlugin;
 
 })));
-});
+}(weekSelect));
+
+const weekSelectPlugin = weekSelect.exports;
 
 function getConfig(options, more = {}) {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    const plugins = options.mode === 'week' ? [new weekSelect({})] : [];
+    const plugins = options.mode === 'week' ? [new weekSelectPlugin({})] : [];
     const format = dateFormat(options.mode);
     return {
         ...more,
@@ -4098,7 +4491,7 @@ function getFormat(language, mode) {
             .replace(/AM|PM/i, 'K');
 }
 
-function getHour12(language) {
+function getHour12$1(language) {
     const dateStr = new Intl.DateTimeFormat(language, { hour: '2-digit', minute: '2-digit' })
         .format(new Date())
         .toLowerCase();
@@ -4121,7 +4514,7 @@ function monthsForLocale(language, month = 'long') {
     const format = new Intl.DateTimeFormat(language, { month }).format;
     return [...Array(12).keys()].map(month => format(new Date(date.getTime()).setUTCMonth(month)));
 }
-function getLocale(language) {
+function getLocale$1(language) {
     return {
         firstDayOfWeek: getFirstDayOfWeek(language),
         rangeSeparator: ' - ',
@@ -4132,7 +4525,7 @@ function getLocale(language) {
         minuteAriaLabel: of.catI18nRegistry.t('datepicker.minute'),
         toggleTitle: of.catI18nRegistry.t('datepicker.toggle'),
         scrollTitle: of.catI18nRegistry.t('datepicker.scroll'),
-        time_24hr: !getHour12(language),
+        time_24hr: !getHour12$1(language),
         weekdays: {
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             shorthand: daysForLocale(language, 'short'),
@@ -4148,14 +4541,8 @@ function getLocale(language) {
     };
 }
 
-const min = Math.min;
-const max = Math.max;
-const round = Math.round;
-const floor = Math.floor;
-const createCoords = v => ({
-  x: v,
-  y: v
-});
+const min$1 = Math.min;
+const max$1 = Math.max;
 const oppositeSideMap = {
   left: 'right',
   right: 'left',
@@ -4167,7 +4554,7 @@ const oppositeAlignmentMap = {
   end: 'start'
 };
 function clamp(start, value, end) {
-  return max(start, min(value, end));
+  return max$1(start, min$1(value, end));
 }
 function evaluate(value, param) {
   return typeof value === 'function' ? value(param) : value;
@@ -4485,7 +4872,7 @@ async function detectOverflow(state, options) {
  * clipping boundary. Alternative to `autoPlacement`.
  * @see https://floating-ui.com/docs/flip
  */
-const flip = function (options) {
+const flip$1 = function (options) {
   if (options === void 0) {
     options = {};
   }
@@ -4671,7 +5058,7 @@ const offset = function (options) {
  * keep it in view when it will overflow the clipping boundary.
  * @see https://floating-ui.com/docs/shift
  */
-const shift = function (options) {
+const shift$1 = function (options) {
   if (options === void 0) {
     options = {};
   }
@@ -4746,7 +5133,7 @@ const shift = function (options) {
  * width of the reference element.
  * @see https://floating-ui.com/docs/size
  */
-const size = function (options) {
+const size$1 = function (options) {
   if (options === void 0) {
     options = {};
   }
@@ -4788,20 +5175,20 @@ const size = function (options) {
       let availableWidth = overflowAvailableWidth;
       if (isYAxis) {
         const maximumClippingWidth = width - overflow.left - overflow.right;
-        availableWidth = alignment || noShift ? min(overflowAvailableWidth, maximumClippingWidth) : maximumClippingWidth;
+        availableWidth = alignment || noShift ? min$1(overflowAvailableWidth, maximumClippingWidth) : maximumClippingWidth;
       } else {
         const maximumClippingHeight = height - overflow.top - overflow.bottom;
-        availableHeight = alignment || noShift ? min(overflowAvailableHeight, maximumClippingHeight) : maximumClippingHeight;
+        availableHeight = alignment || noShift ? min$1(overflowAvailableHeight, maximumClippingHeight) : maximumClippingHeight;
       }
       if (noShift && !alignment) {
-        const xMin = max(overflow.left, 0);
-        const xMax = max(overflow.right, 0);
-        const yMin = max(overflow.top, 0);
-        const yMax = max(overflow.bottom, 0);
+        const xMin = max$1(overflow.left, 0);
+        const xMax = max$1(overflow.right, 0);
+        const yMin = max$1(overflow.top, 0);
+        const yMax = max$1(overflow.bottom, 0);
         if (isYAxis) {
-          availableWidth = width - 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : max(overflow.left, overflow.right));
+          availableWidth = width - 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : max$1(overflow.left, overflow.right));
         } else {
-          availableHeight = height - 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : max(overflow.top, overflow.bottom));
+          availableHeight = height - 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : max$1(overflow.top, overflow.bottom));
         }
       }
       await apply({
@@ -4822,6 +5209,19 @@ const size = function (options) {
   };
 };
 
+/**
+ * Custom positioning reference element.
+ * @see https://floating-ui.com/docs/virtual-elements
+ */
+const min = Math.min;
+const max = Math.max;
+const round = Math.round;
+const floor = Math.floor;
+const createCoords = v => ({
+  x: v,
+  y: v
+});
+
 function getNodeName(node) {
   if (isNode(node)) {
     return (node.nodeName || '').toLowerCase();
@@ -4833,7 +5233,7 @@ function getNodeName(node) {
 }
 function getWindow(node) {
   var _node$ownerDocument;
-  return (node == null ? void 0 : (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
+  return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
 }
 function getDocumentElement(node) {
   var _ref;
@@ -5050,8 +5450,9 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
   if (domElement) {
     const win = getWindow(domElement);
     const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
-    let currentIFrame = win.frameElement;
-    while (currentIFrame && offsetParent && offsetWin !== win) {
+    let currentWin = win;
+    let currentIFrame = currentWin.frameElement;
+    while (currentIFrame && offsetParent && offsetWin !== currentWin) {
       const iframeScale = getScale(currentIFrame);
       const iframeRect = currentIFrame.getBoundingClientRect();
       const css = getComputedStyle$1(currentIFrame);
@@ -5063,7 +5464,8 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
       height *= iframeScale.y;
       x += left;
       y += top;
-      currentIFrame = getWindow(currentIFrame).frameElement;
+      currentWin = getWindow(currentIFrame);
+      currentIFrame = currentWin.frameElement;
     }
   }
   return rectToClientRect({
@@ -5074,15 +5476,28 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
   });
 }
 
+const topLayerSelectors = [':popover-open', ':modal'];
+function isTopLayer(floating) {
+  return topLayerSelectors.some(selector => {
+    try {
+      return floating.matches(selector);
+    } catch (e) {
+      return false;
+    }
+  });
+}
+
 function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
   let {
+    elements,
     rect,
     offsetParent,
     strategy
   } = _ref;
-  const isOffsetParentAnElement = isHTMLElement(offsetParent);
+  const isFixed = strategy === 'fixed';
   const documentElement = getDocumentElement(offsetParent);
-  if (offsetParent === documentElement) {
+  const topLayer = elements ? isTopLayer(elements.floating) : false;
+  if (offsetParent === documentElement || topLayer && isFixed) {
     return rect;
   }
   let scroll = {
@@ -5091,7 +5506,8 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
   };
   let scale = createCoords(1);
   const offsets = createCoords(0);
-  if (isOffsetParentAnElement || !isOffsetParentAnElement && strategy !== 'fixed') {
+  const isOffsetParentAnElement = isHTMLElement(offsetParent);
+  if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
     if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
       scroll = getNodeScroll(offsetParent);
     }
@@ -5272,7 +5688,14 @@ function getClippingRect(_ref) {
 }
 
 function getDimensions(element) {
-  return getCssDimensions(element);
+  const {
+    width,
+    height
+  } = getCssDimensions(element);
+  return {
+    width,
+    height
+  };
 }
 
 function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
@@ -5297,9 +5720,11 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
       offsets.x = getWindowScrollBarX(documentElement);
     }
   }
+  const x = rect.left + scroll.scrollLeft - offsets.x;
+  const y = rect.top + scroll.scrollTop - offsets.y;
   return {
-    x: rect.left + scroll.scrollLeft - offsets.x,
-    y: rect.top + scroll.scrollTop - offsets.y,
+    x,
+    y,
     width: rect.width,
     height: rect.height
   };
@@ -5319,7 +5744,7 @@ function getTrueOffsetParent(element, polyfill) {
 // such as table ancestors and cross browser bugs.
 function getOffsetParent(element, polyfill) {
   const window = getWindow(element);
-  if (!isHTMLElement(element)) {
+  if (!isHTMLElement(element) || isTopLayer(element)) {
     return window;
   }
   let offsetParent = getTrueOffsetParent(element, polyfill);
@@ -5332,20 +5757,15 @@ function getOffsetParent(element, polyfill) {
   return offsetParent || getContainingBlock(element) || window;
 }
 
-const getElementRects = async function (_ref) {
-  let {
-    reference,
-    floating,
-    strategy
-  } = _ref;
+const getElementRects = async function (data) {
   const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
   const getDimensionsFn = this.getDimensions;
   return {
-    reference: getRectRelativeToOffsetParent(reference, await getOffsetParentFn(floating), strategy),
+    reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
     floating: {
       x: 0,
       y: 0,
-      ...(await getDimensionsFn(floating))
+      ...(await getDimensionsFn(data.floating))
     }
   };
 };
@@ -5373,8 +5793,9 @@ function observeMove(element, onMove) {
   let timeoutId;
   const root = getDocumentElement(element);
   function cleanup() {
+    var _io;
     clearTimeout(timeoutId);
-    io && io.disconnect();
+    (_io = io) == null || _io.disconnect();
     io = null;
   }
   function refresh(skip, threshold) {
@@ -5480,7 +5901,8 @@ function autoUpdate(reference, floating, update, options) {
         resizeObserver.unobserve(floating);
         cancelAnimationFrame(reobserveFrame);
         reobserveFrame = requestAnimationFrame(() => {
-          resizeObserver && resizeObserver.observe(floating);
+          var _resizeObserver;
+          (_resizeObserver = resizeObserver) == null || _resizeObserver.observe(floating);
         });
       }
       update();
@@ -5505,12 +5927,13 @@ function autoUpdate(reference, floating, update, options) {
   }
   update();
   return () => {
+    var _resizeObserver2;
     ancestors.forEach(ancestor => {
       ancestorScroll && ancestor.removeEventListener('scroll', update);
       ancestorResize && ancestor.removeEventListener('resize', update);
     });
-    cleanupIo && cleanupIo();
-    resizeObserver && resizeObserver.disconnect();
+    cleanupIo == null || cleanupIo();
+    (_resizeObserver2 = resizeObserver) == null || _resizeObserver2.disconnect();
     resizeObserver = null;
     if (animationFrame) {
       cancelAnimationFrame(frameId);
@@ -5518,10 +5941,32 @@ function autoUpdate(reference, floating, update, options) {
   };
 }
 
+/**
+ * Optimizes the visibility of the floating element by shifting it in order to
+ * keep it in view when it will overflow the clipping boundary.
+ * @see https://floating-ui.com/docs/shift
+ */
+const shift = shift$1;
+
+/**
+ * Optimizes the visibility of the floating element by flipping the `placement`
+ * in order to keep it in view when the preferred placement(s) will overflow the
+ * clipping boundary. Alternative to `autoPlacement`.
+ * @see https://floating-ui.com/docs/flip
+ */
+const flip = flip$1;
+
+/**
+ * Provides data that allows you to change the size of the floating element —
+ * for instance, prevent it from overflowing the clipping boundary or match the
+ * width of the reference element.
+ * @see https://floating-ui.com/docs/size
+ */
+const size = size$1;
+
 /**
  * Computes the `x` and `y` coordinates that will place the floating element
- * next to a reference element when it is given a certain CSS positioning
- * strategy.
+ * next to a given reference element.
  */
 const computePosition = (reference, floating, options) => {
   // This caches the expensive `getClippingElementAncestors` function so that
@@ -5543,6 +5988,7 @@ const computePosition = (reference, floating, options) => {
 };
 
 const catDatepickerCss = "@charset \"UTF-8\";.flatpickr-calendar{background:transparent;opacity:0;display:none;text-align:center;visibility:hidden;padding:0;-webkit-animation:none;animation:none;direction:ltr;border:0;font-size:14px;line-height:24px;border-radius:5px;position:absolute;width:307.875px;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-touch-action:manipulation;touch-action:manipulation;background:#fff;-webkit-box-shadow:1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0,0,0,0.08);box-shadow:1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0,0,0,0.08)}.flatpickr-calendar.open,.flatpickr-calendar.inline{opacity:1;max-height:640px;visibility:visible}.flatpickr-calendar.open{display:inline-block;z-index:99999}.flatpickr-calendar.animate.open{-webkit-animation:fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);animation:fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1)}.flatpickr-calendar.inline{display:block;position:relative;top:2px}.flatpickr-calendar.static{position:absolute;top:calc(100% + 2px)}.flatpickr-calendar.static.open{z-index:999;display:block}.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7){-webkit-box-shadow:none !important;box-shadow:none !important}.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1){-webkit-box-shadow:-2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;box-shadow:-2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6}.flatpickr-calendar .hasWeeks .dayContainer,.flatpickr-calendar .hasTime .dayContainer{border-bottom:0;border-bottom-right-radius:0;border-bottom-left-radius:0}.flatpickr-calendar .hasWeeks .dayContainer{border-left:0}.flatpickr-calendar.hasTime .flatpickr-time{height:40px;border-top:1px solid #e6e6e6}.flatpickr-calendar.noCalendar.hasTime .flatpickr-time{height:auto}.flatpickr-calendar:before,.flatpickr-calendar:after{position:absolute;display:block;pointer-events:none;border:solid transparent;content:'';height:0;width:0;left:22px}.flatpickr-calendar.rightMost:before,.flatpickr-calendar.arrowRight:before,.flatpickr-calendar.rightMost:after,.flatpickr-calendar.arrowRight:after{left:auto;right:22px}.flatpickr-calendar.arrowCenter:before,.flatpickr-calendar.arrowCenter:after{left:50%;right:50%}.flatpickr-calendar:before{border-width:5px;margin:0 -5px}.flatpickr-calendar:after{border-width:4px;margin:0 -4px}.flatpickr-calendar.arrowTop:before,.flatpickr-calendar.arrowTop:after{bottom:100%}.flatpickr-calendar.arrowTop:before{border-bottom-color:#e6e6e6}.flatpickr-calendar.arrowTop:after{border-bottom-color:#fff}.flatpickr-calendar.arrowBottom:before,.flatpickr-calendar.arrowBottom:after{top:100%}.flatpickr-calendar.arrowBottom:before{border-top-color:#e6e6e6}.flatpickr-calendar.arrowBottom:after{border-top-color:#fff}.flatpickr-calendar:focus{outline:0}.flatpickr-wrapper{position:relative;display:inline-block}.flatpickr-months{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}.flatpickr-months .flatpickr-month{background:transparent;color:rgba(0,0,0,0.9);fill:rgba(0,0,0,0.9);height:34px;line-height:1;text-align:center;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;overflow:hidden;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1}.flatpickr-months .flatpickr-prev-month,.flatpickr-months .flatpickr-next-month{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-decoration:none;cursor:pointer;position:absolute;top:0;height:34px;padding:10px;z-index:3;color:rgba(0,0,0,0.9);fill:rgba(0,0,0,0.9)}.flatpickr-months .flatpickr-prev-month.flatpickr-disabled,.flatpickr-months .flatpickr-next-month.flatpickr-disabled{display:none}.flatpickr-months .flatpickr-prev-month i,.flatpickr-months .flatpickr-next-month i{position:relative}.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month,.flatpickr-months .flatpickr-next-month.flatpickr-prev-month{left:0;}.flatpickr-months .flatpickr-prev-month.flatpickr-next-month,.flatpickr-months .flatpickr-next-month.flatpickr-next-month{right:0;}.flatpickr-months .flatpickr-prev-month:hover,.flatpickr-months .flatpickr-next-month:hover{color:#959ea9}.flatpickr-months .flatpickr-prev-month:hover svg,.flatpickr-months .flatpickr-next-month:hover svg{fill:#f64747}.flatpickr-months .flatpickr-prev-month svg,.flatpickr-months .flatpickr-next-month svg{width:14px;height:14px}.flatpickr-months .flatpickr-prev-month svg path,.flatpickr-months .flatpickr-next-month svg path{-webkit-transition:fill 0.1s;transition:fill 0.1s;fill:inherit}.numInputWrapper{position:relative;height:auto}.numInputWrapper input,.numInputWrapper span{display:inline-block}.numInputWrapper input{width:100%}.numInputWrapper input::-ms-clear{display:none}.numInputWrapper input::-webkit-outer-spin-button,.numInputWrapper input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}.numInputWrapper span{position:absolute;right:0;width:14px;padding:0 4px 0 2px;height:50%;line-height:50%;opacity:0;cursor:pointer;border:1px solid rgba(57,57,57,0.15);-webkit-box-sizing:border-box;box-sizing:border-box}.numInputWrapper span:hover{background:rgba(0,0,0,0.1)}.numInputWrapper span:active{background:rgba(0,0,0,0.2)}.numInputWrapper span:after{display:block;content:\"\";position:absolute}.numInputWrapper span.arrowUp{top:0;border-bottom:0}.numInputWrapper span.arrowUp:after{border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:4px solid rgba(57,57,57,0.6);top:26%}.numInputWrapper span.arrowDown{top:50%}.numInputWrapper span.arrowDown:after{border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid rgba(57,57,57,0.6);top:40%}.numInputWrapper span svg{width:inherit;height:auto}.numInputWrapper span svg path{fill:rgba(0,0,0,0.5)}.numInputWrapper:hover{background:rgba(0,0,0,0.05)}.numInputWrapper:hover span{opacity:1}.flatpickr-current-month{font-size:135%;line-height:inherit;font-weight:300;color:inherit;position:absolute;width:75%;left:12.5%;padding:7.48px 0 0 0;line-height:1;height:34px;display:inline-block;text-align:center;-webkit-transform:translate3d(0px, 0px, 0px);transform:translate3d(0px, 0px, 0px)}.flatpickr-current-month span.cur-month{font-family:inherit;font-weight:700;color:inherit;display:inline-block;margin-left:0.5ch;padding:0}.flatpickr-current-month span.cur-month:hover{background:rgba(0,0,0,0.05)}.flatpickr-current-month .numInputWrapper{width:6ch;width:7ch\\0;display:inline-block}.flatpickr-current-month .numInputWrapper span.arrowUp:after{border-bottom-color:rgba(0,0,0,0.9)}.flatpickr-current-month .numInputWrapper span.arrowDown:after{border-top-color:rgba(0,0,0,0.9)}.flatpickr-current-month input.cur-year{background:transparent;-webkit-box-sizing:border-box;box-sizing:border-box;color:inherit;cursor:text;padding:0 0 0 0.5ch;margin:0;display:inline-block;font-size:inherit;font-family:inherit;font-weight:300;line-height:inherit;height:auto;border:0;border-radius:0;vertical-align:initial;-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}.flatpickr-current-month input.cur-year:focus{outline:0}.flatpickr-current-month input.cur-year[disabled],.flatpickr-current-month input.cur-year[disabled]:hover{font-size:100%;color:rgba(0,0,0,0.5);background:transparent;pointer-events:none}.flatpickr-current-month .flatpickr-monthDropdown-months{appearance:menulist;background:transparent;border:none;border-radius:0;box-sizing:border-box;color:inherit;cursor:pointer;font-size:inherit;font-family:inherit;font-weight:300;height:auto;line-height:inherit;margin:-1px 0 0 0;outline:none;padding:0 0 0 0.5ch;position:relative;vertical-align:initial;-webkit-box-sizing:border-box;-webkit-appearance:menulist;-moz-appearance:menulist;width:auto}.flatpickr-current-month .flatpickr-monthDropdown-months:focus,.flatpickr-current-month .flatpickr-monthDropdown-months:active{outline:none}.flatpickr-current-month .flatpickr-monthDropdown-months:hover{background:rgba(0,0,0,0.05)}.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month{background-color:transparent;outline:none;padding:0}.flatpickr-weekdays{background:transparent;text-align:center;overflow:hidden;width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;height:28px}.flatpickr-weekdays .flatpickr-weekdaycontainer{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1}span.flatpickr-weekday{cursor:default;font-size:90%;background:transparent;color:rgba(0,0,0,0.54);line-height:1;margin:0;text-align:center;display:block;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;font-weight:bolder}.dayContainer,.flatpickr-weeks{padding:1px 0 0 0}.flatpickr-days{position:relative;overflow:hidden;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;width:307.875px}.flatpickr-days:focus{outline:0}.dayContainer{padding:0;outline:0;text-align:left;width:307.875px;min-width:307.875px;max-width:307.875px;-webkit-box-sizing:border-box;box-sizing:border-box;display:inline-block;display:-ms-flexbox;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-wrap:wrap;-ms-flex-pack:justify;-webkit-justify-content:space-around;justify-content:space-around;-webkit-transform:translate3d(0px, 0px, 0px);transform:translate3d(0px, 0px, 0px);opacity:1}.dayContainer+.dayContainer{-webkit-box-shadow:-1px 0 0 #e6e6e6;box-shadow:-1px 0 0 #e6e6e6}.flatpickr-day{background:none;border:1px solid transparent;border-radius:150px;-webkit-box-sizing:border-box;box-sizing:border-box;color:#393939;cursor:pointer;font-weight:400;width:14.2857143%;-webkit-flex-basis:14.2857143%;-ms-flex-preferred-size:14.2857143%;flex-basis:14.2857143%;max-width:39px;height:39px;line-height:39px;margin:0;display:inline-block;position:relative;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;text-align:center}.flatpickr-day.inRange,.flatpickr-day.prevMonthDay.inRange,.flatpickr-day.nextMonthDay.inRange,.flatpickr-day.today.inRange,.flatpickr-day.prevMonthDay.today.inRange,.flatpickr-day.nextMonthDay.today.inRange,.flatpickr-day:hover,.flatpickr-day.prevMonthDay:hover,.flatpickr-day.nextMonthDay:hover,.flatpickr-day:focus,.flatpickr-day.prevMonthDay:focus,.flatpickr-day.nextMonthDay:focus{cursor:pointer;outline:0;background:#e6e6e6;border-color:#e6e6e6}.flatpickr-day.today{border-color:#959ea9}.flatpickr-day.today:hover,.flatpickr-day.today:focus{border-color:#959ea9;background:#959ea9;color:#fff}.flatpickr-day.selected,.flatpickr-day.startRange,.flatpickr-day.endRange,.flatpickr-day.selected.inRange,.flatpickr-day.startRange.inRange,.flatpickr-day.endRange.inRange,.flatpickr-day.selected:focus,.flatpickr-day.startRange:focus,.flatpickr-day.endRange:focus,.flatpickr-day.selected:hover,.flatpickr-day.startRange:hover,.flatpickr-day.endRange:hover,.flatpickr-day.selected.prevMonthDay,.flatpickr-day.startRange.prevMonthDay,.flatpickr-day.endRange.prevMonthDay,.flatpickr-day.selected.nextMonthDay,.flatpickr-day.startRange.nextMonthDay,.flatpickr-day.endRange.nextMonthDay{background:#569ff7;-webkit-box-shadow:none;box-shadow:none;color:#fff;border-color:#569ff7}.flatpickr-day.selected.startRange,.flatpickr-day.startRange.startRange,.flatpickr-day.endRange.startRange{border-radius:50px 0 0 50px}.flatpickr-day.selected.endRange,.flatpickr-day.startRange.endRange,.flatpickr-day.endRange.endRange{border-radius:0 50px 50px 0}.flatpickr-day.selected.startRange+.endRange:not(:nth-child(7n+1)),.flatpickr-day.startRange.startRange+.endRange:not(:nth-child(7n+1)),.flatpickr-day.endRange.startRange+.endRange:not(:nth-child(7n+1)){-webkit-box-shadow:-10px 0 0 #569ff7;box-shadow:-10px 0 0 #569ff7}.flatpickr-day.selected.startRange.endRange,.flatpickr-day.startRange.startRange.endRange,.flatpickr-day.endRange.startRange.endRange{border-radius:50px}.flatpickr-day.inRange{border-radius:0;-webkit-box-shadow:-5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;box-shadow:-5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6}.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover,.flatpickr-day.prevMonthDay,.flatpickr-day.nextMonthDay,.flatpickr-day.notAllowed,.flatpickr-day.notAllowed.prevMonthDay,.flatpickr-day.notAllowed.nextMonthDay{color:rgba(57,57,57,0.3);background:transparent;border-color:transparent;cursor:default}.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover{cursor:not-allowed;color:rgba(57,57,57,0.1)}.flatpickr-day.week.selected{border-radius:0;-webkit-box-shadow:-5px 0 0 #569ff7, 5px 0 0 #569ff7;box-shadow:-5px 0 0 #569ff7, 5px 0 0 #569ff7}.flatpickr-day.hidden{visibility:hidden}.rangeMode .flatpickr-day{margin-top:1px}.flatpickr-weekwrapper{float:left}.flatpickr-weekwrapper .flatpickr-weeks{padding:0 12px;-webkit-box-shadow:1px 0 0 #e6e6e6;box-shadow:1px 0 0 #e6e6e6}.flatpickr-weekwrapper .flatpickr-weekday{float:none;width:100%;line-height:28px}.flatpickr-weekwrapper span.flatpickr-day,.flatpickr-weekwrapper span.flatpickr-day:hover{display:block;width:100%;max-width:none;color:rgba(57,57,57,0.3);background:transparent;cursor:default;border:none}.flatpickr-innerContainer{display:block;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden}.flatpickr-rContainer{display:inline-block;padding:0;-webkit-box-sizing:border-box;box-sizing:border-box}.flatpickr-time{text-align:center;outline:0;display:block;height:0;line-height:40px;max-height:40px;-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}.flatpickr-time:after{content:\"\";display:table;clear:both}.flatpickr-time .numInputWrapper{-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;width:40%;height:40px;float:left}.flatpickr-time .numInputWrapper span.arrowUp:after{border-bottom-color:#393939}.flatpickr-time .numInputWrapper span.arrowDown:after{border-top-color:#393939}.flatpickr-time.hasSeconds .numInputWrapper{width:26%}.flatpickr-time.time24hr .numInputWrapper{width:49%}.flatpickr-time input{background:transparent;-webkit-box-shadow:none;box-shadow:none;border:0;border-radius:0;text-align:center;margin:0;padding:0;height:inherit;line-height:inherit;color:#393939;font-size:14px;position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}.flatpickr-time input.flatpickr-hour{font-weight:bold}.flatpickr-time input.flatpickr-minute,.flatpickr-time input.flatpickr-second{font-weight:400}.flatpickr-time input:focus{outline:0;border:0}.flatpickr-time .flatpickr-time-separator,.flatpickr-time .flatpickr-am-pm{height:inherit;float:left;line-height:inherit;color:#393939;font-weight:bold;width:2%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-align-self:center;-ms-flex-item-align:center;align-self:center}.flatpickr-time .flatpickr-am-pm{outline:0;width:18%;cursor:pointer;text-align:center;font-weight:400}.flatpickr-time input:hover,.flatpickr-time .flatpickr-am-pm:hover,.flatpickr-time input:focus,.flatpickr-time .flatpickr-am-pm:focus{background:#eee}.flatpickr-input[readonly]{cursor:pointer}@-webkit-keyframes fpFadeInDown{from{opacity:0;-webkit-transform:translate3d(0, -20px, 0);transform:translate3d(0, -20px, 0)}to{opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}@keyframes fpFadeInDown{from{opacity:0;-webkit-transform:translate3d(0, -20px, 0);transform:translate3d(0, -20px, 0)}to{opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}.flatpickr-calendar{font-size:0.875rem;line-height:1.125rem;font-weight:var(--cat-font-weight-body, 400);box-shadow:0 4px 6px -2px rgba(27, 31, 38, 0.03), 0 12px 16px -4px rgba(27, 31, 38, 0.08);border-radius:var(--cat-border-radius-m, 0.25rem);border:1px solid rgb(var(--cat-border-color, 235, 236, 240));background:white;padding:1rem}.flatpickr-calendar:not(.inline).animate{transform:translateY(-1rem);opacity:0;transition:transform 125ms cubic-bezier(0.3, 0, 0.8, 0.15), opacity 125ms cubic-bezier(0.3, 0, 0.8, 0.15)}.flatpickr-calendar::before,.flatpickr-calendar::after{display:none}.flatpickr-calendar.inline,.flatpickr-calendar.open{display:flex;flex-direction:column;gap:1rem;width:auto !important}.flatpickr-calendar.inline{border:unset;padding:0}.flatpickr-calendar.open{z-index:calc(var(--cat-z-index, 1000) + 100);margin-top:0.75rem;margin-left:-0.75rem}.flatpickr-calendar.open.animate{opacity:1;transform:translateY(0);transition:transform 500ms cubic-bezier(0.05, 0.7, 0.1, 1), opacity 500ms cubic-bezier(0.05, 0.7, 0.1, 1)}.flatpickr-months{gap:0.25rem}.flatpickr-months .flatpickr-month{height:auto}.flatpickr-current-month{font-size:1.125rem;line-height:1.5rem;font-weight:var(--cat-font-weight-head, 600);font-feature-settings:\"pnum\";height:100%;padding:0;display:flex;position:static;width:auto;gap:0.25rem}.flatpickr-current-month .flatpickr-monthDropdown-months{padding:0 0.25rem;flex:1;margin:unset;font-weight:inherit;border-radius:var(--cat-border-radius-m, 0.25rem)}.flatpickr-current-month .flatpickr-monthDropdown-months:hover,.flatpickr-current-month .flatpickr-monthDropdown-months:focus-within{background-color:rgba(var(--cat-primary-bg, 0, 129, 148), 0.05)}.flatpickr-current-month input.cur-year{padding:0;font-weight:inherit;line-height:2.25rem}.flatpickr-current-month .numInputWrapper{width:7ch}.flatpickr-months .flatpickr-prev-month,.flatpickr-months .flatpickr-next-month{position:static;width:2.25rem;height:2.25rem;padding:0;align-items:center;display:flex;justify-content:center;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.flatpickr-months .flatpickr-prev-month:hover,.flatpickr-months .flatpickr-next-month:hover{color:rgb(var(--cat-font-color-base, 0, 0, 0))}.flatpickr-weekdays{height:2rem}.flatpickr-weekdays .flatpickr-weekday{color:rgb(var(--cat-font-color-muted, 81, 92, 108));font-size:0.75rem;line-height:1rem;font-weight:700}.flatpickr-weekwrapper .flatpickr-weekday{height:2rem}.flatpickr-weekwrapper .flatpickr-weeks{box-shadow:none;width:2rem;padding:0;margin-right:0.5rem;background:#f2f4f7;border-radius:var(--cat-border-radius-m, 0.25rem)}.flatpickr-weekwrapper span.flatpickr-day,.flatpickr-weekwrapper span.flatpickr-day:hover{font-size:0.75rem;line-height:1rem;font-weight:700;color:rgb(var(--cat-font-color-muted, 81, 92, 108));text-align:center;line-height:2.25rem}.flatpickr-days{width:15.75rem !important}.dayContainer{width:15.75rem;min-width:15.75rem;max-width:15.75rem}.flatpickr-day{color:rgb(var(--cat-font-color-base, 0, 0, 0));height:2.25rem;line-height:2.25rem;border:0;border-radius:var(--cat-border-radius-m, 0.25rem)}.flatpickr-day:hover{background-color:#f2f4f7;font-weight:700}.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover{color:rgb(var(--cat-font-color-muted, 81, 92, 108));font-weight:inherit;background-color:inherit !important}.flatpickr-day.today{color:rgb(var(--cat-primary-text, 0, 129, 148));box-shadow:inset 0 0 0 2px rgb(var(--cat-primary-text, 0, 129, 148))}.flatpickr-day.today:hover,.flatpickr-day.today:focus{background-color:#f2f4f7;color:rgb(var(--cat-primary-text, 0, 129, 148))}.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover,.flatpickr-day.prevMonthDay,.flatpickr-day.nextMonthDay,.flatpickr-day.notAllowed,.flatpickr-day.notAllowed.prevMonthDay,.flatpickr-day.notAllowed.nextMonthDay{color:rgba(var(--cat-font-color-muted, 81, 92, 108), 0.5)}.flatpickr-day.selected,.flatpickr-day.selected:hover,.flatpickr-day.selected:focus,.flatpickr-day.selected.inRange,.flatpickr-day.selected.nextMonthDay,.flatpickr-day.selected.prevMonthDay,.flatpickr-day.startRange,.flatpickr-day.startRange:hover,.flatpickr-day.startRange:focus,.flatpickr-day.startRange.inRange,.flatpickr-day.startRange.nextMonthDay,.flatpickr-day.startRange.prevMonthDay,.flatpickr-day.endRange,.flatpickr-day.endRange:hover,.flatpickr-day.endRange:focus,.flatpickr-day.endRange.inRange,.flatpickr-day.endRange.nextMonthDay,.flatpickr-day.endRange.prevMonthDay{font-weight:700;background-color:rgb(var(--cat-primary-bg, 0, 129, 148)) !important;color:rgb(var(--cat-primary-fill, 255, 255, 255)) !important}.flatpickr-day.inRange,.flatpickr-day.prevMonthDay.inRange,.flatpickr-day.nextMonthDay.inRange,.flatpickr-day.today.inRange,.flatpickr-day.prevMonthDay.today.inRange,.flatpickr-day.nextMonthDay.today.inRange,.flatpickr-day:hover,.flatpickr-day.prevMonthDay:hover,.flatpickr-day.nextMonthDay:hover,.flatpickr-day:focus,.flatpickr-day.prevMonthDay:focus,.flatpickr-day.nextMonthDay:focus{background-color:rgba(var(--cat-primary-bg, 0, 129, 148), 0.1)}.flatpickr-day.selected.startRange,.flatpickr-day.startRange.startRange,.flatpickr-day.endRange.startRange{border-top-left-radius:var(--cat-border-radius-m, 0.25rem);border-bottom-left-radius:var(--cat-border-radius-m, 0.25rem)}.flatpickr-day.selected.endRange,.flatpickr-day.startRange.endRange,.flatpickr-day.endRange.endRange{border-top-right-radius:var(--cat-border-radius-m, 0.25rem);border-bottom-right-radius:var(--cat-border-radius-m, 0.25rem)}.numInputWrapper{padding:0 1rem 0 0.5rem;border-radius:var(--cat-border-radius-m, 0.25rem)}.numInputWrapper:hover,.numInputWrapper:focus-within{background-color:rgba(var(--cat-primary-bg, 0, 129, 148), 0.05)}.numInputWrapper span{border:none;background:transparent;width:1rem;padding:0;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.numInputWrapper span.arrowUp::after{content:\"↑\";align-items:flex-end}.numInputWrapper span.arrowDown::after{content:\"↓\";align-items:flex-start}.numInputWrapper span::after{font-size:0.75rem;line-height:1rem;font-weight:700;position:static;border:0 !important;font-size:10px;display:flex;height:100%;justify-content:center}.numInputWrapper span:hover{color:rgb(var(--cat-font-color-base, 0, 0, 0));background:transparent}.flatpickr-calendar.hasTime .flatpickr-time{border:1px solid rgb(var(--cat-border-color, 235, 236, 240));border-radius:var(--cat-border-radius-m, 0.25rem);min-width:12rem;height:auto}.flatpickr-calendar.hasTime .flatpickr-time .numInputWrapper{height:2rem;padding:0;margin:0.25rem;display:flex}.flatpickr-calendar.hasTime.noCalendar{padding:0}.flatpickr-calendar.hasTime.noCalendar .flatpickr-time{border:none}.flatpickr-time .flatpickr-time-separator,.flatpickr-time .flatpickr-am-pm{margin:0 0.25rem;font-size:1.125rem;line-height:1.5rem;font-weight:400;font-feature-settings:\"pnum\";color:rgb(var(--cat-font-color-base, 0, 0, 0));line-height:2.25rem}.flatpickr-time .flatpickr-am-pm{width:25%;padding:0 0.5rem}.flatpickr-time .flatpickr-am-pm:hover,.flatpickr-time .flatpickr-am-pm:focus{border-radius:var(--cat-border-radius-m, 0.25rem);background-color:rgba(var(--cat-primary-bg, 0, 129, 148), 0.05)}.flatpickr-time{max-height:unset}.flatpickr-time input{background:transparent !important;color:rgb(var(--cat-font-color-base, 0, 0, 0));font-size:0.9375rem;line-height:2.25rem;font-family:inherit}.flatpickr-time input.flatpickr-hour{font-weight:inherit}.flatpickr-day.inRange:not(.today),.flatpickr-day.week.selected{box-shadow:none}.flatpickr-day.inRange:nth-child(7n+1),.flatpickr-day.week.selected:nth-child(7n+1){border-top-left-radius:var(--cat-border-radius-m, 0.25rem);border-bottom-left-radius:var(--cat-border-radius-m, 0.25rem)}.flatpickr-day.inRange:nth-child(7n+7),.flatpickr-day.week.selected:nth-child(7n+7){border-top-right-radius:var(--cat-border-radius-m, 0.25rem);border-bottom-right-radius:var(--cat-border-radius-m, 0.25rem)}.flatpickr-day.selected.startRange+.endRange:not(:nth-child(7n+1)),.flatpickr-day.startRange.startRange+.endRange:not(:nth-child(7n+1)),.flatpickr-day.endRange.startRange+.endRange:not(:nth-child(7n+1)){box-shadow:none}.flatpickr-day.selected.startRange.endRange,.flatpickr-day.startRange.startRange.endRange,.flatpickr-day.endRange.startRange.endRange{border-radius:var(--cat-border-radius-m, 0.25rem)}:host{display:flex}:host([hidden]){display:none}cat-input{flex:1 1 auto;margin:0}";
+const CatDatepickerStyle0 = catDatepickerCss;
 
 const CatDatepickerFlat = class {
     constructor(hostRef) {
@@ -5642,7 +6088,7 @@ const CatDatepickerFlat = class {
     }
     render() {
         return [
-            index.h("cat-input", { ref: el => (this._input = el), requiredMarker: this.requiredMarker, horizontal: this.horizontal, 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 => {
+            index.h("cat-input", { key: '30fb619a94e93a583bf7df28945917562c6b184f', ref: el => (this._input = el), requiredMarker: this.requiredMarker, horizontal: this.horizontal, 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 => {
@@ -5652,7 +6098,7 @@ const CatDatepickerFlat = class {
                     e.stopPropagation();
                     this.catBlur.emit(e.detail);
                 } }, this.hasSlottedLabel && (index.h("span", { slot: "label" }, index.h("slot", { name: "label" }))), this.hasSlottedHint && (index.h("span", { slot: "hint" }, index.h("slot", { name: "hint" })))),
-            index.h("div", { ref: el => (this._calendarWrapper = el), class: "datepicker-wrapper" })
+            index.h("div", { key: 'f28f001436363260ec7c9dff26a8f82475c98ac5', ref: el => (this._calendarWrapper = el), class: "datepicker-wrapper" })
         ];
     }
     initDatepicker(input) {
@@ -5663,7 +6109,7 @@ const CatDatepickerFlat = class {
         const withinDropdown = !!findClosest('cat-dropdown', input);
         const nativePickerAttributes = withinDropdown ? { 'data-dropdown-no-close': '' } : {};
         return flatpickr(input, getConfig({
-            locale: getLocale(of.catI18nRegistry.getLocale()),
+            locale: getLocale$1(of.catI18nRegistry.getLocale()),
             format: getFormat(of.catI18nRegistry.getLocale(), this.mode),
             mode: this.mode,
             min: this.min,
@@ -5715,9 +6161,10 @@ const CatDatepickerFlat = class {
         "max": ["onMinChanged"]
     }; }
 };
-CatDatepickerFlat.style = catDatepickerCss;
+CatDatepickerFlat.style = CatDatepickerStyle0;
 
 const catDatepickerInlineCss = "@charset \"UTF-8\";.flatpickr-calendar{background:transparent;opacity:0;display:none;text-align:center;visibility:hidden;padding:0;-webkit-animation:none;animation:none;direction:ltr;border:0;font-size:14px;line-height:24px;border-radius:5px;position:absolute;width:307.875px;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-touch-action:manipulation;touch-action:manipulation;background:#fff;-webkit-box-shadow:1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0,0,0,0.08);box-shadow:1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0,0,0,0.08)}.flatpickr-calendar.open,.flatpickr-calendar.inline{opacity:1;max-height:640px;visibility:visible}.flatpickr-calendar.open{display:inline-block;z-index:99999}.flatpickr-calendar.animate.open{-webkit-animation:fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);animation:fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1)}.flatpickr-calendar.inline{display:block;position:relative;top:2px}.flatpickr-calendar.static{position:absolute;top:calc(100% + 2px)}.flatpickr-calendar.static.open{z-index:999;display:block}.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7){-webkit-box-shadow:none !important;box-shadow:none !important}.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1){-webkit-box-shadow:-2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;box-shadow:-2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6}.flatpickr-calendar .hasWeeks .dayContainer,.flatpickr-calendar .hasTime .dayContainer{border-bottom:0;border-bottom-right-radius:0;border-bottom-left-radius:0}.flatpickr-calendar .hasWeeks .dayContainer{border-left:0}.flatpickr-calendar.hasTime .flatpickr-time{height:40px;border-top:1px solid #e6e6e6}.flatpickr-calendar.noCalendar.hasTime .flatpickr-time{height:auto}.flatpickr-calendar:before,.flatpickr-calendar:after{position:absolute;display:block;pointer-events:none;border:solid transparent;content:'';height:0;width:0;left:22px}.flatpickr-calendar.rightMost:before,.flatpickr-calendar.arrowRight:before,.flatpickr-calendar.rightMost:after,.flatpickr-calendar.arrowRight:after{left:auto;right:22px}.flatpickr-calendar.arrowCenter:before,.flatpickr-calendar.arrowCenter:after{left:50%;right:50%}.flatpickr-calendar:before{border-width:5px;margin:0 -5px}.flatpickr-calendar:after{border-width:4px;margin:0 -4px}.flatpickr-calendar.arrowTop:before,.flatpickr-calendar.arrowTop:after{bottom:100%}.flatpickr-calendar.arrowTop:before{border-bottom-color:#e6e6e6}.flatpickr-calendar.arrowTop:after{border-bottom-color:#fff}.flatpickr-calendar.arrowBottom:before,.flatpickr-calendar.arrowBottom:after{top:100%}.flatpickr-calendar.arrowBottom:before{border-top-color:#e6e6e6}.flatpickr-calendar.arrowBottom:after{border-top-color:#fff}.flatpickr-calendar:focus{outline:0}.flatpickr-wrapper{position:relative;display:inline-block}.flatpickr-months{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}.flatpickr-months .flatpickr-month{background:transparent;color:rgba(0,0,0,0.9);fill:rgba(0,0,0,0.9);height:34px;line-height:1;text-align:center;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;overflow:hidden;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1}.flatpickr-months .flatpickr-prev-month,.flatpickr-months .flatpickr-next-month{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-decoration:none;cursor:pointer;position:absolute;top:0;height:34px;padding:10px;z-index:3;color:rgba(0,0,0,0.9);fill:rgba(0,0,0,0.9)}.flatpickr-months .flatpickr-prev-month.flatpickr-disabled,.flatpickr-months .flatpickr-next-month.flatpickr-disabled{display:none}.flatpickr-months .flatpickr-prev-month i,.flatpickr-months .flatpickr-next-month i{position:relative}.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month,.flatpickr-months .flatpickr-next-month.flatpickr-prev-month{left:0;}.flatpickr-months .flatpickr-prev-month.flatpickr-next-month,.flatpickr-months .flatpickr-next-month.flatpickr-next-month{right:0;}.flatpickr-months .flatpickr-prev-month:hover,.flatpickr-months .flatpickr-next-month:hover{color:#959ea9}.flatpickr-months .flatpickr-prev-month:hover svg,.flatpickr-months .flatpickr-next-month:hover svg{fill:#f64747}.flatpickr-months .flatpickr-prev-month svg,.flatpickr-months .flatpickr-next-month svg{width:14px;height:14px}.flatpickr-months .flatpickr-prev-month svg path,.flatpickr-months .flatpickr-next-month svg path{-webkit-transition:fill 0.1s;transition:fill 0.1s;fill:inherit}.numInputWrapper{position:relative;height:auto}.numInputWrapper input,.numInputWrapper span{display:inline-block}.numInputWrapper input{width:100%}.numInputWrapper input::-ms-clear{display:none}.numInputWrapper input::-webkit-outer-spin-button,.numInputWrapper input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}.numInputWrapper span{position:absolute;right:0;width:14px;padding:0 4px 0 2px;height:50%;line-height:50%;opacity:0;cursor:pointer;border:1px solid rgba(57,57,57,0.15);-webkit-box-sizing:border-box;box-sizing:border-box}.numInputWrapper span:hover{background:rgba(0,0,0,0.1)}.numInputWrapper span:active{background:rgba(0,0,0,0.2)}.numInputWrapper span:after{display:block;content:\"\";position:absolute}.numInputWrapper span.arrowUp{top:0;border-bottom:0}.numInputWrapper span.arrowUp:after{border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:4px solid rgba(57,57,57,0.6);top:26%}.numInputWrapper span.arrowDown{top:50%}.numInputWrapper span.arrowDown:after{border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid rgba(57,57,57,0.6);top:40%}.numInputWrapper span svg{width:inherit;height:auto}.numInputWrapper span svg path{fill:rgba(0,0,0,0.5)}.numInputWrapper:hover{background:rgba(0,0,0,0.05)}.numInputWrapper:hover span{opacity:1}.flatpickr-current-month{font-size:135%;line-height:inherit;font-weight:300;color:inherit;position:absolute;width:75%;left:12.5%;padding:7.48px 0 0 0;line-height:1;height:34px;display:inline-block;text-align:center;-webkit-transform:translate3d(0px, 0px, 0px);transform:translate3d(0px, 0px, 0px)}.flatpickr-current-month span.cur-month{font-family:inherit;font-weight:700;color:inherit;display:inline-block;margin-left:0.5ch;padding:0}.flatpickr-current-month span.cur-month:hover{background:rgba(0,0,0,0.05)}.flatpickr-current-month .numInputWrapper{width:6ch;width:7ch\\0;display:inline-block}.flatpickr-current-month .numInputWrapper span.arrowUp:after{border-bottom-color:rgba(0,0,0,0.9)}.flatpickr-current-month .numInputWrapper span.arrowDown:after{border-top-color:rgba(0,0,0,0.9)}.flatpickr-current-month input.cur-year{background:transparent;-webkit-box-sizing:border-box;box-sizing:border-box;color:inherit;cursor:text;padding:0 0 0 0.5ch;margin:0;display:inline-block;font-size:inherit;font-family:inherit;font-weight:300;line-height:inherit;height:auto;border:0;border-radius:0;vertical-align:initial;-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}.flatpickr-current-month input.cur-year:focus{outline:0}.flatpickr-current-month input.cur-year[disabled],.flatpickr-current-month input.cur-year[disabled]:hover{font-size:100%;color:rgba(0,0,0,0.5);background:transparent;pointer-events:none}.flatpickr-current-month .flatpickr-monthDropdown-months{appearance:menulist;background:transparent;border:none;border-radius:0;box-sizing:border-box;color:inherit;cursor:pointer;font-size:inherit;font-family:inherit;font-weight:300;height:auto;line-height:inherit;margin:-1px 0 0 0;outline:none;padding:0 0 0 0.5ch;position:relative;vertical-align:initial;-webkit-box-sizing:border-box;-webkit-appearance:menulist;-moz-appearance:menulist;width:auto}.flatpickr-current-month .flatpickr-monthDropdown-months:focus,.flatpickr-current-month .flatpickr-monthDropdown-months:active{outline:none}.flatpickr-current-month .flatpickr-monthDropdown-months:hover{background:rgba(0,0,0,0.05)}.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month{background-color:transparent;outline:none;padding:0}.flatpickr-weekdays{background:transparent;text-align:center;overflow:hidden;width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;height:28px}.flatpickr-weekdays .flatpickr-weekdaycontainer{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1}span.flatpickr-weekday{cursor:default;font-size:90%;background:transparent;color:rgba(0,0,0,0.54);line-height:1;margin:0;text-align:center;display:block;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;font-weight:bolder}.dayContainer,.flatpickr-weeks{padding:1px 0 0 0}.flatpickr-days{position:relative;overflow:hidden;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;width:307.875px}.flatpickr-days:focus{outline:0}.dayContainer{padding:0;outline:0;text-align:left;width:307.875px;min-width:307.875px;max-width:307.875px;-webkit-box-sizing:border-box;box-sizing:border-box;display:inline-block;display:-ms-flexbox;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-wrap:wrap;-ms-flex-pack:justify;-webkit-justify-content:space-around;justify-content:space-around;-webkit-transform:translate3d(0px, 0px, 0px);transform:translate3d(0px, 0px, 0px);opacity:1}.dayContainer+.dayContainer{-webkit-box-shadow:-1px 0 0 #e6e6e6;box-shadow:-1px 0 0 #e6e6e6}.flatpickr-day{background:none;border:1px solid transparent;border-radius:150px;-webkit-box-sizing:border-box;box-sizing:border-box;color:#393939;cursor:pointer;font-weight:400;width:14.2857143%;-webkit-flex-basis:14.2857143%;-ms-flex-preferred-size:14.2857143%;flex-basis:14.2857143%;max-width:39px;height:39px;line-height:39px;margin:0;display:inline-block;position:relative;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;text-align:center}.flatpickr-day.inRange,.flatpickr-day.prevMonthDay.inRange,.flatpickr-day.nextMonthDay.inRange,.flatpickr-day.today.inRange,.flatpickr-day.prevMonthDay.today.inRange,.flatpickr-day.nextMonthDay.today.inRange,.flatpickr-day:hover,.flatpickr-day.prevMonthDay:hover,.flatpickr-day.nextMonthDay:hover,.flatpickr-day:focus,.flatpickr-day.prevMonthDay:focus,.flatpickr-day.nextMonthDay:focus{cursor:pointer;outline:0;background:#e6e6e6;border-color:#e6e6e6}.flatpickr-day.today{border-color:#959ea9}.flatpickr-day.today:hover,.flatpickr-day.today:focus{border-color:#959ea9;background:#959ea9;color:#fff}.flatpickr-day.selected,.flatpickr-day.startRange,.flatpickr-day.endRange,.flatpickr-day.selected.inRange,.flatpickr-day.startRange.inRange,.flatpickr-day.endRange.inRange,.flatpickr-day.selected:focus,.flatpickr-day.startRange:focus,.flatpickr-day.endRange:focus,.flatpickr-day.selected:hover,.flatpickr-day.startRange:hover,.flatpickr-day.endRange:hover,.flatpickr-day.selected.prevMonthDay,.flatpickr-day.startRange.prevMonthDay,.flatpickr-day.endRange.prevMonthDay,.flatpickr-day.selected.nextMonthDay,.flatpickr-day.startRange.nextMonthDay,.flatpickr-day.endRange.nextMonthDay{background:#569ff7;-webkit-box-shadow:none;box-shadow:none;color:#fff;border-color:#569ff7}.flatpickr-day.selected.startRange,.flatpickr-day.startRange.startRange,.flatpickr-day.endRange.startRange{border-radius:50px 0 0 50px}.flatpickr-day.selected.endRange,.flatpickr-day.startRange.endRange,.flatpickr-day.endRange.endRange{border-radius:0 50px 50px 0}.flatpickr-day.selected.startRange+.endRange:not(:nth-child(7n+1)),.flatpickr-day.startRange.startRange+.endRange:not(:nth-child(7n+1)),.flatpickr-day.endRange.startRange+.endRange:not(:nth-child(7n+1)){-webkit-box-shadow:-10px 0 0 #569ff7;box-shadow:-10px 0 0 #569ff7}.flatpickr-day.selected.startRange.endRange,.flatpickr-day.startRange.startRange.endRange,.flatpickr-day.endRange.startRange.endRange{border-radius:50px}.flatpickr-day.inRange{border-radius:0;-webkit-box-shadow:-5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;box-shadow:-5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6}.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover,.flatpickr-day.prevMonthDay,.flatpickr-day.nextMonthDay,.flatpickr-day.notAllowed,.flatpickr-day.notAllowed.prevMonthDay,.flatpickr-day.notAllowed.nextMonthDay{color:rgba(57,57,57,0.3);background:transparent;border-color:transparent;cursor:default}.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover{cursor:not-allowed;color:rgba(57,57,57,0.1)}.flatpickr-day.week.selected{border-radius:0;-webkit-box-shadow:-5px 0 0 #569ff7, 5px 0 0 #569ff7;box-shadow:-5px 0 0 #569ff7, 5px 0 0 #569ff7}.flatpickr-day.hidden{visibility:hidden}.rangeMode .flatpickr-day{margin-top:1px}.flatpickr-weekwrapper{float:left}.flatpickr-weekwrapper .flatpickr-weeks{padding:0 12px;-webkit-box-shadow:1px 0 0 #e6e6e6;box-shadow:1px 0 0 #e6e6e6}.flatpickr-weekwrapper .flatpickr-weekday{float:none;width:100%;line-height:28px}.flatpickr-weekwrapper span.flatpickr-day,.flatpickr-weekwrapper span.flatpickr-day:hover{display:block;width:100%;max-width:none;color:rgba(57,57,57,0.3);background:transparent;cursor:default;border:none}.flatpickr-innerContainer{display:block;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden}.flatpickr-rContainer{display:inline-block;padding:0;-webkit-box-sizing:border-box;box-sizing:border-box}.flatpickr-time{text-align:center;outline:0;display:block;height:0;line-height:40px;max-height:40px;-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}.flatpickr-time:after{content:\"\";display:table;clear:both}.flatpickr-time .numInputWrapper{-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;width:40%;height:40px;float:left}.flatpickr-time .numInputWrapper span.arrowUp:after{border-bottom-color:#393939}.flatpickr-time .numInputWrapper span.arrowDown:after{border-top-color:#393939}.flatpickr-time.hasSeconds .numInputWrapper{width:26%}.flatpickr-time.time24hr .numInputWrapper{width:49%}.flatpickr-time input{background:transparent;-webkit-box-shadow:none;box-shadow:none;border:0;border-radius:0;text-align:center;margin:0;padding:0;height:inherit;line-height:inherit;color:#393939;font-size:14px;position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}.flatpickr-time input.flatpickr-hour{font-weight:bold}.flatpickr-time input.flatpickr-minute,.flatpickr-time input.flatpickr-second{font-weight:400}.flatpickr-time input:focus{outline:0;border:0}.flatpickr-time .flatpickr-time-separator,.flatpickr-time .flatpickr-am-pm{height:inherit;float:left;line-height:inherit;color:#393939;font-weight:bold;width:2%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-align-self:center;-ms-flex-item-align:center;align-self:center}.flatpickr-time .flatpickr-am-pm{outline:0;width:18%;cursor:pointer;text-align:center;font-weight:400}.flatpickr-time input:hover,.flatpickr-time .flatpickr-am-pm:hover,.flatpickr-time input:focus,.flatpickr-time .flatpickr-am-pm:focus{background:#eee}.flatpickr-input[readonly]{cursor:pointer}@-webkit-keyframes fpFadeInDown{from{opacity:0;-webkit-transform:translate3d(0, -20px, 0);transform:translate3d(0, -20px, 0)}to{opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}@keyframes fpFadeInDown{from{opacity:0;-webkit-transform:translate3d(0, -20px, 0);transform:translate3d(0, -20px, 0)}to{opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}.flatpickr-calendar{font-size:0.875rem;line-height:1.125rem;font-weight:var(--cat-font-weight-body, 400);box-shadow:0 4px 6px -2px rgba(27, 31, 38, 0.03), 0 12px 16px -4px rgba(27, 31, 38, 0.08);border-radius:var(--cat-border-radius-m, 0.25rem);border:1px solid rgb(var(--cat-border-color, 235, 236, 240));background:white;padding:1rem}.flatpickr-calendar:not(.inline).animate{transform:translateY(-1rem);opacity:0;transition:transform 125ms cubic-bezier(0.3, 0, 0.8, 0.15), opacity 125ms cubic-bezier(0.3, 0, 0.8, 0.15)}.flatpickr-calendar::before,.flatpickr-calendar::after{display:none}.flatpickr-calendar.inline,.flatpickr-calendar.open{display:flex;flex-direction:column;gap:1rem;width:auto !important}.flatpickr-calendar.inline{border:unset;padding:0}.flatpickr-calendar.open{z-index:calc(var(--cat-z-index, 1000) + 100);margin-top:0.75rem;margin-left:-0.75rem}.flatpickr-calendar.open.animate{opacity:1;transform:translateY(0);transition:transform 500ms cubic-bezier(0.05, 0.7, 0.1, 1), opacity 500ms cubic-bezier(0.05, 0.7, 0.1, 1)}.flatpickr-months{gap:0.25rem}.flatpickr-months .flatpickr-month{height:auto}.flatpickr-current-month{font-size:1.125rem;line-height:1.5rem;font-weight:var(--cat-font-weight-head, 600);font-feature-settings:\"pnum\";height:100%;padding:0;display:flex;position:static;width:auto;gap:0.25rem}.flatpickr-current-month .flatpickr-monthDropdown-months{padding:0 0.25rem;flex:1;margin:unset;font-weight:inherit;border-radius:var(--cat-border-radius-m, 0.25rem)}.flatpickr-current-month .flatpickr-monthDropdown-months:hover,.flatpickr-current-month .flatpickr-monthDropdown-months:focus-within{background-color:rgba(var(--cat-primary-bg, 0, 129, 148), 0.05)}.flatpickr-current-month input.cur-year{padding:0;font-weight:inherit;line-height:2.25rem}.flatpickr-current-month .numInputWrapper{width:7ch}.flatpickr-months .flatpickr-prev-month,.flatpickr-months .flatpickr-next-month{position:static;width:2.25rem;height:2.25rem;padding:0;align-items:center;display:flex;justify-content:center;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.flatpickr-months .flatpickr-prev-month:hover,.flatpickr-months .flatpickr-next-month:hover{color:rgb(var(--cat-font-color-base, 0, 0, 0))}.flatpickr-weekdays{height:2rem}.flatpickr-weekdays .flatpickr-weekday{color:rgb(var(--cat-font-color-muted, 81, 92, 108));font-size:0.75rem;line-height:1rem;font-weight:700}.flatpickr-weekwrapper .flatpickr-weekday{height:2rem}.flatpickr-weekwrapper .flatpickr-weeks{box-shadow:none;width:2rem;padding:0;margin-right:0.5rem;background:#f2f4f7;border-radius:var(--cat-border-radius-m, 0.25rem)}.flatpickr-weekwrapper span.flatpickr-day,.flatpickr-weekwrapper span.flatpickr-day:hover{font-size:0.75rem;line-height:1rem;font-weight:700;color:rgb(var(--cat-font-color-muted, 81, 92, 108));text-align:center;line-height:2.25rem}.flatpickr-days{width:15.75rem !important}.dayContainer{width:15.75rem;min-width:15.75rem;max-width:15.75rem}.flatpickr-day{color:rgb(var(--cat-font-color-base, 0, 0, 0));height:2.25rem;line-height:2.25rem;border:0;border-radius:var(--cat-border-radius-m, 0.25rem)}.flatpickr-day:hover{background-color:#f2f4f7;font-weight:700}.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover{color:rgb(var(--cat-font-color-muted, 81, 92, 108));font-weight:inherit;background-color:inherit !important}.flatpickr-day.today{color:rgb(var(--cat-primary-text, 0, 129, 148));box-shadow:inset 0 0 0 2px rgb(var(--cat-primary-text, 0, 129, 148))}.flatpickr-day.today:hover,.flatpickr-day.today:focus{background-color:#f2f4f7;color:rgb(var(--cat-primary-text, 0, 129, 148))}.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover,.flatpickr-day.prevMonthDay,.flatpickr-day.nextMonthDay,.flatpickr-day.notAllowed,.flatpickr-day.notAllowed.prevMonthDay,.flatpickr-day.notAllowed.nextMonthDay{color:rgba(var(--cat-font-color-muted, 81, 92, 108), 0.5)}.flatpickr-day.selected,.flatpickr-day.selected:hover,.flatpickr-day.selected:focus,.flatpickr-day.selected.inRange,.flatpickr-day.selected.nextMonthDay,.flatpickr-day.selected.prevMonthDay,.flatpickr-day.startRange,.flatpickr-day.startRange:hover,.flatpickr-day.startRange:focus,.flatpickr-day.startRange.inRange,.flatpickr-day.startRange.nextMonthDay,.flatpickr-day.startRange.prevMonthDay,.flatpickr-day.endRange,.flatpickr-day.endRange:hover,.flatpickr-day.endRange:focus,.flatpickr-day.endRange.inRange,.flatpickr-day.endRange.nextMonthDay,.flatpickr-day.endRange.prevMonthDay{font-weight:700;background-color:rgb(var(--cat-primary-bg, 0, 129, 148)) !important;color:rgb(var(--cat-primary-fill, 255, 255, 255)) !important}.flatpickr-day.inRange,.flatpickr-day.prevMonthDay.inRange,.flatpickr-day.nextMonthDay.inRange,.flatpickr-day.today.inRange,.flatpickr-day.prevMonthDay.today.inRange,.flatpickr-day.nextMonthDay.today.inRange,.flatpickr-day:hover,.flatpickr-day.prevMonthDay:hover,.flatpickr-day.nextMonthDay:hover,.flatpickr-day:focus,.flatpickr-day.prevMonthDay:focus,.flatpickr-day.nextMonthDay:focus{background-color:rgba(var(--cat-primary-bg, 0, 129, 148), 0.1)}.flatpickr-day.selected.startRange,.flatpickr-day.startRange.startRange,.flatpickr-day.endRange.startRange{border-top-left-radius:var(--cat-border-radius-m, 0.25rem);border-bottom-left-radius:var(--cat-border-radius-m, 0.25rem)}.flatpickr-day.selected.endRange,.flatpickr-day.startRange.endRange,.flatpickr-day.endRange.endRange{border-top-right-radius:var(--cat-border-radius-m, 0.25rem);border-bottom-right-radius:var(--cat-border-radius-m, 0.25rem)}.numInputWrapper{padding:0 1rem 0 0.5rem;border-radius:var(--cat-border-radius-m, 0.25rem)}.numInputWrapper:hover,.numInputWrapper:focus-within{background-color:rgba(var(--cat-primary-bg, 0, 129, 148), 0.05)}.numInputWrapper span{border:none;background:transparent;width:1rem;padding:0;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.numInputWrapper span.arrowUp::after{content:\"↑\";align-items:flex-end}.numInputWrapper span.arrowDown::after{content:\"↓\";align-items:flex-start}.numInputWrapper span::after{font-size:0.75rem;line-height:1rem;font-weight:700;position:static;border:0 !important;font-size:10px;display:flex;height:100%;justify-content:center}.numInputWrapper span:hover{color:rgb(var(--cat-font-color-base, 0, 0, 0));background:transparent}.flatpickr-calendar.hasTime .flatpickr-time{border:1px solid rgb(var(--cat-border-color, 235, 236, 240));border-radius:var(--cat-border-radius-m, 0.25rem);min-width:12rem;height:auto}.flatpickr-calendar.hasTime .flatpickr-time .numInputWrapper{height:2rem;padding:0;margin:0.25rem;display:flex}.flatpickr-calendar.hasTime.noCalendar{padding:0}.flatpickr-calendar.hasTime.noCalendar .flatpickr-time{border:none}.flatpickr-time .flatpickr-time-separator,.flatpickr-time .flatpickr-am-pm{margin:0 0.25rem;font-size:1.125rem;line-height:1.5rem;font-weight:400;font-feature-settings:\"pnum\";color:rgb(var(--cat-font-color-base, 0, 0, 0));line-height:2.25rem}.flatpickr-time .flatpickr-am-pm{width:25%;padding:0 0.5rem}.flatpickr-time .flatpickr-am-pm:hover,.flatpickr-time .flatpickr-am-pm:focus{border-radius:var(--cat-border-radius-m, 0.25rem);background-color:rgba(var(--cat-primary-bg, 0, 129, 148), 0.05)}.flatpickr-time{max-height:unset}.flatpickr-time input{background:transparent !important;color:rgb(var(--cat-font-color-base, 0, 0, 0));font-size:0.9375rem;line-height:2.25rem;font-family:inherit}.flatpickr-time input.flatpickr-hour{font-weight:inherit}.flatpickr-day.inRange:not(.today),.flatpickr-day.week.selected{box-shadow:none}.flatpickr-day.inRange:nth-child(7n+1),.flatpickr-day.week.selected:nth-child(7n+1){border-top-left-radius:var(--cat-border-radius-m, 0.25rem);border-bottom-left-radius:var(--cat-border-radius-m, 0.25rem)}.flatpickr-day.inRange:nth-child(7n+7),.flatpickr-day.week.selected:nth-child(7n+7){border-top-right-radius:var(--cat-border-radius-m, 0.25rem);border-bottom-right-radius:var(--cat-border-radius-m, 0.25rem)}.flatpickr-day.selected.startRange+.endRange:not(:nth-child(7n+1)),.flatpickr-day.startRange.startRange+.endRange:not(:nth-child(7n+1)),.flatpickr-day.endRange.startRange+.endRange:not(:nth-child(7n+1)){box-shadow:none}.flatpickr-day.selected.startRange.endRange,.flatpickr-day.startRange.startRange.endRange,.flatpickr-day.endRange.startRange.endRange{border-radius:var(--cat-border-radius-m, 0.25rem)}:host{display:inline-flex}:host>div{display:flex}:host([hidden]){display:none}.datepicker-disabled .flatpickr-days,.datepicker-disabled .flatpickr-time,.datepicker-readonly .flatpickr-days,.datepicker-readonly .flatpickr-time{pointer-events:none}.datepicker-disabled .flatpickr-days{opacity:0.75}.datepicker-disabled .flatpickr-time input,.datepicker-disabled .flatpickr-time .flatpickr-time-separator,.datepicker-disabled .flatpickr-time .flatpickr-am-pm{color:rgb(var(--cat-font-color-muted, 81, 92, 108));opacity:0.75}input{display:none}.flatpickr-calendar{box-shadow:unset;background:unset}";
+const CatDatepickerInlineStyle0 = catDatepickerInlineCss;
 
 const CatDatepickerInline = class {
     constructor(hostRef) {
@@ -5754,18 +6201,18 @@ const CatDatepickerInline = class {
         this.pickr = this.initDatepicker(this.input);
     }
     render() {
-        return (index.h(index.Host, null, index.h("div", { tabIndex: this.disabled || this.readonly ? -1 : undefined, class: {
+        return (index.h(index.Host, { key: 'bb9ebb60420d1268751f6136e38d1aed5bc74602' }, index.h("div", { key: 'b84cc674ab3b677ceb646dee84b1b83d5d969746', tabIndex: this.disabled || this.readonly ? -1 : undefined, class: {
                 'datepicker-wrapper': true,
                 'datepicker-disabled': this.disabled,
                 'datepicker-readonly': this.readonly
-            } }, index.h("input", { ref: el => (this.input = el), value: this.value, disabled: this.disabled, readonly: this.readonly }))));
+            } }, index.h("input", { key: '6f7706220aa7465a907391e78f97a5e1ad91fdf0', ref: el => (this.input = el), value: this.value, disabled: this.disabled, readonly: this.readonly }))));
     }
     initDatepicker(input) {
         if (!input) {
             return;
         }
         return flatpickr(input, getConfig({
-            locale: getLocale(of.catI18nRegistry.getLocale()),
+            locale: getLocale$1(of.catI18nRegistry.getLocale()),
             format: getFormat(of.catI18nRegistry.getLocale(), this.mode),
             mode: this.mode,
             min: this.min,
@@ -5786,7 +6233,7 @@ const CatDatepickerInline = class {
         "readonly": ["onDisabledChanged"]
     }; }
 };
-CatDatepickerInline.style = catDatepickerInlineCss;
+CatDatepickerInline.style = CatDatepickerInlineStyle0;
 
 /**
  * Auto-generated file. Do not edit directly.
@@ -7302,6 +7749,7 @@ const firstTabbable = (container) => {
 };
 
 const catDropdownCss = ":host{display:contents}:host([hidden]){display:none}::slotted(nav){padding:0.25rem;min-width:8rem;max-width:16rem}.content{position:fixed;background:white;-webkit-overflow-scrolling:touch;min-height:2rem;max-height:calc(100vh - 48px);box-shadow:0 4px 6px -2px rgba(27, 31, 38, 0.03), 0 12px 16px -4px rgba(27, 31, 38, 0.08);border-radius:var(--cat-border-radius-m, 0.25rem);border:1px solid rgb(var(--cat-border-color, 235, 236, 240));z-index:calc(var(--cat-z-index, 1000) + 100);display:none;opacity:0;transform:scale(0.9);transition:transform 125ms cubic-bezier(0.3, 0, 0.8, 0.15), opacity 125ms cubic-bezier(0.3, 0, 0.8, 0.15)}.content[data-placement^=top]{transform-origin:bottom}.content[data-placement^=top-start]{transform-origin:bottom left}.content[data-placement^=top-end]{transform-origin:bottom right}.content[data-placement^=left]{transform-origin:right}.content[data-placement^=left-start]{transform-origin:right top}.content[data-placement^=left-end]{transform-origin:right bottom}.content[data-placement^=right]{transform-origin:left}.content[data-placement^=right-start]{transform-origin:left top}.content[data-placement^=right-end]{transform-origin:left bottom}.content[data-placement^=bottom]{transform-origin:top}.content[data-placement^=bottom-start]{transform-origin:top left}.content[data-placement^=bottom-end]{transform-origin:top right}.content.show{opacity:1;transform:scale(1);transition:transform 250ms cubic-bezier(0.05, 0.7, 0.1, 1), opacity 250ms cubic-bezier(0.05, 0.7, 0.1, 1)}.content.overflow-auto{overflow:auto}";
+const CatDropdownStyle0 = catDropdownCss;
 
 let nextUniqueId$7 = 0;
 const CatDropdown = class {
@@ -7313,6 +7761,8 @@ const CatDropdown = class {
         this.isOpen = false;
         this.placement = 'bottom-start';
         this.noAutoClose = false;
+        this.arrowNavigation = 'vertical';
+        this.noResize = false;
         this.overflow = false;
     }
     clickHandler(event) {
@@ -7355,7 +7805,6 @@ const CatDropdown = class {
             this.isOpen = true;
             this.content.classList.add('show');
             this.trigger?.setAttribute('aria-expanded', 'true');
-            this.catOpen.emit();
             this.trap = this.trap
                 ? this.trap.updateContainerElements(this.content)
                 : createFocusTrap(this.content, {
@@ -7368,7 +7817,25 @@ const CatDropdown = class {
                         !event.composedPath().includes(this.content) &&
                         // 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')),
-                    onPostDeactivate: () => this.close()
+                    onPostDeactivate: () => this.close(),
+                    onPostActivate: () => this.catOpen.emit(),
+                    setReturnFocus: elem => this.trigger || elem,
+                    isKeyForward: event => {
+                        if ((this.arrowNavigation === 'horizontal' && event.key === 'ArrowRight') ||
+                            (this.arrowNavigation === 'vertical' && event.key === 'ArrowDown')) {
+                            event.preventDefault();
+                            return true;
+                        }
+                        return event.key === 'Tab';
+                    },
+                    isKeyBackward: event => {
+                        if ((this.arrowNavigation === 'horizontal' && event.key === 'ArrowLeft') ||
+                            (this.arrowNavigation === 'vertical' && event.key === 'ArrowUp')) {
+                            event.preventDefault();
+                            return true;
+                        }
+                        return event.key === 'Tab' && event.shiftKey;
+                    }
                 });
             this.trap.activate();
         });
@@ -7392,27 +7859,8 @@ const CatDropdown = class {
             this.catClose.emit();
         }, timeTransitionS);
     }
-    componentDidLoad() {
-        this.keyListener = event => {
-            if (this.isOpen && ['ArrowDown', 'ArrowUp'].includes(event.key)) {
-                const targetElements = tabbable(this.content, { includeContainer: false, getShadowRoot: true });
-                const activeElement = firstTabbable(document.activeElement);
-                const activeIdx = activeElement ? targetElements.indexOf(activeElement) : -1;
-                const activeOff = event.key === 'ArrowDown' ? 1 : -1;
-                const targetIdx = activeIdx < 0 ? 0 : (activeIdx + activeOff + targetElements.length) % targetElements.length;
-                targetElements[targetIdx].focus();
-                event.preventDefault();
-            }
-        };
-        document.addEventListener('keydown', this.keyListener);
-    }
-    disconnectedCallback() {
-        if (this.keyListener) {
-            document.removeEventListener('keydown', this.keyListener);
-        }
-    }
     render() {
-        return (index.h(index.Host, null, index.h("slot", { name: "trigger", ref: el => (this.triggerSlot = el) }), index.h("div", { id: this.contentId, class: { content: true, 'overflow-auto': !this.overflow }, ref: el => (this.content = el) }, index.h("slot", { name: "content" }))));
+        return (index.h(index.Host, { key: 'b9a95b9b2c0e084fe0036989f174ee1681ecfe96' }, index.h("slot", { key: '73d2e8b7dd4c67f95c6b9faa34142de00eb25c4e', name: "trigger", ref: el => (this.triggerSlot = el) }), index.h("div", { key: '6555cf3ab1b4f0cfcea0e9ba85221f3de5cede82', id: this.contentId, class: { content: true, 'overflow-auto': !this.overflow }, ref: el => (this.content = el) }, index.h("slot", { key: '70dab119fa43e67e1d17b558519028c0f9da60d4', name: "content" }))));
     }
     get contentId() {
         return `cat-dropdown-${this.id}`;
@@ -7444,12 +7892,9 @@ const CatDropdown = class {
     }
     update() {
         if (this.trigger) {
-            computePosition(this.trigger, this.content, {
-                strategy: 'fixed',
-                placement: this.placement,
-                middleware: [
-                    offset(CatDropdown.OFFSET),
-                    flip(),
+            const resize = this.noResize
+                ? []
+                : [
                     size({
                         padding: CatDropdown.OFFSET,
                         apply({ availableWidth, availableHeight, elements }) {
@@ -7459,7 +7904,11 @@ const CatDropdown = class {
                             });
                         }
                     })
-                ]
+                ];
+            computePosition(this.trigger, this.content, {
+                strategy: 'fixed',
+                placement: this.placement,
+                middleware: [offset(CatDropdown.OFFSET), flip(), ...resize]
             }).then(({ x, y, placement }) => {
                 this.content.dataset.placement = placement;
                 Object.assign(this.content.style, {
@@ -7474,9 +7923,10 @@ const CatDropdown = class {
     }
 };
 CatDropdown.OFFSET = 4;
-CatDropdown.style = catDropdownCss;
+CatDropdown.style = CatDropdownStyle0;
 
 const catFormGroupCss = ":host{display:block}";
+const CatFormGroupStyle0 = catFormGroupCss;
 
 const CatFormGroup = class {
     constructor(hostRef) {
@@ -7496,7 +7946,7 @@ const CatFormGroup = class {
         });
     }
     render() {
-        return (index.h(index.Host, { style: { '--label-size': this.labelSize } }, index.h("slot", { onSlotchange: this.onSlotChange.bind(this) })));
+        return (index.h(index.Host, { key: 'd9805ae9997123327fa6259d9e849dff68576b31', style: { '--label-size': this.labelSize } }, index.h("slot", { key: 'e7e254cf202b8ee8a219ec077e659fde18db3530', onSlotchange: this.onSlotChange.bind(this) })));
     }
     onSlotChange() {
         this.formElements = Array.from(this.hostElement.querySelectorAll('cat-input, cat-textarea, cat-select, cat-datepicker'));
@@ -7514,9 +7964,10 @@ const CatFormGroup = class {
         "horizontal": ["onHorizontalChanged"]
     }; }
 };
-CatFormGroup.style = catFormGroupCss;
+CatFormGroup.style = CatFormGroupStyle0;
 
 const catIconCss = ":host{display:inline-flex;vertical-align:middle;-webkit-user-select:none;-ms-user-select:none;user-select:none;}:host([hidden]){display:none}span{display:inline-flex}svg{fill:currentColor;stroke:none;transform-origin:center center;height:1em;width:calc(var(--cat-icon-ratio, 1) * 1em)}.icon-xs svg{font-size:0.75rem}.icon-s svg{font-size:1rem}.icon-m svg{font-size:1.25rem}.icon-l svg{font-size:1.5rem}.icon-xl svg{font-size:1.75rem}";
+const CatIconStyle0 = catIconCss;
 
 const CatIcon = class {
     constructor(hostRef) {
@@ -7527,43 +7978,1601 @@ const CatIcon = class {
         this.a11yLabel = undefined;
     }
     render() {
-        return (index.h("span", { innerHTML: this.iconSrc || (this.icon ? of.catIconRegistry.getIcon(this.icon) : ''), "aria-label": this.a11yLabel, "aria-hidden": this.a11yLabel ? null : 'true', part: "icon", class: {
+        return (index.h("span", { key: 'ace2ec39a623d9c8168269a5b4c46c4efef2fbc7', innerHTML: this.iconSrc || (this.icon ? of.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'
             } }));
     }
 };
-CatIcon.style = catIconCss;
+CatIcon.style = CatIconStyle0;
+
+var commonjsGlobal = typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
+
+var NumeralFormatter = function (numeralDecimalMark,
+                                 numeralIntegerScale,
+                                 numeralDecimalScale,
+                                 numeralThousandsGroupStyle,
+                                 numeralPositiveOnly,
+                                 stripLeadingZeroes,
+                                 prefix,
+                                 signBeforePrefix,
+                                 tailPrefix,
+                                 delimiter) {
+    var owner = this;
+
+    owner.numeralDecimalMark = numeralDecimalMark || '.';
+    owner.numeralIntegerScale = numeralIntegerScale > 0 ? numeralIntegerScale : 0;
+    owner.numeralDecimalScale = numeralDecimalScale >= 0 ? numeralDecimalScale : 2;
+    owner.numeralThousandsGroupStyle = numeralThousandsGroupStyle || NumeralFormatter.groupStyle.thousand;
+    owner.numeralPositiveOnly = !!numeralPositiveOnly;
+    owner.stripLeadingZeroes = stripLeadingZeroes !== false;
+    owner.prefix = (prefix || prefix === '') ? prefix : '';
+    owner.signBeforePrefix = !!signBeforePrefix;
+    owner.tailPrefix = !!tailPrefix;
+    owner.delimiter = (delimiter || delimiter === '') ? delimiter : ',';
+    owner.delimiterRE = delimiter ? new RegExp('\\' + delimiter, 'g') : '';
+};
 
-/* eslint-disable @typescript-eslint/no-explicit-any */
-function coerceBoolean(value) {
-    return value != null && `${value}` !== 'false';
-}
-function coerceNumber(value, fallbackValue = 0) {
-    return isNumberValue(value) ? Number(value) : fallbackValue;
-}
-function isNumberValue(value) {
-    return !isNaN(parseFloat(value)) && !isNaN(Number(value));
-}
+NumeralFormatter.groupStyle = {
+    thousand: 'thousand',
+    lakh:     'lakh',
+    wan:      'wan',
+    none:     'none'    
+};
 
-const catInputCss = ".hint-wrapper{flex:0 1 auto;display:flex;gap:0.5rem}.hint-section{flex:1 1 auto;display:flex;flex-direction:column;gap:0.25rem;color:rgb(var(--cat-font-color-muted, 81, 92, 108));font-size:0.875rem;line-height:1.125rem}.hint-section .input-hint,.hint-section ::slotted([slot=hint]){margin:0 !important}.cat-bg-primary{background-color:rgb(var(--cat-primary-bg, 0, 129, 148)) !important;color:rgb(var(--cat-primary-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-primary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-primary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-primary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-primary-hover{transition:background-color 125ms, color 125ms}.cat-bg-primary-hover:hover{background-color:rgb(var(--cat-primary-bg-hover, 1, 115, 132)) !important;color:rgb(var(--cat-primary-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-primary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-primary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-primary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-primary,.cat-link-primary{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-link-primary,.cat-text-primary-hover{transition:color 125ms}.cat-link-primary:hover,.cat-text-primary-hover:hover{color:rgb(var(--cat-primary-text-hover, 1, 115, 132)) !important}.cat-link-primary:active,.cat-text-primary-hover:active{color:rgb(var(--cat-primary-text-active, 2, 99, 113)) !important}.cat-bg-primaryInverted{background-color:#93b4f2 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-bg-primaryInverted-hover{transition:background-color 125ms, color 125ms}.cat-bg-primaryInverted-hover:hover{background-color:#93b4f2 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-text-primaryInverted,.cat-link-primaryInverted{color:#93b4f2 !important}.cat-link-primaryInverted,.cat-text-primaryInverted-hover{transition:color 125ms}.cat-link-primaryInverted:hover,.cat-text-primaryInverted-hover:hover{color:#93b4f2 !important}.cat-link-primaryInverted:active,.cat-text-primaryInverted-hover:active{color:#93b4f2 !important}.cat-bg-secondary{background-color:rgb(var(--cat-secondary-bg, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-secondary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-secondary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-secondary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-secondary-hover{transition:background-color 125ms, color 125ms}.cat-bg-secondary-hover:hover{background-color:rgb(var(--cat-secondary-bg-hover, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-secondary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-secondary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-secondary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-secondary,.cat-link-secondary{color:rgb(var(--cat-secondary-text, 0, 0, 0)) !important}.cat-link-secondary,.cat-text-secondary-hover{transition:color 125ms}.cat-link-secondary:hover,.cat-text-secondary-hover:hover{color:rgb(var(--cat-secondary-text-hover, 0, 0, 0)) !important}.cat-link-secondary:active,.cat-text-secondary-hover:active{color:rgb(var(--cat-secondary-text-active, 0, 0, 0)) !important}.cat-bg-secondaryInverted{background-color:#697687 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-bg-secondaryInverted-hover{transition:background-color 125ms, color 125ms}.cat-bg-secondaryInverted-hover:hover{background-color:#697687 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-text-secondaryInverted,.cat-link-secondaryInverted{color:white !important}.cat-link-secondaryInverted,.cat-text-secondaryInverted-hover{transition:color 125ms}.cat-link-secondaryInverted:hover,.cat-text-secondaryInverted-hover:hover{color:white !important}.cat-link-secondaryInverted:active,.cat-text-secondaryInverted-hover:active{color:white !important}.cat-bg-info{background-color:rgb(var(--cat-success-bg, 0, 115, 230)) !important;color:rgb(var(--cat-success-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-info-hover{transition:background-color 125ms, color 125ms}.cat-bg-info-hover:hover{background-color:rgb(var(--cat-success-bg-hover, 0, 107, 227)) !important;color:rgb(var(--cat-success-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-info,.cat-link-info{color:rgb(var(--cat-success-text, 0, 115, 230)) !important}.cat-link-info,.cat-text-info-hover{transition:color 125ms}.cat-link-info:hover,.cat-text-info-hover:hover{color:rgb(var(--cat-success-text-hover, 0, 107, 227)) !important}.cat-link-info:active,.cat-text-info-hover:active{color:rgb(var(--cat-success-text-active, 0, 96, 223)) !important}.cat-bg-success{background-color:rgb(var(--cat-success-bg, 0, 132, 88)) !important;color:rgb(var(--cat-success-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-success-hover{transition:background-color 125ms, color 125ms}.cat-bg-success-hover:hover{background-color:rgb(var(--cat-success-bg-hover, 0, 117, 78)) !important;color:rgb(var(--cat-success-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-success,.cat-link-success{color:rgb(var(--cat-success-text, 0, 132, 88)) !important}.cat-link-success,.cat-text-success-hover{transition:color 125ms}.cat-link-success:hover,.cat-text-success-hover:hover{color:rgb(var(--cat-success-text-hover, 0, 117, 78)) !important}.cat-link-success:active,.cat-text-success-hover:active{color:rgb(var(--cat-success-text-active, 0, 105, 70)) !important}.cat-bg-warning{background-color:rgb(var(--cat-warning-bg, 255, 206, 128)) !important;color:rgb(var(--cat-warning-fill, 0, 0, 0)) !important;--cat-primary-text:var(--cat-warning-fill, 0, 0, 0);--cat-primary-text-hover:var(--cat-warning-fill-hover, 0, 0, 0);--cat-primary-text-active:var(--cat-warning-fill-active, 0, 0, 0);--cat-link-decoration:underline}.cat-bg-warning-hover{transition:background-color 125ms, color 125ms}.cat-bg-warning-hover:hover{background-color:rgb(var(--cat-warning-bg-hover, 255, 214, 148)) !important;color:rgb(var(--cat-warning-fill-hover, 0, 0, 0)) !important;--cat-primary-text:var(--cat-warning-fill, 0, 0, 0);--cat-primary-text-hover:var(--cat-warning-fill-hover, 0, 0, 0);--cat-primary-text-active:var(--cat-warning-fill-active, 0, 0, 0);--cat-link-decoration:underline}.cat-text-warning,.cat-link-warning{color:rgb(var(--cat-warning-text, 159, 97, 0)) !important}.cat-link-warning,.cat-text-warning-hover{transition:color 125ms}.cat-link-warning:hover,.cat-text-warning-hover:hover{color:rgb(var(--cat-warning-text-hover, 159, 97, 0)) !important}.cat-link-warning:active,.cat-text-warning-hover:active{color:rgb(var(--cat-warning-text-active, 159, 97, 0)) !important}.cat-bg-danger{background-color:rgb(var(--cat-danger-bg, 217, 52, 13)) !important;color:rgb(var(--cat-danger-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-danger-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-danger-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-danger-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-danger-hover{transition:background-color 125ms, color 125ms}.cat-bg-danger-hover:hover{background-color:rgb(var(--cat-danger-bg-hover, 194, 46, 11)) !important;color:rgb(var(--cat-danger-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-danger-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-danger-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-danger-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-danger,.cat-link-danger{color:rgb(var(--cat-danger-text, 217, 52, 13)) !important}.cat-link-danger,.cat-text-danger-hover{transition:color 125ms}.cat-link-danger:hover,.cat-text-danger-hover:hover{color:rgb(var(--cat-danger-text-hover, 194, 46, 11)) !important}.cat-link-danger:active,.cat-text-danger-hover:active{color:rgb(var(--cat-danger-text-active, 174, 42, 10)) !important}.cat-active{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-text-active{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-muted{color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important}.cat-text-muted{color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important}.cat-bg-muted{background-color:#f2f4f7 !important}.cat-text-reset{color:inherit !important}.cat-link-reset{color:inherit !important;text-decoration:inherit !important}.label{overflow:hidden;word-wrap:break-word;word-break:break-word}.input-field:not(.input-horizontal) .label-container.hidden,.textarea-field:not(.textarea-horizontal) .label-container.hidden,.select-field:not(.select-horizontal) .label-container.hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.label-container{flex-basis:var(--label-size, 33.33%)}.label-container .label-wrapper{display:flex;gap:0.25rem}.label-metadata{display:flex;flex-shrink:0;flex-grow:1;justify-content:space-between;gap:0.25rem;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.label-optional,.label-character-count{display:inline-flex;align-items:center;max-height:1.25rem;font-size:0.75rem;line-height:1rem}.label-character-count{margin-left:auto}.input-horizontal .label-container.hidden label,.textarea-horizontal .label-container.hidden label,.select-horizontal .label-container.hidden label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.input-horizontal .label-wrapper,.textarea-horizontal .label-wrapper,.select-horizontal .label-wrapper{flex-direction:column}.input-horizontal label,.textarea-horizontal label,.select-horizontal label{min-height:2.5rem;display:inline-flex;align-items:center}.input-horizontal .label-metadata,.textarea-horizontal .label-metadata,.select-horizontal .label-metadata{justify-content:flex-start}.input-horizontal .label-metadata .label-character-count,.textarea-horizontal .label-metadata .label-character-count,.select-horizontal .label-metadata .label-character-count{margin-left:0}:host{display:flex;font-size:0.9375rem;line-height:1.25rem}:host([hidden]){display:none}.input-field,.input-container{display:flex;flex-direction:column;gap:0.5rem;flex:1 1 auto}.input-field.input-horizontal{flex-direction:row;gap:1rem}.input-wrapper{display:flex;align-items:stretch;gap:0.75rem;padding:0 0.75rem;height:2.5rem;overflow:hidden;background:white;border-radius:var(--cat-border-radius-m, 0.25rem);box-shadow:inset 0 0 0 1px rgb(var(--border-color));transition:box-shadow 125ms linear;--border-color:var(--cat-border-color-dark, 215, 219, 224);}.input-wrapper.input-round{border-radius:10rem}.input-wrapper.input-readonly{pointer-events:none}.input-wrapper.input-disabled{background:#f2f4f7;cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.input-wrapper:not(.input-disabled):hover{box-shadow:inset 0 0 0 1px rgb(var(--border-color)), 0 0 0 1px rgb(var(--border-color))}.input-wrapper:focus-within{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:-1px}.input-wrapper.input-invalid{--border-color:var(--cat-danger-bg, 217, 52, 13), 0.2}.input-wrapper:has(input:-webkit-autofill),.input-wrapper:has(input:-webkit-autofill):hover,.input-wrapper:has(input:-webkit-autofill):focus{background-color:#e8f0fe}.text-prefix,.text-suffix{display:inline-flex;align-items:center;-webkit-user-select:none;-ms-user-select:none;user-select:none;}.text-prefix{border-right:1px solid rgb(var(--cat-border-color-dark, 215, 219, 224));padding-right:0.75rem}.text-suffix{border-left:1px solid rgb(var(--cat-border-color-dark, 215, 219, 224));padding-left:0.75rem}.icon-prefix,.icon-suffix{align-self:center}.input-inner-wrapper{display:flex;align-items:center;position:relative;flex:1 1 auto}input{font:inherit;margin:0;padding:0;width:100%;min-width:0;border:none;outline:none;background:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.input-disabled input{cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}input.has-clearable,input.has-toggle-password{padding-right:1.5rem}input.has-clearable.has-toggle-password{padding-right:3.5rem}input::placeholder{color:rgb(var(--cat-font-color-muted, 81, 92, 108))}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 9999px #e8f0fe inset}.clearable{position:absolute;top:calc(50% - 1rem);right:-0.5rem}.toggle-password{position:absolute;top:calc(50% - 1rem);right:-0.5rem}.has-clearable~.toggle-password{right:1.5rem}";
+NumeralFormatter.prototype = {
+    getRawValue: function (value) {
+        return value.replace(this.delimiterRE, '').replace(this.numeralDecimalMark, '.');
+    },
 
-let nextUniqueId$6 = 0;
-const CatInput = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.catChange = index.createEvent(this, "catChange", 7);
-        this.catFocus = index.createEvent(this, "catFocus", 7);
-        this.catBlur = index.createEvent(this, "catBlur", 7);
-        this._id = `cat-input-${nextUniqueId$6++}`;
-        this.hasSlottedLabel = false;
-        this.hasSlottedHint = false;
-        this.isPasswordShown = false;
-        this.errorMap = undefined;
-        this.requiredMarker = 'optional';
-        this.horizontal = false;
-        this.autoComplete = undefined;
-        this.clearable = false;
+    format: function (value) {
+        var owner = this, parts, partSign, partSignAndPrefix, partInteger, partDecimal = '';
+
+        // strip alphabet letters
+        value = value.replace(/[A-Za-z]/g, '')
+            // replace the first decimal mark with reserved placeholder
+            .replace(owner.numeralDecimalMark, 'M')
+
+            // strip non numeric letters except minus and "M"
+            // this is to ensure prefix has been stripped
+            .replace(/[^\dM-]/g, '')
+
+            // replace the leading minus with reserved placeholder
+            .replace(/^\-/, 'N')
+
+            // strip the other minus sign (if present)
+            .replace(/\-/g, '')
+
+            // replace the minus sign (if present)
+            .replace('N', owner.numeralPositiveOnly ? '' : '-')
+
+            // replace decimal mark
+            .replace('M', owner.numeralDecimalMark);
+
+        // strip any leading zeros
+        if (owner.stripLeadingZeroes) {
+            value = value.replace(/^(-)?0+(?=\d)/, '$1');
+        }
+
+        partSign = value.slice(0, 1) === '-' ? '-' : '';
+        if (typeof owner.prefix != 'undefined') {
+            if (owner.signBeforePrefix) {
+                partSignAndPrefix = partSign + owner.prefix;
+            } else {
+                partSignAndPrefix = owner.prefix + partSign;
+            }
+        } else {
+            partSignAndPrefix = partSign;
+        }
+        
+        partInteger = value;
+
+        if (value.indexOf(owner.numeralDecimalMark) >= 0) {
+            parts = value.split(owner.numeralDecimalMark);
+            partInteger = parts[0];
+            partDecimal = owner.numeralDecimalMark + parts[1].slice(0, owner.numeralDecimalScale);
+        }
+
+        if(partSign === '-') {
+            partInteger = partInteger.slice(1);
+        }
+
+        if (owner.numeralIntegerScale > 0) {
+          partInteger = partInteger.slice(0, owner.numeralIntegerScale);
+        }
+
+        switch (owner.numeralThousandsGroupStyle) {
+        case NumeralFormatter.groupStyle.lakh:
+            partInteger = partInteger.replace(/(\d)(?=(\d\d)+\d$)/g, '$1' + owner.delimiter);
+
+            break;
+
+        case NumeralFormatter.groupStyle.wan:
+            partInteger = partInteger.replace(/(\d)(?=(\d{4})+$)/g, '$1' + owner.delimiter);
+
+            break;
+
+        case NumeralFormatter.groupStyle.thousand:
+            partInteger = partInteger.replace(/(\d)(?=(\d{3})+$)/g, '$1' + owner.delimiter);
+
+            break;
+        }
+
+        if (owner.tailPrefix) {
+            return partSign + partInteger.toString() + (owner.numeralDecimalScale > 0 ? partDecimal.toString() : '') + owner.prefix;
+        }
+
+        return partSignAndPrefix + partInteger.toString() + (owner.numeralDecimalScale > 0 ? partDecimal.toString() : '');
+    }
+};
+
+var NumeralFormatter_1 = NumeralFormatter;
+
+var DateFormatter = function (datePattern, dateMin, dateMax) {
+    var owner = this;
+
+    owner.date = [];
+    owner.blocks = [];
+    owner.datePattern = datePattern;
+    owner.dateMin = dateMin
+      .split('-')
+      .reverse()
+      .map(function(x) {
+        return parseInt(x, 10);
+      });
+    if (owner.dateMin.length === 2) owner.dateMin.unshift(0);
+
+    owner.dateMax = dateMax
+      .split('-')
+      .reverse()
+      .map(function(x) {
+        return parseInt(x, 10);
+      });
+    if (owner.dateMax.length === 2) owner.dateMax.unshift(0);
+    
+    owner.initBlocks();
+};
+
+DateFormatter.prototype = {
+    initBlocks: function () {
+        var owner = this;
+        owner.datePattern.forEach(function (value) {
+            if (value === 'Y') {
+                owner.blocks.push(4);
+            } else {
+                owner.blocks.push(2);
+            }
+        });
+    },
+
+    getISOFormatDate: function () {
+        var owner = this,
+            date = owner.date;
+
+        return date[2] ? (
+            date[2] + '-' + owner.addLeadingZero(date[1]) + '-' + owner.addLeadingZero(date[0])
+        ) : '';
+    },
+
+    getBlocks: function () {
+        return this.blocks;
+    },
+
+    getValidatedDate: function (value) {
+        var owner = this, result = '';
+
+        value = value.replace(/[^\d]/g, '');
+
+        owner.blocks.forEach(function (length, index) {
+            if (value.length > 0) {
+                var sub = value.slice(0, length),
+                    sub0 = sub.slice(0, 1),
+                    rest = value.slice(length);
+
+                switch (owner.datePattern[index]) {
+                case 'd':
+                    if (sub === '00') {
+                        sub = '01';
+                    } else if (parseInt(sub0, 10) > 3) {
+                        sub = '0' + sub0;
+                    } else if (parseInt(sub, 10) > 31) {
+                        sub = '31';
+                    }
+
+                    break;
+
+                case 'm':
+                    if (sub === '00') {
+                        sub = '01';
+                    } else if (parseInt(sub0, 10) > 1) {
+                        sub = '0' + sub0;
+                    } else if (parseInt(sub, 10) > 12) {
+                        sub = '12';
+                    }
+
+                    break;
+                }
+
+                result += sub;
+
+                // update remaining string
+                value = rest;
+            }
+        });
+
+        return this.getFixedDateString(result);
+    },
+
+    getFixedDateString: function (value) {
+        var owner = this, datePattern = owner.datePattern, date = [],
+            dayIndex = 0, monthIndex = 0, yearIndex = 0,
+            dayStartIndex = 0, monthStartIndex = 0, yearStartIndex = 0,
+            day, month, year, fullYearDone = false;
+
+        // mm-dd || dd-mm
+        if (value.length === 4 && datePattern[0].toLowerCase() !== 'y' && datePattern[1].toLowerCase() !== 'y') {
+            dayStartIndex = datePattern[0] === 'd' ? 0 : 2;
+            monthStartIndex = 2 - dayStartIndex;
+            day = parseInt(value.slice(dayStartIndex, dayStartIndex + 2), 10);
+            month = parseInt(value.slice(monthStartIndex, monthStartIndex + 2), 10);
+
+            date = this.getFixedDate(day, month, 0);
+        }
+
+        // yyyy-mm-dd || yyyy-dd-mm || mm-dd-yyyy || dd-mm-yyyy || dd-yyyy-mm || mm-yyyy-dd
+        if (value.length === 8) {
+            datePattern.forEach(function (type, index) {
+                switch (type) {
+                case 'd':
+                    dayIndex = index;
+                    break;
+                case 'm':
+                    monthIndex = index;
+                    break;
+                default:
+                    yearIndex = index;
+                    break;
+                }
+            });
+
+            yearStartIndex = yearIndex * 2;
+            dayStartIndex = (dayIndex <= yearIndex) ? dayIndex * 2 : (dayIndex * 2 + 2);
+            monthStartIndex = (monthIndex <= yearIndex) ? monthIndex * 2 : (monthIndex * 2 + 2);
+
+            day = parseInt(value.slice(dayStartIndex, dayStartIndex + 2), 10);
+            month = parseInt(value.slice(monthStartIndex, monthStartIndex + 2), 10);
+            year = parseInt(value.slice(yearStartIndex, yearStartIndex + 4), 10);
+
+            fullYearDone = value.slice(yearStartIndex, yearStartIndex + 4).length === 4;
+
+            date = this.getFixedDate(day, month, year);
+        }
+
+        // mm-yy || yy-mm
+        if (value.length === 4 && (datePattern[0] === 'y' || datePattern[1] === 'y')) {
+            monthStartIndex = datePattern[0] === 'm' ? 0 : 2;
+            yearStartIndex = 2 - monthStartIndex;
+            month = parseInt(value.slice(monthStartIndex, monthStartIndex + 2), 10);
+            year = parseInt(value.slice(yearStartIndex, yearStartIndex + 2), 10);
+
+            fullYearDone = value.slice(yearStartIndex, yearStartIndex + 2).length === 2;
+
+            date = [0, month, year];
+        }
+
+        // mm-yyyy || yyyy-mm
+        if (value.length === 6 && (datePattern[0] === 'Y' || datePattern[1] === 'Y')) {
+            monthStartIndex = datePattern[0] === 'm' ? 0 : 4;
+            yearStartIndex = 2 - 0.5 * monthStartIndex;
+            month = parseInt(value.slice(monthStartIndex, monthStartIndex + 2), 10);
+            year = parseInt(value.slice(yearStartIndex, yearStartIndex + 4), 10);
+
+            fullYearDone = value.slice(yearStartIndex, yearStartIndex + 4).length === 4;
+
+            date = [0, month, year];
+        }
+
+        date = owner.getRangeFixedDate(date);
+        owner.date = date;
+
+        var result = date.length === 0 ? value : datePattern.reduce(function (previous, current) {
+            switch (current) {
+            case 'd':
+                return previous + (date[0] === 0 ? '' : owner.addLeadingZero(date[0]));
+            case 'm':
+                return previous + (date[1] === 0 ? '' : owner.addLeadingZero(date[1]));
+            case 'y':
+                return previous + (fullYearDone ? owner.addLeadingZeroForYear(date[2], false) : '');
+            case 'Y':
+                return previous + (fullYearDone ? owner.addLeadingZeroForYear(date[2], true) : '');
+            }
+        }, '');
+
+        return result;
+    },
+
+    getRangeFixedDate: function (date) {
+        var owner = this,
+            datePattern = owner.datePattern,
+            dateMin = owner.dateMin || [],
+            dateMax = owner.dateMax || [];
+
+        if (!date.length || (dateMin.length < 3 && dateMax.length < 3)) return date;
+
+        if (
+          datePattern.find(function(x) {
+            return x.toLowerCase() === 'y';
+          }) &&
+          date[2] === 0
+        ) return date;
+
+        if (dateMax.length && (dateMax[2] < date[2] || (
+          dateMax[2] === date[2] && (dateMax[1] < date[1] || (
+            dateMax[1] === date[1] && dateMax[0] < date[0]
+          ))
+        ))) return dateMax;
+
+        if (dateMin.length && (dateMin[2] > date[2] || (
+          dateMin[2] === date[2] && (dateMin[1] > date[1] || (
+            dateMin[1] === date[1] && dateMin[0] > date[0]
+          ))
+        ))) return dateMin;
+
+        return date;
+    },
+
+    getFixedDate: function (day, month, year) {
+        day = Math.min(day, 31);
+        month = Math.min(month, 12);
+        year = parseInt((year || 0), 10);
+
+        if ((month < 7 && month % 2 === 0) || (month > 8 && month % 2 === 1)) {
+            day = Math.min(day, month === 2 ? (this.isLeapYear(year) ? 29 : 28) : 30);
+        }
+
+        return [day, month, year];
+    },
+
+    isLeapYear: function (year) {
+        return ((year % 4 === 0) && (year % 100 !== 0)) || (year % 400 === 0);
+    },
+
+    addLeadingZero: function (number) {
+        return (number < 10 ? '0' : '') + number;
+    },
+
+    addLeadingZeroForYear: function (number, fullYearMode) {
+        if (fullYearMode) {
+            return (number < 10 ? '000' : (number < 100 ? '00' : (number < 1000 ? '0' : ''))) + number;
+        }
+
+        return (number < 10 ? '0' : '') + number;
+    }
+};
+
+var DateFormatter_1 = DateFormatter;
+
+var TimeFormatter = function (timePattern, timeFormat) {
+    var owner = this;
+
+    owner.time = [];
+    owner.blocks = [];
+    owner.timePattern = timePattern;
+    owner.timeFormat = timeFormat;
+    owner.initBlocks();
+};
+
+TimeFormatter.prototype = {
+    initBlocks: function () {
+        var owner = this;
+        owner.timePattern.forEach(function () {
+            owner.blocks.push(2);
+        });
+    },
+
+    getISOFormatTime: function () {
+        var owner = this,
+            time = owner.time;
+
+        return time[2] ? (
+            owner.addLeadingZero(time[0]) + ':' + owner.addLeadingZero(time[1]) + ':' + owner.addLeadingZero(time[2])
+        ) : '';
+    },
+
+    getBlocks: function () {
+        return this.blocks;
+    },
+
+    getTimeFormatOptions: function () {
+        var owner = this;
+        if (String(owner.timeFormat) === '12') {
+            return {
+                maxHourFirstDigit: 1,
+                maxHours: 12,
+                maxMinutesFirstDigit: 5,
+                maxMinutes: 60
+            };
+        }
+
+        return {
+            maxHourFirstDigit: 2,
+            maxHours: 23,
+            maxMinutesFirstDigit: 5,
+            maxMinutes: 60
+        };
+    },
+
+    getValidatedTime: function (value) {
+        var owner = this, result = '';
+
+        value = value.replace(/[^\d]/g, '');
+
+        var timeFormatOptions = owner.getTimeFormatOptions();
+
+        owner.blocks.forEach(function (length, index) {
+            if (value.length > 0) {
+                var sub = value.slice(0, length),
+                    sub0 = sub.slice(0, 1),
+                    rest = value.slice(length);
+
+                switch (owner.timePattern[index]) {
+
+                case 'h':
+                    if (parseInt(sub0, 10) > timeFormatOptions.maxHourFirstDigit) {
+                        sub = '0' + sub0;
+                    } else if (parseInt(sub, 10) > timeFormatOptions.maxHours) {
+                        sub = timeFormatOptions.maxHours + '';
+                    }
+
+                    break;
+
+                case 'm':
+                case 's':
+                    if (parseInt(sub0, 10) > timeFormatOptions.maxMinutesFirstDigit) {
+                        sub = '0' + sub0;
+                    } else if (parseInt(sub, 10) > timeFormatOptions.maxMinutes) {
+                        sub = timeFormatOptions.maxMinutes + '';
+                    }
+                    break;
+                }
+
+                result += sub;
+
+                // update remaining string
+                value = rest;
+            }
+        });
+
+        return this.getFixedTimeString(result);
+    },
+
+    getFixedTimeString: function (value) {
+        var owner = this, timePattern = owner.timePattern, time = [],
+            secondIndex = 0, minuteIndex = 0, hourIndex = 0,
+            secondStartIndex = 0, minuteStartIndex = 0, hourStartIndex = 0,
+            second, minute, hour;
+
+        if (value.length === 6) {
+            timePattern.forEach(function (type, index) {
+                switch (type) {
+                case 's':
+                    secondIndex = index * 2;
+                    break;
+                case 'm':
+                    minuteIndex = index * 2;
+                    break;
+                case 'h':
+                    hourIndex = index * 2;
+                    break;
+                }
+            });
+
+            hourStartIndex = hourIndex;
+            minuteStartIndex = minuteIndex;
+            secondStartIndex = secondIndex;
+
+            second = parseInt(value.slice(secondStartIndex, secondStartIndex + 2), 10);
+            minute = parseInt(value.slice(minuteStartIndex, minuteStartIndex + 2), 10);
+            hour = parseInt(value.slice(hourStartIndex, hourStartIndex + 2), 10);
+
+            time = this.getFixedTime(hour, minute, second);
+        }
+
+        if (value.length === 4 && owner.timePattern.indexOf('s') < 0) {
+            timePattern.forEach(function (type, index) {
+                switch (type) {
+                case 'm':
+                    minuteIndex = index * 2;
+                    break;
+                case 'h':
+                    hourIndex = index * 2;
+                    break;
+                }
+            });
+
+            hourStartIndex = hourIndex;
+            minuteStartIndex = minuteIndex;
+
+            second = 0;
+            minute = parseInt(value.slice(minuteStartIndex, minuteStartIndex + 2), 10);
+            hour = parseInt(value.slice(hourStartIndex, hourStartIndex + 2), 10);
+
+            time = this.getFixedTime(hour, minute, second);
+        }
+
+        owner.time = time;
+
+        return time.length === 0 ? value : timePattern.reduce(function (previous, current) {
+            switch (current) {
+            case 's':
+                return previous + owner.addLeadingZero(time[2]);
+            case 'm':
+                return previous + owner.addLeadingZero(time[1]);
+            case 'h':
+                return previous + owner.addLeadingZero(time[0]);
+            }
+        }, '');
+    },
+
+    getFixedTime: function (hour, minute, second) {
+        second = Math.min(parseInt(second || 0, 10), 60);
+        minute = Math.min(minute, 60);
+        hour = Math.min(hour, 60);
+
+        return [hour, minute, second];
+    },
+
+    addLeadingZero: function (number) {
+        return (number < 10 ? '0' : '') + number;
+    }
+};
+
+var TimeFormatter_1 = TimeFormatter;
+
+var PhoneFormatter = function (formatter, delimiter) {
+    var owner = this;
+
+    owner.delimiter = (delimiter || delimiter === '') ? delimiter : ' ';
+    owner.delimiterRE = delimiter ? new RegExp('\\' + delimiter, 'g') : '';
+
+    owner.formatter = formatter;
+};
+
+PhoneFormatter.prototype = {
+    setFormatter: function (formatter) {
+        this.formatter = formatter;
+    },
+
+    format: function (phoneNumber) {
+        var owner = this;
+
+        owner.formatter.clear();
+
+        // only keep number and +
+        phoneNumber = phoneNumber.replace(/[^\d+]/g, '');
+
+        // strip non-leading +
+        phoneNumber = phoneNumber.replace(/^\+/, 'B').replace(/\+/g, '').replace('B', '+');
+
+        // strip delimiter
+        phoneNumber = phoneNumber.replace(owner.delimiterRE, '');
+
+        var result = '', current, validated = false;
+
+        for (var i = 0, iMax = phoneNumber.length; i < iMax; i++) {
+            current = owner.formatter.inputDigit(phoneNumber.charAt(i));
+
+            // has ()- or space inside
+            if (/[\s()-]/g.test(current)) {
+                result = current;
+
+                validated = true;
+            } else {
+                if (!validated) {
+                    result = current;
+                }
+                // else: over length input
+                // it turns to invalid number again
+            }
+        }
+
+        // strip ()
+        // e.g. US: 7161234567 returns (716) 123-4567
+        result = result.replace(/[()]/g, '');
+        // replace library delimiter with user customized delimiter
+        result = result.replace(/[\s-]/g, owner.delimiter);
+
+        return result;
+    }
+};
+
+var PhoneFormatter_1 = PhoneFormatter;
+
+var CreditCardDetector = {
+    blocks: {
+        uatp:          [4, 5, 6],
+        amex:          [4, 6, 5],
+        diners:        [4, 6, 4],
+        discover:      [4, 4, 4, 4],
+        mastercard:    [4, 4, 4, 4],
+        dankort:       [4, 4, 4, 4],
+        instapayment:  [4, 4, 4, 4],
+        jcb15:         [4, 6, 5],
+        jcb:           [4, 4, 4, 4],
+        maestro:       [4, 4, 4, 4],
+        visa:          [4, 4, 4, 4],
+        mir:           [4, 4, 4, 4],
+        unionPay:      [4, 4, 4, 4],
+        general:       [4, 4, 4, 4]
+    },
+
+    re: {
+        // starts with 1; 15 digits, not starts with 1800 (jcb card)
+        uatp: /^(?!1800)1\d{0,14}/,
+
+        // starts with 34/37; 15 digits
+        amex: /^3[47]\d{0,13}/,
+
+        // starts with 6011/65/644-649; 16 digits
+        discover: /^(?:6011|65\d{0,2}|64[4-9]\d?)\d{0,12}/,
+
+        // starts with 300-305/309 or 36/38/39; 14 digits
+        diners: /^3(?:0([0-5]|9)|[689]\d?)\d{0,11}/,
+
+        // starts with 51-55/2221–2720; 16 digits
+        mastercard: /^(5[1-5]\d{0,2}|22[2-9]\d{0,1}|2[3-7]\d{0,2})\d{0,12}/,
+
+        // starts with 5019/4175/4571; 16 digits
+        dankort: /^(5019|4175|4571)\d{0,12}/,
+
+        // starts with 637-639; 16 digits
+        instapayment: /^63[7-9]\d{0,13}/,
+
+        // starts with 2131/1800; 15 digits
+        jcb15: /^(?:2131|1800)\d{0,11}/,
+
+        // starts with 2131/1800/35; 16 digits
+        jcb: /^(?:35\d{0,2})\d{0,12}/,
+
+        // starts with 50/56-58/6304/67; 16 digits
+        maestro: /^(?:5[0678]\d{0,2}|6304|67\d{0,2})\d{0,12}/,
+
+        // starts with 22; 16 digits
+        mir: /^220[0-4]\d{0,12}/,
+
+        // starts with 4; 16 digits
+        visa: /^4\d{0,15}/,
+
+        // starts with 62/81; 16 digits
+        unionPay: /^(62|81)\d{0,14}/
+    },
+
+    getStrictBlocks: function (block) {
+      var total = block.reduce(function (prev, current) {
+        return prev + current;
+      }, 0);
+
+      return block.concat(19 - total);
+    },
+
+    getInfo: function (value, strictMode) {
+        var blocks = CreditCardDetector.blocks,
+            re = CreditCardDetector.re;
+
+        // Some credit card can have up to 19 digits number.
+        // Set strictMode to true will remove the 16 max-length restrain,
+        // however, I never found any website validate card number like
+        // this, hence probably you don't want to enable this option.
+        strictMode = !!strictMode;
+
+        for (var key in re) {
+            if (re[key].test(value)) {
+                var matchedBlocks = blocks[key];
+                return {
+                    type: key,
+                    blocks: strictMode ? this.getStrictBlocks(matchedBlocks) : matchedBlocks
+                };
+            }
+        }
+
+        return {
+            type: 'unknown',
+            blocks: strictMode ? this.getStrictBlocks(blocks.general) : blocks.general
+        };
+    }
+};
+
+var CreditCardDetector_1 = CreditCardDetector;
+
+var Util = {
+    noop: function () {
+    },
+
+    strip: function (value, re) {
+        return value.replace(re, '');
+    },
+
+    getPostDelimiter: function (value, delimiter, delimiters) {
+        // single delimiter
+        if (delimiters.length === 0) {
+            return value.slice(-delimiter.length) === delimiter ? delimiter : '';
+        }
+
+        // multiple delimiters
+        var matchedDelimiter = '';
+        delimiters.forEach(function (current) {
+            if (value.slice(-current.length) === current) {
+                matchedDelimiter = current;
+            }
+        });
+
+        return matchedDelimiter;
+    },
+
+    getDelimiterREByDelimiter: function (delimiter) {
+        return new RegExp(delimiter.replace(/([.?*+^$[\]\\(){}|-])/g, '\\$1'), 'g');
+    },
+
+    getNextCursorPosition: function (prevPos, oldValue, newValue, delimiter, delimiters) {
+      // If cursor was at the end of value, just place it back.
+      // Because new value could contain additional chars.
+      if (oldValue.length === prevPos) {
+          return newValue.length;
+      }
+
+      return prevPos + this.getPositionOffset(prevPos, oldValue, newValue, delimiter ,delimiters);
+    },
+
+    getPositionOffset: function (prevPos, oldValue, newValue, delimiter, delimiters) {
+        var oldRawValue, newRawValue, lengthOffset;
+
+        oldRawValue = this.stripDelimiters(oldValue.slice(0, prevPos), delimiter, delimiters);
+        newRawValue = this.stripDelimiters(newValue.slice(0, prevPos), delimiter, delimiters);
+        lengthOffset = oldRawValue.length - newRawValue.length;
+
+        return (lengthOffset !== 0) ? (lengthOffset / Math.abs(lengthOffset)) : 0;
+    },
+
+    stripDelimiters: function (value, delimiter, delimiters) {
+        var owner = this;
+
+        // single delimiter
+        if (delimiters.length === 0) {
+            var delimiterRE = delimiter ? owner.getDelimiterREByDelimiter(delimiter) : '';
+
+            return value.replace(delimiterRE, '');
+        }
+
+        // multiple delimiters
+        delimiters.forEach(function (current) {
+            current.split('').forEach(function (letter) {
+                value = value.replace(owner.getDelimiterREByDelimiter(letter), '');
+            });
+        });
+
+        return value;
+    },
+
+    headStr: function (str, length) {
+        return str.slice(0, length);
+    },
+
+    getMaxLength: function (blocks) {
+        return blocks.reduce(function (previous, current) {
+            return previous + current;
+        }, 0);
+    },
+
+    // strip prefix
+    // Before type  |   After type    |     Return value
+    // PEFIX-...    |   PEFIX-...     |     ''
+    // PREFIX-123   |   PEFIX-123     |     123
+    // PREFIX-123   |   PREFIX-23     |     23
+    // PREFIX-123   |   PREFIX-1234   |     1234
+    getPrefixStrippedValue: function (value, prefix, prefixLength, prevResult, delimiter, delimiters, noImmediatePrefix, tailPrefix, signBeforePrefix) {
+        // No prefix
+        if (prefixLength === 0) {
+          return value;
+        }
+
+        // Value is prefix
+        if (value === prefix && value !== '') {
+          return '';
+        }
+
+        if (signBeforePrefix && (value.slice(0, 1) == '-')) {
+            var prev = (prevResult.slice(0, 1) == '-') ? prevResult.slice(1) : prevResult;
+            return '-' + this.getPrefixStrippedValue(value.slice(1), prefix, prefixLength, prev, delimiter, delimiters, noImmediatePrefix, tailPrefix, signBeforePrefix);
+        }
+
+        // Pre result prefix string does not match pre-defined prefix
+        if (prevResult.slice(0, prefixLength) !== prefix && !tailPrefix) {
+            // Check if the first time user entered something
+            if (noImmediatePrefix && !prevResult && value) return value;
+            return '';
+        } else if (prevResult.slice(-prefixLength) !== prefix && tailPrefix) {
+            // Check if the first time user entered something
+            if (noImmediatePrefix && !prevResult && value) return value;
+            return '';
+        }
+
+        var prevValue = this.stripDelimiters(prevResult, delimiter, delimiters);
+
+        // New value has issue, someone typed in between prefix letters
+        // Revert to pre value
+        if (value.slice(0, prefixLength) !== prefix && !tailPrefix) {
+            return prevValue.slice(prefixLength);
+        } else if (value.slice(-prefixLength) !== prefix && tailPrefix) {
+            return prevValue.slice(0, -prefixLength - 1);
+        }
+
+        // No issue, strip prefix for new value
+        return tailPrefix ? value.slice(0, -prefixLength) : value.slice(prefixLength);
+    },
+
+    getFirstDiffIndex: function (prev, current) {
+        var index = 0;
+
+        while (prev.charAt(index) === current.charAt(index)) {
+            if (prev.charAt(index++) === '') {
+                return -1;
+            }
+        }
+
+        return index;
+    },
+
+    getFormattedValue: function (value, blocks, blocksLength, delimiter, delimiters, delimiterLazyShow) {
+        var result = '',
+            multipleDelimiters = delimiters.length > 0,
+            currentDelimiter = '';
+
+        // no options, normal input
+        if (blocksLength === 0) {
+            return value;
+        }
+
+        blocks.forEach(function (length, index) {
+            if (value.length > 0) {
+                var sub = value.slice(0, length),
+                    rest = value.slice(length);
+
+                if (multipleDelimiters) {
+                    currentDelimiter = delimiters[delimiterLazyShow ? (index - 1) : index] || currentDelimiter;
+                } else {
+                    currentDelimiter = delimiter;
+                }
+
+                if (delimiterLazyShow) {
+                    if (index > 0) {
+                        result += currentDelimiter;
+                    }
+
+                    result += sub;
+                } else {
+                    result += sub;
+
+                    if (sub.length === length && index < blocksLength - 1) {
+                        result += currentDelimiter;
+                    }
+                }
+
+                // update remaining string
+                value = rest;
+            }
+        });
+
+        return result;
+    },
+
+    // move cursor to the end
+    // the first time user focuses on an input with prefix
+    fixPrefixCursor: function (el, prefix, delimiter, delimiters) {
+        if (!el) {
+            return;
+        }
+
+        var val = el.value,
+            appendix = delimiter || (delimiters[0] || ' ');
+
+        if (!el.setSelectionRange || !prefix || (prefix.length + appendix.length) <= val.length) {
+            return;
+        }
+
+        var len = val.length * 2;
+
+        // set timeout to avoid blink
+        setTimeout(function () {
+            el.setSelectionRange(len, len);
+        }, 1);
+    },
+
+    // Check if input field is fully selected
+    checkFullSelection: function(value) {
+      try {
+        var selection = window.getSelection() || document.getSelection() || {};
+        return selection.toString().length === value.length;
+      } catch (ex) {
+        // Ignore
+      }
+
+      return false;
+    },
+
+    setSelection: function (element, position, doc) {
+        if (element !== this.getActiveElement(doc)) {
+            return;
+        }
+
+        // cursor is already in the end
+        if (element && element.value.length <= position) {
+          return;
+        }
+
+        if (element.createTextRange) {
+            var range = element.createTextRange();
+
+            range.move('character', position);
+            range.select();
+        } else {
+            try {
+                element.setSelectionRange(position, position);
+            } catch (e) {
+                // eslint-disable-next-line
+                console.warn('The input element type does not support selection');
+            }
+        }
+    },
+
+    getActiveElement: function(parent) {
+        var activeElement = parent.activeElement;
+        if (activeElement && activeElement.shadowRoot) {
+            return this.getActiveElement(activeElement.shadowRoot);
+        }
+        return activeElement;
+    },
+
+    isAndroid: function () {
+        return navigator && /android/i.test(navigator.userAgent);
+    },
+
+    // On Android chrome, the keyup and keydown events
+    // always return key code 229 as a composition that
+    // buffers the user’s keystrokes
+    // see https://github.com/nosir/cleave.js/issues/147
+    isAndroidBackspaceKeydown: function (lastInputValue, currentInputValue) {
+        if (!this.isAndroid() || !lastInputValue || !currentInputValue) {
+            return false;
+        }
+
+        return currentInputValue === lastInputValue.slice(0, -1);
+    }
+};
+
+var Util_1 = Util;
+
+/**
+ * Props Assignment
+ *
+ * Separate this, so react module can share the usage
+ */
+var DefaultProperties = {
+    // Maybe change to object-assign
+    // for now just keep it as simple
+    assign: function (target, opts) {
+        target = target || {};
+        opts = opts || {};
+
+        // credit card
+        target.creditCard = !!opts.creditCard;
+        target.creditCardStrictMode = !!opts.creditCardStrictMode;
+        target.creditCardType = '';
+        target.onCreditCardTypeChanged = opts.onCreditCardTypeChanged || (function () {});
+
+        // phone
+        target.phone = !!opts.phone;
+        target.phoneRegionCode = opts.phoneRegionCode || 'AU';
+        target.phoneFormatter = {};
+
+        // time
+        target.time = !!opts.time;
+        target.timePattern = opts.timePattern || ['h', 'm', 's'];
+        target.timeFormat = opts.timeFormat || '24';
+        target.timeFormatter = {};
+
+        // date
+        target.date = !!opts.date;
+        target.datePattern = opts.datePattern || ['d', 'm', 'Y'];
+        target.dateMin = opts.dateMin || '';
+        target.dateMax = opts.dateMax || '';
+        target.dateFormatter = {};
+
+        // numeral
+        target.numeral = !!opts.numeral;
+        target.numeralIntegerScale = opts.numeralIntegerScale > 0 ? opts.numeralIntegerScale : 0;
+        target.numeralDecimalScale = opts.numeralDecimalScale >= 0 ? opts.numeralDecimalScale : 2;
+        target.numeralDecimalMark = opts.numeralDecimalMark || '.';
+        target.numeralThousandsGroupStyle = opts.numeralThousandsGroupStyle || 'thousand';
+        target.numeralPositiveOnly = !!opts.numeralPositiveOnly;
+        target.stripLeadingZeroes = opts.stripLeadingZeroes !== false;
+        target.signBeforePrefix = !!opts.signBeforePrefix;
+        target.tailPrefix = !!opts.tailPrefix;
+
+        // others
+        target.swapHiddenInput = !!opts.swapHiddenInput;
+        
+        target.numericOnly = target.creditCard || target.date || !!opts.numericOnly;
+
+        target.uppercase = !!opts.uppercase;
+        target.lowercase = !!opts.lowercase;
+
+        target.prefix = (target.creditCard || target.date) ? '' : (opts.prefix || '');
+        target.noImmediatePrefix = !!opts.noImmediatePrefix;
+        target.prefixLength = target.prefix.length;
+        target.rawValueTrimPrefix = !!opts.rawValueTrimPrefix;
+        target.copyDelimiter = !!opts.copyDelimiter;
+
+        target.initValue = (opts.initValue !== undefined && opts.initValue !== null) ? opts.initValue.toString() : '';
+
+        target.delimiter =
+            (opts.delimiter || opts.delimiter === '') ? opts.delimiter :
+                (opts.date ? '/' :
+                    (opts.time ? ':' :
+                        (opts.numeral ? ',' :
+                            (opts.phone ? ' ' :
+                                ' '))));
+        target.delimiterLength = target.delimiter.length;
+        target.delimiterLazyShow = !!opts.delimiterLazyShow;
+        target.delimiters = opts.delimiters || [];
+
+        target.blocks = opts.blocks || [];
+        target.blocksLength = target.blocks.length;
+
+        target.root = (typeof commonjsGlobal === 'object' && commonjsGlobal) ? commonjsGlobal : window;
+        target.document = opts.document || target.root.document;
+
+        target.maxLength = 0;
+
+        target.backspace = false;
+        target.result = '';
+
+        target.onValueChanged = opts.onValueChanged || (function () {});
+
+        return target;
+    }
+};
+
+var DefaultProperties_1 = DefaultProperties;
+
+/**
+ * Construct a new Cleave instance by passing the configuration object
+ *
+ * @param {String | HTMLElement} element
+ * @param {Object} opts
+ */
+var Cleave = function (element, opts) {
+    var owner = this;
+    var hasMultipleElements = false;
+
+    if (typeof element === 'string') {
+        owner.element = document.querySelector(element);
+        hasMultipleElements = document.querySelectorAll(element).length > 1;
+    } else {
+      if (typeof element.length !== 'undefined' && element.length > 0) {
+        owner.element = element[0];
+        hasMultipleElements = element.length > 1;
+      } else {
+        owner.element = element;
+      }
+    }
+
+    if (!owner.element) {
+        throw new Error('[cleave.js] Please check the element');
+    }
+
+    if (hasMultipleElements) {
+      try {
+        // eslint-disable-next-line
+        console.warn('[cleave.js] Multiple input fields matched, cleave.js will only take the first one.');
+      } catch (e) {
+        // Old IE
+      }
+    }
+
+    opts.initValue = owner.element.value;
+
+    owner.properties = Cleave.DefaultProperties.assign({}, opts);
+
+    owner.init();
+};
+
+Cleave.prototype = {
+    init: function () {
+        var owner = this, pps = owner.properties;
+
+        // no need to use this lib
+        if (!pps.numeral && !pps.phone && !pps.creditCard && !pps.time && !pps.date && (pps.blocksLength === 0 && !pps.prefix)) {
+            owner.onInput(pps.initValue);
+
+            return;
+        }
+
+        pps.maxLength = Cleave.Util.getMaxLength(pps.blocks);
+
+        owner.isAndroid = Cleave.Util.isAndroid();
+        owner.lastInputValue = '';
+        owner.isBackward = '';
+
+        owner.onChangeListener = owner.onChange.bind(owner);
+        owner.onKeyDownListener = owner.onKeyDown.bind(owner);
+        owner.onFocusListener = owner.onFocus.bind(owner);
+        owner.onCutListener = owner.onCut.bind(owner);
+        owner.onCopyListener = owner.onCopy.bind(owner);
+
+        owner.initSwapHiddenInput();
+
+        owner.element.addEventListener('input', owner.onChangeListener);
+        owner.element.addEventListener('keydown', owner.onKeyDownListener);
+        owner.element.addEventListener('focus', owner.onFocusListener);
+        owner.element.addEventListener('cut', owner.onCutListener);
+        owner.element.addEventListener('copy', owner.onCopyListener);
+
+
+        owner.initPhoneFormatter();
+        owner.initDateFormatter();
+        owner.initTimeFormatter();
+        owner.initNumeralFormatter();
+
+        // avoid touch input field if value is null
+        // otherwise Firefox will add red box-shadow for <input required />
+        if (pps.initValue || (pps.prefix && !pps.noImmediatePrefix)) {
+            owner.onInput(pps.initValue);
+        }
+    },
+
+    initSwapHiddenInput: function () {
+        var owner = this, pps = owner.properties;
+        if (!pps.swapHiddenInput) return;
+
+        var inputFormatter = owner.element.cloneNode(true);
+        owner.element.parentNode.insertBefore(inputFormatter, owner.element);
+
+        owner.elementSwapHidden = owner.element;
+        owner.elementSwapHidden.type = 'hidden';
+
+        owner.element = inputFormatter;
+        owner.element.id = '';
+    },
+
+    initNumeralFormatter: function () {
+        var owner = this, pps = owner.properties;
+
+        if (!pps.numeral) {
+            return;
+        }
+
+        pps.numeralFormatter = new Cleave.NumeralFormatter(
+            pps.numeralDecimalMark,
+            pps.numeralIntegerScale,
+            pps.numeralDecimalScale,
+            pps.numeralThousandsGroupStyle,
+            pps.numeralPositiveOnly,
+            pps.stripLeadingZeroes,
+            pps.prefix,
+            pps.signBeforePrefix,
+            pps.tailPrefix,
+            pps.delimiter
+        );
+    },
+
+    initTimeFormatter: function() {
+        var owner = this, pps = owner.properties;
+
+        if (!pps.time) {
+            return;
+        }
+
+        pps.timeFormatter = new Cleave.TimeFormatter(pps.timePattern, pps.timeFormat);
+        pps.blocks = pps.timeFormatter.getBlocks();
+        pps.blocksLength = pps.blocks.length;
+        pps.maxLength = Cleave.Util.getMaxLength(pps.blocks);
+    },
+
+    initDateFormatter: function () {
+        var owner = this, pps = owner.properties;
+
+        if (!pps.date) {
+            return;
+        }
+
+        pps.dateFormatter = new Cleave.DateFormatter(pps.datePattern, pps.dateMin, pps.dateMax);
+        pps.blocks = pps.dateFormatter.getBlocks();
+        pps.blocksLength = pps.blocks.length;
+        pps.maxLength = Cleave.Util.getMaxLength(pps.blocks);
+    },
+
+    initPhoneFormatter: function () {
+        var owner = this, pps = owner.properties;
+
+        if (!pps.phone) {
+            return;
+        }
+
+        // Cleave.AsYouTypeFormatter should be provided by
+        // external google closure lib
+        try {
+            pps.phoneFormatter = new Cleave.PhoneFormatter(
+                new pps.root.Cleave.AsYouTypeFormatter(pps.phoneRegionCode),
+                pps.delimiter
+            );
+        } catch (ex) {
+            throw new Error('[cleave.js] Please include phone-type-formatter.{country}.js lib');
+        }
+    },
+
+    onKeyDown: function (event) {
+        var owner = this,
+            charCode = event.which || event.keyCode;
+
+        owner.lastInputValue = owner.element.value;
+        owner.isBackward = charCode === 8;
+    },
+
+    onChange: function (event) {
+        var owner = this, pps = owner.properties,
+            Util = Cleave.Util;
+
+        owner.isBackward = owner.isBackward || event.inputType === 'deleteContentBackward';
+
+        var postDelimiter = Util.getPostDelimiter(owner.lastInputValue, pps.delimiter, pps.delimiters);
+
+        if (owner.isBackward && postDelimiter) {
+            pps.postDelimiterBackspace = postDelimiter;
+        } else {
+            pps.postDelimiterBackspace = false;
+        }
+
+        this.onInput(this.element.value);
+    },
+
+    onFocus: function () {
+        var owner = this,
+            pps = owner.properties;
+        owner.lastInputValue = owner.element.value;
+
+        if (pps.prefix && pps.noImmediatePrefix && !owner.element.value) {
+            this.onInput(pps.prefix);
+        }
+
+        Cleave.Util.fixPrefixCursor(owner.element, pps.prefix, pps.delimiter, pps.delimiters);
+    },
+
+    onCut: function (e) {
+        if (!Cleave.Util.checkFullSelection(this.element.value)) return;
+        this.copyClipboardData(e);
+        this.onInput('');
+    },
+
+    onCopy: function (e) {
+        if (!Cleave.Util.checkFullSelection(this.element.value)) return;
+        this.copyClipboardData(e);
+    },
+
+    copyClipboardData: function (e) {
+        var owner = this,
+            pps = owner.properties,
+            Util = Cleave.Util,
+            inputValue = owner.element.value,
+            textToCopy = '';
+
+        if (!pps.copyDelimiter) {
+            textToCopy = Util.stripDelimiters(inputValue, pps.delimiter, pps.delimiters);
+        } else {
+            textToCopy = inputValue;
+        }
+
+        try {
+            if (e.clipboardData) {
+                e.clipboardData.setData('Text', textToCopy);
+            } else {
+                window.clipboardData.setData('Text', textToCopy);
+            }
+
+            e.preventDefault();
+        } catch (ex) {
+            //  empty
+        }
+    },
+
+    onInput: function (value) {
+        var owner = this, pps = owner.properties,
+            Util = Cleave.Util;
+
+        // case 1: delete one more character "4"
+        // 1234*| -> hit backspace -> 123|
+        // case 2: last character is not delimiter which is:
+        // 12|34* -> hit backspace -> 1|34*
+        // note: no need to apply this for numeral mode
+        var postDelimiterAfter = Util.getPostDelimiter(value, pps.delimiter, pps.delimiters);
+        if (!pps.numeral && pps.postDelimiterBackspace && !postDelimiterAfter) {
+            value = Util.headStr(value, value.length - pps.postDelimiterBackspace.length);
+        }
+
+        // phone formatter
+        if (pps.phone) {
+            if (pps.prefix && (!pps.noImmediatePrefix || value.length)) {
+                pps.result = pps.prefix + pps.phoneFormatter.format(value).slice(pps.prefix.length);
+            } else {
+                pps.result = pps.phoneFormatter.format(value);
+            }
+            owner.updateValueState();
+
+            return;
+        }
+
+        // numeral formatter
+        if (pps.numeral) {
+            // Do not show prefix when noImmediatePrefix is specified
+            // This mostly because we need to show user the native input placeholder
+            if (pps.prefix && pps.noImmediatePrefix && value.length === 0) {
+                pps.result = '';
+            } else {
+                pps.result = pps.numeralFormatter.format(value);
+            }
+            owner.updateValueState();
+
+            return;
+        }
+
+        // date
+        if (pps.date) {
+            value = pps.dateFormatter.getValidatedDate(value);
+        }
+
+        // time
+        if (pps.time) {
+            value = pps.timeFormatter.getValidatedTime(value);
+        }
+
+        // strip delimiters
+        value = Util.stripDelimiters(value, pps.delimiter, pps.delimiters);
+
+        // strip prefix
+        value = Util.getPrefixStrippedValue(value, pps.prefix, pps.prefixLength, pps.result, pps.delimiter, pps.delimiters, pps.noImmediatePrefix, pps.tailPrefix, pps.signBeforePrefix);
+
+        // strip non-numeric characters
+        value = pps.numericOnly ? Util.strip(value, /[^\d]/g) : value;
+
+        // convert case
+        value = pps.uppercase ? value.toUpperCase() : value;
+        value = pps.lowercase ? value.toLowerCase() : value;
+
+        // prevent from showing prefix when no immediate option enabled with empty input value
+        if (pps.prefix) {
+            if (pps.tailPrefix) {
+                value = value + pps.prefix;
+            } else {
+                value = pps.prefix + value;
+            }
+
+
+            // no blocks specified, no need to do formatting
+            if (pps.blocksLength === 0) {
+                pps.result = value;
+                owner.updateValueState();
+
+                return;
+            }
+        }
+
+        // update credit card props
+        if (pps.creditCard) {
+            owner.updateCreditCardPropsByValue(value);
+        }
+
+        // strip over length characters
+        value = Util.headStr(value, pps.maxLength);
+
+        // apply blocks
+        pps.result = Util.getFormattedValue(
+            value,
+            pps.blocks, pps.blocksLength,
+            pps.delimiter, pps.delimiters, pps.delimiterLazyShow
+        );
+
+        owner.updateValueState();
+    },
+
+    updateCreditCardPropsByValue: function (value) {
+        var owner = this, pps = owner.properties,
+            Util = Cleave.Util,
+            creditCardInfo;
+
+        // At least one of the first 4 characters has changed
+        if (Util.headStr(pps.result, 4) === Util.headStr(value, 4)) {
+            return;
+        }
+
+        creditCardInfo = Cleave.CreditCardDetector.getInfo(value, pps.creditCardStrictMode);
+
+        pps.blocks = creditCardInfo.blocks;
+        pps.blocksLength = pps.blocks.length;
+        pps.maxLength = Util.getMaxLength(pps.blocks);
+
+        // credit card type changed
+        if (pps.creditCardType !== creditCardInfo.type) {
+            pps.creditCardType = creditCardInfo.type;
+
+            pps.onCreditCardTypeChanged.call(owner, pps.creditCardType);
+        }
+    },
+
+    updateValueState: function () {
+        var owner = this,
+            Util = Cleave.Util,
+            pps = owner.properties;
+
+        if (!owner.element) {
+            return;
+        }
+
+        var endPos = owner.element.selectionEnd;
+        var oldValue = owner.element.value;
+        var newValue = pps.result;
+
+        endPos = Util.getNextCursorPosition(endPos, oldValue, newValue, pps.delimiter, pps.delimiters);
+
+        // fix Android browser type="text" input field
+        // cursor not jumping issue
+        if (owner.isAndroid) {
+            window.setTimeout(function () {
+                owner.element.value = newValue;
+                Util.setSelection(owner.element, endPos, pps.document, false);
+                owner.callOnValueChanged();
+            }, 1);
+
+            return;
+        }
+
+        owner.element.value = newValue;
+        if (pps.swapHiddenInput) owner.elementSwapHidden.value = owner.getRawValue();
+
+        Util.setSelection(owner.element, endPos, pps.document, false);
+        owner.callOnValueChanged();
+    },
+
+    callOnValueChanged: function () {
+        var owner = this,
+            pps = owner.properties;
+
+        pps.onValueChanged.call(owner, {
+            target: {
+                name: owner.element.name,
+                value: pps.result,
+                rawValue: owner.getRawValue()
+            }
+        });
+    },
+
+    setPhoneRegionCode: function (phoneRegionCode) {
+        var owner = this, pps = owner.properties;
+
+        pps.phoneRegionCode = phoneRegionCode;
+        owner.initPhoneFormatter();
+        owner.onChange();
+    },
+
+    setRawValue: function (value) {
+        var owner = this, pps = owner.properties;
+
+        value = value !== undefined && value !== null ? value.toString() : '';
+
+        if (pps.numeral) {
+            value = value.replace('.', pps.numeralDecimalMark);
+        }
+
+        pps.postDelimiterBackspace = false;
+
+        owner.element.value = value;
+        owner.onInput(value);
+    },
+
+    getRawValue: function () {
+        var owner = this,
+            pps = owner.properties,
+            Util = Cleave.Util,
+            rawValue = owner.element.value;
+
+        if (pps.rawValueTrimPrefix) {
+            rawValue = Util.getPrefixStrippedValue(rawValue, pps.prefix, pps.prefixLength, pps.result, pps.delimiter, pps.delimiters, pps.noImmediatePrefix, pps.tailPrefix, pps.signBeforePrefix);
+        }
+
+        if (pps.numeral) {
+            rawValue = pps.numeralFormatter.getRawValue(rawValue);
+        } else {
+            rawValue = Util.stripDelimiters(rawValue, pps.delimiter, pps.delimiters);
+        }
+
+        return rawValue;
+    },
+
+    getISOFormatDate: function () {
+        var owner = this,
+            pps = owner.properties;
+
+        return pps.date ? pps.dateFormatter.getISOFormatDate() : '';
+    },
+
+    getISOFormatTime: function () {
+        var owner = this,
+            pps = owner.properties;
+
+        return pps.time ? pps.timeFormatter.getISOFormatTime() : '';
+    },
+
+    getFormattedValue: function () {
+        return this.element.value;
+    },
+
+    destroy: function () {
+        var owner = this;
+
+        owner.element.removeEventListener('input', owner.onChangeListener);
+        owner.element.removeEventListener('keydown', owner.onKeyDownListener);
+        owner.element.removeEventListener('focus', owner.onFocusListener);
+        owner.element.removeEventListener('cut', owner.onCutListener);
+        owner.element.removeEventListener('copy', owner.onCopyListener);
+    },
+
+    toString: function () {
+        return '[Cleave Object]';
+    }
+};
+
+Cleave.NumeralFormatter = NumeralFormatter_1;
+Cleave.DateFormatter = DateFormatter_1;
+Cleave.TimeFormatter = TimeFormatter_1;
+Cleave.PhoneFormatter = PhoneFormatter_1;
+Cleave.CreditCardDetector = CreditCardDetector_1;
+Cleave.Util = Util_1;
+Cleave.DefaultProperties = DefaultProperties_1;
+
+// for angular directive
+((typeof commonjsGlobal === 'object' && commonjsGlobal) ? commonjsGlobal : window)['Cleave'] = Cleave;
+
+// CommonJS
+var Cleave_1 = Cleave;
+
+/* eslint-disable @typescript-eslint/no-explicit-any */
+function coerceBoolean(value) {
+    return value != null && `${value}` !== 'false';
+}
+function coerceNumber(value, fallbackValue = 0) {
+    return isNumberValue(value) ? Number(value) : fallbackValue;
+}
+function isNumberValue(value) {
+    return !isNaN(parseFloat(value)) && !isNaN(Number(value));
+}
+
+const catInputCss = ".hint-wrapper{flex:0 1 auto;display:flex;gap:0.5rem}.hint-section{flex:1 1 auto;display:flex;flex-direction:column;gap:0.25rem;color:rgb(var(--cat-font-color-muted, 81, 92, 108));font-size:0.875rem;line-height:1.125rem}.hint-section .input-hint,.hint-section ::slotted([slot=hint]){margin:0 !important}.cat-bg-primary{background-color:rgb(var(--cat-primary-bg, 0, 129, 148)) !important;color:rgb(var(--cat-primary-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-primary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-primary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-primary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-primary-hover{transition:background-color 125ms, color 125ms}.cat-bg-primary-hover:hover{background-color:rgb(var(--cat-primary-bg-hover, 1, 115, 132)) !important;color:rgb(var(--cat-primary-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-primary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-primary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-primary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-primary,.cat-link-primary{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-link-primary,.cat-text-primary-hover{transition:color 125ms}.cat-link-primary:hover,.cat-text-primary-hover:hover{color:rgb(var(--cat-primary-text-hover, 1, 115, 132)) !important}.cat-link-primary:active,.cat-text-primary-hover:active{color:rgb(var(--cat-primary-text-active, 2, 99, 113)) !important}.cat-bg-primaryInverted{background-color:#93b4f2 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-bg-primaryInverted-hover{transition:background-color 125ms, color 125ms}.cat-bg-primaryInverted-hover:hover{background-color:#93b4f2 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-text-primaryInverted,.cat-link-primaryInverted{color:#93b4f2 !important}.cat-link-primaryInverted,.cat-text-primaryInverted-hover{transition:color 125ms}.cat-link-primaryInverted:hover,.cat-text-primaryInverted-hover:hover{color:#93b4f2 !important}.cat-link-primaryInverted:active,.cat-text-primaryInverted-hover:active{color:#93b4f2 !important}.cat-bg-secondary{background-color:rgb(var(--cat-secondary-bg, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-secondary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-secondary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-secondary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-secondary-hover{transition:background-color 125ms, color 125ms}.cat-bg-secondary-hover:hover{background-color:rgb(var(--cat-secondary-bg-hover, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-secondary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-secondary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-secondary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-secondary,.cat-link-secondary{color:rgb(var(--cat-secondary-text, 0, 0, 0)) !important}.cat-link-secondary,.cat-text-secondary-hover{transition:color 125ms}.cat-link-secondary:hover,.cat-text-secondary-hover:hover{color:rgb(var(--cat-secondary-text-hover, 0, 0, 0)) !important}.cat-link-secondary:active,.cat-text-secondary-hover:active{color:rgb(var(--cat-secondary-text-active, 0, 0, 0)) !important}.cat-bg-secondaryInverted{background-color:#697687 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-bg-secondaryInverted-hover{transition:background-color 125ms, color 125ms}.cat-bg-secondaryInverted-hover:hover{background-color:#697687 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-text-secondaryInverted,.cat-link-secondaryInverted{color:white !important}.cat-link-secondaryInverted,.cat-text-secondaryInverted-hover{transition:color 125ms}.cat-link-secondaryInverted:hover,.cat-text-secondaryInverted-hover:hover{color:white !important}.cat-link-secondaryInverted:active,.cat-text-secondaryInverted-hover:active{color:white !important}.cat-bg-info{background-color:rgb(var(--cat-info-bg, 0, 115, 230)) !important;color:rgb(var(--cat-info-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-info-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-info-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-info-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-info-hover{transition:background-color 125ms, color 125ms}.cat-bg-info-hover:hover{background-color:rgb(var(--cat-info-bg-hover, 0, 107, 227)) !important;color:rgb(var(--cat-info-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-info-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-info-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-info-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-info,.cat-link-info{color:rgb(var(--cat-info-text, 0, 115, 230)) !important}.cat-link-info,.cat-text-info-hover{transition:color 125ms}.cat-link-info:hover,.cat-text-info-hover:hover{color:rgb(var(--cat-info-text-hover, 0, 107, 227)) !important}.cat-link-info:active,.cat-text-info-hover:active{color:rgb(var(--cat-info-text-active, 0, 96, 223)) !important}.cat-bg-success{background-color:rgb(var(--cat-success-bg, 0, 132, 88)) !important;color:rgb(var(--cat-success-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-success-hover{transition:background-color 125ms, color 125ms}.cat-bg-success-hover:hover{background-color:rgb(var(--cat-success-bg-hover, 0, 117, 78)) !important;color:rgb(var(--cat-success-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-success,.cat-link-success{color:rgb(var(--cat-success-text, 0, 132, 88)) !important}.cat-link-success,.cat-text-success-hover{transition:color 125ms}.cat-link-success:hover,.cat-text-success-hover:hover{color:rgb(var(--cat-success-text-hover, 0, 117, 78)) !important}.cat-link-success:active,.cat-text-success-hover:active{color:rgb(var(--cat-success-text-active, 0, 105, 70)) !important}.cat-bg-warning{background-color:rgb(var(--cat-warning-bg, 255, 206, 128)) !important;color:rgb(var(--cat-warning-fill, 0, 0, 0)) !important;--cat-primary-text:var(--cat-warning-fill, 0, 0, 0);--cat-primary-text-hover:var(--cat-warning-fill-hover, 0, 0, 0);--cat-primary-text-active:var(--cat-warning-fill-active, 0, 0, 0);--cat-link-decoration:underline}.cat-bg-warning-hover{transition:background-color 125ms, color 125ms}.cat-bg-warning-hover:hover{background-color:rgb(var(--cat-warning-bg-hover, 255, 214, 148)) !important;color:rgb(var(--cat-warning-fill-hover, 0, 0, 0)) !important;--cat-primary-text:var(--cat-warning-fill, 0, 0, 0);--cat-primary-text-hover:var(--cat-warning-fill-hover, 0, 0, 0);--cat-primary-text-active:var(--cat-warning-fill-active, 0, 0, 0);--cat-link-decoration:underline}.cat-text-warning,.cat-link-warning{color:rgb(var(--cat-warning-text, 159, 97, 0)) !important}.cat-link-warning,.cat-text-warning-hover{transition:color 125ms}.cat-link-warning:hover,.cat-text-warning-hover:hover{color:rgb(var(--cat-warning-text-hover, 159, 97, 0)) !important}.cat-link-warning:active,.cat-text-warning-hover:active{color:rgb(var(--cat-warning-text-active, 159, 97, 0)) !important}.cat-bg-danger{background-color:rgb(var(--cat-danger-bg, 217, 52, 13)) !important;color:rgb(var(--cat-danger-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-danger-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-danger-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-danger-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-danger-hover{transition:background-color 125ms, color 125ms}.cat-bg-danger-hover:hover{background-color:rgb(var(--cat-danger-bg-hover, 194, 46, 11)) !important;color:rgb(var(--cat-danger-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-danger-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-danger-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-danger-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-danger,.cat-link-danger{color:rgb(var(--cat-danger-text, 217, 52, 13)) !important}.cat-link-danger,.cat-text-danger-hover{transition:color 125ms}.cat-link-danger:hover,.cat-text-danger-hover:hover{color:rgb(var(--cat-danger-text-hover, 194, 46, 11)) !important}.cat-link-danger:active,.cat-text-danger-hover:active{color:rgb(var(--cat-danger-text-active, 174, 42, 10)) !important}.cat-active{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-text-active{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-muted{color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important}.cat-text-muted{color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important}.cat-bg-muted{background-color:#f2f4f7 !important}.cat-text-reset{color:inherit !important}.cat-link-reset{color:inherit !important;text-decoration:inherit !important}.label{overflow:hidden;word-wrap:break-word;word-break:break-word}.input-field:not(.input-horizontal) .label-container.hidden,.textarea-field:not(.textarea-horizontal) .label-container.hidden,.select-field:not(.select-horizontal) .label-container.hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.label-container{flex-basis:var(--label-size, 33.33%)}.label-container .label-wrapper{display:flex;gap:0.25rem}.label-metadata{display:flex;flex-shrink:0;flex-grow:1;justify-content:space-between;gap:0.25rem;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.label-optional,.label-character-count{display:inline-flex;align-items:center;max-height:1.25rem;font-size:0.75rem;line-height:1rem}.label-character-count{margin-left:auto}.input-horizontal .label-container.hidden label,.textarea-horizontal .label-container.hidden label,.select-horizontal .label-container.hidden label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.input-horizontal .label-wrapper,.textarea-horizontal .label-wrapper,.select-horizontal .label-wrapper{flex-direction:column}.input-horizontal label,.textarea-horizontal label,.select-horizontal label{min-height:2.5rem;display:inline-flex;align-items:center}.input-horizontal .label-metadata,.textarea-horizontal .label-metadata,.select-horizontal .label-metadata{justify-content:flex-start}.input-horizontal .label-metadata .label-character-count,.textarea-horizontal .label-metadata .label-character-count,.select-horizontal .label-metadata .label-character-count{margin-left:0}:host{display:flex;font-size:0.9375rem;line-height:1.25rem}:host([hidden]){display:none}.input-field,.input-container{display:flex;flex-direction:column;gap:0.5rem;flex:1 1 auto}.input-field.input-horizontal{flex-direction:row;gap:1rem}.input-wrapper{flex:1 1 auto;display:flex;align-items:stretch;gap:0.75rem;padding:0 0.75rem;height:2.5rem;overflow:hidden;background:white;border-radius:var(--cat-border-radius-m, 0.25rem);box-shadow:inset 0 0 0 1px rgb(var(--border-color));transition:box-shadow 125ms linear;--border-color:var(--cat-border-color-dark, 215, 219, 224);}.input-wrapper.input-round{border-radius:10rem}.input-wrapper.input-readonly{pointer-events:none}.input-wrapper.input-disabled{background:#f2f4f7;cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.input-wrapper:not(.input-disabled):hover{box-shadow:inset 0 0 0 1px rgb(var(--border-color)), 0 0 0 1px rgb(var(--border-color))}.input-wrapper:focus-within{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:-1px}.input-wrapper:focus-within:has(.clearable:focus){outline:none}.input-wrapper.input-invalid{--border-color:var(--cat-danger-bg, 217, 52, 13), 0.2}.input-wrapper:has(input:-webkit-autofill),.input-wrapper:has(input:-webkit-autofill):hover,.input-wrapper:has(input:-webkit-autofill):focus{background-color:#e8f0fe}.text-prefix,.text-suffix{display:inline-flex;align-items:center;-webkit-user-select:none;-ms-user-select:none;user-select:none;}.text-prefix{border-right:1px solid rgb(var(--cat-border-color-dark, 215, 219, 224));padding-right:0.75rem}.text-suffix{border-left:1px solid rgb(var(--cat-border-color-dark, 215, 219, 224));padding-left:0.75rem}.icon-prefix,.icon-suffix{align-self:center}.input-outer-wrapper{display:flex}.input-inner-wrapper{display:flex;align-items:center;position:relative;flex:1 1 auto}input{font:inherit;margin:0;padding:0;width:100%;min-width:0;border:none;outline:none;background:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.input-disabled input{cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}input.has-clearable,input.has-toggle-password{padding-right:1.5rem}input.has-clearable.has-toggle-password{padding-right:3.5rem}input::placeholder{color:rgb(var(--cat-font-color-muted, 81, 92, 108))}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 9999px #e8f0fe inset}.clearable{position:absolute;top:calc(50% - 1rem);right:-0.5rem}.toggle-password{position:absolute;top:calc(50% - 1rem);right:-0.5rem}.has-clearable~.toggle-password{right:1.5rem}:host(.cat-date-input) .input-wrapper,:host(.cat-time-input) .input-wrapper{z-index:1;border-top-right-radius:0;border-bottom-right-radius:0}";
+const CatInputStyle0 = catInputCss;
+
+let nextUniqueId$6 = 0;
+const CatInput = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.catChange = index.createEvent(this, "catChange", 7);
+        this.catFocus = index.createEvent(this, "catFocus", 7);
+        this.catBlur = index.createEvent(this, "catBlur", 7);
+        this._id = `cat-input-${nextUniqueId$6++}`;
+        this.hasSlottedLabel = false;
+        this.hasSlottedHint = false;
+        this.isPasswordShown = false;
+        this.errorMap = undefined;
+        this.requiredMarker = 'optional';
+        this.horizontal = false;
+        this.autoComplete = undefined;
+        this.clearable = false;
         this.togglePassword = false;
         this.disabled = false;
         this.hint = undefined;
@@ -7597,7 +9606,7 @@ const CatInput = class {
         this.hasSlottedLabel = !!this.hostElement.querySelector('[slot="label"]');
         this.hasSlottedHint = !!this.hostElement.querySelector('[slot="hint"]');
         if (!this.label && !this.hasSlottedLabel) {
-            of.loglevel.warn('[A11y] Missing ARIA label on input', this);
+            of.log.warn('[A11y] Missing ARIA label on input', this);
         }
     }
     /**
@@ -7628,6 +9637,14 @@ const CatInput = class {
         this.value = '';
         this.catChange.emit(this.value);
     }
+    /**
+     * Adds a Cleave.js mask to the input.
+     *
+     * @param options The Cleave.js options.
+     */
+    async mask(options) {
+        new Cleave_1(this.input, options);
+    }
     onErrorsChanged(value) {
         if (!coerceBoolean(this.errorUpdate)) {
             this.errorMap = undefined;
@@ -7642,19 +9659,19 @@ const CatInput = class {
         }
     }
     render() {
-        return (index.h("div", { class: {
+        return (index.h("div", { key: 'aab57f9704562874b2dee392630c473fc31a33cb', class: {
                 'input-field': true,
                 'input-horizontal': this.horizontal
-            } }, index.h("div", { class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (index.h("label", { htmlFor: this.id, part: "label" }, index.h("span", { class: "label-wrapper" }, (this.hasSlottedLabel && index.h("slot", { name: "label" })) || this.label, index.h("div", { class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (index.h("span", { class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (index.h("span", { class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.required'), ")")), this.maxLength && (index.h("div", { class: "label-character-count", "aria-hidden": "true" }, this.value?.toString().length ?? 0, "/", this.maxLength))))))), index.h("div", { class: "input-container" }, index.h("div", { class: {
+            } }, index.h("div", { key: 'f599b443389362d9eb3ee72d496d225ca2a8bf8d', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (index.h("label", { htmlFor: this.id, part: "label" }, index.h("span", { class: "label-wrapper" }, (this.hasSlottedLabel && index.h("slot", { name: "label" })) || this.label, index.h("div", { class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (index.h("span", { class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (index.h("span", { class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.required'), ")")), this.maxLength && (index.h("div", { class: "label-character-count", "aria-hidden": "true" }, this.value?.toString().length ?? 0, "/", this.maxLength))))))), index.h("div", { key: 'ddce0aaa854e32ae4b8a8686a3886089beac6300', class: "input-container" }, index.h("div", { key: '25eb9aa776ba2cee97fb2bf79bc52d5c44c54b55', class: "input-outer-wrapper" }, index.h("div", { key: '7cd420c3525b8e15a7c0f2d8405cdd70f2e5291c', class: {
                 'input-wrapper': true,
                 'input-round': this.round,
                 'input-readonly': this.readonly,
                 'input-disabled': this.disabled,
                 'input-invalid': this.invalid
-            }, onClick: () => this.input.focus() }, this.textPrefix && (index.h("span", { class: "text-prefix", part: "prefix" }, this.textPrefix)), this.icon && !this.iconRight && (index.h("cat-icon", { icon: this.icon, class: "icon-prefix", size: "l", onClick: () => this.doFocus() })), index.h("div", { class: "input-inner-wrapper" }, index.h("input", { ...this.nativeAttributes, part: "input", ref: el => (this.input = el), id: this.id, class: {
+            }, onClick: () => this.input.focus() }, this.textPrefix && (index.h("span", { class: "text-prefix", part: "prefix" }, this.textPrefix)), this.icon && !this.iconRight && (index.h("cat-icon", { icon: this.icon, class: "icon-prefix", size: "l", onClick: () => this.doFocus() })), index.h("div", { key: '7f0c24c572ddfb4a1f76457955b28c111c1b444a', class: "input-inner-wrapper" }, index.h("input", { key: 'fcef418a1eb7c5d54f47e239f8db0cf52f23d3f7', ...this.nativeAttributes, part: "input", ref: el => (this.input = el), id: this.id, class: {
                 'has-clearable': this.clearable && !this.disabled && !this.readonly && !!this.value,
                 'has-toggle-password': this.togglePassword && !this.disabled && !this.readonly && !!this.value
-            }, autocomplete: this.autoComplete, disabled: this.disabled, max: this.max, maxlength: this.maxLength, min: this.min, minlength: this.minLength, name: this.name, placeholder: this.placeholder, readonly: this.readonly, required: this.required, type: this.isPasswordShown ? 'text' : this.type, 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.clearable && !this.disabled && !this.readonly && this.value && (index.h("cat-button", { class: "clearable", icon: "$cat:input-close", "icon-only": "true", size: "s", variant: "text", "a11y-label": of.catI18nRegistry.t('input.clear'), onClick: this.clear.bind(this), "data-dropdown-no-close": true })), this.togglePassword && !this.disabled && !this.readonly && this.value && (index.h("cat-button", { class: "toggle-password", icon: this.isPasswordShown ? '$cat:input-password-hide' : '$cat:input-password-show', "icon-only": "true", size: "s", variant: "text", "a11y-label": of.catI18nRegistry.t(this.isPasswordShown ? 'input.hidePassword' : 'input.showPassword'), onClick: this.doTogglePassword.bind(this) }))), !this.invalid && this.icon && this.iconRight && (index.h("cat-icon", { icon: this.icon, class: "icon-suffix", size: "l", onClick: () => this.doFocus() })), this.invalid && index.h("cat-icon", { icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l" }), this.textSuffix && (index.h("span", { class: "text-suffix", part: "suffix" }, this.textSuffix))), this.hasHint && (index.h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }), errorMap: this.errorMap })))));
+            }, autocomplete: this.autoComplete, disabled: this.disabled, max: this.max, maxlength: this.maxLength, min: this.min, minlength: this.minLength, name: this.name, placeholder: this.placeholder, readonly: this.readonly, required: this.required, type: this.isPasswordShown ? 'text' : this.type, 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.clearable && !this.disabled && !this.readonly && this.value && (index.h("cat-button", { class: "clearable", icon: "$cat:input-close", "icon-only": "true", size: "s", variant: "text", "a11y-label": of.catI18nRegistry.t('input.clear'), onClick: this.clear.bind(this), "data-dropdown-no-close": true })), this.togglePassword && !this.disabled && !this.readonly && this.value && (index.h("cat-button", { class: "toggle-password", icon: this.isPasswordShown ? '$cat:input-password-hide' : '$cat:input-password-show', "icon-only": "true", size: "s", variant: "text", "a11y-label": of.catI18nRegistry.t(this.isPasswordShown ? 'input.hidePassword' : 'input.showPassword'), onClick: this.doTogglePassword.bind(this) }))), !this.invalid && this.icon && this.iconRight && (index.h("cat-icon", { icon: this.icon, class: "icon-suffix", size: "l", onClick: () => this.doFocus() })), this.invalid && (index.h("cat-icon", { icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l" })), this.textSuffix && (index.h("span", { class: "text-suffix", part: "suffix" }, this.textSuffix))), index.h("slot", { key: '3c3ff6368c631ae0634a7d0b875cb0d6a69edcba', name: "addon" })), this.hasHint && (index.h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }), errorMap: this.errorMap })))));
     }
     get hasHint() {
         return !!this.hint || !!this.hasSlottedHint || this.invalid;
@@ -7711,9 +9728,10 @@ const CatInput = class {
         "errors": ["onErrorsChanged"]
     }; }
 };
-CatInput.style = catInputCss;
+CatInput.style = CatInputStyle0;
 
 const catPaginationCss = ":host{display:inline-block}:host([hidden]){display:none}ol{display:flex;flex-wrap:wrap;list-style:none;margin:0;padding:0}li{display:inline-flex;justify-content:center}li.dots{-webkit-user-select:none;-ms-user-select:none;user-select:none;}:host([variant=outlined]) ol{gap:0.75rem}.cat-pagination-xs li.dots,.cat-pagination-xs li.text{height:1.5rem;line-height:1.5rem;font-size:0.875rem}.cat-pagination-xs li.dots{width:1.5rem}:host([variant=outlined]) .cat-pagination-xs{gap:0.375rem}.cat-pagination-s li.dots,.cat-pagination-s li.text{height:2rem;line-height:2rem;font-size:0.9375rem}.cat-pagination-s li.dots{width:2rem}:host([variant=outlined]) .cat-pagination-s{gap:0.5rem}.cat-pagination-m li.dots,.cat-pagination-m li.text{height:2.5rem;line-height:2.5rem;font-size:0.9375rem}.cat-pagination-m li.dots{width:2.5rem}:host([variant=outlined]) .cat-pagination-m{gap:0.625rem}.cat-pagination-l li.dots,.cat-pagination-l li.text{height:3rem;line-height:3rem;font-size:0.9375rem}.cat-pagination-l li.dots{width:3rem}:host([variant=outlined]) .cat-pagination-l{gap:0.75rem}.cat-pagination-xl li.dots,.cat-pagination-xl li.text{height:3.5rem;line-height:3.5rem;font-size:1.125rem}.cat-pagination-xl li.dots{width:3.5rem}:host([variant=outlined]) .cat-pagination-xl{gap:0.875rem}";
+const CatPaginationStyle0 = catPaginationCss;
 
 const CatPagination = class {
     constructor(hostRef) {
@@ -7731,9 +9749,9 @@ const CatPagination = class {
         this.iconNext = '$cat:pagination-right';
     }
     render() {
-        return (index.h("nav", { role: "navigation" }, index.h("ol", { class: {
+        return (index.h("nav", { key: '113d4e757e003c8351efe53f8baeaffe28428c8f', role: "navigation" }, index.h("ol", { key: '15d86b0fd427abdd7f1af9ababb324806a746d05', class: {
                 [`cat-pagination-${this.size}`]: Boolean(this.size)
-            } }, index.h("li", null, index.h("cat-button", { variant: this.variant, size: this.size, round: this.round, disabled: this.isFirst, a11yLabel: of.catI18nRegistry.t('pagination.prev'), icon: this.iconPrev, iconOnly: true, onClick: () => this.setPage(this.page - 1) })), this.content, index.h("li", null, index.h("cat-button", { variant: this.variant, size: this.size, round: this.round, disabled: this.isLast, a11yLabel: of.catI18nRegistry.t('pagination.next'), icon: this.iconNext, iconOnly: true, onClick: () => this.setPage(this.page + 1) })))));
+            } }, index.h("li", { key: 'b6e6dad6d903b65850cd33c15327386a61fde3d4' }, index.h("cat-button", { key: 'd32aa4a3af4aaae84b5d2de695deadf0852f4ae0', variant: this.variant, size: this.size, round: this.round, disabled: this.isFirst, a11yLabel: of.catI18nRegistry.t('pagination.prev'), icon: this.iconPrev, iconOnly: true, onClick: () => this.setPage(this.page - 1) })), this.content, index.h("li", { key: '19567f748e4f3976576ea1c894c2524865d6201a' }, index.h("cat-button", { key: '6170034891849aef2e248a1f531d86806aa4f4c1', variant: this.variant, size: this.size, round: this.round, disabled: this.isLast, a11yLabel: of.catI18nRegistry.t('pagination.next'), icon: this.iconNext, iconOnly: true, onClick: () => this.setPage(this.page + 1) })))));
     }
     get isFirst() {
         return this.page === 0;
@@ -7783,9 +9801,10 @@ const CatPagination = class {
         ]);
     }
 };
-CatPagination.style = catPaginationCss;
+CatPagination.style = CatPaginationStyle0;
 
 const catRadioCss = ".hint-wrapper{flex:0 1 auto;display:flex;gap:0.5rem}.hint-section{flex:1 1 auto;display:flex;flex-direction:column;gap:0.25rem;color:rgb(var(--cat-font-color-muted, 81, 92, 108));font-size:0.875rem;line-height:1.125rem}.hint-section .input-hint,.hint-section ::slotted([slot=hint]){margin:0 !important}:host{display:flex;flex-direction:column;gap:0.5rem}:host([hidden]){display:none}label{display:flex;gap:0.5rem;font-size:0.9375rem;line-height:1.25rem;font-weight:var(--cat-font-weight-body, 400);cursor:pointer}.label-left{flex-direction:row-reverse}.radio{display:flex;position:relative;align-self:flex-start}.circle-placeholder{width:calc(1.25rem + 1px);flex-shrink:0}.circle{position:absolute;width:0.75rem;height:0.75rem;background-color:rgb(var(--cat-primary-bg, 0, 129, 148));border-radius:10rem;top:calc(50% - 0.375rem);left:calc(50% - 0.375rem);visibility:hidden;pointer-events:none}input{margin:0;width:1.25rem;height:1.25rem;appearance:none;background-color:white;border:1px solid rgb(var(--cat-border-color-dark, 215, 219, 224));border-radius:10rem;cursor:inherit}input:checked{border-color:rgb(var(--cat-primary-bg, 0, 129, 148))}input:checked+.circle{visibility:visible}input:focus-visible{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:1px}:host(.cat-error) input{border-color:rgb(var(--cat-danger-bg, 217, 52, 13))}:host(.cat-error) .circle{background-color:rgb(var(--cat-danger-bg, 217, 52, 13))}.label{flex:1 1 auto}.is-hidden .label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.is-disabled{cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.is-disabled input{background-color:#f2f4f7}.is-disabled input:checked{border-color:rgb(var(--cat-border-color-dark, 215, 219, 224))}.is-disabled .circle{background-color:rgb(var(--cat-border-color-dark, 215, 219, 224))}";
+const CatRadioStyle0 = catRadioCss;
 
 let nextUniqueId$5 = 0;
 const CatRadio = class {
@@ -7816,7 +9835,7 @@ const CatRadio = class {
         this.hasSlottedLabel = !!this.hostElement.querySelector('[slot="label"]');
         this.hasSlottedHint = !!this.hostElement.querySelector('[slot="hint"]');
         if (!this.label && !this.hasSlottedLabel) {
-            of.loglevel.warn('[A11y] Missing ARIA label on radio', this);
+            of.log.warn('[A11y] Missing ARIA label on radio', this);
         }
     }
     /**
@@ -7837,7 +9856,7 @@ const CatRadio = class {
         this.input.blur();
     }
     render() {
-        return (index.h(index.Host, null, index.h("label", { htmlFor: this.id, class: { 'is-hidden': this.labelHidden, 'is-disabled': this.disabled, 'label-left': this.labelLeft }, role: "radio", "aria-checked": this.checked ? 'true' : 'false' }, index.h("span", { class: "radio" }, index.h("input", { ...this.nativeAttributes, part: "input", ref: el => (this.input = el), id: this.identifier || this.id, type: "radio", name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), index.h("span", { class: "circle" })), index.h("span", { class: "label", part: "label" }, (this.hasSlottedLabel && index.h("slot", { name: "label" })) || this.label)), this.hasHint && (index.h("div", { class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, index.h("div", { class: "circle-placeholder" }), index.h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }) })))));
+        return (index.h(index.Host, { key: '9e3d983eeda3b42a67db73775cafcb9a5d98953a' }, index.h("label", { key: 'e2c5919edf0540000622a239b4acaa7704b2b3a8', htmlFor: this.id, class: { 'is-hidden': this.labelHidden, 'is-disabled': this.disabled, 'label-left': this.labelLeft }, role: "radio", "aria-checked": this.checked ? 'true' : 'false' }, index.h("span", { key: '1f8d95c1728e910305c6ef827b6779b4642102d8', class: "radio" }, index.h("input", { key: 'd0217cd454023eb440ef4c2481899f30c15c340f', ...this.nativeAttributes, part: "input", ref: el => (this.input = el), id: this.identifier || this.id, type: "radio", name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), index.h("span", { key: '83a85842c187adf508cba7497d9e2a545163967b', class: "circle" })), index.h("span", { key: 'de6ed4d4a62b894406ec53380ac4949a265fe74b', class: "label", part: "label" }, (this.hasSlottedLabel && index.h("slot", { name: "label" })) || this.label)), this.hasHint && (index.h("div", { class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, index.h("div", { class: "circle-placeholder" }), index.h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }) })))));
     }
     get hasHint() {
         return !!this.hint || !!this.hasSlottedHint;
@@ -7854,9 +9873,10 @@ const CatRadio = class {
     }
     get hostElement() { return index.getElement(this); }
 };
-CatRadio.style = catRadioCss;
+CatRadio.style = CatRadioStyle0;
 
 const catRadioGroupCss = ":host{display:block}:host([hidden]){display:none}";
+const CatRadioGroupStyle0 = catRadioGroupCss;
 
 const CatRadioGroup = class {
     constructor(hostRef) {
@@ -7927,7 +9947,7 @@ const CatRadioGroup = class {
         }
     }
     render() {
-        return (index.h("div", { role: "radiogroup", "aria-label": this.a11yLabel }, index.h("slot", null)));
+        return (index.h("div", { key: '05f0e3dddf696ecc2de0ea7491011e9ce6cf7ce4', role: "radiogroup", "aria-label": this.a11yLabel }, index.h("slot", { key: 'f67dc6e9f7e8410104626a1c5e54587d4cae51b0' })));
     }
     init() {
         this.catRadioGroup = Array.from(this.hostElement.querySelectorAll(`cat-radio`));
@@ -7953,9 +9973,10 @@ const CatRadioGroup = class {
         "labelLeft": ["onLabelLeftChanged"]
     }; }
 };
-CatRadioGroup.style = catRadioGroupCss;
+CatRadioGroup.style = CatRadioGroupStyle0;
 
 const catScrollableCss = ":host{overflow:hidden;position:relative;display:flex}:host([hidden]){display:none}.shadow-bottom,.shadow-right,.shadow-left,.shadow-top{position:absolute;transition:box-shadow 0.3s cubic-bezier(0.25, 0.8, 0.25, 1)}.shadow-top{z-index:2;width:100%;top:0}.shadow-left{z-index:4;height:100%;left:0}.shadow-right{z-index:4;height:100%;right:0}.shadow-bottom{z-index:2;width:100%;bottom:0}.scrollable-wrapper{position:absolute;inset:0;pointer-events:none}.scrollable-wrapper.cat-scrollable-top .shadow-top,.scrollable-wrapper.cat-scrollable-bottom .shadow-bottom,.scrollable-wrapper.cat-scrollable-left .shadow-left,.scrollable-wrapper.cat-scrollable-right .shadow-right{box-shadow:0 0 4px 1px rgba(16, 29, 48, 0.2)}.scrollable-content{width:100%;overflow:hidden}.scrollable-content.scroll-x{overflow-x:auto}.scrollable-content.scroll-y{overflow-y:auto}.scrollable-content.no-overscroll{overscroll-behavior:contain}";
+const CatScrollableStyle0 = catScrollableCss;
 
 const CatScrollable = class {
     constructor(hostRef) {
@@ -8015,13 +10036,13 @@ const CatScrollable = class {
     }
     render() {
         return [
-            index.h("div", { class: "scrollable-wrapper", ref: el => (this.scrollWrapperElement = el) }, !this.noShadowY && index.h("div", { class: "shadow-top" }), !this.noShadowX && index.h("div", { class: "shadow-left" }), !this.noShadowX && index.h("div", { class: "shadow-right" }), !this.noShadowY && index.h("div", { class: "shadow-bottom" })),
-            index.h("div", { ref: el => (this.scrollElement = el), class: {
+            index.h("div", { key: 'a665d0c5a252ffb60c451b47b19e58d720aa7cc5', class: "scrollable-wrapper", ref: el => (this.scrollWrapperElement = el) }, !this.noShadowY && index.h("div", { class: "shadow-top" }), !this.noShadowX && index.h("div", { class: "shadow-left" }), !this.noShadowX && index.h("div", { class: "shadow-right" }), !this.noShadowY && index.h("div", { class: "shadow-bottom" })),
+            index.h("div", { key: 'b5148d1b4d36da8f58dfd1a9f5ee4f8281e7bf48', ref: el => (this.scrollElement = el), class: {
                     'scrollable-content': true,
                     'scroll-x': !this.noOverflowX,
                     'scroll-y': !this.noOverflowY,
                     'no-overscroll': this.noOverscroll
-                } }, index.h("slot", null))
+                } }, index.h("slot", { key: '58770dc6389091b4fcd010b0ef867098bbdbd324' }))
         ];
     }
     attachEmitter(from, emitter) {
@@ -8056,7 +10077,7 @@ const CatScrollable = class {
     }
 };
 CatScrollable.THROTTLE = 50;
-CatScrollable.style = catScrollableCss;
+CatScrollable.style = CatScrollableStyle0;
 
 var GHOST_ELEMENT_ID = '__autosizeInputGhost';
 
@@ -8143,7 +10164,8 @@ var autosizeInput = function (element, options) {
   }
 };
 
-const catSelectCss = ".hint-wrapper{flex:0 1 auto;display:flex;gap:0.5rem}.hint-section{flex:1 1 auto;display:flex;flex-direction:column;gap:0.25rem;color:rgb(var(--cat-font-color-muted, 81, 92, 108));font-size:0.875rem;line-height:1.125rem}.hint-section .input-hint,.hint-section ::slotted([slot=hint]){margin:0 !important}.cat-bg-primary{background-color:rgb(var(--cat-primary-bg, 0, 129, 148)) !important;color:rgb(var(--cat-primary-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-primary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-primary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-primary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-primary-hover{transition:background-color 125ms, color 125ms}.cat-bg-primary-hover:hover{background-color:rgb(var(--cat-primary-bg-hover, 1, 115, 132)) !important;color:rgb(var(--cat-primary-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-primary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-primary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-primary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-primary,.cat-link-primary{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-link-primary,.cat-text-primary-hover{transition:color 125ms}.cat-link-primary:hover,.cat-text-primary-hover:hover{color:rgb(var(--cat-primary-text-hover, 1, 115, 132)) !important}.cat-link-primary:active,.cat-text-primary-hover:active{color:rgb(var(--cat-primary-text-active, 2, 99, 113)) !important}.cat-bg-primaryInverted{background-color:#93b4f2 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-bg-primaryInverted-hover{transition:background-color 125ms, color 125ms}.cat-bg-primaryInverted-hover:hover{background-color:#93b4f2 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-text-primaryInverted,.cat-link-primaryInverted{color:#93b4f2 !important}.cat-link-primaryInverted,.cat-text-primaryInverted-hover{transition:color 125ms}.cat-link-primaryInverted:hover,.cat-text-primaryInverted-hover:hover{color:#93b4f2 !important}.cat-link-primaryInverted:active,.cat-text-primaryInverted-hover:active{color:#93b4f2 !important}.cat-bg-secondary{background-color:rgb(var(--cat-secondary-bg, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-secondary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-secondary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-secondary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-secondary-hover{transition:background-color 125ms, color 125ms}.cat-bg-secondary-hover:hover{background-color:rgb(var(--cat-secondary-bg-hover, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-secondary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-secondary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-secondary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-secondary,.cat-link-secondary{color:rgb(var(--cat-secondary-text, 0, 0, 0)) !important}.cat-link-secondary,.cat-text-secondary-hover{transition:color 125ms}.cat-link-secondary:hover,.cat-text-secondary-hover:hover{color:rgb(var(--cat-secondary-text-hover, 0, 0, 0)) !important}.cat-link-secondary:active,.cat-text-secondary-hover:active{color:rgb(var(--cat-secondary-text-active, 0, 0, 0)) !important}.cat-bg-secondaryInverted{background-color:#697687 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-bg-secondaryInverted-hover{transition:background-color 125ms, color 125ms}.cat-bg-secondaryInverted-hover:hover{background-color:#697687 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-text-secondaryInverted,.cat-link-secondaryInverted{color:white !important}.cat-link-secondaryInverted,.cat-text-secondaryInverted-hover{transition:color 125ms}.cat-link-secondaryInverted:hover,.cat-text-secondaryInverted-hover:hover{color:white !important}.cat-link-secondaryInverted:active,.cat-text-secondaryInverted-hover:active{color:white !important}.cat-bg-info{background-color:rgb(var(--cat-success-bg, 0, 115, 230)) !important;color:rgb(var(--cat-success-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-info-hover{transition:background-color 125ms, color 125ms}.cat-bg-info-hover:hover{background-color:rgb(var(--cat-success-bg-hover, 0, 107, 227)) !important;color:rgb(var(--cat-success-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-info,.cat-link-info{color:rgb(var(--cat-success-text, 0, 115, 230)) !important}.cat-link-info,.cat-text-info-hover{transition:color 125ms}.cat-link-info:hover,.cat-text-info-hover:hover{color:rgb(var(--cat-success-text-hover, 0, 107, 227)) !important}.cat-link-info:active,.cat-text-info-hover:active{color:rgb(var(--cat-success-text-active, 0, 96, 223)) !important}.cat-bg-success{background-color:rgb(var(--cat-success-bg, 0, 132, 88)) !important;color:rgb(var(--cat-success-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-success-hover{transition:background-color 125ms, color 125ms}.cat-bg-success-hover:hover{background-color:rgb(var(--cat-success-bg-hover, 0, 117, 78)) !important;color:rgb(var(--cat-success-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-success,.cat-link-success{color:rgb(var(--cat-success-text, 0, 132, 88)) !important}.cat-link-success,.cat-text-success-hover{transition:color 125ms}.cat-link-success:hover,.cat-text-success-hover:hover{color:rgb(var(--cat-success-text-hover, 0, 117, 78)) !important}.cat-link-success:active,.cat-text-success-hover:active{color:rgb(var(--cat-success-text-active, 0, 105, 70)) !important}.cat-bg-warning{background-color:rgb(var(--cat-warning-bg, 255, 206, 128)) !important;color:rgb(var(--cat-warning-fill, 0, 0, 0)) !important;--cat-primary-text:var(--cat-warning-fill, 0, 0, 0);--cat-primary-text-hover:var(--cat-warning-fill-hover, 0, 0, 0);--cat-primary-text-active:var(--cat-warning-fill-active, 0, 0, 0);--cat-link-decoration:underline}.cat-bg-warning-hover{transition:background-color 125ms, color 125ms}.cat-bg-warning-hover:hover{background-color:rgb(var(--cat-warning-bg-hover, 255, 214, 148)) !important;color:rgb(var(--cat-warning-fill-hover, 0, 0, 0)) !important;--cat-primary-text:var(--cat-warning-fill, 0, 0, 0);--cat-primary-text-hover:var(--cat-warning-fill-hover, 0, 0, 0);--cat-primary-text-active:var(--cat-warning-fill-active, 0, 0, 0);--cat-link-decoration:underline}.cat-text-warning,.cat-link-warning{color:rgb(var(--cat-warning-text, 159, 97, 0)) !important}.cat-link-warning,.cat-text-warning-hover{transition:color 125ms}.cat-link-warning:hover,.cat-text-warning-hover:hover{color:rgb(var(--cat-warning-text-hover, 159, 97, 0)) !important}.cat-link-warning:active,.cat-text-warning-hover:active{color:rgb(var(--cat-warning-text-active, 159, 97, 0)) !important}.cat-bg-danger{background-color:rgb(var(--cat-danger-bg, 217, 52, 13)) !important;color:rgb(var(--cat-danger-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-danger-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-danger-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-danger-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-danger-hover{transition:background-color 125ms, color 125ms}.cat-bg-danger-hover:hover{background-color:rgb(var(--cat-danger-bg-hover, 194, 46, 11)) !important;color:rgb(var(--cat-danger-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-danger-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-danger-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-danger-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-danger,.cat-link-danger{color:rgb(var(--cat-danger-text, 217, 52, 13)) !important}.cat-link-danger,.cat-text-danger-hover{transition:color 125ms}.cat-link-danger:hover,.cat-text-danger-hover:hover{color:rgb(var(--cat-danger-text-hover, 194, 46, 11)) !important}.cat-link-danger:active,.cat-text-danger-hover:active{color:rgb(var(--cat-danger-text-active, 174, 42, 10)) !important}.cat-active{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-text-active{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-muted{color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important}.cat-text-muted{color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important}.cat-bg-muted{background-color:#f2f4f7 !important}.cat-text-reset{color:inherit !important}.cat-link-reset{color:inherit !important;text-decoration:inherit !important}.label{overflow:hidden;word-wrap:break-word;word-break:break-word}.input-field:not(.input-horizontal) .label-container.hidden,.textarea-field:not(.textarea-horizontal) .label-container.hidden,.select-field:not(.select-horizontal) .label-container.hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.label-container{flex-basis:var(--label-size, 33.33%)}.label-container .label-wrapper{display:flex;gap:0.25rem}.label-metadata{display:flex;flex-shrink:0;flex-grow:1;justify-content:space-between;gap:0.25rem;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.label-optional,.label-character-count{display:inline-flex;align-items:center;max-height:1.25rem;font-size:0.75rem;line-height:1rem}.label-character-count{margin-left:auto}.input-horizontal .label-container.hidden label,.textarea-horizontal .label-container.hidden label,.select-horizontal .label-container.hidden label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.input-horizontal .label-wrapper,.textarea-horizontal .label-wrapper,.select-horizontal .label-wrapper{flex-direction:column}.input-horizontal label,.textarea-horizontal label,.select-horizontal label{min-height:2.5rem;display:inline-flex;align-items:center}.input-horizontal .label-metadata,.textarea-horizontal .label-metadata,.select-horizontal .label-metadata{justify-content:flex-start}.input-horizontal .label-metadata .label-character-count,.textarea-horizontal .label-metadata .label-character-count,.select-horizontal .label-metadata .label-character-count{margin-left:0}:host{display:flex;flex-direction:column;gap:0.5rem;line-height:1.25rem;position:relative}:host([hidden]){display:none}label{align-self:flex-start}label.hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.select-field,.select-container{display:flex;flex-direction:column;gap:0.5rem;flex:1 1 auto}.select-field.select-horizontal{flex-direction:row;gap:1rem}.select-wrapper{display:flex;align-items:flex-start;background:white;border-radius:var(--cat-border-radius-m, 0.25rem);box-shadow:inset 0 0 0 1px rgb(var(--border-color));transition:box-shadow 125ms linear;padding:0.25rem;--border-color:var(--cat-border-color-dark, 215, 219, 224);}.select-wrapper:not(.select-disabled):hover{box-shadow:inset 0 0 0 1px rgb(var(--border-color)), 0 0 0 1px rgb(var(--border-color))}.select-wrapper:focus-within{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:-1px}.select-wrapper.select-invalid{--border-color:var(--cat-danger-bg, 217, 52, 13), 0.2}.select-wrapper:has(input:-webkit-autofill),.select-wrapper:has(input:-webkit-autofill):hover,.select-wrapper:has(input:-webkit-autofill):focus{background-color:#e8f0fe}:host(.cat-error) .select-wrapper{box-shadow:0 0 0 1px rgb(var(--cat-danger-bg, 217, 52, 13))}:host(.cat-error) .select-wrapper:not(.input-disabled):hover{box-shadow:0 0 0 2px rgb(var(--cat-danger-bg, 217, 52, 13))}.select-disabled{background:#f2f4f7;cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108));pointer-events:none}.select-wrapper-inner{display:flex;flex:1 1 auto;align-items:center;gap:0.25rem;min-width:0}.select-wrapper-inner>cat-avatar{display:inline-block;padding-left:0.5rem}.select-wrapper-inner>cat-avatar+.select-input{padding-left:0.25rem}.select-wrapper-inner cat-avatar{--cat-avatar-size:1.25rem;--cat-avatar-font-size:0.5rem}.select-multiple .select-wrapper-inner{flex-wrap:wrap}.select-input{font:inherit;background:none;border:none;outline:none;padding:0.375rem 0.5rem;flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.select-input::placeholder{color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.select-disabled .select-input{cursor:inherit}.select-pills{display:contents}.pill{display:inline-flex;align-items:center;gap:0.5rem;padding:0.25rem 0.5rem;background:#f2f4f7;border-radius:var(--cat-border-radius-s, 0.125rem);white-space:nowrap;min-width:0}.pill>span{overflow:hidden;text-overflow:ellipsis;flex:1 1 0%}.pill>cat-button{margin-right:-0.25rem;margin-left:-0.25rem}.select-btn{transition:transform 125ms linear}.select-btn::part(button){outline:none}cat-spinner{padding:0.375rem}.icon-suffix{padding:0.25rem}.select-btn-open{transform:rotate(180deg)}.select-dropdown{position:fixed;right:0;background:white;display:none;overflow:auto;box-shadow:0 4px 6px -2px rgba(27, 31, 38, 0.03), 0 12px 16px -4px rgba(27, 31, 38, 0.08);border-radius:var(--cat-border-radius-m, 0.25rem);border:1px solid rgb(var(--cat-border-color, 235, 236, 240));z-index:calc(var(--cat-z-index, 1000) + 100);width:max-content;top:0;left:0}.select-options-wrapper{max-height:16rem;width:100%}.select-empty{margin:1rem 0;padding:0 1.25rem}.select-options{list-style-type:none;margin:0;padding:0.5rem 0}.select-options cat-checkbox,.select-options .select-option-single{margin:0;padding:0.5rem 1rem}.select-option-inner{display:flex;gap:0.5rem}.select-option-inner cat-avatar{--cat-avatar-size:1.25rem;--cat-avatar-font-size:0.5rem}.select-option-text{flex:1 1 0%;min-width:0}.select-option-single{cursor:pointer}.select-input-transparent-caret{caret-color:transparent}.select-option-empty,.select-option-loading{padding:0.5rem 1rem}.select-option:hover{background-color:rgba(var(--cat-secondary-bg, 105, 118, 135), 0.05)}.select-option-active{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:-2px}.select-option-label{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-wrap:break-word;word-break:break-word}.select-option-description{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}";
+const catSelectCss = ".hint-wrapper{flex:0 1 auto;display:flex;gap:0.5rem}.hint-section{flex:1 1 auto;display:flex;flex-direction:column;gap:0.25rem;color:rgb(var(--cat-font-color-muted, 81, 92, 108));font-size:0.875rem;line-height:1.125rem}.hint-section .input-hint,.hint-section ::slotted([slot=hint]){margin:0 !important}.cat-bg-primary{background-color:rgb(var(--cat-primary-bg, 0, 129, 148)) !important;color:rgb(var(--cat-primary-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-primary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-primary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-primary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-primary-hover{transition:background-color 125ms, color 125ms}.cat-bg-primary-hover:hover{background-color:rgb(var(--cat-primary-bg-hover, 1, 115, 132)) !important;color:rgb(var(--cat-primary-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-primary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-primary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-primary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-primary,.cat-link-primary{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-link-primary,.cat-text-primary-hover{transition:color 125ms}.cat-link-primary:hover,.cat-text-primary-hover:hover{color:rgb(var(--cat-primary-text-hover, 1, 115, 132)) !important}.cat-link-primary:active,.cat-text-primary-hover:active{color:rgb(var(--cat-primary-text-active, 2, 99, 113)) !important}.cat-bg-primaryInverted{background-color:#93b4f2 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-bg-primaryInverted-hover{transition:background-color 125ms, color 125ms}.cat-bg-primaryInverted-hover:hover{background-color:#93b4f2 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-text-primaryInverted,.cat-link-primaryInverted{color:#93b4f2 !important}.cat-link-primaryInverted,.cat-text-primaryInverted-hover{transition:color 125ms}.cat-link-primaryInverted:hover,.cat-text-primaryInverted-hover:hover{color:#93b4f2 !important}.cat-link-primaryInverted:active,.cat-text-primaryInverted-hover:active{color:#93b4f2 !important}.cat-bg-secondary{background-color:rgb(var(--cat-secondary-bg, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-secondary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-secondary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-secondary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-secondary-hover{transition:background-color 125ms, color 125ms}.cat-bg-secondary-hover:hover{background-color:rgb(var(--cat-secondary-bg-hover, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-secondary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-secondary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-secondary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-secondary,.cat-link-secondary{color:rgb(var(--cat-secondary-text, 0, 0, 0)) !important}.cat-link-secondary,.cat-text-secondary-hover{transition:color 125ms}.cat-link-secondary:hover,.cat-text-secondary-hover:hover{color:rgb(var(--cat-secondary-text-hover, 0, 0, 0)) !important}.cat-link-secondary:active,.cat-text-secondary-hover:active{color:rgb(var(--cat-secondary-text-active, 0, 0, 0)) !important}.cat-bg-secondaryInverted{background-color:#697687 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-bg-secondaryInverted-hover{transition:background-color 125ms, color 125ms}.cat-bg-secondaryInverted-hover:hover{background-color:#697687 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-text-secondaryInverted,.cat-link-secondaryInverted{color:white !important}.cat-link-secondaryInverted,.cat-text-secondaryInverted-hover{transition:color 125ms}.cat-link-secondaryInverted:hover,.cat-text-secondaryInverted-hover:hover{color:white !important}.cat-link-secondaryInverted:active,.cat-text-secondaryInverted-hover:active{color:white !important}.cat-bg-info{background-color:rgb(var(--cat-info-bg, 0, 115, 230)) !important;color:rgb(var(--cat-info-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-info-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-info-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-info-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-info-hover{transition:background-color 125ms, color 125ms}.cat-bg-info-hover:hover{background-color:rgb(var(--cat-info-bg-hover, 0, 107, 227)) !important;color:rgb(var(--cat-info-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-info-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-info-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-info-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-info,.cat-link-info{color:rgb(var(--cat-info-text, 0, 115, 230)) !important}.cat-link-info,.cat-text-info-hover{transition:color 125ms}.cat-link-info:hover,.cat-text-info-hover:hover{color:rgb(var(--cat-info-text-hover, 0, 107, 227)) !important}.cat-link-info:active,.cat-text-info-hover:active{color:rgb(var(--cat-info-text-active, 0, 96, 223)) !important}.cat-bg-success{background-color:rgb(var(--cat-success-bg, 0, 132, 88)) !important;color:rgb(var(--cat-success-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-success-hover{transition:background-color 125ms, color 125ms}.cat-bg-success-hover:hover{background-color:rgb(var(--cat-success-bg-hover, 0, 117, 78)) !important;color:rgb(var(--cat-success-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-success,.cat-link-success{color:rgb(var(--cat-success-text, 0, 132, 88)) !important}.cat-link-success,.cat-text-success-hover{transition:color 125ms}.cat-link-success:hover,.cat-text-success-hover:hover{color:rgb(var(--cat-success-text-hover, 0, 117, 78)) !important}.cat-link-success:active,.cat-text-success-hover:active{color:rgb(var(--cat-success-text-active, 0, 105, 70)) !important}.cat-bg-warning{background-color:rgb(var(--cat-warning-bg, 255, 206, 128)) !important;color:rgb(var(--cat-warning-fill, 0, 0, 0)) !important;--cat-primary-text:var(--cat-warning-fill, 0, 0, 0);--cat-primary-text-hover:var(--cat-warning-fill-hover, 0, 0, 0);--cat-primary-text-active:var(--cat-warning-fill-active, 0, 0, 0);--cat-link-decoration:underline}.cat-bg-warning-hover{transition:background-color 125ms, color 125ms}.cat-bg-warning-hover:hover{background-color:rgb(var(--cat-warning-bg-hover, 255, 214, 148)) !important;color:rgb(var(--cat-warning-fill-hover, 0, 0, 0)) !important;--cat-primary-text:var(--cat-warning-fill, 0, 0, 0);--cat-primary-text-hover:var(--cat-warning-fill-hover, 0, 0, 0);--cat-primary-text-active:var(--cat-warning-fill-active, 0, 0, 0);--cat-link-decoration:underline}.cat-text-warning,.cat-link-warning{color:rgb(var(--cat-warning-text, 159, 97, 0)) !important}.cat-link-warning,.cat-text-warning-hover{transition:color 125ms}.cat-link-warning:hover,.cat-text-warning-hover:hover{color:rgb(var(--cat-warning-text-hover, 159, 97, 0)) !important}.cat-link-warning:active,.cat-text-warning-hover:active{color:rgb(var(--cat-warning-text-active, 159, 97, 0)) !important}.cat-bg-danger{background-color:rgb(var(--cat-danger-bg, 217, 52, 13)) !important;color:rgb(var(--cat-danger-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-danger-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-danger-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-danger-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-danger-hover{transition:background-color 125ms, color 125ms}.cat-bg-danger-hover:hover{background-color:rgb(var(--cat-danger-bg-hover, 194, 46, 11)) !important;color:rgb(var(--cat-danger-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-danger-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-danger-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-danger-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-danger,.cat-link-danger{color:rgb(var(--cat-danger-text, 217, 52, 13)) !important}.cat-link-danger,.cat-text-danger-hover{transition:color 125ms}.cat-link-danger:hover,.cat-text-danger-hover:hover{color:rgb(var(--cat-danger-text-hover, 194, 46, 11)) !important}.cat-link-danger:active,.cat-text-danger-hover:active{color:rgb(var(--cat-danger-text-active, 174, 42, 10)) !important}.cat-active{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-text-active{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-muted{color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important}.cat-text-muted{color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important}.cat-bg-muted{background-color:#f2f4f7 !important}.cat-text-reset{color:inherit !important}.cat-link-reset{color:inherit !important;text-decoration:inherit !important}.label{overflow:hidden;word-wrap:break-word;word-break:break-word}.input-field:not(.input-horizontal) .label-container.hidden,.textarea-field:not(.textarea-horizontal) .label-container.hidden,.select-field:not(.select-horizontal) .label-container.hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.label-container{flex-basis:var(--label-size, 33.33%)}.label-container .label-wrapper{display:flex;gap:0.25rem}.label-metadata{display:flex;flex-shrink:0;flex-grow:1;justify-content:space-between;gap:0.25rem;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.label-optional,.label-character-count{display:inline-flex;align-items:center;max-height:1.25rem;font-size:0.75rem;line-height:1rem}.label-character-count{margin-left:auto}.input-horizontal .label-container.hidden label,.textarea-horizontal .label-container.hidden label,.select-horizontal .label-container.hidden label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.input-horizontal .label-wrapper,.textarea-horizontal .label-wrapper,.select-horizontal .label-wrapper{flex-direction:column}.input-horizontal label,.textarea-horizontal label,.select-horizontal label{min-height:2.5rem;display:inline-flex;align-items:center}.input-horizontal .label-metadata,.textarea-horizontal .label-metadata,.select-horizontal .label-metadata{justify-content:flex-start}.input-horizontal .label-metadata .label-character-count,.textarea-horizontal .label-metadata .label-character-count,.select-horizontal .label-metadata .label-character-count{margin-left:0}:host{display:flex;flex-direction:column;gap:0.5rem;line-height:1.25rem;position:relative}:host([hidden]){display:none}label{align-self:flex-start}label.hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.select-field,.select-container{display:flex;flex-direction:column;gap:0.5rem;flex:1 1 auto}.select-field.select-horizontal{flex-direction:row;gap:1rem}.select-wrapper{display:flex;align-items:flex-start;background:white;border-radius:var(--cat-border-radius-m, 0.25rem);box-shadow:inset 0 0 0 1px rgb(var(--border-color));transition:box-shadow 125ms linear;padding:0.25rem;--border-color:var(--cat-border-color-dark, 215, 219, 224);}.select-wrapper:not(.select-disabled):hover{box-shadow:inset 0 0 0 1px rgb(var(--border-color)), 0 0 0 1px rgb(var(--border-color))}.select-wrapper:focus-within{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:-1px}.select-wrapper.select-invalid{--border-color:var(--cat-danger-bg, 217, 52, 13), 0.2}.select-wrapper:has(input:-webkit-autofill),.select-wrapper:has(input:-webkit-autofill):hover,.select-wrapper:has(input:-webkit-autofill):focus{background-color:#e8f0fe}:host(.cat-error) .select-wrapper{box-shadow:0 0 0 1px rgb(var(--cat-danger-bg, 217, 52, 13))}:host(.cat-error) .select-wrapper:not(.input-disabled):hover{box-shadow:0 0 0 2px rgb(var(--cat-danger-bg, 217, 52, 13))}.select-disabled{background:#f2f4f7;cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108));pointer-events:none}.select-wrapper-inner{display:flex;flex:1 1 auto;align-items:center;gap:0.25rem;min-width:0}.select-wrapper-inner>cat-avatar{display:inline-block;padding-left:0.5rem}.select-wrapper-inner>cat-avatar+.select-input{padding-left:0.25rem}.select-wrapper-inner cat-avatar{--cat-avatar-size:1.25rem;--cat-avatar-font-size:0.5rem}.select-multiple .select-wrapper-inner{flex-wrap:wrap}.select-input{font:inherit;background:none;border:none;outline:none;padding:0.375rem 0.5rem;flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.select-input::placeholder{color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.select-disabled .select-input{cursor:inherit}.select-pills{display:contents}.pill{display:inline-flex;align-items:center;gap:0.5rem;padding:0.25rem 0.5rem;background:#f2f4f7;border-radius:var(--cat-border-radius-s, 0.125rem);white-space:nowrap;min-width:0}.pill>span{overflow:hidden;text-overflow:ellipsis;flex:1 1 0%}.pill>cat-button{margin-right:-0.25rem;margin-left:-0.25rem}.select-btn{transition:transform 125ms linear}.select-btn::part(button){outline:none}cat-spinner{padding:0.375rem}.icon-suffix{padding:0.25rem}.select-btn-open{transform:rotate(180deg)}.select-dropdown{position:fixed;right:0;background:white;display:none;overflow:auto;box-shadow:0 4px 6px -2px rgba(27, 31, 38, 0.03), 0 12px 16px -4px rgba(27, 31, 38, 0.08);border-radius:var(--cat-border-radius-m, 0.25rem);border:1px solid rgb(var(--cat-border-color, 235, 236, 240));z-index:calc(var(--cat-z-index, 1000) + 100);width:max-content;top:0;left:0}.select-options-wrapper{max-height:16rem;width:100%}.select-empty{margin:1rem 0;padding:0 1.25rem}.select-options{list-style-type:none;margin:0;padding:0.5rem 0}.select-options cat-checkbox,.select-options .select-option-single{margin:0;padding:0.5rem 1rem}.select-option-inner{display:flex;gap:0.5rem}.select-option-inner cat-avatar{--cat-avatar-size:1.25rem;--cat-avatar-font-size:0.5rem}.select-option-text{flex:1 1 0%;min-width:0}.select-option-single{cursor:pointer}.select-input-transparent-caret{caret-color:transparent}.select-option-empty,.select-option-loading{padding:0.5rem 1rem}.select-option:hover{background-color:rgba(var(--cat-secondary-bg, 105, 118, 135), 0.05)}.select-option-active{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:-2px}.select-option-label{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-wrap:break-word;word-break:break-word}.select-option-description{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}";
+const CatSelectStyle0 = catSelectCss;
 
 const INIT_STATE = {
     term: '',
@@ -8276,7 +10298,7 @@ const CatSelect = class {
         this.hasSlottedLabel = !!this.hostElement.querySelector('[slot="label"]');
         this.hasSlottedHint = !!this.hostElement.querySelector('[slot="hint"]');
         if (!this.label && !this.hasSlottedLabel) {
-            of.loglevel.warn('[A11y] Missing ARIA label on select', this);
+            of.log.warn('[A11y] Missing ARIA label on select', this);
         }
     }
     onBlur(event) {
@@ -8460,18 +10482,18 @@ const CatSelect = class {
         });
     }
     render() {
-        return (index.h(index.Host, null, index.h("div", { class: {
+        return (index.h(index.Host, { key: '062a85c7c55fa74a196cbca508dd12c08f329922' }, index.h("div", { key: 'c4d7213f5c5d8098053f740128d07faeaa8a96bf', class: {
                 'select-field': true,
                 'select-horizontal': this.horizontal,
                 'select-multiple': this.multiple
-            } }, index.h("div", { class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (index.h("label", { htmlFor: this.id, part: "label" }, index.h("span", { class: "label-wrapper" }, (this.hasSlottedLabel && index.h("slot", { name: "label" })) || this.label, index.h("div", { class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (index.h("span", { class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (index.h("span", { class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.required'), ")"))))))), index.h("div", { class: "select-container" }, index.h("div", { class: { 'select-wrapper': true, 'select-disabled': this.disabled, 'select-invalid': this.invalid }, ref: el => (this.trigger = el), id: this.id, role: "combobox", "aria-expanded": this.state.isOpen || this.isPillboxActive(), "aria-controls": this.isPillboxActive() ? `select-pillbox-${this.id}` : `select-listbox-${this.id}`, "aria-required": this.required ? 'true' : false, "aria-activedescendant": this.activeDescendant, onClick: e => this.onClick(e) }, index.h("div", { class: "select-wrapper-inner" }, this.multiple && this.state.selection.length ? (index.h("div", { id: `select-pillbox-${this.id}`, role: "listbox", "aria-orientation": "horizontal", class: "select-pills" }, this.state.selection.map((item, i) => (index.h("span", { class: {
+            } }, index.h("div", { key: '75573825fa123e453a5f2877d163faecdb6fd5c5', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (index.h("label", { htmlFor: this.id, part: "label" }, index.h("span", { class: "label-wrapper" }, (this.hasSlottedLabel && index.h("slot", { name: "label" })) || this.label, index.h("div", { class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (index.h("span", { class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (index.h("span", { class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.required'), ")"))))))), index.h("div", { key: '1f78a80916cf895f76bd318b03d575ed87789a49', class: "select-container" }, index.h("div", { key: '5998ad61fb04fbbc242883b39049b083c89fdbcf', class: { 'select-wrapper': true, 'select-disabled': this.disabled, 'select-invalid': this.invalid }, ref: el => (this.trigger = el), id: this.id, role: "combobox", "aria-expanded": this.state.isOpen || this.isPillboxActive(), "aria-controls": this.isPillboxActive() ? `select-pillbox-${this.id}` : `select-listbox-${this.id}`, "aria-required": this.required ? 'true' : false, "aria-activedescendant": this.activeDescendant, onClick: e => this.onClick(e) }, index.h("div", { key: 'b251a7ec629213881100fe8a22cfe963e9e3ca0f', class: "select-wrapper-inner" }, this.multiple && this.state.selection.length ? (index.h("div", { id: `select-pillbox-${this.id}`, role: "listbox", "aria-orientation": "horizontal", class: "select-pills" }, this.state.selection.map((item, i) => (index.h("span", { class: {
                 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 ? (index.h("cat-avatar", { label: item.render.label, round: item.render.avatar.round, src: item.render.avatar.src, icon: item.render.avatar.icon, initials: item.render.avatar.initials ?? '' })) : null, index.h("span", null, item.render.label), !this.disabled && (index.h("cat-button", { size: "xs", variant: "text", icon: "$cat:select-clear", iconOnly: true, a11yLabel: of.catI18nRegistry.t('select.deselect'), onClick: () => this.deselect(item.item.id), tabIndex: -1, "data-dropdown-no-close": true }))))))) : this.state.selection.length && this.state.selection[0].render.avatar ? (index.h("cat-avatar", { label: this.state.selection[0].render.label, round: this.state.selection[0].render.avatar.round, src: this.state.selection[0].render.avatar.src, icon: this.state.selection[0].render.avatar.icon, initials: this.state.selection[0].render.avatar.initials ?? '' })) : null, index.h("input", { ...this.nativeAttributes, part: "input", class: "select-input", 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, onInput: this.onInput.bind(this), value: !this.multiple ? this.state.term : undefined, placeholder: this.placeholder, disabled: this.disabled || this.state.isResolving })), this.state.isResolving && index.h("cat-spinner", null), this.invalid && (index.h("cat-icon", { 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 ? (index.h("cat-avatar", { label: item.render.label, round: item.render.avatar.round, src: item.render.avatar.src, icon: item.render.avatar.icon, initials: item.render.avatar.initials ?? '' })) : null, index.h("span", null, item.render.label), !this.disabled && (index.h("cat-button", { size: "xs", variant: "text", icon: "$cat:select-clear", iconOnly: true, a11yLabel: of.catI18nRegistry.t('select.deselect'), onClick: () => this.deselect(item.item.id), tabIndex: -1, "data-dropdown-no-close": true }))))))) : this.state.selection.length && this.state.selection[0].render.avatar ? (index.h("cat-avatar", { label: this.state.selection[0].render.label, round: this.state.selection[0].render.avatar.round, src: this.state.selection[0].render.avatar.src, icon: this.state.selection[0].render.avatar.icon, initials: this.state.selection[0].render.avatar.initials ?? '' })) : null, index.h("input", { key: '148ddd23d61a93bc56c1d7944bae37cd174038a8', ...this.nativeAttributes, part: "input", class: "select-input", 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, onInput: this.onInput.bind(this), value: !this.multiple ? this.state.term : undefined, placeholder: this.placeholder, disabled: this.disabled || this.state.isResolving })), this.state.isResolving && index.h("cat-spinner", null), this.invalid && (index.h("cat-icon", { 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 ? (index.h("cat-button", { id: `select-clear-btn-${this.id}`, iconOnly: true, icon: "$cat:input-close", variant: "text", size: "s", a11yLabel: of.catI18nRegistry.t('input.clear'), onCatClick: () => this.clearInput(), "data-dropdown-no-close": true })) : null, !this.state.isResolving && (index.h("cat-button", { iconOnly: true, icon: "$cat:select-open", class: { 'select-btn': true, 'select-btn-open': this.state.isOpen }, variant: "text", size: "s", a11yLabel: this.state.isOpen ? of.catI18nRegistry.t('select.close') : of.catI18nRegistry.t('select.open'), "aria-controls": `select-listbox-${this.id}`, "aria-expanded": this.state.isOpen, tabIndex: -1, disabled: this.disabled || this.state.isResolving, "data-dropdown-no-close": true }))), this.hasHint && (index.h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }), errorMap: this.errorMap })))), index.h("div", { class: "select-dropdown", ref: el => (this.dropdown = el), style: { display: this.state.isOpen ? 'block' : undefined } }, this.state.isOpen && (index.h("cat-scrollable", { class: "select-options-wrapper", scrolledBuffer: 56, noOverflowX: true, noOverscroll: true, noScrolledInit: true, onScrolledBottom: () => this.more$.next() }, index.h("ul", { class: "select-options", role: "listbox", "aria-multiselectable": this.multiple, "aria-setsize": this.state.totalElements, id: `select-listbox-${this.id}` }, this.optionsList, this.state.isLoading
+            this.clearable ? (index.h("cat-button", { id: `select-clear-btn-${this.id}`, iconOnly: true, icon: "$cat:input-close", variant: "text", size: "s", a11yLabel: of.catI18nRegistry.t('input.clear'), onCatClick: () => this.clearInput(), "data-dropdown-no-close": true })) : null, !this.state.isResolving && (index.h("cat-button", { iconOnly: true, icon: "$cat:select-open", class: { 'select-btn': true, 'select-btn-open': this.state.isOpen }, variant: "text", size: "s", a11yLabel: this.state.isOpen ? of.catI18nRegistry.t('select.close') : of.catI18nRegistry.t('select.open'), "aria-controls": `select-listbox-${this.id}`, "aria-expanded": this.state.isOpen, tabIndex: -1, disabled: this.disabled || this.state.isResolving, "data-dropdown-no-close": true }))), this.hasHint && (index.h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }), errorMap: this.errorMap })))), index.h("div", { key: '5d1f9bbcdd97d67a67da30715b6eb558c8828846', class: "select-dropdown", ref: el => (this.dropdown = el), style: { display: this.state.isOpen ? 'block' : undefined } }, this.state.isOpen && (index.h("cat-scrollable", { class: "select-options-wrapper", scrolledBuffer: 56, noOverflowX: true, noOverscroll: true, noScrolledInit: true, onScrolledBottom: () => this.more$.next() }, index.h("ul", { class: "select-options", role: "listbox", "aria-multiselectable": this.multiple, "aria-setsize": this.state.totalElements, id: `select-listbox-${this.id}` }, this.optionsList, this.state.isLoading
             ? Array.from(Array(CatSelect.SKELETON_COUNT)).map(() => (index.h("li", { class: "select-option-loading" }, index.h("cat-skeleton", { variant: "body", lines: 1 }), index.h("cat-skeleton", { variant: "body", lines: 1 }))))
             : !this.state.options.length &&
                 !this.tags && (index.h("li", { class: "select-option-empty" }, this.noItems ? this.noItems : of.catI18nRegistry.t('select.empty')))))))));
@@ -8820,7 +10842,7 @@ const CatSelect = class {
 };
 CatSelect.SKELETON_COUNT = 4;
 CatSelect.DROPDOWN_OFFSET = 4;
-CatSelect.style = catSelectCss;
+CatSelect.style = CatSelectStyle0;
 
 const CatSelectTest = class {
     constructor(hostRef) {
@@ -8964,7 +10986,7 @@ const CatSelectTest = class {
         setTimeout(() => this.multipleSelect && (this.multipleSelect.value = []), 5000);
     }
     render() {
-        return (index.h(index.Host, { style: { display: 'flex', flexDirection: 'column' } }, index.h("cat-select", { label: "Multiple Select", hint: "This is a hint!", ref: el => (this.multipleSelect = el), value: ['1'], placeholder: "Hello World", onCatChange: () => console.log('Multiple change', this.multipleSelect?.value), onCatBlur: e => console.log('Multiple blur', e), multiple: true, noItems: "No results", clearable: true, errorUpdate: false }, index.h("span", { slot: "hint" }, "Searching for \"no\" -", '>', " no options are returned!")), index.h("cat-select", { label: "Multiple with img", ref: el => (this.multipleSelectAvatar = el), value: ['1'], placeholder: "Hello World", multiple: true, clearable: true, errorUpdate: false }), index.h("cat-select", { label: "Multiple with initials", ref: el => (this.multipleSelectAvatarInitials = el), value: ['1'], placeholder: "Hello World", multiple: true, clearable: true, errorUpdate: false }), index.h("cat-select", { label: "Multiple with tagging support", hint: "This is a hint!", ref: el => (this.multipleSelectTagging = el), value: { ids: ['1'], tags: ['Test', 'Albania', 'Algeria'] }, placeholder: "Select country", onCatChange: () => console.log('Multiple tagging change', this.multipleSelectTagging?.value), multiple: true, tags: true, clearable: true, errorUpdate: false }), index.h("cat-select", { label: "Single Select", hint: "This is a hint!", ref: el => (this.singleSelect = el), placeholder: "Search for a country or capital", onCatBlur: e => console.log('Single blur', e), clearable: true, errorUpdate: false }), index.h("cat-select", { label: "Single with img", ref: el => (this.singleSelectAvatar = el), value: '1', placeholder: "Search for a country or capital", clearable: true, errorUpdate: false }), index.h("cat-select", { label: "Single with initials", ref: el => (this.singleSelectAvatarInitials = el), placeholder: "Hello World", clearable: true, errorUpdate: false }), index.h("cat-dropdown", { overflow: true }, index.h("cat-button", { slot: "trigger", style: { width: '50%' } }, "Open select"), index.h("div", { slot: "content", style: { width: '400px' } }, index.h("cat-select", { label: "Single with tagging support", ref: el => (this.singleSelectTagging = el), value: { id: '', tag: 'Albania' }, placeholder: "Search for a country or capital", onCatChange: () => console.log('Single change', this.singleSelectTagging?.value), tagHint: "new country", tags: true, clearable: true, errorUpdate: false, style: { width: '90%' } })))));
+        return (index.h(index.Host, { key: '917d1993ffdeb3df253cb69c4f91670bae865ffe', style: { display: 'flex', flexDirection: 'column' }, class: "cat-form" }, index.h("cat-select", { key: '0783adb9958ab099ee05514ab1eff2c2e9c19a3d', label: "Multiple Select", hint: "This is a hint!", ref: el => (this.multipleSelect = el), value: ['1'], placeholder: "Hello World", onCatChange: () => console.log('Multiple change', this.multipleSelect?.value), onCatBlur: e => console.log('Multiple blur', e), multiple: true, noItems: "No results", clearable: true, errorUpdate: false }, index.h("span", { key: 'a022a3f75759761d9f8cc75855c15c8bd577ec6d', slot: "hint" }, "Searching for \"no\" -", '>', " no options are returned!")), index.h("cat-select", { key: '6e5ff0f3f69a6b8eb812a73243de623afe6958aa', label: "Multiple with img", ref: el => (this.multipleSelectAvatar = el), value: ['1'], placeholder: "Hello World", multiple: true, clearable: true, errorUpdate: false }), index.h("cat-select", { key: 'f1f365f238c40179536fed2fdecf9562e9a2313b', label: "Multiple with initials", ref: el => (this.multipleSelectAvatarInitials = el), value: ['1'], placeholder: "Hello World", multiple: true, clearable: true, errorUpdate: false }), index.h("cat-select", { key: '3444b60c5c4e65e96288f0773e0a1fa1aa2e6418', label: "Multiple with tagging support", hint: "This is a hint!", ref: el => (this.multipleSelectTagging = el), value: { ids: ['1'], tags: ['Test', 'Albania', 'Algeria'] }, placeholder: "Select country", onCatChange: () => console.log('Multiple tagging change', this.multipleSelectTagging?.value), multiple: true, tags: true, clearable: true, errorUpdate: false }), index.h("cat-select", { key: '9de06f744b6b072184fd8b5d25f1ecd1e6377152', label: "Single Select", hint: "This is a hint!", ref: el => (this.singleSelect = el), placeholder: "Search for a country or capital", onCatBlur: e => console.log('Single blur', e), clearable: true, errorUpdate: false }), index.h("cat-select", { key: '64e4286713877e81dbd587a2b46a4836d3e6a003', label: "Single with img", ref: el => (this.singleSelectAvatar = el), value: '1', placeholder: "Search for a country or capital", clearable: true, errorUpdate: false }), index.h("cat-select", { key: 'd3a3435025715aa6b2cfb82ca7093ebfc6537038', label: "Single with initials", ref: el => (this.singleSelectAvatarInitials = el), placeholder: "Hello World", clearable: true, errorUpdate: false }), index.h("cat-dropdown", { key: '24a8e325652f4fac91a7548d1c7db43930ae3dba', overflow: true }, index.h("cat-button", { key: 'fe655431da67831a02855510e864d65895efc20e', slot: "trigger", style: { width: '50%' } }, "Open select"), index.h("div", { key: '01fc39c99c6f2bc2eabda4c8a26ab6aa46ea49d3', slot: "content", style: { width: '400px' } }, index.h("cat-select", { key: '7bd02aadc9a84797f4868e9a236e9af7245a2bd7', label: "Single with tagging support", ref: el => (this.singleSelectTagging = el), value: { id: '', tag: 'Albania' }, placeholder: "Search for a country or capital", onCatChange: () => console.log('Single change', this.singleSelectTagging?.value), tagHint: "new country", tags: true, clearable: true, errorUpdate: false, style: { width: '90%' } })))));
     }
     get countryConnector() {
         return {
@@ -10209,6 +12231,7 @@ const countries = [
 ];
 
 const catSkeletonCss = ":host{display:flex;flex-direction:column;position:relative;--background:#ebecf0;--highlight:#d7dbe0;--speed:2s}:host([variant=square]),:host([variant=circle]){display:inline-flex}:host([hidden]){display:none}:host([variant=head]:not(:last-child)){margin-bottom:1rem}:host([variant=body]:not(:last-child)){margin-bottom:2rem}.skeleton{display:block;border-radius:var(--cat-border-radius-m, 0.25rem);background:var(--background)}.skeleton-circle{border-radius:10rem}.skeleton-xs.skeleton-rectangle{width:var(--width, 100%);height:var(--height, 1.5rem)}.skeleton-xs.skeleton-square,.skeleton-xs.skeleton-circle{width:var(--width, 1.5rem);height:var(--height, 1.5rem)}.skeleton-xs.skeleton-head,.skeleton-xs.skeleton-body{width:var(--width, var(--line-width, 100%))}.skeleton-xs.skeleton-head{height:calc(0.9375rem - 4px);margin:calc((1.25rem - 0.9375rem + 4px) * 0.5) 0}.skeleton-xs.skeleton-body{height:calc(0.75rem - 4px);margin:calc((1rem - 0.75rem + 4px) * 0.5) 0}.skeleton-s.skeleton-rectangle{width:var(--width, 100%);height:var(--height, 2rem)}.skeleton-s.skeleton-square,.skeleton-s.skeleton-circle{width:var(--width, 2rem);height:var(--height, 2rem)}.skeleton-s.skeleton-head,.skeleton-s.skeleton-body{width:var(--width, var(--line-width, 100%))}.skeleton-s.skeleton-head{height:calc(1.125rem - 4px);margin:calc((1.5rem - 1.125rem + 4px) * 0.5) 0}.skeleton-s.skeleton-body{height:calc(0.875rem - 4px);margin:calc((1.125rem - 0.875rem + 4px) * 0.5) 0}.skeleton-m.skeleton-rectangle{width:var(--width, 100%);height:var(--height, 2.5rem)}.skeleton-m.skeleton-square,.skeleton-m.skeleton-circle{width:var(--width, 2.5rem);height:var(--height, 2.5rem)}.skeleton-m.skeleton-head,.skeleton-m.skeleton-body{width:var(--width, var(--line-width, 100%))}.skeleton-m.skeleton-head{height:calc(1.25rem - 4px);margin:calc((1.5rem - 1.25rem + 4px) * 0.5) 0}.skeleton-m.skeleton-body{height:calc(0.9375rem - 4px);margin:calc((1.25rem - 0.9375rem + 4px) * 0.5) 0}.skeleton-l.skeleton-rectangle{width:var(--width, 100%);height:var(--height, 3rem)}.skeleton-l.skeleton-square,.skeleton-l.skeleton-circle{width:var(--width, 3rem);height:var(--height, 3rem)}.skeleton-l.skeleton-head,.skeleton-l.skeleton-body{width:var(--width, var(--line-width, 100%))}.skeleton-l.skeleton-head{height:calc(1.5rem - 4px);margin:calc((1.75rem - 1.5rem + 4px) * 0.5) 0}.skeleton-l.skeleton-body{height:calc(1.125rem - 4px);margin:calc((1.5rem - 1.125rem + 4px) * 0.5) 0}.skeleton-xl.skeleton-rectangle{width:var(--width, 100%);height:var(--height, 3.5rem)}.skeleton-xl.skeleton-square,.skeleton-xl.skeleton-circle{width:var(--width, 3.5rem);height:var(--height, 3.5rem)}.skeleton-xl.skeleton-head,.skeleton-xl.skeleton-body{width:var(--width, var(--line-width, 100%))}.skeleton-xl.skeleton-head{height:calc(1.75rem - 4px);margin:calc((2rem - 1.75rem + 4px) * 0.5) 0}.skeleton-xl.skeleton-body{height:calc(1.25rem - 4px);margin:calc((1.5rem - 1.25rem + 4px) * 0.5) 0}.skeleton-sheen{background:linear-gradient(90deg, var(--background) 33%, var(--highlight) 50%, var(--background) 66%) var(--background);background-size:300% 100%;animation:sheen var(--speed) ease-in-out infinite}.skeleton-pulse{position:relative;overflow:hidden}.skeleton-pulse::before{content:\"\";display:block;position:absolute;width:100%;height:100%;background-color:var(--highlight);animation:var(--speed) ease-in-out 0.5s infinite normal none running pulse;opacity:0}@keyframes sheen{0%{background-position:right}}@keyframes pulse{50%{opacity:1}}";
+const CatSkeletonStyle0 = catSkeletonCss;
 
 const CatSkeleton = class {
     constructor(hostRef) {
@@ -10219,7 +12242,7 @@ const CatSkeleton = class {
         this.lines = undefined;
     }
     render() {
-        return (index.h(index.Host, null, Array.from(Array(this.count)).map(() => (index.h("div", { style: this.style, class: {
+        return (index.h(index.Host, { key: 'a19807a77a26996cffe07ac155ad7765618b5845' }, Array.from(Array(this.count)).map(() => (index.h("div", { style: this.style, class: {
                 skeleton: true,
                 [`skeleton-${this.effect}`]: Boolean(this.effect),
                 [`skeleton-${this.variant}`]: Boolean(this.variant),
@@ -10247,9 +12270,10 @@ const CatSkeleton = class {
         return Math.floor(Math.random() * (max - min + 1) + min);
     }
 };
-CatSkeleton.style = catSkeletonCss;
+CatSkeleton.style = CatSkeletonStyle0;
 
 const catSpinnerCss = ":host{display:inline-flex;vertical-align:middle;-webkit-user-select:none;-ms-user-select:none;user-select:none;}:host[hidden]{display:none}span{display:inline-flex}svg{fill:none;stroke:currentColor;stroke-dasharray:135px;stroke-dashoffset:95px;stroke-linecap:round;stroke-width:5px;transform-origin:center center;animation:spin 0.75s cubic-bezier(0.4, 0.15, 0.6, 0.85) infinite;width:1em;height:1em}.spinner-xs svg{font-size:0.75rem}.spinner-s svg{font-size:1rem}.spinner-m svg{font-size:1.25rem}.spinner-l svg{font-size:1.5rem}.spinner-xl svg{font-size:1.75rem}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}";
+const CatSpinnerStyle0 = catSpinnerCss;
 
 const CatSpinner = class {
     constructor(hostRef) {
@@ -10258,14 +12282,15 @@ const CatSpinner = class {
         this.a11yLabel = undefined;
     }
     render() {
-        return (index.h("span", { "aria-label": this.a11yLabel, "aria-hidden": this.a11yLabel ? null : 'true', class: {
+        return (index.h("span", { key: '9959df68cbff0d66f606eddd9ad4d28e6387016c', "aria-label": this.a11yLabel, "aria-hidden": this.a11yLabel ? null : 'true', class: {
                 [`spinner-${this.size}`]: this.size !== 'inline'
-            } }, index.h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 48 48" }, index.h("circle", { cx: "24", cy: "24", r: "21.5" }))));
+            } }, index.h("svg", { key: '5f1f119ac83d334ef537e58a18631b064504de42', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 48 48" }, index.h("circle", { key: 'c86f44033ed4cd7b13e08332dd0219001a1aa05d', cx: "24", cy: "24", r: "21.5" }))));
     }
 };
-CatSpinner.style = catSpinnerCss;
+CatSpinner.style = CatSpinnerStyle0;
 
 const catTabCss = ":host{display:block}:host([hidden]){display:none}";
+const CatTabStyle0 = catTabCss;
 
 let nextUniqueId$3 = 0;
 const CatTab = class {
@@ -10291,13 +12316,14 @@ const CatTab = class {
         this.catClick.emit(event);
     }
     render() {
-        return index.h(index.Host, null);
+        return index.h(index.Host, { key: 'd82385eb808736eea3c76a3df8381b9d4e0d742e' });
     }
     get hostElement() { return index.getElement(this); }
 };
-CatTab.style = catTabCss;
+CatTab.style = CatTabStyle0;
 
 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{display:inline-flex;flex-direction:column;align-items:center;justify-content:space-between;position:relative;transition:none}.cat-tab:first-of-type{margin-left:-0.75rem}.cat-tab:last-of-type{margin-right:-0.75rem}.cat-tab::after{opacity:0;content:\"\";position:absolute;background:currentColor;left:0.75rem;right:0.75rem;bottom:0;height:2px}.cat-tab:hover::after{opacity:0.25}.cat-tab.cat-tab-active{font-weight:700;color:rgb(var(--cat-primary-text-active, 2, 99, 113))}.cat-tab.cat-tab-error{color:rgb(var(--cat-danger-text-active, 174, 42, 10))}.cat-tab.cat-tab-active::after{opacity:1}";
+const CatTabsStyle0 = catTabsCss;
 
 const CatTabs = class {
     constructor(hostRef) {
@@ -10354,7 +12380,7 @@ const CatTabs = class {
         this.activate(this.tabs[index]);
     }
     render() {
-        return (index.h(index.Host, null, this.tabs.map((tab) => {
+        return (index.h(index.Host, { key: '94b84f077e41ac18206865152cabfc9f3a51ccc0' }, this.tabs.map((tab) => {
             return (index.h("cat-button", { buttonId: tab.id, role: "tab", part: "tab", class: {
                     'cat-tab': true,
                     'cat-tab-active': tab.id === this.activeTab,
@@ -10385,11 +12411,12 @@ const CatTabs = class {
         "activeTab": ["onActiveTabChange"]
     }; }
 };
-CatTabs.style = catTabsCss;
+CatTabs.style = CatTabsStyle0;
 
 var e=new Map;function t(t){var o=e.get(t);o&&o.destroy();}function o(t){var o=e.get(t);o&&o.update();}var r=null;"undefined"==typeof window?((r=function(e){return e}).destroy=function(e){return e},r.update=function(e){return e}):((r=function(t,o){return t&&Array.prototype.forEach.call(t.length?t:[t],function(t){return function(t){if(t&&t.nodeName&&"TEXTAREA"===t.nodeName&&!e.has(t)){var o,r=null,n=window.getComputedStyle(t),i=(o=t.value,function(){a({testForHeightReduction:""===o||!t.value.startsWith(o),restoreTextAlign:null}),o=t.value;}),l=function(o){t.removeEventListener("autosize:destroy",l),t.removeEventListener("autosize:update",s),t.removeEventListener("input",i),window.removeEventListener("resize",s),Object.keys(o).forEach(function(e){return t.style[e]=o[e]}),e.delete(t);}.bind(t,{height:t.style.height,resize:t.style.resize,textAlign:t.style.textAlign,overflowY:t.style.overflowY,overflowX:t.style.overflowX,wordWrap:t.style.wordWrap});t.addEventListener("autosize:destroy",l),t.addEventListener("autosize:update",s),t.addEventListener("input",i),window.addEventListener("resize",s),t.style.overflowX="hidden",t.style.wordWrap="break-word",e.set(t,{destroy:l,update:s}),s();}function a(e){var o,i,l=e.restoreTextAlign,s=void 0===l?null:l,d=e.testForHeightReduction,u=void 0===d||d,c=n.overflowY;if(0!==t.scrollHeight&&("vertical"===n.resize?t.style.resize="none":"both"===n.resize&&(t.style.resize="horizontal"),u&&(o=function(e){for(var t=[];e&&e.parentNode&&e.parentNode instanceof Element;)e.parentNode.scrollTop&&t.push([e.parentNode,e.parentNode.scrollTop]),e=e.parentNode;return function(){return t.forEach(function(e){var t=e[0],o=e[1];t.style.scrollBehavior="auto",t.scrollTop=o,t.style.scrollBehavior=null;})}}(t),t.style.height=""),i="content-box"===n.boxSizing?t.scrollHeight-(parseFloat(n.paddingTop)+parseFloat(n.paddingBottom)):t.scrollHeight+parseFloat(n.borderTopWidth)+parseFloat(n.borderBottomWidth),"none"!==n.maxHeight&&i>parseFloat(n.maxHeight)?("hidden"===n.overflowY&&(t.style.overflow="scroll"),i=parseFloat(n.maxHeight)):"hidden"!==n.overflowY&&(t.style.overflow="hidden"),t.style.height=i+"px",s&&(t.style.textAlign=s),o&&o(),r!==i&&(t.dispatchEvent(new Event("autosize:resized",{bubbles:!0})),r=i),c!==n.overflow&&!s)){var v=n.textAlign;"hidden"===n.overflow&&(t.style.textAlign="start"===v?"end":"start"),a({restoreTextAlign:v,testForHeightReduction:!0});}}function s(){a({testForHeightReduction:!0,restoreTextAlign:null});}}(t)}),t}).destroy=function(e){return e&&Array.prototype.forEach.call(e.length?e:[e],t),e},r.update=function(e){return e&&Array.prototype.forEach.call(e.length?e:[e],o),e});var n=r;
 
-const catTextareaCss = ".hint-wrapper{flex:0 1 auto;display:flex;gap:0.5rem}.hint-section{flex:1 1 auto;display:flex;flex-direction:column;gap:0.25rem;color:rgb(var(--cat-font-color-muted, 81, 92, 108));font-size:0.875rem;line-height:1.125rem}.hint-section .input-hint,.hint-section ::slotted([slot=hint]){margin:0 !important}.cat-bg-primary{background-color:rgb(var(--cat-primary-bg, 0, 129, 148)) !important;color:rgb(var(--cat-primary-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-primary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-primary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-primary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-primary-hover{transition:background-color 125ms, color 125ms}.cat-bg-primary-hover:hover{background-color:rgb(var(--cat-primary-bg-hover, 1, 115, 132)) !important;color:rgb(var(--cat-primary-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-primary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-primary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-primary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-primary,.cat-link-primary{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-link-primary,.cat-text-primary-hover{transition:color 125ms}.cat-link-primary:hover,.cat-text-primary-hover:hover{color:rgb(var(--cat-primary-text-hover, 1, 115, 132)) !important}.cat-link-primary:active,.cat-text-primary-hover:active{color:rgb(var(--cat-primary-text-active, 2, 99, 113)) !important}.cat-bg-primaryInverted{background-color:#93b4f2 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-bg-primaryInverted-hover{transition:background-color 125ms, color 125ms}.cat-bg-primaryInverted-hover:hover{background-color:#93b4f2 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-text-primaryInverted,.cat-link-primaryInverted{color:#93b4f2 !important}.cat-link-primaryInverted,.cat-text-primaryInverted-hover{transition:color 125ms}.cat-link-primaryInverted:hover,.cat-text-primaryInverted-hover:hover{color:#93b4f2 !important}.cat-link-primaryInverted:active,.cat-text-primaryInverted-hover:active{color:#93b4f2 !important}.cat-bg-secondary{background-color:rgb(var(--cat-secondary-bg, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-secondary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-secondary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-secondary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-secondary-hover{transition:background-color 125ms, color 125ms}.cat-bg-secondary-hover:hover{background-color:rgb(var(--cat-secondary-bg-hover, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-secondary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-secondary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-secondary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-secondary,.cat-link-secondary{color:rgb(var(--cat-secondary-text, 0, 0, 0)) !important}.cat-link-secondary,.cat-text-secondary-hover{transition:color 125ms}.cat-link-secondary:hover,.cat-text-secondary-hover:hover{color:rgb(var(--cat-secondary-text-hover, 0, 0, 0)) !important}.cat-link-secondary:active,.cat-text-secondary-hover:active{color:rgb(var(--cat-secondary-text-active, 0, 0, 0)) !important}.cat-bg-secondaryInverted{background-color:#697687 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-bg-secondaryInverted-hover{transition:background-color 125ms, color 125ms}.cat-bg-secondaryInverted-hover:hover{background-color:#697687 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-text-secondaryInverted,.cat-link-secondaryInverted{color:white !important}.cat-link-secondaryInverted,.cat-text-secondaryInverted-hover{transition:color 125ms}.cat-link-secondaryInverted:hover,.cat-text-secondaryInverted-hover:hover{color:white !important}.cat-link-secondaryInverted:active,.cat-text-secondaryInverted-hover:active{color:white !important}.cat-bg-info{background-color:rgb(var(--cat-success-bg, 0, 115, 230)) !important;color:rgb(var(--cat-success-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-info-hover{transition:background-color 125ms, color 125ms}.cat-bg-info-hover:hover{background-color:rgb(var(--cat-success-bg-hover, 0, 107, 227)) !important;color:rgb(var(--cat-success-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-info,.cat-link-info{color:rgb(var(--cat-success-text, 0, 115, 230)) !important}.cat-link-info,.cat-text-info-hover{transition:color 125ms}.cat-link-info:hover,.cat-text-info-hover:hover{color:rgb(var(--cat-success-text-hover, 0, 107, 227)) !important}.cat-link-info:active,.cat-text-info-hover:active{color:rgb(var(--cat-success-text-active, 0, 96, 223)) !important}.cat-bg-success{background-color:rgb(var(--cat-success-bg, 0, 132, 88)) !important;color:rgb(var(--cat-success-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-success-hover{transition:background-color 125ms, color 125ms}.cat-bg-success-hover:hover{background-color:rgb(var(--cat-success-bg-hover, 0, 117, 78)) !important;color:rgb(var(--cat-success-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-success,.cat-link-success{color:rgb(var(--cat-success-text, 0, 132, 88)) !important}.cat-link-success,.cat-text-success-hover{transition:color 125ms}.cat-link-success:hover,.cat-text-success-hover:hover{color:rgb(var(--cat-success-text-hover, 0, 117, 78)) !important}.cat-link-success:active,.cat-text-success-hover:active{color:rgb(var(--cat-success-text-active, 0, 105, 70)) !important}.cat-bg-warning{background-color:rgb(var(--cat-warning-bg, 255, 206, 128)) !important;color:rgb(var(--cat-warning-fill, 0, 0, 0)) !important;--cat-primary-text:var(--cat-warning-fill, 0, 0, 0);--cat-primary-text-hover:var(--cat-warning-fill-hover, 0, 0, 0);--cat-primary-text-active:var(--cat-warning-fill-active, 0, 0, 0);--cat-link-decoration:underline}.cat-bg-warning-hover{transition:background-color 125ms, color 125ms}.cat-bg-warning-hover:hover{background-color:rgb(var(--cat-warning-bg-hover, 255, 214, 148)) !important;color:rgb(var(--cat-warning-fill-hover, 0, 0, 0)) !important;--cat-primary-text:var(--cat-warning-fill, 0, 0, 0);--cat-primary-text-hover:var(--cat-warning-fill-hover, 0, 0, 0);--cat-primary-text-active:var(--cat-warning-fill-active, 0, 0, 0);--cat-link-decoration:underline}.cat-text-warning,.cat-link-warning{color:rgb(var(--cat-warning-text, 159, 97, 0)) !important}.cat-link-warning,.cat-text-warning-hover{transition:color 125ms}.cat-link-warning:hover,.cat-text-warning-hover:hover{color:rgb(var(--cat-warning-text-hover, 159, 97, 0)) !important}.cat-link-warning:active,.cat-text-warning-hover:active{color:rgb(var(--cat-warning-text-active, 159, 97, 0)) !important}.cat-bg-danger{background-color:rgb(var(--cat-danger-bg, 217, 52, 13)) !important;color:rgb(var(--cat-danger-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-danger-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-danger-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-danger-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-danger-hover{transition:background-color 125ms, color 125ms}.cat-bg-danger-hover:hover{background-color:rgb(var(--cat-danger-bg-hover, 194, 46, 11)) !important;color:rgb(var(--cat-danger-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-danger-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-danger-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-danger-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-danger,.cat-link-danger{color:rgb(var(--cat-danger-text, 217, 52, 13)) !important}.cat-link-danger,.cat-text-danger-hover{transition:color 125ms}.cat-link-danger:hover,.cat-text-danger-hover:hover{color:rgb(var(--cat-danger-text-hover, 194, 46, 11)) !important}.cat-link-danger:active,.cat-text-danger-hover:active{color:rgb(var(--cat-danger-text-active, 174, 42, 10)) !important}.cat-active{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-text-active{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-muted{color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important}.cat-text-muted{color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important}.cat-bg-muted{background-color:#f2f4f7 !important}.cat-text-reset{color:inherit !important}.cat-link-reset{color:inherit !important;text-decoration:inherit !important}.label{overflow:hidden;word-wrap:break-word;word-break:break-word}.input-field:not(.input-horizontal) .label-container.hidden,.textarea-field:not(.textarea-horizontal) .label-container.hidden,.select-field:not(.select-horizontal) .label-container.hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.label-container{flex-basis:var(--label-size, 33.33%)}.label-container .label-wrapper{display:flex;gap:0.25rem}.label-metadata{display:flex;flex-shrink:0;flex-grow:1;justify-content:space-between;gap:0.25rem;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.label-optional,.label-character-count{display:inline-flex;align-items:center;max-height:1.25rem;font-size:0.75rem;line-height:1rem}.label-character-count{margin-left:auto}.input-horizontal .label-container.hidden label,.textarea-horizontal .label-container.hidden label,.select-horizontal .label-container.hidden label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.input-horizontal .label-wrapper,.textarea-horizontal .label-wrapper,.select-horizontal .label-wrapper{flex-direction:column}.input-horizontal label,.textarea-horizontal label,.select-horizontal label{min-height:2.5rem;display:inline-flex;align-items:center}.input-horizontal .label-metadata,.textarea-horizontal .label-metadata,.select-horizontal .label-metadata{justify-content:flex-start}.input-horizontal .label-metadata .label-character-count,.textarea-horizontal .label-metadata .label-character-count,.select-horizontal .label-metadata .label-character-count{margin-left:0}:host{display:flex;flex-direction:column;gap:0.5rem;font-size:0.9375rem;line-height:1.25rem;font-weight:var(--cat-font-weight-body, 400)}:host([hidden]){display:none}.textarea-field,.textarea-container{display:flex;flex-direction:column;gap:0.5rem;flex:1 1 auto}.textarea-field.textarea-horizontal{flex-direction:row;gap:1rem}.textarea-readonly{pointer-events:none}.textarea-wrapper{position:relative;display:flex;flex-direction:column}.icon-suffix{position:absolute;top:calc(0.625rem - 2px);right:0.75rem;background:rgba(255, 255, 255, 0.75);border-radius:100rem}.textarea-disabled .icon-suffix{background:rgba(242, 244, 247, 0.75)}textarea{margin:0;padding:0.625rem 0.75rem;box-sizing:border-box;min-height:2.5rem;font:inherit;background:white;border-radius:var(--cat-border-radius-m, 0.25rem);border:none;box-shadow:inset 0 0 0 1px rgb(var(--border-color));transition:box-shadow 125ms linear;resize:vertical;--border-color:var(--cat-border-color-dark, 215, 219, 224);}textarea:disabled{background:#f2f4f7;cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108));resize:none}textarea:not(:disabled):hover{box-shadow:inset 0 0 0 1px rgb(var(--border-color)), 0 0 0 1px rgb(var(--border-color))}textarea:focus{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:-1px}.textarea-invalid textarea{--border-color:var(--cat-danger-bg, 217, 52, 13), 0.2}textarea::placeholder{color:rgb(var(--cat-font-color-muted, 81, 92, 108))}textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 9999px #e8f0fe inset}";
+const catTextareaCss = ".hint-wrapper{flex:0 1 auto;display:flex;gap:0.5rem}.hint-section{flex:1 1 auto;display:flex;flex-direction:column;gap:0.25rem;color:rgb(var(--cat-font-color-muted, 81, 92, 108));font-size:0.875rem;line-height:1.125rem}.hint-section .input-hint,.hint-section ::slotted([slot=hint]){margin:0 !important}.cat-bg-primary{background-color:rgb(var(--cat-primary-bg, 0, 129, 148)) !important;color:rgb(var(--cat-primary-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-primary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-primary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-primary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-primary-hover{transition:background-color 125ms, color 125ms}.cat-bg-primary-hover:hover{background-color:rgb(var(--cat-primary-bg-hover, 1, 115, 132)) !important;color:rgb(var(--cat-primary-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-primary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-primary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-primary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-primary,.cat-link-primary{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-link-primary,.cat-text-primary-hover{transition:color 125ms}.cat-link-primary:hover,.cat-text-primary-hover:hover{color:rgb(var(--cat-primary-text-hover, 1, 115, 132)) !important}.cat-link-primary:active,.cat-text-primary-hover:active{color:rgb(var(--cat-primary-text-active, 2, 99, 113)) !important}.cat-bg-primaryInverted{background-color:#93b4f2 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-bg-primaryInverted-hover{transition:background-color 125ms, color 125ms}.cat-bg-primaryInverted-hover:hover{background-color:#93b4f2 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-text-primaryInverted,.cat-link-primaryInverted{color:#93b4f2 !important}.cat-link-primaryInverted,.cat-text-primaryInverted-hover{transition:color 125ms}.cat-link-primaryInverted:hover,.cat-text-primaryInverted-hover:hover{color:#93b4f2 !important}.cat-link-primaryInverted:active,.cat-text-primaryInverted-hover:active{color:#93b4f2 !important}.cat-bg-secondary{background-color:rgb(var(--cat-secondary-bg, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-secondary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-secondary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-secondary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-secondary-hover{transition:background-color 125ms, color 125ms}.cat-bg-secondary-hover:hover{background-color:rgb(var(--cat-secondary-bg-hover, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-secondary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-secondary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-secondary-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-secondary,.cat-link-secondary{color:rgb(var(--cat-secondary-text, 0, 0, 0)) !important}.cat-link-secondary,.cat-text-secondary-hover{transition:color 125ms}.cat-link-secondary:hover,.cat-text-secondary-hover:hover{color:rgb(var(--cat-secondary-text-hover, 0, 0, 0)) !important}.cat-link-secondary:active,.cat-text-secondary-hover:active{color:rgb(var(--cat-secondary-text-active, 0, 0, 0)) !important}.cat-bg-secondaryInverted{background-color:#697687 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-bg-secondaryInverted-hover{transition:background-color 125ms, color 125ms}.cat-bg-secondaryInverted-hover:hover{background-color:#697687 !important;color:black !important;--cat-primary-text:0, 0, 0;--cat-primary-text-hover:0, 0, 0;--cat-primary-text-active:0, 0, 0;--cat-link-decoration:underline}.cat-text-secondaryInverted,.cat-link-secondaryInverted{color:white !important}.cat-link-secondaryInverted,.cat-text-secondaryInverted-hover{transition:color 125ms}.cat-link-secondaryInverted:hover,.cat-text-secondaryInverted-hover:hover{color:white !important}.cat-link-secondaryInverted:active,.cat-text-secondaryInverted-hover:active{color:white !important}.cat-bg-info{background-color:rgb(var(--cat-info-bg, 0, 115, 230)) !important;color:rgb(var(--cat-info-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-info-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-info-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-info-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-info-hover{transition:background-color 125ms, color 125ms}.cat-bg-info-hover:hover{background-color:rgb(var(--cat-info-bg-hover, 0, 107, 227)) !important;color:rgb(var(--cat-info-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-info-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-info-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-info-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-info,.cat-link-info{color:rgb(var(--cat-info-text, 0, 115, 230)) !important}.cat-link-info,.cat-text-info-hover{transition:color 125ms}.cat-link-info:hover,.cat-text-info-hover:hover{color:rgb(var(--cat-info-text-hover, 0, 107, 227)) !important}.cat-link-info:active,.cat-text-info-hover:active{color:rgb(var(--cat-info-text-active, 0, 96, 223)) !important}.cat-bg-success{background-color:rgb(var(--cat-success-bg, 0, 132, 88)) !important;color:rgb(var(--cat-success-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-success-hover{transition:background-color 125ms, color 125ms}.cat-bg-success-hover:hover{background-color:rgb(var(--cat-success-bg-hover, 0, 117, 78)) !important;color:rgb(var(--cat-success-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-success,.cat-link-success{color:rgb(var(--cat-success-text, 0, 132, 88)) !important}.cat-link-success,.cat-text-success-hover{transition:color 125ms}.cat-link-success:hover,.cat-text-success-hover:hover{color:rgb(var(--cat-success-text-hover, 0, 117, 78)) !important}.cat-link-success:active,.cat-text-success-hover:active{color:rgb(var(--cat-success-text-active, 0, 105, 70)) !important}.cat-bg-warning{background-color:rgb(var(--cat-warning-bg, 255, 206, 128)) !important;color:rgb(var(--cat-warning-fill, 0, 0, 0)) !important;--cat-primary-text:var(--cat-warning-fill, 0, 0, 0);--cat-primary-text-hover:var(--cat-warning-fill-hover, 0, 0, 0);--cat-primary-text-active:var(--cat-warning-fill-active, 0, 0, 0);--cat-link-decoration:underline}.cat-bg-warning-hover{transition:background-color 125ms, color 125ms}.cat-bg-warning-hover:hover{background-color:rgb(var(--cat-warning-bg-hover, 255, 214, 148)) !important;color:rgb(var(--cat-warning-fill-hover, 0, 0, 0)) !important;--cat-primary-text:var(--cat-warning-fill, 0, 0, 0);--cat-primary-text-hover:var(--cat-warning-fill-hover, 0, 0, 0);--cat-primary-text-active:var(--cat-warning-fill-active, 0, 0, 0);--cat-link-decoration:underline}.cat-text-warning,.cat-link-warning{color:rgb(var(--cat-warning-text, 159, 97, 0)) !important}.cat-link-warning,.cat-text-warning-hover{transition:color 125ms}.cat-link-warning:hover,.cat-text-warning-hover:hover{color:rgb(var(--cat-warning-text-hover, 159, 97, 0)) !important}.cat-link-warning:active,.cat-text-warning-hover:active{color:rgb(var(--cat-warning-text-active, 159, 97, 0)) !important}.cat-bg-danger{background-color:rgb(var(--cat-danger-bg, 217, 52, 13)) !important;color:rgb(var(--cat-danger-fill, 255, 255, 255)) !important;--cat-primary-text:var(--cat-danger-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-danger-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-danger-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-bg-danger-hover{transition:background-color 125ms, color 125ms}.cat-bg-danger-hover:hover{background-color:rgb(var(--cat-danger-bg-hover, 194, 46, 11)) !important;color:rgb(var(--cat-danger-fill-hover, 255, 255, 255)) !important;--cat-primary-text:var(--cat-danger-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-danger-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-danger-fill-active, 255, 255, 255);--cat-link-decoration:underline}.cat-text-danger,.cat-link-danger{color:rgb(var(--cat-danger-text, 217, 52, 13)) !important}.cat-link-danger,.cat-text-danger-hover{transition:color 125ms}.cat-link-danger:hover,.cat-text-danger-hover:hover{color:rgb(var(--cat-danger-text-hover, 194, 46, 11)) !important}.cat-link-danger:active,.cat-text-danger-hover:active{color:rgb(var(--cat-danger-text-active, 174, 42, 10)) !important}.cat-active{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-text-active{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-muted{color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important}.cat-text-muted{color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important}.cat-bg-muted{background-color:#f2f4f7 !important}.cat-text-reset{color:inherit !important}.cat-link-reset{color:inherit !important;text-decoration:inherit !important}.label{overflow:hidden;word-wrap:break-word;word-break:break-word}.input-field:not(.input-horizontal) .label-container.hidden,.textarea-field:not(.textarea-horizontal) .label-container.hidden,.select-field:not(.select-horizontal) .label-container.hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.label-container{flex-basis:var(--label-size, 33.33%)}.label-container .label-wrapper{display:flex;gap:0.25rem}.label-metadata{display:flex;flex-shrink:0;flex-grow:1;justify-content:space-between;gap:0.25rem;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.label-optional,.label-character-count{display:inline-flex;align-items:center;max-height:1.25rem;font-size:0.75rem;line-height:1rem}.label-character-count{margin-left:auto}.input-horizontal .label-container.hidden label,.textarea-horizontal .label-container.hidden label,.select-horizontal .label-container.hidden label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.input-horizontal .label-wrapper,.textarea-horizontal .label-wrapper,.select-horizontal .label-wrapper{flex-direction:column}.input-horizontal label,.textarea-horizontal label,.select-horizontal label{min-height:2.5rem;display:inline-flex;align-items:center}.input-horizontal .label-metadata,.textarea-horizontal .label-metadata,.select-horizontal .label-metadata{justify-content:flex-start}.input-horizontal .label-metadata .label-character-count,.textarea-horizontal .label-metadata .label-character-count,.select-horizontal .label-metadata .label-character-count{margin-left:0}:host{display:flex;flex-direction:column;gap:0.5rem;font-size:0.9375rem;line-height:1.25rem;font-weight:var(--cat-font-weight-body, 400)}:host([hidden]){display:none}.textarea-field,.textarea-container{display:flex;flex-direction:column;gap:0.5rem;flex:1 1 auto}.textarea-field.textarea-horizontal{flex-direction:row;gap:1rem}.textarea-readonly{pointer-events:none}.textarea-wrapper{position:relative;display:flex;flex-direction:column}.icon-suffix{position:absolute;top:calc(0.625rem - 2px);right:0.75rem;background:rgba(255, 255, 255, 0.75);border-radius:100rem}.textarea-disabled .icon-suffix{background:rgba(242, 244, 247, 0.75)}textarea{margin:0;padding:0.625rem 0.75rem;box-sizing:border-box;min-height:2.5rem;font:inherit;background:white;border-radius:var(--cat-border-radius-m, 0.25rem);border:none;box-shadow:inset 0 0 0 1px rgb(var(--border-color));transition:box-shadow 125ms linear;resize:vertical;--border-color:var(--cat-border-color-dark, 215, 219, 224);}textarea:disabled{background:#f2f4f7;cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108));resize:none}textarea:not(:disabled):hover{box-shadow:inset 0 0 0 1px rgb(var(--border-color)), 0 0 0 1px rgb(var(--border-color))}textarea:focus{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:-1px}.textarea-invalid textarea{--border-color:var(--cat-danger-bg, 217, 52, 13), 0.2}textarea::placeholder{color:rgb(var(--cat-font-color-muted, 81, 92, 108))}textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 9999px #e8f0fe inset}";
+const CatTextareaStyle0 = catTextareaCss;
 
 let nextUniqueId$2 = 0;
 const CatTextarea = class {
@@ -10429,7 +12456,7 @@ const CatTextarea = class {
         this.hasSlottedLabel = !!this.hostElement.querySelector('[slot="label"]');
         this.hasSlottedHint = !!this.hostElement.querySelector('[slot="hint"]');
         if (!this.label && !this.hasSlottedLabel) {
-            of.loglevel.warn('[A11y] Missing ARIA label on textarea', this);
+            of.log.warn('[A11y] Missing ARIA label on textarea', this);
         }
     }
     componentDidLoad() {
@@ -10473,15 +12500,15 @@ const CatTextarea = class {
         }
     }
     render() {
-        return (index.h(index.Host, null, index.h("div", { class: {
+        return (index.h(index.Host, { key: 'cb67b2133a56d47e02cc099e0a52670d8b2ba808' }, index.h("div", { key: 'bd7af8f7626ea32983a2cd2595556722b9384384', class: {
                 'textarea-field': true,
                 'textarea-horizontal': this.horizontal
-            } }, index.h("div", { class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (index.h("label", { htmlFor: this.id, part: "label" }, index.h("span", { class: "label-wrapper" }, (this.hasSlottedLabel && index.h("slot", { name: "label" })) || this.label, index.h("div", { class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (index.h("span", { class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (index.h("span", { class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.required'), ")")), this.maxLength && (index.h("div", { class: "label-character-count", "aria-hidden": "true" }, this.value?.length ?? 0, "/", this.maxLength))))))), index.h("div", { class: "textarea-container" }, index.h("div", { class: {
+            } }, index.h("div", { key: '58eaf7f6f077148933667818c80ba7c61f3f599c', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (index.h("label", { htmlFor: this.id, part: "label" }, index.h("span", { class: "label-wrapper" }, (this.hasSlottedLabel && index.h("slot", { name: "label" })) || this.label, index.h("div", { class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (index.h("span", { class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (index.h("span", { class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.required'), ")")), this.maxLength && (index.h("div", { class: "label-character-count", "aria-hidden": "true" }, this.value?.length ?? 0, "/", this.maxLength))))))), index.h("div", { key: '697555f611a053df4df7dfe12cbd7e6fdcb4f0a1', class: "textarea-container" }, index.h("div", { key: '85c1b4a93bf03b3b6046f310bbb841d312638d3b', class: {
                 'textarea-wrapper': true,
                 'textarea-readonly': this.readonly,
                 'textarea-disabled': this.disabled,
                 'textarea-invalid': this.invalid
-            } }, index.h("textarea", { ...this.nativeAttributes, part: "textarea", ref: el => (this.textarea = el), id: this.id, disabled: this.disabled, 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 && (index.h("cat-icon", { icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l", onClick: () => this.textarea.focus() }))), this.hasHint && (index.h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }), errorMap: this.errorMap }))))));
+            } }, index.h("textarea", { key: '2646d5e59ea09e361c87ad1635d641c9ce2d1fb6', ...this.nativeAttributes, part: "textarea", ref: el => (this.textarea = el), id: this.id, disabled: this.disabled, 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 && (index.h("cat-icon", { icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l", onClick: () => this.textarea.focus() }))), this.hasHint && (index.h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }), errorMap: this.errorMap }))))));
     }
     get hasHint() {
         return !!this.hint || !!this.hasSlottedHint || this.invalid;
@@ -10526,9 +12553,225 @@ const CatTextarea = class {
         "errors": ["onErrorsChanged"]
     }; }
 };
-CatTextarea.style = catTextareaCss;
+CatTextarea.style = CatTextareaStyle0;
+
+function getHour12(language) {
+    const dateStr = new Intl.DateTimeFormat(language, { hour: '2-digit', minute: '2-digit' })
+        .format(new Date())
+        .toLowerCase();
+    return dateStr.includes('am') || dateStr.includes('pm');
+}
+function getLocale(language) {
+    return {
+        change: of.catI18nRegistry.t('timepicker.change'),
+        choose: of.catI18nRegistry.t('timepicker.choose'),
+        timeFormat: getHour12(language) ? '12' : '24'
+    };
+}
+
+function clampTime(min, date, max) {
+    const [, hhMin, mmMin] = min?.match(/(\d{2}):(\d{2})/)?.map(Number) ?? [];
+    const [, hhMax, mmMax] = max?.match(/(\d{2}):(\d{2})/)?.map(Number) ?? [];
+    let minTime = -Infinity;
+    let maxTime = Infinity;
+    if (hhMin !== undefined && mmMin !== undefined) {
+        minTime = new Date(date.getFullYear(), date.getMonth(), date.getDate(), hhMin, mmMin).getTime();
+    }
+    if (hhMax !== undefined && mmMax !== undefined) {
+        maxTime = new Date(date.getFullYear(), date.getMonth(), date.getDate(), hhMax, mmMax).getTime();
+    }
+    return new Date(Math.min(Math.max(date.getTime(), minTime), maxTime));
+}
+function isBefore(date, time) {
+    const [, hh, mm] = time?.match(/(\d{2}):(\d{2})/)?.map(Number) ?? [];
+    if (hh === undefined || mm === undefined) {
+        return false;
+    }
+    return date.getHours() < hh || (date.getHours() === hh && date.getMinutes() < mm);
+}
+function isAfter(date, time) {
+    const [, hh, mm] = time?.match(/(\d{2}):(\d{2})/)?.map(Number) ?? [];
+    if (hh === undefined || mm === undefined) {
+        return false;
+    }
+    return date.getHours() > hh || (date.getHours() === hh && date.getMinutes() > mm);
+}
+
+const catTimeCss = ":host{display:block}:host([hidden]){display:none}.label-aria{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.cat-time-addon{margin-left:-1px}nav{max-height:16rem}nav ul{list-style:none;margin:0;padding:0}.time-disabled{opacity:0.25}";
+const CatTimeStyle0 = catTimeCss;
+
+const CatTime = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.catChange = index.createEvent(this, "catChange", 7);
+        this.catFocus = index.createEvent(this, "catFocus", 7);
+        this.catBlur = index.createEvent(this, "catBlur", 7);
+        this.language = of.catI18nRegistry.getLocale();
+        this.locale = getLocale(this.language);
+        this.hasSlottedLabel = false;
+        this.hasSlottedHint = false;
+        this.selectionTime = null;
+        this.isAm = true;
+        this.requiredMarker = 'optional';
+        this.horizontal = false;
+        this.autoComplete = undefined;
+        this.clearable = false;
+        this.disabled = false;
+        this.hint = undefined;
+        this.icon = undefined;
+        this.iconRight = false;
+        this.identifier = undefined;
+        this.label = '';
+        this.labelHidden = false;
+        this.max = undefined;
+        this.min = undefined;
+        this.name = undefined;
+        this.placeholder = undefined;
+        this.textPrefix = undefined;
+        this.textSuffix = undefined;
+        this.readonly = false;
+        this.required = false;
+        this.value = undefined;
+        this.errors = undefined;
+        this.errorUpdate = 0;
+        this.nativeAttributes = undefined;
+        this.placement = 'bottom-end';
+        this.step = 30;
+    }
+    componentWillLoad() {
+        this.syncValue(this.value ?? '');
+    }
+    componentWillRender() {
+        this.hasSlottedLabel = !!this.hostElement.querySelector('[slot="label"]');
+        this.hasSlottedHint = !!this.hostElement.querySelector('[slot="hint"]');
+    }
+    componentDidLoad() {
+        this.input?.mask({
+            time: true,
+            timeFormat: this.locale.timeFormat,
+            timePattern: ['h', 'm']
+        });
+    }
+    onOpen() {
+        const query = (selector) => this.hostElement.shadowRoot?.querySelector(selector);
+        const time = clampTime(this.min ?? null, this.selectionTime ?? new Date(2000, 5, 1, 8), this.max ?? null);
+        const elem1 = query(`[data-time="${this.formatIso(time)}"]`);
+        time.setMinutes(Math.floor(time.getMinutes() / this.step) * this.step);
+        const elem2 = query(`[data-time="${this.formatIso(time)}"]`);
+        setTimeout(() => {
+            (elem2 ?? elem1)?.doFocus();
+            (elem2 ?? elem1)?.scrollIntoView(this.selectionTime ? { block: 'center' } : undefined);
+        }); // not entirely sure why this is necessary
+    }
+    /**
+     * Select a time in the picker.
+     *
+     * @param date The time to select.
+     */
+    async select(date) {
+        const oldValue = this.value;
+        if (!date) {
+            this.selectionTime = null;
+            this.value = undefined;
+        }
+        else {
+            const time = clampTime(this.min ?? null, date, this.max ?? null);
+            this.isAm = this.format(time).toLowerCase().includes('am');
+            this.selectionTime = time;
+            this.value = this.formatIso(time);
+        }
+        // we need to set the input explicitly to sync the input even without a
+        // rerender (if the value is not changed)
+        if (this.input) {
+            this.input.value = this.format(this.selectionTime, false);
+        }
+        if (oldValue !== this.value) {
+            this.catChange.emit(this.value);
+        }
+    }
+    /**
+     * Programmatically move focus to the input. Use this method instead of
+     * `input.focus()`.
+     *
+     * @param options An optional object providing options to control aspects of
+     * the focusing process.
+     */
+    async doFocus(options) {
+        this.input?.doFocus(options);
+    }
+    /**
+     * Programmatically remove focus from the input. Use this method instead of
+     * `input.blur()`.
+     */
+    async doBlur() {
+        this.input?.doBlur();
+    }
+    /**
+     * Clear the input.
+     */
+    async clear() {
+        this.input?.clear();
+    }
+    render() {
+        return (index.h(index.Host, { key: '417fe04aff5d229b3f99595cd464ed1b35a64655' }, index.h("cat-input", { key: 'a240ad76627fcc5013d8e51e0728e0296dbb0e42', class: "cat-time-input", ref: el => (this.input = el), requiredMarker: this.requiredMarker, horizontal: this.horizontal, 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, nativeAttributes: this.nativeAttributes, onCatFocus: e => this.catFocus.emit(e.detail), onCatBlur: e => this.onInputBlur(e.detail) }, index.h("span", { key: 'cf2026f70a32a5df5331b82d1d64cb4695a0b42e', slot: "label" }, this.hasSlottedLabel && index.h("slot", { name: "label" }), !this.hasSlottedLabel && this.label, index.h("span", { key: '46b4a5363823a48d5569f77bcbadbaf0ef93e7b1', class: "label-aria" }, " (HH:mm)")), index.h("div", { key: 'cfad61c399b5b4a487b211976e61c3e33fb37a98', slot: "addon", class: "cat-time-addon" }, this.locale.timeFormat === '12' && (index.h("cat-button", { class: "cat-time-format", disabled: this.disabled || this.readonly, onCatClick: () => this.toggleAm() }, this.isAm ? 'AM' : 'PM')), index.h("cat-dropdown", { key: '2a158234c4cc55920105b326cdf31fbe02fedfb7', slot: "addon", placement: this.placement }, index.h("cat-button", { key: '1aa21b054ef608a4f1e9cc32312a762fa64d8b2d', 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 }), index.h("nav", { key: 'dd604da9f2244c970ca62ca68385cc86d0b98bef', slot: "content", class: "cat-nav" }, index.h("ul", { key: '3c5e331defd7f192c27aab7085f5337a2eaf0fe7' }, this.timeArray().map(time => {
+            const isoTime = this.formatIso(time);
+            const disabled = isBefore(time, this.min ?? null) || isAfter(time, this.max ?? null);
+            return (index.h("li", null, index.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 && (index.h("span", { slot: "hint" }, index.h("slot", { name: "hint" }))))));
+    }
+    timeArray() {
+        const result = [];
+        const start = new Date(2000, 5, 1, 0, 0, 0);
+        let time = new Date(start.getTime());
+        while (time.getDate() === start.getDate()) {
+            result.push(time);
+            time = new Date(time.getTime() + this.step * 60000);
+        }
+        return result;
+    }
+    syncValue(value) {
+        const [, hh, mm] = value.match(/(\d{2}):(\d{2})/)?.map(Number) ?? [];
+        if (hh === undefined || mm === undefined) {
+            this.select(null);
+            return;
+        }
+        this.select(this.locale.timeFormat === '24'
+            ? new Date(2000, 5, 1, hh, mm, 0)
+            : new Date(2000, 5, 1, (hh % 12) + (this.isAm ? 0 : 12), mm, 0));
+    }
+    toggleAm() {
+        if (this.selectionTime) {
+            this.select(new Date(this.selectionTime.getTime() + (this.isAm ? 12 : -12) * 3600000));
+        }
+        else {
+            this.isAm = !this.isAm;
+        }
+    }
+    onInputBlur(e) {
+        this.syncValue(this.input?.value ?? '');
+        this.catBlur.emit(e);
+    }
+    format(date, includeAmPm = true) {
+        const str = date
+            ? new Intl.DateTimeFormat(this.language, {
+                hour: '2-digit',
+                minute: '2-digit'
+            }).format(date)
+            : '';
+        return includeAmPm ? str : str.replace(/\s?(am|pm)/i, '');
+    }
+    formatIso(date) {
+        return `${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}`;
+    }
+    get hostElement() { return index.getElement(this); }
+};
+CatTime.style = CatTimeStyle0;
 
 const catToggleCss = ".hint-wrapper{flex:0 1 auto;display:flex;gap:0.5rem}.hint-section{flex:1 1 auto;display:flex;flex-direction:column;gap:0.25rem;color:rgb(var(--cat-font-color-muted, 81, 92, 108));font-size:0.875rem;line-height:1.125rem}.hint-section .input-hint,.hint-section ::slotted([slot=hint]){margin:0 !important}:host{display:flex;flex-direction:column;gap:0.5rem}:host([hidden]){display:none}label{flex:0 1 auto;display:flex;gap:0.5rem;font-size:0.9375rem;line-height:1.25rem;font-weight:var(--cat-font-weight-body, 400);-webkit-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer}.label-left{flex-direction:row-reverse}input{position:absolute;margin:0;width:2rem;height:1.25rem;opacity:0;cursor:inherit}.toggle-placeholder{width:calc(2rem + 1px);flex-shrink:0}.toggle{flex:0 0 auto;display:flex;align-items:center;justify-content:center;position:relative;width:2rem;height:1.25rem;border-radius:10rem;background-color:rgb(var(--cat-border-color-dark, 215, 219, 224));transition:background-color 125ms ease;pointer-events:none}:checked+.toggle{background-color:rgb(var(--cat-primary-bg, 0, 129, 148))}:focus-visible+.toggle{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:1px}.toggle::after{content:\"\";position:absolute;width:1rem;height:1rem;background:#fff;border-radius:10rem;transform:translateX(calc(2px - 0.5rem));transition:transform 125ms linear;box-shadow:0 1px 2px rgba(27, 31, 38, 0.06), 0 1px 3px rgba(27, 31, 38, 0.1)}:checked+.toggle::after{transform:translateX(calc(-2px + 0.5rem));background:rgb(var(--cat-primary-fill, 255, 255, 255))}.is-disabled .toggle{background-color:rgb(var(--cat-border-color-dark, 215, 219, 224))}:host(.cat-error) .toggle{background-color:rgba(var(--cat-danger-bg, 217, 52, 13), 0.2)}:host(.cat-error) :checked+.toggle{background-color:rgb(var(--cat-danger-bg, 217, 52, 13))}:host(.cat-error) :checked+.toggle::after{background:rgb(var(--cat-danger-fill, 255, 255, 255))}.label{flex:1 1 auto}.is-hidden .label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.is-disabled{cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}";
+const CatToggleStyle0 = catToggleCss;
 
 let nextUniqueId$1 = 0;
 const CatToggle = class {
@@ -10564,7 +12807,7 @@ const CatToggle = class {
         this.hasSlottedLabel = !!this.hostElement.querySelector('[slot="label"]');
         this.hasSlottedHint = !!this.hostElement.querySelector('[slot="hint"]');
         if (!this.label && !this.hasSlottedLabel) {
-            of.loglevel.warn('[A11y] Missing ARIA label on toggle', this);
+            of.log.warn('[A11y] Missing ARIA label on toggle', this);
         }
     }
     /**
@@ -10585,7 +12828,7 @@ const CatToggle = class {
         this.input.blur();
     }
     render() {
-        return (index.h(index.Host, null, index.h("label", { htmlFor: this.id, class: { 'is-hidden': this.labelHidden, 'is-disabled': this.disabled, 'label-left': this.labelLeft } }, index.h("input", { ...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 }), index.h("span", { class: "toggle" }), index.h("span", { class: "label", part: "label" }, (this.hasSlottedLabel && index.h("slot", { name: "label" })) || this.label)), this.hasHint && (index.h("div", { class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, index.h("div", { class: "toggle-placeholder" }), index.h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }) })))));
+        return (index.h(index.Host, { key: '1cc91400d302cd19fa92216ec3fdf45ae869b761' }, index.h("label", { key: '981ac74c7a9aa3324cab60067849e2ffff9d4158', htmlFor: this.id, class: { 'is-hidden': this.labelHidden, 'is-disabled': this.disabled, 'label-left': this.labelLeft } }, index.h("input", { key: 'f4c1a4398f73d2c3da8fd26b360d4a4d94dae3c3', ...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 }), index.h("span", { key: '4a8c4e21fcb48dc3f2260d5abfcf2351fa0eeb13', class: "toggle" }), index.h("span", { key: 'b911ffc5f29252efba3989e494eca1c5ec0fbd54', class: "label", part: "label" }, (this.hasSlottedLabel && index.h("slot", { name: "label" })) || this.label)), this.hasHint && (index.h("div", { class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, index.h("div", { class: "toggle-placeholder" }), index.h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }) })))));
     }
     get hasHint() {
         return !!this.hint || !!this.hasSlottedHint;
@@ -10606,11 +12849,12 @@ const CatToggle = class {
     }
     get hostElement() { return index.getElement(this); }
 };
-CatToggle.style = catToggleCss;
+CatToggle.style = CatToggleStyle0;
 
 const isTouchDevice = 'ontouchstart' in window || navigator.maxTouchPoints > 0;
 
 const catTooltipCss = ":host{display:contents}:host([hidden]){display:none}.tooltip{--cat-font-color-head:var(--cat-font-color-tooltip, 255, 255, 255);--cat-font-color-body:var(--cat-font-color-tooltip, 255, 255, 255);position:fixed;width:max-content;top:0;left:0;box-sizing:border-box;font-size:0.875rem;line-height:1.125rem;font-weight:500;background-color:rgb(var(--cat-bg-tooltip, 0, 0, 0));border-radius:var(--cat-border-radius-m, 0.25rem);color:rgb(var(--cat-font-color-tooltip, 255, 255, 255));transition:opacity 250ms linear, visibility 250ms linear;visibility:hidden;opacity:0;box-shadow:rgba(0, 0, 0, 0.08) 0 1px 8px 0;z-index:calc(var(--cat-z-index, 1000) + 200);max-width:min(100vw - 0.5rem, 20rem)}.tooltip-hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.tooltip-show{opacity:1;visibility:visible}.tooltip p{margin:0}.tooltip-round{border-radius:10rem}.tooltip-s{padding:0.375rem 0.5rem}.tooltip-s.tooltip-round{padding:0.375rem 0.75rem}.tooltip-m{padding:0.75rem}.tooltip-m.tooltip-round{padding:0.75rem 1rem}.tooltip-l{padding:1rem}.tooltip-l.tooltip-round{padding:1rem 1.5rem}";
+const CatTooltipStyle0 = catTooltipCss;
 
 let nextUniqueId = 0;
 const CatTooltip = class {
@@ -10671,12 +12915,12 @@ const CatTooltip = class {
         }
     }
     render() {
-        return (index.h(index.Host, null, index.h("slot", null), index.h("div", { ref: el => (this.tooltip = el), id: this.id, role: "tooltip", "aria-hidden": !this.open, "aria-live": this.open ? 'polite' : 'off', class: {
+        return (index.h(index.Host, { key: 'f1bfba8c8ce1a2d43959b18b00627af819536428' }, index.h("slot", { key: '0366fe88ce8bd0382beed9c298dbd945cad70bec' }), index.h("div", { key: 'dd9f7cd786780cd64e3fa2670f516eda71d15351', 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)
-            } }, index.h("slot", { name: "content" }, index.h("p", null, this.content)))));
+            } }, index.h("slot", { key: '2a6f92d2cfc845849730792f08e65ffb70c03e5f', name: "content" }, index.h("p", { key: '23b8d57bcb92506d5c88a59261716158b0daa0ba' }, this.content)))));
     }
     async update() {
         if (this.trigger && this.tooltip) {
@@ -10754,7 +12998,7 @@ const CatTooltip = class {
 };
 CatTooltip.OFFSET = 4;
 CatTooltip.SHIFT_PADDING = 4;
-CatTooltip.style = catTooltipCss;
+CatTooltip.style = CatTooltipStyle0;
 
 exports.cat_alert = CatAlert;
 exports.cat_avatar = CatAvatar;
@@ -10763,6 +13007,7 @@ exports.cat_button = CatButton;
 exports.cat_button_group = CatButtonGroup;
 exports.cat_card = CatCard;
 exports.cat_checkbox = CatCheckbox;
+exports.cat_date = CatDate;
 exports.cat_datepicker = CatDatepickerFlat;
 exports.cat_datepicker_inline = CatDatepickerInline;
 exports.cat_dropdown = CatDropdown;
@@ -10780,7 +13025,8 @@ exports.cat_spinner = CatSpinner;
 exports.cat_tab = CatTab;
 exports.cat_tabs = CatTabs;
 exports.cat_textarea = CatTextarea;
+exports.cat_time = CatTime;
 exports.cat_toggle = CatToggle;
 exports.cat_tooltip = CatTooltip;
 
-//# sourceMappingURL=cat-alert_26.cjs.entry.js.map
+//# sourceMappingURL=cat-alert_28.cjs.entry.js.map