@uisatin/ui 0.0.0-stage → 0.1.1

package/chunk-DO3TBNSC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/bar-chart.tsx"],"names":[],"mappings":"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","file":"chunk-DO3TBNSC.js","sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../lib/utils'\nimport { ChartCard, ChartLegendRow, ChartTooltip, defaultFormat, type ChartCardBaseProps } from './chart'\n\n/**\n * Bar chart, 1:1 with the uiKit `chart/barCard` (3607:18253) and its `chart/barColumn`\n * (3602:17543), in the shared card frame (chart.tsx).\n *\n * BarCard: a 206px plot, 32px axis gutter, 4 dashed border-subtle gridlines at nice ticks,\n * axis labels regular 12/18 text-muted, columns 8px apart with a 180px track, bars radius-md\n * in chart/3 and day labels medium 13 text-muted 6px below. Hover (or `highlight`) keeps the\n * hovered bar, outlines it 2px out in chart/3, shows its value above and bolds its day; the\n * other bars dim to a 30% tint of chart/3 on bg/card, so they follow the bar, not the brand.\n * The KPI above defaults to the sum, in full (formatValue is for the axis); an optional legend row can sit under the plot.\n *\n * When the data changes (a new period, say) the bars regrow from the baseline in 250 ms on\n * ease-out, revealed by clip-path so their rounded tops stay whole, and the day labels and the\n * axis fade in on the new scale. Not on the first paint; under reduced motion, or with\n * `reducedMotion`, the bars swap at once.\n */\nexport function niceMax(max: number) {\n  if (max <= 0) return 4\n  const raw = max / 4\n  const pow = 10 ** Math.floor(Math.log10(raw))\n  const step = [1, 1.5, 2, 2.5, 3, 5, 7.5, 10].map((m) => m * pow).find((s) => s >= raw) ?? 10 * pow\n  return step * 4\n}\n\n\nexport interface BarCardProps extends ChartCardBaseProps {\n  /** The legend row under the plot. */\n  legend?: { label: string; value?: string; note?: string }\n  /** Unit after the value in the tooltip (\"covers\"). */\n  unit?: string\n  /** Swap the bars without motion when the data changes, as under prefers-reduced-motion. */\n  reducedMotion?: boolean\n}\n\nconst TRACK = 180\n\nexport function BarCard({\n  data,\n  formatValue = defaultFormat,\n  highlight,\n  legend,\n  unit,\n  reducedMotion,\n  total,\n  ...props\n}: BarCardProps) {\n  const [hovered, setHovered] = React.useState<number | null>(null)\n  const [anchor, setAnchor] = React.useState<HTMLElement | null>(null)\n  const active = (hovered != null && hovered < data.length ? hovered : null) ?? highlight ?? null\n  // Counts real changes to the data (not a new array with the same values), so the bars\n  // remount and regrow; zero until the first change.\n  const signature = data.map((d) => `${d.label}:${d.value}`).join('|')\n  const [redraw, setRedraw] = React.useState({ signature, n: 0 })\n  if (redraw.signature !== signature) setRedraw({ signature, n: redraw.n + 1 })\n  const regrow = redraw.n > 0 && !reducedMotion\n  const max = niceMax(Math.max(0, ...data.map((d) => d.value)))\n  const ticks = [4, 3, 2, 1, 0].map((i) => (max / 4) * i)\n  const sum = data.reduce((n, d) => n + d.value, 0)\n\n  return (\n    <ChartCard total={total ?? defaultFormat(sum)} {...props}>\n      <div className=\"pt-2\">\n        <div className=\"relative flex h-[206px] items-end gap-2 pl-8\" onPointerLeave={() => setHovered(null)}>\n          {/* Gridlines at each tick but zero, dashed border-subtle. */}\n          {ticks.slice(0, 4).map((_, i) => (\n            <span\n              key={i}\n              aria-hidden\n              className=\"absolute right-0 left-8 h-px border-t border-dashed border-border-subtle\"\n              style={{ top: (TRACK / 4) * i }}\n            />\n          ))}\n          {ticks.map((t, i) => (\n            <span\n              key={`${redraw.n}-${i}`}\n              aria-hidden\n              className={cn(\n                'absolute left-6 w-6 -translate-x-full text-right text-xs leading-[18px] text-text-muted',\n                regrow && 'satin-bar-fade',\n              )}\n              style={{ top: (TRACK / 4) * i - 9 }}\n            >\n              {formatValue(t)}\n            </span>\n          ))}\n          <ul key={redraw.n} className=\"contents\" aria-label={props.title}>\n            {data.map((d, i) => {\n              const isActive = active === i\n              const dimmed = active !== null && !isActive\n              const height = (d.value / max) * TRACK\n              return (\n                <li\n                  key={d.label}\n                  tabIndex={0}\n                  aria-label={`${d.tooltipLabel ?? d.label}: ${formatValue(d.value)}${unit ? ` ${unit}` : ''}`}\n                  onPointerEnter={() => setHovered(i)}\n                  onFocus={() => setHovered(i)}\n                  onBlur={() => setHovered(null)}\n                  className=\"relative flex min-w-0 flex-1 flex-col items-center gap-1.5 rounded-md focus-visible:outline-none\"\n                >\n                  <div className=\"relative flex w-full flex-col items-center justify-end gap-1.5\" style={{ height: TRACK }}>\n                    {isActive && (\n                      <>\n                        {/* The tooltip floats 4px above the value. */}\n                        <ChartTooltip\n                          anchor={anchor}\n                          label={d.tooltipLabel ?? d.label}\n                          value={`${formatValue(d.value)}${unit ? ` ${unit}` : ''}`}\n                        />\n                        <span ref={setAnchor} className=\"text-sm leading-(--text-sm--line-height) font-medium text-text-default\">\n                          {formatValue(d.value)}\n                        </span>\n                      </>\n                    )}\n                    <span\n                      aria-hidden\n                      className={cn(\n                        'w-full rounded-md transition-[background-color,outline-color] duration-(--duration-fast) ease-(--ease-out)',\n                        // Dimmed bars stay a tint of chart/3 on the card, so the brand colour never reaches them.\n                        dimmed ? 'bg-[color-mix(in_oklab,var(--chart-3)_30%,var(--bg-card))]' : 'bg-chart-3',\n                        isActive && 'outline outline-offset-2 outline-chart-3',\n                        regrow && 'satin-bar-regrow',\n                      )}\n                      style={{ height }}\n                    />\n                  </div>\n                  <span\n                    className={cn(\n                      'text-sm leading-(--text-sm--line-height) font-medium whitespace-nowrap',\n                      isActive ? 'text-text-default' : 'text-text-muted',\n                      regrow && 'satin-bar-fade',\n                    )}\n                  >\n                    {d.label}\n                  </span>\n                </li>\n              )\n            })}\n          </ul>\n        </div>\n      </div>\n      {legend && (\n        <ChartLegendRow\n          color=\"var(--chart-3)\"\n          label={legend.label}\n          value={legend.value ?? formatValue(sum)}\n          note={legend.note}\n        />\n      )}\n    </ChartCard>\n  )\n}\n"]}

package/chunk-ESC5JCVQ.js

