@pathscale/ui 0.1.0 → 1.2.0

package/dist/components/size-picker/SizePicker.js

@@ -0,0 +1,63 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+import * as __WEBPACK_EXTERNAL_MODULE_clsx__ from "clsx";
+import * as __WEBPACK_EXTERNAL_MODULE__button_index_js_557db1f7__ from "../button/index.js";
+import * as __WEBPACK_EXTERNAL_MODULE__sizeStore_js_308b1735__ from "./sizeStore.js";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div role=radiogroup>");
+const PRESETS = [
+    "M",
+    "L",
+    "XL"
+];
+const SizePicker_SizePicker = (props)=>{
+    const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "storagePrefix",
+        "onSizeChange",
+        "aria-label",
+        "class",
+        "className",
+        "style",
+        "dataTheme"
+    ]);
+    const store = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE__sizeStore_js_308b1735__.createSizeStore)(local.storagePrefix ?? "theme"));
+    const handleClick = (preset)=>{
+        store().setSize(preset);
+        local.onSizeChange?.(preset);
+    };
+    const classes = ()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("inline-flex gap-1", (0, __WEBPACK_EXTERNAL_MODULE_clsx__.clsx)(local.class, local.className));
+    return (()=>{
+        var _el$ = _tmpl$();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+            get ["class"] () {
+                return classes();
+            },
+            get style () {
+                return local.style;
+            },
+            get ["aria-label"] () {
+                return local["aria-label"] ?? "Change text size";
+            }
+        }, others), false, true);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.For, {
+            each: PRESETS,
+            children: (preset)=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__button_index_js_557db1f7__["default"], {
+                    type: "button",
+                    size: "sm",
+                    get variant () {
+                        return store().size() === preset ? "primary" : "ghost";
+                    },
+                    onClick: ()=>handleClick(preset),
+                    role: "radio",
+                    get ["aria-checked"] () {
+                        return store().size() === preset;
+                    },
+                    "aria-label": `Size ${preset}`,
+                    children: preset
+                })
+        }));
+        return _el$;
+    })();
+};
+const SizePicker = SizePicker_SizePicker;
+export { SizePicker as default };

package/dist/components/size-picker/index.d.ts

@@ -0,0 +1,3 @@
+export { default as SizePicker } from "./SizePicker";
+export type { SizePickerProps } from "./SizePicker";
+export { createSizeStore, getDefaultSizeStore, type SizeStore, type SizePreset, } from "./sizeStore";

package/dist/components/size-picker/index.js

@@ -0,0 +1,6 @@
+import * as __WEBPACK_EXTERNAL_MODULE__SizePicker_js_9cdb43f2__ from "./SizePicker.js";
+import * as __WEBPACK_EXTERNAL_MODULE__sizeStore_js_308b1735__ from "./sizeStore.js";
+var __webpack_exports__SizePicker = __WEBPACK_EXTERNAL_MODULE__SizePicker_js_9cdb43f2__["default"];
+var __webpack_exports__createSizeStore = __WEBPACK_EXTERNAL_MODULE__sizeStore_js_308b1735__.createSizeStore;
+var __webpack_exports__getDefaultSizeStore = __WEBPACK_EXTERNAL_MODULE__sizeStore_js_308b1735__.getDefaultSizeStore;
+export { __webpack_exports__SizePicker as SizePicker, __webpack_exports__createSizeStore as createSizeStore, __webpack_exports__getDefaultSizeStore as getDefaultSizeStore };

package/dist/components/size-picker/sizeStore.d.ts

@@ -0,0 +1,8 @@
+export type SizePreset = "M" | "L" | "XL";
+export interface SizeStore {
+    size: () => SizePreset;
+    setSize: (size: SizePreset) => void;
+    scale: () => number;
+}
+export declare function createSizeStore(storagePrefix: string): SizeStore;
+export declare function getDefaultSizeStore(): SizeStore;

package/dist/components/size-picker/sizeStore.js

