@particle-academy/react-fancy 5.9.0 → 5.11.0

package/dist/index.d.cts

@@ -980,7 +980,15 @@ interface ProgressProps {
     value?: number;
     max?: number;
     variant?: "bar" | "circular";
-    size?: "sm" | "md" | "lg";
+    /**
+     * Named scale, or an explicit pixel diameter for `variant="circular"`.
+     *
+     * The scale topped out at 64px and was written inline, so a larger ring was
+     * impossible rather than merely awkward.
+     */
+    size?: "sm" | "md" | "lg" | number;
+    /** Ring thickness in px (circular only). Derived from the diameter if unset. */
+    strokeWidth?: number;
     color?: Color;
     indeterminate?: boolean;
     showValue?: boolean;
@@ -3672,6 +3680,16 @@ type PromptAttachment = {
     id: string;
     name: string;
     bytes: number;
+    /**
+     * The file the user actually attached.
+     *
+     * Optional because an attachment restored from a server has no File — but for
+     * anything the user dropped or picked it is always present. Without it a host
+     * can render a chip and nothing else: no POST, no FormData, no send-to-model.
+     */
+    file?: File;
+    /** MIME type. Hosts branch on this to decide whether a file can be sent as-is. */
+    type?: string;
 };
 interface PromptInputProps {
     /** Token budget for the meter. */

package/dist/index.d.ts

@@ -980,7 +980,15 @@ interface ProgressProps {
     value?: number;
     max?: number;
     variant?: "bar" | "circular";
-    size?: "sm" | "md" | "lg";
+    /**
+     * Named scale, or an explicit pixel diameter for `variant="circular"`.
+     *
+     * The scale topped out at 64px and was written inline, so a larger ring was
+     * impossible rather than merely awkward.
+     */
+    size?: "sm" | "md" | "lg" | number;
+    /** Ring thickness in px (circular only). Derived from the diameter if unset. */
+    strokeWidth?: number;
     color?: Color;
     indeterminate?: boolean;
     showValue?: boolean;
@@ -3672,6 +3680,16 @@ type PromptAttachment = {
     id: string;
     name: string;
     bytes: number;
+    /**
+     * The file the user actually attached.
+     *
+     * Optional because an attachment restored from a server has no File — but for
+     * anything the user dropped or picked it is always present. Without it a host
+     * can render a chip and nothing else: no POST, no FormData, no send-to-model.
+     */
+    file?: File;
+    /** MIME type. Hosts branch on this to decide whether a file can be sent as-is. */
+    type?: string;
 };
 interface PromptInputProps {
     /** Token budget for the meter. */

package/dist/index.js

@@ -6737,6 +6737,7 @@ var circularSizeMap = {
   md: 48,
   lg: 64
 };
+var namedStrokeWidth = { sm: 3, md: 4, lg: 5 };
 var textSizeClasses = {
   sm: "text-[8px]",
   md: "text-[10px]",
@@ -6748,15 +6749,18 @@ var Progress = forwardRef(
     max = 100,
     variant = "bar",
     size = "md",
+    strokeWidth: strokeWidthProp,
     color = "blue",
     indeterminate = false,
     showValue = false,
     className
   }, ref) => {
+    const named = typeof size === "number" ? "md" : size;
     const percentage = Math.min(100, Math.max(0, value / max * 100));
     if (variant === "circular") {
-      const diameter = circularSizeMap[size];
-      const strokeWidth = size === "sm" ? 3 : size === "md" ? 4 : 5;
+      const pixelSize = typeof size === "number" ? size : null;
+      const diameter = pixelSize ?? circularSizeMap[named];
+      const strokeWidth = strokeWidthProp ?? (pixelSize === null ? namedStrokeWidth[named] : Math.max(3, Math.round(diameter * 0.075)));
       const radius = (diameter - strokeWidth) / 2;
       const circumference = 2 * Math.PI * radius;
       const offset = indeterminate ? circumference * 0.75 : circumference - percentage / 100 * circumference;
@@ -6769,14 +6773,19 @@ var Progress = forwardRef(
           "aria-valuemin": 0,
           "aria-valuemax": max,
           "data-react-fancy-progress": "",
-          className: cn("relative inline-flex items-center justify-center", className),
-          style: { width: diameter, height: diameter },
+          "data-size": pixelSize === null ? named : void 0,
+          className: cn(
+            "relative inline-flex items-center justify-center",
+            className
+          ),
+          style: pixelSize === null ? void 0 : { width: pixelSize, height: pixelSize },
           children: [
             /* @__PURE__ */ jsxs(
               "svg",
               {
-                width: diameter,
-                height: diameter,
+                viewBox: `0 0 ${diameter} ${diameter}`,
+                width: "100%",
+                height: "100%",
                 className: cn(indeterminate && "animate-spin"),
                 children: [
                   /* @__PURE__ */ jsx(
@@ -6814,7 +6823,7 @@ var Progress = forwardRef(
                 className: cn(
                   "absolute font-medium",
                   progressText[color],
-                  textSizeClasses[size]
+                  textSizeClasses[named]
                 ),
                 children: [
                   Math.round(percentage),
@@ -6842,7 +6851,7 @@ var Progress = forwardRef(
             {
               className: cn(
                 "w-full overflow-hidden rounded-full bg-zinc-200 dark:bg-zinc-700",
-                barHeightClasses[size]
+                barHeightClasses[named]
               ),
               children: /* @__PURE__ */ jsx(
                 "div",
@@ -15271,6 +15280,7 @@ function PromptInput({
   const [attachments, setAttachments] = useState([]);
   const [picker, setPicker] = useState(null);
   const taRef = useRef(null);
+  const fileRef = useRef(null);
   const [dragOver, setDragOver] = useState(false);
   const colors = mentionColor ?? DEFAULT_MENTION_COLOR;
   const tokens = useMemo(
@@ -15377,19 +15387,25 @@ function PromptInput({
       submit();
     }
   };
-  const onDrop = (e) => {
-    e.preventDefault();
-    setDragOver(false);
-    const files = Array.from(e.dataTransfer.files);
+  const attach = (list) => {
+    const files = Array.from(list ?? []);
+    if (files.length === 0) return;
     setAttachments((cur) => [
       ...cur,
       ...files.map((f) => ({
-        id: `${f.name}-${Date.now()}-${Math.random()}`,
+        id: crypto.randomUUID(),
         name: f.name,
-        bytes: f.size
+        bytes: f.size,
+        file: f,
+        type: f.type
       }))
     ]);
   };
+  const onDrop = (e) => {
+    e.preventDefault();
+    setDragOver(false);
+    attach(e.dataTransfer.files);
+  };
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -15498,11 +15514,23 @@ function PromptInput({
               variant: "ghost",
               size: "sm",
               className: "shrink-0",
-              onClick: () => {
-              },
+              onClick: () => fileRef.current?.click(),
               children: "\u{1F4CE} attach"
             }
           ) }),
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              ref: fileRef,
+              type: "file",
+              multiple: true,
+              className: "hidden",
+              onChange: (e) => {
+                attach(e.target.files);
+                e.target.value = "";
+              }
+            }
+          ),
           /* @__PURE__ */ jsxs("div", { className: "ml-2 flex min-w-0 items-center gap-1.5 overflow-hidden", children: [
             /* @__PURE__ */ jsx("div", { className: "h-1.5 w-24 shrink overflow-hidden rounded-full bg-zinc-200 dark:bg-zinc-700", children: /* @__PURE__ */ jsx(
               "div",