@cloudgrid-io/ui 0.0.2 → 0.1.0

package/dist/tokens/base.json

@@ -101,64 +101,71 @@
       }
     },
     "lavender-50": {
-      "$value": "#f2f1f7; /* SOURCE: alternate page wash */ --cg-neutral-100: #f1f1f1; /* SOURCE: hairline / card border */ --cg-neutral-200: #e3e3e3; /* SOURCE: control border, inactive pill fill */ --cg-neutral-400: #acacac; /* SOURCE: placeholder */ --cg-neutral-500: #8e8e8e; /* SOURCE: footer text */ --cg-neutral-700: #595959; /* SOURCE: legal / secondary text */ --cg-neutral-900: #222222; /* SOURCE: ink */ /* ---- semantic surfaces ---- */ --cg-surface-page: var(--cg-neutral-0)",
+      "$value": "#f2f1f7",
+      "$type": "color",
+      "$description": "SOURCE: alternate page wash",
       "$extensions": {
         "io.cloudgrid": {
-          "raw": true,
           "css": "--cg-lavender-50"
         }
       }
     },
     "neutral-100": {
-      "$value": "#f1f1f1; /* SOURCE: hairline / card border */ --cg-neutral-200: #e3e3e3; /* SOURCE: control border, inactive pill fill */ --cg-neutral-400: #acacac; /* SOURCE: placeholder */ --cg-neutral-500: #8e8e8e; /* SOURCE: footer text */ --cg-neutral-700: #595959; /* SOURCE: legal / secondary text */ --cg-neutral-900: #222222; /* SOURCE: ink */ /* ---- semantic surfaces ---- */ --cg-surface-page: var(--cg-neutral-0)",
+      "$value": "#f1f1f1",
+      "$type": "color",
+      "$description": "SOURCE: hairline / card border",
       "$extensions": {
         "io.cloudgrid": {
-          "raw": true,
           "css": "--cg-neutral-100"
         }
       }
     },
     "neutral-200": {
-      "$value": "#e3e3e3; /* SOURCE: control border, inactive pill fill */ --cg-neutral-400: #acacac; /* SOURCE: placeholder */ --cg-neutral-500: #8e8e8e; /* SOURCE: footer text */ --cg-neutral-700: #595959; /* SOURCE: legal / secondary text */ --cg-neutral-900: #222222; /* SOURCE: ink */ /* ---- semantic surfaces ---- */ --cg-surface-page: var(--cg-neutral-0)",
+      "$value": "#e3e3e3",
+      "$type": "color",
+      "$description": "SOURCE: control border, inactive pill fill",
       "$extensions": {
         "io.cloudgrid": {
-          "raw": true,
           "css": "--cg-neutral-200"
         }
       }
     },
     "neutral-400": {
-      "$value": "#acacac; /* SOURCE: placeholder */ --cg-neutral-500: #8e8e8e; /* SOURCE: footer text */ --cg-neutral-700: #595959; /* SOURCE: legal / secondary text */ --cg-neutral-900: #222222; /* SOURCE: ink */ /* ---- semantic surfaces ---- */ --cg-surface-page: var(--cg-neutral-0)",
+      "$value": "#acacac",
+      "$type": "color",
+      "$description": "SOURCE: placeholder",
       "$extensions": {
         "io.cloudgrid": {
-          "raw": true,
           "css": "--cg-neutral-400"
         }
       }
     },
     "neutral-500": {
-      "$value": "#8e8e8e; /* SOURCE: footer text */ --cg-neutral-700: #595959; /* SOURCE: legal / secondary text */ --cg-neutral-900: #222222; /* SOURCE: ink */ /* ---- semantic surfaces ---- */ --cg-surface-page: var(--cg-neutral-0)",
+      "$value": "#8e8e8e",
+      "$type": "color",
+      "$description": "SOURCE: footer text",
       "$extensions": {
         "io.cloudgrid": {
-          "raw": true,
           "css": "--cg-neutral-500"
         }
       }
     },
     "neutral-700": {
-      "$value": "#595959; /* SOURCE: legal / secondary text */ --cg-neutral-900: #222222; /* SOURCE: ink */ /* ---- semantic surfaces ---- */ --cg-surface-page: var(--cg-neutral-0)",
+      "$value": "#595959",
+      "$type": "color",
+      "$description": "SOURCE: legal / secondary text",
       "$extensions": {
         "io.cloudgrid": {
-          "raw": true,
           "css": "--cg-neutral-700"
         }
       }
     },
     "neutral-900": {
-      "$value": "#222222; /* SOURCE: ink */ /* ---- semantic surfaces ---- */ --cg-surface-page: var(--cg-neutral-0)",
+      "$value": "#222222",
+      "$type": "color",
+      "$description": "SOURCE: ink",
       "$extensions": {
         "io.cloudgrid": {
-          "raw": true,
           "css": "--cg-neutral-900"
         }
       }
@@ -448,10 +455,11 @@
       }
     },
     "display-md": {
-      "$value": "38px; /* SOURCE: onboarding H1 (was 42px) */ --cg-display-sm: 30px",
+      "$value": "38px",
+      "$type": "dimension",
+      "$description": "SOURCE: onboarding H1 (was 42px)",
       "$extensions": {
         "io.cloudgrid": {
-          "raw": true,
           "css": "--cg-display-md"
         }
       }
@@ -495,19 +503,21 @@
       }
     },
     "heading-md": {
-      "$value": "20px; /* SOURCE: card title */ --cg-heading-sm: 17px; /* SOURCE: step title */ --cg-heading-line: 1.3",
+      "$value": "20px",
+      "$type": "dimension",
+      "$description": "SOURCE: card title",
       "$extensions": {
         "io.cloudgrid": {
-          "raw": true,
           "css": "--cg-heading-md"
         }
       }
     },
     "heading-sm": {
-      "$value": "17px; /* SOURCE: step title */ --cg-heading-line: 1.3",
+      "$value": "17px",
+      "$type": "dimension",
+      "$description": "SOURCE: step title",
       "$extensions": {
         "io.cloudgrid": {
-          "raw": true,
           "css": "--cg-heading-sm"
         }
       }
@@ -522,37 +532,41 @@
       }
     },
     "body-lg": {
-      "$value": "19px; /* SOURCE: H1 subline */ --cg-body-md: 16px; /* SOURCE: default UI text */ --cg-body-sm: 15px; /* SOURCE: card body, legal */ --cg-caption: 13px; /* SOURCE: footer, helper */ --cg-body-line: 1.5",
+      "$value": "19px",
+      "$type": "dimension",
+      "$description": "SOURCE: H1 subline",
       "$extensions": {
         "io.cloudgrid": {
-          "raw": true,
           "css": "--cg-body-lg"
         }
       }
     },
     "body-md": {
-      "$value": "16px; /* SOURCE: default UI text */ --cg-body-sm: 15px; /* SOURCE: card body, legal */ --cg-caption: 13px; /* SOURCE: footer, helper */ --cg-body-line: 1.5",
+      "$value": "16px",
+      "$type": "dimension",
+      "$description": "SOURCE: default UI text",
       "$extensions": {
         "io.cloudgrid": {
-          "raw": true,
           "css": "--cg-body-md"
         }
       }
     },
     "body-sm": {
-      "$value": "15px; /* SOURCE: card body, legal */ --cg-caption: 13px; /* SOURCE: footer, helper */ --cg-body-line: 1.5",
+      "$value": "15px",
+      "$type": "dimension",
+      "$description": "SOURCE: card body, legal",
       "$extensions": {
         "io.cloudgrid": {
-          "raw": true,
           "css": "--cg-body-sm"
         }
       }
     },
     "caption": {
-      "$value": "13px; /* SOURCE: footer, helper */ --cg-body-line: 1.5",
+      "$value": "13px",
+      "$type": "dimension",
+      "$description": "SOURCE: footer, helper",
       "$extensions": {
         "io.cloudgrid": {
-          "raw": true,
           "css": "--cg-caption"
         }
       }
@@ -734,10 +748,11 @@
       }
     },
     "column-wide": {
-      "$value": "920px; /* SOURCE 844px; widened 2026-08-06 with the container */ --cg-page-pad: 32px",
+      "$value": "920px",
+      "$type": "dimension",
+      "$description": "SOURCE 844px; widened 2026-08-06 with the container",
       "$extensions": {
         "io.cloudgrid": {
-          "raw": true,
           "css": "--cg-column-wide"
         }
       }
@@ -845,37 +860,41 @@
       }
     },
     "radius-md": {
-      "$value": "12px; /* SOURCE: code block, OTP cell */ --cg-radius-lg: 14px; /* SOURCE: provider button, input, tool card */ --cg-radius-xl: 16px; /* SOURCE: option card */ --cg-radius-2xl: 24px; /* SOURCE: full-bleed purple panel */ --cg-radius-pill: 999px",
+      "$value": "12px",
+      "$type": "dimension",
+      "$description": "SOURCE: code block, OTP cell",
       "$extensions": {
         "io.cloudgrid": {
-          "raw": true,
           "css": "--cg-radius-md"
         }
       }
     },
     "radius-lg": {
-      "$value": "14px; /* SOURCE: provider button, input, tool card */ --cg-radius-xl: 16px; /* SOURCE: option card */ --cg-radius-2xl: 24px; /* SOURCE: full-bleed purple panel */ --cg-radius-pill: 999px",
+      "$value": "14px",
+      "$type": "dimension",
+      "$description": "SOURCE: provider button, input, tool card",
       "$extensions": {
         "io.cloudgrid": {
-          "raw": true,
           "css": "--cg-radius-lg"
         }
       }
     },
     "radius-xl": {
-      "$value": "16px; /* SOURCE: option card */ --cg-radius-2xl: 24px; /* SOURCE: full-bleed purple panel */ --cg-radius-pill: 999px",
+      "$value": "16px",
+      "$type": "dimension",
+      "$description": "SOURCE: option card",
       "$extensions": {
         "io.cloudgrid": {
-          "raw": true,
           "css": "--cg-radius-xl"
         }
       }
     },
     "radius-2xl": {
-      "$value": "24px; /* SOURCE: full-bleed purple panel */ --cg-radius-pill: 999px",
+      "$value": "24px",
+      "$type": "dimension",
+      "$description": "SOURCE: full-bleed purple panel",
       "$extensions": {
         "io.cloudgrid": {
-          "raw": true,
           "css": "--cg-radius-2xl"
         }
       }

package/dist/tokens.css

@@ -82,13 +82,20 @@
 
   /* ---- neutrals ---- */
   --cg-neutral-0: #ffffff;
-  --cg-lavender-50: #f2f1f7; /* SOURCE: alternate page wash */ --cg-neutral-100: #f1f1f1; /* SOURCE: hairline / card border */ --cg-neutral-200: #e3e3e3; /* SOURCE: control border, inactive pill fill */ --cg-neutral-400: #acacac; /* SOURCE: placeholder */ --cg-neutral-500: #8e8e8e; /* SOURCE: footer text */ --cg-neutral-700: #595959; /* SOURCE: legal / secondary text */ --cg-neutral-900: #222222; /* SOURCE: ink */ /* ---- semantic surfaces ---- */ --cg-surface-page: var(--cg-neutral-0);
-  --cg-neutral-100: #f1f1f1; /* SOURCE: hairline / card border */ --cg-neutral-200: #e3e3e3; /* SOURCE: control border, inactive pill fill */ --cg-neutral-400: #acacac; /* SOURCE: placeholder */ --cg-neutral-500: #8e8e8e; /* SOURCE: footer text */ --cg-neutral-700: #595959; /* SOURCE: legal / secondary text */ --cg-neutral-900: #222222; /* SOURCE: ink */ /* ---- semantic surfaces ---- */ --cg-surface-page: var(--cg-neutral-0);
-  --cg-neutral-200: #e3e3e3; /* SOURCE: control border, inactive pill fill */ --cg-neutral-400: #acacac; /* SOURCE: placeholder */ --cg-neutral-500: #8e8e8e; /* SOURCE: footer text */ --cg-neutral-700: #595959; /* SOURCE: legal / secondary text */ --cg-neutral-900: #222222; /* SOURCE: ink */ /* ---- semantic surfaces ---- */ --cg-surface-page: var(--cg-neutral-0);
-  --cg-neutral-400: #acacac; /* SOURCE: placeholder */ --cg-neutral-500: #8e8e8e; /* SOURCE: footer text */ --cg-neutral-700: #595959; /* SOURCE: legal / secondary text */ --cg-neutral-900: #222222; /* SOURCE: ink */ /* ---- semantic surfaces ---- */ --cg-surface-page: var(--cg-neutral-0);
-  --cg-neutral-500: #8e8e8e; /* SOURCE: footer text */ --cg-neutral-700: #595959; /* SOURCE: legal / secondary text */ --cg-neutral-900: #222222; /* SOURCE: ink */ /* ---- semantic surfaces ---- */ --cg-surface-page: var(--cg-neutral-0);
-  --cg-neutral-700: #595959; /* SOURCE: legal / secondary text */ --cg-neutral-900: #222222; /* SOURCE: ink */ /* ---- semantic surfaces ---- */ --cg-surface-page: var(--cg-neutral-0);
-  --cg-neutral-900: #222222; /* SOURCE: ink */ /* ---- semantic surfaces ---- */ --cg-surface-page: var(--cg-neutral-0);
+  /* SOURCE: alternate page wash */
+  --cg-lavender-50: #f2f1f7;
+  /* SOURCE: hairline / card border */
+  --cg-neutral-100: #f1f1f1;
+  /* SOURCE: control border, inactive pill fill */
+  --cg-neutral-200: #e3e3e3;
+  /* SOURCE: placeholder */
+  --cg-neutral-400: #acacac;
+  /* SOURCE: footer text */
+  --cg-neutral-500: #8e8e8e;
+  /* SOURCE: legal / secondary text */
+  --cg-neutral-700: #595959;
+  /* SOURCE: ink */
+  --cg-neutral-900: #222222;
 
   /* ---- semantic-surfaces ---- */
   --cg-surface-page: var(--cg-neutral-0);
@@ -144,20 +151,27 @@
      dominant). The SOURCE values were xl 64 / lg 48 / md 42 / sm 32. */
   --cg-display-xl: 56px;
   --cg-display-lg: 44px;
