@evinvest/uikit 0.19.0 → 0.20.0

package/README.md

@@ -16,11 +16,23 @@ is hand-rolled in [`./primitives`](src/primitives). Runtime dependencies are jus
 > This is the first library in the monorepo that ships runtime deps — a UI kit
 > can't be zero-dep like the `architecture` kernel. See the repo `AGENTS.md`.
 
-The bundle is a **`"use client"`** module (it's interactive — hooks, context,
-the DOM), so it can be imported from React Server Components / the Next.js App
-Router directly. One consequence: `cn` re-exported here is therefore client-only;
-if you need class merging in a **server** component, keep a local `cn`
-(`clsx` + `tailwind-merge`) rather than importing it from the kit.
+The kit ships **one file per module**, each with its own boundary: the
+interactive ones (hooks, context, event handlers — `Select`, `Dialog`, `Field`,
+`Input`, …) start with `"use client"`, and the static ones (`Button`,
+`Section`/`Band`, `Table`, `Badge`, `Card`, `Footer`, `Label`, `cn`, …) do not.
+Import everything from `@evinvest/uikit` in a Server Component: a static
+component renders on the server and sends the browser nothing, and a client one
+is a client reference as usual. `cn` is server-safe.
+
+Keep it that way when adding to the kit:
+
+- a module with a hook, a context or an `on*={…}` handler says `"use client"`
+  on its first line, and one without says nothing —
+  `test/client-boundary.test.ts` derives which is which from the source;
+- `src/index.ts` names every re-export; `export *` fails the same test. A
+  bundler has to load every starred module to learn its names, so one star on
+  a client module ships it to every page that imports anything from the kit —
+  on the aquafix landing that was ~26 KB gz of components it never rendered.
 
 ## Install
 

package/dist/components/accordion.js

@@ -0,0 +1,136 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../lib/cn.js";
+import { useControllableState } from "../primitives/use-controllable-state.js";
+import {
+  ACCORDION_CONTENT,
+  ACCORDION_CONTENT_INNER,
+  ACCORDION_HEADER,
+  ACCORDION_ITEM,
+  ACCORDION_TRIGGER
+} from "../generated/accordion.js";
+const AccordionContext = React.createContext(null);
+function useAccordion() {
+  const ctx = React.useContext(AccordionContext);
+  if (!ctx) throw new Error("Accordion parts must be used within <Accordion>");
+  return ctx;
+}
+const ItemContext = React.createContext(null);
+function useItemValue() {
+  const value = React.useContext(ItemContext);
+  if (value === null)
+    throw new Error("AccordionTrigger/Content must be used within <AccordionItem>");
+  return value;
+}
+function Accordion({
+  type = "single",
+  collapsible = false,
+  value,
+  defaultValue = [],
+  onValueChange,
+  children,
+  ...props
+}) {
+  const [open, setOpen] = useControllableState({
+    ...value !== void 0 ? { value } : {},
+    defaultValue,
+    ...onValueChange ? { onChange: onValueChange } : {}
+  });
+  const isOpen = (v) => open.includes(v);
+  const toggle = (v) => {
+    if (type === "multiple") {
+      setOpen(open.includes(v) ? open.filter((x) => x !== v) : [...open, v]);
+      return;
+    }
+    if (open.includes(v)) setOpen(collapsible ? [] : open);
+    else setOpen([v]);
+  };
+  return /* @__PURE__ */ jsx(AccordionContext.Provider, { value: { isOpen, toggle }, children: /* @__PURE__ */ jsx("div", { "data-slot": "accordion", ...props, children }) });
+}
+function AccordionItem({
+  className,
+  value,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(ItemContext.Provider, { value, children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "accordion-item",
+      className: cn(ACCORDION_ITEM, className),
+      ...props,
+      children
+    }
+  ) });
+}
+function AccordionTrigger({
+  className,
+  children,
+  onClick,
+  ...props
+}) {
+  const { isOpen, toggle } = useAccordion();
+  const value = useItemValue();
+  const open = isOpen(value);
+  return /* @__PURE__ */ jsx("h3", { className: ACCORDION_HEADER, "data-slot": "accordion-header", children: /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      "data-slot": "accordion-trigger",
+      "data-state": open ? "open" : "closed",
+      "aria-expanded": open,
+      className: cn(ACCORDION_TRIGGER, className),
+      onClick: (e) => {
+        onClick?.(e);
+        toggle(value);
+      },
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx(
+          "svg",
+          {
+            xmlns: "http://www.w3.org/2000/svg",
+            width: "24",
+            height: "24",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            className: "text-ink-soft pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200",
+            children: /* @__PURE__ */ jsx("path", { d: "m6 9 6 6 6-6" })
+          }
+        )
+      ]
+    }
+  ) });
+}
+function AccordionContent({
+  className,
+  children,
+  ...props
+}) {
+  const { isOpen } = useAccordion();
+  const value = useItemValue();
+  if (!isOpen(value)) return null;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "accordion-content",
+      "data-state": "open",
+      className: ACCORDION_CONTENT,
+      ...props,
+      children: /* @__PURE__ */ jsx("div", { className: cn(ACCORDION_CONTENT_INNER, className), children })
+    }
+  );
+}
+export {
+  Accordion,
+  AccordionContent,
+  AccordionItem,
+  AccordionTrigger
+};
+//# sourceMappingURL=accordion.js.map

