@flanksource/clicky-ui 0.1.0 → 0.2.2

package/dist/overlay/HoverCard.js

@@ -0,0 +1,170 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState, useRef, useLayoutEffect, useEffect } from "react";
+import { createPortal } from "react-dom";
+import { cn } from "../lib/utils.js";
+const GAP_PX = 6;
+const HOVER_CLOSE_DELAY_MS = 120;
+function HoverCard({
+  trigger,
+  children,
+  placement = "top",
+  delay = 0,
+  arrow = true,
+  className,
+  cardClassName
+}) {
+  const [open, setOpen] = useState(false);
+  const [position, setPosition] = useState(null);
+  const triggerRef = useRef(null);
+  const cardRef = useRef(null);
+  const openTimerRef = useRef(null);
+  const closeTimerRef = useRef(null);
+  const cancelClose = () => {
+    if (closeTimerRef.current !== null) {
+      window.clearTimeout(closeTimerRef.current);
+      closeTimerRef.current = null;
+    }
+  };
+  function onEnter() {
+    cancelClose();
+    if (delay > 0) {
+      if (openTimerRef.current !== null) window.clearTimeout(openTimerRef.current);
+      openTimerRef.current = window.setTimeout(() => setOpen(true), delay);
+    } else {
+      setOpen(true);
+    }
+  }
+  function onLeave() {
+    if (openTimerRef.current !== null) {
+      window.clearTimeout(openTimerRef.current);
+      openTimerRef.current = null;
+    }
+    cancelClose();
+    closeTimerRef.current = window.setTimeout(() => setOpen(false), HOVER_CLOSE_DELAY_MS);
+  }
+  useLayoutEffect(() => {
+    if (!open) return;
+    const update = () => {
+      const trigger2 = triggerRef.current;
+      const card2 = cardRef.current;
+      if (!trigger2 || !card2) return;
+      const t = trigger2.getBoundingClientRect();
+      const c = card2.getBoundingClientRect();
+      let top = 0;
+      let left = 0;
+      switch (placement) {
+        case "top":
+          top = t.top - c.height - GAP_PX;
+          left = t.left + t.width / 2 - c.width / 2;
+          break;
+        case "bottom":
+          top = t.bottom + GAP_PX;
+          left = t.left + t.width / 2 - c.width / 2;
+          break;
+        case "left":
+          top = t.top + t.height / 2 - c.height / 2;
+          left = t.left - c.width - GAP_PX;
+          break;
+        case "right":
+          top = t.top + t.height / 2 - c.height / 2;
+          left = t.right + GAP_PX;
+          break;
+      }
+      const margin = 4;
+      left = Math.min(Math.max(margin, left), window.innerWidth - c.width - margin);
+      top = Math.min(Math.max(margin, top), window.innerHeight - c.height - margin);
+      setPosition({ top, left });
+    };
+    update();
+    window.addEventListener("scroll", update, true);
+    window.addEventListener("resize", update);
+    return () => {
+      window.removeEventListener("scroll", update, true);
+      window.removeEventListener("resize", update);
+    };
+  }, [open, placement, children]);
+  useEffect(() => {
+    return () => {
+      if (openTimerRef.current !== null) window.clearTimeout(openTimerRef.current);
+      if (closeTimerRef.current !== null) window.clearTimeout(closeTimerRef.current);
+    };
+  }, []);
+  const card = open && typeof document !== "undefined" ? createPortal(
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: cardRef,
+        role: "tooltip",
+        onMouseEnter: cancelClose,
+        onMouseLeave: onLeave,
+        style: position ? { position: "fixed", top: position.top, left: position.left } : { position: "fixed", top: -9999, left: -9999, visibility: "hidden" },
+        className: cn(
+          "z-[9999] rounded-md border border-border bg-background px-2.5 py-1.5 text-[11px] shadow-lg",
+          "whitespace-nowrap",
+          cardClassName
+        ),
+        children: [
+          children,
+          arrow && position && /* @__PURE__ */ jsx(Arrow, { placement })
+        ]
+      }
+    ),
+    document.body
+  ) : null;
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      ref: triggerRef,
+      className: cn("relative inline-flex items-center", className),
+      onMouseEnter: onEnter,
+      onMouseLeave: onLeave,
+      onFocus: onEnter,
+      onBlur: onLeave,
+      children: [
+        trigger,
+        card
+      ]
+    }
+  );
+}
+function Arrow({ placement }) {
+  const base = "absolute h-1.5 w-1.5 rotate-45 border bg-background border-border";
+  switch (placement) {
+    case "top":
+      return /* @__PURE__ */ jsx(
+        "span",
+        {
+          "aria-hidden": true,
+          className: cn(base, "left-1/2 -translate-x-1/2 -bottom-0.5 border-l-0 border-t-0")
+        }
+      );
+    case "bottom":
+      return /* @__PURE__ */ jsx(
+        "span",
+        {
+          "aria-hidden": true,
+          className: cn(base, "left-1/2 -translate-x-1/2 -top-0.5 border-r-0 border-b-0")
+        }
+      );
+    case "left":
+      return /* @__PURE__ */ jsx(
+        "span",
+        {
+          "aria-hidden": true,
+          className: cn(base, "top-1/2 -translate-y-1/2 -right-0.5 border-l-0 border-b-0")
+        }
+      );
+    case "right":
+      return /* @__PURE__ */ jsx(
+        "span",
+        {
+          "aria-hidden": true,
+          className: cn(base, "top-1/2 -translate-y-1/2 -left-0.5 border-r-0 border-t-0")
+        }
+      );
+  }
+}
+export {
+  HoverCard
+};
+//# sourceMappingURL=HoverCard.js.map

