@krizaka/ui 3.4.0 → 3.5.0

package/dist/match-dialog.js

@@ -0,0 +1,146 @@
+"use client";
+import {
+  Avatar
+} from "./chunk-F2GKFIYK.js";
+import {
+  Button,
+  IconButton
+} from "./chunk-ECSCA3CN.js";
+
+// src/dialog/dialog.tsx
+import { Dialog as DialogPrimitive } from "radix-ui";
+import { tv } from "tailwind-variants";
+import { jsx, jsxs } from "react/jsx-runtime";
+var dialog = tv({
+  slots: {
+    overlay: "kz-overlay fixed inset-0 z-50 bg-overlay backdrop-blur-xs",
+    content: "kz-dialog fixed z-50 flex flex-col overflow-hidden border border-border-default bg-surface-1 text-fg shadow-lg focus:outline-hidden",
+    close: "absolute right-3 top-3 h-9 w-9",
+    header: "flex flex-col gap-1 px-5 pb-2 pr-14 pt-5",
+    title: "text-base font-bold text-fg",
+    description: "text-sm text-fg-secondary",
+    body: "min-h-0 flex-1 overflow-y-auto px-5 pb-5",
+    footer: "flex flex-wrap items-center justify-end gap-2 border-t border-border-subtle px-5 py-4 pb-[max(1rem,env(safe-area-inset-bottom))]"
+  },
+  variants: {
+    placement: {
+      center: { content: "left-1/2 top-1/2 max-h-[85dvh] w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 rounded-xl" },
+      /* A sheet: anchored at the bottom on a phone, centred from `sm` up. */
+      bottom: {
+        content: "inset-x-0 bottom-0 max-h-[92dvh] rounded-t-[1.75rem] sm:bottom-auto sm:left-1/2 sm:top-1/2 sm:w-full sm:-translate-x-1/2 sm:-translate-y-1/2 sm:rounded-[1.75rem]"
+      },
+      right: { content: "inset-y-0 right-0 h-full w-full max-w-md rounded-none border-y-0 border-r-0" },
+      /* A navigation drawer: full height, from the left, clear of the notch. */
+      left: { content: "inset-y-0 left-0 h-full w-full max-w-md rounded-none border-y-0 border-l-0 pl-[env(safe-area-inset-left)]" }
+    },
+    size: { sm: { content: "sm:max-w-sm" }, md: { content: "sm:max-w-md" }, lg: { content: "sm:max-w-2xl" } }
+  },
+  defaultVariants: { placement: "center", size: "md" }
+});
+var s = dialog();
+function CloseIcon() {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", className: "h-4 w-4", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx("path", { d: "M18 6 6 18M6 6l12 12" }) });
+}
+var prevent = (event) => event.preventDefault();
+function DialogContent({
+  placement,
+  size,
+  closeLabel,
+  hideClose,
+  dismissible = true,
+  container,
+  className,
+  children,
+  onEscapeKeyDown,
+  onPointerDownOutside,
+  onInteractOutside,
+  ...props
+}) {
+  const v = dialog({ placement, size });
+  return /* @__PURE__ */ jsxs(DialogPrimitive.Portal, { container, children: [
+    /* @__PURE__ */ jsx(DialogPrimitive.Overlay, { className: v.overlay() }),
+    /* @__PURE__ */ jsxs(
+      DialogPrimitive.Content,
+      {
+        "data-placement": placement ?? "center",
+        "data-dismissible": dismissible ? void 0 : "false",
+        className: v.content({ className }),
+        onEscapeKeyDown: dismissible ? onEscapeKeyDown : chain(onEscapeKeyDown, prevent),
+        onPointerDownOutside: dismissible ? onPointerDownOutside : chain(onPointerDownOutside, prevent),
+        onInteractOutside: dismissible ? onInteractOutside : chain(onInteractOutside, prevent),
+        ...props,
+        children: [
+          children,
+          !hideClose && /* @__PURE__ */ jsx(DialogPrimitive.Close, { asChild: true, children: /* @__PURE__ */ jsx(IconButton, { label: closeLabel, variant: "ghost", shape: "pill", className: v.close(), children: /* @__PURE__ */ jsx(CloseIcon, {}) }) })
+        ]
+      }
+    )
+  ] });
+}
+function chain(handler, then) {
+  return (event) => {
+    handler?.(event);
+    then(event);
+  };
+}
+function DialogHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { className: s.header({ className }), ...props });
+}
+function DialogTitle({ className, ...props }) {
+  return /* @__PURE__ */ jsx(DialogPrimitive.Title, { className: s.title({ className }), ...props });
+}
+function DialogDescription({ className, ...props }) {
+  return /* @__PURE__ */ jsx(DialogPrimitive.Description, { className: s.description({ className }), ...props });
+}
+function DialogBody({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { className: s.body({ className }), ...props });
+}
+function DialogFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { className: s.footer({ className }), ...props });
+}
+var Dialog = {
+  Root: DialogPrimitive.Root,
+  Trigger: DialogPrimitive.Trigger,
+  Close: DialogPrimitive.Close,
+  Content: DialogContent,
+  Header: DialogHeader,
+  Title: DialogTitle,
+  Description: DialogDescription,
+  Body: DialogBody,
+  Footer: DialogFooter
+};
+
+// src/match-dialog/match-dialog.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function MatchDialog({ open, onOpenChange, title, description, people, primaryLabel, onPrimary, secondaryLabel }) {
+  return /* @__PURE__ */ jsx2(Dialog.Root, { open, onOpenChange, children: /* @__PURE__ */ jsxs2(Dialog.Content, { hideClose: true, size: "sm", className: "overflow-hidden border-0 bg-gradient-to-br from-accent to-accent-2 text-center text-on-accent", children: [
+    /* @__PURE__ */ jsx2("style", { href: "krizaka-match", precedence: "default", children: "@media (prefers-reduced-motion:no-preference){[data-kz-match] [data-side=a]{animation:kz-match-a .55s cubic-bezier(.3,1.6,.5,1) both}[data-kz-match] [data-side=b]{animation:kz-match-b .55s cubic-bezier(.3,1.6,.5,1) both}[data-kz-match] [data-heart]{animation:kz-match-heart .45s .25s cubic-bezier(.3,1.6,.5,1) both}}@keyframes kz-match-a{from{transform:translateX(-60px) rotate(-8deg);opacity:0}}@keyframes kz-match-b{from{transform:translateX(60px) rotate(8deg);opacity:0}}@keyframes kz-match-heart{from{transform:scale(0)}}" }),
+    /* @__PURE__ */ jsxs2("div", { "data-kz-match": "", className: "flex flex-col items-center gap-3 px-2 pb-2 pt-6", children: [
+      /* @__PURE__ */ jsx2(Dialog.Title, { className: "font-display text-4xl font-black text-on-accent", children: title }),
+      description ? /* @__PURE__ */ jsx2(Dialog.Description, { className: "max-w-xs text-sm text-on-accent", children: description }) : null,
+      /* @__PURE__ */ jsxs2("div", { className: "relative my-6 flex h-36 w-64 items-center justify-center", "aria-hidden": true, children: [
+        /* @__PURE__ */ jsx2("span", { "data-side": "a", className: "absolute left-6 -rotate-6 rounded-full ring-4 ring-on-accent", children: /* @__PURE__ */ jsx2(Avatar, { src: people[0].src ?? null, alt: "", fallback: people[0].name.charAt(0), className: "h-28 w-28 text-3xl" }) }),
+        /* @__PURE__ */ jsx2("span", { "data-side": "b", className: "absolute right-6 rotate-6 rounded-full ring-4 ring-on-accent", children: /* @__PURE__ */ jsx2(Avatar, { src: people[1].src ?? null, alt: "", fallback: people[1].name.charAt(0), className: "h-28 w-28 text-3xl" }) }),
+        /* @__PURE__ */ jsx2("span", { "data-heart": "", className: "absolute -bottom-1 flex h-12 w-12 items-center justify-center rounded-full bg-on-accent text-accent shadow-lg", children: /* @__PURE__ */ jsx2("svg", { viewBox: "0 0 24 24", className: "h-6 w-6", fill: "currentColor", children: /* @__PURE__ */ jsx2("path", { d: "M12 20s-7-4.4-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.6-7 10-7 10z" }) }) })
+      ] }),
+      /* @__PURE__ */ jsxs2("div", { className: "flex w-full flex-col gap-2", children: [
+        /* @__PURE__ */ jsx2(
+          Button,
+          {
+            size: "lg",
+            onClick: () => {
+              onOpenChange(false);
+              onPrimary();
+            },
+            children: primaryLabel
+          }
+        ),
+        /* @__PURE__ */ jsx2(Dialog.Close, { asChild: true, children: /* @__PURE__ */ jsx2(Button, { size: "lg", variant: "ghost", className: "text-on-accent hover:bg-on-accent/15", children: secondaryLabel }) })
+      ] })
+    ] })
+  ] }) });
+}
+export {
+  MatchDialog
+};
+//# sourceMappingURL=match-dialog.js.map

