@tightknitai/block-kitchen 0.9.8 → 0.9.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -2640,6 +2640,38 @@ function unwrapBlocksInput(parsed) {
2640
2640
  }
2641
2641
  return null;
2642
2642
  }
2643
+ var buttonVariants = classVarianceAuthority.cva(
2644
+ "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",
2645
+ {
2646
+ variants: {
2647
+ variant: {
2648
+ default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
2649
+ destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
2650
+ outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
2651
+ secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
2652
+ ghost: "hover:bg-accent hover:text-accent-foreground",
2653
+ link: "text-primary underline-offset-4 hover:underline"
2654
+ },
2655
+ size: {
2656
+ default: "h-9 px-4 py-2",
2657
+ sm: "h-8 rounded-md px-3 text-xs",
2658
+ lg: "h-10 rounded-md px-8",
2659
+ icon: "h-9 w-9"
2660
+ }
2661
+ },
2662
+ defaultVariants: {
2663
+ variant: "default",
2664
+ size: "default"
2665
+ }
2666
+ }
2667
+ );
2668
+ var Button = React__namespace.forwardRef(
2669
+ ({ className, variant, size, asChild = false, ...props }, ref) => {
2670
+ const Comp = asChild ? reactSlot.Slot : "button";
2671
+ return /* @__PURE__ */ jsxRuntime.jsx(Comp, { className: cn(buttonVariants({ variant, size, className })), ref, ...props });
2672
+ }
2673
+ );
2674
+ Button.displayName = "Button";
2643
2675
  var MAX_JSON_BYTES = 1024 * 1024;