package/dist/overlay/HoverCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HoverCard.js","sources":["../../src/overlay/HoverCard.tsx"],"sourcesContent":["import { useEffect, useLayoutEffect, useRef, useState, type ReactNode } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { cn } from \"../lib/utils\";\n\nexport type HoverCardPlacement = \"top\" | \"bottom\" | \"left\" | \"right\";\n\nexport type HoverCardProps = {\n  trigger: ReactNode;\n  children: ReactNode;\n  placement?: HoverCardPlacement;\n  delay?: number;\n  arrow?: boolean;\n  className?: string;\n  cardClassName?: string;\n};\n\nconst GAP_PX = 6;\n\ntype Position = { top: number; left: number };\n\n// Grace period that lets the cursor cross the gap from the trigger to the\n// portaled card without the card disappearing.\nconst HOVER_CLOSE_DELAY_MS = 120;\n\nexport function HoverCard({\n  trigger,\n  children,\n  placement = \"top\",\n  delay = 0,\n  arrow = true,\n  className,\n  cardClassName,\n}: HoverCardProps) {\n  const [open, setOpen] = useState(false);\n  const [position, setPosition] = useState<Position | null>(null);\n  const triggerRef = useRef<HTMLSpanElement | null>(null);\n  const cardRef = useRef<HTMLDivElement | null>(null);\n  const openTimerRef = useRef<number | null>(null);\n  const closeTimerRef = useRef<number | null>(null);\n\n  const cancelClose = () => {\n    if (closeTimerRef.current !== null) {\n      window.clearTimeout(closeTimerRef.current);\n      closeTimerRef.current = null;\n    }\n  };\n\n  function onEnter() {\n    cancelClose();\n    if (delay > 0) {\n      if (openTimerRef.current !== null) window.clearTimeout(openTimerRef.current);\n      openTimerRef.current = window.setTimeout(() => setOpen(true), delay);\n    } else {\n      setOpen(true);\n    }\n  }\n  function onLeave() {\n    if (openTimerRef.current !== null) {\n      window.clearTimeout(openTimerRef.current);\n      openTimerRef.current = null;\n    }\n    cancelClose();\n    closeTimerRef.current = window.setTimeout(() => setOpen(false), HOVER_CLOSE_DELAY_MS);\n  }\n\n  // Recompute position whenever the card opens or the viewport scrolls/resizes\n  // while it's open. We position via fixed coordinates so the card escapes\n  // every overflow-hidden / transform ancestor — important when the trigger\n  // sits inside a table row, dropdown, or modal that would otherwise clip it.\n  useLayoutEffect(() => {\n    if (!open) return;\n    const update = () => {\n      const trigger = triggerRef.current;\n      const card = cardRef.current;\n      if (!trigger || !card) return;\n      const t = trigger.getBoundingClientRect();\n      const c = card.getBoundingClientRect();\n      let top = 0;\n      let left = 0;\n      switch (placement) {\n        case \"top\":\n          top = t.top - c.height - GAP_PX;\n          left = t.left + t.width / 2 - c.width / 2;\n          break;\n        case \"bottom\":\n          top = t.bottom + GAP_PX;\n          left = t.left + t.width / 2 - c.width / 2;\n          break;\n        case \"left\":\n          top = t.top + t.height / 2 - c.height / 2;\n          left = t.left - c.width - GAP_PX;\n          break;\n        case \"right\":\n          top = t.top + t.height / 2 - c.height / 2;\n          left = t.right + GAP_PX;\n          break;\n      }\n      // Clamp to viewport so cards near the edge don't overflow off-screen.\n      const margin = 4;\n      left = Math.min(Math.max(margin, left), window.innerWidth - c.width - margin);\n      top = Math.min(Math.max(margin, top), window.innerHeight - c.height - margin);\n      setPosition({ top, left });\n    };\n    update();\n    window.addEventListener(\"scroll\", update, true);\n    window.addEventListener(\"resize\", update);\n    return () => {\n      window.removeEventListener(\"scroll\", update, true);\n      window.removeEventListener(\"resize\", update);\n    };\n  }, [open, placement, children]);\n\n  useEffect(() => {\n    return () => {\n      if (openTimerRef.current !== null) window.clearTimeout(openTimerRef.current);\n      if (closeTimerRef.current !== null) window.clearTimeout(closeTimerRef.current);\n    };\n  }, []);\n\n  const card =\n    open && typeof document !== \"undefined\"\n      ? createPortal(\n          <div\n            ref={cardRef}\n            role=\"tooltip\"\n            onMouseEnter={cancelClose}\n            onMouseLeave={onLeave}\n            style={\n              position\n                ? { position: \"fixed\", top: position.top, left: position.left }\n                : { position: \"fixed\", top: -9999, left: -9999, visibility: \"hidden\" }\n            }\n            className={cn(\n              \"z-[9999] rounded-md border border-border bg-background px-2.5 py-1.5 text-[11px] shadow-lg\",\n              \"whitespace-nowrap\",\n              cardClassName,\n            )}\n          >\n            {children}\n            {arrow && position && <Arrow placement={placement} />}\n          </div>,\n          document.body,\n        )\n      : null;\n\n  return (\n    <span\n      ref={triggerRef}\n      className={cn(\"relative inline-flex items-center\", className)}\n      onMouseEnter={onEnter}\n      onMouseLeave={onLeave}\n      onFocus={onEnter}\n      onBlur={onLeave}\n    >\n      {trigger}\n      {card}\n    </span>\n  );\n}\n\nfunction Arrow({ placement }: { placement: HoverCardPlacement }) {\n  // The arrow is a small rotated square clipped to look like a notch on the\n  // card edge that points back at the trigger. Drawn relative to the card.\n  const base = \"absolute h-1.5 w-1.5 rotate-45 border bg-background border-border\";\n  switch (placement) {\n    case \"top\":\n      return (\n        <span\n          aria-hidden\n          className={cn(base, \"left-1/2 -translate-x-1/2 -bottom-0.5 border-l-0 border-t-0\")}\n        />\n      );\n    case \"bottom\":\n      return (\n        <span\n          aria-hidden\n          className={cn(base, \"left-1/2 -translate-x-1/2 -top-0.5 border-r-0 border-b-0\")}\n        />\n      );\n    case \"left\":\n      return (\n        <span\n          aria-hidden\n          className={cn(base, \"top-1/2 -translate-y-1/2 -right-0.5 border-l-0 border-b-0\")}\n        />\n      );\n    case \"right\":\n      return (\n        <span\n          aria-hidden\n          className={cn(base, \"top-1/2 -translate-y-1/2 -left-0.5 border-r-0 border-t-0\")}\n        />\n      );\n  }\n}\n"],"names":["trigger","card"],"mappings":"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"}

