@haiilo/catalyst 0.2.1 → 0.3.1

package/dist/cjs/{cat-alert_7.cjs.entry.js → cat-alert_8.cjs.entry.js}

@@ -2,32 +2,33 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const catIconRegistry = require('./cat-icon-registry-909e38e7.js');
+const index = require('./index-c0881ae0.js');
+const catIconRegistry = require('./cat-icon-registry-850c538c.js');
 
 const catAlertCss = ":host{display:block;margin-bottom:1rem}:host([hidden]){display:none}.cat-alert{font:inherit;color:rgb(var(--text));background-color:rgba(var(--bg), 0.1);box-shadow:inset 0 0 0 1px rgba(var(--border), 0.2);border-radius:0.25rem;padding:0.75rem 1rem;width:100%}::slotted(:last-child){margin-bottom:0 !important}.cat-alert-primary{--bg:var(--cat-primary-bg, 32, 127, 138);--text:var(--cat-primary-text, 32, 127, 138);--border:var(--cat-primary-text, 32, 127, 138)}.cat-alert-secondary{--bg:105, 118, 135;--text:0, 0, 0;--border:105, 118, 135}.cat-alert-success{--bg:0, 132, 88;--text:0, 132, 88;--border:0, 132, 88}.cat-alert-warning{--bg:255, 206, 128;--text:159, 97, 0;--border:159, 97, 0}.cat-alert-danger{--bg:217, 52, 13;--text:217, 52, 13;--border:217, 52, 13}";
 
 const CatAlert = class {
   constructor(hostRef) {
-    catIconRegistry.registerInstance(this, hostRef);
+    index.registerInstance(this, hostRef);
     /**
      * The color palette of the alert.
      */
     this.color = 'primary';
   }
   render() {
-    return (catIconRegistry.h("div", { part: "alert", class: {
+    return (index.h("div", { part: "alert", class: {
         'cat-alert': true,
         [`cat-alert-${this.color}`]: Boolean(this.color)
-      } }, catIconRegistry.h("slot", null)));
+      } }, index.h("slot", null)));
   }
 };
 CatAlert.style = catAlertCss;
 
-const catBadgeCss = ":host{display:inline-flex;max-width:100%;vertical-align:baseline}:host([hidden]){display:none}.cat-badge{font:inherit;flex:1 1 auto;display:inline-flex;align-items:center;justify-content:center;border-radius:0.125rem;text-decoration:none;width:100%;box-sizing:border-box;line-height:1;white-space:nowrap}.cat-badge slot{display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.cat-badge-round{border-radius:10rem}.cat-badge-filled{background-color:rgb(var(--bg));color:rgb(var(--fill));font-weight:600;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:greyscale}.cat-badge-outlined{background-color:white;box-shadow:inset 0 0 0 1px rgba(var(--border), 0.2);color:rgb(var(--text))}.cat-badge-primary{--bg:var(--cat-primary-bg, 32, 127, 138);--fill:var(--cat-primary-fill, 255, 255, 255);--text:var(--cat-primary-text, 32, 127, 138);--border:var(--cat-primary-text, 32, 127, 138)}.cat-badge-secondary{--bg:105, 118, 135;--fill:255, 255, 255;--text:0, 0, 0;--border:105, 118, 135}.cat-badge-success{--bg:0, 132, 88;--fill:255, 255, 255;--text:0, 132, 88;--border:0, 132, 88}.cat-badge-warning{--bg:255, 206, 128;--fill:0, 0, 0;--text:159, 97, 0;--border:159, 97, 0}.cat-badge-danger{--bg:217, 52, 13;--fill:255, 255, 255;--text:217, 52, 13;--border:217, 52, 13}.cat-badge-xs{height:0.75rem;min-width:0.75rem;font-size:0.75rem;padding:0 0.1875rem}.cat-badge-s{height:1rem;min-width:1rem;font-size:0.75rem;padding:0 0.25rem}.cat-badge-m{height:1.25rem;min-width:1.25rem;font-size:0.75rem;padding:0 0.3125rem}.cat-badge-l{height:1.5rem;min-width:1.5rem;font-size:0.875rem;padding:0 0.375rem}.cat-badge-xl{height:1.75rem;min-width:1.75rem;font-size:0.9375rem;padding:0 0.4375rem}.cat-badge-pulse.cat-badge-filled{animation:1.5s ease 0s infinite normal none running pulse}.cat-badge-pulse.cat-badge-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 0px 0px 0px 0.5rem}100%{box-shadow:transparent 0px 0px 0px 0px}}@keyframes pulse-outlined{0%{box-shadow:0 0 0 0 rgb(var(--bg)), inset 0 0 0 1px rgba(var(--border), 0.2)}70%{box-shadow:transparent 0px 0px 0px 0.5rem, inset 0 0 0 1px rgba(var(--border), 0.2)}100%{box-shadow:transparent 0px 0px 0px 0px, inset 0 0 0 1px rgba(var(--border), 0.2)}}";
+const catBadgeCss = ":host{display:inline-flex;max-width:100%;vertical-align:baseline}:host([hidden]){display:none}.cat-badge{font:inherit;flex:1 1 auto;display:inline-flex;align-items:center;justify-content:center;border-radius:0.125rem;text-decoration:none;width:100%;box-sizing:border-box;line-height:1;white-space:nowrap}.cat-badge slot{display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.cat-badge-round{border-radius:10rem}.cat-badge-filled{background-color:rgb(var(--bg));color:rgb(var(--fill));font-weight:600;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:greyscale}.cat-badge-outlined{background-color:white;box-shadow:inset 0 0 0 1px rgba(var(--border), 0.2);color:rgb(var(--text))}.cat-badge-primary{--bg:var(--cat-primary-bg, 32, 127, 138);--fill:var(--cat-primary-fill, 255, 255, 255);--text:var(--cat-primary-text, 32, 127, 138);--border:var(--cat-primary-text, 32, 127, 138)}.cat-badge-secondary{--bg:105, 118, 135;--fill:255, 255, 255;--text:0, 0, 0;--border:105, 118, 135}.cat-badge-success{--bg:0, 132, 88;--fill:255, 255, 255;--text:0, 132, 88;--border:0, 132, 88}.cat-badge-warning{--bg:255, 206, 128;--fill:0, 0, 0;--text:159, 97, 0;--border:159, 97, 0}.cat-badge-danger{--bg:217, 52, 13;--fill:255, 255, 255;--text:217, 52, 13;--border:217, 52, 13}.cat-badge-xs{height:0.75rem;min-width:0.75rem;font-size:0.75rem;padding:0 0.1875rem}.cat-badge-s{height:1rem;min-width:1rem;font-size:0.75rem;padding:0 0.25rem}.cat-badge-m{height:1.25rem;min-width:1.25rem;font-size:0.75rem;padding:0 0.3125rem}.cat-badge-l{height:1.5rem;min-width:1.5rem;font-size:0.875rem;padding:0 0.375rem}.cat-badge-xl{height:1.75rem;min-width:1.75rem;font-size:0.9375rem;padding:0 0.4375rem}.cat-badge-pulse.cat-badge-filled{animation:1.5s ease 0s infinite normal none running pulse}.cat-badge-pulse.cat-badge-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(--border), 0.2)}70%{box-shadow:transparent 0 0 0 0.5rem, inset 0 0 0 1px rgba(var(--border), 0.2)}100%{box-shadow:transparent 0 0 0 0, inset 0 0 0 1px rgba(var(--border), 0.2)}}";
 
 const CatBadge = class {
   constructor(hostRef) {
-    catIconRegistry.registerInstance(this, hostRef);
+    index.registerInstance(this, hostRef);
     /**
      * The rendering style of the badge.
      */
@@ -50,14 +51,14 @@ const CatBadge = class {
     this.pulse = false;
   }
   render() {
-    return (catIconRegistry.h("span", { part: "badge", class: {
+    return (index.h("span", { part: "badge", class: {
         'cat-badge': true,
         'cat-badge-round': this.round,
         'cat-badge-pulse': this.pulse,
         [`cat-badge-${this.variant}`]: Boolean(this.variant),
         [`cat-badge-${this.color}`]: Boolean(this.color),
         [`cat-badge-${this.size}`]: Boolean(this.size)
-      } }, catIconRegistry.h("slot", null)));
+      } }, index.h("slot", null)));
   }
 };
 CatBadge.style = catBadgeCss;
@@ -489,14 +490,14 @@ function createEmptyStyleRule(query) {
   }
 }
 