-  --cg-display-md: 38px; /* SOURCE: onboarding H1 (was 42px) */ --cg-display-sm: 30px;
+  /* SOURCE: onboarding H1 (was 42px) */
+  --cg-display-md: 38px;
   --cg-display-sm: 30px;
   --cg-display-line: 1.06;
   --cg-display-tracking: 0.012em;
 
   /* ---- manrope-ramp ---- */
   --cg-heading-lg: 24px;
-  --cg-heading-md: 20px; /* SOURCE: card title */ --cg-heading-sm: 17px; /* SOURCE: step title */ --cg-heading-line: 1.3;
-  --cg-heading-sm: 17px; /* SOURCE: step title */ --cg-heading-line: 1.3;
+  /* SOURCE: card title */
+  --cg-heading-md: 20px;
+  /* SOURCE: step title */
+  --cg-heading-sm: 17px;
   --cg-heading-line: 1.3;
-  --cg-body-lg: 19px; /* SOURCE: H1 subline */ --cg-body-md: 16px; /* SOURCE: default UI text */ --cg-body-sm: 15px; /* SOURCE: card body, legal */ --cg-caption: 13px; /* SOURCE: footer, helper */ --cg-body-line: 1.5;
-  --cg-body-md: 16px; /* SOURCE: default UI text */ --cg-body-sm: 15px; /* SOURCE: card body, legal */ --cg-caption: 13px; /* SOURCE: footer, helper */ --cg-body-line: 1.5;
-  --cg-body-sm: 15px; /* SOURCE: card body, legal */ --cg-caption: 13px; /* SOURCE: footer, helper */ --cg-body-line: 1.5;
-  --cg-caption: 13px; /* SOURCE: footer, helper */ --cg-body-line: 1.5;
+  /* SOURCE: H1 subline */
+  --cg-body-lg: 19px;
+  /* SOURCE: default UI text */
+  --cg-body-md: 16px;
+  /* SOURCE: card body, legal */
+  --cg-body-sm: 15px;
+  /* SOURCE: footer, helper */
+  --cg-caption: 13px;
   --cg-body-line: 1.5;
   --cg-body-tracking: 0em;
   --cg-mono-size: 14px;