package/dist/components/accordion.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/accordion.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { useControllableState } from \"../primitives/use-controllable-state\";\nimport {\n  ACCORDION_CONTENT,\n  ACCORDION_CONTENT_INNER,\n  ACCORDION_HEADER,\n  ACCORDION_ITEM,\n  ACCORDION_TRIGGER,\n} from \"../generated/accordion\";\n\ntype AccordionType = \"single\" | \"multiple\";\n\ninterface AccordionContextValue {\n  isOpen: (value: string) => boolean;\n  toggle: (value: string) => void;\n}\n\nconst AccordionContext = React.createContext<AccordionContextValue | null>(null);\n\nfunction useAccordion(): AccordionContextValue {\n  const ctx = React.useContext(AccordionContext);\n  if (!ctx) throw new Error(\"Accordion parts must be used within <Accordion>\");\n  return ctx;\n}\n\nconst ItemContext = React.createContext<string | null>(null);\n\nfunction useItemValue(): string {\n  const value = React.useContext(ItemContext);\n  if (value === null)\n    throw new Error(\"AccordionTrigger/Content must be used within <AccordionItem>\");\n  return value;\n}\n\nexport interface AccordionProps\n  extends Omit<React.ComponentProps<\"div\">, \"onChange\"> {\n  type?: AccordionType;\n  collapsible?: boolean;\n  value?: string[];\n  defaultValue?: string[];\n  onValueChange?: (value: string[]) => void;\n}\n\nexport function Accordion({\n  type = \"single\",\n  collapsible = false,\n  value,\n  defaultValue = [],\n  onValueChange,\n  children,\n  ...props\n}: AccordionProps) {\n  const [open, setOpen] = useControllableState<string[]>({\n    ...(value !== undefined ? { value } : {}),\n    defaultValue,\n    ...(onValueChange ? { onChange: onValueChange } : {}),\n  });\n\n  const isOpen = (v: string) => open.includes(v);\n  const toggle = (v: string) => {\n    if (type === \"multiple\") {\n      setOpen(open.includes(v) ? open.filter((x) => x !== v) : [...open, v]);\n      return;\n    }\n    if (open.includes(v)) setOpen(collapsible ? [] : open);\n    else setOpen([v]);\n  };\n\n  return (\n    <AccordionContext.Provider value={{ isOpen, toggle }}>\n      <div data-slot=\"accordion\" {...props}>\n        {children}\n      </div>\n    </AccordionContext.Provider>\n  );\n}\n\nexport interface AccordionItemProps extends React.ComponentProps<\"div\"> {\n  value: string;\n}\n\nexport function AccordionItem({\n  className,\n  value,\n  children,\n  ...props\n}: AccordionItemProps) {\n  return (\n    <ItemContext.Provider value={value}>\n      <div\n        data-slot=\"accordion-item\"\n        className={cn(ACCORDION_ITEM, className)}\n        {...props}\n      >\n        {children}\n      </div>\n    </ItemContext.Provider>\n  );\n}\n\nexport function AccordionTrigger({\n  className,\n  children,\n  onClick,\n  ...props\n}: React.ComponentProps<\"button\">) {\n  const { isOpen, toggle } = useAccordion();\n  const value = useItemValue();\n  const open = isOpen(value);\n  return (\n    <h3 className={ACCORDION_HEADER} data-slot=\"accordion-header\">\n      <button\n        type=\"button\"\n        data-slot=\"accordion-trigger\"\n        data-state={open ? \"open\" : \"closed\"}\n        aria-expanded={open}\n        className={cn(ACCORDION_TRIGGER, className)}\n        onClick={(e) => {\n          onClick?.(e);\n          toggle(value);\n        }}\n        {...props}\n      >\n        {children}\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"24\"\n          height=\"24\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          strokeWidth=\"2\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          className=\"text-ink-soft pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200\"\n        >\n          <path d=\"m6 9 6 6 6-6\" />\n        </svg>\n      </button>\n    </h3>\n  );\n}\n\nexport function AccordionContent({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  const { isOpen } = useAccordion();\n  const value = useItemValue();\n  if (!isOpen(value)) return null;\n  return (\n    <div\n      data-slot=\"accordion-content\"\n      data-state=\"open\"\n      className={ACCORDION_CONTENT}\n      {...props}\n    >\n      <div className={cn(ACCORDION_CONTENT_INNER, className)}>{children}</div>\n    </div>\n  );\n}\n"],"mappings":";AAyEM,cAyCA,YAzCA;AAvEN,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,4BAA4B;AACrC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AASP,MAAM,mBAAmB,MAAM,cAA4C,IAAI;AAE/E,SAAS,eAAsC;AAC7C,QAAM,MAAM,MAAM,WAAW,gBAAgB;AAC7C,MAAI,CAAC,IAAK,OAAM,IAAI,MAAM,iDAAiD;AAC3E,SAAO;AACT;AAEA,MAAM,cAAc,MAAM,cAA6B,IAAI;AAE3D,SAAS,eAAuB;AAC9B,QAAM,QAAQ,MAAM,WAAW,WAAW;AAC1C,MAAI,UAAU;AACZ,UAAM,IAAI,MAAM,8DAA8D;AAChF,SAAO;AACT;AAWO,SAAS,UAAU;AAAA,EACxB,OAAO;AAAA,EACP,cAAc;AAAA,EACd;AAAA,EACA,eAAe,CAAC;AAAA,EAChB;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAmB;AACjB,QAAM,CAAC,MAAM,OAAO,IAAI,qBAA+B;AAAA,IACrD,GAAI,UAAU,SAAY,EAAE,MAAM,IAAI,CAAC;AAAA,IACvC;AAAA,IACA,GAAI,gBAAgB,EAAE,UAAU,cAAc,IAAI,CAAC;AAAA,EACrD,CAAC;AAED,QAAM,SAAS,CAAC,MAAc,KAAK,SAAS,CAAC;AAC7C,QAAM,SAAS,CAAC,MAAc;AAC5B,QAAI,SAAS,YAAY;AACvB,cAAQ,KAAK,SAAS,CAAC,IAAI,KAAK,OAAO,CAAC,MAAM,MAAM,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,CAAC;AACrE;AAAA,IACF;AACA,QAAI,KAAK,SAAS,CAAC,EAAG,SAAQ,cAAc,CAAC,IAAI,IAAI;AAAA,QAChD,SAAQ,CAAC,CAAC,CAAC;AAAA,EAClB;AAEA,SACE,oBAAC,iBAAiB,UAAjB,EAA0B,OAAO,EAAE,QAAQ,OAAO,GACjD,8BAAC,SAAI,aAAU,aAAa,GAAG,OAC5B,UACH,GACF;AAEJ;AAMO,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAuB;AACrB,SACE,oBAAC,YAAY,UAAZ,EAAqB,OACpB;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,gBAAgB,SAAS;AAAA,MACtC,GAAG;AAAA,MAEH;AAAA;AAAA,EACH,GACF;AAEJ;AAEO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAmC;AACjC,QAAM,EAAE,QAAQ,OAAO,IAAI,aAAa;AACxC,QAAM,QAAQ,aAAa;AAC3B,QAAM,OAAO,OAAO,KAAK;AACzB,SACE,oBAAC,QAAG,WAAW,kBAAkB,aAAU,oBACzC;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,aAAU;AAAA,MACV,cAAY,OAAO,SAAS;AAAA,MAC5B,iBAAe;AAAA,MACf,WAAW,GAAG,mBAAmB,SAAS;AAAA,MAC1C,SAAS,CAAC,MAAM;AACd,kBAAU,CAAC;AACX,eAAO,KAAK;AAAA,MACd;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,QACD;AAAA,UAAC;AAAA;AAAA,YACC,OAAM;AAAA,YACN,OAAM;AAAA,YACN,QAAO;AAAA,YACP,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,QAAO;AAAA,YACP,aAAY;AAAA,YACZ,eAAc;AAAA,YACd,gBAAe;AAAA,YACf,WAAU;AAAA,YAEV,8BAAC,UAAK,GAAE,gBAAe;AAAA;AAAA,QACzB;AAAA;AAAA;AAAA,EACF,GACF;AAEJ;AAEO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,QAAM,EAAE,OAAO,IAAI,aAAa;AAChC,QAAM,QAAQ,aAAa;AAC3B,MAAI,CAAC,OAAO,KAAK,EAAG,QAAO;AAC3B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,cAAW;AAAA,MACX,WAAW;AAAA,MACV,GAAG;AAAA,MAEJ,8BAAC,SAAI,WAAW,GAAG,yBAAyB,SAAS,GAAI,UAAS;AAAA;AAAA,EACpE;AAEJ;","names":[]}

