@alexgorbatchev/shadcn 0.0.12 → 0.0.16

package/dist/chunk-qxt0fx4f.js

@@ -0,0 +1,93 @@
+import {
+  getStrokeColor
+} from "./chunk-2ewx9qdn.js";
+import {
+  useContextDisplay
+} from "./chunk-f3f76m3p.js";
+import {
+  ShareMeter2
+} from "./chunk-mammcx1w.js";
+import {
+  formatTokenCount
+} from "./chunk-nzas8r5v.js";
+
+// src/components/assistant-ui/elements/ContextDisplayValue.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function ContextDisplayValue2({ variant }) {
+  const { percent, totalTokens, modelContextWindow } = useContextDisplay();
+  if (variant === "text")
+    return /* @__PURE__ */ jsxs("span", {
+      "data-testid": "ContextDisplayValue",
+      className: "font-mono tabular-nums",
+      children: [
+        formatTokenCount(totalTokens),
+        " / ",
+        formatTokenCount(modelContextWindow)
+      ]
+    });
+  if (variant === "bar")
+    return /* @__PURE__ */ jsxs("span", {
+      "data-testid": "ContextDisplayValue",
+      className: "flex items-center gap-1.5",
+      children: [
+        /* @__PURE__ */ jsx(ShareMeter2, {
+          label: "Context window used",
+          percentage: percent,
+          size: "compact"
+        }),
+        /* @__PURE__ */ jsxs("span", {
+          className: "tabular-nums",
+          children: [
+            formatTokenCount(totalTokens),
+            " (",
+            Math.round(percent),
+            "%)"
+          ]
+        })
+      ]
+    });
+  return /* @__PURE__ */ jsxs("span", {
+    "data-testid": "ContextDisplayValue",
+    className: "flex items-center gap-1.5",
+    children: [
+      /* @__PURE__ */ jsxs("svg", {
+        "aria-hidden": "true",
+        width: 18,
+        height: 18,
+        viewBox: "0 0 18 18",
+        className: "-rotate-90",
+        children: [
+          /* @__PURE__ */ jsx("circle", {
+            cx: 9,
+            cy: 9,
+            r: 7.75,
+            fill: "none",
+            strokeWidth: 2.5,
+            className: "stroke-border"
+          }),
+          /* @__PURE__ */ jsx("circle", {
+            cx: 9,
+            cy: 9,
+            r: 7.75,
+            pathLength: 100,
+            fill: "none",
+            strokeWidth: 2.5,
+            strokeLinecap: "round",
+            strokeDasharray: 100,
+            strokeDashoffset: 100 - percent,
+            className: getStrokeColor(percent)
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsxs("span", {
+        className: "font-mono tabular-nums",
+        children: [
+          Math.round(percent),
+          "%"
+        ]
+      })
+    ]
+  });
+}
+
+export { ContextDisplayValue2 };

package/dist/chunk-r07v9c4f.js

@@ -0,0 +1,65 @@
+import {
+  useModelSelectorContext
+} from "./chunk-ydfx8r6d.js";
+
+// src/components/assistant-ui/elements/ModelSelectorEffort.tsx
+import { RadioGroup } from "@base-ui/react/radio-group";
+import { Radio } from "@base-ui/react/radio";
+
+// src/components/assistant-ui/hooks/useModelSelectorEfforts.ts
+function useModelSelectorEfforts() {
+  const { efforts, effort, setEffort } = useModelSelectorContext();
+  return { efforts, effort, setEffort };
+}
+
+// src/components/assistant-ui/elements/ModelSelectorEffort.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function ModelSelectorEffort2({
+  label = "Thinking",
+  onKeyDown,
+  ...props
+}) {
+  const { efforts, effort, setEffort } = useModelSelectorEfforts();
+  if (!efforts?.length)
+    return null;
+  return /* @__PURE__ */ jsxs("div", {
+    ...props,
+    "data-testid": "ModelSelectorEffort",
+    "data-slot": "model-selector-effort",
+    className: "flex items-center justify-between gap-2 border-t border-frame-edge px-2 py-1.5",
+    onKeyDown: (event) => {
+      onKeyDown?.(event);
+      if (event.defaultPrevented)
+        return;
+      if (event.key === "Home" || event.key === "End")
+        event.stopPropagation();
+      if (event.key === "ArrowUp" || event.key === "ArrowDown")
+        event.currentTarget.closest("[cmdk-root]")?.querySelector("[cmdk-input]")?.focus();
+    },
+    children: [
+      /* @__PURE__ */ jsx("span", {
+        className: "text-sm text-muted-foreground",
+        children: label
+      }),
+      /* @__PURE__ */ jsx(RadioGroup, {
+        value: effort ?? "",
+        onValueChange: setEffort,
+        "aria-label": typeof label === "string" ? label : "Reasoning effort",
+        render: /* @__PURE__ */ jsx("div", {
+          className: "flex items-center gap-0.5"
+        }),
+        children: efforts.map((option) => /* @__PURE__ */ jsx(Radio.Root, {
+          value: option.id,
+          nativeButton: true,
+          render: /* @__PURE__ */ jsx("button", {
+            type: "button",
+            className: "h-control-sm rounded-sm px-control-x text-sm text-muted-foreground outline-none hover:bg-muted hover:text-foreground focus-visible:ring-1 focus-visible:ring-ring data-checked:bg-accent data-checked:font-medium data-checked:text-accent-foreground"
+          }),
+          children: option.name
+        }, option.id))
+      })
+    ]
+  });
+}
+
+export { ModelSelectorEffort2 };

package/dist/chunk-r6p7982y.js

@@ -0,0 +1,64 @@
+// src/components/assistant-ui/native/ComposerQuotePreview.tsx
+import { memo } from "react";
+import { ComposerPrimitive } from "@assistant-ui/react";
+import { QuoteIcon, XIcon } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function ComposerQuotePreviewRoot2(props) {
+  return /* @__PURE__ */ jsx(ComposerPrimitive.Quote, {
+    "data-slot": "composer-quote",
+    ...props,
+    render: /* @__PURE__ */ jsx("div", {
+      "data-testid": "ComposerQuotePreviewRoot",
+      className: "bg-secondary mx-1 mt-1 flex items-start gap-1 rounded-sm px-2 py-1"
+    })
+  });
+}
+function ComposerQuotePreviewIcon2() {
+  return /* @__PURE__ */ jsx(QuoteIcon, {
+    "aria-hidden": "true",
+    className: "size-3.5 shrink-0 text-muted-foreground"
+  });
+}
+function ComposerQuotePreviewText2(props) {
+  return /* @__PURE__ */ jsx(ComposerPrimitive.QuoteText, {
+    "data-slot": "composer-quote-text",
+    ...props,
+    render: /* @__PURE__ */ jsx("span", {
+      "data-testid": "ComposerQuotePreviewText",
+      className: "text-muted-foreground line-clamp-2 min-w-0 flex-1 text-sm"
+    })
+  });
+}
+function ComposerQuotePreviewDismiss2({ children, ...props }) {
+  return /* @__PURE__ */ jsx(ComposerPrimitive.QuoteDismiss, {
+    "data-slot": "composer-quote-dismiss",
+    ...props,
+    render: /* @__PURE__ */ jsx("button", {
+      type: "button",
+      "aria-label": "Dismiss quote",
+      "data-testid": "ComposerQuotePreviewDismiss",
+      className: "shrink-0 rounded-sm p-0.5 text-muted-foreground transition-colors hover:bg-accent hover:text-foreground"
+    }),
+    children: children ?? /* @__PURE__ */ jsx(XIcon, {
+      "aria-hidden": "true",
+      className: "size-3.5 shrink-0"
+    })
+  });
+}
+var ComposerQuotePreview2 = Object.assign(memo(function ComposerQuotePreview(props) {
+  return /* @__PURE__ */ jsxs(ComposerQuotePreviewRoot2, {
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx(ComposerQuotePreviewIcon2, {}),
+      /* @__PURE__ */ jsx(ComposerQuotePreviewText2, {}),
+      /* @__PURE__ */ jsx(ComposerQuotePreviewDismiss2, {})
+    ]
+  });
+}), {
+  Root: ComposerQuotePreviewRoot2,
+  Icon: ComposerQuotePreviewIcon2,
+  Text: ComposerQuotePreviewText2,
+  Dismiss: ComposerQuotePreviewDismiss2
+});
+
+export { ComposerQuotePreviewRoot2, ComposerQuotePreviewIcon2, ComposerQuotePreviewText2, ComposerQuotePreviewDismiss2, ComposerQuotePreview2 };

package/dist/chunk-r7fy89jq.js

@@ -0,0 +1,33 @@
+import {
+  ContextDisplayRoot2
+} from "./chunk-2gten6a1.js";
+import {
+  ContextDisplayTrigger2
+} from "./chunk-86211e5a.js";
+import {
+  ContextDisplayContent2
+} from "./chunk-2b9agdrf.js";
+import {
+  ContextDisplayValue2
+} from "./chunk-qxt0fx4f.js";
+
+// src/components/assistant-ui/native/ContextDisplayText.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function ContextDisplayText3({ side, ...props }) {
+  return /* @__PURE__ */ jsxs(ContextDisplayRoot2, {
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx(ContextDisplayTrigger2, {
+        "aria-label": "Context usage",
+        children: /* @__PURE__ */ jsx(ContextDisplayValue2, {
+          variant: "text"
+        })
+      }),
+      /* @__PURE__ */ jsx(ContextDisplayContent2, {
+        side
+      })
+    ]
+  });
+}
+
+export { ContextDisplayText3 };