@@ -183,7 +197,8 @@
   /* ---- layout ----
      layout (SOURCE measurements from the 1440px frames) */
   --cg-column-form: 414px;
-  --cg-column-wide: 920px; /* SOURCE 844px; widened 2026-08-06 with the container */ --cg-page-pad: 32px;
+  /* SOURCE 844px; widened 2026-08-06 with the container */
+  --cg-column-wide: 920px;
   --cg-page-pad: 32px;
   --cg-header-height: 90px;
   --cg-footer-height: 64px;
@@ -201,10 +216,14 @@
   /* ---- corners ---- */
   --cg-radius-xs: 8px;
   --cg-radius-sm: 10px;
-  --cg-radius-md: 12px; /* SOURCE: code block, OTP cell */ --cg-radius-lg: 14px; /* SOURCE: provider button, input, tool card */ --cg-radius-xl: 16px; /* SOURCE: option card */ --cg-radius-2xl: 24px; /* SOURCE: full-bleed purple panel */ --cg-radius-pill: 999px;
-  --cg-radius-lg: 14px; /* SOURCE: provider button, input, tool card */ --cg-radius-xl: 16px; /* SOURCE: option card */ --cg-radius-2xl: 24px; /* SOURCE: full-bleed purple panel */ --cg-radius-pill: 999px;
-  --cg-radius-xl: 16px; /* SOURCE: option card */ --cg-radius-2xl: 24px; /* SOURCE: full-bleed purple panel */ --cg-radius-pill: 999px;
-  --cg-radius-2xl: 24px; /* SOURCE: full-bleed purple panel */ --cg-radius-pill: 999px;
+  /* SOURCE: code block, OTP cell */
+  --cg-radius-md: 12px;
+  /* SOURCE: provider button, input, tool card */
+  --cg-radius-lg: 14px;
+  /* SOURCE: option card */
+  --cg-radius-xl: 16px;
+  /* SOURCE: full-bleed purple panel */
+  --cg-radius-2xl: 24px;
   --cg-radius-pill: 999px;
   --cg-border-width: 1px;
   --cg-border-width-strong: 1.5px;

