@haiilo/catalyst 0.5.14 → 0.6.0

package/dist/esm/catalyst.js

@@ -17,7 +17,7 @@ const patchBrowser = () => {
 
 patchBrowser().then(options => {
   globalScripts();
-  return bootstrapLazy([["cat-textarea",[[1,"cat-textarea",{"disabled":[4],"hint":[1],"label":[1],"labelHidden":[4,"label-hidden"],"maxLength":[2,"max-length"],"minLength":[2,"min-length"],"name":[1],"placeholder":[1],"readonly":[4],"required":[4],"rows":[2],"value":[8],"setFocus":[64]}]]],["cat-alert_15",[[1,"cat-input",{"autoComplete":[1,"auto-complete"],"clearable":[4],"disabled":[4],"hint":[1],"icon":[1],"iconRight":[4,"icon-right"],"label":[1],"labelHidden":[4,"label-hidden"],"max":[2],"maxLength":[2,"max-length"],"min":[2],"minLength":[2,"min-length"],"name":[1],"placeholder":[1],"textPrefix":[1,"text-prefix"],"textSuffix":[1,"text-suffix"],"readonly":[4],"required":[4],"round":[4],"type":[1],"value":[8],"inputValue":[32],"setFocus":[64],"clear":[64]}],[0,"cat-toast-demo"],[1,"cat-alert",{"color":[1]}],[1,"cat-badge",{"variant":[1],"color":[1],"size":[1],"round":[4],"pulse":[4]}],[1,"cat-card"],[1,"cat-checkbox",{"checked":[4],"disabled":[4],"indeterminate":[4],"label":[1],"labelHidden":[4,"label-hidden"],"name":[1],"required":[4],"value":[1],"setFocus":[64]}],[1,"cat-menu",{"placement":[1]},[[0,"catClick","clickHandler"]]],[1,"cat-radio",{"checked":[4],"disabled":[4],"label":[1],"labelHidden":[4,"label-hidden"],"name":[1],"required":[4],"value":[1],"setFocus":[64]}],[1,"cat-scrollable",{"shadowX":[4,"shadow-x"],"shadowY":[4,"shadow-y"],"overflowX":[4,"overflow-x"],"overflowY":[4,"overflow-y"],"overscroll":[4],"scrolledInit":[4,"scrolled-init"],"scrolledBuffer":[2,"scrolled-buffer"]}],[1,"cat-skeleton",{"effect":[1],"variant":[1],"size":[1],"lines":[2]}],[1,"cat-toggle",{"checked":[4],"disabled":[4],"label":[1],"labelHidden":[4,"label-hidden"],"name":[1],"required":[4],"value":[1],"setFocus":[64]}],[1,"cat-tooltip",{"content":[1],"disabled":[4],"placement":[1],"showDelay":[2,"show-delay"],"hideDelay":[2,"hide-delay"],"longTouchDuration":[2,"long-touch-duration"]},[[0,"keydown","handleKeyDown"]]],[1,"cat-button",{"variant":[1],"color":[1],"active":[4],"size":[1],"name":[1],"value":[1],"disabled":[4],"loading":[4],"submit":[4],"ellipsed":[4],"round":[4],"url":[1],"urlTarget":[1,"url-target"],"icon":[1],"iconOnly":[8,"icon-only"],"iconRight":[4,"icon-right"],"buttonId":[1,"button-id"],"a11yLabel":[1,"a11y-label"],"_iconOnly":[32],"setFocus":[64]},[[0,"click","haltDisabledEvents"]]],[1,"cat-icon",{"icon":[1],"size":[1],"a11yLabel":[1,"a11y-label"]}],[1,"cat-spinner",{"size":[1],"a11yLabel":[1,"a11y-label"]}]]]], options);
+  return bootstrapLazy([["cat-textarea",[[1,"cat-textarea",{"disabled":[4],"hint":[1],"label":[1],"labelHidden":[4,"label-hidden"],"maxLength":[2,"max-length"],"minLength":[2,"min-length"],"name":[1],"placeholder":[1],"readonly":[4],"required":[4],"rows":[2],"value":[8],"setFocus":[64]}]]],["cat-alert_16",[[1,"cat-input",{"autoComplete":[1,"auto-complete"],"clearable":[4],"disabled":[4],"hint":[1],"icon":[1],"iconRight":[4,"icon-right"],"label":[1],"labelHidden":[4,"label-hidden"],"max":[2],"maxLength":[2,"max-length"],"min":[2],"minLength":[2,"min-length"],"name":[1],"placeholder":[1],"textPrefix":[1,"text-prefix"],"textSuffix":[1,"text-suffix"],"readonly":[4],"required":[4],"round":[4],"type":[1],"value":[8],"inputValue":[32],"setFocus":[64],"clear":[64]}],[0,"cat-toast-demo"],[1,"cat-avatar",{"size":[1],"round":[4],"label":[1],"initials":[1],"src":[1],"icon":[1],"url":[1],"urlTarget":[1,"url-target"],"backgroundImage":[32]}],[1,"cat-alert",{"color":[1]}],[1,"cat-badge",{"variant":[1],"color":[1],"size":[1],"round":[4],"pulse":[4]}],[1,"cat-card"],[1,"cat-checkbox",{"checked":[4],"disabled":[4],"indeterminate":[4],"label":[1],"labelHidden":[4,"label-hidden"],"name":[1],"required":[4],"value":[1],"setFocus":[64]}],[1,"cat-menu",{"placement":[1]},[[0,"catClick","clickHandler"]]],[1,"cat-radio",{"checked":[4],"disabled":[4],"label":[1],"labelHidden":[4,"label-hidden"],"name":[1],"required":[4],"value":[1],"setFocus":[64]}],[1,"cat-scrollable",{"noShadowX":[4,"no-shadow-x"],"noShadowY":[4,"no-shadow-y"],"noOverflowX":[4,"no-overflow-x"],"noOverflowY":[4,"no-overflow-y"],"noOverscroll":[4,"no-overscroll"],"noScrolledInit":[4,"no-scrolled-init"],"scrolledBuffer":[2,"scrolled-buffer"]}],[1,"cat-skeleton",{"effect":[1],"variant":[1],"size":[1],"lines":[2]}],[1,"cat-toggle",{"checked":[4],"disabled":[4],"label":[1],"labelHidden":[4,"label-hidden"],"name":[1],"required":[4],"value":[1],"setFocus":[64]}],[1,"cat-tooltip",{"content":[1],"disabled":[4],"placement":[1],"showDelay":[2,"show-delay"],"hideDelay":[2,"hide-delay"],"longTouchDuration":[2,"long-touch-duration"]},[[0,"keydown","handleKeyDown"]]],[1,"cat-button",{"variant":[1],"color":[1],"active":[4],"size":[1],"name":[1],"value":[1],"disabled":[4],"loading":[4],"submit":[4],"noEllipsis":[4,"no-ellipsis"],"round":[4],"url":[1],"urlTarget":[1,"url-target"],"icon":[1],"iconOnly":[8,"icon-only"],"iconRight":[4,"icon-right"],"buttonId":[1,"button-id"],"a11yLabel":[1,"a11y-label"],"_iconOnly":[32],"setFocus":[64]},[[0,"click","haltDisabledEvents"]]],[1,"cat-spinner",{"size":[1],"a11yLabel":[1,"a11y-label"]}],[1,"cat-icon",{"icon":[1],"size":[1],"a11yLabel":[1,"a11y-label"]}]]]], options);
 });
 
 //# sourceMappingURL=catalyst.js.map

package/dist/esm/loader.js

@@ -14,7 +14,7 @@ const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
   globalScripts();
-  return bootstrapLazy([["cat-textarea",[[1,"cat-textarea",{"disabled":[4],"hint":[1],"label":[1],"labelHidden":[4,"label-hidden"],"maxLength":[2,"max-length"],"minLength":[2,"min-length"],"name":[1],"placeholder":[1],"readonly":[4],"required":[4],"rows":[2],"value":[8],"setFocus":[64]}]]],["cat-alert_15",[[1,"cat-input",{"autoComplete":[1,"auto-complete"],"clearable":[4],"disabled":[4],"hint":[1],"icon":[1],"iconRight":[4,"icon-right"],"label":[1],"labelHidden":[4,"label-hidden"],"max":[2],"maxLength":[2,"max-length"],"min":[2],"minLength":[2,"min-length"],"name":[1],"placeholder":[1],"textPrefix":[1,"text-prefix"],"textSuffix":[1,"text-suffix"],"readonly":[4],"required":[4],"round":[4],"type":[1],"value":[8],"inputValue":[32],"setFocus":[64],"clear":[64]}],[0,"cat-toast-demo"],[1,"cat-alert",{"color":[1]}],[1,"cat-badge",{"variant":[1],"color":[1],"size":[1],"round":[4],"pulse":[4]}],[1,"cat-card"],[1,"cat-checkbox",{"checked":[4],"disabled":[4],"indeterminate":[4],"label":[1],"labelHidden":[4,"label-hidden"],"name":[1],"required":[4],"value":[1],"setFocus":[64]}],[1,"cat-menu",{"placement":[1]},[[0,"catClick","clickHandler"]]],[1,"cat-radio",{"checked":[4],"disabled":[4],"label":[1],"labelHidden":[4,"label-hidden"],"name":[1],"required":[4],"value":[1],"setFocus":[64]}],[1,"cat-scrollable",{"shadowX":[4,"shadow-x"],"shadowY":[4,"shadow-y"],"overflowX":[4,"overflow-x"],"overflowY":[4,"overflow-y"],"overscroll":[4],"scrolledInit":[4,"scrolled-init"],"scrolledBuffer":[2,"scrolled-buffer"]}],[1,"cat-skeleton",{"effect":[1],"variant":[1],"size":[1],"lines":[2]}],[1,"cat-toggle",{"checked":[4],"disabled":[4],"label":[1],"labelHidden":[4,"label-hidden"],"name":[1],"required":[4],"value":[1],"setFocus":[64]}],[1,"cat-tooltip",{"content":[1],"disabled":[4],"placement":[1],"showDelay":[2,"show-delay"],"hideDelay":[2,"hide-delay"],"longTouchDuration":[2,"long-touch-duration"]},[[0,"keydown","handleKeyDown"]]],[1,"cat-button",{"variant":[1],"color":[1],"active":[4],"size":[1],"name":[1],"value":[1],"disabled":[4],"loading":[4],"submit":[4],"ellipsed":[4],"round":[4],"url":[1],"urlTarget":[1,"url-target"],"icon":[1],"iconOnly":[8,"icon-only"],"iconRight":[4,"icon-right"],"buttonId":[1,"button-id"],"a11yLabel":[1,"a11y-label"],"_iconOnly":[32],"setFocus":[64]},[[0,"click","haltDisabledEvents"]]],[1,"cat-icon",{"icon":[1],"size":[1],"a11yLabel":[1,"a11y-label"]}],[1,"cat-spinner",{"size":[1],"a11yLabel":[1,"a11y-label"]}]]]], options);
+  return bootstrapLazy([["cat-textarea",[[1,"cat-textarea",{"disabled":[4],"hint":[1],"label":[1],"labelHidden":[4,"label-hidden"],"maxLength":[2,"max-length"],"minLength":[2,"min-length"],"name":[1],"placeholder":[1],"readonly":[4],"required":[4],"rows":[2],"value":[8],"setFocus":[64]}]]],["cat-alert_16",[[1,"cat-input",{"autoComplete":[1,"auto-complete"],"clearable":[4],"disabled":[4],"hint":[1],"icon":[1],"iconRight":[4,"icon-right"],"label":[1],"labelHidden":[4,"label-hidden"],"max":[2],"maxLength":[2,"max-length"],"min":[2],"minLength":[2,"min-length"],"name":[1],"placeholder":[1],"textPrefix":[1,"text-prefix"],"textSuffix":[1,"text-suffix"],"readonly":[4],"required":[4],"round":[4],"type":[1],"value":[8],"inputValue":[32],"setFocus":[64],"clear":[64]}],[0,"cat-toast-demo"],[1,"cat-avatar",{"size":[1],"round":[4],"label":[1],"initials":[1],"src":[1],"icon":[1],"url":[1],"urlTarget":[1,"url-target"],"backgroundImage":[32]}],[1,"cat-alert",{"color":[1]}],[1,"cat-badge",{"variant":[1],"color":[1],"size":[1],"round":[4],"pulse":[4]}],[1,"cat-card"],[1,"cat-checkbox",{"checked":[4],"disabled":[4],"indeterminate":[4],"label":[1],"labelHidden":[4,"label-hidden"],"name":[1],"required":[4],"value":[1],"setFocus":[64]}],[1,"cat-menu",{"placement":[1]},[[0,"catClick","clickHandler"]]],[1,"cat-radio",{"checked":[4],"disabled":[4],"label":[1],"labelHidden":[4,"label-hidden"],"name":[1],"required":[4],"value":[1],"setFocus":[64]}],[1,"cat-scrollable",{"noShadowX":[4,"no-shadow-x"],"noShadowY":[4,"no-shadow-y"],"noOverflowX":[4,"no-overflow-x"],"noOverflowY":[4,"no-overflow-y"],"noOverscroll":[4,"no-overscroll"],"noScrolledInit":[4,"no-scrolled-init"],"scrolledBuffer":[2,"scrolled-buffer"]}],[1,"cat-skeleton",{"effect":[1],"variant":[1],"size":[1],"lines":[2]}],[1,"cat-toggle",{"checked":[4],"disabled":[4],"label":[1],"labelHidden":[4,"label-hidden"],"name":[1],"required":[4],"value":[1],"setFocus":[64]}],[1,"cat-tooltip",{"content":[1],"disabled":[4],"placement":[1],"showDelay":[2,"show-delay"],"hideDelay":[2,"hide-delay"],"longTouchDuration":[2,"long-touch-duration"]},[[0,"keydown","handleKeyDown"]]],[1,"cat-button",{"variant":[1],"color":[1],"active":[4],"size":[1],"name":[1],"value":[1],"disabled":[4],"loading":[4],"submit":[4],"noEllipsis":[4,"no-ellipsis"],"round":[4],"url":[1],"urlTarget":[1,"url-target"],"icon":[1],"iconOnly":[8,"icon-only"],"iconRight":[4,"icon-right"],"buttonId":[1,"button-id"],"a11yLabel":[1,"a11y-label"],"_iconOnly":[32],"setFocus":[64]},[[0,"click","haltDisabledEvents"]]],[1,"cat-spinner",{"size":[1],"a11yLabel":[1,"a11y-label"]}],[1,"cat-icon",{"icon":[1],"size":[1],"a11yLabel":[1,"a11y-label"]}]]]], options);
   });
 };
 