package/dist/overlay/Modal.d.ts

@@ -0,0 +1,17 @@
+import { ReactNode } from 'react';
+export type ModalSize = "sm" | "md" | "lg" | "xl" | "full";
+export type ModalProps = {
+    open: boolean;
+    onClose: () => void;
+    title?: ReactNode;
+    size?: ModalSize;
+    closeOnBackdrop?: boolean;
+    closeOnEsc?: boolean;
+    hideClose?: boolean;
+    className?: string;
+    headerSlot?: ReactNode;
+    footer?: ReactNode;
+    children: ReactNode;
+};
+export declare function Modal({ open, onClose, title, size, closeOnBackdrop, closeOnEsc, hideClose, className, headerSlot, footer, children, }: ModalProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=Modal.d.ts.map

package/dist/overlay/Modal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../src/overlay/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAI1D,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AAE3D,MAAM,MAAM,UAAU,GAAG;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAUF,wBAAgB,KAAK,CAAC,EACpB,IAAI,EACJ,OAAO,EACP,KAAK,EACL,IAAW,EACX,eAAsB,EACtB,UAAiB,EACjB,SAAiB,EACjB,SAAS,EACT,UAAU,EACV,MAAM,EACN,QAAQ,GACT,EAAE,UAAU,kDA6DZ"}

package/dist/overlay/Modal.js

@@ -0,0 +1,91 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useRef, useEffect } from "react";
+import { cn } from "../lib/utils.js";
+import { Icon } from "../data/Icon.js";
+const sizeClass = {
+  sm: "max-w-sm max-h-[90vh]",
+  md: "max-w-md max-h-[90vh]",
+  lg: "max-w-2xl max-h-[90vh]",
+  xl: "max-w-4xl max-h-[90vh]",
+  full: "max-w-[95vw] max-h-[95vh]"
+};
+function Modal({
+  open,
+  onClose,
+  title,
+  size = "md",
+  closeOnBackdrop = true,
+  closeOnEsc = true,
+  hideClose = false,
+  className,
+  headerSlot,
+  footer,
+  children
+}) {
+  const dialogRef = useRef(null);
+  useEffect(() => {
+    if (!open || !closeOnEsc) return;
+    const onKey = (e) => {
+      if (e.key === "Escape") onClose();
+    };
+    document.addEventListener("keydown", onKey);
+    return () => document.removeEventListener("keydown", onKey);
+  }, [open, closeOnEsc, onClose]);
+  useEffect(() => {
+    var _a;
+    if (!open) return;
+    const prev = document.activeElement;
+    (_a = dialogRef.current) == null ? void 0 : _a.focus();
+    return () => {
+      var _a2;
+      return (_a2 = prev == null ? void 0 : prev.focus) == null ? void 0 : _a2.call(prev);
+    };
+  }, [open]);
+  if (!open) return null;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: "fixed inset-0 z-50 flex items-center justify-center bg-black/40",
+      onClick: closeOnBackdrop ? onClose : void 0,
+      role: "presentation",
+      children: /* @__PURE__ */ jsxs(
+        "div",
+        {
+          ref: dialogRef,
+          tabIndex: -1,
+          role: "dialog",
+          "aria-modal": "true",
+          "aria-label": typeof title === "string" ? title : void 0,
+          className: cn(
+            "relative bg-background border border-border rounded-lg shadow-xl w-full flex flex-col",
+            sizeClass[size],
+            className
+          ),
+          onClick: (e) => e.stopPropagation(),
+          children: [
+            (title || headerSlot || !hideClose) && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-density-2 px-density-4 py-density-3 border-b border-border", children: [
+              title && /* @__PURE__ */ jsx("h2", { className: "text-sm font-semibold flex-1", children: title }),
+              headerSlot,
+              !hideClose && /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: onClose,
+                  "aria-label": "Close",
+                  className: "text-muted-foreground hover:text-foreground",
+                  children: /* @__PURE__ */ jsx(Icon, { name: "codicon:close" })
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-auto px-density-4 py-density-3", children }),
+            footer && /* @__PURE__ */ jsx("div", { className: "px-density-4 py-density-3 border-t border-border", children: footer })
+          ]
+        }
+      )
+    }
+  );
+}
+export {
+  Modal
+};
+//# sourceMappingURL=Modal.js.map