@@ -0,0 +1,90 @@
+import { FlappySprite, TetrisStill } from './chunk-KNUWZNFV.js';
+import { cn } from './chunk-H63FYCMY.js';
+import * as React from 'react';
+import { NavArrowDown, Check, EditPencil } from 'iconoir-react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function Thinking({
+  state = "collapsed",
+  label = "Thought",
+  steps = [],
+  indicator = "tetris",
+  onToggle,
+  className,
+  ...props
+}) {
+  const [open, setOpen] = React.useState(state === "expanded");
+  React.useEffect(() => setOpen(state === "expanded"), [state]);
+  const bodyId = `${React.useId()}-steps`;
+  return /* @__PURE__ */ jsxs("div", { "data-slot": "thinking", "data-state": open ? "expanded" : "collapsed", className: cn("w-full", className), ...props, children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        "aria-expanded": open,
+        "aria-controls": bodyId,
+        onClick: () => {
+          setOpen(!open);
+          onToggle?.(!open);
+        },
+        className: "group flex w-fit cursor-pointer items-center gap-3 rounded-md p-1 outline-none select-none focus-visible:[box-shadow:0_0_0_2px_var(--action-focus-ring)]",
+        children: [
+          /* @__PURE__ */ jsx(ThinkingMark, { indicator }),
+          /* @__PURE__ */ jsx("span", { className: "text-sm whitespace-nowrap text-text-muted", children: label }),
+          /* @__PURE__ */ jsx(
+            NavArrowDown,
+            {
+              "aria-hidden": true,
+              className: cn(
+                "size-icon-size-sm shrink-0 text-text-muted transition-transform duration-(--duration-base) ease-(--ease-out) [stroke-width:1.875]",
+                open && "rotate-180"
+              )
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { id: bodyId, "data-state": open ? "open" : "closed", className: "satin-expand", children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("div", { className: "flex gap-3 pt-2 pl-1", children: [
+      /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: "relative w-4 shrink-0 self-stretch", children: /* @__PURE__ */ jsx("div", { className: "absolute inset-y-0 left-1/2 w-px -translate-x-1/2 bg-linear-to-b from-component-rail-edge via-component-rail-center to-component-rail-edge" }) }),
+      /* @__PURE__ */ jsx("ol", { className: "flex min-w-0 flex-1 flex-col gap-2", children: steps.map((step, i) => /* @__PURE__ */ jsx("li", { className: "min-w-0", children: /* @__PURE__ */ jsx(Step, { step }) }, i)) })
+    ] }) }) })
+  ] });
+}
+function Step({ step }) {
+  switch (step.type) {
+    case "text":
+      return /* @__PURE__ */ jsx("p", { className: "text-body text-text-muted", children: step.text });
+    case "more":
+      return /* @__PURE__ */ jsx("p", { className: "text-sm whitespace-nowrap text-text-muted", children: step.label });
+    case "source":
+      return /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-3 p-1 text-sm", children: [
+        /* @__PURE__ */ jsx("span", { className: "flex size-4 shrink-0 items-center justify-center overflow-clip rounded-xs [&>*]:size-4", children: step.icon }),
+        /* @__PURE__ */ jsx("span", { className: "max-w-full shrink-0 truncate text-text-default", children: step.label }),
+        step.meta != null && /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate text-text-muted", children: step.meta })
+      ] });
+    case "tool":
+      return /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-2 p-1 text-sm [&>svg]:size-icon-size [&>svg]:shrink-0 [&>svg]:text-text-muted [&>svg]:[stroke-width:1.875]", children: [
+        step.icon ?? /* @__PURE__ */ jsx(EditPencil, {}),
+        /* @__PURE__ */ jsx("span", { className: "shrink-0 whitespace-nowrap text-text-default", children: step.label }),
+        /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate font-mono tracking-normal text-text-muted", children: step.target }),
+        (step.added != null || step.removed != null) && /* @__PURE__ */ jsxs("span", { className: "flex shrink-0 gap-1.5 font-mono tracking-normal whitespace-nowrap", children: [
+          step.added != null && /* @__PURE__ */ jsx("span", { className: "text-status-green-fg", children: step.added }),
+          step.removed != null && /* @__PURE__ */ jsx("span", { className: "text-status-red-fg", children: step.removed })
+        ] }),
+        step.meta != null && /* @__PURE__ */ jsx("span", { className: "shrink-0 whitespace-nowrap text-text-muted", children: step.meta })
+      ] });
+    default:
+      return /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-3 p-1 text-sm", children: [
+        /* @__PURE__ */ jsx(Check, { "aria-hidden": true, className: "size-icon-size-sm shrink-0 text-status-green-fg [stroke-width:1.875]" }),
+        /* @__PURE__ */ jsx("span", { className: "max-w-full shrink-0 truncate text-text-default", children: step.label }),
+        step.meta != null && /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate text-text-muted", children: step.meta })
+      ] });
+  }
+}
+function ThinkingMark({ indicator }) {
+  return indicator === "flappy" ? /* @__PURE__ */ jsx(FlappySprite, { size: 16, run: false }) : /* @__PURE__ */ jsx(TetrisStill, {});
+}
+
+export { Thinking };
+//# sourceMappingURL=chunk-ESC5JCVQ.js.map
+//# sourceMappingURL=chunk-ESC5JCVQ.js.map