package/dist/ui/accordion.d.ts

@@ -0,0 +1,7 @@
+import { Accordion as AccordionPrimitive } from "@base-ui/react/accordion";
+declare function Accordion({ className, ...props }: AccordionPrimitive.Root.Props): import("react").JSX.Element;
+declare function AccordionItem({ className, ...props }: AccordionPrimitive.Item.Props): import("react").JSX.Element;
+declare function AccordionTrigger({ className, children, ...props }: AccordionPrimitive.Trigger.Props): import("react").JSX.Element;
+declare function AccordionContent({ className, children, ...props }: AccordionPrimitive.Panel.Props): import("react").JSX.Element;
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };
+//# sourceMappingURL=accordion.d.ts.map

package/dist/ui/accordion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../src/ui/accordion.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,IAAI,kBAAkB,EAAE,MAAM,0BAA0B,CAAA;AAK1E,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,CAAC,IAAI,CAAC,KAAK,+BAQxE;AAED,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,CAAC,IAAI,CAAC,KAAK,+BAQ5E;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,kBAAkB,CAAC,OAAO,CAAC,KAAK,+BAiBlC;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,kBAAkB,CAAC,KAAK,CAAC,KAAK,+BAiBhC;AAED,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAA"}

package/dist/ui/accordion.js

@@ -0,0 +1,19 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Accordion as AccordionPrimitive } from "@base-ui/react/accordion";
+import { cn } from "../lib/cloudgrid-cn.js";
+import { ChevronDownIcon, ChevronUpIcon } from "lucide-react";
+function Accordion({ className, ...props }) {
+    return (_jsx(AccordionPrimitive.Root, { "data-slot": "accordion", className: cn("flex w-full flex-col", className), ...props }));
+}
+function AccordionItem({ className, ...props }) {
+    return (_jsx(AccordionPrimitive.Item, { "data-slot": "accordion-item", className: cn("not-last:border-b", className), ...props }));
+}
+function AccordionTrigger({ className, children, ...props }) {
+    return (_jsx(AccordionPrimitive.Header, { className: "flex", children: _jsxs(AccordionPrimitive.Trigger, { "data-slot": "accordion-trigger", className: cn("group/accordion-trigger relative flex flex-1 items-start justify-between rounded-lg border border-transparent py-2.5 text-left text-body-sm font-medium transition-all outline-none hover:underline focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring focus-visible:after:border-ring aria-disabled:pointer-events-none aria-disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4 **:data-[slot=accordion-trigger-icon]:text-muted-foreground", className), ...props, children: [children, _jsx(ChevronDownIcon, { "data-slot": "accordion-trigger-icon", className: "pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden" }), _jsx(ChevronUpIcon, { "data-slot": "accordion-trigger-icon", className: "pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline" })] }) }));
+}
+function AccordionContent({ className, children, ...props }) {
+    return (_jsx(AccordionPrimitive.Panel, { "data-slot": "accordion-content", className: "overflow-hidden text-body-sm data-open:animate-accordion-down data-closed:animate-accordion-up", ...props, children: _jsx("div", { className: cn("h-(--accordion-panel-height) pt-0 pb-2.5 data-ending-style:h-0 data-starting-style:h-0 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4", className), children: children }) }));
+}
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };
+//# sourceMappingURL=accordion.js.map