package/dist/components/alert-dialog.js

@@ -0,0 +1,175 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../lib/cn.js";
+import { buttonVariants } from "./button.js";
+import { useControllableState } from "../primitives/use-controllable-state.js";
+import { useDismissableLayer } from "../primitives/dismissable-layer.js";
+import { useFocusScope } from "../primitives/focus-scope.js";
+import { usePresence } from "../primitives/presence.js";
+import { mergeRefs } from "../primitives/merge-refs.js";
+import { Portal } from "../primitives/portal.js";
+import { Slot } from "../primitives/slot.js";
+import {
+  ALERT_DIALOG_CONTENT,
+  ALERT_DIALOG_DESCRIPTION,
+  ALERT_DIALOG_FOOTER,
+  ALERT_DIALOG_HEADER,
+  ALERT_DIALOG_OVERLAY,
+  ALERT_DIALOG_TITLE
+} from "../generated/alert-dialog.js";
+const AlertDialogContext = React.createContext(null);
+function useAlertDialog() {
+  const ctx = React.useContext(AlertDialogContext);
+  if (!ctx) throw new Error("AlertDialog parts must be used within <AlertDialog>");
+  return ctx;
+}
+function AlertDialog({ open, defaultOpen = false, onOpenChange, children }) {
+  const [isOpen, setOpen] = useControllableState({
+    ...open !== void 0 ? { value: open } : {},
+    defaultValue: defaultOpen,
+    ...onOpenChange ? { onChange: onOpenChange } : {}
+  });
+  const triggerRef = React.useRef(null);
+  return /* @__PURE__ */ jsx(AlertDialogContext.Provider, { value: { open: isOpen, setOpen, triggerRef }, children });
+}
+function AlertDialogTrigger({ asChild = false, onClick, ...props }) {
+  const { open, setOpen, triggerRef } = useAlertDialog();
+  const Comp = asChild ? Slot : "button";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      "data-slot": "alert-dialog-trigger",
+      "aria-expanded": open,
+      ref: triggerRef,
+      onClick: (e) => {
+        onClick?.(e);
+        setOpen(true);
+      },
+      ...props
+    }
+  );
+}
+function AlertDialogOverlay({ className, ...props }) {
+  const { open, setOpen } = useAlertDialog();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "alert-dialog-overlay",
+      "data-state": open ? "open" : "closed",
+      onClick: () => setOpen(false),
+      className: cn(ALERT_DIALOG_OVERLAY, className),
+      ...props
+    }
+  );
+}
+function AlertDialogContent({ className, children, ...props }) {
+  const { open, setOpen, triggerRef } = useAlertDialog();
+  const { isPresent, ref: presRef } = usePresence(open);
+  const focusRef = useFocusScope(open);
+  const dismissRef = useDismissableLayer({
+    enabled: open,
+    onDismiss: () => setOpen(false),
+    exclude: [triggerRef]
+  });
+  if (!isPresent) return null;
+  return /* @__PURE__ */ jsxs(Portal, { children: [
+    /* @__PURE__ */ jsx(AlertDialogOverlay, {}),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        "data-slot": "alert-dialog-content",
+        role: "alertdialog",
+        "aria-modal": "true",
+        "data-state": open ? "open" : "closed",
+        ref: mergeRefs(focusRef, dismissRef, presRef),
+        className: cn(ALERT_DIALOG_CONTENT, className),
+        ...props,
+        children
+      }
+    )
+  ] });
+}
+function AlertDialogHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "alert-dialog-header",
+      className: cn(ALERT_DIALOG_HEADER, className),
+      ...props
+    }
+  );
+}
+function AlertDialogFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "alert-dialog-footer",
+      className: cn(ALERT_DIALOG_FOOTER, className),
+      ...props
+    }
+  );
+}
+function AlertDialogTitle({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "h2",
+    {
+      "data-slot": "alert-dialog-title",
+      className: cn(ALERT_DIALOG_TITLE, className),
+      ...props
+    }
+  );
+}
+function AlertDialogDescription({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "p",
+    {
+      "data-slot": "alert-dialog-description",
+      className: cn(ALERT_DIALOG_DESCRIPTION, className),
+      ...props
+    }
+  );
+}
+function AlertDialogAction({ className, onClick, ...props }) {
+  const { setOpen } = useAlertDialog();
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      "data-slot": "alert-dialog-action",
+      className: cn(buttonVariants(), className),
+      onClick: (e) => {
+        onClick?.(e);
+        setOpen(false);
+      },
+      ...props
+    }
+  );
+}
+function AlertDialogCancel({ className, onClick, ...props }) {
+  const { setOpen } = useAlertDialog();
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      "data-slot": "alert-dialog-cancel",
+      className: cn(buttonVariants({ variant: "outline" }), className),
+      onClick: (e) => {
+        onClick?.(e);
+        setOpen(false);
+      },
+      ...props
+    }
+  );
+}
+export {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogOverlay,
+  AlertDialogTitle,
+  AlertDialogTrigger
+};
+//# sourceMappingURL=alert-dialog.js.map