package/dist/overlay/Modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.js","sources":["../../src/overlay/Modal.tsx"],"sourcesContent":["import { useEffect, useRef, type ReactNode } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\n\nexport type ModalSize = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"full\";\n\nexport type ModalProps = {\n  open: boolean;\n  onClose: () => void;\n  title?: ReactNode;\n  size?: ModalSize;\n  closeOnBackdrop?: boolean;\n  closeOnEsc?: boolean;\n  hideClose?: boolean;\n  className?: string;\n  headerSlot?: ReactNode;\n  footer?: ReactNode;\n  children: ReactNode;\n};\n\nconst sizeClass: Record<ModalSize, string> = {\n  sm: \"max-w-sm max-h-[90vh]\",\n  md: \"max-w-md max-h-[90vh]\",\n  lg: \"max-w-2xl max-h-[90vh]\",\n  xl: \"max-w-4xl max-h-[90vh]\",\n  full: \"max-w-[95vw] max-h-[95vh]\",\n};\n\nexport function Modal({\n  open,\n  onClose,\n  title,\n  size = \"md\",\n  closeOnBackdrop = true,\n  closeOnEsc = true,\n  hideClose = false,\n  className,\n  headerSlot,\n  footer,\n  children,\n}: ModalProps) {\n  const dialogRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (!open || !closeOnEsc) return;\n    const onKey = (e: KeyboardEvent) => {\n      if (e.key === \"Escape\") onClose();\n    };\n    document.addEventListener(\"keydown\", onKey);\n    return () => document.removeEventListener(\"keydown\", onKey);\n  }, [open, closeOnEsc, onClose]);\n\n  useEffect(() => {\n    if (!open) return;\n    const prev = document.activeElement as HTMLElement | null;\n    dialogRef.current?.focus();\n    return () => prev?.focus?.();\n  }, [open]);\n\n  if (!open) return null;\n\n  return (\n    <div\n      className=\"fixed inset-0 z-50 flex items-center justify-center bg-black/40\"\n      onClick={closeOnBackdrop ? onClose : undefined}\n      role=\"presentation\"\n    >\n      <div\n        ref={dialogRef}\n        tabIndex={-1}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        aria-label={typeof title === \"string\" ? title : undefined}\n        className={cn(\n          \"relative bg-background border border-border rounded-lg shadow-xl w-full flex flex-col\",\n          sizeClass[size],\n          className,\n        )}\n        onClick={(e) => e.stopPropagation()}\n      >\n        {(title || headerSlot || !hideClose) && (\n          <div className=\"flex items-center gap-density-2 px-density-4 py-density-3 border-b border-border\">\n            {title && <h2 className=\"text-sm font-semibold flex-1\">{title}</h2>}\n            {headerSlot}\n            {!hideClose && (\n              <button\n                type=\"button\"\n                onClick={onClose}\n                aria-label=\"Close\"\n                className=\"text-muted-foreground hover:text-foreground\"\n              >\n                <Icon name=\"codicon:close\" />\n              </button>\n            )}\n          </div>\n        )}\n        <div className=\"flex-1 overflow-auto px-density-4 py-density-3\">{children}</div>\n        {footer && <div className=\"px-density-4 py-density-3 border-t border-border\">{footer}</div>}\n      </div>\n    </div>\n  );\n}\n"],"names":["_a"],"mappings":";;;;AAoBA,MAAM,YAAuC;AAAA,EAC3C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,MAAM;AACR;AAEO,SAAS,MAAM;AAAA,EACpB;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,kBAAkB;AAAA,EAClB,aAAa;AAAA,EACb,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAe;AACb,QAAM,YAAY,OAAuB,IAAI;AAE7C,YAAU,MAAM;AACd,QAAI,CAAC,QAAQ,CAAC,WAAY;AAC1B,UAAM,QAAQ,CAAC,MAAqB;AAClC,UAAI,EAAE,QAAQ,SAAU,SAAA;AAAA,IAC1B;AACA,aAAS,iBAAiB,WAAW,KAAK;AAC1C,WAAO,MAAM,SAAS,oBAAoB,WAAW,KAAK;AAAA,EAC5D,GAAG,CAAC,MAAM,YAAY,OAAO,CAAC;AAE9B,YAAU,MAAM;;AACd,QAAI,CAAC,KAAM;AACX,UAAM,OAAO,SAAS;AACtB,oBAAU,YAAV,mBAAmB;AACnB,WAAO,MAAA;;AAAM,cAAAA,MAAA,6BAAM,UAAN,gBAAAA,IAAA;AAAA;AAAA,EACf,GAAG,CAAC,IAAI,CAAC;AAET,MAAI,CAAC,KAAM,QAAO;AAElB,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,SAAS,kBAAkB,UAAU;AAAA,MACrC,MAAK;AAAA,MAEL,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,KAAK;AAAA,UACL,UAAU;AAAA,UACV,MAAK;AAAA,UACL,cAAW;AAAA,UACX,cAAY,OAAO,UAAU,WAAW,QAAQ;AAAA,UAChD,WAAW;AAAA,YACT;AAAA,YACA,UAAU,IAAI;AAAA,YACd;AAAA,UAAA;AAAA,UAEF,SAAS,CAAC,MAAM,EAAE,gBAAA;AAAA,UAEhB,UAAA;AAAA,aAAA,SAAS,cAAc,CAAC,cACxB,qBAAC,OAAA,EAAI,WAAU,oFACZ,UAAA;AAAA,cAAA,SAAS,oBAAC,MAAA,EAAG,WAAU,gCAAgC,UAAA,OAAM;AAAA,cAC7D;AAAA,cACA,CAAC,aACA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,MAAK;AAAA,kBACL,SAAS;AAAA,kBACT,cAAW;AAAA,kBACX,WAAU;AAAA,kBAEV,UAAA,oBAAC,MAAA,EAAK,MAAK,gBAAA,CAAgB;AAAA,gBAAA;AAAA,cAAA;AAAA,YAC7B,GAEJ;AAAA,YAEF,oBAAC,OAAA,EAAI,WAAU,kDAAkD,SAAA,CAAS;AAAA,YACzE,UAAU,oBAAC,OAAA,EAAI,WAAU,oDAAoD,UAAA,OAAA,CAAO;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACvF;AAAA,EAAA;AAGN;"}