@@ -0,0 +1,36 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+const SIZE_SCALE = {
+    M: 100,
+    L: 112.5,
+    XL: 125
+};
+function applySize(preset) {
+    document.documentElement.style.fontSize = `${SIZE_SCALE[preset]}%`;
+}
+function createSizeStore(storagePrefix) {
+    const STORAGE_KEY = `${storagePrefix}_size_preset`;
+    const getInitial = ()=>{
+        if ("undefined" == typeof window) return "M";
+        const saved = localStorage.getItem(STORAGE_KEY);
+        if (saved && saved in SIZE_SCALE) return saved;
+        return "M";
+    };
+    const [size, setSizeInternal] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(getInitial());
+    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createEffect)(()=>{
+        const s = size();
+        if ("undefined" == typeof window) return;
+        localStorage.setItem(STORAGE_KEY, s);
+        applySize(s);
+    });
+    return {
+        size,
+        setSize: setSizeInternal,
+        scale: ()=>SIZE_SCALE[size()]
+    };
+}
+let defaultStore = null;
+function getDefaultSizeStore() {
+    if (!defaultStore) defaultStore = createSizeStore("theme");
+    return defaultStore;
+}
+export { createSizeStore, getDefaultSizeStore };

package/dist/components/skeleton/Skeleton.css

@@ -0,0 +1,95 @@
+@layer components {
+  /* -------------------------------------------------------------------------------------------------
+   * Base
+   * -----------------------------------------------------------------------------------------------*/
+  .skeleton {
+    pointer-events: none;
+    position: relative;
+    overflow: hidden;
+    border-radius: var(--radius-field, 0.25rem);
+    background-color: color-mix(in oklab, var(--color-base-300) 70%, transparent);
+  }
+
+  /* -------------------------------------------------------------------------------------------------
+   * Shimmer animation
+   * -----------------------------------------------------------------------------------------------*/
+  .skeleton--shimmer::after {
+    content: "";
+    position: absolute;
+    inset: 0;
+    transform: translateX(-100%);
+    background: linear-gradient(
+      90deg,
+      transparent 0%,
+      color-mix(in oklab, var(--color-base-300) 50%, transparent) 50%,
+      transparent 100%
+    );
+    animation: skeleton-shimmer 1.5s ease-in-out infinite;
+  }
+
+  @keyframes skeleton-shimmer {
+    100% {
+      transform: translateX(100%);
+    }
+  }
+
+  /* Parent with nested skeletons: single synchronized shimmer */
+  .skeleton--shimmer:has(.skeleton)::after {
+    content: none;
+  }
+
+  .skeleton--shimmer:has(.skeleton)::before {
+    content: "";
+    position: absolute;
+    inset: 0;
+    z-index: 10;
+    pointer-events: none;
+    transform: translateX(-100%);
+    background: linear-gradient(
+      90deg,
+      transparent 0%,
+      oklch(100% 0 0 / 0.5) 50%,
+      transparent 100%
+    );
+    mix-blend-mode: overlay;
+    animation: skeleton-shimmer 1.5s ease-in-out infinite;
+  }
+
+  .skeleton--shimmer:has(.skeleton) .skeleton::after {
+    content: none;
+  }
+
+  /* -------------------------------------------------------------------------------------------------
+   * Pulse animation
+   * -----------------------------------------------------------------------------------------------*/
+  .skeleton--pulse {
+    animation: skeleton-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
+  }
+
+  @keyframes skeleton-pulse {
+    0%, 100% {
+      opacity: 1;
+    }
+    50% {
+      opacity: 0.5;
+    }
+  }
+
+  /* -------------------------------------------------------------------------------------------------
+   * No animation
+   * -----------------------------------------------------------------------------------------------*/
+  .skeleton--none {
+    /* Static placeholder, no animation */
+  }
+
+  /* -------------------------------------------------------------------------------------------------
+   * Reduced motion
+   * -----------------------------------------------------------------------------------------------*/
+  @media (prefers-reduced-motion: reduce) {
+    .skeleton--shimmer::after,
+    .skeleton--shimmer::before,
+    .skeleton--pulse {
+      animation: none;
+    }
+  }
+}