package/dist/components/alert-dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/alert-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { buttonVariants } from \"./button\";\nimport { useControllableState } from \"../primitives/use-controllable-state\";\nimport { useDismissableLayer } from \"../primitives/dismissable-layer\";\nimport { useFocusScope } from \"../primitives/focus-scope\";\nimport { usePresence } from \"../primitives/presence\";\nimport { mergeRefs } from \"../primitives/merge-refs\";\nimport { Portal } from \"../primitives/portal\";\nimport { Slot } from \"../primitives/slot\";\nimport {\n  ALERT_DIALOG_CONTENT,\n  ALERT_DIALOG_DESCRIPTION,\n  ALERT_DIALOG_FOOTER,\n  ALERT_DIALOG_HEADER,\n  ALERT_DIALOG_OVERLAY,\n  ALERT_DIALOG_TITLE,\n} from \"../generated/alert-dialog\";\n\ninterface AlertDialogContextValue {\n  open: boolean;\n  setOpen: (next: boolean) => void;\n  triggerRef: React.RefObject<HTMLElement | null>;\n}\n\nconst AlertDialogContext = React.createContext<AlertDialogContextValue | null>(null);\n\nfunction useAlertDialog(): AlertDialogContextValue {\n  const ctx = React.useContext(AlertDialogContext);\n  if (!ctx) throw new Error(\"AlertDialog parts must be used within <AlertDialog>\");\n  return ctx;\n}\n\nexport interface AlertDialogProps {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  children?: React.ReactNode;\n}\n\nexport function AlertDialog({ open, defaultOpen = false, onOpenChange, children }: AlertDialogProps) {\n  const [isOpen, setOpen] = useControllableState<boolean>({\n    ...(open !== undefined ? { value: open } : {}),\n    defaultValue: defaultOpen,\n    ...(onOpenChange ? { onChange: onOpenChange } : {}),\n  });\n  const triggerRef = React.useRef<HTMLElement | null>(null);\n  return (\n    <AlertDialogContext.Provider value={{ open: isOpen, setOpen, triggerRef }}>\n      {children}\n    </AlertDialogContext.Provider>\n  );\n}\n\nexport interface AlertDialogTriggerProps extends React.ComponentProps<\"button\"> {\n  asChild?: boolean;\n}\n\nexport function AlertDialogTrigger({ asChild = false, onClick, ...props }: AlertDialogTriggerProps) {\n  const { open, setOpen, triggerRef } = useAlertDialog();\n  const Comp = asChild ? Slot : \"button\";\n  return (\n    <Comp\n      data-slot=\"alert-dialog-trigger\"\n      aria-expanded={open}\n      ref={triggerRef as React.Ref<HTMLButtonElement>}\n      onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n        onClick?.(e);\n        setOpen(true);\n      }}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n\nexport interface AlertDialogOverlayProps extends React.ComponentProps<\"div\"> {}\n\nexport function AlertDialogOverlay({ className, ...props }: AlertDialogOverlayProps) {\n  const { open, setOpen } = useAlertDialog();\n  return (\n    <div\n      data-slot=\"alert-dialog-overlay\"\n      data-state={open ? \"open\" : \"closed\"}\n      onClick={() => setOpen(false)}\n      className={cn(ALERT_DIALOG_OVERLAY, className)}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n\nexport interface AlertDialogContentProps extends React.ComponentProps<\"div\"> {}\n\nexport function AlertDialogContent({ className, children, ...props }: AlertDialogContentProps) {\n  const { open, setOpen, triggerRef } = useAlertDialog();\n  const { isPresent, ref: presRef } = usePresence(open);\n  const focusRef = useFocusScope(open);\n  const dismissRef = useDismissableLayer({\n    enabled: open,\n    onDismiss: () => setOpen(false),\n    exclude: [triggerRef],\n  });\n  if (!isPresent) return null;\n  return (\n    <Portal>\n      <AlertDialogOverlay />\n      <div\n        data-slot=\"alert-dialog-content\"\n        role=\"alertdialog\"\n        aria-modal=\"true\"\n        data-state={open ? \"open\" : \"closed\"}\n        ref={mergeRefs(focusRef, dismissRef, presRef as React.Ref<HTMLDivElement>)}\n        className={cn(ALERT_DIALOG_CONTENT, className)}\n        {...(props as Record<string, unknown>)}\n      >\n        {children}\n      </div>\n    </Portal>\n  );\n}\n\nexport function AlertDialogHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-header\"\n      className={cn(ALERT_DIALOG_HEADER, className)}\n      {...props}\n    />\n  );\n}\n\nexport function AlertDialogFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-footer\"\n      className={cn(ALERT_DIALOG_FOOTER, className)}\n      {...props}\n    />\n  );\n}\n\nexport function AlertDialogTitle({ className, ...props }: React.ComponentProps<\"h2\">) {\n  return (\n    <h2\n      data-slot=\"alert-dialog-title\"\n      className={cn(ALERT_DIALOG_TITLE, className)}\n      {...props}\n    />\n  );\n}\n\nexport function AlertDialogDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n  return (\n    <p\n      data-slot=\"alert-dialog-description\"\n      className={cn(ALERT_DIALOG_DESCRIPTION, className)}\n      {...props}\n    />\n  );\n}\n\nexport interface AlertDialogActionProps extends React.ComponentProps<\"button\"> {}\n\nexport function AlertDialogAction({ className, onClick, ...props }: AlertDialogActionProps) {\n  const { setOpen } = useAlertDialog();\n  return (\n    <button\n      data-slot=\"alert-dialog-action\"\n      className={cn(buttonVariants(), className)}\n      onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n        onClick?.(e);\n        setOpen(false);\n      }}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n\nexport interface AlertDialogCancelProps extends React.ComponentProps<\"button\"> {}\n\nexport function AlertDialogCancel({ className, onClick, ...props }: AlertDialogCancelProps) {\n  const { setOpen } = useAlertDialog();\n  return (\n    <button\n      data-slot=\"alert-dialog-cancel\"\n      className={cn(buttonVariants({ variant: \"outline\" }), className)}\n      onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n        onClick?.(e);\n        setOpen(false);\n      }}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/alert.js