package/dist/rpc/AcceptPicker.d.ts

@@ -0,0 +1,52 @@
+export declare const ACCEPT_OPTIONS: readonly [{
+    readonly value: "application/json";
+    readonly label: "JSON";
+}, {
+    readonly value: "application/clicky+json";
+    readonly label: "Clicky";
+}, {
+    readonly value: "text/markdown";
+    readonly label: "Markdown";
+}, {
+    readonly value: "text/html";
+    readonly label: "HTML";
+}, {
+    readonly value: "application/x-yaml";
+    readonly label: "YAML";
+}, {
+    readonly value: "text/csv";
+    readonly label: "CSV";
+}, {
+    readonly value: "application/pdf";
+    readonly label: "PDF";
+}, {
+    readonly value: "text/plain";
+    readonly label: "Pretty";
+}];
+export declare const VIEW_OPTIONS: readonly [{
+    readonly value: "application/json";
+    readonly label: "JSON";
+}, {
+    readonly value: "application/clicky+json";
+    readonly label: "Clicky";
+}, {
+    readonly value: "application/pdf";
+    readonly label: "PDF";
+}];
+export type AcceptOption = {
+    value: string;
+    label: string;
+};
+export type AcceptValue = (typeof ACCEPT_OPTIONS)[number]["value"];
+export type OperationPreviewMode = "hidden" | "curl" | "cli";
+export type AcceptPickerProps = {
+    value: string;
+    onChange: (value: string) => void;
+    size?: "sm" | "md";
+    options?: readonly AcceptOption[];
+    previewMode?: OperationPreviewMode;
+    onPreviewModeChange?: (mode: OperationPreviewMode) => void;
+    className?: string;
+};
+export declare function AcceptPicker({ value, onChange, size, options, previewMode, onPreviewModeChange, className, }: AcceptPickerProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=AcceptPicker.d.ts.map

package/dist/rpc/AcceptPicker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AcceptPicker.d.ts","sourceRoot":"","sources":["../../src/rpc/AcceptPicker.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;EASjB,CAAC;AAEX,eAAO,MAAM,YAAY;;;;;;;;;EAIf,CAAC;AAEX,MAAM,MAAM,YAAY,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAC5D,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAC;AACnE,MAAM,MAAM,oBAAoB,GAAG,QAAQ,GAAG,MAAM,GAAG,KAAK,CAAC;AAE7D,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB,OAAO,CAAC,EAAE,SAAS,YAAY,EAAE,CAAC;IAClC,WAAW,CAAC,EAAE,oBAAoB,CAAC;IACnC,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAC3D,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAQF,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,QAAQ,EACR,IAAW,EACX,OAAwB,EACxB,WAAsB,EACtB,mBAAmB,EACnB,SAAS,GACV,EAAE,iBAAiB,2CAyFnB"}

package/dist/rpc/AcceptPicker.js

@@ -0,0 +1,126 @@
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import { useRef, useState, useEffect } from "react";
+import { Button } from "../components/button.js";
+import { Icon } from "../data/Icon.js";
+import { cn } from "../lib/utils.js";
+const ACCEPT_OPTIONS = [
+  { value: "application/json", label: "JSON" },
+  { value: "application/clicky+json", label: "Clicky" },
+  { value: "text/markdown", label: "Markdown" },
+  { value: "text/html", label: "HTML" },
+  { value: "application/x-yaml", label: "YAML" },
+  { value: "text/csv", label: "CSV" },
+  { value: "application/pdf", label: "PDF" },
+  { value: "text/plain", label: "Pretty" }
+];
+const VIEW_OPTIONS = [
+  { value: "application/json", label: "JSON" },
+  { value: "application/clicky+json", label: "Clicky" },
+  { value: "application/pdf", label: "PDF" }
+];
+const PREVIEW_OPTIONS = [
+  { value: "curl", label: "Show cURL preview" },
+  { value: "cli", label: "Show CLI preview" },
+  { value: "hidden", label: "Hide preview" }
+];
+function AcceptPicker({
+  value,
+  onChange,
+  size = "md",
+  options = ACCEPT_OPTIONS,
+  previewMode = "hidden",
+  onPreviewModeChange,
+  className
+}) {
+  const rootRef = useRef(null);
+  const [open, setOpen] = useState(false);
+  const pad = size === "sm" ? "px-2 py-0.5" : "px-2.5 py-1";
+  useEffect(() => {
+    if (!open) return;
+    const onPointerDown = (event) => {
+      var _a;
+      if (!((_a = rootRef.current) == null ? void 0 : _a.contains(event.target))) {
+        setOpen(false);
+      }
+    };
+    const onKeyDown = (event) => {
+      if (event.key === "Escape") setOpen(false);
+    };
+    document.addEventListener("pointerdown", onPointerDown);
+    document.addEventListener("keydown", onKeyDown);
+    return () => {
+      document.removeEventListener("pointerdown", onPointerDown);
+      document.removeEventListener("keydown", onKeyDown);
+    };
+  }, [open]);
+  return /* @__PURE__ */ jsxs("div", { ref: rootRef, className: cn("relative flex flex-wrap gap-1", className), children: [
+    options.map((opt) => /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: () => onChange(opt.value),
+        className: cn(
+          "rounded-md border text-xs transition-colors",
+          pad,
+          value === opt.value ? "border-emerald-500 bg-emerald-50 font-medium text-emerald-700 dark:border-emerald-600 dark:bg-emerald-950/30 dark:text-emerald-400" : "text-muted-foreground hover:border-foreground/20 hover:text-foreground"
+        ),
+        children: opt.label
+      },
+      opt.value
+    )),
+    onPreviewModeChange && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "button",
+          variant: "outline",
+          size: "sm",
+          "aria-label": "Open preview menu",
+          "aria-haspopup": "menu",
+          "aria-expanded": open,
+          className: cn("h-auto", pad),
+          onClick: () => setOpen((current) => !current),
+          children: /* @__PURE__ */ jsx(Icon, { name: "codicon:ellipsis" })
+        }
+      ),
+      open && /* @__PURE__ */ jsx(
+        "div",
+        {
+          role: "menu",
+          "aria-label": "Preview options",
+          className: "absolute right-0 top-[calc(100%+0.375rem)] z-50 min-w-[12rem] rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-lg shadow-black/5",
+          children: PREVIEW_OPTIONS.map((option) => {
+            const active = option.value === previewMode;
+            return /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                role: "menuitemradio",
+                "aria-checked": active,
+                className: cn(
+                  "flex w-full items-center gap-2 rounded-sm px-2 py-1.5 text-left text-sm transition-colors",
+                  "hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none"
+                ),
+                onClick: () => {
+                  onPreviewModeChange(option.value);
+                  setOpen(false);
+                },
+                children: [
+                  /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1", children: option.label }),
+                  active ? /* @__PURE__ */ jsx(Icon, { name: "ph:check", className: "shrink-0" }) : null
+                ]
+              },
+              option.value
+            );
+          })
+        }
+      )
+    ] })
+  ] });
+}
+export {
+  ACCEPT_OPTIONS,
+  AcceptPicker,
+  VIEW_OPTIONS
+};
+//# sourceMappingURL=AcceptPicker.js.map