package/chunk-ESC5JCVQ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/thinking.tsx"],"names":[],"mappings":";;;;;;AAwDO,SAAS,QAAA,CAAS;AAAA,EACvB,KAAA,GAAQ,WAAA;AAAA,EACR,KAAA,GAAQ,SAAA;AAAA,EACR,QAAQ,EAAC;AAAA,EACT,SAAA,GAAY,QAAA;AAAA,EACZ,QAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAkB;AAChB,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAU,KAAA,CAAA,QAAA,CAAS,UAAU,UAAU,CAAA;AAC3D,EAAM,KAAA,CAAA,SAAA,CAAU,MAAM,OAAA,CAAQ,KAAA,KAAU,UAAU,CAAA,EAAG,CAAC,KAAK,CAAC,CAAA;AAC5D,EAAA,MAAM,MAAA,GAAS,CAAA,EAAS,KAAA,CAAA,KAAA,EAAO,CAAA,MAAA,CAAA;AAE/B,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,WAAA,EAAU,UAAA,EAAW,cAAY,IAAA,GAAO,UAAA,GAAa,WAAA,EAAa,SAAA,EAAW,EAAA,CAAG,QAAA,EAAU,SAAS,CAAA,EAAI,GAAG,KAAA,EAC7G,QAAA,EAAA;AAAA,oBAAA,IAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,QAAA;AAAA,QACL,eAAA,EAAe,IAAA;AAAA,QACf,eAAA,EAAe,MAAA;AAAA,QACf,SAAS,MAAM;AACb,UAAA,OAAA,CAAQ,CAAC,IAAI,CAAA;AACb,UAAA,QAAA,GAAW,CAAC,IAAI,CAAA;AAAA,QAClB,CAAA;AAAA,QACA,SAAA,EAAU,0JAAA;AAAA,QAEV,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,gBAAa,SAAA,EAAsB,CAAA;AAAA,0BACpC,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,2CAAA,EAA6C,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,0BACnE,GAAA;AAAA,YAAC,YAAA;AAAA,YAAA;AAAA,cACC,aAAA,EAAW,IAAA;AAAA,cACX,SAAA,EAAW,EAAA;AAAA,gBACT,mIAAA;AAAA,gBACA,IAAA,IAAQ;AAAA;AACV;AAAA;AACF;AAAA;AAAA,KACF;AAAA,oBAGA,GAAA,CAAC,KAAA,EAAA,EAAI,EAAA,EAAI,MAAA,EAAQ,cAAY,IAAA,GAAO,MAAA,GAAS,QAAA,EAAU,SAAA,EAAU,gBAC/D,QAAA,kBAAA,GAAA,CAAC,KAAA,EAAA,EACC,QAAA,kBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,sBAAA,EACb,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,eAAW,IAAA,EAAC,SAAA,EAAU,sCACzB,QAAA,kBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,4IAAA,EAA6I,CAAA,EAC9J,CAAA;AAAA,0BACC,IAAA,EAAA,EAAG,SAAA,EAAU,sCACX,QAAA,EAAA,KAAA,CAAM,GAAA,CAAI,CAAC,IAAA,EAAM,CAAA,yBACf,IAAA,EAAA,EAAW,SAAA,EAAU,WACpB,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,MAAY,CAAA,EAAA,EADX,CAET,CACD,CAAA,EACH;AAAA,KAAA,EACF,GACF,CAAA,EACF;AAAA,GAAA,EACF,CAAA;AAEJ;AAEA,SAAS,IAAA,CAAK,EAAE,IAAA,EAAK,EAA2B;AAC9C,EAAA,QAAQ,KAAK,IAAA;AAAM,IACjB,KAAK,MAAA;AACH,MAAA,uBAAO,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,2BAAA,EAA6B,eAAK,IAAA,EAAK,CAAA;AAAA,IAC7D,KAAK,MAAA;AACH,MAAA,uBAAO,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,2CAAA,EAA6C,eAAK,KAAA,EAAM,CAAA;AAAA,IAC9E,KAAK,QAAA;AACH,MAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,6CAAA,EACb,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,wFAAA,EACb,QAAA,EAAA,IAAA,CAAK,IAAA,EACR,CAAA;AAAA,wBACA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,gDAAA,EAAkD,eAAK,KAAA,EAAM,CAAA;AAAA,QAC5E,IAAA,CAAK,QAAQ,IAAA,oBAAQ,GAAA,CAAC,UAAK,SAAA,EAAU,yCAAA,EAA2C,eAAK,IAAA,EAAK;AAAA,OAAA,EAC7F,CAAA;AAAA,IAEJ,KAAK,MAAA;AACH,MAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,0IAAA,EACZ,QAAA,EAAA;AAAA,QAAA,IAAA,CAAK,IAAA,wBAAS,UAAA,EAAA,EAAW,CAAA;AAAA,wBAC1B,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,8CAAA,EAAgD,eAAK,KAAA,EAAM,CAAA;AAAA,wBAC3E,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,mEAAA,EAAqE,eAAK,MAAA,EAAO,CAAA;AAAA,QAAA,CAC/F,IAAA,CAAK,SAAS,IAAA,IAAQ,IAAA,CAAK,WAAW,IAAA,qBACtC,IAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,mEAAA,EACb,QAAA,EAAA;AAAA,UAAA,IAAA,CAAK,SAAS,IAAA,oBAAQ,GAAA,CAAC,UAAK,SAAA,EAAU,sBAAA,EAAwB,eAAK,KAAA,EAAM,CAAA;AAAA,UACzE,IAAA,CAAK,WAAW,IAAA,oBAAQ,GAAA,CAAC,UAAK,SAAA,EAAU,oBAAA,EAAsB,eAAK,OAAA,EAAQ;AAAA,SAAA,EAC9E,CAAA;AAAA,QAED,IAAA,CAAK,QAAQ,IAAA,oBAAQ,GAAA,CAAC,UAAK,SAAA,EAAU,4CAAA,EAA8C,eAAK,IAAA,EAAK;AAAA,OAAA,EAChG,CAAA;AAAA,IAEJ;AACE,MAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,6CAAA,EACb,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,KAAA,EAAA,EAAM,aAAA,EAAW,IAAA,EAAC,SAAA,EAAU,sEAAA,EAAuE,CAAA;AAAA,wBACpG,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,gDAAA,EAAkD,eAAK,KAAA,EAAM,CAAA;AAAA,QAC5E,IAAA,CAAK,QAAQ,IAAA,oBAAQ,GAAA,CAAC,UAAK,SAAA,EAAU,yCAAA,EAA2C,eAAK,IAAA,EAAK;AAAA,OAAA,EAC7F,CAAA;AAAA;AAGR;AAGA,SAAS,YAAA,CAAa,EAAE,SAAA,EAAU,EAAqC;AACrE,EAAA,OAAO,SAAA,KAAc,QAAA,mBAAW,GAAA,CAAC,YAAA,EAAA,EAAa,IAAA,EAAM,IAAI,GAAA,EAAK,KAAA,EAAO,CAAA,mBAAK,GAAA,CAAC,WAAA,EAAA,EAAY,CAAA;AACxF","file":"chunk-ESC5JCVQ.js","sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { Check, EditPencil, NavArrowDown } from 'iconoir-react'\nimport { cn } from '../lib/utils'\nimport { FlappySprite, TetrisStill, type AgentLoadingIndicator } from './agent-loading'\n\n/**\n * Thinking, 1:1 with the uiKit `Thinking` set (3239:20908) and its parts thinking/header\n * (3239:20766), thinking/step (3239:20791) and thinking/_mark (3239:20674).\n *\n * What an agent did, once it is done; while it works, AgentLoading (agent-loading.tsx) shows\n * instead. collapsed: the mark at rest (the full tetris board, or the flappy bird), summary\n * and a 14px chevron. expanded: the same header with the chevron turned up, then 8px down a body\n * with 4px left inset: a 16px rail (1px line, rail-edge → rail-center → rail-edge) and, 12px\n * on, the steps 8px apart.\n *\n * The header is a button (click, Enter, Space) that opens and folds the body with the\n * Accordion's motion; the folded body stays mounted but leaves tab order and screen readers.\n * `state` sets the starting state and follows later changes, `onToggle` reports them.\n */\nexport type ThinkingStep =\n  /** A finished action: green check, label, muted meta that truncates. */\n  | { type?: 'task'; label: React.ReactNode; meta?: React.ReactNode }\n  /** A thought, wrapping in text/muted. */\n  | { type: 'text'; text: React.ReactNode }\n  /** A page that was read: 16px favicon, title, muted meta. */\n  | { type: 'source'; icon?: React.ReactNode; label: React.ReactNode; meta?: React.ReactNode }\n  /** A dev tool call: icon (pencil by default), name, mono target, +added −removed, meta. */\n  | {\n      type: 'tool'\n      icon?: React.ReactNode\n      label: React.ReactNode\n      target?: React.ReactNode\n      added?: React.ReactNode\n      removed?: React.ReactNode\n      meta?: React.ReactNode\n    }\n  /** The rest, folded: \"+5 more\". */\n  | { type: 'more'; label: React.ReactNode }\n\nexport type ThinkingState = 'collapsed' | 'expanded'\n/** The mark beside the summary, matching the AgentLoading that ran before it. */\nexport type ThinkingIndicator = AgentLoadingIndicator\n\nexport interface ThinkingProps extends Omit<React.ComponentProps<'div'>, 'onToggle'> {\n  /** collapsed once the agent is done, expanded when people open it. */\n  state?: ThinkingState\n  /** The summary, e.g. \"Thought for 2m 45s\". */\n  label?: React.ReactNode\n  steps?: ThinkingStep[]\n  /** The mark beside the summary. */\n  indicator?: ThinkingIndicator\n  onToggle?: (open: boolean) => void\n}\n\nexport function Thinking({\n  state = 'collapsed',\n  label = 'Thought',\n  steps = [],\n  indicator = 'tetris',\n  onToggle,\n  className,\n  ...props\n}: ThinkingProps) {\n  const [open, setOpen] = React.useState(state === 'expanded')\n  React.useEffect(() => setOpen(state === 'expanded'), [state])\n  const bodyId = `${React.useId()}-steps`\n\n  return (\n    <div data-slot=\"thinking\" data-state={open ? 'expanded' : 'collapsed'} className={cn('w-full', className)} {...props}>\n      <button\n        type=\"button\"\n        aria-expanded={open}\n        aria-controls={bodyId}\n        onClick={() => {\n          setOpen(!open)\n          onToggle?.(!open)\n        }}\n        className=\"group flex w-fit cursor-pointer items-center gap-3 rounded-md p-1 outline-none select-none focus-visible:[box-shadow:0_0_0_2px_var(--action-focus-ring)]\"\n      >\n        <ThinkingMark indicator={indicator} />\n        <span className=\"text-sm whitespace-nowrap text-text-muted\">{label}</span>\n        <NavArrowDown\n          aria-hidden\n          className={cn(\n            'size-icon-size-sm shrink-0 text-text-muted transition-transform duration-(--duration-base) ease-(--ease-out) [stroke-width:1.875]',\n            open && 'rotate-180',\n          )}\n        />\n      </button>\n      {/* The Accordion's motion (satin-expand): the body grows down from under the header, which\n          never moves, and its steps settle in from the top edge; closing is quicker. */}\n      <div id={bodyId} data-state={open ? 'open' : 'closed'} className=\"satin-expand\">\n        <div>\n          <div className=\"flex gap-3 pt-2 pl-1\">\n            <div aria-hidden className=\"relative w-4 shrink-0 self-stretch\">\n              <div className=\"absolute inset-y-0 left-1/2 w-px -translate-x-1/2 bg-linear-to-b from-component-rail-edge via-component-rail-center to-component-rail-edge\" />\n            </div>\n            <ol className=\"flex min-w-0 flex-1 flex-col gap-2\">\n              {steps.map((step, i) => (\n                <li key={i} className=\"min-w-0\">\n                  <Step step={step} />\n                </li>\n              ))}\n            </ol>\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\nfunction Step({ step }: { step: ThinkingStep }) {\n  switch (step.type) {\n    case 'text':\n      return <p className=\"text-body text-text-muted\">{step.text}</p>\n    case 'more':\n      return <p className=\"text-sm whitespace-nowrap text-text-muted\">{step.label}</p>\n    case 'source':\n      return (\n        <div className=\"flex min-w-0 items-center gap-3 p-1 text-sm\">\n          <span className=\"flex size-4 shrink-0 items-center justify-center overflow-clip rounded-xs [&>*]:size-4\">\n            {step.icon}\n          </span>\n          <span className=\"max-w-full shrink-0 truncate text-text-default\">{step.label}</span>\n          {step.meta != null && <span className=\"min-w-0 flex-1 truncate text-text-muted\">{step.meta}</span>}\n        </div>\n      )\n    case 'tool':\n      return (\n        <div className=\"flex min-w-0 items-center gap-2 p-1 text-sm [&>svg]:size-icon-size [&>svg]:shrink-0 [&>svg]:text-text-muted [&>svg]:[stroke-width:1.875]\">\n          {step.icon ?? <EditPencil />}\n          <span className=\"shrink-0 whitespace-nowrap text-text-default\">{step.label}</span>\n          <span className=\"min-w-0 flex-1 truncate font-mono tracking-normal text-text-muted\">{step.target}</span>\n          {(step.added != null || step.removed != null) && (\n            <span className=\"flex shrink-0 gap-1.5 font-mono tracking-normal whitespace-nowrap\">\n              {step.added != null && <span className=\"text-status-green-fg\">{step.added}</span>}\n              {step.removed != null && <span className=\"text-status-red-fg\">{step.removed}</span>}\n            </span>\n          )}\n          {step.meta != null && <span className=\"shrink-0 whitespace-nowrap text-text-muted\">{step.meta}</span>}\n        </div>\n      )\n    default:\n      return (\n        <div className=\"flex min-w-0 items-center gap-3 p-1 text-sm\">\n          <Check aria-hidden className=\"size-icon-size-sm shrink-0 text-status-green-fg [stroke-width:1.875]\" />\n          <span className=\"max-w-full shrink-0 truncate text-text-default\">{step.label}</span>\n          {step.meta != null && <span className=\"min-w-0 flex-1 truncate text-text-muted\">{step.meta}</span>}\n        </div>\n      )\n  }\n}\n\n/** thinking/_mark: the tetris board filled, or the flappy bird at rest. */\nfunction ThinkingMark({ indicator }: { indicator: ThinkingIndicator }) {\n  return indicator === 'flappy' ? <FlappySprite size={16} run={false} /> : <TetrisStill />\n}\n"]}

package/chunk-FDKIX4DC.js