@@ -0,0 +1,49 @@
+import { jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../lib/cn.js";
+import {
+  ALERT_BASE,
+  ALERT_DESCRIPTION,
+  ALERT_TITLE,
+  alertVariants
+} from "../generated/alert.js";
+function Alert({ className, variant = "neutral", ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "alert",
+      role: "alert",
+      className: cn(ALERT_BASE, alertVariants[variant], className),
+      ...props
+    }
+  );
+}
+function AlertTitle({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "alert-title",
+      className: cn(ALERT_TITLE, className),
+      ...props
+    }
+  );
+}
+function AlertDescription({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "alert-description",
+      className: cn(ALERT_DESCRIPTION, className),
+      ...props
+    }
+  );
+}
+export {
+  Alert,
+  AlertDescription,
+  AlertTitle
+};
+//# sourceMappingURL=alert.js.map

package/dist/components/alert.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/alert.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport {\n  ALERT_BASE,\n  ALERT_DESCRIPTION,\n  ALERT_TITLE,\n  alertVariants,\n  type AlertVariant,\n} from \"../generated/alert\";\n\nexport type { AlertVariant };\n\nexport interface AlertProps extends React.ComponentProps<\"div\"> {\n  variant?: AlertVariant;\n}\n\nexport function Alert({ className, variant = \"neutral\", ...props }: AlertProps) {\n  return (\n    <div\n      data-slot=\"alert\"\n      role=\"alert\"\n      className={cn(ALERT_BASE, alertVariants[variant], className)}\n      {...props}\n    />\n  );\n}\n\nexport function AlertTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-title\"\n      className={cn(ALERT_TITLE, className)}\n      {...props}\n    />\n  );\n}\n\nexport function AlertDescription({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-description\"\n      className={cn(ALERT_DESCRIPTION, className)}\n      {...props}\n    />\n  );\n}\n"],"mappings":"AAkBI;AAlBJ,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAEK;AAQA,SAAS,MAAM,EAAE,WAAW,UAAU,WAAW,GAAG,MAAM,GAAe;AAC9E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,MAAK;AAAA,MACL,WAAW,GAAG,YAAY,cAAc,OAAO,GAAG,SAAS;AAAA,MAC1D,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,WAAW,EAAE,WAAW,GAAG,MAAM,GAAgC;AAC/E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,aAAa,SAAS;AAAA,MACnC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,mBAAmB,SAAS;AAAA,MACzC,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}