package/dist/components/skeleton/Skeleton.d.ts

@@ -0,0 +1,9 @@
+import "./Skeleton.css";
+import { type Component, type JSX } from "solid-js";
+import type { IComponentBaseProps } from "../types";
+export type SkeletonAnimation = "shimmer" | "pulse" | "none";
+export type SkeletonProps = Omit<JSX.HTMLAttributes<HTMLDivElement>, "children"> & IComponentBaseProps & {
+    animationType?: SkeletonAnimation;
+};
+declare const Skeleton: Component<SkeletonProps>;
+export default Skeleton;

package/dist/components/skeleton/Skeleton.js

@@ -0,0 +1,38 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import "./Skeleton.css";
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>");
+const ANIMATION_CLASS_MAP = {
+    shimmer: "skeleton--shimmer",
+    pulse: "skeleton--pulse",
+    none: "skeleton--none"
+};
+const Skeleton = (props)=>{
+    const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "class",
+        "className",
+        "animationType",
+        "dataTheme",
+        "style"
+    ]);
+    const animation = ()=>local.animationType ?? "shimmer";
+    return (()=>{
+        var _el$ = _tmpl$();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(others, {
+            get ["class"] () {
+                return (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("skeleton", ANIMATION_CLASS_MAP[animation()], local.class, local.className);
+            },
+            "data-slot": "skeleton",
+            get ["data-theme"] () {
+                return local.dataTheme;
+            },
+            get style () {
+                return local.style;
+            }
+        }), false, false);
+        return _el$;
+    })();
+};
+const skeleton_Skeleton = Skeleton;
+export { skeleton_Skeleton as default };

package/dist/components/skeleton/index.d.ts

@@ -0,0 +1 @@
+export { default, type SkeletonProps, type SkeletonAnimation, } from "./Skeleton";

package/dist/components/skeleton/index.js

@@ -0,0 +1,3 @@
+import * as __WEBPACK_EXTERNAL_MODULE__Skeleton_js_8ac331af__ from "./Skeleton.js";
+var __webpack_exports__default = __WEBPACK_EXTERNAL_MODULE__Skeleton_js_8ac331af__["default"];
+export { __webpack_exports__default as default };

package/dist/components/skip-link/SkipLink.d.ts

@@ -0,0 +1,7 @@
+import { type JSX } from "solid-js";
+import type { IComponentBaseProps } from "../types";
+export type SkipLinkProps = IComponentBaseProps & {
+    href?: string;
+    children?: JSX.Element;
+} & Omit<JSX.AnchorHTMLAttributes<HTMLAnchorElement>, "href" | "children" | "class" | "className" | "style">;
+export default function SkipLink(props: SkipLinkProps): JSX.Element;

package/dist/components/skip-link/SkipLink.js

@@ -0,0 +1,34 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<a>");
+function SkipLink(props) {
+    const [local, rest] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "href",
+        "children",
+        "class",
+        "className",
+        "style",
+        "dataTheme"
+    ]);
+    return (()=>{
+        var _el$ = _tmpl$();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+            get href () {
+                return local.href ?? "#main-content";
+            },
+            get ["class"] () {
+                return (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("sr-only focus:not-sr-only focus:fixed focus:top-4 focus:left-4 focus:z-50 focus:px-4 focus:py-2 focus:rounded focus:bg-primary focus:text-primary-content focus:outline-none", local.class, local.className);
+            },
+            get style () {
+                return local.style;
+            },
+            get ["data-theme"] () {
+                return local.dataTheme;
+            }
+        }, rest), false, true);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, ()=>local.children ?? "Skip to main content");
+        return _el$;
+    })();
+}
+export { SkipLink as default };

package/dist/components/skip-link/index.d.ts

@@ -0,0 +1,2 @@
+export { default as SkipLink } from "./SkipLink";
+export type { SkipLinkProps } from "./SkipLink";

package/dist/components/skip-link/index.js