package/dist/rpc/AcceptPicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AcceptPicker.js","sources":["../../src/rpc/AcceptPicker.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { Button } from \"../components/button\";\nimport { Icon } from \"../data/Icon\";\nimport { cn } from \"../lib/utils\";\n\nexport const ACCEPT_OPTIONS = [\n  { value: \"application/json\", label: \"JSON\" },\n  { value: \"application/clicky+json\", label: \"Clicky\" },\n  { value: \"text/markdown\", label: \"Markdown\" },\n  { value: \"text/html\", label: \"HTML\" },\n  { value: \"application/x-yaml\", label: \"YAML\" },\n  { value: \"text/csv\", label: \"CSV\" },\n  { value: \"application/pdf\", label: \"PDF\" },\n  { value: \"text/plain\", label: \"Pretty\" },\n] as const;\n\nexport const VIEW_OPTIONS = [\n  { value: \"application/json\", label: \"JSON\" },\n  { value: \"application/clicky+json\", label: \"Clicky\" },\n  { value: \"application/pdf\", label: \"PDF\" },\n] as const;\n\nexport type AcceptOption = { value: string; label: string };\nexport type AcceptValue = (typeof ACCEPT_OPTIONS)[number][\"value\"];\nexport type OperationPreviewMode = \"hidden\" | \"curl\" | \"cli\";\n\nexport type AcceptPickerProps = {\n  value: string;\n  onChange: (value: string) => void;\n  size?: \"sm\" | \"md\";\n  options?: readonly AcceptOption[];\n  previewMode?: OperationPreviewMode;\n  onPreviewModeChange?: (mode: OperationPreviewMode) => void;\n  className?: string;\n};\n\nconst PREVIEW_OPTIONS: Array<{ value: OperationPreviewMode; label: string }> = [\n  { value: \"curl\", label: \"Show cURL preview\" },\n  { value: \"cli\", label: \"Show CLI preview\" },\n  { value: \"hidden\", label: \"Hide preview\" },\n];\n\nexport function AcceptPicker({\n  value,\n  onChange,\n  size = \"md\",\n  options = ACCEPT_OPTIONS,\n  previewMode = \"hidden\",\n  onPreviewModeChange,\n  className,\n}: AcceptPickerProps) {\n  const rootRef = useRef<HTMLDivElement>(null);\n  const [open, setOpen] = useState(false);\n  const pad = size === \"sm\" ? \"px-2 py-0.5\" : \"px-2.5 py-1\";\n\n  useEffect(() => {\n    if (!open) return;\n    const onPointerDown = (event: PointerEvent) => {\n      if (!rootRef.current?.contains(event.target as Node)) {\n        setOpen(false);\n      }\n    };\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") setOpen(false);\n    };\n    document.addEventListener(\"pointerdown\", onPointerDown);\n    document.addEventListener(\"keydown\", onKeyDown);\n    return () => {\n      document.removeEventListener(\"pointerdown\", onPointerDown);\n      document.removeEventListener(\"keydown\", onKeyDown);\n    };\n  }, [open]);\n\n  return (\n    <div ref={rootRef} className={cn(\"relative flex flex-wrap gap-1\", className)}>\n      {options.map((opt) => (\n        <button\n          key={opt.value}\n          type=\"button\"\n          onClick={() => onChange(opt.value)}\n          className={cn(\n            \"rounded-md border text-xs transition-colors\",\n            pad,\n            value === opt.value\n              ? \"border-emerald-500 bg-emerald-50 font-medium text-emerald-700 dark:border-emerald-600 dark:bg-emerald-950/30 dark:text-emerald-400\"\n              : \"text-muted-foreground hover:border-foreground/20 hover:text-foreground\",\n          )}\n        >\n          {opt.label}\n        </button>\n      ))}\n      {onPreviewModeChange && (\n        <>\n          <Button\n            type=\"button\"\n            variant=\"outline\"\n            size=\"sm\"\n            aria-label=\"Open preview menu\"\n            aria-haspopup=\"menu\"\n            aria-expanded={open}\n            className={cn(\"h-auto\", pad)}\n            onClick={() => setOpen((current) => !current)}\n          >\n            <Icon name=\"codicon:ellipsis\" />\n          </Button>\n          {open && (\n            <div\n              role=\"menu\"\n              aria-label=\"Preview options\"\n              className=\"absolute right-0 top-[calc(100%+0.375rem)] z-50 min-w-[12rem] rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-lg shadow-black/5\"\n            >\n              {PREVIEW_OPTIONS.map((option) => {\n                const active = option.value === previewMode;\n                return (\n                  <button\n                    key={option.value}\n                    type=\"button\"\n                    role=\"menuitemradio\"\n                    aria-checked={active}\n                    className={cn(\n                      \"flex w-full items-center gap-2 rounded-sm px-2 py-1.5 text-left text-sm transition-colors\",\n                      \"hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none\",\n                    )}\n                    onClick={() => {\n                      onPreviewModeChange(option.value);\n                      setOpen(false);\n                    }}\n                  >\n                    <span className=\"min-w-0 flex-1\">{option.label}</span>\n                    {active ? <Icon name=\"ph:check\" className=\"shrink-0\" /> : null}\n                  </button>\n                );\n              })}\n            </div>\n          )}\n        </>\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/rpc/ApiExplorer.d.ts

@@ -0,0 +1,11 @@
+import { CSSProperties } from 'react';
+import { AnyApiReferenceConfiguration } from '@scalar/api-reference-react';
+export declare const DEFAULT_OPENAPI_URL = "/api/openapi.json";
+export type ApiExplorerProps = {
+    openApiUrl?: string;
+    configuration?: AnyApiReferenceConfiguration;
+    className?: string;
+    style?: CSSProperties;
+};
+export declare function ApiExplorer({ openApiUrl, configuration, className, style, }: ApiExplorerProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ApiExplorer.d.ts.map

package/dist/rpc/ApiExplorer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApiExplorer.d.ts","sourceRoot":"","sources":["../../src/rpc/ApiExplorer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA2B,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AACpE,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,6BAA6B,CAAC;AAGhF,eAAO,MAAM,mBAAmB,sBAAsB,CAAC;AAQvD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,4BAA4B,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAC1B,UAAgC,EAChC,aAAa,EACb,SAAS,EACT,KAAK,GACN,EAAE,gBAAgB,2CAoBlB"}

package/dist/rpc/ApiExplorer.js

@@ -0,0 +1,37 @@
+import { jsx } from "react/jsx-runtime";
+import { useMemo, Suspense, lazy } from "react";
+import { cn } from "../lib/utils.js";
+const DEFAULT_OPENAPI_URL = "/api/openapi.json";
+const ScalarApiReference = lazy(async () => {
+  await import("@scalar/api-reference-react/style.css");
+  const mod = await import("@scalar/api-reference-react");
+  return { default: mod.ApiReferenceReact };
+});
+function ApiExplorer({
+  openApiUrl = DEFAULT_OPENAPI_URL,
+  configuration,
+  className,
+  style
+}) {
+  const scalarConfiguration = useMemo(() => {
+    if (configuration == null) {
+      return { url: openApiUrl };
+    }
+    if (Array.isArray(configuration)) {
+      return configuration;
+    }
+    return { url: openApiUrl, ...configuration };
+  }, [configuration, openApiUrl]);
+  return /* @__PURE__ */ jsx("div", { className: cn("h-full min-h-0 overflow-auto", className), style, children: /* @__PURE__ */ jsx(
+    Suspense,
+    {
+      fallback: /* @__PURE__ */ jsx("div", { className: "p-4 text-sm text-muted-foreground", children: "Loading API explorer..." }),
+      children: /* @__PURE__ */ jsx(ScalarApiReference, { configuration: scalarConfiguration })
+    }
+  ) });
+}
+export {
+  ApiExplorer,
+  DEFAULT_OPENAPI_URL
+};
+//# sourceMappingURL=ApiExplorer.js.map

package/dist/rpc/ApiExplorer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApiExplorer.js","sources":["../../src/rpc/ApiExplorer.tsx"],"sourcesContent":["import { lazy, Suspense, useMemo, type CSSProperties } from \"react\";\nimport type { AnyApiReferenceConfiguration } from \"@scalar/api-reference-react\";\nimport { cn } from \"../lib/utils\";\n\nexport const DEFAULT_OPENAPI_URL = \"/api/openapi.json\";\n\nconst ScalarApiReference = lazy(async () => {\n  await import(\"@scalar/api-reference-react/style.css\");\n  const mod = await import(\"@scalar/api-reference-react\");\n  return { default: mod.ApiReferenceReact };\n});\n\nexport type ApiExplorerProps = {\n  openApiUrl?: string;\n  configuration?: AnyApiReferenceConfiguration;\n  className?: string;\n  style?: CSSProperties;\n};\n\nexport function ApiExplorer({\n  openApiUrl = DEFAULT_OPENAPI_URL,\n  configuration,\n  className,\n  style,\n}: ApiExplorerProps) {\n  const scalarConfiguration = useMemo<AnyApiReferenceConfiguration>(() => {\n    if (configuration == null) {\n      return { url: openApiUrl };\n    }\n    if (Array.isArray(configuration)) {\n      return configuration;\n    }\n    return { url: openApiUrl, ...configuration };\n  }, [configuration, openApiUrl]);\n\n  return (\n    <div className={cn(\"h-full min-h-0 overflow-auto\", className)} style={style}>\n      <Suspense\n        fallback={<div className=\"p-4 text-sm text-muted-foreground\">Loading API explorer...</div>}\n      >\n        <ScalarApiReference configuration={scalarConfiguration} />\n      </Suspense>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;AAIO,MAAM,sBAAsB;AAEnC,MAAM,qBAAqB,KAAK,YAAY;AAC1C,QAAM,OAAO,uCAAuC;AACpD,QAAM,MAAM,MAAM,OAAO,6BAA6B;AACtD,SAAO,EAAE,SAAS,IAAI,kBAAA;AACxB,CAAC;AASM,SAAS,YAAY;AAAA,EAC1B,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AACF,GAAqB;AACnB,QAAM,sBAAsB,QAAsC,MAAM;AACtE,QAAI,iBAAiB,MAAM;AACzB,aAAO,EAAE,KAAK,WAAA;AAAA,IAChB;AACA,QAAI,MAAM,QAAQ,aAAa,GAAG;AAChC,aAAO;AAAA,IACT;AACA,WAAO,EAAE,KAAK,YAAY,GAAG,cAAA;AAAA,EAC/B,GAAG,CAAC,eAAe,UAAU,CAAC;AAE9B,6BACG,OAAA,EAAI,WAAW,GAAG,gCAAgC,SAAS,GAAG,OAC7D,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,UAAU,oBAAC,OAAA,EAAI,WAAU,qCAAoC,UAAA,2BAAuB;AAAA,MAEpF,UAAA,oBAAC,oBAAA,EAAmB,eAAe,oBAAA,CAAqB;AAAA,IAAA;AAAA,EAAA,GAE5D;AAEJ;"}

package/dist/rpc/CommandForm.d.ts

@@ -0,0 +1,15 @@
+import { OpenAPIParameter } from './types';
+export type CommandFormProps = {
+    parameters: OpenAPIParameter[];
+    onExecute: (params: Record<string, string>, headers: Record<string, string>) => void;
+    isPending: boolean;
+    method: string;
+    path: string;
+    accept: string;
+    initialValues?: Record<string, string>;
+};
+export declare function CommandForm({ parameters, onExecute, isPending, method: _method, path, accept, initialValues, }: CommandFormProps): import("react/jsx-runtime").JSX.Element;
+export declare function normalizeParameters(parameters: OpenAPIParameter[], path: string): OpenAPIParameter[];
+export declare function pathParamNames(path: string): string[];
+export declare function submitValue(param: OpenAPIParameter, value: string | undefined): string | null;
+//# sourceMappingURL=CommandForm.d.ts.map

package/dist/rpc/CommandForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CommandForm.d.ts","sourceRoot":"","sources":["../../src/rpc/CommandForm.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAqB,KAAK,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAEnE,MAAM,MAAM,gBAAgB,GAAG;IAC7B,UAAU,EAAE,gBAAgB,EAAE,CAAC;IAC/B,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IACrF,SAAS,EAAE,OAAO,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CACxC,CAAC;AASF,wBAAgB,WAAW,CAAC,EAC1B,UAAU,EACV,SAAS,EACT,SAAS,EACT,MAAM,EAAE,OAAO,EACf,IAAI,EACJ,MAAM,EACN,aAAa,GACd,EAAE,gBAAgB,2CA2DlB;AA2OD,wBAAgB,mBAAmB,CACjC,UAAU,EAAE,gBAAgB,EAAE,EAC9B,IAAI,EAAE,MAAM,GACX,gBAAgB,EAAE,CAkBpB;AAED,wBAAgB,cAAc,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,EAAE,CAIrD;AAiCD,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,GAAG,MAAM,GAAG,IAAI,CAK7F"}