package/dist/components/avatar.js

@@ -0,0 +1,54 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../lib/cn.js";
+import { AVATAR, AVATAR_IMAGE, AVATAR_FALLBACK } from "../generated/avatar.js";
+function Avatar({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "avatar",
+      className: cn(AVATAR, className),
+      ...props
+    }
+  );
+}
+function AvatarImage({
+  className,
+  onError,
+  ...props
+}) {
+  const [errored, setErrored] = React.useState(false);
+  if (errored) return null;
+  return /* @__PURE__ */ jsx(
+    "img",
+    {
+      "data-slot": "avatar-image",
+      className: cn(AVATAR_IMAGE, className),
+      onError: (e) => {
+        onError?.(e);
+        setErrored(true);
+      },
+      ...props
+    }
+  );
+}
+function AvatarFallback({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "avatar-fallback",
+      className: cn(AVATAR_FALLBACK, className),
+      ...props
+    }
+  );
+}
+export {
+  Avatar,
+  AvatarFallback,
+  AvatarImage
+};
+//# sourceMappingURL=avatar.js.map

package/dist/components/avatar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/avatar.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { AVATAR, AVATAR_IMAGE, AVATAR_FALLBACK } from \"../generated/avatar\";\n\nexport function Avatar({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"avatar\"\n      className={cn(AVATAR, className)}\n      {...props}\n    />\n  );\n}\n\nexport function AvatarImage({\n  className,\n  onError,\n  ...props\n}: React.ComponentProps<\"img\">) {\n  const [errored, setErrored] = React.useState(false);\n  if (errored) return null;\n  return (\n    <img\n      data-slot=\"avatar-image\"\n      className={cn(AVATAR_IMAGE, className)}\n      onError={(e) => {\n        onError?.(e);\n        setErrored(true);\n      }}\n      {...props}\n    />\n  );\n}\n\nexport function AvatarFallback({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"avatar-fallback\"\n      className={cn(AVATAR_FALLBACK, className)}\n      {...props}\n    />\n  );\n}\n"],"mappings":";AAQI;AANJ,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,QAAQ,cAAc,uBAAuB;AAE/C,SAAS,OAAO,EAAE,WAAW,GAAG,MAAM,GAAgC;AAC3E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,QAAQ,SAAS;AAAA,MAC9B,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,QAAM,CAAC,SAAS,UAAU,IAAI,MAAM,SAAS,KAAK;AAClD,MAAI,QAAS,QAAO;AACpB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,cAAc,SAAS;AAAA,MACrC,SAAS,CAAC,MAAM;AACd,kBAAU,CAAC;AACX,mBAAW,IAAI;AAAA,MACjB;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,iBAAiB,SAAS;AAAA,MACvC,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}

package/dist/components/badge.js

@@ -0,0 +1,25 @@
+import { jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../lib/cn.js";
+import { Slot } from "../primitives/slot.js";
+import { BADGE_BASE, badgeVariants } from "../generated/badge.js";
+function Badge({
+  className,
+  variant = "primary",
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? Slot : "span";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      "data-slot": "badge",
+      className: cn(BADGE_BASE, badgeVariants[variant], className),
+      ...props
+    }
+  );
+}
+export {
+  Badge
+};
+//# sourceMappingURL=badge.js.map

package/dist/components/badge.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/badge.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { Slot } from \"../primitives/slot\";\nimport { BADGE_BASE, badgeVariants, type BadgeVariant } from \"../generated/badge\";\n\nexport type { BadgeVariant };\n\nexport interface BadgeProps extends React.ComponentProps<\"span\"> {\n  variant?: BadgeVariant;\n  asChild?: boolean;\n}\n\nexport function Badge({\n  className,\n  variant = \"primary\",\n  asChild = false,\n  ...props\n}: BadgeProps) {\n  const Comp = asChild ? Slot : \"span\";\n  return (\n    <Comp\n      data-slot=\"badge\"\n      className={cn(BADGE_BASE, badgeVariants[variant], className)}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n"],"mappings":"AAoBI;AApBJ,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,YAAY;AACrB,SAAS,YAAY,qBAAwC;AAStD,SAAS,MAAM;AAAA,EACpB;AAAA,EACA,UAAU;AAAA,EACV,UAAU;AAAA,EACV,GAAG;AACL,GAAe;AACb,QAAM,OAAO,UAAU,OAAO;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,YAAY,cAAc,OAAO,GAAG,SAAS;AAAA,MAC1D,GAAI;AAAA;AAAA,EACP;AAEJ;","names":[]}