@@ -0,0 +1,3 @@
+import * as __WEBPACK_EXTERNAL_MODULE__SkipLink_js_1eccb3ef__ from "./SkipLink.js";
+var __webpack_exports__SkipLink = __WEBPACK_EXTERNAL_MODULE__SkipLink_js_1eccb3ef__["default"];
+export { __webpack_exports__SkipLink as SkipLink };

package/dist/components/stack/Stack.d.ts

@@ -0,0 +1,18 @@
+import "./stack.css";
+import { type JSX } from "solid-js";
+import type { IComponentBaseProps } from "../types";
+type ElementType = keyof JSX.IntrinsicElements;
+type StackBaseProps = {
+    reverse?: boolean;
+    direction?: "top" | "bottom" | "left" | "right";
+    as?: ElementType;
+    children?: JSX.Element;
+    dataTheme?: string;
+    class?: string;
+    className?: string;
+    style?: JSX.CSSProperties;
+};
+type PropsOf<E extends ElementType> = JSX.IntrinsicElements[E];
+export type StackProps<E extends ElementType = "div"> = Omit<PropsOf<E>, keyof StackBaseProps> & StackBaseProps & IComponentBaseProps;
+declare const Stack: <E extends ElementType = "div">(props: StackProps<E>) => JSX.Element;
+export default Stack;

package/dist/components/stack/Stack.js

@@ -0,0 +1,53 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import "./stack.css";
+import * as __WEBPACK_EXTERNAL_MODULE_clsx__ from "clsx";
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+const Stack_Stack = (props)=>{
+    const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "children",
+        "reverse",
+        "direction",
+        "dataTheme",
+        "class",
+        "className",
+        "style",
+        "as"
+    ]);
+    const mapDirectionToClass = (direction)=>{
+        switch(direction){
+            case "left":
+                return "stack-start";
+            case "right":
+                return "stack-end";
+            case "top":
+                return "stack-top";
+            case "bottom":
+                return "stack-bottom";
+            default:
+                return "";
+        }
+    };
+    const classes = ()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("stack", mapDirectionToClass(local.direction), local.class, local.className, (0, __WEBPACK_EXTERNAL_MODULE_clsx__.clsx)({
+            "stack-reverse": local.reverse
+        }));
+    const Tag = local.as || "div";
+    return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.Dynamic, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+        component: Tag
+    }, others, {
+        get ["data-theme"] () {
+            return local.dataTheme;
+        },
+        get ["class"] () {
+            return classes();
+        },
+        get style () {
+            return local.style;
+        },
+        get children () {
+            return local.children;
+        }
+    }));
+};
+const Stack = Stack_Stack;
+export { Stack as default };

package/dist/components/stack/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./Stack";
+export type { StackProps } from "./Stack";

package/dist/components/stack/index.js

@@ -0,0 +1,3 @@
+import * as __WEBPACK_EXTERNAL_MODULE__Stack_js_c24eddb9__ from "./Stack.js";
+var __webpack_exports__default = __WEBPACK_EXTERNAL_MODULE__Stack_js_c24eddb9__["default"];
+export { __webpack_exports__default as default };

package/dist/components/stack/stack.css