package/dist/chunk-r9mng3ws.js

@@ -0,0 +1,27 @@
+import {
+  Resizable2,
+  ResizablePanel2,
+  ResizableHandle2
+} from "./chunk-1x2ch0xc.js";
+import {
+  Thread2
+} from "./chunk-5ntb7p4q.js";
+
+// src/components/assistant-ui/native/AssistantSidebar.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function AssistantSidebar2({ children }) {
+  return /* @__PURE__ */ jsxs(Resizable2, {
+    orientation: "horizontal",
+    children: [
+      /* @__PURE__ */ jsx(ResizablePanel2, {
+        children
+      }),
+      /* @__PURE__ */ jsx(ResizableHandle2, {}),
+      /* @__PURE__ */ jsx(ResizablePanel2, {
+        children: /* @__PURE__ */ jsx(Thread2, {})
+      })
+    ]
+  });
+}
+
+export { AssistantSidebar2 };

package/dist/chunk-rc9kpszb.js

@@ -0,0 +1,144 @@
+import {
+  cn2
+} from "./chunk-cp2m7y7v.js";
+import {
+  Button2
+} from "./chunk-73rkr9ct.js";
+import {
+  clamp
+} from "./chunk-v8ks0cfq.js";
+import {
+  paper,
+  mono
+} from "./chunk-fgmcbtyt.js";
+
+// src/components/assistant-ui/elements/VoiceConversation.tsx
+import { MicIcon, MicOffIcon, PhoneOffIcon } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var CAPTION = {
+  connecting: "Connecting",
+  listening: "Listening",
+  thinking: "Thinking",
+  speaking: "Speaking"
+};
+var HINT = {
+  connecting: "Opening the mic",
+  listening: "Listening for you",
+  thinking: "Working on it",
+  speaking: "Playing the reply"
+};
+function VoiceConversation3({
+  mode,
+  amplitude,
+  transcript,
+  muted,
+  onToggleMute,
+  onInterrupt,
+  onEnd,
+  className,
+  ...props
+}) {
+  const level = clamp(amplitude, 0, 1);
+  const active = mode === "listening" || mode === "speaking";
+  const canInterrupt = mode === "speaking" && onInterrupt !== undefined;
+  return /* @__PURE__ */ jsxs("div", {
+    "data-testid": "VoiceConversation",
+    "data-slot": "voice-conversation",
+    className: cn2(cn2(paper, "flex w-full max-w-xs flex-col items-center gap-4 rounded-md px-5 py-5"), className),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsxs("button", {
+        type: "button",
+        onClick: onInterrupt,
+        disabled: !canInterrupt,
+        "aria-label": "Interrupt the assistant",
+        className: "relative flex size-24 items-center justify-center rounded-full outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-default",
+        children: [
+          /* @__PURE__ */ jsx("span", {
+            "aria-hidden": true,
+            className: cn2("absolute size-24 rounded-full transition-[transform,opacity] duration-200 ease-out motion-reduce:transition-none", mode === "speaking" ? "bg-primary/12 bg-primary/15" : "bg-foreground/[0.05]"),
+            style: {
+              transform: `scale(${active ? 0.72 + level * 0.28 : 0.62})`,
+              opacity: active ? 1 : 0.5
+            }
+          }),
+          /* @__PURE__ */ jsx("span", {
+            "aria-hidden": true,
+            className: cn2("absolute size-[68px] rounded-full transition-[transform,opacity] duration-150 ease-out motion-reduce:transition-none", mode === "speaking" ? "bg-primary/20 bg-primary/25" : "bg-foreground/[0.08]"),
+            style: {
+              transform: `scale(${active ? 0.8 + level * 0.22 : 0.7})`
+            }
+          }),
+          /* @__PURE__ */ jsx("span", {
+            "aria-hidden": true,
+            className: cn2("relative size-10 rounded-full transition-[transform,background-color] duration-150 ease-out motion-reduce:transition-none", mode === "connecting" && "bg-foreground/20 animate-pulse", mode === "listening" && "bg-foreground/80", mode === "thinking" && "bg-foreground/30 animate-pulse", mode === "speaking" && "bg-primary bg-primary"),
+            style: { transform: `scale(${active ? 0.9 + level * 0.2 : 0.85})` }
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsxs("div", {
+        className: "flex flex-col items-center gap-1",
+        children: [
+          /* @__PURE__ */ jsx("span", {
+            className: "text-base font-medium",
+            children: CAPTION[mode]
+          }),
+          /* @__PURE__ */ jsx("span", {
+            className: cn2(mono, "text-muted-foreground"),
+            children: muted ? "Mic off" : canInterrupt ? "Tap to interrupt" : HINT[mode]
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsx("div", {
+        className: "flex min-h-[72px] w-full flex-col gap-1.5",
+        children: transcript.map((turn) => /* @__PURE__ */ jsxs("div", {
+          className: "fade-in slide-in-from-bottom-1 animate-in fill-mode-both flex gap-2 text-sm leading-relaxed duration-300",
+          children: [
+            /* @__PURE__ */ jsx("span", {
+              className: cn2(mono, "w-8 shrink-0", turn.role === "user" ? "text-muted-foreground" : "text-primary text-primary"),
+              children: turn.role === "user" ? "you" : "ai"
+            }),
+            /* @__PURE__ */ jsx("span", {
+              className: cn2("min-w-0 flex-1 break-words", turn.role === "user" ? "text-muted-foreground" : "text-foreground"),
+              children: turn.text
+            })
+          ]
+        }, turn.id))
+      }),
+      /* @__PURE__ */ jsxs("div", {
+        className: "flex items-center gap-2",
+        children: [
+          /* @__PURE__ */ jsx(Button2, {
+            type: "button",
+            "aria-label": muted ? "Turn the microphone on" : "Turn the microphone off",
+            "aria-pressed": muted,
+            onClick: onToggleMute,
+            disabled: !onToggleMute,
+            variant: "ghost",
+            children: muted ? /* @__PURE__ */ jsx(MicOffIcon, {
+              "aria-hidden": "true",
+              "data-icon": "inline-start"
+            }) : /* @__PURE__ */ jsx(MicIcon, {
+              "aria-hidden": "true",
+              "data-icon": "inline-start"
+            })
+          }),
+          /* @__PURE__ */ jsx(Button2, {
+            type: "button",
+            "aria-label": "End the call",
+            onClick: onEnd,
+            disabled: !onEnd,
+            variant: "ghost",
+            size: "icon",
+            children: /* @__PURE__ */ jsx(PhoneOffIcon, {
+              "aria-hidden": "true",
+              "data-icon": "inline-start"
+            })
+          })
+        ]
+      })
+    ]
+  });
+}
+
+export { VoiceConversation3 };

package/dist/chunk-rrd9fsz6.js

@@ -0,0 +1,68 @@
+import {
+  PopoverContent2,
+  PopoverTitle2
+} from "./chunk-x7z9jzyf.js";
+import {
+  Command2
+} from "./chunk-4gby2v61.js";
+import {
+  useModelSelectorContext
+} from "./chunk-ydfx8r6d.js";
+import {
+  ModelSelectorFocusAnchor2
+} from "./chunk-1hbge1cb.js";
+import {
+  ModelSelectorSearch2
+} from "./chunk-hhvp5352.js";
+import {
+  ModelSelectorList2
+} from "./chunk-jxwfkmdh.js";
+import {
+  ModelSelectorEffort2
+} from "./chunk-r07v9c4f.js";
+
+// src/components/assistant-ui/elements/ModelSelectorContent.tsx
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+function ModelSelectorContent2({
+  align = "start",
+  side = "bottom",
+  sideOffset = 6,
+  searchable,
+  children,
+  ...props
+}) {
+  const { value } = useModelSelectorContext();
+  const isUnfiltered = searchable === false || !searchable && children === undefined;
+  return /* @__PURE__ */ jsxs(PopoverContent2, {
+    ...props,
+    "data-slot": "model-selector-content",
+    align,
+    side,
+    sideOffset,
+    children: [
+      /* @__PURE__ */ jsx("div", {
+        className: "sr-only",
+        children: /* @__PURE__ */ jsx(PopoverTitle2, {
+          children: "Choose model"
+        })
+      }),
+      /* @__PURE__ */ jsxs(Command2, {
+        label: "Model",
+        shouldFilter: !isUnfiltered,
+        defaultValue: value,
+        children: [
+          isUnfiltered && /* @__PURE__ */ jsx(ModelSelectorFocusAnchor2, {}),
+          children ?? /* @__PURE__ */ jsxs(Fragment, {
+            children: [
+              searchable && /* @__PURE__ */ jsx(ModelSelectorSearch2, {}),
+              /* @__PURE__ */ jsx(ModelSelectorList2, {}),
+              /* @__PURE__ */ jsx(ModelSelectorEffort2, {})
+            ]
+          })
+        ]
+      })
+    ]
+  });
+}
+
+export { ModelSelectorContent2 };

package/dist/chunk-ryvvtyjq.js

@@ -0,0 +1,117 @@
+import {
+  cn2
+} from "./chunk-cp2m7y7v.js";
+import {
+  Button2
+} from "./chunk-73rkr9ct.js";
+import {
+  useReceiptFocus
+} from "./chunk-vxvaaptq.js";
+import {
+  paper,
+  field,
+  mono
+} from "./chunk-fgmcbtyt.js";
+
+// src/components/assistant-ui/elements/PermissionGrant.tsx
+import { KeyRoundIcon } from "lucide-react";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+function PermissionGrant2({
+  capability,
+  requester,
+  reach,
+  scope,
+  onGrant,
+  className,
+  ...props
+}) {
+  const { receiptRef, focusHandlers } = useReceiptFocus(props);
+  return /* @__PURE__ */ jsxs("div", {
+    "data-testid": "PermissionGrant",
+    "data-slot": "permission-grant",
+    className: cn2(cn2(paper, "flex w-full max-w-sm flex-col gap-3.5 rounded-md p-4"), className),
+    ...props,
+    ...focusHandlers,
+    children: [
+      /* @__PURE__ */ jsxs("div", {
+        className: "flex items-center gap-2.5",
+        children: [
+          /* @__PURE__ */ jsx(KeyRoundIcon, {
+            "aria-hidden": "true",
+            className: cn2("size-4")
+          }),
+          /* @__PURE__ */ jsxs("div", {
+            className: "flex min-w-0 flex-1 flex-col",
+            children: [
+              /* @__PURE__ */ jsx("span", {
+                className: "truncate text-base font-medium",
+                children: capability
+              }),
+              /* @__PURE__ */ jsxs("span", {
+                className: "text-muted-foreground truncate text-sm",
+                children: [
+                  "requested by ",
+                  requester
+                ]
+              })
+            ]
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsxs("div", {
+        className: "flex flex-col gap-1",
+        children: [
+          /* @__PURE__ */ jsx("span", {
+            className: cn2(mono, "text-muted-foreground"),
+            children: "this grants"
+          }),
+          reach.map((item) => /* @__PURE__ */ jsxs("span", {
+            className: "text-muted-foreground flex items-baseline gap-2 text-sm",
+            children: [
+              /* @__PURE__ */ jsx("span", {
+                "aria-hidden": true,
+                className: "bg-foreground/20 size-1 rounded-full"
+              }),
+              item
+            ]
+          }, item))
+        ]
+      }),
+      /* @__PURE__ */ jsx("div", {
+        className: "flex h-8 items-center justify-end gap-2",
+        children: scope === "pending" ? onGrant ? /* @__PURE__ */ jsxs(Fragment, {
+          children: [
+            /* @__PURE__ */ jsx(Button2, {
+              type: "button",
+              onClick: () => onGrant("denied"),
+              variant: "ghost",
+              children: "Deny"
+            }),
+            /* @__PURE__ */ jsx(Button2, {
+              type: "button",
+              onClick: () => onGrant("session"),
+              variant: "ghost",
+              children: "This session"
+            }),
+            /* @__PURE__ */ jsx(Button2, {
+              type: "button",
+              onClick: () => onGrant("always"),
+              variant: "default",
+              children: "Always"
+            })
+          ]
+        }) : /* @__PURE__ */ jsx("span", {
+          className: cn2(field, mono, "fade-in animate-in text-muted-foreground rounded-full px-2.5 py-1.5 duration-300"),
+          children: "pending"
+        }, scope) : /* @__PURE__ */ jsx("span", {
+          ref: receiptRef,
+          tabIndex: -1,
+          className: cn2(field, mono, "fade-in animate-in text-muted-foreground rounded-full px-2.5 py-1.5 duration-300"),
+          children: scope === "denied" ? "denied" : `granted · ${scope}`
+        }, scope)
+      })
+    ]
+  });
+}
+
+export { PermissionGrant2 };