@@ -0,0 +1,55 @@
+import { cn } from './chunk-H63FYCMY.js';
+import * as React from 'react';
+import { Checkbox as Checkbox$1 } from 'radix-ui';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function Checkbox({ className, label, description, placement = "left", id, ...props }) {
+  const autoId = React.useId();
+  const boxId = id ?? autoId;
+  const labelId = label ? `${boxId}-label` : void 0;
+  const descriptionId = description ? `${boxId}-description` : void 0;
+  const box = /* @__PURE__ */ jsx(
+    Checkbox$1.Root,
+    {
+      id: boxId,
+      "data-slot": "checkbox",
+      "aria-labelledby": labelId,
+      "aria-describedby": descriptionId,
+      className: cn("peer satin-checkbox", className),
+      ...props,
+      children: /* @__PURE__ */ jsx(Checkbox$1.Indicator, { className: "-m-px grid size-4 place-items-center", children: /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": true, children: props.checked === "indeterminate" ? /* @__PURE__ */ jsx("path", { d: "M3.6 8H12.4", stroke: "currentColor", strokeWidth: "1.25", strokeLinecap: "round" }) : /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M3.33333 8.66667L6 11.3333L12.6667 4.66667",
+          stroke: "currentColor",
+          strokeWidth: "1.25",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        }
+      ) }) })
+    }
+  );
+  if (!label && !description) return box;
+  return (
+    // The whole field is the <label>: the control, its label and its description all toggle it.
+    /* @__PURE__ */ jsxs(
+      "label",
+      {
+        htmlFor: boxId,
+        "data-slot": "checkbox-field",
+        className: cn("flex cursor-pointer items-start gap-2 has-disabled:cursor-not-allowed has-data-disabled:cursor-not-allowed [&>:first-child]:mt-0.5", placement === "right" && "flex-row-reverse justify-between"),
+        children: [
+          box,
+          /* @__PURE__ */ jsxs("div", { className: "grid gap-0.5 text-base", children: [
+            label && /* @__PURE__ */ jsx("span", { id: labelId, className: "block leading-5 font-medium text-text-default", children: label }),
+            description && /* @__PURE__ */ jsx("span", { id: descriptionId, className: "block leading-5 text-text-muted", children: description })
+          ] })
+        ]
+      }
+    )
+  );
+}
+
+export { Checkbox };
+//# sourceMappingURL=chunk-FDKIX4DC.js.map
+//# sourceMappingURL=chunk-FDKIX4DC.js.map