package/dist/ui/accordion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion.js","sourceRoot":"","sources":["../../src/ui/accordion.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,EAAE,SAAS,IAAI,kBAAkB,EAAE,MAAM,0BAA0B,CAAA;AAE1E,OAAO,EAAE,EAAE,EAAE,MAAM,wBAAwB,CAAA;AAC3C,OAAO,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,cAAc,CAAA;AAE7D,SAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAiC;IACvE,OAAO,CACL,KAAC,kBAAkB,CAAC,IAAI,iBACZ,WAAW,EACrB,SAAS,EAAE,EAAE,CAAC,sBAAsB,EAAE,SAAS,CAAC,KAC5C,KAAK,GACT,CACH,CAAA;AACH,CAAC;AAED,SAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAiC;IAC3E,OAAO,CACL,KAAC,kBAAkB,CAAC,IAAI,iBACZ,gBAAgB,EAC1B,SAAS,EAAE,EAAE,CAAC,mBAAmB,EAAE,SAAS,CAAC,KACzC,KAAK,GACT,CACH,CAAA;AACH,CAAC;AAED,SAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACyB;IACjC,OAAO,CACL,KAAC,kBAAkB,CAAC,MAAM,IAAC,SAAS,EAAC,MAAM,YACzC,MAAC,kBAAkB,CAAC,OAAO,iBACf,mBAAmB,EAC7B,SAAS,EAAE,EAAE,CACX,8fAA8f,EAC9f,SAAS,CACV,KACG,KAAK,aAER,QAAQ,EACT,KAAC,eAAe,iBAAW,wBAAwB,EAAC,SAAS,EAAC,2EAA2E,GAAG,EAC5I,KAAC,aAAa,iBAAW,wBAAwB,EAAC,SAAS,EAAC,kFAAkF,GAAG,IACtH,GACH,CAC7B,CAAA;AACH,CAAC;AAED,SAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACuB;IAC/B,OAAO,CACL,KAAC,kBAAkB,CAAC,KAAK,iBACb,mBAAmB,EAC7B,SAAS,EAAC,gGAAgG,KACtG,KAAK,YAET,cACE,SAAS,EAAE,EAAE,CACX,yLAAyL,EACzL,SAAS,CACV,YAEA,QAAQ,GACL,GACmB,CAC5B,CAAA;AACH,CAAC;AAED,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAA"}

package/dist/ui/badge.d.ts