package/dist/match-dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/dialog/dialog.tsx","../src/match-dialog/match-dialog.tsx"],"sourcesContent":["// Client (a portal). Radix does the focus trap, the scroll lock, Escape, the outside click, aria-modal, the\n// aria-labelledby / aria-describedby wiring and the focus return: this file only holds the shape.\nimport { Dialog as DialogPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\nimport { tv, type VariantProps } from \"tailwind-variants\";\n\nimport { IconButton } from \"../button/button\";\n\nexport const dialog = tv({\n  slots: {\n    overlay: \"kz-overlay fixed inset-0 z-50 bg-overlay backdrop-blur-xs\",\n    content:\n      \"kz-dialog fixed z-50 flex flex-col overflow-hidden border border-border-default bg-surface-1 text-fg shadow-lg focus:outline-hidden\",\n    close: \"absolute right-3 top-3 h-9 w-9\",\n    header: \"flex flex-col gap-1 px-5 pb-2 pr-14 pt-5\",\n    title: \"text-base font-bold text-fg\",\n    description: \"text-sm text-fg-secondary\",\n    body: \"min-h-0 flex-1 overflow-y-auto px-5 pb-5\",\n    footer:\n      \"flex flex-wrap items-center justify-end gap-2 border-t border-border-subtle px-5 py-4 pb-[max(1rem,env(safe-area-inset-bottom))]\",\n  },\n  variants: {\n    placement: {\n      center: { content: \"left-1/2 top-1/2 max-h-[85dvh] w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 rounded-xl\" },\n      /* A sheet: anchored at the bottom on a phone, centred from `sm` up. */\n      bottom: {\n        content:\n          \"inset-x-0 bottom-0 max-h-[92dvh] rounded-t-[1.75rem] sm:bottom-auto sm:left-1/2 sm:top-1/2 sm:w-full \" +\n          \"sm:-translate-x-1/2 sm:-translate-y-1/2 sm:rounded-[1.75rem]\",\n      },\n      right: { content: \"inset-y-0 right-0 h-full w-full max-w-md rounded-none border-y-0 border-r-0\" },\n      /* A navigation drawer: full height, from the left, clear of the notch. */\n      left: { content: \"inset-y-0 left-0 h-full w-full max-w-md rounded-none border-y-0 border-l-0 pl-[env(safe-area-inset-left)]\" },\n    },\n    size: { sm: { content: \"sm:max-w-sm\" }, md: { content: \"sm:max-w-md\" }, lg: { content: \"sm:max-w-2xl\" } },\n  },\n  defaultVariants: { placement: \"center\", size: \"md\" },\n});\nconst s = dialog();\n\nexport type DialogVariants = VariantProps<typeof dialog>;\n\nfunction CloseIcon() {\n  return (\n    <svg viewBox=\"0 0 24 24\" className=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" aria-hidden>\n      <path d=\"M18 6 6 18M6 6l12 12\" />\n    </svg>\n  );\n}\n\ntype CloseButtonProps =\n  | {\n      /** The accessible name of the close button — passed translated. */\n      closeLabel: string;\n      /** Leaves the close button out (the content brings its own way out, or none: see `dismissible`). */\n      hideClose?: false;\n    }\n  | { closeLabel?: string; hideClose: true };\n\nexport type DialogContentProps = React.ComponentProps<typeof DialogPrimitive.Content> &\n  DialogVariants &\n  CloseButtonProps & {\n    /**\n     * center · bottom (a sheet on a phone, centred from `sm` up) · right (a side panel, full height) · left (a\n     * navigation drawer, full height).\n     * @default \"center\"\n     */\n    placement?: DialogVariants[\"placement\"];\n    /**\n     * sm · md · lg: the width of the dialog.\n     * @default \"md\"\n     */\n    size?: DialogVariants[\"size\"];\n    /**\n     * `false`: Escape and a click outside do not close it (a gate the user must answer: age, terms). It still closes\n     * through `open` / `onOpenChange` and any `Dialog.Close` inside. Default `true`.\n     */\n    dismissible?: boolean;\n    /** The element the portal renders into (default: document.body). */\n    container?: HTMLElement | null;\n  };\n\nconst prevent = (event: Event) => event.preventDefault();\n\n/** The dialog itself, portalled over a dimmed overlay, with a close button. Give it a `Dialog.Title`. */\nexport function DialogContent({\n  placement,\n  size,\n  closeLabel,\n  hideClose,\n  dismissible = true,\n  container,\n  className,\n  children,\n  onEscapeKeyDown,\n  onPointerDownOutside,\n  onInteractOutside,\n  ...props\n}: DialogContentProps) {\n  const v = dialog({ placement, size });\n  return (\n    <DialogPrimitive.Portal container={container}>\n      <DialogPrimitive.Overlay className={v.overlay()} />\n      <DialogPrimitive.Content\n        data-placement={placement ?? \"center\"}\n        data-dismissible={dismissible ? undefined : \"false\"}\n        className={v.content({ className })}\n        onEscapeKeyDown={dismissible ? onEscapeKeyDown : chain(onEscapeKeyDown, prevent)}\n        onPointerDownOutside={dismissible ? onPointerDownOutside : chain(onPointerDownOutside, prevent)}\n        onInteractOutside={dismissible ? onInteractOutside : chain(onInteractOutside, prevent)}\n        {...props}\n      >\n        {children}\n        {!hideClose && (\n          <DialogPrimitive.Close asChild>\n            <IconButton label={closeLabel as string} variant=\"ghost\" shape=\"pill\" className={v.close()}>\n              <CloseIcon />\n            </IconButton>\n          </DialogPrimitive.Close>\n        )}\n      </DialogPrimitive.Content>\n    </DialogPrimitive.Portal>\n  );\n}\n\nfunction chain<E extends Event>(handler: ((event: E) => void) | undefined, then: (event: E) => void) {\n  return (event: E) => {\n    handler?.(event);\n    then(event);\n  };\n}\n\nexport function DialogHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return <div className={s.header({ className })} {...props} />;\n}\n\nexport function DialogTitle({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Title>) {\n  return <DialogPrimitive.Title className={s.title({ className })} {...props} />;\n}\n\nexport function DialogDescription({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Description>) {\n  return <DialogPrimitive.Description className={s.description({ className })} {...props} />;\n}\n\nexport function DialogBody({ className, ...props }: React.ComponentProps<\"div\">) {\n  return <div className={s.body({ className })} {...props} />;\n}\n\nexport function DialogFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return <div className={s.footer({ className })} {...props} />;\n}\n\n/** `Dialog.Root/Trigger/Content/Header/Title/Description/Body/Footer/Close`. `open`/`defaultOpen` + `onOpenChange`. */\nexport const Dialog = {\n  Root: DialogPrimitive.Root,\n  Trigger: DialogPrimitive.Trigger,\n  Close: DialogPrimitive.Close,\n  Content: DialogContent,\n  Header: DialogHeader,\n  Title: DialogTitle,\n  Description: DialogDescription,\n  Body: DialogBody,\n  Footer: DialogFooter,\n};\n\n/** `Omit` that keeps the close-button union (`closeLabel` required unless `hideClose`). */\ntype DistributiveOmit<T, K extends PropertyKey> = T extends unknown ? Omit<T, K> : never;\n\nexport type SheetProps = DistributiveOmit<DialogContentProps, \"placement\">;\n\n/** A sheet is a dialog anchored at the bottom (centred from `sm` up): `Dialog.Content placement=\"bottom\"`. */\nexport function Sheet(props: SheetProps) {\n  return <DialogContent placement=\"bottom\" {...props} />;\n}\n","// Client (a portal). The moment two people choose each other — a match, a pair, a deal: a dialog in the brand\n// gradient, the two avatars meeting at a heart, the next step. The entrance plays once; still under reduced motion.\nimport * as React from \"react\";\n\nimport { Avatar } from \"../avatar\";\nimport { Button } from \"../button\";\nimport { Dialog } from \"../dialog\";\n\nexport type MatchDialogProps = {\n  /** Shown (controlled). */\n  open: boolean;\n  /** Called when it closes. */\n  onOpenChange: (open: boolean) => void;\n  /** The headline (“It's a match!”) — passed translated; the dialog's name. */\n  title: string;\n  /** A line under it. */\n  description?: string;\n  /** The two people: avatar URLs and names. */\n  people: readonly [{ src?: string | null; name: string }, { src?: string | null; name: string }];\n  /** The main action (“Send a message”). */\n  primaryLabel: string;\n  /** What it does. */\n  onPrimary: () => void;\n  /** The way back (“Keep swiping”). */\n  secondaryLabel: string;\n};\n\n/** Two people choose each other: the avatars meet at a heart in the brand gradient, the next step under them. */\nexport function MatchDialog({ open, onOpenChange, title, description, people, primaryLabel, onPrimary, secondaryLabel }: MatchDialogProps) {\n  return (\n    <Dialog.Root open={open} onOpenChange={onOpenChange}>\n      <Dialog.Content hideClose size=\"sm\" className=\"overflow-hidden border-0 bg-gradient-to-br from-accent to-accent-2 text-center text-on-accent\">\n        <style href=\"krizaka-match\" precedence=\"default\">\n          {\"@media (prefers-reduced-motion:no-preference){[data-kz-match] [data-side=a]{animation:kz-match-a .55s cubic-bezier(.3,1.6,.5,1) both}[data-kz-match] [data-side=b]{animation:kz-match-b .55s cubic-bezier(.3,1.6,.5,1) both}[data-kz-match] [data-heart]{animation:kz-match-heart .45s .25s cubic-bezier(.3,1.6,.5,1) both}}@keyframes kz-match-a{from{transform:translateX(-60px) rotate(-8deg);opacity:0}}@keyframes kz-match-b{from{transform:translateX(60px) rotate(8deg);opacity:0}}@keyframes kz-match-heart{from{transform:scale(0)}}\"}\n        </style>\n        <div data-kz-match=\"\" className=\"flex flex-col items-center gap-3 px-2 pb-2 pt-6\">\n          <Dialog.Title className=\"font-display text-4xl font-black text-on-accent\">{title}</Dialog.Title>\n          {description ? <Dialog.Description className=\"max-w-xs text-sm text-on-accent\">{description}</Dialog.Description> : null}\n          <div className=\"relative my-6 flex h-36 w-64 items-center justify-center\" aria-hidden>\n            <span data-side=\"a\" className=\"absolute left-6 -rotate-6 rounded-full ring-4 ring-on-accent\">\n              <Avatar src={people[0].src ?? null} alt=\"\" fallback={people[0].name.charAt(0)} className=\"h-28 w-28 text-3xl\" />\n            </span>\n            <span data-side=\"b\" className=\"absolute right-6 rotate-6 rounded-full ring-4 ring-on-accent\">\n              <Avatar src={people[1].src ?? null} alt=\"\" fallback={people[1].name.charAt(0)} className=\"h-28 w-28 text-3xl\" />\n            </span>\n            <span data-heart=\"\" className=\"absolute -bottom-1 flex h-12 w-12 items-center justify-center rounded-full bg-on-accent text-accent shadow-lg\">\n              <svg viewBox=\"0 0 24 24\" className=\"h-6 w-6\" fill=\"currentColor\">\n                <path d=\"M12 20s-7-4.4-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.6-7 10-7 10z\" />\n              </svg>\n            </span>\n          </div>\n          <div className=\"flex w-full flex-col gap-2\">\n            <Button\n              size=\"lg\"\n              onClick={() => {\n                onOpenChange(false);\n                onPrimary();\n              }}\n            >\n              {primaryLabel}\n            </Button>\n            <Dialog.Close asChild>\n              <Button size=\"lg\" variant=\"ghost\" className=\"text-on-accent hover:bg-on-accent/15\">\n                {secondaryLabel}\n              </Button>\n            </Dialog.Close>\n          </div>\n        </div>\n      </Dialog.Content>\n    </Dialog.Root>\n  );\n}\n"],"mappings":";;;;;;;;;;AAEA,SAAS,UAAU,uBAAuB;AAE1C,SAAS,UAA6B;AAyChC,cA0DA,YA1DA;AArCC,IAAM,SAAS,GAAG;AAAA,EACvB,OAAO;AAAA,IACL,SAAS;AAAA,IACT,SACE;AAAA,IACF,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,aAAa;AAAA,IACb,MAAM;AAAA,IACN,QACE;AAAA,EACJ;AAAA,EACA,UAAU;AAAA,IACR,WAAW;AAAA,MACT,QAAQ,EAAE,SAAS,kGAAkG;AAAA;AAAA,MAErH,QAAQ;AAAA,QACN,SACE;AAAA,MAEJ;AAAA,MACA,OAAO,EAAE,SAAS,8EAA8E;AAAA;AAAA,MAEhG,MAAM,EAAE,SAAS,4GAA4G;AAAA,IAC/H;AAAA,IACA,MAAM,EAAE,IAAI,EAAE,SAAS,cAAc,GAAG,IAAI,EAAE,SAAS,cAAc,GAAG,IAAI,EAAE,SAAS,eAAe,EAAE;AAAA,EAC1G;AAAA,EACA,iBAAiB,EAAE,WAAW,UAAU,MAAM,KAAK;AACrD,CAAC;AACD,IAAM,IAAI,OAAO;AAIjB,SAAS,YAAY;AACnB,SACE,oBAAC,SAAI,SAAQ,aAAY,WAAU,WAAU,MAAK,QAAO,QAAO,gBAAe,aAAY,KAAI,eAAc,SAAQ,eAAW,MAC9H,8BAAC,UAAK,GAAE,wBAAuB,GACjC;AAEJ;AAkCA,IAAM,UAAU,CAAC,UAAiB,MAAM,eAAe;AAGhD,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAuB;AACrB,QAAM,IAAI,OAAO,EAAE,WAAW,KAAK,CAAC;AACpC,SACE,qBAAC,gBAAgB,QAAhB,EAAuB,WACtB;AAAA,wBAAC,gBAAgB,SAAhB,EAAwB,WAAW,EAAE,QAAQ,GAAG;AAAA,IACjD;AAAA,MAAC,gBAAgB;AAAA,MAAhB;AAAA,QACC,kBAAgB,aAAa;AAAA,QAC7B,oBAAkB,cAAc,SAAY;AAAA,QAC5C,WAAW,EAAE,QAAQ,EAAE,UAAU,CAAC;AAAA,QAClC,iBAAiB,cAAc,kBAAkB,MAAM,iBAAiB,OAAO;AAAA,QAC/E,sBAAsB,cAAc,uBAAuB,MAAM,sBAAsB,OAAO;AAAA,QAC9F,mBAAmB,cAAc,oBAAoB,MAAM,mBAAmB,OAAO;AAAA,QACpF,GAAG;AAAA,QAEH;AAAA;AAAA,UACA,CAAC,aACA,oBAAC,gBAAgB,OAAhB,EAAsB,SAAO,MAC5B,8BAAC,cAAW,OAAO,YAAsB,SAAQ,SAAQ,OAAM,QAAO,WAAW,EAAE,MAAM,GACvF,8BAAC,aAAU,GACb,GACF;AAAA;AAAA;AAAA,IAEJ;AAAA,KACF;AAEJ;AAEA,SAAS,MAAuB,SAA2C,MAA0B;AACnG,SAAO,CAAC,UAAa;AACnB,cAAU,KAAK;AACf,SAAK,KAAK;AAAA,EACZ;AACF;AAEO,SAAS,aAAa,EAAE,WAAW,GAAG,MAAM,GAAgC;AACjF,SAAO,oBAAC,SAAI,WAAW,EAAE,OAAO,EAAE,UAAU,CAAC,GAAI,GAAG,OAAO;AAC7D;AAEO,SAAS,YAAY,EAAE,WAAW,GAAG,MAAM,GAAuD;AACvG,SAAO,oBAAC,gBAAgB,OAAhB,EAAsB,WAAW,EAAE,MAAM,EAAE,UAAU,CAAC,GAAI,GAAG,OAAO;AAC9E;AAEO,SAAS,kBAAkB,EAAE,WAAW,GAAG,MAAM,GAA6D;AACnH,SAAO,oBAAC,gBAAgB,aAAhB,EAA4B,WAAW,EAAE,YAAY,EAAE,UAAU,CAAC,GAAI,GAAG,OAAO;AAC1F;AAEO,SAAS,WAAW,EAAE,WAAW,GAAG,MAAM,GAAgC;AAC/E,SAAO,oBAAC,SAAI,WAAW,EAAE,KAAK,EAAE,UAAU,CAAC,GAAI,GAAG,OAAO;AAC3D;AAEO,SAAS,aAAa,EAAE,WAAW,GAAG,MAAM,GAAgC;AACjF,SAAO,oBAAC,SAAI,WAAW,EAAE,OAAO,EAAE,UAAU,CAAC,GAAI,GAAG,OAAO;AAC7D;AAGO,IAAM,SAAS;AAAA,EACpB,MAAM,gBAAgB;AAAA,EACtB,SAAS,gBAAgB;AAAA,EACzB,OAAO,gBAAgB;AAAA,EACvB,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,aAAa;AAAA,EACb,MAAM;AAAA,EACN,QAAQ;AACV;;;ACnIQ,gBAAAA,MAME,QAAAC,aANF;AAJD,SAAS,YAAY,EAAE,MAAM,cAAc,OAAO,aAAa,QAAQ,cAAc,WAAW,eAAe,GAAqB;AACzI,SACE,gBAAAD,KAAC,OAAO,MAAP,EAAY,MAAY,cACvB,0BAAAC,MAAC,OAAO,SAAP,EAAe,WAAS,MAAC,MAAK,MAAK,WAAU,iGAC5C;AAAA,oBAAAD,KAAC,WAAM,MAAK,iBAAgB,YAAW,WACpC,2hBACH;AAAA,IACA,gBAAAC,MAAC,SAAI,iBAAc,IAAG,WAAU,mDAC9B;AAAA,sBAAAD,KAAC,OAAO,OAAP,EAAa,WAAU,mDAAmD,iBAAM;AAAA,MAChF,cAAc,gBAAAA,KAAC,OAAO,aAAP,EAAmB,WAAU,mCAAmC,uBAAY,IAAwB;AAAA,MACpH,gBAAAC,MAAC,SAAI,WAAU,4DAA2D,eAAW,MACnF;AAAA,wBAAAD,KAAC,UAAK,aAAU,KAAI,WAAU,gEAC5B,0BAAAA,KAAC,UAAO,KAAK,OAAO,CAAC,EAAE,OAAO,MAAM,KAAI,IAAG,UAAU,OAAO,CAAC,EAAE,KAAK,OAAO,CAAC,GAAG,WAAU,sBAAqB,GAChH;AAAA,QACA,gBAAAA,KAAC,UAAK,aAAU,KAAI,WAAU,gEAC5B,0BAAAA,KAAC,UAAO,KAAK,OAAO,CAAC,EAAE,OAAO,MAAM,KAAI,IAAG,UAAU,OAAO,CAAC,EAAE,KAAK,OAAO,CAAC,GAAG,WAAU,sBAAqB,GAChH;AAAA,QACA,gBAAAA,KAAC,UAAK,cAAW,IAAG,WAAU,iHAC5B,0BAAAA,KAAC,SAAI,SAAQ,aAAY,WAAU,WAAU,MAAK,gBAChD,0BAAAA,KAAC,UAAK,GAAE,uEAAsE,GAChF,GACF;AAAA,SACF;AAAA,MACA,gBAAAC,MAAC,SAAI,WAAU,8BACb;AAAA,wBAAAD;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,SAAS,MAAM;AACb,2BAAa,KAAK;AAClB,wBAAU;AAAA,YACZ;AAAA,YAEC;AAAA;AAAA,QACH;AAAA,QACA,gBAAAA,KAAC,OAAO,OAAP,EAAa,SAAO,MACnB,0BAAAA,KAAC,UAAO,MAAK,MAAK,SAAQ,SAAQ,WAAU,wCACzC,0BACH,GACF;AAAA,SACF;AAAA,OACF;AAAA,KACF,GACF;AAEJ;","names":["jsx","jsxs"]}