package/chunk-FDKIX4DC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/checkbox.tsx"],"names":["CheckboxPrimitive"],"mappings":";;;;;AAqBO,SAAS,QAAA,CAAS,EAAE,SAAA,EAAW,KAAA,EAAO,WAAA,EAAa,YAAY,MAAA,EAAQ,EAAA,EAAI,GAAG,KAAA,EAAM,EAAkB;AAC3G,EAAA,MAAM,SAAe,KAAA,CAAA,KAAA,EAAM;AAC3B,EAAA,MAAM,QAAQ,EAAA,IAAM,MAAA;AACpB,EAAA,MAAM,OAAA,GAAU,KAAA,GAAQ,CAAA,EAAG,KAAK,CAAA,MAAA,CAAA,GAAW,MAAA;AAC3C,EAAA,MAAM,aAAA,GAAgB,WAAA,GAAc,CAAA,EAAG,KAAK,CAAA,YAAA,CAAA,GAAiB,MAAA;AAE7D,EAAA,MAAM,GAAA,mBACJ,GAAA;AAAA,IAACA,UAAA,CAAkB,IAAA;AAAA,IAAlB;AAAA,MACC,EAAA,EAAI,KAAA;AAAA,MACJ,WAAA,EAAU,UAAA;AAAA,MACV,iBAAA,EAAiB,OAAA;AAAA,MACjB,kBAAA,EAAkB,aAAA;AAAA,MAClB,SAAA,EAAW,EAAA,CAAG,qBAAA,EAAuB,SAAS,CAAA;AAAA,MAC7C,GAAG,KAAA;AAAA,MAGJ,QAAA,kBAAA,GAAA,CAACA,UAAA,CAAkB,SAAA,EAAlB,EAA4B,SAAA,EAAU,sCAAA,EAErC,QAAA,kBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAM,IAAA,EAAK,MAAA,EAAO,IAAA,EAAK,SAAQ,WAAA,EAAY,IAAA,EAAK,MAAA,EAAO,aAAA,EAAW,IAAA,EACpE,QAAA,EAAA,KAAA,CAAM,OAAA,KAAY,eAAA,uBAChB,MAAA,EAAA,EAAK,CAAA,EAAE,aAAA,EAAc,MAAA,EAAO,cAAA,EAAe,WAAA,EAAY,MAAA,EAAO,aAAA,EAAc,SAAQ,CAAA,mBAErF,GAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,CAAA,EAAE,4CAAA;AAAA,UACF,MAAA,EAAO,cAAA;AAAA,UACP,WAAA,EAAY,MAAA;AAAA,UACZ,aAAA,EAAc,OAAA;AAAA,UACd,cAAA,EAAe;AAAA;AAAA,SAGrB,CAAA,EACF;AAAA;AAAA,GACF;AAGF,EAAA,IAAI,CAAC,KAAA,IAAS,CAAC,WAAA,EAAa,OAAO,GAAA;AAEnC,EAAA;AAAA;AAAA,oBAEE,IAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAAS,KAAA;AAAA,QACT,WAAA,EAAU,gBAAA;AAAA,QAEV,SAAA,EAAW,EAAA,CAAG,oIAAA,EAAsI,SAAA,KAAc,WAAW,kCAAkC,CAAA;AAAA,QAE9M,QAAA,EAAA;AAAA,UAAA,GAAA;AAAA,0BACD,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,wBAAA,EACZ,QAAA,EAAA;AAAA,YAAA,KAAA,wBACE,MAAA,EAAA,EAAK,EAAA,EAAI,OAAA,EAAS,SAAA,EAAU,iDAC1B,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,YAED,+BACC,GAAA,CAAC,MAAA,EAAA,EAAK,IAAI,aAAA,EAAe,SAAA,EAAU,mCAChC,QAAA,EAAA,WAAA,EACH;AAAA,WAAA,EAEJ;AAAA;AAAA;AAAA;AACF;AAEJ","file":"chunk-FDKIX4DC.js","sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { Checkbox as CheckboxPrimitive } from 'radix-ui'\nimport { cn } from '../lib/utils'\n\n/**\n * Checkbox, 1:1 with the uiKit `checkboxBase` (849:57531) and `checkbox` (849:57577) sets:\n * a 16px box, radius-sm, with checked and indeterminate states and an optional label and\n * description on either side, both 14px whatever the theme's body size (label medium,\n * description regular). With a label or description the whole field is a `<label>`, so a\n * click anywhere on it (box, label, description) toggles the box, and hovering it hovers the\n * box; the label names the box, the description is wired up with `aria-describedby`. The look of every state lives in styles/components.css.\n */\nexport interface CheckboxProps extends React.ComponentProps<typeof CheckboxPrimitive.Root> {\n  label?: React.ReactNode\n  description?: React.ReactNode\n  /** Which side of the text the box sits on. */\n  placement?: 'left' | 'right'\n}\n\nexport function Checkbox({ className, label, description, placement = 'left', id, ...props }: CheckboxProps) {\n  const autoId = React.useId()\n  const boxId = id ?? autoId\n  const labelId = label ? `${boxId}-label` : undefined\n  const descriptionId = description ? `${boxId}-description` : undefined\n\n  const box = (\n    <CheckboxPrimitive.Root\n      id={boxId}\n      data-slot=\"checkbox\"\n      aria-labelledby={labelId}\n      aria-describedby={descriptionId}\n      className={cn('peer satin-checkbox', className)}\n      {...props}\n    >\n      {/* -1px so the 16px glyph sits on the box, not inside its 1px border. */}\n      <CheckboxPrimitive.Indicator className=\"-m-px grid size-4 place-items-center\">\n        {/* The Check and Indeterminate glyphs from Figma, 16px at 1.25. */}\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" aria-hidden>\n          {props.checked === 'indeterminate' ? (\n            <path d=\"M3.6 8H12.4\" stroke=\"currentColor\" strokeWidth=\"1.25\" strokeLinecap=\"round\" />\n          ) : (\n            <path\n              d=\"M3.33333 8.66667L6 11.3333L12.6667 4.66667\"\n              stroke=\"currentColor\"\n              strokeWidth=\"1.25\"\n              strokeLinecap=\"round\"\n              strokeLinejoin=\"round\"\n            />\n          )}\n        </svg>\n      </CheckboxPrimitive.Indicator>\n    </CheckboxPrimitive.Root>\n  )\n\n  if (!label && !description) return box\n\n  return (\n    // The whole field is the <label>: the control, its label and its description all toggle it.\n    <label\n      htmlFor={boxId}\n      data-slot=\"checkbox-field\"\n      // The 16px box sits on the middle of the label's first 20px line.\n      className={cn('flex cursor-pointer items-start gap-2 has-disabled:cursor-not-allowed has-data-disabled:cursor-not-allowed [&>:first-child]:mt-0.5', placement === 'right' && 'flex-row-reverse justify-between')}\n    >\n      {box}\n      <div className=\"grid gap-0.5 text-base\">\n        {label && (\n          <span id={labelId} className=\"block leading-5 font-medium text-text-default\">\n            {label}\n          </span>\n        )}\n        {description && (\n          <span id={descriptionId} className=\"block leading-5 text-text-muted\">\n            {description}\n          </span>\n        )}\n      </div>\n    </label>\n  )\n}\n"]}

package/chunk-GICKPMJU.js

@@ -0,0 +1,239 @@
+import { Progress } from './chunk-7TXHCRAG.js';
+import { FileIcon, Attachment } from './chunk-H4NU7NPO.js';
+import { Button } from './chunk-HNQUX43Z.js';
+import { cn } from './chunk-H63FYCMY.js';
+import * as React from 'react';
+import { Page, WarningCircle, Xmark } from 'iconoir-react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var formatBytes = (n) => {
+  if (n < 1024) return `${n} B`;
+  if (n < 1024 * 1024) return `${Math.round(n / 1024)} KB`;
+  const mb = n / (1024 * 1024);
+  return `${mb < 10 ? mb.toFixed(1) : Math.round(mb)} MB`;
+};
+var sentOf = (total, percent) => {
+  const sent = total * percent / 100;
+  if (total < 1024) return String(Math.round(sent));
+  if (total < 1024 * 1024) return String(Math.round(sent / 1024));
+  const mb = total / (1024 * 1024);
+  return mb < 10 ? (sent / (1024 * 1024)).toFixed(1) : String(Math.round(sent / (1024 * 1024)));
+};
+var ext = (name) => name.includes(".") ? name.split(".").pop().toLowerCase() : "";
+function accepts(file, accept) {
+  if (!accept) return true;
+  const type = file.type.toLowerCase();
+  const e = `.${ext(file.name)}`;
+  return accept.split(",").map((s) => s.trim().toLowerCase()).filter(Boolean).some((rule) => rule.startsWith(".") ? rule === e : rule.endsWith("/*") ? type.startsWith(rule.slice(0, -1)) : rule === type);
+}
+function fileIconFor(name) {
+  const e = ext(name);
+  if (e === "pdf") return /* @__PURE__ */ jsx(FileIcon, { type: "pdf" });
+  if (["xls", "xlsx", "csv", "numbers"].includes(e)) return /* @__PURE__ */ jsx(FileIcon, { type: "xlsx" });
+  return /* @__PURE__ */ jsx(Page, { "aria-hidden": true, className: "size-icon-size text-text-muted [stroke-width:1.875]" });
+}
+function FileUpload({
+  files = [],
+  accept,
+  maxSize,
+  multiple = true,
+  disabled = false,
+  title = "Drop files here",
+  dropTitle = "Drop to upload",
+  description,
+  browseLabel = "Browse files",
+  onBrowse,
+  onFilesAdded,
+  onFilesRejected,
+  onCancel,
+  onRemove,
+  onOpen,
+  className,
+  ...props
+}) {
+  const inputRef = React.useRef(null);
+  const descriptionId = React.useId();
+  const [dragging, setDragging] = React.useState(false);
+  const depth = React.useRef(0);
+  const over = dragging || props["data-force"] === "drag";
+  const take = (list) => {
+    if (!list || disabled) return;
+    const picked = Array.from(list).slice(0, multiple ? void 0 : 1);
+    const ok = [];
+    const rejected = [];
+    for (const file of picked) {
+      if (!accepts(file, accept)) rejected.push({ file, reason: "type", message: "Type not supported" });
+      else if (maxSize != null && file.size > maxSize) rejected.push({ file, reason: "size", message: `Larger than ${formatBytes(maxSize)}` });
+      else ok.push(file);
+    }
+    if (ok.length) onFilesAdded?.(ok);
+    if (rejected.length) onFilesRejected?.(rejected);
+  };
+  const rows = files.filter((f) => f.status !== "done");
+  const done = files.filter((f) => f.status === "done");
+  return /* @__PURE__ */ jsxs("div", { "data-slot": "file-upload", className: cn("flex w-full flex-col gap-2", className), ...props, children: [
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        "data-slot": "file-upload-zone",
+        "data-dragging": over || void 0,
+        "data-disabled": disabled || void 0,
+        onDragEnter: (e) => {
+          if (disabled || !e.dataTransfer.types.includes("Files")) return;
+          e.preventDefault();
+          depth.current += 1;
+          setDragging(true);
+        },
+        onDragOver: (e) => {
+          if (disabled || !e.dataTransfer.types.includes("Files")) return;
+          e.preventDefault();
+          e.dataTransfer.dropEffect = "copy";
+        },
+        onDragLeave: () => {
+          depth.current = Math.max(0, depth.current - 1);
+          if (depth.current === 0) setDragging(false);
+        },
+        onDrop: (e) => {
+          if (disabled) return;
+          e.preventDefault();
+          depth.current = 0;
+          setDragging(false);
+          take(e.dataTransfer.files);
+        },
+        className: cn(
+          "flex flex-col items-center gap-4 rounded-2xl border border-dashed border-border-default px-6 py-8 text-center",
+          "transition-[background-color,border-color] duration-(--duration-fast) ease-(--ease-out)",
+          "data-[dragging]:border-status-brand-border data-[dragging]:bg-bg-hover",
+          "data-[disabled]:opacity-50"
+        ),
+        children: [
+          /* @__PURE__ */ jsx(UploadMark, { over }),
+          /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col items-center gap-1", children: [
+            /* @__PURE__ */ jsx("p", { className: "text-base font-medium text-text-default", children: over ? dropTitle : title }),
+            description && /* @__PURE__ */ jsx("p", { id: descriptionId, className: "text-sm text-text-muted", children: description })
+          ] }),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "secondary",
+              disabled: disabled || over,
+              "aria-describedby": description ? descriptionId : void 0,
+              onClick: () => onBrowse ? onBrowse() : inputRef.current?.click(),
+              children: browseLabel
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              ref: inputRef,
+              type: "file",
+              hidden: true,
+              tabIndex: -1,
+              accept,
+              multiple,
+              disabled,
+              onChange: (e) => {
+                take(e.currentTarget.files);
+                e.currentTarget.value = "";
+              }
+            }
+          )
+        ]
+      }
+    ),
+    rows.length > 0 && /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-2", "aria-label": "Files", children: rows.map((f) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(FileUploadItem, { file: f, onCancel, onRemove }) }, f.id)) }),
+    done.length > 0 && /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-2", "aria-label": "Attached files", children: done.map((f) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+      Attachment,
+      {
+        name: f.name,
+        meta: [ext(f.name).toUpperCase(), f.size != null ? formatBytes(f.size) : null].filter(Boolean).join(" \xB7 "),
+        icon: f.icon ?? fileIconFor(f.name),
+        onRemove: onRemove ? () => onRemove(f) : void 0,
+        onOpen: onOpen ? () => onOpen(f) : void 0,
+        className: "flex w-full [&_[data-attachment-main]]:flex-1 [&_[data-attachment-name]]:max-w-none"
+      }
+    ) }, f.id)) })
+  ] });
+}
+function FileUploadItem({
+  file,
+  onCancel,
+  onRemove,
+  className
+}) {
+  if (file.status === "error") {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        "data-slot": "file-upload-item",
+        "data-status": "error",
+        role: "alert",
+        className: cn("flex items-center gap-2 rounded-xl border border-status-red-border bg-status-red-bg py-2 pr-2 pl-3 text-sm", className),
+        children: [
+          /* @__PURE__ */ jsx(WarningCircle, { "aria-hidden": true, className: "size-icon-size shrink-0 text-status-red-fg [stroke-width:1.875]" }),
+          /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate font-medium text-text-default", children: file.name }),
+          /* @__PURE__ */ jsx("span", { className: "shrink-0 text-status-red-fg", children: file.error ?? "Upload failed" }),
+          onRemove && /* @__PURE__ */ jsx(Button, { variant: "tertiary", size: "xs", shape: "rounded", iconOnly: true, "aria-label": `Remove ${file.name}`, onClick: () => onRemove(file), children: /* @__PURE__ */ jsx(Xmark, { "aria-hidden": true }) })
+        ]
+      }
+    );
+  }
+  const known = file.progress != null;
+  const p = known ? Math.min(100, Math.max(0, file.progress)) : 0;
+  const meta = !known ? "Waiting\u2026" : file.size != null ? `${sentOf(file.size, p)} of ${formatBytes(file.size)} \xB7 ${Math.round(p)}%` : `${Math.round(p)}%`;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "file-upload-item",
+      "data-status": "uploading",
+      className: cn("flex items-center gap-2 rounded-xl border border-border-default bg-bg-card p-2 text-sm", className),
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "flex size-9 shrink-0 items-center justify-center rounded-lg bg-bg-muted [&_svg]:size-icon-size", children: file.icon ?? fileIconFor(file.name) }),
+        /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-1.5", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate font-medium text-text-default", children: file.name }),
+            /* @__PURE__ */ jsx("span", { className: "shrink-0 text-text-muted tabular-nums", children: meta })
+          ] }),
+          /* @__PURE__ */ jsx(Progress, { value: known ? p : void 0, showValue: false, "aria-label": `Uploading ${file.name}` })
+        ] }),
+        onCancel && /* @__PURE__ */ jsx(Button, { variant: "tertiary", size: "xs", shape: "rounded", iconOnly: true, "aria-label": `Cancel ${file.name}`, onClick: () => onCancel(file), children: /* @__PURE__ */ jsx(Xmark, { "aria-hidden": true }) })
+      ]
+    }
+  );
+}
+function UploadMark({ over }) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      "aria-hidden": true,
+      className: cn(
+        "flex size-10 shrink-0 items-center justify-center rounded-xl transition-[background-color] duration-(--duration-fast) ease-(--ease-out)",
+        over ? "bg-bg-card" : "bg-bg-muted"
+      ),
+      children: /* @__PURE__ */ jsxs("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", className: "text-text-subtle", children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M6 1.5H11.5V4.5C11.5 5.33 12.17 6 13 6H16V16.5C16 17.6 15.1 18.5 14 18.5H6C4.9 18.5 4 17.6 4 16.5V3.5C4 2.4 4.9 1.5 6 1.5Z",
+            fill: "currentColor"
+          }
+        ),
+        /* @__PURE__ */ jsx("path", { d: "M12.75 1.75L15.75 4.75H13.25C12.97 4.75 12.75 4.53 12.75 4.25V1.75Z", fill: "currentColor", opacity: "0.6" }),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M10 15V9.25M7.75 11.5L10 9.25L12.25 11.5",
+            stroke: "var(--bg-muted)",
+            strokeWidth: "1.25",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        )
+      ] })
+    }
+  );
+}
+
+export { FileUpload, FileUploadItem, fileIconFor, formatBytes };
+//# sourceMappingURL=chunk-GICKPMJU.js.map
+//# sourceMappingURL=chunk-GICKPMJU.js.map