@@ -0,0 +1,8 @@
+import { useRender } from "@base-ui/react/use-render";
+import { type VariantProps } from "class-variance-authority";
+declare const badgeVariants: (props?: ({
+    variant?: "link" | "default" | "secondary" | "destructive" | "outline" | "ghost" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function Badge({ className, variant, render, ...props }: useRender.ComponentProps<"span"> & VariantProps<typeof badgeVariants>): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+export { Badge, badgeVariants };
+//# sourceMappingURL=badge.d.ts.map

package/dist/ui/badge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../src/ui/badge.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AACrD,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAIjE,QAAA,MAAM,aAAa;;8EAqBlB,CAAA;AAED,iBAAS,KAAK,CAAC,EACb,SAAS,EACT,OAAmB,EACnB,MAAM,EACN,GAAG,KAAK,EACT,EAAE,SAAS,CAAC,cAAc,CAAC,MAAM,CAAC,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,8FAevE;AAED,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,CAAA"}

package/dist/ui/badge.js

@@ -0,0 +1,34 @@
+import { mergeProps } from "@base-ui/react/merge-props";
+import { useRender } from "@base-ui/react/use-render";
+import { cva } from "class-variance-authority";
+import { cn } from "../lib/cloudgrid-cn.js";
+const badgeVariants = cva("group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-4xl border border-transparent px-2 py-0.5 text-caption font-medium whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3!", {
+    variants: {
+        variant: {
+            default: "bg-primary text-primary-foreground [a]:hover:bg-primary/80",
+            secondary: "bg-secondary text-secondary-foreground [a]:hover:bg-secondary/80",
+            destructive: "bg-destructive/10 text-destructive focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:focus-visible:ring-destructive/40 [a]:hover:bg-destructive/20",
+            outline: "border-border text-foreground [a]:hover:bg-muted [a]:hover:text-muted-foreground",
+            ghost: "hover:bg-muted hover:text-muted-foreground dark:hover:bg-muted/50",
+            link: "text-primary underline-offset-4 hover:underline",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+    },
+});
+function Badge({ className, variant = "default", render, ...props }) {
+    return useRender({
+        defaultTagName: "span",
+        props: mergeProps({
+            className: cn(badgeVariants({ variant }), className),
+        }, props),
+        render,
+        state: {
+            slot: "badge",
+            variant,
+        },
+    });
+}
+export { Badge, badgeVariants };
+//# sourceMappingURL=badge.js.map

package/dist/ui/badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge.js","sourceRoot":"","sources":["../../src/ui/badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAA;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AACrD,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAA;AAEjE,OAAO,EAAE,EAAE,EAAE,MAAM,wBAAwB,CAAA;AAE3C,MAAM,aAAa,GAAG,GAAG,CACvB,8eAA8e,EAC9e;IACE,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EAAE,4DAA4D;YACrE,SAAS,EACP,kEAAkE;YACpE,WAAW,EACT,gKAAgK;YAClK,OAAO,EACL,kFAAkF;YACpF,KAAK,EACH,mEAAmE;YACrE,IAAI,EAAE,iDAAiD;SACxD;KACF;IACD,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;KACnB;CACF,CACF,CAAA;AAED,SAAS,KAAK,CAAC,EACb,SAAS,EACT,OAAO,GAAG,SAAS,EACnB,MAAM,EACN,GAAG,KAAK,EAC8D;IACtE,OAAO,SAAS,CAAC;QACf,cAAc,EAAE,MAAM;QACtB,KAAK,EAAE,UAAU,CACf;YACE,SAAS,EAAE,EAAE,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,SAAS,CAAC;SACrD,EACD,KAAK,CACN;QACD,MAAM;QACN,KAAK,EAAE;YACL,IAAI,EAAE,OAAO;YACb,OAAO;SACR;KACF,CAAC,CAAA;AACJ,CAAC;AAED,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,CAAA"}

package/dist/ui/button.d.ts

@@ -0,0 +1,9 @@
+import { Button as ButtonPrimitive } from "@base-ui/react/button";
+import { type VariantProps } from "class-variance-authority";
+declare const buttonVariants: (props?: ({
+    variant?: "link" | "default" | "secondary" | "destructive" | "outline" | "ghost" | null | undefined;
+    size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function Button({ className, variant, size, ...props }: ButtonPrimitive.Props & VariantProps<typeof buttonVariants>): import("react").JSX.Element;
+export { Button, buttonVariants };
+//# sourceMappingURL=button.d.ts.map

package/dist/ui/button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/ui/button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAA;AACjE,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAIjE,QAAA,MAAM,cAAc;;;8EAmCnB,CAAA;AAED,iBAAS,MAAM,CAAC,EACd,SAAS,EACT,OAAmB,EACnB,IAAgB,EAChB,GAAG,KAAK,EACT,EAAE,eAAe,CAAC,KAAK,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,+BAQ7D;AAED,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAA"}

package/dist/ui/button.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button as ButtonPrimitive } from "@base-ui/react/button";
+import { cva } from "class-variance-authority";
+import { cn } from "../lib/cloudgrid-cn.js";
+const buttonVariants = cva("group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-body-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", {
+    variants: {
+        variant: {
+            default: "bg-primary text-primary-foreground hover:bg-primary/80",
+            outline: "border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
+            secondary: "bg-secondary text-secondary-foreground hover:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)] aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
+            ghost: "hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50",
+            destructive: "bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40",
+            link: "text-primary underline-offset-4 hover:underline",
+        },
+        size: {
+            default: "h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
+            xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-caption in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
+            sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-caption in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
+            lg: "h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
+            icon: "size-8",
+            "icon-xs": "size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
+            "icon-sm": "size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg",
+            "icon-lg": "size-9",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+        size: "default",
+    },
+});
+function Button({ className, variant = "default", size = "default", ...props }) {
+    return (_jsx(ButtonPrimitive, { "data-slot": "button", className: cn(buttonVariants({ variant, size, className })), ...props }));
+}
+export { Button, buttonVariants };
+//# sourceMappingURL=button.js.map

package/dist/ui/button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.js","sourceRoot":"","sources":["../../src/ui/button.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAA;AACjE,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAA;AAEjE,OAAO,EAAE,EAAE,EAAE,MAAM,wBAAwB,CAAA;AAE3C,MAAM,cAAc,GAAG,GAAG,CACxB,8lBAA8lB,EAC9lB;IACE,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EAAE,wDAAwD;YACjE,OAAO,EACL,iLAAiL;YACnL,SAAS,EACP,gLAAgL;YAClL,KAAK,EACH,kHAAkH;YACpH,WAAW,EACT,6NAA6N;YAC/N,IAAI,EAAE,iDAAiD;SACxD;QACD,IAAI,EAAE;YACJ,OAAO,EACL,sFAAsF;YACxF,EAAE,EAAE,oNAAoN;YACxN,EAAE,EAAE,wNAAwN;YAC5N,EAAE,EAAE,sFAAsF;YAC1F,IAAI,EAAE,QAAQ;YACd,SAAS,EACP,yHAAyH;YAC3H,SAAS,EACP,oFAAoF;YACtF,SAAS,EAAE,QAAQ;SACpB;KACF;IACD,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;QAClB,IAAI,EAAE,SAAS;KAChB;CACF,CACF,CAAA;AAED,SAAS,MAAM,CAAC,EACd,SAAS,EACT,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,SAAS,EAChB,GAAG,KAAK,EACoD;IAC5D,OAAO,CACL,KAAC,eAAe,iBACJ,QAAQ,EAClB,SAAS,EAAE,EAAE,CAAC,cAAc,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,CAAC,KACvD,KAAK,GACT,CACH,CAAA;AACH,CAAC;AAED,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAA"}

package/dist/ui/card.d.ts

@@ -0,0 +1,12 @@
+import * as React from "react";
+declare function Card({ className, size, ...props }: React.ComponentProps<"div"> & {
+    size?: "default" | "sm";
+}): React.JSX.Element;
+declare function CardHeader({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardTitle({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardDescription({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardAction({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardContent({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardFooter({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+export { Card, CardHeader, CardFooter, CardTitle, CardAction, CardDescription, CardContent, };
+//# sourceMappingURL=card.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../src/ui/card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,iBAAS,IAAI,CAAC,EACZ,SAAS,EACT,IAAgB,EAChB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAAE,IAAI,CAAC,EAAE,SAAS,GAAG,IAAI,CAAA;CAAE,qBAY3D;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAWvE;AAED,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAWtE;AAED,iBAAS,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQ5E;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAWvE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQxE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAWvE;AAED,OAAO,EACL,IAAI,EACJ,UAAU,EACV,UAAU,EACV,SAAS,EACT,UAAU,EACV,eAAe,EACf,WAAW,GACZ,CAAA"}

package/dist/ui/card.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../lib/cloudgrid-cn.js";
+function Card({ className, size = "default", ...props }) {
+    return (_jsx("div", { "data-slot": "card", "data-size": size, className: cn("group/card flex flex-col gap-(--card-spacing) overflow-hidden rounded-xl bg-card py-(--card-spacing) text-body-sm text-card-foreground ring-1 ring-foreground/10 [--card-spacing:--spacing(4)] has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:[--card-spacing:--spacing(3)] data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl", className), ...props }));
+}
+function CardHeader({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "card-header", className: cn("group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-(--card-spacing) has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-(--card-spacing)", className), ...props }));
+}
+function CardTitle({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "card-title", className: cn("font-heading text-body-md leading-snug font-medium group-data-[size=sm]/card:text-body-sm", className), ...props }));
+}
+function CardDescription({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "card-description", className: cn("text-body-sm text-muted-foreground", className), ...props }));
+}
+function CardAction({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "card-action", className: cn("col-start-2 row-span-2 row-start-1 self-start justify-self-end", className), ...props }));
+}
+function CardContent({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "card-content", className: cn("px-(--card-spacing)", className), ...props }));
+}
+function CardFooter({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "card-footer", className: cn("flex items-center rounded-b-xl border-t bg-muted/50 p-(--card-spacing)", className), ...props }));
+}
+export { Card, CardHeader, CardFooter, CardTitle, CardAction, CardDescription, CardContent, };
+//# sourceMappingURL=card.js.map

package/dist/ui/card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.js","sourceRoot":"","sources":["../../src/ui/card.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,EAAE,EAAE,MAAM,wBAAwB,CAAA;AAE3C,SAAS,IAAI,CAAC,EACZ,SAAS,EACT,IAAI,GAAG,SAAS,EAChB,GAAG,KAAK,EACkD;IAC1D,OAAO,CACL,2BACY,MAAM,eACL,IAAI,EACf,SAAS,EAAE,EAAE,CACX,2ZAA2Z,EAC3Z,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAA;AACH,CAAC;AAED,SAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B;IACtE,OAAO,CACL,2BACY,aAAa,EACvB,SAAS,EAAE,EAAE,CACX,wPAAwP,EACxP,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAA;AACH,CAAC;AAED,SAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B;IACrE,OAAO,CACL,2BACY,YAAY,EACtB,SAAS,EAAE,EAAE,CACX,2FAA2F,EAC3F,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAA;AACH,CAAC;AAED,SAAS,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B;IAC3E,OAAO,CACL,2BACY,kBAAkB,EAC5B,SAAS,EAAE,EAAE,CAAC,oCAAoC,EAAE,SAAS,CAAC,KAC1D,KAAK,GACT,CACH,CAAA;AACH,CAAC;AAED,SAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B;IACtE,OAAO,CACL,2BACY,aAAa,EACvB,SAAS,EAAE,EAAE,CACX,gEAAgE,EAChE,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAA;AACH,CAAC;AAED,SAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B;IACvE,OAAO,CACL,2BACY,cAAc,EACxB,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,SAAS,CAAC,KAC3C,KAAK,GACT,CACH,CAAA;AACH,CAAC;AAED,SAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B;IACtE,OAAO,CACL,2BACY,aAAa,EACvB,SAAS,EAAE,EAAE,CACX,wEAAwE,EACxE,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAA;AACH,CAAC;AAED,OAAO,EACL,IAAI,EACJ,UAAU,EACV,UAAU,EACV,SAAS,EACT,UAAU,EACV,eAAe,EACf,WAAW,GACZ,CAAA"}

package/dist/ui/carousel.d.ts

@@ -0,0 +1,37 @@
+import * as React from "react";
+/**
+ * A scroll-snapped image strip with dot navigation. Ported from v0's
+ * `core/Carousel`, and the thing to preserve is its posture rather than its CSS.
+ *
+ * ## It works with JavaScript off, and that is deliberate
+ *
+ * The strip is natively scroll-snapped and the dots are **real anchors to real
+ * slide ids**, so navigation is browser behaviour, not script. The effect below
+ * only mirrors scroll position onto `aria-current`. It never creates the ability
+ * to move between slides, so nothing breaks when it does not run.
+ *
+ * If you change one thing here, do not make the dots buttons that call a handler.
+ * That would look equivalent and would silently make the component depend on
+ * hydration.
+ *
+ * `IntersectionObserver` is absent in jsdom and in any non-browser host, so its
+ * absence is checked rather than assumed: the component stays usable there, just
+ * without the scroll sync.
+ *
+ * v0's `band` and `container` wrappers are dropped, as everywhere else.
+ */
+type CarouselSlide = {
+    image: string;
+    alt: string;
+    caption?: string;
+    link?: string;
+};
+declare function Carousel({ title, slides, id, className, ...props }: Omit<React.ComponentProps<"section">, "ref" | "id"> & {
+    title?: string;
+    slides: CarouselSlide[];
+    /** Prefix for the per-slide anchor ids. Defaults to a generated unique one. */
+    id?: string;
+}): React.JSX.Element;
+export { Carousel };
+export type { CarouselSlide };
+//# sourceMappingURL=carousel.d.ts.map

package/dist/ui/carousel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"carousel.d.ts","sourceRoot":"","sources":["../../src/ui/carousel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,KAAK,aAAa,GAAG;IACnB,KAAK,EAAE,MAAM,CAAA;IACb,GAAG,EAAE,MAAM,CAAA;IACX,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AAED,iBAAS,QAAQ,CAAC,EAChB,KAAK,EACL,MAAM,EACN,EAAE,EACF,SAAS,EACT,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC,GAAG;IACvD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,EAAE,aAAa,EAAE,CAAA;IACvB,+EAA+E;IAC/E,EAAE,CAAC,EAAE,MAAM,CAAA;CACZ,qBAkFA;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA;AACnB,YAAY,EAAE,aAAa,EAAE,CAAA"}

package/dist/ui/carousel.js

@@ -0,0 +1,34 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../lib/cloudgrid-cn.js";
+function Carousel({ title, slides, id, className, ...props }) {
+    // Colons are stripped because useId emits them and they are not valid in a
+    // fragment identifier, which is what these ids are for.
+    const autoId = React.useId().replace(/:/g, "");
+    const prefix = id ?? `slide-${autoId}`;
+    const trackRef = React.useRef(null);
+    const [active, setActive] = React.useState(0);
+    React.useEffect(() => {
+        const track = trackRef.current;
+        if (!track || typeof IntersectionObserver === "undefined")
+            return;
+        const figures = [...track.children];
+        const observer = new IntersectionObserver((entries) => {
+            for (const entry of entries) {
+                if (entry.isIntersecting)
+                    setActive(figures.indexOf(entry.target));
+            }
+        }, { root: track, threshold: 0.6 });
+        figures.forEach((figure) => observer.observe(figure));
+        return () => observer.disconnect();
+    }, [slides]);
+    return (_jsxs("section", { "data-slot": "carousel", className: cn("flex flex-col gap-4", className), ...props, children: [title ? _jsx("h2", { className: "text-heading-lg font-medium text-ink", children: title }) : null, _jsx("div", { ref: trackRef, className: "flex snap-x snap-mandatory gap-4 overflow-x-auto scroll-smooth [-webkit-overflow-scrolling:touch]", children: slides.map((slide, i) => (_jsxs("figure", { id: `${prefix}-${i}`, className: "m-0 shrink-0 snap-start basis-[min(100%,32rem)]", children: [_jsx("img", { src: slide.image, alt: slide.alt, loading: "lazy", decoding: "async", className: "w-full rounded-xl" }), slide.caption ? (_jsx("figcaption", { className: "mt-2 text-body-sm text-body", children: slide.link ? (_jsx("a", { href: slide.link, className: "underline-offset-4 hover:underline", children: slide.caption })) : (slide.caption) })) : null] }, slide.image))) }), _jsx("div", { role: "group", "aria-label": title ?? "Carousel", className: "flex gap-2", children: slides.map((slide, i) => (
+                // An anchor rather than a button, and empty rather than labelled inline:
+                // the accessible name comes from aria-label, and it names the slide
+                // rather than the position alone, because "slide 3 of 7" tells a screen
+                // reader nothing about what is there.
+                _jsx("a", { href: `#${prefix}-${i}`, "aria-current": i === active ? "true" : "false", "aria-label": `Go to slide ${i + 1}: ${slide.alt}`, className: cn("size-2.5 rounded-pill border border-line transition-colors", "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring", i === active ? "border-ink bg-ink" : "hover:border-line-strong") }, slide.image))) })] }));
+}
+export { Carousel };
+//# sourceMappingURL=carousel.js.map

package/dist/ui/carousel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"carousel.js","sourceRoot":"","sources":["../../src/ui/carousel.tsx"],"names":[],"mappings":"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"}