-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{font:inherit;display:flex;align-items:center;justify-content:center;border:none;border-radius:0.25rem;text-decoration:none;width:100%;box-sizing:border-box;cursor:pointer;transition:color 0.13s linear, border-color 0.13s linear, background-color 0.13s linear, box-shadow 0.13s linear}.cat-button:focus-visible{outline:2px solid #0071ff;outline-offset:1px}.cat-button-content{flex:1 1 auto;text-align:center}.cat-button-ellipsed .cat-button-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.cat-button-disabled{cursor:not-allowed;opacity:0.65;filter:grayscale(100%)}.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-button-filled{background-color:rgb(var(--bg));color:rgb(var(--fill));font-weight:600;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:greyscale}.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:hover:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.05)}.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:none}.cat-button-text:hover:not(.cat-button-disabled):not(.cat-button-loading){text-decoration:underline}.cat-button-primary{--bg:var(--cat-primary-bg, 32, 127, 138);--fill:var(--cat-primary-fill, 255, 255, 255);--text:var(--cat-primary-text, 32, 127, 138);--base:var(--cat-primary-text, 32, 127, 138)}.cat-button-primary:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-primary-bg-hover, 28, 112, 122);--fill:var(--cat-primary-fill-hover, 255, 255, 255);--text:var(--cat-primary-text-hover, 28, 112, 122)}.cat-button-primary:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-primary-bg-active, 25, 101, 110);--fill:var(--cat-primary-fill-active, 255, 255, 255);--text:var(--cat-primary-text-active, 25, 101, 110)}.cat-button-secondary{--bg:105, 118, 135;--fill:255, 255, 255;--text:0, 0, 0;--base:105, 118, 135}.cat-button-secondary:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:105, 118, 135;--fill:255, 255, 255;--text:0, 0, 0}.cat-button-secondary:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:105, 118, 135;--fill:255, 255, 255;--text:0, 0, 0}.cat-button-success{--bg:0, 132, 88;--fill:255, 255, 255;--text:0, 132, 88;--base:0, 132, 88}.cat-button-success:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:0, 117, 78;--fill:255, 255, 255;--text:0, 117, 78}.cat-button-success:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:0, 105, 70;--fill:255, 255, 255;--text:0, 105, 70}.cat-button-warning{--bg:255, 206, 128;--fill:0, 0, 0;--text:159, 97, 0;--base:159, 97, 0}.cat-button-warning:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:255, 214, 148;--fill:0, 0, 0;--text:159, 97, 0}.cat-button-warning:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:255, 222, 168;--fill:0, 0, 0;--text:159, 97, 0}.cat-button-danger{--bg:217, 52, 13;--fill:255, 255, 255;--text:217, 52, 13;--base:217, 52, 13}.cat-button-danger:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:194, 46, 11;--fill:255, 255, 255;--text:194, 46, 11}.cat-button-danger:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:174, 42, 10;--fill:255, 255, 255;--text:174, 42, 10}.cat-button-xs{min-width:1.5rem;padding:0.25rem 0.25rem;font-size:0.875rem;line-height:1rem}.cat-button-xs .cat-button-prefix{margin-right:0.25rem}.cat-button-xs .cat-button-suffix{margin-left:0.25rem}.cat-button-xs.cat-button-icon{width:1.5rem;padding-left:0;padding-right:0}:host-context(nav) .cat-button-xs{padding-left:1rem;padding-right:1rem}.cat-button-s{min-width:2rem;padding:0.375rem 0.5rem;font-size:0.9375rem;line-height:1.25rem}.cat-button-s .cat-button-prefix{margin-right:0.25rem}.cat-button-s .cat-button-suffix{margin-left:0.25rem}.cat-button-s cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-s.cat-button-icon{width:2rem;padding-left:0;padding-right:0}:host-context(nav) .cat-button-s{padding-left:1rem;padding-right:1rem}.cat-button-m{min-width:2.5rem;padding:0.625rem 0.75rem;font-size:0.9375rem;line-height:1.25rem}.cat-button-m .cat-button-prefix{margin-right:0.25rem}.cat-button-m .cat-button-suffix{margin-left:0.25rem}.cat-button-m cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-m.cat-button-icon{width:2.5rem;padding-left:0;padding-right:0}:host-context(nav) .cat-button-m{padding-left:1rem;padding-right:1rem}.cat-button-l{min-width:3rem;padding:0.875rem 1rem;font-size:0.9375rem;line-height:1.25rem}.cat-button-l .cat-button-prefix{margin-right:0.25rem}.cat-button-l .cat-button-suffix{margin-left:0.25rem}.cat-button-l cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-l.cat-button-icon{width:3rem;padding-left:0;padding-right:0}:host-context(nav) .cat-button-l{padding-left:1rem;padding-right:1rem}.cat-button-xl{min-width:3.5rem;padding:1rem 1.25rem;font-size:1.125rem;line-height:1.5rem}.cat-button-xl .cat-button-prefix{margin-right:0.25rem}.cat-button-xl .cat-button-suffix{margin-left:0.25rem}.cat-button-xl.cat-button-icon{width:3.5rem;padding-left:0;padding-right:0}:host-context(nav) .cat-button-xl{padding-left:1rem;padding-right:1rem}:host-context(nav){width:100%}:host-context(nav) .cat-button{box-shadow:none;border-radius:0}:host-context(nav) .cat-button:focus-visible{outline-offset:-2px}:host-context(nav) .cat-button-content{text-align:left}";
+const catButtonCss = ":host{display:inline-block;max-width:100%;vertical-align:middle;-webkit-user-select:none;-ms-user-select:none;user-select:none;}.cat-button{font:inherit;display:flex;align-items:center;justify-content:center;border:none;border-radius:0.25rem;text-decoration:none;width:100%;box-sizing:border-box;cursor:pointer;transition:color 0.13s linear, border-color 0.13s linear, background-color 0.13s linear, box-shadow 0.13s linear}.cat-button:focus-visible{outline:2px solid #0071ff;outline-offset:1px}.cat-button-ellipsed .cat-button-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.cat-button-disabled{cursor:not-allowed;opacity:0.65;filter:grayscale(100%)}.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-button-filled{background-color:rgb(var(--bg));color:rgb(var(--fill));font-weight:600;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:greyscale}.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:hover:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.05)}.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:none}.cat-button-text:hover:not(.cat-button-disabled):not(.cat-button-loading){text-decoration:underline}.cat-button-primary{--bg:var(--cat-primary-bg, 32, 127, 138);--fill:var(--cat-primary-fill, 255, 255, 255);--text:var(--cat-primary-text, 32, 127, 138);--base:var(--cat-primary-text, 32, 127, 138)}.cat-button-primary:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-primary-bg-hover, 28, 112, 122);--fill:var(--cat-primary-fill-hover, 255, 255, 255);--text:var(--cat-primary-text-hover, 28, 112, 122)}.cat-button-primary:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-primary-bg-active, 25, 101, 110);--fill:var(--cat-primary-fill-active, 255, 255, 255);--text:var(--cat-primary-text-active, 25, 101, 110)}.cat-button-secondary{--bg:105, 118, 135;--fill:255, 255, 255;--text:0, 0, 0;--base:105, 118, 135}.cat-button-secondary:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:105, 118, 135;--fill:255, 255, 255;--text:0, 0, 0}.cat-button-secondary:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:105, 118, 135;--fill:255, 255, 255;--text:0, 0, 0}.cat-button-success{--bg:0, 132, 88;--fill:255, 255, 255;--text:0, 132, 88;--base:0, 132, 88}.cat-button-success:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:0, 117, 78;--fill:255, 255, 255;--text:0, 117, 78}.cat-button-success:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:0, 105, 70;--fill:255, 255, 255;--text:0, 105, 70}.cat-button-warning{--bg:255, 206, 128;--fill:0, 0, 0;--text:159, 97, 0;--base:159, 97, 0}.cat-button-warning:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:255, 214, 148;--fill:0, 0, 0;--text:159, 97, 0}.cat-button-warning:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:255, 222, 168;--fill:0, 0, 0;--text:159, 97, 0}.cat-button-danger{--bg:217, 52, 13;--fill:255, 255, 255;--text:217, 52, 13;--base:217, 52, 13}.cat-button-danger:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:194, 46, 11;--fill:255, 255, 255;--text:194, 46, 11}.cat-button-danger:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:174, 42, 10;--fill:255, 255, 255;--text:174, 42, 10}.cat-button-xs{min-width:1.5rem;padding:0.25rem 0.25rem;font-size:0.875rem;line-height:1rem}.cat-button-xs .cat-button-prefix{margin-right:0.25rem}.cat-button-xs .cat-button-suffix{margin-left:0.25rem}.cat-button-xs.cat-button-icon{width:1.5rem;padding-left:0;padding-right:0}:host-context(nav) .cat-button-xs{padding-left:1rem;padding-right:1rem}.cat-button-s{min-width:2rem;padding:0.375rem 0.5rem;font-size:0.9375rem;line-height:1.25rem}.cat-button-s .cat-button-prefix{margin-right:0.25rem}.cat-button-s .cat-button-suffix{margin-left:0.25rem}.cat-button-s cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-s.cat-button-icon{width:2rem;padding-left:0;padding-right:0}:host-context(nav) .cat-button-s{padding-left:1rem;padding-right:1rem}.cat-button-m{min-width:2.5rem;padding:0.625rem 0.75rem;font-size:0.9375rem;line-height:1.25rem}.cat-button-m .cat-button-prefix{margin-right:0.25rem}.cat-button-m .cat-button-suffix{margin-left:0.25rem}.cat-button-m cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-m.cat-button-icon{width:2.5rem;padding-left:0;padding-right:0}:host-context(nav) .cat-button-m{padding-left:1rem;padding-right:1rem}.cat-button-l{min-width:3rem;padding:0.875rem 1rem;font-size:0.9375rem;line-height:1.25rem}.cat-button-l .cat-button-prefix{margin-right:0.25rem}.cat-button-l .cat-button-suffix{margin-left:0.25rem}.cat-button-l cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-l.cat-button-icon{width:3rem;padding-left:0;padding-right:0}:host-context(nav) .cat-button-l{padding-left:1rem;padding-right:1rem}.cat-button-xl{min-width:3.5rem;padding:1rem 1.25rem;font-size:1.125rem;line-height:1.5rem}.cat-button-xl .cat-button-prefix{margin-right:0.25rem}.cat-button-xl .cat-button-suffix{margin-left:0.25rem}.cat-button-xl.cat-button-icon{width:3.5rem;padding-left:0;padding-right:0}:host-context(nav) .cat-button-xl{padding-left:1rem;padding-right:1rem}:host-context(nav){width:100%}:host-context(nav) .cat-button{box-shadow:none;border-radius:0}:host-context(nav) .cat-button:focus-visible{outline-offset:-2px}:host-context(nav) .cat-button-content{text-align:left}:host([hidden]){display:none}:host(.cat-text-left) .cat-button{justify-content:left}:host(.cat-text-right) .cat-button{justify-content:right}";
 
 const CatButton = class {
   constructor(hostRef) {
-    catIconRegistry.registerInstance(this, hostRef);
-    this.catClick = catIconRegistry.createEvent(this, "catClick", 7);
-    this.catFocus = catIconRegistry.createEvent(this, "catFocus", 7);
-    this.catBlur = catIconRegistry.createEvent(this, "catBlur", 7);
+    index.registerInstance(this, hostRef);
+    this.catClick = index.createEvent(this, "catClick", 7);
+    this.catFocus = index.createEvent(this, "catFocus", 7);
+    this.catBlur = index.createEvent(this, "catBlur", 7);
     this._iconOnly = true;
     /**
      * The rendering style of the button.
@@ -587,7 +588,7 @@ const CatButton = class {
   render() {
     var _a;
     if (this.url) {
-      return (catIconRegistry.h("a", { ref: el => (this.button = el), href: this.disabled ? undefined : this.url, target: this.urlTarget, "aria-disabled": this.disabled ? 'true' : null, "aria-label": this.a11yLabel, id: this.buttonId, part: "button", class: {
+      return (index.h("a", { ref: el => (this.button = el), href: this.disabled ? undefined : this.url, target: this.urlTarget, "aria-disabled": this.disabled ? 'true' : null, "aria-label": this.a11yLabel, id: this.buttonId, part: "button", class: {
           'cat-button': true,
           'cat-button-icon': this.isIconButton,
           'cat-button-round': this.round,
@@ -600,7 +601,7 @@ const CatButton = class {
         }, onClick: this.onClick.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this) }, this.content));
     }
     else {
-      return (catIconRegistry.h("button", { ref: el => (this.button = el), type: this.submit ? 'submit' : 'button', name: this.name, value: this.value, disabled: this.disabled, "aria-disabled": this.disabled ? 'true' : null, "aria-label": this.a11yLabel, id: this.buttonId, part: "button", class: {
+      return (index.h("button", { ref: el => (this.button = el), type: this.submit ? 'submit' : 'button', name: this.name, value: this.value, disabled: this.disabled, "aria-disabled": this.disabled ? 'true' : null, "aria-label": this.a11yLabel, id: this.buttonId, part: "button", class: {
           'cat-button': true,
           'cat-button-icon': this.isIconButton,
           'cat-button-round': (_a = this.round) !== null && _a !== void 0 ? _a : this.isIconButton,
@@ -640,10 +641,10 @@ const CatButton = class {
   }
   get content() {
     return [
-      this.hasPrefixIcon ? (catIconRegistry.h("cat-icon", { icon: this.icon, size: this.iconSize, class: "cat-button-prefix", part: "prefix" })) : null,
-      this.isIconButton ? (catIconRegistry.h("cat-icon", { icon: this.icon, size: this.iconSize })) : (catIconRegistry.h("span", { class: "cat-button-content", part: "content" }, catIconRegistry.h("slot", null))),
-      this.hasSuffixIcon ? (catIconRegistry.h("cat-icon", { icon: this.icon, size: this.iconSize, class: "cat-button-suffix", part: "suffix" })) : null,
-      this.loading ? catIconRegistry.h("cat-spinner", { size: this.spinnerSize }) : null
+      this.hasPrefixIcon ? (index.h("cat-icon", { icon: this.icon, size: this.iconSize, class: "cat-button-prefix", part: "prefix" })) : null,
+      this.isIconButton ? (index.h("cat-icon", { icon: this.icon, size: this.iconSize })) : (index.h("span", { class: "cat-button-content", part: "content" }, index.h("slot", null))),
+      this.hasSuffixIcon ? (index.h("cat-icon", { icon: this.icon, size: this.iconSize, class: "cat-button-suffix", part: "suffix" })) : null,
+      this.loading ? index.h("cat-spinner", { size: this.spinnerSize }) : null
     ];
   }
   onClick(event) {
@@ -665,7 +666,7 @@ const catIconCss = ":host{display:inline-flex;vertical-align:middle;-webkit-user
 
 const CatIcon = class {
   constructor(hostRef) {
-    catIconRegistry.registerInstance(this, hostRef);
+    index.registerInstance(this, hostRef);
     this.iconRegistry = catIconRegistry.CatIconRegistry.getInstance();
     /**
      * The name of the icon.
@@ -677,7 +678,7 @@ const CatIcon = class {
     this.size = 'm';
   }
   render() {
-    return (catIconRegistry.h("span", { innerHTML: this.iconRegistry.getIcon(this.icon), "aria-label": this.a11yLabel, "aria-hidden": this.a11yLabel ? null : 'true', part: "icon", class: {
+    return (index.h("span", { innerHTML: this.iconRegistry.getIcon(this.icon), "aria-label": this.a11yLabel, "aria-hidden": this.a11yLabel ? null : 'true', part: "icon", class: {
         [`cat-icon-${this.size}`]: this.size !== 'inline'
       } }));
   }
@@ -1069,9 +1070,9 @@ const flip = function (options) {
         switch (fallbackStrategy) {
           case 'bestFit':
             {
-              var _overflowsData$slice$;
+              var _overflowsData$map$so;
 
-              const placement = (_overflowsData$slice$ = overflowsData.slice().sort((a, b) => a.overflows.filter(overflow => overflow > 0).reduce((acc, overflow) => acc + overflow, 0) - b.overflows.filter(overflow => overflow > 0).reduce((acc, overflow) => acc + overflow, 0))[0]) == null ? void 0 : _overflowsData$slice$.placement;
+              const placement = (_overflowsData$map$so = overflowsData.map(d => [d, d.overflows.filter(overflow => overflow > 0).reduce((acc, overflow) => acc + overflow, 0)]).sort((a, b) => a[1] - b[1])[0]) == null ? void 0 : _overflowsData$map$so[0].placement;
 
               if (placement) {
                 resetPlacement = placement;
@@ -1112,14 +1113,13 @@ function convertValueToCoords(placement, rects, value, rtl) {
   const crossAxisMulti = rtl && isVertical ? -1 : 1;
   const rawValue = typeof value === 'function' ? value({ ...rects,
     placement
-  }) : value;
-  const isNumber = typeof rawValue === 'number'; // eslint-disable-next-line prefer-const
+  }) : value; // eslint-disable-next-line prefer-const
 
   let {
     mainAxis,
     crossAxis,
     alignmentAxis
-  } = isNumber ? {
+  } = typeof rawValue === 'number' ? {
     mainAxis: rawValue,
     crossAxis: 0,
     alignmentAxis: null
@@ -2937,9 +2937,9 @@ const catMenuCss = ":host{display:inline-block}:host([hidden]){display:none}.con
 let nextUniqueId = 0;
 const CatMenu = class {
   constructor(hostRef) {
-    catIconRegistry.registerInstance(this, hostRef);
-    this.catOpen = catIconRegistry.createEvent(this, "catOpen", 7);
-    this.catClose = catIconRegistry.createEvent(this, "catClose", 7);
+    index.registerInstance(this, hostRef);
+    this.catOpen = index.createEvent(this, "catOpen", 7);
+    this.catClose = index.createEvent(this, "catClose", 7);
     this.id = nextUniqueId++;
     /**
      * The placement of the menu.
@@ -2984,7 +2984,7 @@ const CatMenu = class {
     }
   }
   render() {
-    return (catIconRegistry.h(catIconRegistry.Host, null, catIconRegistry.h("slot", { name: "trigger", ref: el => (this.triggerSlot = el) }), catIconRegistry.h("div", { class: "content", ref: el => (this.content = el) }, catIconRegistry.h("slot", { name: "content" }))));
+    return (index.h(index.Host, null, index.h("slot", { name: "trigger", ref: el => (this.triggerSlot = el) }), index.h("div", { class: "content", ref: el => (this.content = el) }, index.h("slot", { name: "content" }))));
   }
   get contentId() {
     return `cat-menu-${this.id}`;
@@ -3038,11 +3038,1343 @@ const CatMenu = class {
 CatMenu.OFFSET = 4;
 CatMenu.style = catMenuCss;
 
+function isFunction(value) {
+    return typeof value === 'function';
+}
+
+function createErrorClass(createImpl) {
+    const _super = (instance) => {
+        Error.call(instance);
+        instance.stack = new Error().stack;
+    };
+    const ctorFunc = createImpl(_super);
+    ctorFunc.prototype = Object.create(Error.prototype);
+    ctorFunc.prototype.constructor = ctorFunc;
+    return ctorFunc;
+}
+
+const UnsubscriptionError = createErrorClass((_super) => function UnsubscriptionErrorImpl(errors) {
+    _super(this);
+    this.message = errors
+        ? `${errors.length} errors occurred during unsubscription:
+${errors.map((err, i) => `${i + 1}) ${err.toString()}`).join('\n  ')}`
+        : '';
+    this.name = 'UnsubscriptionError';
+    this.errors = errors;
+});
+
+function arrRemove(arr, item) {
+    if (arr) {
+        const index = arr.indexOf(item);
+        0 <= index && arr.splice(index, 1);
+    }
+}
+
+class Subscription {
+    constructor(initialTeardown) {
+        this.initialTeardown = initialTeardown;
+        this.closed = false;
+        this._parentage = null;
+        this._finalizers = null;
+    }
+    unsubscribe() {
+        let errors;
+        if (!this.closed) {
+            this.closed = true;
+            const { _parentage } = this;
+            if (_parentage) {
+                this._parentage = null;
+                if (Array.isArray(_parentage)) {
+                    for (const parent of _parentage) {
+                        parent.remove(this);
+                    }
+                }
+                else {
+                    _parentage.remove(this);
+                }
+            }
+            const { initialTeardown: initialFinalizer } = this;
+            if (isFunction(initialFinalizer)) {
+                try {
+                    initialFinalizer();
+                }
+                catch (e) {
+                    errors = e instanceof UnsubscriptionError ? e.errors : [e];
+                }
+            }
+            const { _finalizers } = this;
+            if (_finalizers) {
+                this._finalizers = null;
+                for (const finalizer of _finalizers) {
+                    try {
+                        execFinalizer(finalizer);
+                    }
+                    catch (err) {
+                        errors = errors !== null && errors !== void 0 ? errors : [];
+                        if (err instanceof UnsubscriptionError) {
+                            errors = [...errors, ...err.errors];
+                        }
+                        else {
+                            errors.push(err);
+                        }
+                    }
+                }
+            }
+            if (errors) {
+                throw new UnsubscriptionError(errors);
+            }
+        }
+    }
+    add(teardown) {
+        var _a;
+        if (teardown && teardown !== this) {
+            if (this.closed) {
+                execFinalizer(teardown);
+            }
+            else {
+                if (teardown instanceof Subscription) {
+                    if (teardown.closed || teardown._hasParent(this)) {
+                        return;
+                    }
+                    teardown._addParent(this);
+                }
+                (this._finalizers = (_a = this._finalizers) !== null && _a !== void 0 ? _a : []).push(teardown);
+            }
+        }
+    }
+    _hasParent(parent) {
+        const { _parentage } = this;
+        return _parentage === parent || (Array.isArray(_parentage) && _parentage.includes(parent));
+    }
+    _addParent(parent) {
+        const { _parentage } = this;
+        this._parentage = Array.isArray(_parentage) ? (_parentage.push(parent), _parentage) : _parentage ? [_parentage, parent] : parent;
+    }
+    _removeParent(parent) {
+        const { _parentage } = this;
+        if (_parentage === parent) {
+            this._parentage = null;
+        }
+        else if (Array.isArray(_parentage)) {
+            arrRemove(_parentage, parent);
+        }
+    }
+    remove(teardown) {
+        const { _finalizers } = this;
+        _finalizers && arrRemove(_finalizers, teardown);
+        if (teardown instanceof Subscription) {
+            teardown._removeParent(this);
+        }
+    }
+}
+Subscription.EMPTY = (() => {
+    const empty = new Subscription();
+    empty.closed = true;
+    return empty;
+})();
+const EMPTY_SUBSCRIPTION = Subscription.EMPTY;
+function isSubscription(value) {
+    return (value instanceof Subscription ||
+        (value && 'closed' in value && isFunction(value.remove) && isFunction(value.add) && isFunction(value.unsubscribe)));
+}
+function execFinalizer(finalizer) {
+    if (isFunction(finalizer)) {
+        finalizer();
+    }
+    else {
+        finalizer.unsubscribe();
+    }
+}
+
+const config = {
+    onUnhandledError: null,
+    onStoppedNotification: null,
+    Promise: undefined,
+    useDeprecatedSynchronousErrorHandling: false,
+    useDeprecatedNextContext: false,
+};
+
+const timeoutProvider = {
+    setTimeout(handler, timeout, ...args) {
+        const { delegate } = timeoutProvider;
+        if (delegate === null || delegate === void 0 ? void 0 : delegate.setTimeout) {
+            return delegate.setTimeout(handler, timeout, ...args);
+        }
+        return setTimeout(handler, timeout, ...args);
+    },
+    clearTimeout(handle) {
+        const { delegate } = timeoutProvider;
+        return ((delegate === null || delegate === void 0 ? void 0 : delegate.clearTimeout) || clearTimeout)(handle);
+    },
+    delegate: undefined,
+};
+
+function reportUnhandledError(err) {
+    timeoutProvider.setTimeout(() => {
+        const { onUnhandledError } = config;
+        if (onUnhandledError) {
+            onUnhandledError(err);
+        }
+        else {
+            throw err;
+        }
+    });
+}
+
+function noop() { }
+
+const COMPLETE_NOTIFICATION = (() => createNotification('C', undefined, undefined))();
+function errorNotification(error) {
+    return createNotification('E', undefined, error);
+}
+function nextNotification(value) {
+    return createNotification('N', value, undefined);
+}
+function createNotification(kind, value, error) {
+    return {
+        kind,
+        value,
+        error,
+    };
+}
+
+function errorContext(cb) {
+    {
+        cb();
+    }
+}
+
+class Subscriber extends Subscription {
+    constructor(destination) {
+        super();
+        this.isStopped = false;
+        if (destination) {
+            this.destination = destination;
+            if (isSubscription(destination)) {
+                destination.add(this);
+            }
+        }
+        else {
+            this.destination = EMPTY_OBSERVER;
+        }
+    }
+    static create(next, error, complete) {
+        return new SafeSubscriber(next, error, complete);
+    }
+    next(value) {
+        if (this.isStopped) {
+            handleStoppedNotification(nextNotification(value), this);
+        }
+        else {
+            this._next(value);
+        }
+    }
+    error(err) {
+        if (this.isStopped) {
+            handleStoppedNotification(errorNotification(err), this);
+        }
+        else {
+            this.isStopped = true;
+            this._error(err);
+        }
+    }
+    complete() {
+        if (this.isStopped) {
+            handleStoppedNotification(COMPLETE_NOTIFICATION, this);
+        }
+        else {
+            this.isStopped = true;
+            this._complete();
+        }
+    }
+    unsubscribe() {
+        if (!this.closed) {
+            this.isStopped = true;
+            super.unsubscribe();
+            this.destination = null;
+        }
+    }
+    _next(value) {
+        this.destination.next(value);
+    }
+    _error(err) {
+        try {
+            this.destination.error(err);
+        }
+        finally {
+            this.unsubscribe();
+        }
+    }
+    _complete() {
+        try {
+            this.destination.complete();
+        }
+        finally {
+            this.unsubscribe();
+        }
+    }
+}
+const _bind = Function.prototype.bind;
+function bind(fn, thisArg) {
+    return _bind.call(fn, thisArg);
+}
+class ConsumerObserver {
+    constructor(partialObserver) {
+        this.partialObserver = partialObserver;
+    }
+    next(value) {
+        const { partialObserver } = this;
+        if (partialObserver.next) {
+            try {
+                partialObserver.next(value);
+            }
+            catch (error) {
+                handleUnhandledError(error);
+            }
+        }
+    }
+    error(err) {
+        const { partialObserver } = this;
+        if (partialObserver.error) {
+            try {
+                partialObserver.error(err);
+            }
+            catch (error) {
+                handleUnhandledError(error);
+            }
+        }
+        else {
+            handleUnhandledError(err);
+        }
+    }
+    complete() {
+        const { partialObserver } = this;
+        if (partialObserver.complete) {
+            try {
+                partialObserver.complete();
+            }
+            catch (error) {
+                handleUnhandledError(error);
+            }
+        }
+    }
+}
+class SafeSubscriber extends Subscriber {
+    constructor(observerOrNext, error, complete) {
+        super();
+        let partialObserver;
+        if (isFunction(observerOrNext) || !observerOrNext) {
+            partialObserver = {
+                next: observerOrNext !== null && observerOrNext !== void 0 ? observerOrNext : undefined,
+                error: error !== null && error !== void 0 ? error : undefined,
+                complete: complete !== null && complete !== void 0 ? complete : undefined,
+            };
+        }
+        else {
+            let context;
+            if (this && config.useDeprecatedNextContext) {
+                context = Object.create(observerOrNext);
+                context.unsubscribe = () => this.unsubscribe();
+                partialObserver = {
+                    next: observerOrNext.next && bind(observerOrNext.next, context),
+                    error: observerOrNext.error && bind(observerOrNext.error, context),
+                    complete: observerOrNext.complete && bind(observerOrNext.complete, context),
+                };
+            }
+            else {
+                partialObserver = observerOrNext;
+            }
+        }
+        this.destination = new ConsumerObserver(partialObserver);
+    }
+}
+function handleUnhandledError(error) {
+    {
+        reportUnhandledError(error);
+    }
+}
+function defaultErrorHandler(err) {
+    throw err;
+}
+function handleStoppedNotification(notification, subscriber) {
+    const { onStoppedNotification } = config;
+    onStoppedNotification && timeoutProvider.setTimeout(() => onStoppedNotification(notification, subscriber));
+}
+const EMPTY_OBSERVER = {
+    closed: true,
+    next: noop,
+    error: defaultErrorHandler,
+    complete: noop,
+};
+
+const observable = (() => (typeof Symbol === 'function' && Symbol.observable) || '@@observable')();
+
+function identity(x) {
+    return x;
+}
+
+function pipeFromArray(fns) {
+    if (fns.length === 0) {
+        return identity;
+    }
+    if (fns.length === 1) {
+        return fns[0];
+    }
+    return function piped(input) {
+        return fns.reduce((prev, fn) => fn(prev), input);
+    };
+}
+
+class Observable {
+    constructor(subscribe) {
+        if (subscribe) {
+            this._subscribe = subscribe;
+        }
+    }
+    lift(operator) {
+        const observable = new Observable();
+        observable.source = this;
+        observable.operator = operator;
+        return observable;
+    }
+    subscribe(observerOrNext, error, complete) {
+        const subscriber = isSubscriber(observerOrNext) ? observerOrNext : new SafeSubscriber(observerOrNext, error, complete);
+        errorContext(() => {
+            const { operator, source } = this;
+            subscriber.add(operator
+                ?
+                    operator.call(subscriber, source)
+                : source
+                    ?
+                        this._subscribe(subscriber)
+                    :
+                        this._trySubscribe(subscriber));
+        });
+        return subscriber;
+    }
+    _trySubscribe(sink) {
+        try {
+            return this._subscribe(sink);
+        }
+        catch (err) {
+            sink.error(err);
+        }
+    }
+    forEach(next, promiseCtor) {
+        promiseCtor = getPromiseCtor(promiseCtor);
+        return new promiseCtor((resolve, reject) => {
+            const subscriber = new SafeSubscriber({
+                next: (value) => {
+                    try {
+                        next(value);
+                    }
+                    catch (err) {
+                        reject(err);
+                        subscriber.unsubscribe();
+                    }
+                },
+                error: reject,
+                complete: resolve,
+            });
+            this.subscribe(subscriber);
+        });
+    }
+    _subscribe(subscriber) {
+        var _a;
+        return (_a = this.source) === null || _a === void 0 ? void 0 : _a.subscribe(subscriber);
+    }
+    [observable]() {
+        return this;
+    }
+    pipe(...operations) {
+        return pipeFromArray(operations)(this);
+    }
+    toPromise(promiseCtor) {
+        promiseCtor = getPromiseCtor(promiseCtor);
+        return new promiseCtor((resolve, reject) => {
+            let value;
+            this.subscribe((x) => (value = x), (err) => reject(err), () => resolve(value));
+        });
+    }
+}
+Observable.create = (subscribe) => {
+    return new Observable(subscribe);
+};
+function getPromiseCtor(promiseCtor) {
+    var _a;
+    return (_a = promiseCtor !== null && promiseCtor !== void 0 ? promiseCtor : config.Promise) !== null && _a !== void 0 ? _a : Promise;
+}
+function isObserver(value) {
+    return value && isFunction(value.next) && isFunction(value.error) && isFunction(value.complete);
+}
+function isSubscriber(value) {
+    return (value && value instanceof Subscriber) || (isObserver(value) && isSubscription(value));
+}
+
+function hasLift(source) {
+    return isFunction(source === null || source === void 0 ? void 0 : source.lift);
+}
+function operate(init) {
+    return (source) => {
+        if (hasLift(source)) {
+            return source.lift(function (liftedSource) {
+                try {
+                    return init(liftedSource, this);
+                }
+                catch (err) {
+                    this.error(err);
+                }
+            });
+        }
+        throw new TypeError('Unable to lift unknown Observable type');
+    };
+}
+
+function createOperatorSubscriber(destination, onNext, onComplete, onError, onFinalize) {
+    return new OperatorSubscriber(destination, onNext, onComplete, onError, onFinalize);
+}
+class OperatorSubscriber extends Subscriber {
+    constructor(destination, onNext, onComplete, onError, onFinalize, shouldUnsubscribe) {
+        super(destination);
+        this.onFinalize = onFinalize;
+        this.shouldUnsubscribe = shouldUnsubscribe;
+        this._next = onNext
+            ? function (value) {
+                try {
+                    onNext(value);
+                }
+                catch (err) {
+                    destination.error(err);
+                }
+            }
+            : super._next;
+        this._error = onError
+            ? function (err) {
+                try {
+                    onError(err);
+                }
+                catch (err) {
+                    destination.error(err);
+                }
+                finally {
+                    this.unsubscribe();
+                }
+            }
+            : super._error;
+        this._complete = onComplete
+            ? function () {
+                try {
+                    onComplete();
+                }
+                catch (err) {
+                    destination.error(err);
+                }
+                finally {
+                    this.unsubscribe();
+                }
+            }
+            : super._complete;
+    }
+    unsubscribe() {
+        var _a;
+        if (!this.shouldUnsubscribe || this.shouldUnsubscribe()) {
+            const { closed } = this;
+            super.unsubscribe();
+            !closed && ((_a = this.onFinalize) === null || _a === void 0 ? void 0 : _a.call(this));
+        }
+    }
+}
+
+const ObjectUnsubscribedError = createErrorClass((_super) => function ObjectUnsubscribedErrorImpl() {
+    _super(this);
+    this.name = 'ObjectUnsubscribedError';
+    this.message = 'object unsubscribed';
+});
+
+class Subject extends Observable {
+    constructor() {
+        super();
+        this.closed = false;
+        this.currentObservers = null;
+        this.observers = [];
+        this.isStopped = false;
+        this.hasError = false;
+        this.thrownError = null;
+    }
+    lift(operator) {
+        const subject = new AnonymousSubject(this, this);
+        subject.operator = operator;
+        return subject;
+    }
+    _throwIfClosed() {
+        if (this.closed) {
+            throw new ObjectUnsubscribedError();
+        }
+    }
+    next(value) {
+        errorContext(() => {
+            this._throwIfClosed();
+            if (!this.isStopped) {
+                if (!this.currentObservers) {
+                    this.currentObservers = Array.from(this.observers);
+                }
+                for (const observer of this.currentObservers) {
+                    observer.next(value);
+                }
+            }
+        });
+    }
+    error(err) {
+        errorContext(() => {
+            this._throwIfClosed();
+            if (!this.isStopped) {
+                this.hasError = this.isStopped = true;
+                this.thrownError = err;
+                const { observers } = this;
+                while (observers.length) {
+                    observers.shift().error(err);
+                }
+            }
+        });
+    }
+    complete() {
+        errorContext(() => {
+            this._throwIfClosed();
+            if (!this.isStopped) {
+                this.isStopped = true;
+                const { observers } = this;
+                while (observers.length) {
+                    observers.shift().complete();
+                }
+            }
+        });
+    }
+    unsubscribe() {
+        this.isStopped = this.closed = true;
+        this.observers = this.currentObservers = null;
+    }
+    get observed() {
+        var _a;
+        return ((_a = this.observers) === null || _a === void 0 ? void 0 : _a.length) > 0;
+    }
+    _trySubscribe(subscriber) {
+        this._throwIfClosed();
+        return super._trySubscribe(subscriber);
+    }
+    _subscribe(subscriber) {
+        this._throwIfClosed();
+        this._checkFinalizedStatuses(subscriber);
+        return this._innerSubscribe(subscriber);
+    }
+    _innerSubscribe(subscriber) {
+        const { hasError, isStopped, observers } = this;
+        if (hasError || isStopped) {
+            return EMPTY_SUBSCRIPTION;
+        }
+        this.currentObservers = null;
+        observers.push(subscriber);
+        return new Subscription(() => {
+            this.currentObservers = null;
+            arrRemove(observers, subscriber);
+        });
+    }
+    _checkFinalizedStatuses(subscriber) {
+        const { hasError, thrownError, isStopped } = this;
+        if (hasError) {
+            subscriber.error(thrownError);
+        }
+        else if (isStopped) {
+            subscriber.complete();
+        }
+    }
+    asObservable() {
+        const observable = new Observable();
+        observable.source = this;
+        return observable;
+    }
+}
+Subject.create = (destination, source) => {
+    return new AnonymousSubject(destination, source);
+};
+class AnonymousSubject extends Subject {
+    constructor(destination, source) {
+        super();
+        this.destination = destination;
+        this.source = source;
+    }
+    next(value) {
+        var _a, _b;
+        (_b = (_a = this.destination) === null || _a === void 0 ? void 0 : _a.next) === null || _b === void 0 ? void 0 : _b.call(_a, value);
+    }
+    error(err) {
+        var _a, _b;
+        (_b = (_a = this.destination) === null || _a === void 0 ? void 0 : _a.error) === null || _b === void 0 ? void 0 : _b.call(_a, err);
+    }
+    complete() {
+        var _a, _b;
+        (_b = (_a = this.destination) === null || _a === void 0 ? void 0 : _a.complete) === null || _b === void 0 ? void 0 : _b.call(_a);
+    }
+    _subscribe(subscriber) {
+        var _a, _b;
+        return (_b = (_a = this.source) === null || _a === void 0 ? void 0 : _a.subscribe(subscriber)) !== null && _b !== void 0 ? _b : EMPTY_SUBSCRIPTION;
+    }
+}
+
+const EMPTY = new Observable((subscriber) => subscriber.complete());
+
+function isScheduler(value) {
+    return value && isFunction(value.schedule);
+}
+
+function last(arr) {
+    return arr[arr.length - 1];
+}
+function popScheduler(args) {
+    return isScheduler(last(args)) ? args.pop() : undefined;
+}
+function popNumber(args, defaultValue) {
+    return typeof last(args) === 'number' ? args.pop() : defaultValue;
+}
+
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+
+function __awaiter(thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+}
+
+function __values(o) {
+    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+    if (m) return m.call(o);
+    if (o && typeof o.length === "number") return {
+        next: function () {
+            if (o && i >= o.length) o = void 0;
+            return { value: o && o[i++], done: !o };
+        }
+    };
+    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+}
+
+function __await(v) {
+    return this instanceof __await ? (this.v = v, this) : new __await(v);
+}
+
+function __asyncGenerator(thisArg, _arguments, generator) {
+    if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
+    var g = generator.apply(thisArg, _arguments || []), i, q = [];
+    return i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i;
+    function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }
+    function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }
+    function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }
+    function fulfill(value) { resume("next", value); }
+    function reject(value) { resume("throw", value); }
+    function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }
+}
+
+function __asyncValues(o) {
+    if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
+    var m = o[Symbol.asyncIterator], i;
+    return m ? m.call(o) : (o = typeof __values === "function" ? __values(o) : o[Symbol.iterator](), i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i);
+    function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }
+    function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }
+}
+
+const isArrayLike = ((x) => x && typeof x.length === 'number' && typeof x !== 'function');
+
+function isPromise(value) {
+    return isFunction(value === null || value === void 0 ? void 0 : value.then);
+}
+
+function isInteropObservable(input) {
+    return isFunction(input[observable]);
+}
+
+function isAsyncIterable(obj) {
+    return Symbol.asyncIterator && isFunction(obj === null || obj === void 0 ? void 0 : obj[Symbol.asyncIterator]);
+}
+
+function createInvalidObservableTypeError(input) {
+    return new TypeError(`You provided ${input !== null && typeof input === 'object' ? 'an invalid object' : `'${input}'`} where a stream was expected. You can provide an Observable, Promise, ReadableStream, Array, AsyncIterable, or Iterable.`);
+}
+
+function getSymbolIterator() {
+    if (typeof Symbol !== 'function' || !Symbol.iterator) {
+        return '@@iterator';
+    }
+    return Symbol.iterator;
+}
+const iterator = getSymbolIterator();
+
+function isIterable(input) {
+    return isFunction(input === null || input === void 0 ? void 0 : input[iterator]);
+}
+
+function readableStreamLikeToAsyncGenerator(readableStream) {
+    return __asyncGenerator(this, arguments, function* readableStreamLikeToAsyncGenerator_1() {
+        const reader = readableStream.getReader();
+        try {
+            while (true) {
+                const { value, done } = yield __await(reader.read());
+                if (done) {
+                    return yield __await(void 0);
+                }
+                yield yield __await(value);
+            }
+        }
+        finally {
+            reader.releaseLock();
+        }
+    });
+}
+function isReadableStreamLike(obj) {
+    return isFunction(obj === null || obj === void 0 ? void 0 : obj.getReader);
+}
+
+function innerFrom(input) {
+    if (input instanceof Observable) {
+        return input;
+    }
+    if (input != null) {
+        if (isInteropObservable(input)) {
+            return fromInteropObservable(input);
+        }
+        if (isArrayLike(input)) {
+            return fromArrayLike(input);
+        }
+        if (isPromise(input)) {
+            return fromPromise(input);
+        }
+        if (isAsyncIterable(input)) {
+            return fromAsyncIterable(input);
+        }
+        if (isIterable(input)) {
+            return fromIterable(input);
+        }
+        if (isReadableStreamLike(input)) {
+            return fromReadableStreamLike(input);
+        }
+    }
+    throw createInvalidObservableTypeError(input);
+}
+function fromInteropObservable(obj) {
+    return new Observable((subscriber) => {
+        const obs = obj[observable]();
+        if (isFunction(obs.subscribe)) {
+            return obs.subscribe(subscriber);
+        }
+        throw new TypeError('Provided object does not correctly implement Symbol.observable');
+    });
+}
+function fromArrayLike(array) {
+    return new Observable((subscriber) => {
+        for (let i = 0; i < array.length && !subscriber.closed; i++) {
+            subscriber.next(array[i]);
+        }
+        subscriber.complete();
+    });
+}
+function fromPromise(promise) {
+    return new Observable((subscriber) => {
+        promise
+            .then((value) => {
+            if (!subscriber.closed) {
+                subscriber.next(value);
+                subscriber.complete();
+            }
+        }, (err) => subscriber.error(err))
+            .then(null, reportUnhandledError);
+    });
+}
+function fromIterable(iterable) {
+    return new Observable((subscriber) => {
+        for (const value of iterable) {
+            subscriber.next(value);
+            if (subscriber.closed) {
+                return;
+            }
+        }
+        subscriber.complete();
+    });
+}
+function fromAsyncIterable(asyncIterable) {
+    return new Observable((subscriber) => {
+        process(asyncIterable, subscriber).catch((err) => subscriber.error(err));
+    });
+}
+function fromReadableStreamLike(readableStream) {
+    return fromAsyncIterable(readableStreamLikeToAsyncGenerator(readableStream));
+}
+function process(asyncIterable, subscriber) {
+    var asyncIterable_1, asyncIterable_1_1;
+    var e_1, _a;
+    return __awaiter(this, void 0, void 0, function* () {
+        try {
+            for (asyncIterable_1 = __asyncValues(asyncIterable); asyncIterable_1_1 = yield asyncIterable_1.next(), !asyncIterable_1_1.done;) {
+                const value = asyncIterable_1_1.value;
+                subscriber.next(value);
+                if (subscriber.closed) {
+                    return;
+                }
+            }
+        }
+        catch (e_1_1) { e_1 = { error: e_1_1 }; }
+        finally {
+            try {
+                if (asyncIterable_1_1 && !asyncIterable_1_1.done && (_a = asyncIterable_1.return)) yield _a.call(asyncIterable_1);
+            }
+            finally { if (e_1) throw e_1.error; }
+        }
+        subscriber.complete();
+    });
+}
+
+function executeSchedule(parentSubscription, scheduler, work, delay = 0, repeat = false) {
+    const scheduleSubscription = scheduler.schedule(function () {
+        work();
+        if (repeat) {
+            parentSubscription.add(this.schedule(null, delay));
+        }
+        else {
+            this.unsubscribe();
+        }
+    }, delay);
+    parentSubscription.add(scheduleSubscription);
+    if (!repeat) {
+        return scheduleSubscription;
+    }
+}
+
+function observeOn(scheduler, delay = 0) {
+    return operate((source, subscriber) => {
+        source.subscribe(createOperatorSubscriber(subscriber, (value) => executeSchedule(subscriber, scheduler, () => subscriber.next(value), delay), () => executeSchedule(subscriber, scheduler, () => subscriber.complete(), delay), (err) => executeSchedule(subscriber, scheduler, () => subscriber.error(err), delay)));
+    });
+}
+
+function subscribeOn(scheduler, delay = 0) {
+    return operate((source, subscriber) => {
+        subscriber.add(scheduler.schedule(() => source.subscribe(subscriber), delay));
+    });
+}
+
+function scheduleObservable(input, scheduler) {
+    return innerFrom(input).pipe(subscribeOn(scheduler), observeOn(scheduler));
+}
+
+function schedulePromise(input, scheduler) {
+    return innerFrom(input).pipe(subscribeOn(scheduler), observeOn(scheduler));
+}
+
+function scheduleArray(input, scheduler) {
+    return new Observable((subscriber) => {
+        let i = 0;
+        return scheduler.schedule(function () {
+            if (i === input.length) {
+                subscriber.complete();
+            }
+            else {
+                subscriber.next(input[i++]);
+                if (!subscriber.closed) {
+                    this.schedule();
+                }
+            }
+        });
+    });
+}
+
+function scheduleIterable(input, scheduler) {
+    return new Observable((subscriber) => {
+        let iterator$1;
+        executeSchedule(subscriber, scheduler, () => {
+            iterator$1 = input[iterator]();
+            executeSchedule(subscriber, scheduler, () => {
+                let value;
+                let done;
+                try {
+                    ({ value, done } = iterator$1.next());
+                }
+                catch (err) {
+                    subscriber.error(err);
+                    return;
+                }
+                if (done) {
+                    subscriber.complete();
+                }
+                else {
+                    subscriber.next(value);
+                }
+            }, 0, true);
+        });
+        return () => isFunction(iterator$1 === null || iterator$1 === void 0 ? void 0 : iterator$1.return) && iterator$1.return();
+    });
+}
+
+function scheduleAsyncIterable(input, scheduler) {
+    if (!input) {
+        throw new Error('Iterable cannot be null');
+    }
+    return new Observable((subscriber) => {
+        executeSchedule(subscriber, scheduler, () => {
+            const iterator = input[Symbol.asyncIterator]();
+            executeSchedule(subscriber, scheduler, () => {
+                iterator.next().then((result) => {
+                    if (result.done) {
+                        subscriber.complete();
+                    }
+                    else {
+                        subscriber.next(result.value);
+                    }
+                });
+            }, 0, true);
+        });
+    });
+}
+
+function scheduleReadableStreamLike(input, scheduler) {
+    return scheduleAsyncIterable(readableStreamLikeToAsyncGenerator(input), scheduler);
+}
+
+function scheduled(input, scheduler) {
+    if (input != null) {
+        if (isInteropObservable(input)) {
+            return scheduleObservable(input, scheduler);
+        }
+        if (isArrayLike(input)) {
+            return scheduleArray(input, scheduler);
+        }
+        if (isPromise(input)) {
+            return schedulePromise(input, scheduler);
+        }
+        if (isAsyncIterable(input)) {
+            return scheduleAsyncIterable(input, scheduler);
+        }
+        if (isIterable(input)) {
+            return scheduleIterable(input, scheduler);
+        }
+        if (isReadableStreamLike(input)) {
+            return scheduleReadableStreamLike(input, scheduler);
+        }
+    }
+    throw createInvalidObservableTypeError(input);
+}
+
+function from(input, scheduler) {
+    return scheduler ? scheduled(input, scheduler) : innerFrom(input);
+}
+
+function map(project, thisArg) {
+    return operate((source, subscriber) => {
+        let index = 0;
+        source.subscribe(createOperatorSubscriber(subscriber, (value) => {
+            subscriber.next(project.call(thisArg, value, index++));
+        }));
+    });
+}
+
+const { isArray } = Array;
+function callOrApply(fn, args) {
+    return isArray(args) ? fn(...args) : fn(args);
+}
+function mapOneOrManyArgs(fn) {
+    return map(args => callOrApply(fn, args));
+}
+
+function mergeInternals(source, subscriber, project, concurrent, onBeforeNext, expand, innerSubScheduler, additionalFinalizer) {
+    const buffer = [];
+    let active = 0;
+    let index = 0;
+    let isComplete = false;
+    const checkComplete = () => {
+        if (isComplete && !buffer.length && !active) {
+            subscriber.complete();
+        }
+    };
+    const outerNext = (value) => (active < concurrent ? doInnerSub(value) : buffer.push(value));
+    const doInnerSub = (value) => {
+        expand && subscriber.next(value);
+        active++;
+        let innerComplete = false;
+        innerFrom(project(value, index++)).subscribe(createOperatorSubscriber(subscriber, (innerValue) => {
+            onBeforeNext === null || onBeforeNext === void 0 ? void 0 : onBeforeNext(innerValue);
+            if (expand) {
+                outerNext(innerValue);
+            }
+            else {
+                subscriber.next(innerValue);
+            }
+        }, () => {
+            innerComplete = true;
+        }, undefined, () => {
+            if (innerComplete) {
+                try {
+                    active--;
+                    while (buffer.length && active < concurrent) {
+                        const bufferedValue = buffer.shift();
+                        if (innerSubScheduler) {
+                            executeSchedule(subscriber, innerSubScheduler, () => doInnerSub(bufferedValue));
+                        }
+                        else {
+                            doInnerSub(bufferedValue);
+                        }
+                    }
+                    checkComplete();
+                }
+                catch (err) {
+                    subscriber.error(err);
+                }
+            }
+        }));
+    };
+    source.subscribe(createOperatorSubscriber(subscriber, outerNext, () => {
+        isComplete = true;
+        checkComplete();
+    }));
+    return () => {
+        additionalFinalizer === null || additionalFinalizer === void 0 ? void 0 : additionalFinalizer();
+    };
+}
+
+function mergeMap(project, resultSelector, concurrent = Infinity) {
+    if (isFunction(resultSelector)) {
+        return mergeMap((a, i) => map((b, ii) => resultSelector(a, b, i, ii))(innerFrom(project(a, i))), concurrent);
+    }
+    else if (typeof resultSelector === 'number') {
+        concurrent = resultSelector;
+    }
+    return operate((source, subscriber) => mergeInternals(source, subscriber, project, concurrent));
+}
+
+function mergeAll(concurrent = Infinity) {
+    return mergeMap(identity, concurrent);
+}
+
+const nodeEventEmitterMethods = ['addListener', 'removeListener'];
+const eventTargetMethods = ['addEventListener', 'removeEventListener'];
+const jqueryMethods = ['on', 'off'];
+function fromEvent(target, eventName, options, resultSelector) {
+    if (isFunction(options)) {
+        resultSelector = options;
+        options = undefined;
+    }
+    if (resultSelector) {
+        return fromEvent(target, eventName, options).pipe(mapOneOrManyArgs(resultSelector));
+    }
+    const [add, remove] = isEventTarget(target)
+        ? eventTargetMethods.map((methodName) => (handler) => target[methodName](eventName, handler, options))
+        :
+            isNodeStyleEventEmitter(target)
+                ? nodeEventEmitterMethods.map(toCommonHandlerRegistry(target, eventName))
+                : isJQueryStyleEventEmitter(target)
+                    ? jqueryMethods.map(toCommonHandlerRegistry(target, eventName))
+                    : [];
+    if (!add) {
+        if (isArrayLike(target)) {
+            return mergeMap((subTarget) => fromEvent(subTarget, eventName, options))(innerFrom(target));
+        }
+    }
+    if (!add) {
+        throw new TypeError('Invalid event target');
+    }
+    return new Observable((subscriber) => {
+        const handler = (...args) => subscriber.next(1 < args.length ? args : args[0]);
+        add(handler);
+        return () => remove(handler);
+    });
+}
+function toCommonHandlerRegistry(target, eventName) {
+    return (methodName) => (handler) => target[methodName](eventName, handler);
+}
+function isNodeStyleEventEmitter(target) {
+    return isFunction(target.addListener) && isFunction(target.removeListener);
+}
+function isJQueryStyleEventEmitter(target) {
+    return isFunction(target.on) && isFunction(target.off);
+}
+function isEventTarget(target) {
+    return isFunction(target.addEventListener) && isFunction(target.removeEventListener);
+}
+
+function merge(...args) {
+    const scheduler = popScheduler(args);
+    const concurrent = popNumber(args, Infinity);
+    const sources = args;
+    return !sources.length
+        ?
+            EMPTY
+        : sources.length === 1
+            ?
+                innerFrom(sources[0])
+            :
+                mergeAll(concurrent)(from(sources, scheduler));
+}
+
+function filter(predicate, thisArg) {
+    return operate((source, subscriber) => {
+        let index = 0;
+        source.subscribe(createOperatorSubscriber(subscriber, (value) => predicate.call(thisArg, value, index++) && subscriber.next(value)));
+    });
+}
+
+function distinctUntilChanged(comparator, keySelector = identity) {
+    comparator = comparator !== null && comparator !== void 0 ? comparator : defaultCompare;
+    return operate((source, subscriber) => {
+        let previousKey;
+        let first = true;
+        source.subscribe(createOperatorSubscriber(subscriber, (value) => {
+            const currentKey = keySelector(value);
+            if (first || !comparator(previousKey, currentKey)) {
+                first = false;
+                previousKey = currentKey;
+                subscriber.next(value);
+            }
+        }));
+    });
+}
+function defaultCompare(a, b) {
+    return a === b;
+}
+
+function takeUntil(notifier) {
+    return operate((source, subscriber) => {
+        innerFrom(notifier).subscribe(createOperatorSubscriber(subscriber, () => subscriber.complete(), noop));
+        !subscriber.closed && source.subscribe(subscriber);
+    });
+}
+
+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;top:0;left:0;right:0;bottom: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{overflow:hidden;white-space:nowrap}.scrollable-content.scroll-x{overflow-x:auto}.scrollable-content.scroll-y{overflow-y:auto}.scrollable-content.no-overscroll{overscroll-behavior:contain}";
+
+const CatScrollable = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.scrolledTop = index.createEvent(this, "scrolledTop", 7);
+    this.scrolledLeft = index.createEvent(this, "scrolledLeft", 7);
+    this.scrolledRight = index.createEvent(this, "scrolledRight", 7);
+    this.scrolledBottom = index.createEvent(this, "scrolledBottom", 7);
+    this.init = new Subject();
+    this.destroyed = new Subject();
+    /** Flags to enable/disable scroll shadowX. */
+    this.shadowX = true;
+    /** Flags to enable/disable scroll shadowY. */
+    this.shadowY = true;
+    /** Flags to enable/disable overflowX. */
+    this.overflowX = true;
+    /** Flags to enable/disable overflowY. */
+    this.overflowY = true;
+    /** Flag to enable/disable overscroll behavior. */
+    this.overscroll = true;
+    /**
+     * Flag to fire an initial event after content initialization.
+     */
+    this.scrolledInit = true;
+    /**
+     * Buffer to be used to calculate the scroll distance.
+     */
+    this.scrolledBuffer = 0;
+  }
+  componentDidRender() {
+    if (this.scrollElement) {
+      this.scrolled = fromEvent(this.scrollElement, 'scroll').pipe(takeUntil(this.destroyed));
+    }
+    this.attachEmitter('left', this.scrolledLeft, this.scrolledBuffer);
+    this.attachEmitter('right', this.scrolledRight, this.scrolledBuffer);
+    this.attachEmitter('bottom', this.scrolledBottom, this.scrolledBuffer);
+    this.attachEmitter('top', this.scrolledTop, this.scrolledBuffer);
+    merge(this.init, this.scrolled)
+      .pipe(map(() => ({
+      top: this.getScrollOffset('top') > 0,
+      left: this.getScrollOffset('left') > 0,
+      right: this.getScrollOffset('right') > 0,
+      bottom: this.getScrollOffset('bottom') > 0
+    })), distinctUntilChanged(), takeUntil(this.destroyed))
+      .subscribe(({ top, left, right, bottom }) => {
+      this.toggleClass('cat-scrollable-top', top);
+      this.toggleClass('cat-scrollable-left', left);
+      this.toggleClass('cat-scrollable-right', right);
+      this.toggleClass('cat-scrollable-bottom', bottom);
+    });
+  }
+  componentDidLoad() {
+    if (this.scrolledInit) {
+      this.init.next();
+    }
+  }
+  disconnectedCallback() {
+    this.init.complete();
+    this.destroyed.next();
+    this.destroyed.complete();
+  }
+  render() {
+    return [
+      index.h("div", { class: "scrollable-wrapper", ref: el => (this.scrollWrapperElement = el) }, this.shadowY && index.h("div", { class: "shadow-top" }), this.shadowX && index.h("div", { class: "shadow-left" }), this.shadowX && index.h("div", { class: "shadow-right" }), this.shadowY && index.h("div", { class: "shadow-bottom" })),
+      index.h("div", { ref: el => (this.scrollElement = el), class: {
+          'scrollable-content': true,
+          'scroll-x': this.overflowX,
+          'scroll-y': this.overflowY,
+          'no-overscroll': !this.overscroll
+        } }, index.h("slot", null))
+    ];
+  }
+  attachEmitter(from, emitter, buffer) {
+    merge(this.init, this.scrolled)
+      .pipe(map(() => this.getScrollOffset(from)))
+      .pipe(map(offset => offset <= buffer))
+      .pipe(distinctUntilChanged())
+      .pipe(filter(isLower => isLower))
+      .pipe(takeUntil(this.destroyed))
+      .subscribe(() => emitter.emit());
+  }
+  getScrollOffset(from) {
+    if (this.scrollElement) {
+      switch (from) {
+        case 'top':
+          return this.scrollElement.scrollTop;
+        case 'left':
+          return this.scrollElement.scrollLeft;
+        case 'right':
+          return this.scrollElement.scrollWidth - this.scrollElement.clientWidth - this.scrollElement.scrollLeft;
+        case 'bottom':
+          return this.scrollElement.scrollHeight - this.scrollElement.clientHeight - this.scrollElement.scrollTop;
+        default:
+          return 0;
+      }
+    }
+    return 0;
+  }
+  toggleClass(name, value) {
+    var _a, _b;
+    if (value) {
+      (_a = this.scrollWrapperElement) === null || _a === void 0 ? void 0 : _a.classList.add(name);
+    }
+    else {
+      (_b = this.scrollWrapperElement) === null || _b === void 0 ? void 0 : _b.classList.remove(name);
+    }
+  }
+  get el() { return index.getElement(this); }
+};
+CatScrollable.style = catScrollableCss;
+
 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]){margin-bottom:0.5rem}:host([variant=body]){margin-bottom:1rem}.cat-skeleton{display:block;border-radius:0.25rem;background:var(--background)}.cat-skeleton-circle{border-radius:10rem}.cat-skeleton-xs.cat-skeleton-rectangle{width:var(--width, 100%);height:var(--height, 1.5rem)}.cat-skeleton-xs.cat-skeleton-square,.cat-skeleton-xs.cat-skeleton-circle{width:var(--width, 1.5rem);height:var(--height, 1.5rem)}.cat-skeleton-xs.cat-skeleton-head,.cat-skeleton-xs.cat-skeleton-body{width:var(--width, var(--line-width, 100%))}.cat-skeleton-xs.cat-skeleton-head{height:calc(0.9375rem - 4px);margin:calc((1.25rem - 0.9375rem + 4px) * 0.5) 0}.cat-skeleton-xs.cat-skeleton-body{height:calc(0.75rem - 4px);margin:calc((1rem - 0.75rem + 4px) * 0.5) 0}.cat-skeleton-s.cat-skeleton-rectangle{width:var(--width, 100%);height:var(--height, 2rem)}.cat-skeleton-s.cat-skeleton-square,.cat-skeleton-s.cat-skeleton-circle{width:var(--width, 2rem);height:var(--height, 2rem)}.cat-skeleton-s.cat-skeleton-head,.cat-skeleton-s.cat-skeleton-body{width:var(--width, var(--line-width, 100%))}.cat-skeleton-s.cat-skeleton-head{height:calc(1.125rem - 4px);margin:calc((1.5rem - 1.125rem + 4px) * 0.5) 0}.cat-skeleton-s.cat-skeleton-body{height:calc(0.875rem - 4px);margin:calc((1rem - 0.875rem + 4px) * 0.5) 0}.cat-skeleton-m.cat-skeleton-rectangle{width:var(--width, 100%);height:var(--height, 2.5rem)}.cat-skeleton-m.cat-skeleton-square,.cat-skeleton-m.cat-skeleton-circle{width:var(--width, 2.5rem);height:var(--height, 2.5rem)}.cat-skeleton-m.cat-skeleton-head,.cat-skeleton-m.cat-skeleton-body{width:var(--width, var(--line-width, 100%))}.cat-skeleton-m.cat-skeleton-head{height:calc(1.25rem - 4px);margin:calc((1.5rem - 1.25rem + 4px) * 0.5) 0}.cat-skeleton-m.cat-skeleton-body{height:calc(0.9375rem - 4px);margin:calc((1.25rem - 0.9375rem + 4px) * 0.5) 0}.cat-skeleton-l.cat-skeleton-rectangle{width:var(--width, 100%);height:var(--height, 3rem)}.cat-skeleton-l.cat-skeleton-square,.cat-skeleton-l.cat-skeleton-circle{width:var(--width, 3rem);height:var(--height, 3rem)}.cat-skeleton-l.cat-skeleton-head,.cat-skeleton-l.cat-skeleton-body{width:var(--width, var(--line-width, 100%))}.cat-skeleton-l.cat-skeleton-head{height:calc(1.5rem - 4px);margin:calc((1.75rem - 1.5rem + 4px) * 0.5) 0}.cat-skeleton-l.cat-skeleton-body{height:calc(1.125rem - 4px);margin:calc((1.5rem - 1.125rem + 4px) * 0.5) 0}.cat-skeleton-xl.cat-skeleton-rectangle{width:var(--width, 100%);height:var(--height, 3.5rem)}.cat-skeleton-xl.cat-skeleton-square,.cat-skeleton-xl.cat-skeleton-circle{width:var(--width, 3.5rem);height:var(--height, 3.5rem)}.cat-skeleton-xl.cat-skeleton-head,.cat-skeleton-xl.cat-skeleton-body{width:var(--width, var(--line-width, 100%))}.cat-skeleton-xl.cat-skeleton-head{height:calc(1.75rem - 4px);margin:calc((2rem - 1.75rem + 4px) * 0.5) 0}.cat-skeleton-xl.cat-skeleton-body{height:calc(1.25rem - 4px);margin:calc((1.5rem - 1.25rem + 4px) * 0.5) 0}.cat-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}.cat-skeleton-pulse{position:relative;overflow:hidden}.cat-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 CatSkeleton = class {
   constructor(hostRef) {
-    catIconRegistry.registerInstance(this, hostRef);
+    index.registerInstance(this, hostRef);
     /**
      * The animation style of the skeleton.
      */
@@ -3058,7 +4390,7 @@ const CatSkeleton = class {
     this.size = 'm';
   }
   render() {
-    return (catIconRegistry.h(catIconRegistry.Host, null, Array.from(Array(this.count)).map(() => (catIconRegistry.h("div", { style: this.style, class: {
+    return (index.h(index.Host, null, Array.from(Array(this.count)).map(() => (index.h("div", { style: this.style, class: {
         'cat-skeleton': true,
         [`cat-skeleton-${this.effect}`]: Boolean(this.effect),
         [`cat-skeleton-${this.variant}`]: Boolean(this.variant),
@@ -3092,16 +4424,16 @@ const catSpinnerCss = ":host{display:inline-flex;vertical-align:middle;-webkit-u
 
 const CatSpinner = class {
   constructor(hostRef) {
-    catIconRegistry.registerInstance(this, hostRef);
+    index.registerInstance(this, hostRef);
     /**
      * The size of the spinner.
      */
     this.size = 'm';
   }
   render() {
-    return (catIconRegistry.h("span", { "aria-label": this.a11yLabel, "aria-hidden": this.a11yLabel ? null : 'true', class: {
+    return (index.h("span", { "aria-label": this.a11yLabel, "aria-hidden": this.a11yLabel ? null : 'true', class: {
         [`cat-spinner-${this.size}`]: this.size !== 'inline'
-      } }, catIconRegistry.h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 48 48" }, catIconRegistry.h("circle", { cx: "24", cy: "24", r: "21.5" }))));
+      } }, 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" }))));
   }
 };
 CatSpinner.style = catSpinnerCss;
@@ -3111,5 +4443,8 @@ exports.cat_badge = CatBadge;
 exports.cat_button = CatButton;
 exports.cat_icon = CatIcon;
 exports.cat_menu = CatMenu;
+exports.cat_scrollable = CatScrollable;
 exports.cat_skeleton = CatSkeleton;
 exports.cat_spinner = CatSpinner;
+
+//# sourceMappingURL=cat-alert_8.cjs.entry.js.map