@lglab/compose-ui 0.15.0 → 0.16.0

package/dist/components/card.d.ts

@@ -0,0 +1,79 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+declare const cardVariants: (props?: ({
+    variant?: "default" | "outline" | "elevated" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export type CardVariant = VariantProps<typeof cardVariants>['variant'];
+type CardRootProps = React.ComponentProps<'article'> & VariantProps<typeof cardVariants>;
+/**
+ * The root container for a card component.
+ * Renders as an `<article>` for semantic HTML.
+ */
+declare const CardRoot: React.ForwardRefExoticComponent<Omit<CardRootProps, "ref"> & React.RefAttributes<HTMLElement>>;
+type CardMediaProps = React.ComponentProps<'div'>;
+/**
+ * Container for media content (images, videos) within a card.
+ * Use Tailwind aspect-* classes for aspect ratios (e.g., className="aspect-video").
+ */
+declare const CardMedia: {
+    ({ className, ...props }: CardMediaProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+type CardHeaderProps = React.ComponentProps<'header'>;
+/**
+ * Container for the card's header content (title, description).
+ */
+declare const CardHeader: {
+    ({ className, ...props }: CardHeaderProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+type HeadingLevel = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+type CardTitleProps = React.ComponentProps<'h3'> & {
+    /** The heading level to render */
+    as?: HeadingLevel;
+};
+/**
+ * The card's title. Renders as an `<h3>` by default.
+ * Use the `as` prop to change the heading level.
+ */
+declare const CardTitle: {
+    ({ as: Component, className, ...props }: CardTitleProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+type CardDescriptionProps = React.ComponentProps<'p'>;
+/**
+ * Secondary text content for the card.
+ */
+declare const CardDescription: {
+    ({ className, ...props }: CardDescriptionProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+type CardContentProps = React.ComponentProps<'div'>;
+/**
+ * Container for the main content of the card.
+ */
+declare const CardContent: {
+    ({ className, ...props }: CardContentProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+type CardSectionProps = React.ComponentProps<'section'>;
+/**
+ * A distinct section within a card, useful for multi-section layouts.
+ * Use Separator component between sections if visual dividers are needed.
+ */
+declare const CardSection: {
+    ({ className, ...props }: CardSectionProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+type CardFooterProps = React.ComponentProps<'footer'>;
+/**
+ * Container for card actions and footer content.
+ * Use Separator component above footer if a visual divider is needed.
+ */
+declare const CardFooter: {
+    ({ className, ...props }: CardFooterProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { CardRoot, CardMedia, CardHeader, CardTitle, CardDescription, CardContent, CardSection, CardFooter, };
+export type { CardRootProps, CardMediaProps, CardHeaderProps, CardTitleProps, CardDescriptionProps, CardContentProps, CardSectionProps, CardFooterProps, };
+//# sourceMappingURL=card.d.ts.map

package/dist/components/card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../src/components/card.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,YAAY,EAAO,MAAM,0BAA0B,CAAA;AACjE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAQ9B,QAAA,MAAM,YAAY;;8EAWhB,CAAA;AAEF,MAAM,MAAM,WAAW,GAAG,YAAY,CAAC,OAAO,YAAY,CAAC,CAAC,SAAS,CAAC,CAAA;AAMtE,KAAK,aAAa,GAAG,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,GAAG,YAAY,CAAC,OAAO,YAAY,CAAC,CAAA;AAExF;;;GAGG;AACH,QAAA,MAAM,QAAQ,gGAUb,CAAA;AAQD,KAAK,cAAc,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAA;AAEjD;;;GAGG;AACH,QAAA,MAAM,SAAS;8BAA6B,cAAc;;CAWzD,CAAA;AAQD,KAAK,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAA;AAErD;;GAEG;AACH,QAAA,MAAM,UAAU;8BAA6B,eAAe;;CAE3D,CAAA;AAQD,KAAK,YAAY,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;AAE3D,KAAK,cAAc,GAAG,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,GAAG;IACjD,kCAAkC;IAClC,EAAE,CAAC,EAAE,YAAY,CAAA;CAClB,CAAA;AAED;;;GAGG;AACH,QAAA,MAAM,SAAS;6CAAmD,cAAc;;CAO/E,CAAA;AAQD,KAAK,oBAAoB,GAAG,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,CAAA;AAErD;;GAEG;AACH,QAAA,MAAM,eAAe;8BAA6B,oBAAoB;;CAErE,CAAA;AAQD,KAAK,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAA;AAEnD;;GAEG;AACH,QAAA,MAAM,WAAW;8BAA6B,gBAAgB;;CAE7D,CAAA;AAQD,KAAK,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,CAAA;AAEvD;;;GAGG;AACH,QAAA,MAAM,WAAW;8BAA6B,gBAAgB;;CAE7D,CAAA;AAQD,KAAK,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAA;AAErD;;;GAGG;AACH,QAAA,MAAM,UAAU;8BAA6B,eAAe;;CAE3D,CAAA;AAQD,OAAO,EACL,QAAQ,EACR,SAAS,EACT,UAAU,EACV,SAAS,EACT,eAAe,EACf,WAAW,EACX,WAAW,EACX,UAAU,GACX,CAAA;AAED,YAAY,EACV,aAAa,EACb,cAAc,EACd,eAAe,EACf,cAAc,EACd,oBAAoB,EACpB,gBAAgB,EAChB,gBAAgB,EAChB,eAAe,GAChB,CAAA"}

package/dist/index.d.ts

@@ -16,6 +16,7 @@ export { MenuRoot, MenuTrigger, MenuPortal, MenuPositioner, MenuPopup, MenuArrow
 export { PopoverRoot, PopoverTrigger, PopoverPortal, PopoverBackdrop, PopoverPositioner, PopoverPopup, PopoverArrow, PopoverTitle, PopoverDescription, PopoverClose, PopoverViewport, } from './components/popover';
 export { ProgressRoot, ProgressTrack, ProgressIndicator, ProgressValue, ProgressLabel, } from './components/progress';
 export { ToggleGroupRoot, ToggleGroupItem } from './components/toggle-group';
+export { CardRoot, CardMedia, CardHeader, CardTitle, CardDescription, CardFooter, CardSection, CardContent, } from './components/card';
 export type { ButtonProps } from './components/button';
 export type { CollapsibleRootProps, CollapsibleTriggerProps, CollapsiblePanelProps, } from './components/collapsible';
 export type { AlertDialogRootProps, AlertDialogTriggerProps, AlertDialogPortalProps, AlertDialogBackdropProps, AlertDialogViewportProps, AlertDialogPopupProps, AlertDialogTitleProps, AlertDialogDescriptionProps, AlertDialogCloseProps, } from './components/alert-dialog';
@@ -34,4 +35,5 @@ export type { MenuRootProps, MenuTriggerProps, MenuPortalProps, MenuPositionerPr
 export type { PopoverRootProps, PopoverTriggerProps, PopoverPortalProps, PopoverBackdropProps, PopoverPositionerProps, PopoverPopupProps, PopoverArrowProps, PopoverTitleProps, PopoverDescriptionProps, PopoverCloseProps, PopoverViewportProps, } from './components/popover';
 export type { ProgressRootProps, ProgressTrackProps, ProgressIndicatorProps, ProgressValueProps, ProgressLabelProps, } from './components/progress';
 export type { ToggleGroupRootProps, ToggleGroupItemProps, } from './components/toggle-group';
+export type { CardRootProps, CardMediaProps, CardHeaderProps, CardTitleProps, CardDescriptionProps, CardFooterProps, CardSectionProps, CardContentProps, } from './components/card';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/index.es.js

@@ -1,25 +1,25 @@
 "use client";
-import { jsx as t, jsxs as w } from "react/jsx-runtime";
-import { Button as S } from "@base-ui/react/button";
+import { jsx as t, jsxs as k } from "react/jsx-runtime";
+import { Button as I } from "@base-ui/react/button";
 import { cva as u } from "class-variance-authority";
 import { clsx as L } from "clsx";
-import { twMerge as _ } from "tailwind-merge";
+import { twMerge as H } from "tailwind-merge";
 import { Collapsible as D } from "@base-ui/react/collapsible";
 import { AlertDialog as m } from "@base-ui/react/alert-dialog";
-import { AlertDialog as nt } from "@base-ui/react/alert-dialog";
-import { Avatar as T } from "@base-ui/react/avatar";
-import * as k from "react";
+import { AlertDialog as bt } from "@base-ui/react/alert-dialog";
+import { Avatar as C } from "@base-ui/react/avatar";
+import * as y from "react";
 import { ScrollArea as g } from "@base-ui/react/scroll-area";
-import { Separator as H } from "@base-ui/react/separator";
-import { Switch as C } from "@base-ui/react/switch";
-import { Toggle as z } from "@base-ui/react/toggle";
-import { Tabs as y } from "@base-ui/react/tabs";
+import { Separator as _ } from "@base-ui/react/separator";
+import { Switch as A } from "@base-ui/react/switch";
+import { Toggle as R } from "@base-ui/react/toggle";
+import { Tabs as N } from "@base-ui/react/tabs";
 import { Dialog as n } from "@base-ui/react/dialog";
 import { Accordion as h } from "@base-ui/react/accordion";
-import { Meter as N } from "@base-ui/react/meter";
+import { Meter as x } from "@base-ui/react/meter";
 import { Menu as l } from "@base-ui/react/menu";
 import { Popover as i } from "@base-ui/react/popover";
-import { Progress as x } from "@base-ui/react/progress";
+import { Progress as v } from "@base-ui/react/progress";
 import { ToggleGroup as B } from "@base-ui/react/toggle-group";
 const d = u(
   [
@@ -51,9 +51,9 @@ const d = u(
   }
 );
 function r(...e) {
-  return _(L(e));
+  return H(L(e));
 }
-const j = ({
+const F = ({
   className: e,
   variant: a,
   size: o,
@@ -61,7 +61,7 @@ const j = ({
   children: c,
   ...p
 }) => /* @__PURE__ */ t(
-  S,
+  I,
   {
     className: r(d({ variant: a, size: o }), e),
     disabled: s,
@@ -69,9 +69,9 @@ const j = ({
     children: c
   }
 );
-j.displayName = "Button";
-const F = ({ className: e, ...a }) => /* @__PURE__ */ t(D.Root, { className: r("w-full", e), ...a });
-F.displayName = "CollapsibleRoot";
+F.displayName = "Button";
+const j = ({ className: e, ...a }) => /* @__PURE__ */ t(D.Root, { className: r("w-full", e), ...a });
+j.displayName = "CollapsibleRoot";
 const G = ({ className: e, ...a }) => /* @__PURE__ */ t(
   D.Trigger,
   {
@@ -205,10 +205,10 @@ const M = u(
       size: "default"
     }
   }
-), R = ({ className: e, size: a, ...o }) => /* @__PURE__ */ t(T.Root, { className: r(M({ size: a }), e), ...o });
-R.displayName = "AvatarRoot";
+), z = ({ className: e, size: a, ...o }) => /* @__PURE__ */ t(C.Root, { className: r(M({ size: a }), e), ...o });
+z.displayName = "AvatarRoot";
 const Y = ({ className: e, ...a }) => /* @__PURE__ */ t(
-  T.Image,
+  C.Image,
   {
     className: r("aspect-square h-full w-full object-cover", e),
     ...a
@@ -216,7 +216,7 @@ const Y = ({ className: e, ...a }) => /* @__PURE__ */ t(
 );
 Y.displayName = "AvatarImage";
 const ee = ({ className: e, ...a }) => /* @__PURE__ */ t(
-  T.Fallback,
+  C.Fallback,
   {
     className: r(
       "flex h-full w-full items-center justify-center font-medium",
@@ -232,24 +232,24 @@ const ae = ({
   className: o,
   children: s
 }) => {
-  const c = k.Children.toArray(s), p = c.length, f = a !== void 0 ? Math.min(a, p) : p, v = p - f, P = c.slice(0, f), I = (() => {
+  const c = y.Children.toArray(s), p = c.length, f = a !== void 0 ? Math.min(a, p) : p, w = p - f, P = c.slice(0, f), S = (() => {
     const b = c[0];
-    return k.isValidElement(b) && b.type === R ? b.props.size ?? "default" : "default";
+    return y.isValidElement(b) && b.type === z ? b.props.size ?? "default" : "default";
   })();
-  return /* @__PURE__ */ w("ul", { "aria-label": e, className: r("flex -space-x-2", o), children: [
-    P.map((b, A) => /* @__PURE__ */ t("li", { children: b }, A)),
-    v > 0 && /* @__PURE__ */ t("li", { children: /* @__PURE__ */ w(
+  return /* @__PURE__ */ k("ul", { "aria-label": e, className: r("flex -space-x-2", o), children: [
+    P.map((b, T) => /* @__PURE__ */ t("li", { children: b }, T)),
+    w > 0 && /* @__PURE__ */ t("li", { children: /* @__PURE__ */ k(
       "span",
       {
         className: r(
           "relative flex shrink-0 items-center justify-center overflow-hidden rounded-full",
           "bg-muted text-foreground border-2 border-background",
           "font-medium",
-          M({ size: I })
+          M({ size: S })
         ),
         children: [
           "+",
-          v
+          w
         ]
       }
     ) })
@@ -306,7 +306,7 @@ const ie = ({
   orientation: a = "horizontal",
   ...o
 }) => /* @__PURE__ */ t(
-  H,
+  _,
   {
     orientation: a,
     className: r(
@@ -319,7 +319,7 @@ const ie = ({
 );
 ie.displayName = "Separator";
 const de = ({ className: e, ...a }) => /* @__PURE__ */ t(
-  C.Root,
+  A.Root,
   {
     className: r(
       "relative flex h-6 w-10 rounded-full",
@@ -336,7 +336,7 @@ const de = ({ className: e, ...a }) => /* @__PURE__ */ t(
 );
 de.displayName = "SwitchRoot";
 const ce = ({ className: e, ...a }) => /* @__PURE__ */ t(
-  C.Thumb,
+  A.Thumb,
   {
     className: r(
       "aspect-square h-full rounded-full bg-background",
@@ -382,9 +382,9 @@ const V = u(
       size: "default"
     }
   }
-), ue = ({ className: e, variant: a, size: o, ...s }) => /* @__PURE__ */ t(z, { className: r(V({ variant: a, size: o }), e), ...s });
+), ue = ({ className: e, variant: a, size: o, ...s }) => /* @__PURE__ */ t(R, { className: r(V({ variant: a, size: o }), e), ...s });
 ue.displayName = "Toggle";
-const me = ({ className: e, ...a }) => /* @__PURE__ */ t(y.Root, { className: r("flex flex-col", e), ...a });
+const me = ({ className: e, ...a }) => /* @__PURE__ */ t(N.Root, { className: r("flex flex-col", e), ...a });
 me.displayName = "TabsRoot";
 const pe = u(
   ["relative inline-flex w-fit items-center gap-1", "rounded-lg bg-muted p-1"],
@@ -400,7 +400,7 @@ const pe = u(
     }
   }
 ), ge = ({ className: e, orientation: a = "horizontal", ...o }) => /* @__PURE__ */ t(
-  y.List,
+  N.List,
   {
     className: r(pe({ orientation: a }), e),
     ...o
@@ -428,7 +428,7 @@ const fe = u(
       size: "default"
     }
   }
-), be = ({ className: e, size: a, ...o }) => /* @__PURE__ */ t(y.Tab, { className: r(fe({ size: a }), e), ...o });
+), be = ({ className: e, size: a, ...o }) => /* @__PURE__ */ t(N.Tab, { className: r(fe({ size: a }), e), ...o });
 be.displayName = "TabsTab";
 const ye = u(
   ["absolute rounded-md bg-background shadow-sm", "transition-all duration-200 ease-out"],
@@ -443,20 +443,20 @@ const ye = u(
       orientation: "horizontal"
     }
   }
-), he = ({
+), Ne = ({
   className: e,
   orientation: a = "horizontal",
   ...o
 }) => /* @__PURE__ */ t(
-  y.Indicator,
+  N.Indicator,
   {
     className: r(ye({ orientation: a }), e),
     ...o
   }
 );
-he.displayName = "TabsIndicator";
-const Ne = ({ className: e, ...a }) => /* @__PURE__ */ t(y.Panel, { className: r("mt-2 ring-offset-background", e), ...a });
-Ne.displayName = "TabsPanel";
+Ne.displayName = "TabsIndicator";
+const he = ({ className: e, ...a }) => /* @__PURE__ */ t(N.Panel, { className: r("mt-2 ring-offset-background", e), ...a });
+he.displayName = "TabsPanel";
 const xe = (e) => /* @__PURE__ */ t(n.Root, { ...e });
 xe.displayName = "DialogRoot";
 const ve = ({ className: e, variant: a, size: o, ...s }) => /* @__PURE__ */ t(
@@ -514,26 +514,26 @@ const Pe = u(
   }
 );
 De.displayName = "DialogPopup";
-const Te = ({ className: e, ...a }) => /* @__PURE__ */ t(
+const Ce = ({ className: e, ...a }) => /* @__PURE__ */ t(
   n.Title,
   {
     className: r("text-lg font-semibold leading-none tracking-tight", e),
     ...a
   }
 );
-Te.displayName = "DialogTitle";
-const Ae = ({ className: e, ...a }) => /* @__PURE__ */ t(n.Description, { className: r("mt-2", e), ...a });
-Ae.displayName = "DialogDescription";
-const Ce = ({ className: e, variant: a, size: o, ...s }) => /* @__PURE__ */ t(
+Ce.displayName = "DialogTitle";
+const Te = ({ className: e, ...a }) => /* @__PURE__ */ t(n.Description, { className: r("mt-2", e), ...a });
+Te.displayName = "DialogDescription";
+const Ae = ({ className: e, variant: a, size: o, ...s }) => /* @__PURE__ */ t(
   n.Close,
   {
     className: r(d({ variant: a ?? "outline", size: o }), e),
     ...s
   }
 );
-Ce.displayName = "DialogClose";
-const ze = ({ className: e, ...a }) => /* @__PURE__ */ t("div", { className: r("flex flex-col space-y-1 mb-5", e), ...a });
-ze.displayName = "DialogHeader";
+Ae.displayName = "DialogClose";
+const Re = ({ className: e, ...a }) => /* @__PURE__ */ t("div", { className: r("flex flex-col space-y-1 mb-5", e), ...a });
+Re.displayName = "DialogHeader";
 const Me = ({ className: e, ...a }) => /* @__PURE__ */ t(
   "div",
   {
@@ -545,8 +545,8 @@ const Me = ({ className: e, ...a }) => /* @__PURE__ */ t(
   }
 );
 Me.displayName = "DialogFooter";
-const Re = (e) => /* @__PURE__ */ t(n.Root, { ...e });
-Re.displayName = "DrawerRoot";
+const ze = (e) => /* @__PURE__ */ t(n.Root, { ...e });
+ze.displayName = "DrawerRoot";
 const Ve = ({ className: e, variant: a, size: o, ...s }) => /* @__PURE__ */ t(
   n.Trigger,
   {
@@ -555,9 +555,9 @@ const Ve = ({ className: e, variant: a, size: o, ...s }) => /* @__PURE__ */ t(
   }
 );
 Ve.displayName = "DrawerTrigger";
-const Ie = (e) => /* @__PURE__ */ t(n.Portal, { ...e });
-Ie.displayName = "DrawerPortal";
-const Se = ({ className: e, ...a }) => /* @__PURE__ */ t(
+const Se = (e) => /* @__PURE__ */ t(n.Portal, { ...e });
+Se.displayName = "DrawerPortal";
+const Ie = ({ className: e, ...a }) => /* @__PURE__ */ t(
   n.Backdrop,
   {
     className: r(
@@ -569,7 +569,7 @@ const Se = ({ className: e, ...a }) => /* @__PURE__ */ t(
     ...a
   }
 );
-Se.displayName = "DrawerBackdrop";
+Ie.displayName = "DrawerBackdrop";
 const Le = u(
   [
     "fixed z-50 flex flex-col bg-background p-6 shadow-lg",
@@ -606,34 +606,34 @@ const Le = u(
       side: "right"
     }
   }
-), _e = ({ className: e, side: a, ...o }) => /* @__PURE__ */ t(
+), He = ({ className: e, side: a, ...o }) => /* @__PURE__ */ t(
   n.Popup,
   {
     className: r(Le({ side: a }), e),
     ...o
   }
 );
-_e.displayName = "DrawerPopup";
-const He = ({ className: e, ...a }) => /* @__PURE__ */ t(
+He.displayName = "DrawerPopup";
+const _e = ({ className: e, ...a }) => /* @__PURE__ */ t(
   n.Title,
   {
     className: r("text-lg font-semibold leading-none tracking-tight", e),
     ...a
   }
 );
-He.displayName = "DrawerTitle";
+_e.displayName = "DrawerTitle";
 const Be = ({ className: e, ...a }) => /* @__PURE__ */ t(n.Description, { className: r("", e), ...a });
 Be.displayName = "DrawerDescription";
-const je = ({ className: e, variant: a, size: o, ...s }) => /* @__PURE__ */ t(
+const Fe = ({ className: e, variant: a, size: o, ...s }) => /* @__PURE__ */ t(
   n.Close,
   {
     className: r(d({ variant: a ?? "outline", size: o }), e),
     ...s
   }
 );
-je.displayName = "DrawerClose";
-const Fe = ({ className: e, ...a }) => /* @__PURE__ */ t("div", { className: r("flex flex-col space-y-1.5", e), ...a });
-Fe.displayName = "DrawerHeader";
+Fe.displayName = "DrawerClose";
+const je = ({ className: e, ...a }) => /* @__PURE__ */ t("div", { className: r("flex flex-col space-y-1.5", e), ...a });
+je.displayName = "DrawerHeader";
 const Ge = ({ className: e, ...a }) => /* @__PURE__ */ t("div", { className: r("py-5", e), ...a });
 Ge.displayName = "DrawerContent";
 const qe = ({ className: e, ...a }) => /* @__PURE__ */ t("div", { className: r("", e), ...a });
@@ -674,23 +674,23 @@ const Je = ({ className: e, ...a }) => /* @__PURE__ */ t(
 );
 Je.displayName = "AccordionPanel";
 const Ke = ({ className: e, animated: a, value: o, ...s }) => {
-  const c = o ?? 0, [p, f] = k.useState(a ? 0 : c);
-  return k.useEffect(() => {
+  const c = o ?? 0, [p, f] = y.useState(a ? 0 : c);
+  return y.useEffect(() => {
     if (a) {
-      const v = requestAnimationFrame(() => {
+      const w = requestAnimationFrame(() => {
         const P = requestAnimationFrame(() => {
           f(c ?? 0);
         });
         return () => cancelAnimationFrame(P);
       });
-      return () => cancelAnimationFrame(v);
+      return () => cancelAnimationFrame(w);
     } else
       f(c ?? 0);
-  }, [a, c]), /* @__PURE__ */ t(N.Root, { className: r("w-full", e), value: p, ...s });
+  }, [a, c]), /* @__PURE__ */ t(x.Root, { className: r("w-full", e), value: p, ...s });
 };
 Ke.displayName = "MeterRoot";
 const Qe = ({ className: e, ...a }) => /* @__PURE__ */ t(
-  N.Track,
+  x.Track,
   {
     className: r(
       "relative h-2 w-full overflow-hidden rounded-full bg-primary/20",
@@ -701,7 +701,7 @@ const Qe = ({ className: e, ...a }) => /* @__PURE__ */ t(
 );
 Qe.displayName = "MeterTrack";
 const Ue = ({ className: e, ...a }) => /* @__PURE__ */ t(
-  N.Indicator,
+  x.Indicator,
   {
     className: r(
       "h-full rounded-full bg-primary transition-all duration-1000 ease-out-expo",
@@ -712,7 +712,7 @@ const Ue = ({ className: e, ...a }) => /* @__PURE__ */ t(
 );
 Ue.displayName = "MeterIndicator";
 const We = ({ className: e, ...a }) => /* @__PURE__ */ t(
-  N.Value,
+  x.Value,
   {
     className: r("text-sm font-medium text-foreground", e),
     ...a
@@ -720,7 +720,7 @@ const We = ({ className: e, ...a }) => /* @__PURE__ */ t(
 );
 We.displayName = "MeterValue";
 const Xe = ({ className: e, ...a }) => /* @__PURE__ */ t(
-  N.Label,
+  x.Label,
   {
     className: r("text-sm font-medium text-foreground", e),
     ...a
@@ -766,7 +766,7 @@ const oa = ({ className: e, ...a }) => /* @__PURE__ */ t(
   }
 );
 function sa(e) {
-  return /* @__PURE__ */ w("svg", { width: "20", height: "10", viewBox: "0 0 20 10", fill: "none", ...e, children: [
+  return /* @__PURE__ */ k("svg", { width: "20", height: "10", viewBox: "0 0 20 10", fill: "none", ...e, children: [
     /* @__PURE__ */ t(
       "path",
       {
@@ -863,10 +863,10 @@ const ya = ({ className: e, ...a }) => /* @__PURE__ */ t(
   }
 );
 ya.displayName = "MenuSubmenuTrigger";
-const ha = (e) => /* @__PURE__ */ t(l.SubmenuRoot, { ...e });
-ha.displayName = "MenuSubmenuRoot";
-const Na = (e) => /* @__PURE__ */ t(i.Root, { ...e });
-Na.displayName = "PopoverRoot";
+const Na = (e) => /* @__PURE__ */ t(l.SubmenuRoot, { ...e });
+Na.displayName = "MenuSubmenuRoot";
+const ha = (e) => /* @__PURE__ */ t(i.Root, { ...e });
+ha.displayName = "PopoverRoot";
 const xa = ({ className: e, ...a }) => /* @__PURE__ */ t(i.Trigger, { className: r(e), ...a });
 xa.displayName = "PopoverTrigger";
 const va = (e) => /* @__PURE__ */ t(i.Portal, { ...e });
@@ -930,11 +930,11 @@ const Da = ({ className: e, ...a }) => /* @__PURE__ */ t(
       e
     ),
     ...a,
-    children: /* @__PURE__ */ t(Ta, {})
+    children: /* @__PURE__ */ t(Ca, {})
   }
 );
-function Ta(e) {
-  return /* @__PURE__ */ w("svg", { width: "20", height: "10", viewBox: "0 0 20 10", fill: "none", ...e, children: [
+function Ca(e) {
+  return /* @__PURE__ */ k("svg", { width: "20", height: "10", viewBox: "0 0 20 10", fill: "none", ...e, children: [
     /* @__PURE__ */ t(
       "path",
       {
@@ -952,18 +952,18 @@ function Ta(e) {
   ] });
 }
 Da.displayName = "PopoverArrow";
-const Aa = ({ className: e, ...a }) => /* @__PURE__ */ t(i.Title, { className: r("text-sm font-semibold", e), ...a });
-Aa.displayName = "PopoverTitle";
-const Ca = ({ className: e, ...a }) => /* @__PURE__ */ t(i.Description, { className: r("text-sm", e), ...a });
-Ca.displayName = "PopoverDescription";
-const za = ({ className: e, ...a }) => /* @__PURE__ */ t(i.Close, { className: r(e), ...a });
-za.displayName = "PopoverClose";
+const Ta = ({ className: e, ...a }) => /* @__PURE__ */ t(i.Title, { className: r("text-sm font-semibold", e), ...a });
+Ta.displayName = "PopoverTitle";
+const Aa = ({ className: e, ...a }) => /* @__PURE__ */ t(i.Description, { className: r("text-sm", e), ...a });
+Aa.displayName = "PopoverDescription";
+const Ra = ({ className: e, ...a }) => /* @__PURE__ */ t(i.Close, { className: r(e), ...a });
+Ra.displayName = "PopoverClose";
 const Ma = ({ className: e, ...a }) => /* @__PURE__ */ t(i.Viewport, { className: r(e), ...a });
 Ma.displayName = "PopoverViewport";
-const Ra = ({ className: e, ...a }) => /* @__PURE__ */ t(x.Root, { className: r("w-full", e), ...a });
-Ra.displayName = "ProgressRoot";
+const za = ({ className: e, ...a }) => /* @__PURE__ */ t(v.Root, { className: r("w-full", e), ...a });
+za.displayName = "ProgressRoot";
 const Va = ({ className: e, ...a }) => /* @__PURE__ */ t(
-  x.Track,
+  v.Track,
   {
     className: r(
       "relative h-2 w-full overflow-hidden rounded-full bg-primary/20",
@@ -973,8 +973,8 @@ const Va = ({ className: e, ...a }) => /* @__PURE__ */ t(
   }
 );
 Va.displayName = "ProgressTrack";
-const Ia = ({ className: e, ...a }) => /* @__PURE__ */ t(
-  x.Indicator,
+const Sa = ({ className: e, ...a }) => /* @__PURE__ */ t(
+  v.Indicator,
   {
     className: r(
       "h-full rounded-full bg-primary transition-all duration-1000 ease-out-expo",
@@ -983,24 +983,24 @@ const Ia = ({ className: e, ...a }) => /* @__PURE__ */ t(
     ...a
   }
 );
-Ia.displayName = "ProgressIndicator";
-const Sa = ({ className: e, ...a }) => /* @__PURE__ */ t(
-  x.Value,
+Sa.displayName = "ProgressIndicator";
+const Ia = ({ className: e, ...a }) => /* @__PURE__ */ t(
+  v.Value,
   {
     className: r("text-sm font-medium text-foreground", e),
     ...a
   }
 );
-Sa.displayName = "ProgressValue";
+Ia.displayName = "ProgressValue";
 const La = ({ className: e, ...a }) => /* @__PURE__ */ t(
-  x.Label,
+  v.Label,
   {
     className: r("text-sm font-medium text-foreground", e),
     ...a
   }
 );
 La.displayName = "ProgressLabel";
-const _a = ({ className: e, orientation: a, ...o }) => /* @__PURE__ */ t(
+const Ha = ({ className: e, orientation: a, ...o }) => /* @__PURE__ */ t(
   B,
   {
     orientation: a,
@@ -1017,14 +1017,14 @@ const _a = ({ className: e, orientation: a, ...o }) => /* @__PURE__ */ t(
     ...o
   }
 );
-_a.displayName = "ToggleGroupRoot";
-const Ha = ({
+Ha.displayName = "ToggleGroupRoot";
+const _a = ({
   className: e,
   variant: a,
   size: o,
   ...s
 }) => /* @__PURE__ */ t(
-  z,
+  R,
   {
     className: r(
       V({ variant: a, size: o }),
@@ -1035,14 +1035,66 @@ const Ha = ({
     ...s
   }
 );
-Ha.displayName = "ToggleGroupItem";
+_a.displayName = "ToggleGroupItem";
+const Ba = u("rounded-lg bg-card text-card-foreground transition-colors", {
+  variants: {
+    variant: {
+      default: "border shadow-sm",
+      outline: "border",
+      elevated: "shadow-md"
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
+}), Fa = y.forwardRef(
+  ({ className: e, variant: a, ...o }, s) => /* @__PURE__ */ t(
+    "article",
+    {
+      ref: s,
+      className: r(Ba({ variant: a }), e),
+      ...o
+    }
+  )
+);
+Fa.displayName = "CardRoot";
+const ja = ({ className: e, ...a }) => /* @__PURE__ */ t(
+  "div",
+  {
+    className: r(
+      "overflow-hidden",
+      "[&>img]:h-full [&>img]:w-full [&>img]:object-cover",
+      e
+    ),
+    ...a
+  }
+);
+ja.displayName = "CardMedia";
+const Ga = ({ className: e, ...a }) => /* @__PURE__ */ t("header", { className: r("flex flex-col gap-1 p-4", e), ...a });
+Ga.displayName = "CardHeader";
+const qa = ({ as: e = "h3", className: a, ...o }) => /* @__PURE__ */ t(
+  e,
+  {
+    className: r("text-base font-semibold leading-tight", a),
+    ...o
+  }
+);
+qa.displayName = "CardTitle";
+const Za = ({ className: e, ...a }) => /* @__PURE__ */ t("p", { className: r("text-sm", e), ...a });
+Za.displayName = "CardDescription";
+const $a = ({ className: e, ...a }) => /* @__PURE__ */ t("div", { className: r("p-4 pt-0", e), ...a });
+$a.displayName = "CardContent";
+const Ea = ({ className: e, ...a }) => /* @__PURE__ */ t("section", { className: r("p-4", e), ...a });
+Ea.displayName = "CardSection";
+const Oa = ({ className: e, ...a }) => /* @__PURE__ */ t("footer", { className: r("flex items-center p-4", e), ...a });
+Oa.displayName = "CardFooter";
 export {
   Ee as AccordionHeader,
   $e as AccordionItem,
   Je as AccordionPanel,
   Ze as AccordionRoot,
   Oe as AccordionTrigger,
-  nt as AlertDialog,
+  bt as AlertDialog,
   O as AlertDialogBackdrop,
   X as AlertDialogClose,
   W as AlertDialogDescription,
@@ -1054,32 +1106,40 @@ export {
   J as AlertDialogViewport,
   ee as AvatarFallback,
   Y as AvatarImage,
-  R as AvatarRoot,
+  z as AvatarRoot,
   ae as AvatarStack,
-  j as Button,
+  F as Button,
+  $a as CardContent,
+  Za as CardDescription,
+  Oa as CardFooter,
+  Ga as CardHeader,
+  ja as CardMedia,
+  Fa as CardRoot,
+  Ea as CardSection,
+  qa as CardTitle,
   q as CollapsiblePanel,
-  F as CollapsibleRoot,
+  j as CollapsibleRoot,
   G as CollapsibleTrigger,
   ke as DialogBackdrop,
-  Ce as DialogClose,
-  Ae as DialogDescription,
+  Ae as DialogClose,
+  Te as DialogDescription,
   Me as DialogFooter,
-  ze as DialogHeader,
+  Re as DialogHeader,
   De as DialogPopup,
   we as DialogPortal,
   xe as DialogRoot,
-  Te as DialogTitle,
+  Ce as DialogTitle,
   ve as DialogTrigger,
-  Se as DrawerBackdrop,
-  je as DrawerClose,
+  Ie as DrawerBackdrop,
+  Fe as DrawerClose,
   Ge as DrawerContent,
   Be as DrawerDescription,
   qe as DrawerFooter,
-  Fe as DrawerHeader,
-  _e as DrawerPopup,
-  Ie as DrawerPortal,
-  Re as DrawerRoot,
-  He as DrawerTitle,
+  je as DrawerHeader,
+  He as DrawerPopup,
+  Se as DrawerPortal,
+  ze as DrawerRoot,
+  _e as DrawerTitle,
   Ve as DrawerTrigger,
   oa as MenuArrow,
   ma as MenuCheckboxItem,
@@ -1097,7 +1157,7 @@ export {
   ba as MenuRadioItemLabel,
   Ye as MenuRoot,
   na as MenuSeparator,
-  ha as MenuSubmenuRoot,
+  Na as MenuSubmenuRoot,
   ya as MenuSubmenuTrigger,
   ea as MenuTrigger,
   Ue as MeterIndicator,
@@ -1107,20 +1167,20 @@ export {
   We as MeterValue,
   Da as PopoverArrow,
   wa as PopoverBackdrop,
-  za as PopoverClose,
-  Ca as PopoverDescription,
+  Ra as PopoverClose,
+  Aa as PopoverDescription,
   Pa as PopoverPopup,
   va as PopoverPortal,
   ka as PopoverPositioner,
-  Na as PopoverRoot,
-  Aa as PopoverTitle,
+  ha as PopoverRoot,
+  Ta as PopoverTitle,
   xa as PopoverTrigger,
   Ma as PopoverViewport,
-  Ia as ProgressIndicator,
+  Sa as ProgressIndicator,
   La as ProgressLabel,
-  Ra as ProgressRoot,
+  za as ProgressRoot,
   Va as ProgressTrack,
-  Sa as ProgressValue,
+  Ia as ProgressValue,
   oe as ScrollAreaContent,
   ne as ScrollAreaCorner,
   te as ScrollAreaRoot,
@@ -1130,12 +1190,12 @@ export {
   ie as Separator,
   de as SwitchRoot,
   ce as SwitchThumb,
-  he as TabsIndicator,
+  Ne as TabsIndicator,
   ge as TabsList,
-  Ne as TabsPanel,
+  he as TabsPanel,
   me as TabsRoot,
   be as TabsTab,
   ue as Toggle,
-  Ha as ToggleGroupItem,
-  _a as ToggleGroupRoot
+  _a as ToggleGroupItem,
+  Ha as ToggleGroupRoot
 };

package/dist/styles/default.css

@@ -20,6 +20,8 @@
   --color-input: var(--input);
   --color-border: var(--border);
   --color-ring: var(--ring);
+  --color-card: var(--card);
+  --color-card-foreground: var(--card-foreground);
 }
 
 :root {
@@ -38,6 +40,8 @@
   --border: oklch(0.922 0 0);
   --input: oklch(0.922 0 0);
   --ring: oklch(0.708 0 0);
+  --card: oklch(1 0 0);
+  --card-foreground: oklch(0.145 0 0);
 }
 
 .dark {
@@ -55,6 +59,8 @@
   --border: oklch(1 0 0 / 10%);
   --input: oklch(1 0 0 / 15%);
   --ring: oklch(0.556 0 0);
+  --card: oklch(0.205 0 0);
+  --card-foreground: oklch(0.985 0 0);
 }
 
 @media (prefers-color-scheme: dark) {
@@ -73,6 +79,8 @@
     --input: oklch(1 0 0 / 15%);
     --border: oklch(1 0 0 / 10%);
     --ring: oklch(0.556 0 0);
+    --card: oklch(0.205 0 0);
+    --card-foreground: oklch(0.985 0 0);
   }
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lglab/compose-ui",
-  "version": "0.15.0",
+  "version": "0.16.0",
   "description": "A collection of components built with Base UI & Tailwind CSS",
   "author": "LGLab",
   "license": "MIT",