@alfadocs/ui-kit 1.66.0 → 1.68.0

package/dist/_chunks/{ai-prompt-input-DSGSe4LH.js → ai-prompt-input-DzgyoKyk.js}

@@ -1,18 +1,19 @@
 import { jsxs as u, jsx as a } from "react/jsx-runtime";
-import { forwardRef as Fe, useId as Be, useRef as H, useCallback as v, useState as W, useImperativeHandle as $e, useMemo as Ce } from "react";
-import { c as Oe } from "./index-D2ZczOXr.js";
-import { useTranslation as ee } from "react-i18next";
-import { u as J } from "./use-controllable-state-BiY4xTzM.js";
-import { u as Re } from "./use-isomorphic-layout-effect-BGfaCOP1.js";
+import { forwardRef as Ce, useId as Oe, useRef as H, useCallback as v, useState as L, useImperativeHandle as $e, useMemo as De } from "react";
+import { c as Re } from "./index-D2ZczOXr.js";
+import { useTranslation as ae } from "react-i18next";
+import { u as te } from "./use-controllable-state-BiY4xTzM.js";
+import { u as _e } from "./use-isomorphic-layout-effect-BGfaCOP1.js";
 import { u as je } from "./registry-DvAUVLHh.js";
 import { _ as g } from "./index-4xgbg-sn.js";
