@tightknitai/block-kitchen 0.9.8 → 0.9.9

package/dist/index.js

@@ -2610,6 +2610,38 @@ function unwrapBlocksInput(parsed) {
   }
   return null;
 }
+var buttonVariants = cva(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
+        destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
+        outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
+        secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground",
+        link: "text-primary underline-offset-4 hover:underline"
+      },
+      size: {
+        default: "h-9 px-4 py-2",
+        sm: "h-8 rounded-md px-3 text-xs",
+        lg: "h-10 rounded-md px-8",
+        icon: "h-9 w-9"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+var Button = React.forwardRef(
+  ({ className, variant, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    return /* @__PURE__ */ jsx(Comp, { className: cn(buttonVariants({ variant, size, className })), ref, ...props });
+  }
+);
+Button.displayName = "Button";
 var MAX_JSON_BYTES = 1024 * 1024;
 function JsonDrawer({
   open,
@@ -2621,19 +2653,23 @@ function JsonDrawer({
   const [parseError, setParseError] = useState(null);
   const [validationErrors, setValidationErrors] = useState([]);
   const [copied, setCopied] = useState(false);
+  const [accepted, setAccepted] = useState(false);
   const textareaRef = useRef(null);
   const gutterRef = useRef(null);
   const copyResetRef = useRef(null);
+  const acceptResetRef = useRef(null);
   const blocksRef = useRef(blocks);
   useEffect(() => {
     blocksRef.current = blocks;
   });
   useEffect(() => {
     if (open) {
-      setValue(JSON.stringify(blocksRef.current, null, 2));
+      const current = blocksRef.current;
+      setValue(current.length === 0 ? "" : JSON.stringify(current, null, 2));
       setParseError(null);
       setValidationErrors([]);
       setCopied(false);
+      setAccepted(false);
     }
   }, [open]);
   useEffect(
@@ -2641,6 +2677,9 @@ function JsonDrawer({
       if (copyResetRef.current) {
         clearTimeout(copyResetRef.current);
       }
+      if (acceptResetRef.current) {
+        clearTimeout(acceptResetRef.current);
+      }
     },
     []
   );
@@ -2661,6 +2700,17 @@ function JsonDrawer({
       setValidationErrors([]);
       return;
     }
+    if (next.trim() === "") {
+      setParseError(null);
+      setValidationErrors([]);
+      onApply([]);
+      setAccepted(true);
+      if (acceptResetRef.current) {
+        clearTimeout(acceptResetRef.current);
+      }
+      acceptResetRef.current = setTimeout(() => setAccepted(false), 1800);
+      return;
+    }
     let parsed;
     try {
       parsed = JSON.parse(next);
@@ -2677,6 +2727,11 @@ function JsonDrawer({
     }
     setParseError(null);
     onApply(blocks2);
+    setAccepted(true);
+    if (acceptResetRef.current) {
+      clearTimeout(acceptResetRef.current);
+    }
+    acceptResetRef.current = setTimeout(() => setAccepted(false), 1800);
     const result = validateBlockKit(blocks2, {
       target: "blocks",
       surface: "message"
@@ -2701,16 +2756,30 @@ function JsonDrawer({
       /* @__PURE__ */ jsx(SheetDescription, { children: "Edits update the preview as you type. Parse errors show below." })
     ] }),
     /* @__PURE__ */ jsxs("div", { className: "relative flex flex-1 overflow-hidden rounded-md border border-input bg-muted/30 shadow-sm focus-within:ring-1 focus-within:ring-ring", children: [
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          onClick: handleCopy,
-          "aria-label": copied ? "Copied to clipboard" : "Copy JSON",
-          className: "absolute right-2 top-2 z-10 inline-flex items-center justify-center rounded-md border border-input bg-background/80 p-1.5 text-muted-foreground shadow-sm backdrop-blur transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
-          children: copied ? /* @__PURE__ */ jsx(Check, { className: "h-3.5 w-3.5 text-emerald-600" }) : /* @__PURE__ */ jsx(Copy, { className: "h-3.5 w-3.5" })
-        }
-      ),
+      /* @__PURE__ */ jsxs("div", { className: "absolute right-2 top-2 z-10 flex items-center gap-1.5", children: [
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            role: "status",
+            "aria-hidden": !accepted,
+            className: `pointer-events-none flex items-center justify-center rounded-md bg-background/80 p-1.5 shadow-sm backdrop-blur transition-opacity duration-300 ${accepted ? "opacity-100" : "opacity-0"}`,
+            children: [
+              /* @__PURE__ */ jsx(Check, { className: "h-3.5 w-3.5 text-emerald-600" }),
+              /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Input accepted" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: handleCopy,
+            "aria-label": copied ? "Copied to clipboard" : "Copy JSON",
+            className: "inline-flex items-center justify-center rounded-md border border-input bg-background/80 p-1.5 text-muted-foreground shadow-sm backdrop-blur transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
+            children: copied ? /* @__PURE__ */ jsx(Check, { className: "h-3.5 w-3.5 text-emerald-600" }) : /* @__PURE__ */ jsx(Copy, { className: "h-3.5 w-3.5" })
+          }
+        )
+      ] }),
       /* @__PURE__ */ jsx(
         "div",
         {
@@ -2747,41 +2816,10 @@ function JsonDrawer({
           " more"
         ] })
       ] })
-    ] })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "flex shrink-0 justify-end", children: /* @__PURE__ */ jsx(Button, { type: "button", onClick: () => onOpenChange(false), children: "Done" }) })
   ] }) });
 }
-var buttonVariants = cva(
-  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
-  {
-    variants: {
-      variant: {
-        default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
-        destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
-        outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
-        secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
-        ghost: "hover:bg-accent hover:text-accent-foreground",
-        link: "text-primary underline-offset-4 hover:underline"
-      },
-      size: {
-        default: "h-9 px-4 py-2",
-        sm: "h-8 rounded-md px-3 text-xs",
-        lg: "h-10 rounded-md px-8",
-        icon: "h-9 w-9"
-      }
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "default"
-    }
-  }
-);
-var Button = React.forwardRef(
-  ({ className, variant, size, asChild = false, ...props }, ref) => {
-    const Comp = asChild ? Slot : "button";
-    return /* @__PURE__ */ jsx(Comp, { className: cn(buttonVariants({ variant, size, className })), ref, ...props });
-  }
-);
-Button.displayName = "Button";
 var Dialog = DialogPrimitive.Root;
 var DialogPortal = DialogPrimitive.Portal;
 var DialogOverlay = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(