2644
2676
  function JsonDrawer({
2645
2677
  open,
@@ -2651,19 +2683,23 @@ function JsonDrawer({
2651
2683
  const [parseError, setParseError] = React.useState(null);
2652
2684
  const [validationErrors, setValidationErrors] = React.useState([]);
2653
2685
  const [copied, setCopied] = React.useState(false);
2686
+ const [accepted, setAccepted] = React.useState(false);
2654
2687
  const textareaRef = React.useRef(null);
2655
2688
  const gutterRef = React.useRef(null);
2656
2689
  const copyResetRef = React.useRef(null);
2690
+ const acceptResetRef = React.useRef(null);
2657
2691
  const blocksRef = React.useRef(blocks);
2658
2692
  React.useEffect(() => {
2659
2693
  blocksRef.current = blocks;
2660
2694
  });
2661
2695
  React.useEffect(() => {
2662
2696
  if (open) {
2663
- setValue(JSON.stringify(blocksRef.current, null, 2));
2697
+ const current = blocksRef.current;
2698
+ setValue(current.length === 0 ? "" : JSON.stringify(current, null, 2));
2664
2699
  setParseError(null);
2665
2700
  setValidationErrors([]);
2666
2701
  setCopied(false);
2702
+ setAccepted(false);
2667
2703
  }
2668
2704
  }, [open]);
2669
2705
  React.useEffect(
@@ -2671,6 +2707,9 @@ function JsonDrawer({
2671
2707
  if (copyResetRef.current) {
2672
2708
  clearTimeout(copyResetRef.current);
2673
2709
  }
2710
+ if (acceptResetRef.current) {
2711
+ clearTimeout(acceptResetRef.current);
2712
+ }
2674
2713
  },
2675
2714
  []
2676
2715
  );
@@ -2691,6 +2730,17 @@ function JsonDrawer({
2691
2730
  setValidationErrors([]);
2692
2731
  return;
2693
2732
  }
2733
+ if (next.trim() === "") {
2734
+ setParseError(null);
2735
+ setValidationErrors([]);
2736
+ onApply([]);
2737
+ setAccepted(true);
2738
+ if (acceptResetRef.current) {
2739
+ clearTimeout(acceptResetRef.current);
2740
+ }
2741
+ acceptResetRef.current = setTimeout(() => setAccepted(false), 1800);
2742
+ return;
2743
+ }
2694
2744
  let parsed;
2695
2745
  try {
2696
2746
  parsed = JSON.parse(next);
@@ -2707,6 +2757,11 @@ function JsonDrawer({
2707
2757
  }
2708
2758
  setParseError(null);
2709
2759
  onApply(blocks2);
2760
+ setAccepted(true);
2761
+ if (acceptResetRef.current) {
2762
+ clearTimeout(acceptResetRef.current);
2763
+ }
2764
+ acceptResetRef.current = setTimeout(() => setAccepted(false), 1800);
2710
2765
  const result = slackBlockKitValidator.validateBlockKit(blocks2, {
2711
2766
  target: "blocks",
2712
2767
  surface: "message"
@@ -2731,16 +2786,30 @@ function JsonDrawer({
2731
2786
  /* @__PURE__ */ jsxRuntime.jsx(SheetDescription, { children: "Edits update the preview as you type. Parse errors show below." })
2732
2787
  ] }),
2733
2788
  /* @__PURE__ */ jsxRuntime.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: [
2734
- /* @__PURE__ */ jsxRuntime.jsx(
2735
- "button",
2736
- {
2737
- type: "button",
2738
- onClick: handleCopy,
2739
- "aria-label": copied ? "Copied to clipboard" : "Copy JSON",
2740
- 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",
2741
- children: copied ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-3.5 w-3.5 text-emerald-600" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Copy, { className: "h-3.5 w-3.5" })
2742
- }
2743
- ),
2789
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute right-2 top-2 z-10 flex items-center gap-1.5", children: [
2790
+ /* @__PURE__ */ jsxRuntime.jsxs(
2791
+ "div",
2792
+ {
2793
+ role: "status",
2794
+ "aria-hidden": !accepted,
2795
+ 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"}`,
2796
+ children: [
2797
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-3.5 w-3.5 text-emerald-600" }),
2798
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Input accepted" })
2799
+ ]
2800
+ }
2801
+ ),
2802
+ /* @__PURE__ */ jsxRuntime.jsx(
2803
+ "button",
2804
+ {
2805
+ type: "button",
2806
+ onClick: handleCopy,
2807
+ "aria-label": copied ? "Copied to clipboard" : "Copy JSON",
2808
+ 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",
2809
+ children: copied ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-3.5 w-3.5 text-emerald-600" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Copy, { className: "h-3.5 w-3.5" })
2810
+ }
2811
+ )
2812
+ ] }),
2744
2813
  /* @__PURE__ */ jsxRuntime.jsx(
2745
2814
  "div",
2746
2815
  {
@@ -2777,41 +2846,10 @@ function JsonDrawer({
2777
2846
  " more"
2778
2847
  ] })
2779
2848
  ] })
2780
- ] })
2849
+ ] }),
2850
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex shrink-0 justify-end", children: /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "button", onClick: () => onOpenChange(false), children: "Done" }) })
2781
2851
  ] }) });
2782
2852
  }
2783
- var buttonVariants = classVarianceAuthority.cva(
2784
- "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",
2785
- {
2786
- variants: {
2787
- variant: {
2788
- default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
2789
- destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
2790
- outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
2791
- secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
2792
- ghost: "hover:bg-accent hover:text-accent-foreground",
2793
- link: "text-primary underline-offset-4 hover:underline"
2794
- },
2795
- size: {
2796
- default: "h-9 px-4 py-2",
2797
- sm: "h-8 rounded-md px-3 text-xs",
2798
- lg: "h-10 rounded-md px-8",
2799
- icon: "h-9 w-9"
2800
- }
2801
- },
2802
- defaultVariants: {
2803
- variant: "default",
2804
- size: "default"
2805
- }
2806
- }
2807
- );
2808
- var Button = React__namespace.forwardRef(
2809
- ({ className, variant, size, asChild = false, ...props }, ref) => {
2810
- const Comp = asChild ? reactSlot.Slot : "button";
2811
- return /* @__PURE__ */ jsxRuntime.jsx(Comp, { className: cn(buttonVariants({ variant, size, className })), ref, ...props });
2812
- }
2813
- );
2814
- Button.displayName = "Button";
2815
2853
  var Dialog = DialogPrimitive__namespace.Root;
2816
2854
  var DialogPortal = DialogPrimitive__namespace.Portal;
2817
2855
  var DialogOverlay = React__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(