-import { u as _e } from "./index-BcMWc8W2.js";
-import { I as te } from "./icon-button-C_1TgRiK.js";
-import { S as We } from "./select-k4gBdS8N.js";
-import { b as De } from "./menu-row-BAr8bx1I.js";
-import { S as Le } from "./send-C5kDJ-Mz.js";
-import { X as Ue } from "./x-B5YnXwCz.js";
-const Ae = {
+import { u as Le } from "./index-BcMWc8W2.js";
+import { I as re } from "./icon-button-C_1TgRiK.js";
+import { S as We } from "./select-4S-eYZUf.js";
+import { b as Ae } from "./menu-row-BAr8bx1I.js";
+import { a as W } from "./format-number-DdzqwMs1.js";
+import { S as Ue } from "./send-C5kDJ-Mz.js";
+import { X as Ge } from "./x-B5YnXwCz.js";
+const Ze = {
   id: "ai-prompt-input",
   capabilities: ["edit_inline", "submit"],
   state: {
@@ -54,8 +55,8 @@ const Ae = {
           note: "Replace composer text."
         }
       ],
-      invoke: (s, d) => {
-        s.setValue(d.value);
+      invoke: (s, o) => {
+        s.setValue(o.value);
       }
     },
     clear: {
@@ -101,7 +102,7 @@ const Ae = {
       description: "Sourced from the id prop; addresses a specific composer instance."
     }
   }
-}, Ze = Oe(
+}, qe = Re(
   [
     "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)] ds:w-full",
     "ds:rounded-[var(--radius-md)] ds:border ds:border-[color:var(--control-border)] ds:bg-input",
@@ -120,58 +121,58 @@ const Ae = {
     },
     defaultVariants: { size: "md" }
   }
-), qe = Fe(
+), Qe = Ce(
   ({
     commands: s = [],
-    models: d,
-    defaultModelId: T,
-    modelId: se,
-    onModelChange: ae,
+    models: o,
+    defaultModelId: E,
+    modelId: T,
+    onModelChange: ne,
     maxSize: h,
-    accept: re,
-    context: E,
+    accept: ie,
+    context: K,
     onContextDismiss: b,
     onSubmit: x,
     onAttach: y,
     onAttachmentRejected: I,
-    minRows: K = 2,
-    maxRows: D = 8,
-    value: L,
-    defaultValue: ne,
-    size: ie = "md",
-    disabled: U,
-    className: oe,
-    placeholder: de,
-    onChange: F,
-    onKeyDown: B,
-    onCompositionStart: $,
-    onCompositionEnd: C,
-    onPaste: O,
+    minRows: F = 2,
+    maxRows: A = 8,
+    value: U,
+    defaultValue: oe,
+    size: de = "md",
+    disabled: G,
+    className: le,
+    placeholder: ce,
+    onChange: B,
+    onKeyDown: C,
+    onCompositionStart: O,
+    onCompositionEnd: $,
+    onPaste: D,
     id: R,
-    ...le
-  }, ce) => {
-    var X;
-    const { t: o } = ee("ui"), pe = Be(), w = H(null), N = H(!1), ue = H(null), me = v((e) => {
+    ...pe
+  }, ue) => {
+    var J;
+    const { t: d } = ae("ui"), me = Oe(), w = H(null), N = H(!1), fe = H(null), ve = v((e) => {
       w.current = e;
-    }, []), [fe, m] = J({
-      value: L === void 0 ? void 0 : String(L),
-      defaultValue: String(ne ?? "")
-    }), i = fe ?? "", [p, S] = W([]), [f, k] = W(!1), [ve, M] = W(""), [ge, he] = J({
-      value: se,
-      defaultValue: T ?? ((X = d == null ? void 0 : d[0]) == null ? void 0 : X.id) ?? "",
-      onChange: ae
-    }), j = ge ?? "", A = v(() => {
+    }, []), [ge, m] = te({
+      value: U === void 0 ? void 0 : String(U),
+      defaultValue: String(oe ?? "")
+    }), i = ge ?? "", [p, S] = L([]), [f, k] = L(!1), [he, M] = L(""), [be, xe] = te({
+      value: T,
+      defaultValue: E ?? ((J = o == null ? void 0 : o[0]) == null ? void 0 : J.id) ?? "",
+      onChange: ne
+    }), _ = be ?? "", Z = v(() => {
       const e = w.current;
       if (!e) return;
-      const t = window.getComputedStyle(e), n = parseFloat(t.lineHeight) || 24, r = parseFloat(t.paddingTop) || 0, c = parseFloat(t.paddingBottom) || 0, l = parseFloat(t.borderTopWidth) || 0, _ = parseFloat(t.borderBottomWidth) || 0, V = r + c + l + _, Ee = n * K + V, Y = n * D + V;
+      const t = window.getComputedStyle(e), n = parseFloat(t.lineHeight) || 24, r = parseFloat(t.paddingTop) || 0, c = parseFloat(t.paddingBottom) || 0, l = parseFloat(t.borderTopWidth) || 0, j = parseFloat(t.borderBottomWidth) || 0, V = r + c + l + j, Fe = n * F + V, ee = n * A + V;
       e.style.height = "auto";
-      const Ke = Math.max(Ee, Math.min(e.scrollHeight, Y));
-      e.style.height = `${Ke}px`, e.style.overflowY = e.scrollHeight > Y ? "auto" : "hidden";
-    }, [K, D]);
-    Re(() => {
-      A();
-    }, [A, i]);
-    const be = v((e, t) => {
+      const Be = Math.max(Fe, Math.min(e.scrollHeight, ee));
+      e.style.height = `${Be}px`, e.style.overflowY = e.scrollHeight > ee ? "auto" : "hidden";
+    }, [F, A]);
+    _e(() => {
+      Z();
+    }, [Z, i]);
+    const ye = v((e, t) => {
       const r = e.slice(0, t).lastIndexOf(`
 `) + 1, c = e.slice(r, t);
       if (c.startsWith("/")) {
@@ -182,16 +183,16 @@ const Ae = {
         }
       }
       k(!1), M("");
-    }, []), xe = (e) => {
+    }, []), Ie = (e) => {
       if (m(e.target.value), N.current) return;
-      F == null || F(e);
+      B == null || B(e);
       const t = e.target.selectionStart ?? e.target.value.length;
-      be(e.target.value, t);
-    }, ye = (e) => {
-      N.current = !0, $ == null || $(e);
-    }, Ie = (e) => {
-      N.current = !1, C == null || C(e);
-    }, we = (e) => e.nativeEvent.isComposing || e.keyCode === 229 || N.current, P = v(() => {
+      ye(e.target.value, t);
+    }, we = (e) => {
+      N.current = !0, O == null || O(e);
+    }, Ne = (e) => {
+      N.current = !1, $ == null || $(e);
+    }, Se = (e) => e.nativeEvent.isComposing || e.keyCode === 229 || N.current, P = v(() => {
       if (!i.trim() && p.length === 0) return;
       let t, n = i;
       const r = i.match(/^\/(\S+)\s?/);
@@ -199,11 +200,11 @@ const Ae = {
         text: n,
         command: t,
         attachments: p,
-        modelId: j || void 0
+        modelId: _ || void 0
       }), m(""), S([]);
-    }, [i, p, x, j, m]), Z = H(null);
-    $e(ce, () => Z.current, []);
-    const Ne = Ce(
+    }, [i, p, x, _, m]), q = H(null);
+    $e(ue, () => q.current, []);
+    const ke = De(
       () => ({
         getValue: () => i,
         isEmpty: () => !i.trim() && p.length === 0,
@@ -224,16 +225,16 @@ const Ae = {
       }),
       [i, p, m, P]
     );
-    je(Ae, Ne, R);
-    const Se = (e) => {
-      if (B == null || B(e), !e.defaultPrevented && !we(e)) {
+    je(Ze, ke, R);
+    const Me = (e) => {
+      if (C == null || C(e), !e.defaultPrevented && !Se(e)) {
         if (f && e.key === "Escape") {
           e.preventDefault(), k(!1);
           return;
         }
         e.key === "Enter" && (e.metaKey || e.ctrlKey) && (e.preventDefault(), P());
       }
-    }, ke = (e) => {
+    }, Pe = (e) => {
       const t = w.current;
       if (!t) return;
       const n = t.selectionStart ?? i.length, c = i.slice(0, n).lastIndexOf(`
@@ -241,10 +242,10 @@ const Ae = {
       let l = n;
       for (; l < i.length && !/\s/.test(i[l]); )
         l += 1;
-      const _ = i.slice(l), V = i.slice(0, c) + `/${e.id} ` + _;
+      const j = i.slice(l), V = i.slice(0, c) + `/${e.id} ` + j;
       m(V), k(!1), M(""), queueMicrotask(() => t.focus());
-    }, Me = (e) => {
-      if (O == null || O(e), e.defaultPrevented) return;
+    }, ze = (e) => {
+      if (D == null || D(e), e.defaultPrevented) return;
       const { clipboardData: t } = e;
       if (!t) return;
       const n = [];
@@ -255,15 +256,15 @@ const Ae = {
           l && n.push(l);
         }
       }
-      n.length > 0 && (e.preventDefault(), q(n));
-    }, q = v(
+      n.length > 0 && (e.preventDefault(), Q(n));
+    }, Q = v(
       (e) => {
         var n;
         const t = [];
         for (const r of e) {
           if (typeof h == "number" && r.size > h) {
             I == null || I(
-              o("chat.attachment.rejected", { reason: "size" })
+              d("chat.attachment.rejected", { reason: "size" })
             );
             continue;
           }
@@ -274,36 +275,36 @@ const Ae = {
         }
         t.length > 0 && (S((r) => [...r, ...t]), y == null || y(t.map((r) => r.file)));
       },
-      [h, y, I, o]
-    ), { getRootProps: Pe, getInputProps: ze, isDragActive: Ve } = _e({
-      onDrop: q,
+      [h, y, I, d]
+    ), { getRootProps: Ve, getInputProps: He, isDragActive: Ee } = Le({
+      onDrop: Q,
       maxSize: h,
-      accept: re,
+      accept: ie,
       noClick: !0,
       noKeyboard: !0
-    }), He = (e) => {
+    }), Te = (e) => {
       S((t) => t.filter((n) => n.id !== e));
-    }, z = R ?? pe, G = `${z}-label`, Q = `${z}-slash-list`, Te = (d == null ? void 0 : d.map((e) => ({ value: e.id, label: e.label }))) ?? [];
+    }, z = R ?? me, X = `${z}-label`, Y = `${z}-slash-list`, Ke = (o == null ? void 0 : o.map((e) => ({ value: e.id, label: e.label }))) ?? [];
     return /* @__PURE__ */ u(
       "div",
       {
-        ref: Z,
-        ...Pe({
+        ref: q,
+        ...Ve({
           className: [
-            Ze({ size: ie, className: oe }),
-            Ve ? "ds:outline ds:outline-dashed ds:outline-[color:var(--primary)] ds:outline-offset-2 ds:bg-[color:var(--primary)]/5" : ""
+            qe({ size: de, className: le }),
+            Ee ? "ds:outline ds:outline-dashed ds:outline-[color:var(--primary)] ds:outline-offset-2 ds:bg-[color:var(--primary)]/5" : ""
           ].join(" ")
         }),
-        "aria-label": o("chat.attachmentZone"),
+        "aria-label": d("chat.attachmentZone"),
         "data-component": "ai-prompt-input",
         "data-component-id": R,
         children: [
-          /* @__PURE__ */ a("input", { "aria-label": o("chat.attachmentZone"), ...ze() }),
-          E ? /* @__PURE__ */ a("div", { className: "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-xs)] ds:pt-[var(--spacing-xs)]", children: /* @__PURE__ */ a(
+          /* @__PURE__ */ a("input", { "aria-label": d("chat.attachmentZone"), ...He() }),
+          K ? /* @__PURE__ */ a("div", { className: "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-xs)] ds:pt-[var(--spacing-xs)]", children: /* @__PURE__ */ a(
             "button",
             {
               type: "button",
-              "aria-label": o("chat.contextActive", { name: E }),
+              "aria-label": d("chat.contextActive", { name: K }),
               onClick: b,
               onKeyDown: (e) => {
                 (e.key === "Backspace" || e.key === "Delete") && (e.preventDefault(), b == null || b());
@@ -318,29 +319,29 @@ const Ae = {
                 "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid ds:focus-visible:outline-[color:var(--ring)]",
                 "ds:forced-colors:focus-visible:outline-[CanvasText]"
               ].join(" "),
-              children: o("chat.contextActive", { name: E })
+              children: d("chat.contextActive", { name: K })
             }
           ) }) : null,
-          /* @__PURE__ */ a("label", { id: G, htmlFor: z, className: "ds:sr-only", children: o("chat.prompt") }),
+          /* @__PURE__ */ a("label", { id: X, htmlFor: z, className: "ds:sr-only", children: d("chat.prompt") }),
           /* @__PURE__ */ u("div", { className: "ds:relative", children: [
             /* @__PURE__ */ a(
               "textarea",
               {
-                ref: me,
+                ref: ve,
                 id: z,
-                rows: K,
+                rows: F,
                 value: i,
-                disabled: U,
-                placeholder: de ?? o("chat.input.placeholder"),
-                "aria-labelledby": G,
+                disabled: G,
+                placeholder: ce ?? d("chat.input.placeholder"),
+                "aria-labelledby": X,
                 role: f ? "combobox" : void 0,
-                "aria-controls": f ? Q : void 0,
+                "aria-controls": f ? Y : void 0,
                 "aria-expanded": f ? !0 : void 0,
-                onChange: xe,
-                onKeyDown: Se,
-                onPaste: Me,
-                onCompositionStart: ye,
-                onCompositionEnd: Ie,
+                onChange: Ie,
+                onKeyDown: Me,
+                onPaste: ze,
+                onCompositionStart: we,
+                onCompositionEnd: Ne,
                 className: [
                   "ds:w-full ds:resize-none ds:bg-transparent ds:outline-none",
                   "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:pt-[var(--spacing-sm)] ds:pb-[var(--spacing-xs)]",
@@ -348,13 +349,13 @@ const Ae = {
                   "ds:leading-[var(--line-height-base)]",
                   "ds:disabled:opacity-50 ds:disabled:cursor-not-allowed"
                 ].join(" "),
-                ...le
+                ...pe
               }
             ),
             f ? /* @__PURE__ */ a(
               "div",
               {
-                ref: ue,
+                ref: fe,
                 className: [
                   "ds:absolute ds:start-[var(--spacing-md)] ds:top-full ds:z-50",
                   "ds:mt-[var(--spacing-xs)]",
@@ -367,29 +368,29 @@ const Ae = {
                   "ds:origin-top ds:motion-safe:animate-in ds:motion-safe:fade-in-0 ds:motion-safe:zoom-in-95",
                   "ds:duration-[var(--animation-duration)] ds:ease-[var(--ease-out)]"
                 ].join(" "),
-                id: Q,
-                children: /* @__PURE__ */ u(g, { label: o("chat.slashMenu.label"), loop: !0, children: [
+                id: Y,
+                children: /* @__PURE__ */ u(g, { label: d("chat.slashMenu.label"), loop: !0, children: [
                   /* @__PURE__ */ a(
                     g.Input,
                     {
-                      value: ve,
+                      value: he,
                       onValueChange: M,
                       className: "ds:sr-only"
                     }
                   ),
                   /* @__PURE__ */ u(g.List, { className: "ds:max-h-60 ds:overflow-y-auto ds:pt-[var(--spacing-xs)] ds:pb-[var(--spacing-xs)]", children: [
-                    /* @__PURE__ */ a(g.Empty, { className: "type-body-sm ds:text-[color:var(--muted-foreground)] ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:pt-[var(--spacing-sm)] ds:pb-[var(--spacing-sm)]", children: o("chat.slashMenu.empty") }),
+                    /* @__PURE__ */ a(g.Empty, { className: "type-body-sm ds:text-[color:var(--muted-foreground)] ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:pt-[var(--spacing-sm)] ds:pb-[var(--spacing-sm)]", children: d("chat.slashMenu.empty") }),
                     s.map((e) => /* @__PURE__ */ u(
                       g.Item,
                       {
                         value: e.id,
-                        onSelect: () => ke(e),
+                        onSelect: () => Pe(e),
                         className: [
                           "ds:flex ds:flex-col ds:gap-[2px]",
                           "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]",
                           "ds:pt-[var(--spacing-xs)] ds:pb-[var(--spacing-xs)]",
                           "type-body-sm ds:cursor-pointer",
-                          De.selected
+                          Ae.selected
                         ].join(" "),
                         children: [
                           /* @__PURE__ */ u("span", { className: "ds:font-medium", children: [
@@ -410,40 +411,40 @@ const Ae = {
             "div",
             {
               role: "group",
-              "aria-label": o("chat.attachmentZone"),
+              "aria-label": d("chat.attachmentZone"),
               className: "ds:flex ds:flex-wrap ds:gap-[var(--spacing-xs)] ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)]",
               children: p.map((e) => /* @__PURE__ */ a(
-                Qe,
+                Ye,
                 {
                   file: e.file,
-                  onRemove: () => He(e.id)
+                  onRemove: () => Te(e.id)
                 },
                 e.id
               ))
             }
           ) : null,
           /* @__PURE__ */ u("div", { className: "ds:flex ds:items-center ds:gap-[var(--spacing-xs)] ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)] ds:pb-[var(--spacing-xs)]", children: [
-            d && d.length > 0 ? /* @__PURE__ */ a("div", { className: "ds:me-auto ds:min-w-[140px]", children: /* @__PURE__ */ a(
+            o && o.length > 0 ? /* @__PURE__ */ a("div", { className: "ds:me-auto ds:min-w-[140px]", children: /* @__PURE__ */ a(
               We,
               {
-                "aria-label": o("chat.model.select"),
-                options: Te,
-                value: j || "",
+                "aria-label": d("chat.model.select"),
+                options: Ke,
+                value: _ || "",
                 onValueChange: (e) => {
-                  he(e);
+                  xe(e);
                 },
                 size: "sm"
               }
             ) }) : /* @__PURE__ */ a("div", { className: "ds:me-auto" }),
-            /* @__PURE__ */ a("span", { className: "ds:sr-only", children: o("chat.input.sendHint") }),
+            /* @__PURE__ */ a("span", { className: "ds:sr-only", children: d("chat.input.sendHint") }),
             /* @__PURE__ */ a(
-              te,
+              re,
               {
-                icon: /* @__PURE__ */ a(Le, {}),
-                "aria-label": o("chat.send"),
+                icon: /* @__PURE__ */ a(Ue, {}),
+                "aria-label": d("chat.send"),
                 intent: "primary",
                 size: "sm",
-                disabled: U || !i.trim() && p.length === 0,
+                disabled: G || !i.trim() && p.length === 0,
                 onClick: P,
                 "aria-keyshortcuts": "Meta+Enter Control+Enter"
               }
@@ -454,15 +455,16 @@ const Ae = {
     );
   }
 );
-qe.displayName = "AIPromptInput";
-function Ge(s) {
-  return s < 1024 ? `${s} B` : s < 1024 * 1024 ? `${(s / 1024).toFixed(1)} KB` : `${(s / (1024 * 1024)).toFixed(1)} MB`;
+Qe.displayName = "AIPromptInput";
+const se = { minimumFractionDigits: 1, maximumFractionDigits: 1 };
+function Xe(s, o) {
+  return s < 1024 ? `${W(s, o, { useGrouping: !1 })} B` : s < 1024 * 1024 ? `${W(s / 1024, o, se)} KB` : `${W(s / (1024 * 1024), o, se)} MB`;
 }
-function Qe({
+function Ye({
   file: s,
-  onRemove: d
+  onRemove: o
 }) {
-  const { t: T } = ee("ui");
+  const { t: E, i18n: T } = ae("ui");
   return /* @__PURE__ */ u(
     "span",
     {
@@ -478,15 +480,15 @@ function Qe({
       ].join(" "),
       children: [
         /* @__PURE__ */ a("span", { className: "ds:truncate ds:max-w-[16ch]", children: s.name }),
-        /* @__PURE__ */ a("span", { className: "ds:text-[color:var(--muted-foreground)] ds:tabular-nums", children: Ge(s.size) }),
+        /* @__PURE__ */ a("span", { className: "ds:text-[color:var(--muted-foreground)] ds:tabular-nums", children: Xe(s.size, T.language) }),
         /* @__PURE__ */ a(
-          te,
+          re,
           {
-            icon: /* @__PURE__ */ a(Ue, {}),
-            "aria-label": T("chat.attachment.remove", { name: s.name }),
+            icon: /* @__PURE__ */ a(Ge, {}),
+            "aria-label": E("chat.attachment.remove", { name: s.name }),
             intent: "ghost",
             size: "sm",
-            onClick: d
+            onClick: o
           }
         )
       ]
@@ -494,7 +496,7 @@ function Qe({
   );
 }
 export {
-  qe as A,
-  Ae as a
+  Qe as A,
+  Ze as a
 };
-//# sourceMappingURL=ai-prompt-input-DSGSe4LH.js.map
+//# sourceMappingURL=ai-prompt-input-DzgyoKyk.js.map