package/chunk-GICKPMJU.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/file-upload.tsx"],"names":[],"mappings":"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","file":"chunk-GICKPMJU.js","sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { Page, WarningCircle, Xmark } from 'iconoir-react'\nimport { cn } from '../lib/utils'\nimport { Attachment, FileIcon } from './attachment'\nimport { Button } from './button'\nimport { Progress } from './progress'\n\n/**\n * FileUpload, 1:1 with the uiKit `FileUpload` set (4068:3717), its `FileUploadItem` rows\n * (4068:3453) and the `fileUpload/_icon` mark (4068:3405).\n *\n * The drop zone is the dashed EmptyState: a 40px bg/muted tile with a filled file and an up\n * arrow, the title (text/base medium), what it takes (Body/md, text/muted) and Browse files\n * (secondary), 16 apart, 32 / 24 in, radius-2xl. While files are dragged over it the zone fills\n * bg/hover with a status/brand dashed border, the tile turns bg/card, the title says \"Drop to\n * upload\" and Browse files is disabled.\n *\n * Under the zone, 8 apart, one row per file the app is handling (`files`):\n * - uploading: the type icon on a 36px tile, the name and \"1.0 of 2.4 MB · 40%\" over a small\n *   Progress (indeterminate while `progress` is left out), Cancel on the right.\n * - error: status/red ground and border, a red warning mark, the name, what went wrong, Remove.\n * - done: the file as an lg Attachment, full width, one under another.\n *\n * Dropping or browsing checks every file against `accept` and `maxSize`. What passes goes to\n * `onFilesAdded`; what fails goes to `onFilesRejected` with the reason, so the app can show it\n * as an error row. The upload itself is the app's: it keeps `files` up to date.\n */\nexport type FileUploadStatus = 'uploading' | 'error' | 'done'\n\nexport interface FileUploadFile {\n  id: string\n  name: string\n  /** In bytes; feeds \"1.0 of 2.4 MB\" and the attachment's meta. */\n  size?: number\n  status: FileUploadStatus\n  /** 0–100 while uploading; left out, the bar runs indeterminate and the meta says \"Waiting…\". */\n  progress?: number\n  /** What went wrong, for `error`. */\n  error?: React.ReactNode\n  /** Type icon; picked from the name when left out. */\n  icon?: React.ReactNode\n}\n\nexport interface FileUploadRejection {\n  file: File\n  reason: 'type' | 'size'\n  /** A ready message, e.g. \"Type not supported\" or \"Larger than 10 MB\". */\n  message: string\n}\n\nexport interface FileUploadProps extends Omit<React.ComponentProps<'div'>, 'title' | 'onDrop'> {\n  files?: FileUploadFile[]\n  /** As on `<input type=\"file\">`: MIME types, `image/*` or extensions, comma separated. */\n  accept?: string\n  /** Largest file, in bytes. */\n  maxSize?: number\n  multiple?: boolean\n  disabled?: boolean\n  title?: React.ReactNode\n  /** Shown while files are dragged over the zone. */\n  dropTitle?: React.ReactNode\n  /** What the zone takes, e.g. \"PDF, images, CSV · up to 10 MB\". */\n  description?: React.ReactNode\n  browseLabel?: string\n  /** Called instead of opening the file picker (demos, or an app that brings its own picker). */\n  onBrowse?: () => void\n  onFilesAdded?: (files: File[]) => void\n  onFilesRejected?: (rejections: FileUploadRejection[]) => void\n  /** Cancel on an uploading row. */\n  onCancel?: (file: FileUploadFile) => void\n  /** Remove on an error row or a done chip. */\n  onRemove?: (file: FileUploadFile) => void\n  onOpen?: (file: FileUploadFile) => void\n  /** Shows the drag-over look (state sheets, docs). */\n  'data-force'?: 'drag'\n}\n\nexport const formatBytes = (n: number) => {\n  if (n < 1024) return `${n} B`\n  if (n < 1024 * 1024) return `${Math.round(n / 1024)} KB`\n  const mb = n / (1024 * 1024)\n  return `${mb < 10 ? mb.toFixed(1) : Math.round(mb)} MB`\n}\n\n/** The sent part in the total's own unit, so it reads \"1.0 of 2.4 MB\". */\nconst sentOf = (total: number, percent: number) => {\n  const sent = (total * percent) / 100\n  if (total < 1024) return String(Math.round(sent))\n  if (total < 1024 * 1024) return String(Math.round(sent / 1024))\n  const mb = total / (1024 * 1024)\n  return mb < 10 ? (sent / (1024 * 1024)).toFixed(1) : String(Math.round(sent / (1024 * 1024)))\n}\n\nconst ext = (name: string) => (name.includes('.') ? name.split('.').pop()!.toLowerCase() : '')\n\nfunction accepts(file: File, accept?: string) {\n  if (!accept) return true\n  const type = file.type.toLowerCase()\n  const e = `.${ext(file.name)}`\n  return accept\n    .split(',')\n    .map((s) => s.trim().toLowerCase())\n    .filter(Boolean)\n    .some((rule) => (rule.startsWith('.') ? rule === e : rule.endsWith('/*') ? type.startsWith(rule.slice(0, -1)) : rule === type))\n}\n\n/** The type icon for a file name: PDF, spreadsheet, or a plain page. */\nexport function fileIconFor(name: string) {\n  const e = ext(name)\n  if (e === 'pdf') return <FileIcon type=\"pdf\" />\n  if (['xls', 'xlsx', 'csv', 'numbers'].includes(e)) return <FileIcon type=\"xlsx\" />\n  return <Page aria-hidden className=\"size-icon-size text-text-muted [stroke-width:1.875]\" />\n}\n\nexport function FileUpload({\n  files = [],\n  accept,\n  maxSize,\n  multiple = true,\n  disabled = false,\n  title = 'Drop files here',\n  dropTitle = 'Drop to upload',\n  description,\n  browseLabel = 'Browse files',\n  onBrowse,\n  onFilesAdded,\n  onFilesRejected,\n  onCancel,\n  onRemove,\n  onOpen,\n  className,\n  ...props\n}: FileUploadProps) {\n  const inputRef = React.useRef<HTMLInputElement>(null)\n  const descriptionId = React.useId()\n  const [dragging, setDragging] = React.useState(false)\n  // dragenter/dragleave fire for every child; count them so the zone only lets go when the\n  // pointer really leaves it.\n  const depth = React.useRef(0)\n  const over = dragging || props['data-force'] === 'drag'\n\n  const take = (list: FileList | null) => {\n    if (!list || disabled) return\n    const picked = Array.from(list).slice(0, multiple ? undefined : 1)\n    const ok: File[] = []\n    const rejected: FileUploadRejection[] = []\n    for (const file of picked) {\n      if (!accepts(file, accept)) rejected.push({ file, reason: 'type', message: 'Type not supported' })\n      else if (maxSize != null && file.size > maxSize) rejected.push({ file, reason: 'size', message: `Larger than ${formatBytes(maxSize)}` })\n      else ok.push(file)\n    }\n    if (ok.length) onFilesAdded?.(ok)\n    if (rejected.length) onFilesRejected?.(rejected)\n  }\n\n  const rows = files.filter((f) => f.status !== 'done')\n  const done = files.filter((f) => f.status === 'done')\n\n  return (\n    <div data-slot=\"file-upload\" className={cn('flex w-full flex-col gap-2', className)} {...props}>\n      <div\n        data-slot=\"file-upload-zone\"\n        data-dragging={over || undefined}\n        data-disabled={disabled || undefined}\n        onDragEnter={(e) => {\n          if (disabled || !e.dataTransfer.types.includes('Files')) return\n          e.preventDefault()\n          depth.current += 1\n          setDragging(true)\n        }}\n        onDragOver={(e) => {\n          if (disabled || !e.dataTransfer.types.includes('Files')) return\n          e.preventDefault()\n          e.dataTransfer.dropEffect = 'copy'\n        }}\n        onDragLeave={() => {\n          depth.current = Math.max(0, depth.current - 1)\n          if (depth.current === 0) setDragging(false)\n        }}\n        onDrop={(e) => {\n          if (disabled) return\n          e.preventDefault()\n          depth.current = 0\n          setDragging(false)\n          take(e.dataTransfer.files)\n        }}\n        className={cn(\n          'flex flex-col items-center gap-4 rounded-2xl border border-dashed border-border-default px-6 py-8 text-center',\n          'transition-[background-color,border-color] duration-(--duration-fast) ease-(--ease-out)',\n          'data-[dragging]:border-status-brand-border data-[dragging]:bg-bg-hover',\n          'data-[disabled]:opacity-50',\n        )}\n      >\n        <UploadMark over={over} />\n        <div className=\"flex w-full flex-col items-center gap-1\">\n          <p className=\"text-base font-medium text-text-default\">{over ? dropTitle : title}</p>\n          {description && (\n            <p id={descriptionId} className=\"text-sm text-text-muted\">\n              {description}\n            </p>\n          )}\n        </div>\n        <Button\n          variant=\"secondary\"\n          disabled={disabled || over}\n          aria-describedby={description ? descriptionId : undefined}\n          onClick={() => (onBrowse ? onBrowse() : inputRef.current?.click())}\n        >\n          {browseLabel}\n        </Button>\n        <input\n          ref={inputRef}\n          type=\"file\"\n          hidden\n          tabIndex={-1}\n          accept={accept}\n          multiple={multiple}\n          disabled={disabled}\n          onChange={(e) => {\n            take(e.currentTarget.files)\n            e.currentTarget.value = ''\n          }}\n        />\n      </div>\n\n      {rows.length > 0 && (\n        <ul className=\"flex flex-col gap-2\" aria-label=\"Files\">\n          {rows.map((f) => (\n            <li key={f.id}>\n              <FileUploadItem file={f} onCancel={onCancel} onRemove={onRemove} />\n            </li>\n          ))}\n        </ul>\n      )}\n\n      {done.length > 0 && (\n        <ul className=\"flex flex-col gap-2\" aria-label=\"Attached files\">\n          {done.map((f) => (\n            <li key={f.id}>\n              <Attachment\n                name={f.name}\n                meta={[ext(f.name).toUpperCase(), f.size != null ? formatBytes(f.size) : null].filter(Boolean).join(' · ')}\n                icon={f.icon ?? fileIconFor(f.name)}\n                onRemove={onRemove ? () => onRemove(f) : undefined}\n                onOpen={onOpen ? () => onOpen(f) : undefined}\n                // Full width, one under another: the name takes the room and the remove button\n                // sits at the right edge.\n                className=\"flex w-full [&_[data-attachment-main]]:flex-1 [&_[data-attachment-name]]:max-w-none\"\n              />\n            </li>\n          ))}\n        </ul>\n      )}\n    </div>\n  )\n}\n\n/** One file while it uploads or after it failed (FileUploadItem 4068:3453). */\nexport function FileUploadItem({\n  file,\n  onCancel,\n  onRemove,\n  className,\n}: {\n  file: FileUploadFile\n  onCancel?: (file: FileUploadFile) => void\n  onRemove?: (file: FileUploadFile) => void\n  className?: string\n}) {\n  if (file.status === 'error') {\n    return (\n      <div\n        data-slot=\"file-upload-item\"\n        data-status=\"error\"\n        role=\"alert\"\n        className={cn('flex items-center gap-2 rounded-xl border border-status-red-border bg-status-red-bg py-2 pr-2 pl-3 text-sm', className)}\n      >\n        <WarningCircle aria-hidden className=\"size-icon-size shrink-0 text-status-red-fg [stroke-width:1.875]\" />\n        <span className=\"min-w-0 flex-1 truncate font-medium text-text-default\">{file.name}</span>\n        <span className=\"shrink-0 text-status-red-fg\">{file.error ?? 'Upload failed'}</span>\n        {onRemove && (\n          <Button variant=\"tertiary\" size=\"xs\" shape=\"rounded\" iconOnly aria-label={`Remove ${file.name}`} onClick={() => onRemove(file)}>\n            <Xmark aria-hidden />\n          </Button>\n        )}\n      </div>\n    )\n  }\n\n  const known = file.progress != null\n  const p = known ? Math.min(100, Math.max(0, file.progress!)) : 0\n  const meta = !known\n    ? 'Waiting…'\n    : file.size != null\n      ? `${sentOf(file.size, p)} of ${formatBytes(file.size)} · ${Math.round(p)}%`\n      : `${Math.round(p)}%`\n\n  return (\n    <div\n      data-slot=\"file-upload-item\"\n      data-status=\"uploading\"\n      className={cn('flex items-center gap-2 rounded-xl border border-border-default bg-bg-card p-2 text-sm', className)}\n    >\n      <span className=\"flex size-9 shrink-0 items-center justify-center rounded-lg bg-bg-muted [&_svg]:size-icon-size\">\n        {file.icon ?? fileIconFor(file.name)}\n      </span>\n      <div className=\"flex min-w-0 flex-1 flex-col gap-1.5\">\n        <div className=\"flex items-center gap-2\">\n          <span className=\"min-w-0 flex-1 truncate font-medium text-text-default\">{file.name}</span>\n          <span className=\"shrink-0 text-text-muted tabular-nums\">{meta}</span>\n        </div>\n        <Progress value={known ? p : undefined} showValue={false} aria-label={`Uploading ${file.name}`} />\n      </div>\n      {onCancel && (\n        <Button variant=\"tertiary\" size=\"xs\" shape=\"rounded\" iconOnly aria-label={`Cancel ${file.name}`} onClick={() => onCancel(file)}>\n          <Xmark aria-hidden />\n        </Button>\n      )}\n    </div>\n  )\n}\n\n/** fileUpload/_icon: a filled file with its corner folded and an up arrow cut out of it. */\nfunction UploadMark({ over }: { over?: boolean }) {\n  return (\n    <span\n      aria-hidden\n      className={cn(\n        'flex size-10 shrink-0 items-center justify-center rounded-xl transition-[background-color] duration-(--duration-fast) ease-(--ease-out)',\n        over ? 'bg-bg-card' : 'bg-bg-muted',\n      )}\n    >\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" className=\"text-text-subtle\">\n        <path\n          d=\"M6 1.5H11.5V4.5C11.5 5.33 12.17 6 13 6H16V16.5C16 17.6 15.1 18.5 14 18.5H6C4.9 18.5 4 17.6 4 16.5V3.5C4 2.4 4.9 1.5 6 1.5Z\"\n          fill=\"currentColor\"\n        />\n        <path d=\"M12.75 1.75L15.75 4.75H13.25C12.97 4.75 12.75 4.53 12.75 4.25V1.75Z\" fill=\"currentColor\" opacity=\"0.6\" />\n        <path\n          d=\"M10 15V9.25M7.75 11.5L10 9.25L12.25 11.5\"\n          stroke=\"var(--bg-muted)\"\n          strokeWidth=\"1.25\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n        />\n      </svg>\n    </span>\n  )\n}\n"]}

