@codeandfunction/callaloo 3.12.0 → 3.12.2

package/dist/types.d.ts

@@ -1,46 +1,10 @@
-export declare enum Align {
+export declare enum CLAlign {
     Left = "left",
     Center = "center",
     Right = "right"
 }
-export interface BannerProps {
-    /** The action label text to be displayed. */
-    actionLabel?: string;
-    /** Set the horizontal alignment of content. The property can be one of `CLAlign`, e.g. `CLAlign.Left`  */
-    align?: Align;
-    /** Sets the aria-label on the banner if the `onClick` property has been set. It should be used when the `onClick` property has been set. */
-    ariaLabel?: string;
-    /** A boolean value when set to `true`, adds a border to the banner.  */
-    bordered?: boolean;
-    /** The border radius size. The property can be one of `CLBorderRadius`, e.g. `CLBorderRadius.Medium`. */
-    borderRadius?: BorderRadius;
-    /** A `boolean` value which dictates the busy state of the Banner. When set to `true`, it utilizes the `<CLSkeleton />` component. */
-    busy?: boolean;
-    /** Sets the color of the Badge. The property can be one of `CLColors`, e.g. `CLColors.Primary`. */
-    color?: Colors;
-    /** Sets the height of the Banner, it's default value is `auto`. */
-    height?: string;
-    /** The text to be displayed as the message. */
-    message?: string;
-    /** A callback function to handle click events  */
-    onAction?: GenericFunction;
-    /** A callback function to handle click events. It should be used when in conjunction with the `ariaLabel` property. */
-    onClick?: GenericFunction;
-    /** A callback function to handle when the banner is dismissed. */
-    onDismiss?: GenericFunction;
-    /** When set to `false` it will not render a Banner with rounded corners. */
-    rounded?: boolean;
-    /** Sets a custom ID used for unit tests. */
-    testId?: string;
-    /** Set the text of the title which should be displayed. */
-    title?: string;
-    /** Sets the width of the Banner, it's default value is `100%`. */
-    width?: string;
-    /** Sets the color variant. The property can be one of `ColorVariants.Ghost | ColorVariants.Outline | ColorVariants.Soft | ColorVariants.Solid`, e.g `CLColorVariants.Soft`. */
-    variant?: ColorVariants.Ghost | ColorVariants.Outline | ColorVariants.Soft | ColorVariants.Solid;
-}
-export type BlockTextHtmlTags = 'blockquote' | 'dd' | 'div' | 'dl' | 'dt' | 'figcaption' | 'figure' | 'hr' | 'li' | 'menu' | 'ol' | 'p' | 'pre' | 'ul';
-export declare enum BorderRadius {
+export type CLBlockTextHtmlTags = 'blockquote' | 'dd' | 'div' | 'dl' | 'dt' | 'figcaption' | 'figure' | 'hr' | 'li' | 'menu' | 'ol' | 'p' | 'pre' | 'ul';
+export declare enum CLBorderRadius {
     Full = "rounded-full",
     Large = "rounded-lg",
     Medium = "rounded-md",
@@ -51,83 +15,19 @@ export declare enum BorderRadius {
     XXXL = "rounded-3xl",
     XS = "rounded-xs"
 }
-export type ButtonTags = 'a' | 'button';
-export declare enum ButtonTypes {
+export type CLButtonTags = 'a' | 'button';
+export declare enum CLButtonTypes {
     Button = "button",
     Submit = "submit"
 }
-export declare enum CardTypes {
+export declare enum CLCardTypes {
     Tiny = "tiny",
     Small = "small",
     Medium = "medium",
     Large = "large",
     XL = "xlarge"
 }
-export interface CardProps {
-    /** When set to `true`, it elelvates the card to indicate it's active state. */
-    active?: boolean;
-    /** Set the horizontal alignment of content. The property can be one of `CLAlign`, e.g. `CLAlign.Left`  */
-    align?: Align;
-    /** Sets the aria-label if the `onClick` or `href` property has been set. It should be used when the `onClick` or `href` property has been set. */
-    ariaLabel?: string;
-    /** The border radius size. The property can be one of `CLBorderRadius`, e.g. `CLBorderRadius.Medium`. */
-    borderRadius?: BorderRadius;
-    /** A boolean value when set to `true`, adds a border to the card.  */
-    bordered?: boolean;
-    /** A `boolean` value which dictates the busy state of the card. When set to `true`, it utilizes the `<CLSkeleton />` component. */
-    busy?: boolean;
-    /** Appears below the title. Can be used to provide meta data, e.g. the time and date. */
-    byline?: string;
-    /** Sets the color of the Card. The property can be one of `CLColors`, e.g. `CLColors.Primary`. */
-    color?: Colors;
-    /** A boolean value which dictates the compact state of the card. When set to `true`, it utilizes a more compact layout. */
-    compact?: boolean;
-    /** The `elevated` property displays a shadow to indicate elevation. */
-    elevated?: boolean;
-    /** A callback function which provides a reference to the button. */
-    forwardRef?: (elem: HTMLDivElement) => void;
-    /** Sets the height of the Card, it's default value is `auto`. */
-    height?: string;
-    /** Provide a URL for the entire Card to behave as a link. */
-    href?: string;
-    /** Provide a URL/relative path to an image to be displayed. */
-    image?: string;
-    /** Set the alt text for an image, when the image prop has been set. */
-    imageAltText?: string;
-    /** Set the position of the image. If the row prop is not set, the image can be set to appear to the left or right of the slot content. */
-    imageOrder?: Order;
-    /** Sets the height of the image, it's default value is `auto`. */
-    imageHeight?: string;
-    /** Sets the width of the image, it's default value is `auto`. */
-    imageWidth?: string;
-    /** Indicates how the browser should load the image. Default is `CLLoading.Eager`*/
-    imageLoading?: Loading;
-    /** A callback function to handle click events. */
-    onClick?: GenericFunction;
-    /** When set to `false`, it will remove any horizontal and vertical padding of the slot content. */
-    padded?: boolean;
-    /** When set to `false` it will not render a Card with rounded corners. */
-    rounded?: boolean;
-    /** Sets where to display the linked URL. */
-    target?: LinkTarget;
-    /** Sets a custom ID used for unit tests. */
-    testId?: string;
-    /** Set the text of the title which should be displayed. */
-    title?: string;
-    /** Set the title type. The property can be one of `CLHeadingTypes`, e.g. `CLHeadingTypes.Title` */
-    titleType?: HeadingTypes;
-    /** Set the title heading level. The property can be one of `CLHeadingLevels`, e.g. `CLHeadingLevels.H1` */
-    titleHLevel?: HeadingLevels;
-    /** When set to `true`, truncate the title if it overflows its container. */
-    truncateTitle?: boolean;
-    /** Sets the Card type. The property can be one of `CLCardTypes`, e.g. `CLCardTypes.Medium`. */
-    type?: CardTypes;
-    /** Sets the width of the Card, it's default value is `auto`. */
-    width?: string;
-    /** Sets the color variant. The property can be on of `CLColorVariants`, e.g `CLColorVariants.Soft`. */
-    variant?: ColorVariants;
-}
-export declare enum Colors {
+export declare enum CLColors {
     Primary = "primary",
     Secondary = "secondary",
     Danger = "danger",
@@ -136,7 +36,7 @@ export declare enum Colors {
     Warning = "warning",
     Success = "success"
 }
-export declare enum ColorVariants {
+export declare enum CLColorVariants {
     Contrast = "contrast",
     Ghost = "ghost",
     Outline = "outline",
@@ -144,10 +44,11 @@ export declare enum ColorVariants {
     Solid = "solid",
     Text = "text"
 }
-export type GenericFunction = (event?: Event) => void;
-export type GenericFocusFunction = (event: FocusEvent) => void;
-export type GenericInputFunction = (event?: Event) => void;
-export declare enum HeadingLevels {
+export type CLButtonForwardRefFunction = (elem: HTMLButtonElement) => void;
+export type CLGenericFunction = (event?: Event) => void;
+export type CLGenericFocusFunction = (event: FocusEvent) => void;
+export type CLGenericInputFunction = (event?: Event) => void;
+export declare enum CLHeadingLevels {
     H1 = "h1",
     H2 = "h2",
     H3 = "h3",
@@ -155,7 +56,7 @@ export declare enum HeadingLevels {
     H5 = "h5",
     H6 = "h6"
 }
-export declare enum HeadingTypes {
+export declare enum CLHeadingTypes {
     Title = "title",
     PageTitle = "pagetitle",
     Section = "section",
@@ -165,7 +66,7 @@ export declare enum HeadingTypes {
     Large = "large",
     XL = "xlarge"
 }
-export declare enum IconSizes {
+export declare enum CLIconSizes {
     Tiny = "tiny",
     Small = "small",
     Medium = "medium",
@@ -175,7 +76,7 @@ export declare enum IconSizes {
     XXXL = "xxxlarge",
     XXXXL = "xxxxlarge"
 }
-export declare enum IconNames {
+export declare enum CLIconNames {
     Activity = "tabler:activity",
     Adjustments = "tabler:adjustments",
     AdjustmentsHorizontal = "tabler:adjustments-horizontal",
@@ -561,8 +462,8 @@ export declare enum IconNames {
     WindowMinimize = "tabler:window-minimize",
     WorldWww = "tabler:world-www"
 }
-export type InlineTextHtmlTags = 'a' | 'abbr' | 'b' | 'bdi' | 'bdo' | 'br' | 'cite' | 'code' | 'data' | 'dfn' | 'em' | 'i' | 'kbd' | 'mark' | 'q' | 'rp' | 'rt' | 'ruby' | 's' | 'samp' | 'small' | 'span' | 'strong' | 'sub' | 'sup' | 'time' | 'u' | 'var' | 'wbr';
-export declare enum InputTypes {
+export type CLInlineTextHtmlTags = 'a' | 'abbr' | 'b' | 'bdi' | 'bdo' | 'br' | 'cite' | 'code' | 'data' | 'dfn' | 'em' | 'i' | 'kbd' | 'mark' | 'q' | 'rp' | 'rt' | 'ruby' | 's' | 'samp' | 'small' | 'span' | 'strong' | 'sub' | 'sup' | 'time' | 'u' | 'var' | 'wbr';
+export declare enum CLInputTypes {
     Color = "color",
     Date = "date",
     DateTimeLocal = "datetime-local",
@@ -579,29 +480,29 @@ export declare enum InputTypes {
     Time = "time",
     Url = "url"
 }
-export declare enum Loading {
+export declare enum CLLoading {
     Eager = "eager",
     Lazy = "lazy"
 }
-export declare enum LinkTarget {
+export declare enum CLLinkTarget {
     Blank = "_blank",
     Self = "_self"
 }
-export declare enum MessageType {
+export declare enum CLMessageType {
     Danger = "danger",
     Default = "default",
     Success = "success",
     Warning = "warning"
 }
-export declare enum Mode {
+export declare enum CLMode {
     Dark = "dark",
     Light = "light"
 }
-export interface NavItem {
+export interface CLNavItem {
     /** Sets the aria-label on the NavLink element. */
     ariaLabel?: string;
     /** Sets the color of the NavLink element. The property can be one of `CLColors`, e.g. `CLColors.Default` */
-    color?: Colors;
+    color?: CLColors;
     /** Sets the external attribute on the NavLink element. If set, it adds an icon indicating that the link will open a new tab/window. */
     external?: boolean;
     /** Sets the href attribute on the NavLink element. */
@@ -611,41 +512,42 @@ export interface NavItem {
     /** The text to be displayed as the label. */
     label: string;
     /** A callback function to handle click events. */
-    onClick?: GenericFunction;
+    onClick?: CLGenericFunction;
     /** Sets the rel attribute on the NavLink element. */
     rel?: string;
     /** Sets the target attribute on the NavLink element. The property can be one of `CLLinkTarget`, e.g. `CLLinkTarget.Self` */
-    target?: LinkTarget;
+    target?: CLLinkTarget;
 }
-export interface Option {
+export interface CLOption {
     label: string;
     value: string | number | boolean | null;
     disabled?: boolean;
 }
-export declare enum Order {
+export declare enum CLOrder {
     After = "after",
     Before = "before"
 }
-export declare enum Orientation {
+export declare enum CLOrientation {
     Horizontal = "horizontal",
     Vertical = "vertical"
 }
-export declare enum PaginationType {
+export declare enum CLPaginationType {
     Dots = "dots",
     Hidden = "hidden",
     Inline = "inline",
     Numbered = "numbered"
 }
-export interface Palette {
-    primary?: Shades;
-    secondary?: Shades;
-    neutral?: Shades;
-    danger?: Shades;
-    warning?: Shades;
-    success?: Shades;
-    info?: Shades;
+export interface CLPalette {
+    primary?: CLShades;
+    secondary?: CLShades;
+    neutral?: CLShades;
+    danger?: CLShades;
+    warning?: CLShades;
+    success?: CLShades;
+    info?: CLShades;
 }
-export declare enum Placement {
+export type CLPaletteKeys = keyof CLPalette;
+export declare enum CLPlacement {
     Bottom = "bottom",
     BottomEnd = "bottom-end",
     BottomStart = "bottom-start",
@@ -659,24 +561,25 @@ export declare enum Placement {
     TopEnd = "top-end",
     TopStart = "top-start"
 }
-export declare enum Position {
+export declare enum CLPosition {
     Absolute = "absolute",
     Relative = "relative"
 }
-export declare enum Sizes {
+export declare enum CLSizes {
     Tiny = "tiny",
     Small = "small",
     Medium = "medium",
     Large = "large",
     XL = "xlarge"
 }
-export declare enum TableTypes {
+export type CLShades = Record<number, string>;
+export declare enum CLTableTypes {
     Condensed = "condensed",
     Default = "default",
     Plain = "plain"
 }
-export type TextHtmlTags = BlockTextHtmlTags | InlineTextHtmlTags;
-export declare enum TextTypes {
+export type CLTextHtmlTags = CLBlockTextHtmlTags | CLInlineTextHtmlTags;
+export declare enum CLTextTypes {
     Body = "body",
     Summary = "summary",
     Tiny = "tiny",
@@ -685,16 +588,14 @@ export declare enum TextTypes {
     Large = "large",
     XL = "xlarge"
 }
-export type Shades = Record<number, string>;
-export interface ThemeConfig {
-    colors?: Palette;
+export interface CLThemeConfig {
+    colors?: CLPalette;
     darkMode: boolean;
     fontFamily?: string;
-    mode?: Mode;
-    borderRadius?: BorderRadius;
+    mode?: CLMode;
+    borderRadius?: CLBorderRadius;
 }
-export type PaletteKeys = keyof Palette;
-export declare enum ToastPosition {
+export declare enum CLToastPosition {
     TopLeft = "top-left",
     TopCenter = "top-center",
     TopRight = "top-right",
@@ -702,35 +603,35 @@ export declare enum ToastPosition {
     BottomCenter = "bottom-center",
     BottomRight = "bottom-right"
 }
-export interface ToastProps {
-    /** The action label text to be displayed. */
+export interface CLToastProps {
+    /** The action label text to be displayed */
     actionLabel?: string;
-    /** The border radius size. The property can be one of `CLBorderRadius`, e.g. `CLBorderRadius.Medium`. */
-    borderRadius?: BorderRadius;
-    /** Sets the color of the buttons and icons. The property can be one of `CLColors`, e.g. `CLColors.Default` */
-    color?: Colors;
+    /** The border radius size */
+    borderRadius?: CLBorderRadius;
+    /** Sets the color of the buttons and icons */
+    color?: CLColors;
     /** Time in seconds e.g 5 = 5 seconds */
     dismissTimer?: number;
-    /** The icon to be displayed. The property can be one of `CLIconNames`, e.g. `CLIconNames.Info`. */
-    icon?: IconNames;
-    /** The size of the icon. The property can be one of `CLSizes`, e.g. `CLSizes.Medium */
-    iconSize?: IconSizes;
-    /** The text to be displayed as the message. */
+    /** The icon to be displayed */
+    icon?: CLIconNames;
+    /** The size of the icon */
+    iconSize?: CLIconSizes;
+    /** The text to be displayed as the message */
     message?: string;
-    /** Sets the position of the toast. The property can be one of `CLToastPosition`, e.g `CLToastPosition.TopRight`. */
-    position?: ToastPosition;
-    /** A callback function to handle click events. */
-    onAction?: GenericFunction;
-    /** A callback function to handle when the toast is dismissed. */
-    onDismiss: GenericFunction;
-    /** When set to `false` it will not render a Toast with rounded corners. */
+    /** A callback function to handle click events */
+    onAction?: CLGenericFunction;
+    /** A callback function to handle when the toast is dismissed */
+    onDismiss: CLGenericFunction;
+    /** Sets the position of the toast */
+    position?: CLToastPosition;
+    /** When set to `false` it will not render a Toast with rounded corners */
     rounded?: boolean;
-    /** Sets a custom ID used for unit tests. */
+    /** Sets a custom ID used for unit tests */
     testId?: string;
-    /** Set the text of the title which should be displayed. */
+    /** Set the text of the title which should be displayed */
     title?: string;
-    /** Sets the color variant o the buttons and icons. The property can be on of `CLColorVariants`, e.g `CLColorVariants.Soft`. */
-    variant?: ColorVariants;
+    /** Sets the color variant of the buttons and icons */
+    variant?: CLColorVariants;
     /** Sets the width of the Toast, it's default value is `24rem`. */
     width?: string;
 }

package/package.json

@@ -17,15 +17,15 @@
     "ui components",
     "vuejs"
   ],
-  "version": "3.12.0",
+  "version": "3.12.2",
   "license": "MIT",
   "type": "module",
   "scripts": {
     "build": "pnpm export:icons && vite build",
     "build:storybook": "pnpm export:icons && pnpm storybook build",
     "coverage": "vitest run --coverage",
-    "export:icons": "npx tsx export-icons.ts",
-    "export:meta": "npx tsx export-meta.ts",
+    "export:icons": "npx tsx scripts/export-icons.ts",
+    "export:meta": "npx tsx scripts/export-meta.ts",
     "lint": "pnpm lint:js && pnpm lint:prettier",
     "lint:js": "eslint 'src/**/*.{ts,vue}'",
     "lint:js:fix": "eslint 'src/**/*.{ts,vue}' --fix",
@@ -68,13 +68,13 @@
     "@storybook/test-runner": "^0.23.0",
     "@storybook/vue3-vite": "^9.1.9",
     "@types/lodash-es": "^4.17.12",
-    "@types/node": "22.13.1",
+    "@types/node": "^22.18.8",
     "@types/stylis": "^4.2.7",
     "@vitejs/plugin-vue": "^5.2.4",
     "@vitejs/plugin-vue-jsx": "^4.2.0",
-    "@vitest/browser": "3.0.4",
-    "@vitest/coverage-istanbul": "3.0.4",
-    "@vitest/coverage-v8": "3.0.4",
+    "@vitest/browser": "3.2.4",
+    "@vitest/coverage-istanbul": "3.2.4",
+    "@vitest/coverage-v8": "3.2.4",
     "@vitest/ui": "^3.2.4",
     "@vue/test-utils": "^2.4.6",
     "@vue/tsconfig": "^0.7.0",
@@ -93,13 +93,15 @@
     "storybook": "^9.1.9",
     "storybook-addon-deep-controls": "^0.9.5",
     "stylis": "^4.3.6",
+    "tsx": "^4.20.6",
     "unplugin-auto-import": "^19.3.0",
-    "vite": "6.0.11",
+    "vite": "^6.3.6",
     "vite-plugin-dts": "^4.5.4",
     "vite-tsconfig-paths": "^5.1.4",
-    "vitest": "3.0.4",
+    "vitest": "3.2.4",
     "vue": "^3.5.18",
     "vue-component-meta": "^3.1.0",
+    "vue-docgen-api": "^4.79.2",
     "vue-router": "^4.5.1",
     "vue-tsc": "^2.2.12"
   },