package/dist/components/band.js

@@ -0,0 +1,75 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../lib/cn.js";
+import {
+  CHECK,
+  DISPLAY_BASE,
+  EYEBROW,
+  LEDE,
+  PROSE,
+  polarityClasses,
+  SECTION_BASE,
+  SECTION_HEAD,
+  SECTION_PY,
+  SECTION_PY_TIGHT,
+  STAT,
+  STAT_FIGURE,
+  STAT_LABEL,
+  surfaceClasses
+} from "../generated/band.js";
+function Section({
+  polarity,
+  surface = "background",
+  tight = false,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "section",
+    {
+      "data-slot": "section",
+      className: cn(
+        // conflict-free by construction — a gutter, a scope class, a plane and a
+        // rhythm — so only the caller override is worth a merge
+        `${SECTION_BASE} ${polarity ? polarityClasses[polarity] : ""} ${surfaceClasses[surface]} ${tight ? SECTION_PY_TIGHT : SECTION_PY}`,
+        className
+      ),
+      ...props
+    }
+  );
+}
+function Eyebrow({ className, ...props }) {
+  return /* @__PURE__ */ jsx("p", { "data-slot": "eyebrow", className: cn(EYEBROW, className), ...props });
+}
+function Display({ className, ...props }) {
+  return /* @__PURE__ */ jsx("h2", { "data-slot": "display", className: cn(DISPLAY_BASE, className), ...props });
+}
+function SectionHead({ eyebrow, title, lede, className, ...props }) {
+  return /* @__PURE__ */ jsxs("div", { "data-slot": "section-head", className: cn(SECTION_HEAD, className), ...props, children: [
+    /* @__PURE__ */ jsx(Eyebrow, { children: eyebrow }),
+    /* @__PURE__ */ jsx(Display, { children: title }),
+    lede && /* @__PURE__ */ jsx("p", { className: LEDE, children: lede })
+  ] });
+}
+function Prose({ className, ...props }) {
+  return /* @__PURE__ */ jsx("p", { "data-slot": "prose", className: cn(PROSE, className), ...props });
+}
+function Stat({ figure, label, className, ...props }) {
+  return /* @__PURE__ */ jsxs("span", { "data-slot": "stat", className: cn(STAT, className), ...props, children: [
+    /* @__PURE__ */ jsx("span", { className: STAT_FIGURE, children: figure }),
+    /* @__PURE__ */ jsx("span", { className: STAT_LABEL, children: label })
+  ] });
+}
+function Check({ className, ...props }) {
+  return /* @__PURE__ */ jsx("span", { "data-slot": "check", "aria-hidden": true, className: cn(CHECK, className), ...props, children: "\u2713" });
+}
+export {
+  Check,
+  Display,
+  Eyebrow,
+  Prose,
+  Section,
+  SectionHead,
+  Stat
+};
+//# sourceMappingURL=band.js.map