package/chunk-GQA24FYG.js

@@ -0,0 +1,57 @@
+import { cn } from './chunk-H63FYCMY.js';
+import 'react';
+import { Accordion as Accordion$1 } from 'radix-ui';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function Accordion({ className, ...props }) {
+  return /* @__PURE__ */ jsx(Accordion$1.Root, { "data-slot": "accordion", className: cn("flex w-full flex-col", className), ...props });
+}
+function AccordionItem({ title, icon, children, className, "data-force": force, ...props }) {
+  return /* @__PURE__ */ jsxs(Accordion$1.Item, { "data-slot": "accordion-item", className: cn("border-b border-border-subtle py-1", className), ...props, children: [
+    /* @__PURE__ */ jsx(Accordion$1.Header, { className: "flex", children: /* @__PURE__ */ jsxs(
+      Accordion$1.Trigger,
+      {
+        "data-force": force,
+        className: cn(
+          "group flex h-10 w-full cursor-pointer items-center gap-3 rounded-lg px-2 text-left outline-none",
+          "transition-[background-color,box-shadow] duration-(--duration-fast) ease-(--ease-out)",
+          "hover:bg-bg-hover data-[force=hover]:bg-bg-hover",
+          "focus-visible:bg-bg-hover focus-visible:[box-shadow:0_0_0_2px_var(--action-focus-ring)]",
+          "data-[force=focus]:bg-bg-hover data-[force=focus]:[box-shadow:0_0_0_2px_var(--action-focus-ring)]",
+          "disabled:cursor-not-allowed disabled:opacity-50"
+        ),
+        children: [
+          icon && /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "grid size-4 shrink-0 place-items-center text-text-muted [&_svg]:size-4 [&_svg]:[stroke-width:1.875]", children: icon }),
+          /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 text-base leading-[21px] font-medium text-text-default", children: title }),
+          /* @__PURE__ */ jsx(
+            "svg",
+            {
+              width: "16",
+              height: "16",
+              viewBox: "0 0 16 16",
+              fill: "none",
+              "aria-hidden": true,
+              className: "shrink-0 text-text-muted transition-transform duration-(--duration-base) ease-(--ease-out) group-data-[state=open]:rotate-180",
+              children: /* @__PURE__ */ jsx("path", { d: "M4 6L8 10L12 6", stroke: "currentColor", strokeWidth: "1.25", strokeLinecap: "round", strokeLinejoin: "round" })
+            }
+          )
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsx(Accordion$1.Content, { "data-slot": "accordion-content", className: "satin-accordion-content", children: /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "pt-1 pr-2 pb-3 text-base leading-[21px] text-text-muted",
+          // Lined up with the title: past the icon and its gap when there is one.
+          icon ? "pl-9" : "pl-2"
+        ),
+        children
+      }
+    ) })
+  ] });
+}
+
+export { Accordion, AccordionItem };
+//# sourceMappingURL=chunk-GQA24FYG.js.map
+//# sourceMappingURL=chunk-GQA24FYG.js.map