@@ -0,0 +1,90 @@
+@layer components {
+  .stack {
+      display: inline-grid;
+      grid-template-columns: 3px 4px 1fr 4px 3px;
+      grid-template-rows: 3px 4px 1fr 4px 3px;
+    }
+
+  .stack > * {
+      height: 100%;
+      width: 100%;
+    }
+
+  .stack > *:nth-child(n + 2) {
+      width: 100%;
+      opacity: 70%;
+    }
+
+  .stack > *:nth-child(2) {
+      z-index: 2;
+      opacity: 90%;
+    }
+
+  .stack > *:nth-child(1) {
+      z-index: 3;
+      width: 100%;
+    }
+
+  .stack > *,
+    .stack.stack-bottom > * {
+      grid-column: 3 / 4;
+      grid-row: 3 / 6;
+    }
+
+  .stack > *:nth-child(2),
+    .stack.stack-bottom > *:nth-child(2) {
+      grid-column: 2 / 5;
+      grid-row: 2 / 5;
+    }
+
+  .stack > *:nth-child(1),
+    .stack.stack-bottom > *:nth-child(1) {
+      grid-column: 1 / 6;
+      grid-row: 1 / 4;
+    }
+
+  .stack.stack-top > * {
+      grid-column: 3 / 4;
+      grid-row: 1 / 4;
+    }
+
+  .stack.stack-top > *:nth-child(2) {
+      grid-column: 2 / 5;
+      grid-row: 2 / 5;
+    }
+
+  .stack.stack-top > *:nth-child(1) {
+      grid-column: 1 / 6;
+      grid-row: 3 / 6;
+    }
+
+  .stack.stack-start > * {
+      grid-column: 1 / 4;
+      grid-row: 3 / 4;
+    }
+
+  .stack.stack-start > *:nth-child(2) {
+      grid-column: 2 / 5;
+      grid-row: 2 / 5;
+    }
+
+  .stack.stack-start > *:nth-child(1) {
+      grid-column: 3 / 6;
+      grid-row: 1 / 6;
+    }
+
+  .stack.stack-end > * {
+      grid-column: 3 / 6;
+      grid-row: 3 / 4;
+    }
+
+  .stack.stack-end > *:nth-child(2) {
+      grid-column: 2 / 5;
+      grid-row: 2 / 5;
+    }
+
+  .stack.stack-end > *:nth-child(1) {
+      grid-column: 1 / 4;
+      grid-row: 1 / 6;
+    }
+}

package/dist/components/stat-card/StatCard.d.ts

@@ -0,0 +1,22 @@
+import { type JSX } from "solid-js";
+export type StatCardProps = JSX.HTMLAttributes<HTMLDivElement> & {
+    dataTheme?: string;
+};
+declare const _default: ((props: StatCardProps) => JSX.Element) & {
+    Figure: (props: JSX.HTMLAttributes<HTMLDivElement> & {
+        copyable?: boolean;
+    }) => JSX.Element;
+    Title: (props: JSX.HTMLAttributes<HTMLDivElement> & {
+        copyable?: boolean;
+    }) => JSX.Element;
+    Value: (props: JSX.HTMLAttributes<HTMLDivElement> & {
+        copyable?: boolean;
+    }) => JSX.Element;
+    Desc: (props: JSX.HTMLAttributes<HTMLDivElement> & {
+        copyable?: boolean;
+    }) => JSX.Element;
+    Actions: (props: JSX.HTMLAttributes<HTMLDivElement> & {
+        copyable?: boolean;
+    }) => JSX.Element;
+};
+export default _default;

package/dist/components/stat-card/StatCard.js

@@ -0,0 +1,46 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+import * as __WEBPACK_EXTERNAL_MODULE__card_Card_js_fc1902ef__ from "../card/Card.js";
+import * as __WEBPACK_EXTERNAL_MODULE__StatCardSection_js_4eed30d7__ from "./StatCardSection.js";
+import * as __WEBPACK_EXTERNAL_MODULE__flex_Flex_js_c0117791__ from "../flex/Flex.js";
+const StatCard = (props)=>{
+    const [local, rest] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "class",
+        "children",
+        "dataTheme",
+        "style"
+    ]);
+    const normalizedStyle = "object" == typeof local.style || void 0 === local.style ? local.style : void 0;
+    return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__card_Card_js_fc1902ef__["default"], (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(rest, {
+        style: normalizedStyle,
+        get ["class"] () {
+            return (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("border border-base-300 bg-base-100 rounded-lg p-6", local.class);
+        },
+        get ["data-theme"] () {
+            return local.dataTheme;
+        },
+        get children () {
+            return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__flex_Flex_js_c0117791__["default"], {
+                align: "center",
+                gap: "md",
+                get children () {
+                    return local.children;
+                }
+            });
+        }
+    }));
+};
+const StatCardFigure = (0, __WEBPACK_EXTERNAL_MODULE__StatCardSection_js_4eed30d7__["default"])("figure");
+const StatCardTitle = (0, __WEBPACK_EXTERNAL_MODULE__StatCardSection_js_4eed30d7__["default"])("title");
+const StatCardValue = (0, __WEBPACK_EXTERNAL_MODULE__StatCardSection_js_4eed30d7__["default"])("value");
+const StatCardDesc = (0, __WEBPACK_EXTERNAL_MODULE__StatCardSection_js_4eed30d7__["default"])("desc");
+const StatCardActions = (0, __WEBPACK_EXTERNAL_MODULE__StatCardSection_js_4eed30d7__["default"])("actions");
+const stat_card_StatCard = Object.assign(StatCard, {
+    Figure: StatCardFigure,
+    Title: StatCardTitle,
+    Value: StatCardValue,
+    Desc: StatCardDesc,
+    Actions: StatCardActions
+});
+export { stat_card_StatCard as default };