package/dist/types/components/cat-avatar/cat-avatar.d.ts

@@ -0,0 +1,46 @@
+/**
+ * Avatars are used to represent a person or object.
+ */
+export declare class CatAvatar {
+  backgroundImage?: string;
+  /**
+   * The size of the avatar.
+   */
+  size: 'xs' | 's' | 'm' | 'l' | 'xl';
+  /**
+   * Use round avatar edges.
+   */
+  round: boolean;
+  /**
+   * The label of the avatar.
+   */
+  label: string;
+  /**
+   * Custom initials for the avatar.
+   */
+  initials?: string;
+  /**
+   * An optional avatar image.
+   */
+  src?: string;
+  /**
+   * An icon to be used instead of the initials.
+   */
+  icon?: string;
+  /**
+   * A destination to link to, rendered in the href attribute of a link.
+   */
+  url?: string;
+  /**
+   * Specifies where to open the linked document.
+   */
+  urlTarget?: '_blank' | '_self';
+  onSrcChanged(value?: string): void;
+  componentWillLoad(): void;
+  componentWillRender(): void;
+  render(): any;
+  private get content();
+  private get cssStyle();
+  private get cssClass();
+  private getInitials;
+}

package/dist/types/components/cat-button/cat-button.d.ts

@@ -59,9 +59,9 @@ export declare class CatButton {
    */
   submit: boolean;
   /**
-   * Ellipse overflowing button content.
+   * Disables ellipse overflowing button content.
    */
-  ellipsed: boolean;
+  noEllipsis: boolean;
   /**
    * Use round button edges.
    */

package/dist/types/components/cat-scrollable/cat-scrollable.d.ts

@@ -8,20 +8,20 @@ export declare class CatScrollable {
   private readonly init;
   private readonly destroyed;
   private scrolled;
-  /** Flags to enable/disable scroll shadowX. */
-  shadowX: boolean;
-  /** Flags to enable/disable scroll shadowY. */
-  shadowY: boolean;
-  /** Flags to enable/disable overflowX. */
-  overflowX: boolean;
-  /** Flags to enable/disable overflowY. */
-  overflowY: boolean;
-  /** Flag to enable/disable overscroll behavior. */
-  overscroll: boolean;
+  /** Flags to disable/enable scroll shadowX. */
+  noShadowX: boolean;
+  /** Flags to disable/enable scroll shadowY. */
+  noShadowY: boolean;
+  /** Flags to disable/enable overflowX. */
+  noOverflowX: boolean;
+  /** Flags to disable/enable overflowY. */
+  noOverflowY: boolean;
+  /** Flag to disable/enable overscroll behavior. */
+  noOverscroll: boolean;
   /**
-   * Flag to fire an initial event after content initialization.
+   * Flag to not fire an initial event after content initialization.
    */
-  scrolledInit: boolean;
+  noScrolledInit: boolean;
   /**
    * Buffer to be used to calculate the scroll distance.
    */

package/dist/types/components.d.ts

@@ -14,6 +14,40 @@ export namespace Components {
          */
         "color": 'primary' | 'secondary' | 'danger' | 'success' | 'warning';
     }
+    interface CatAvatar {
+        /**
+          * An icon to be used instead of the initials.
+         */
+        "icon"?: string;
+        /**
+          * Custom initials for the avatar.
+         */
+        "initials"?: string;
+        /**
+          * The label of the avatar.
+         */
+        "label": string;
+        /**
+          * Use round avatar edges.
+         */
+        "round": boolean;
+        /**
+          * The size of the avatar.
+         */
+        "size": 'xs' | 's' | 'm' | 'l' | 'xl';
+        /**
+          * An optional avatar image.
+         */
+        "src"?: string;
+        /**
+          * A destination to link to, rendered in the href attribute of a link.
+         */
+        "url"?: string;
+        /**
+          * Specifies where to open the linked document.
+         */
+        "urlTarget"?: '_blank' | '_self';
+    }
     interface CatBadge {
         /**
           * The color palette of the badge.
@@ -57,10 +91,6 @@ export namespace Components {
           * Specifies that the button should be disabled. A disabled button is unusable and un-clickable. Corresponds with the native HTML disabled attribute.
          */
         "disabled": boolean;
-        /**
-          * Ellipse overflowing button content.
-         */
-        "ellipsed": boolean;
         /**
           * The name of an icon to be displayed in the button.
          */
@@ -81,6 +111,10 @@ export namespace Components {
           * The name of the button, which gets paired with the button's value when submitted as part of a form. Corresponds with the native HTML name attribute.
          */
         "name"?: string;
+        /**
+          * Disables ellipse overflowing button content.
+         */
+        "noEllipsis": boolean;
         /**
           * Use round button edges.
          */
@@ -308,33 +342,33 @@ export namespace Components {
     }
     interface CatScrollable {
         /**
-          * Flags to enable/disable overflowX.
+          * Flags to disable/enable overflowX.
          */
-        "overflowX": boolean;
+        "noOverflowX": boolean;
         /**
-          * Flags to enable/disable overflowY.
+          * Flags to disable/enable overflowY.
          */
-        "overflowY": boolean;
+        "noOverflowY": boolean;
         /**
-          * Flag to enable/disable overscroll behavior.
+          * Flag to disable/enable overscroll behavior.
          */
-        "overscroll": boolean;
+        "noOverscroll": boolean;
         /**
-          * Buffer to be used to calculate the scroll distance.
+          * Flag to not fire an initial event after content initialization.
          */
-        "scrolledBuffer": number;
+        "noScrolledInit": boolean;
         /**
-          * Flag to fire an initial event after content initialization.
+          * Flags to disable/enable scroll shadowX.
          */
-        "scrolledInit": boolean;
+        "noShadowX": boolean;
         /**
-          * Flags to enable/disable scroll shadowX.
+          * Flags to disable/enable scroll shadowY.
          */
-        "shadowX": boolean;
+        "noShadowY": boolean;
         /**
-          * Flags to enable/disable scroll shadowY.
+          * Buffer to be used to calculate the scroll distance.
          */
-        "shadowY": boolean;
+        "scrolledBuffer": number;
     }
     interface CatSkeleton {
         /**
@@ -490,6 +524,12 @@ declare global {
         prototype: HTMLCatAlertElement;
         new (): HTMLCatAlertElement;
     };
+    interface HTMLCatAvatarElement extends Components.CatAvatar, HTMLStencilElement {
+    }
+    var HTMLCatAvatarElement: {
+        prototype: HTMLCatAvatarElement;
+        new (): HTMLCatAvatarElement;
+    };
     interface HTMLCatBadgeElement extends Components.CatBadge, HTMLStencilElement {
     }
     var HTMLCatBadgeElement: {
@@ -582,6 +622,7 @@ declare global {
     };
     interface HTMLElementTagNameMap {
         "cat-alert": HTMLCatAlertElement;
+        "cat-avatar": HTMLCatAvatarElement;
         "cat-badge": HTMLCatBadgeElement;
         "cat-button": HTMLCatButtonElement;
         "cat-card": HTMLCatCardElement;
@@ -606,6 +647,40 @@ declare namespace LocalJSX {
          */
         "color"?: 'primary' | 'secondary' | 'danger' | 'success' | 'warning';
     }
+    interface CatAvatar {
+        /**
+          * An icon to be used instead of the initials.
+         */
+        "icon"?: string;
+        /**
+          * Custom initials for the avatar.
+         */
+        "initials"?: string;
+        /**
+          * The label of the avatar.
+         */
+        "label"?: string;
+        /**
+          * Use round avatar edges.
+         */
+        "round"?: boolean;
+        /**
+          * The size of the avatar.
+         */
+        "size"?: 'xs' | 's' | 'm' | 'l' | 'xl';
+        /**
+          * An optional avatar image.
+         */
+        "src"?: string;
+        /**
+          * A destination to link to, rendered in the href attribute of a link.
+         */
+        "url"?: string;
+        /**
+          * Specifies where to open the linked document.
+         */
+        "urlTarget"?: '_blank' | '_self';
+    }
     interface CatBadge {
         /**
           * The color palette of the badge.
@@ -649,10 +724,6 @@ declare namespace LocalJSX {
           * Specifies that the button should be disabled. A disabled button is unusable and un-clickable. Corresponds with the native HTML disabled attribute.
          */
         "disabled"?: boolean;
-        /**
-          * Ellipse overflowing button content.
-         */
-        "ellipsed"?: boolean;
         /**
           * The name of an icon to be displayed in the button.
          */
@@ -673,6 +744,10 @@ declare namespace LocalJSX {
           * The name of the button, which gets paired with the button's value when submitted as part of a form. Corresponds with the native HTML name attribute.
          */
         "name"?: string;
+        /**
+          * Disables ellipse overflowing button content.
+         */
+        "noEllipsis"?: boolean;
         /**
           * Emitted when the button loses focus.
          */
@@ -932,49 +1007,49 @@ declare namespace LocalJSX {
     }
     interface CatScrollable {
         /**
-          * Emitted when the content is fully scrolled to the bottom.
+          * Flags to disable/enable overflowX.
          */
-        "onScrolledBottom"?: (event: CustomEvent<void>) => void;
+        "noOverflowX"?: boolean;
         /**
-          * Emitted when the content is fully scrolled to the left.
+          * Flags to disable/enable overflowY.
          */
-        "onScrolledLeft"?: (event: CustomEvent<void>) => void;
+        "noOverflowY"?: boolean;
         /**
-          * Emitted when the content is fully scrolled to the right.
+          * Flag to disable/enable overscroll behavior.
          */
-        "onScrolledRight"?: (event: CustomEvent<void>) => void;
+        "noOverscroll"?: boolean;
         /**
-          * Emitted when the content is fully scrolled to the top.
+          * Flag to not fire an initial event after content initialization.
          */
-        "onScrolledTop"?: (event: CustomEvent<void>) => void;
+        "noScrolledInit"?: boolean;
         /**
-          * Flags to enable/disable overflowX.
+          * Flags to disable/enable scroll shadowX.
          */
-        "overflowX"?: boolean;
+        "noShadowX"?: boolean;
         /**
-          * Flags to enable/disable overflowY.
+          * Flags to disable/enable scroll shadowY.
          */
-        "overflowY"?: boolean;
+        "noShadowY"?: boolean;
         /**
-          * Flag to enable/disable overscroll behavior.
+          * Emitted when the content is fully scrolled to the bottom.
          */
-        "overscroll"?: boolean;
+        "onScrolledBottom"?: (event: CustomEvent<void>) => void;
         /**
-          * Buffer to be used to calculate the scroll distance.
+          * Emitted when the content is fully scrolled to the left.
          */
-        "scrolledBuffer"?: number;
+        "onScrolledLeft"?: (event: CustomEvent<void>) => void;
         /**
-          * Flag to fire an initial event after content initialization.
+          * Emitted when the content is fully scrolled to the right.
          */
-        "scrolledInit"?: boolean;
+        "onScrolledRight"?: (event: CustomEvent<void>) => void;
         /**
-          * Flags to enable/disable scroll shadowX.
+          * Emitted when the content is fully scrolled to the top.
          */
-        "shadowX"?: boolean;
+        "onScrolledTop"?: (event: CustomEvent<void>) => void;
         /**
-          * Flags to enable/disable scroll shadowY.
+          * Buffer to be used to calculate the scroll distance.
          */
-        "shadowY"?: boolean;
+        "scrolledBuffer"?: number;
     }
     interface CatSkeleton {
         /**
@@ -1138,6 +1213,7 @@ declare namespace LocalJSX {
     }
     interface IntrinsicElements {
         "cat-alert": CatAlert;
+        "cat-avatar": CatAvatar;
         "cat-badge": CatBadge;
         "cat-button": CatButton;
         "cat-card": CatCard;
@@ -1160,6 +1236,7 @@ declare module "@stencil/core" {
     export namespace JSX {
         interface IntrinsicElements {
             "cat-alert": LocalJSX.CatAlert & JSXBase.HTMLAttributes<HTMLCatAlertElement>;
+            "cat-avatar": LocalJSX.CatAvatar & JSXBase.HTMLAttributes<HTMLCatAvatarElement>;
             "cat-badge": LocalJSX.CatBadge & JSXBase.HTMLAttributes<HTMLCatBadgeElement>;
             "cat-button": LocalJSX.CatButton & JSXBase.HTMLAttributes<HTMLCatButtonElement>;
             "cat-card": LocalJSX.CatCard & JSXBase.HTMLAttributes<HTMLCatCardElement>;

package/dist/types/utils/load-img.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Loads an image and wraps the result in a promise.
+ *
+ * @param src the image URL
+ * @returns a promise
+ */
+declare const loadImg: (src: string) => Promise<Event>;
+export default loadImg;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@haiilo/catalyst",
-  "version": "0.5.14",
+  "version": "0.6.0",
   "description": "Catalyst Design System",
   "license": "MIT",
   "repository": {
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@floating-ui/dom": "0.4.1",
-    "@haiilo/catalyst-tokens": "^0.5.14",
+    "@haiilo/catalyst-tokens": "^0.6.0",
     "@stencil/core": "2.15.0",
     "autosize": "^5.0.1",
     "focus-trap": "6.8.1",