package/chunk-GQA24FYG.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/accordion.tsx"],"names":["AccordionPrimitive"],"mappings":";;;;;AAuBO,SAAS,SAAA,CAAU,EAAE,SAAA,EAAW,GAAG,OAAM,EAAmB;AACjE,EAAA,uBAAO,GAAA,CAACA,WAAA,CAAmB,IAAA,EAAnB,EAAwB,WAAA,EAAU,WAAA,EAAY,SAAA,EAAW,EAAA,CAAG,sBAAA,EAAwB,SAAS,CAAA,EAAI,GAAG,KAAA,EAAO,CAAA;AACrH;AAUO,SAAS,aAAA,CAAc,EAAE,KAAA,EAAO,IAAA,EAAM,QAAA,EAAU,WAAW,YAAA,EAAc,KAAA,EAAO,GAAG,KAAA,EAAM,EAAuB;AACrH,EAAA,uBACE,IAAA,CAACA,WAAA,CAAmB,IAAA,EAAnB,EAAwB,WAAA,EAAU,gBAAA,EAAiB,SAAA,EAAW,EAAA,CAAG,oCAAA,EAAsC,SAAS,CAAA,EAAI,GAAG,KAAA,EACtH,QAAA,EAAA;AAAA,oBAAA,GAAA,CAACA,WAAA,CAAmB,MAAA,EAAnB,EAA0B,SAAA,EAAU,MAAA,EACnC,QAAA,kBAAA,IAAA;AAAA,MAACA,WAAA,CAAmB,OAAA;AAAA,MAAnB;AAAA,QACC,YAAA,EAAY,KAAA;AAAA,QACZ,SAAA,EAAW,EAAA;AAAA,UACT,iGAAA;AAAA,UACA,uFAAA;AAAA,UACA,kDAAA;AAAA,UACA,yFAAA;AAAA,UACA,mGAAA;AAAA,UACA;AAAA,SACF;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,IAAA,wBACE,MAAA,EAAA,EAAK,aAAA,EAAW,IAAA,EAAC,SAAA,EAAU,uGACzB,QAAA,EAAA,IAAA,EACH,CAAA;AAAA,0BAEF,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,uEAAA,EAAyE,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,0BAC/F,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,KAAA,EAAM,IAAA;AAAA,cACN,MAAA,EAAO,IAAA;AAAA,cACP,OAAA,EAAQ,WAAA;AAAA,cACR,IAAA,EAAK,MAAA;AAAA,cACL,aAAA,EAAW,IAAA;AAAA,cACX,SAAA,EAAU,+HAAA;AAAA,cAEV,QAAA,kBAAA,GAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,gBAAA,EAAiB,MAAA,EAAO,cAAA,EAAe,WAAA,EAAY,MAAA,EAAO,aAAA,EAAc,OAAA,EAAQ,cAAA,EAAe,OAAA,EAAQ;AAAA;AAAA;AACjH;AAAA;AAAA,KACF,EACF,CAAA;AAAA,wBACCA,WAAA,CAAmB,OAAA,EAAnB,EAA2B,WAAA,EAAU,mBAAA,EAAoB,WAAU,yBAAA,EAClE,QAAA,kBAAA,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,EAAA;AAAA,UACT,yDAAA;AAAA;AAAA,UAEA,OAAO,MAAA,GAAS;AAAA,SAClB;AAAA,QAEC;AAAA;AAAA,KACH,EACF;AAAA,GAAA,EACF,CAAA;AAEJ","file":"chunk-GQA24FYG.js","sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { Accordion as AccordionPrimitive } from 'radix-ui'\nimport { cn } from '../lib/utils'\n\n/**\n * Accordion, 1:1 with the uiKit `Accordion / Item` set (4025:3554): sections under a\n * border/subtle rule, 4px top and bottom. The header is a 40px row, 8px in, radius-lg, with an\n * optional 16px lead icon (text/muted), the 14px medium title and a 16px chevron, 12px apart;\n * hover fills it bg/hover, keyboard focus adds the 2px focus ring. Open, the chevron turns up\n * and the content follows in 14px text/muted, 4 / 8 / 12 / 8 in, lined up with the title.\n *\n * Built on the Radix Accordion: the header is a button with aria-expanded, Enter or Space\n * toggles it, arrow keys move between headers. `type=\"single\"` keeps one section open\n * (`collapsible` lets it close too); `type=\"multiple\"` opens any number.\n *\n * Opening, the header stays put and the section grows downwards to its content's height over\n * 250 ms on the kit's ease-out, while the content settles from 98% scale (from its top edge) and\n * 92% opacity to full; closing runs the same way back in 200 ms.\n */\nexport type AccordionProps = React.ComponentProps<typeof AccordionPrimitive.Root>\n\nexport function Accordion({ className, ...props }: AccordionProps) {\n  return <AccordionPrimitive.Root data-slot=\"accordion\" className={cn('flex w-full flex-col', className)} {...props} />\n}\n\nexport interface AccordionItemProps extends Omit<React.ComponentProps<typeof AccordionPrimitive.Item>, 'title'> {\n  title: React.ReactNode\n  /** A 16px icon before the title. */\n  icon?: React.ReactNode\n  /** Show a state without interacting, for state sheets. */\n  'data-force'?: 'hover' | 'focus'\n}\n\nexport function AccordionItem({ title, icon, children, className, 'data-force': force, ...props }: AccordionItemProps) {\n  return (\n    <AccordionPrimitive.Item data-slot=\"accordion-item\" className={cn('border-b border-border-subtle py-1', className)} {...props}>\n      <AccordionPrimitive.Header className=\"flex\">\n        <AccordionPrimitive.Trigger\n          data-force={force}\n          className={cn(\n            'group flex h-10 w-full cursor-pointer items-center gap-3 rounded-lg px-2 text-left outline-none',\n            'transition-[background-color,box-shadow] duration-(--duration-fast) ease-(--ease-out)',\n            'hover:bg-bg-hover data-[force=hover]:bg-bg-hover',\n            'focus-visible:bg-bg-hover focus-visible:[box-shadow:0_0_0_2px_var(--action-focus-ring)]',\n            'data-[force=focus]:bg-bg-hover data-[force=focus]:[box-shadow:0_0_0_2px_var(--action-focus-ring)]',\n            'disabled:cursor-not-allowed disabled:opacity-50',\n          )}\n        >\n          {icon && (\n            <span aria-hidden className=\"grid size-4 shrink-0 place-items-center text-text-muted [&_svg]:size-4 [&_svg]:[stroke-width:1.875]\">\n              {icon}\n            </span>\n          )}\n          <span className=\"min-w-0 flex-1 text-base leading-[21px] font-medium text-text-default\">{title}</span>\n          <svg\n            width=\"16\"\n            height=\"16\"\n            viewBox=\"0 0 16 16\"\n            fill=\"none\"\n            aria-hidden\n            className=\"shrink-0 text-text-muted transition-transform duration-(--duration-base) ease-(--ease-out) group-data-[state=open]:rotate-180\"\n          >\n            <path d=\"M4 6L8 10L12 6\" stroke=\"currentColor\" strokeWidth=\"1.25\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n          </svg>\n        </AccordionPrimitive.Trigger>\n      </AccordionPrimitive.Header>\n      <AccordionPrimitive.Content data-slot=\"accordion-content\" className=\"satin-accordion-content\">\n        <div\n          className={cn(\n            'pt-1 pr-2 pb-3 text-base leading-[21px] text-text-muted',\n            // Lined up with the title: past the icon and its gap when there is one.\n            icon ? 'pl-9' : 'pl-2',\n          )}\n        >\n          {children}\n        </div>\n      </AccordionPrimitive.Content>\n    </AccordionPrimitive.Item>\n  )\n}\n"]}