package/dist/components/stat-card/StatCardSection.d.ts

@@ -0,0 +1,5 @@
+import { type JSX } from "solid-js";
+export declare const StatCardSection: (section: string) => (props: JSX.HTMLAttributes<HTMLDivElement> & {
+    copyable?: boolean;
+}) => JSX.Element;
+export default StatCardSection;

package/dist/components/stat-card/StatCardSection.js

@@ -0,0 +1,39 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+import * as __WEBPACK_EXTERNAL_MODULE__copy_button_CopyButton_js_90341977__ from "../copy-button/CopyButton.js";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div class="p-3 bg-primary/10 rounded-lg"><div class="flex items-center justify-center w-6 h-6 text-primary">'), _tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>");
+const StatCardSection = (section)=>(props)=>{
+        const [local, rest] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+            "class",
+            "children",
+            "copyable"
+        ]);
+        let content = local.children;
+        if ("figure" === section) content = (()=>{
+            var _el$ = _tmpl$(), _el$2 = _el$.firstChild;
+            (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$2, ()=>local.children);
+            return _el$;
+        })();
+        if ("value" === section && local.copyable) content = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__copy_button_CopyButton_js_90341977__["default"], {
+            get text () {
+                return String(local.children);
+            },
+            get children () {
+                return local.children;
+            }
+        });
+        const classes = "title" === section ? "text-sm text-base-content/60" : "value" === section ? "text-2xl font-bold text-base-content" : "desc" === section ? "text-sm text-base-content/50" : "actions" === section ? "flex items-center gap-2" : "";
+        return (()=>{
+            var _el$3 = _tmpl$2();
+            (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$3, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(rest, {
+                get ["class"] () {
+                    return (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)(classes, local.class);
+                }
+            }), false, true);
+            (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$3, content);
+            return _el$3;
+        })();
+    };
+const stat_card_StatCardSection = StatCardSection;
+export { StatCardSection, stat_card_StatCardSection as default };

package/dist/components/stat-card/index.d.ts

@@ -0,0 +1 @@
+export { default, type StatCardProps } from "./StatCard";

package/dist/components/stat-card/index.js

@@ -0,0 +1,3 @@
+import * as __WEBPACK_EXTERNAL_MODULE__StatCard_js_eac76788__ from "./StatCard.js";
+var __webpack_exports__default = __WEBPACK_EXTERNAL_MODULE__StatCard_js_eac76788__["default"];
+export { __webpack_exports__default as default };

package/dist/components/stats/Stat.d.ts

@@ -0,0 +1,13 @@
+import "./stat.css";
+import { type JSX } from "solid-js";
+import { type StatSectionProps } from "./StatSection";
+import type { IComponentBaseProps } from "../types";
+export type StatProps = JSX.HTMLAttributes<HTMLDivElement> & IComponentBaseProps;
+declare const _default: ((props: StatProps) => JSX.Element) & {
+    Title: (props: Omit<StatSectionProps, "section">) => JSX.Element;
+    Value: (props: Omit<StatSectionProps, "section">) => JSX.Element;
+    Desc: (props: Omit<StatSectionProps, "section">) => JSX.Element;
+    Figure: (props: Omit<StatSectionProps, "section">) => JSX.Element;
+    Actions: (props: Omit<StatSectionProps, "section">) => JSX.Element;
+};
+export default _default;