package/dist/components/band.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/band.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport {\n  CHECK,\n  DISPLAY_BASE,\n  EYEBROW,\n  LEDE,\n  PROSE,\n  polarityClasses,\n  SECTION_BASE,\n  SECTION_HEAD,\n  SECTION_PY,\n  SECTION_PY_TIGHT,\n  STAT,\n  STAT_FIGURE,\n  STAT_LABEL,\n  surfaceClasses,\n  type Polarity,\n  type Surface,\n} from \"../generated/band\";\n\nexport type { Polarity, Surface };\n\n/**\n * Full-bleed page bands and the type vocabulary that goes in them. A page built\n * from these writes no spacing or type-scale class of its own: the rhythm is\n * `--band-py`, the gutter `--page-px` and the headline scale `--display-scale`,\n * so a global retune is one edit in the consumer's tokens.\n */\nexport interface SectionProps extends React.ComponentProps<\"section\"> {\n  polarity?: Polarity;\n  surface?: Surface;\n  tight?: boolean;\n}\n\n/**\n * `polarity` sets the token scope on the element, so everything inside reads\n * `text-ink` / `border-border` / `text-ink-soft` and resolves correctly on\n * either side. Omitted, the band sets no scope and inherits its parent's: a\n * default of `light` would flip every band of a dark-first brand. `tight` is\n * the shorter vertical rhythm.\n */\nexport function Section({\n  polarity,\n  surface = \"background\",\n  tight = false,\n  className,\n  ...props\n}: SectionProps) {\n  return (\n    <section\n      data-slot=\"section\"\n      className={cn(\n        // conflict-free by construction — a gutter, a scope class, a plane and a\n        // rhythm — so only the caller override is worth a merge\n        `${SECTION_BASE} ${polarity ? polarityClasses[polarity] : \"\"} ${surfaceClasses[surface]} ${\n          tight ? SECTION_PY_TIGHT : SECTION_PY\n        }`,\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** The label above a headline, in the interactive role's colour. */\nexport function Eyebrow({ className, ...props }: React.ComponentProps<\"p\">) {\n  return <p data-slot=\"eyebrow\" className={cn(EYEBROW, className)} {...props} />;\n}\n\n/** The headline. One scale for every band on the site, so a retune is one number. */\nexport function Display({ className, ...props }: React.ComponentProps<\"h2\">) {\n  return <h2 data-slot=\"display\" className={cn(DISPLAY_BASE, className)} {...props} />;\n}\n\nexport interface SectionHeadProps extends Omit<React.ComponentProps<\"div\">, \"title\"> {\n  eyebrow: React.ReactNode;\n  title: React.ReactNode;\n  lede?: React.ReactNode;\n}\n\n/** Eyebrow → headline → lede, the head a band shares. */\nexport function SectionHead({ eyebrow, title, lede, className, ...props }: SectionHeadProps) {\n  return (\n    <div data-slot=\"section-head\" className={cn(SECTION_HEAD, className)} {...props}>\n      <Eyebrow>{eyebrow}</Eyebrow>\n      <Display>{title}</Display>\n      {lede && <p className={LEDE}>{lede}</p>}\n    </div>\n  );\n}\n\n/** Body copy at the reading measure. */\nexport function Prose({ className, ...props }: React.ComponentProps<\"p\">) {\n  return <p data-slot=\"prose\" className={cn(PROSE, className)} {...props} />;\n}\n\nexport interface StatProps extends React.ComponentProps<\"span\"> {\n  figure: React.ReactNode;\n  label: React.ReactNode;\n}\n\n/** A figure with its label beside it. */\nexport function Stat({ figure, label, className, ...props }: StatProps) {\n  return (\n    <span data-slot=\"stat\" className={cn(STAT, className)} {...props}>\n      <span className={STAT_FIGURE}>{figure}</span>\n      <span className={STAT_LABEL}>{label}</span>\n    </span>\n  );\n}\n\n/**\n * The affirmative tick. Positive is a valence, not a significance rung — see the\n * kit's `docs/spec/accents.md`.\n */\nexport function Check({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span data-slot=\"check\" aria-hidden className={cn(CHECK, className)} {...props}>\n      ✓\n    </span>\n  );\n}\n"],"mappings":"AAkDI,cAkCA,YAlCA;AAlDJ,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAGK;AAuBA,SAAS,QAAQ;AAAA,EACtB;AAAA,EACA,UAAU;AAAA,EACV,QAAQ;AAAA,EACR;AAAA,EACA,GAAG;AACL,GAAiB;AACf,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA;AAAA;AAAA,QAGT,GAAG,YAAY,IAAI,WAAW,gBAAgB,QAAQ,IAAI,EAAE,IAAI,eAAe,OAAO,CAAC,IACrF,QAAQ,mBAAmB,UAC7B;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAGO,SAAS,QAAQ,EAAE,WAAW,GAAG,MAAM,GAA8B;AAC1E,SAAO,oBAAC,OAAE,aAAU,WAAU,WAAW,GAAG,SAAS,SAAS,GAAI,GAAG,OAAO;AAC9E;AAGO,SAAS,QAAQ,EAAE,WAAW,GAAG,MAAM,GAA+B;AAC3E,SAAO,oBAAC,QAAG,aAAU,WAAU,WAAW,GAAG,cAAc,SAAS,GAAI,GAAG,OAAO;AACpF;AASO,SAAS,YAAY,EAAE,SAAS,OAAO,MAAM,WAAW,GAAG,MAAM,GAAqB;AAC3F,SACE,qBAAC,SAAI,aAAU,gBAAe,WAAW,GAAG,cAAc,SAAS,GAAI,GAAG,OACxE;AAAA,wBAAC,WAAS,mBAAQ;AAAA,IAClB,oBAAC,WAAS,iBAAM;AAAA,IACf,QAAQ,oBAAC,OAAE,WAAW,MAAO,gBAAK;AAAA,KACrC;AAEJ;AAGO,SAAS,MAAM,EAAE,WAAW,GAAG,MAAM,GAA8B;AACxE,SAAO,oBAAC,OAAE,aAAU,SAAQ,WAAW,GAAG,OAAO,SAAS,GAAI,GAAG,OAAO;AAC1E;AAQO,SAAS,KAAK,EAAE,QAAQ,OAAO,WAAW,GAAG,MAAM,GAAc;AACtE,SACE,qBAAC,UAAK,aAAU,QAAO,WAAW,GAAG,MAAM,SAAS,GAAI,GAAG,OACzD;AAAA,wBAAC,UAAK,WAAW,aAAc,kBAAO;AAAA,IACtC,oBAAC,UAAK,WAAW,YAAa,iBAAM;AAAA,KACtC;AAEJ;AAMO,SAAS,MAAM,EAAE,WAAW,GAAG,MAAM,GAAiC;AAC3E,SACE,oBAAC,UAAK,aAAU,SAAQ,eAAW,MAAC,WAAW,GAAG,OAAO,SAAS,GAAI,GAAG,OAAO,oBAEhF;AAEJ;","names":[]}