@alfadocs/ui-kit 0.1.9 → 0.2.0

package/dist/_chunks/chat-container-Dl0Kfy5a.js

@@ -1,175 +0,0 @@
-import { jsxs as c, jsx as t } from "react/jsx-runtime";
-import { forwardRef as R, useRef as h, useState as V, useCallback as L, useImperativeHandle as B, useEffect as C, useLayoutEffect as E } from "react";
-import { c as b } from "./index-D2ZczOXr.js";
-import { useTranslation as O } from "react-i18next";
-import { u as j } from "./index-CJE9uQmb.js";
-import { F as H } from "./floating-action-button-Cnw-f6AG.js";
-import { u as M } from "./use-prefers-reduced-motion-BMwIQRjB.js";
-import { C as S } from "./chevron-down-BX_NP2Yh.js";
-const $ = b(
-  "ds:relative ds:flex ds:w-full ds:flex-col ds:overflow-hidden ds:bg-background",
-  {
-    variants: {
-      density: {
-        default: "ds:gap-[var(--spacing-md)]",
-        compact: "ds:gap-[var(--spacing-sm)]"
-      }
-    },
-    defaultVariants: { density: "default" }
-  }
-), D = b(
-  [
-    "ds:flex-1 ds:min-h-0 ds:overflow-y-auto ds:overflow-x-hidden",
-    "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]",
-    "ds:pt-[var(--spacing-md)] ds:pb-[var(--spacing-md)]",
-    "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
-    "ds:focus-visible:outline-[color:var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
-    "ds:scroll-smooth ds:motion-reduce:scroll-auto ds:[.theme-accessible_&]:scroll-auto",
-    // Edge fade — content near the scroll boundaries fades into the
-    // container surface instead of clipping abruptly against the header
-    // or composer, so avatars / bubbles don't look "cut in half" as they
-    // pass the viewport edge. Fade width matches the viewport padding so
-    // a row can slide fully behind the mask before disappearing.
-    // Disabled under HCM (mask strips content), reduced motion (less
-    // decoration when motion is off), and the accessible theme.
-    "ds:[mask-image:linear-gradient(to_bottom,transparent_0,black_var(--spacing-md),black_calc(100%-var(--spacing-md)),transparent_100%)]",
-    "ds:motion-reduce:[mask-image:none]",
-    "ds:[.theme-accessible_&]:[mask-image:none]",
-    "ds:forced-colors:[mask-image:none]"
-  ].join(" ")
-), F = 100, K = 48, P = R(
-  ({
-    messages: a,
-    composer: m,
-    density: x = "default",
-    className: w,
-    id: N,
-    onAutoScrollChange: o,
-    showScrollToLatest: k = !1,
-    ...I
-  }, y) => {
-    const { t: u } = O(), n = h(null), f = h(null), [d, T] = V(!0), p = M(), i = L(
-      (s) => {
-        const e = n.current;
-        if (!e) return;
-        const r = ((s == null ? void 0 : s.smooth) ?? !0) && !p;
-        e.scrollTo({ top: e.scrollHeight, behavior: r ? "smooth" : "auto" });
-      },
-      [p]
-    );
-    B(
-      y,
-      () => ({
-        scrollToBottom: i,
-        getScrollViewport: () => n.current
-      }),
-      [i]
-    ), C(() => {
-      const s = n.current, e = f.current;
-      if (!s || !e) return;
-      const r = new IntersectionObserver(
-        (z) => {
-          const g = z[0];
-          T(g.isIntersecting), o == null || o(g.isIntersecting);
-        },
-        {
-          root: s,
-          // Fire when the sentinel is within BOTTOM_SLACK_PX of being visible.
-          rootMargin: `0px 0px ${K}px 0px`,
-          threshold: 0
-        }
-      );
-      return r.observe(e), () => r.disconnect();
-    }, [o]);
-    const _ = a.length;
-    E(() => {
-      d && i({ smooth: !1 });
-    }, [_, d, i]);
-    const v = a.length > F, l = j({
-      count: v ? a.length : 0,
-      getScrollElement: () => n.current,
-      estimateSize: () => 80,
-      overscan: 6,
-      getItemKey: (s) => {
-        var e;
-        return ((e = a[s]) == null ? void 0 : e.id) ?? s;
-      }
-    });
-    return /* @__PURE__ */ c("div", { className: $({ density: x, className: w }), "data-component": "chat-container", "data-component-id": N, ...I, children: [
-      /* @__PURE__ */ c("div", { className: "ds:relative ds:flex-1 ds:min-h-0 ds:flex ds:flex-col", children: [
-        /* @__PURE__ */ c(
-          "div",
-          {
-            ref: n,
-            role: "log",
-            "aria-live": "polite",
-            "aria-relevant": "additions",
-            "aria-label": u("ui.chat.container"),
-            tabIndex: 0,
-            className: D(),
-            children: [
-              v ? /* @__PURE__ */ t(
-                "ol",
-                {
-                  className: "ds:relative ds:list-none ds:ps-0 ds:m-0",
-                  style: { blockSize: `${l.getTotalSize()}px` },
-                  children: l.getVirtualItems().map((s) => {
-                    const e = a[s.index];
-                    return e ? /* @__PURE__ */ t(
-                      "li",
-                      {
-                        "data-index": s.index,
-                        ref: l.measureElement,
-                        className: "ds:absolute ds:start-0 ds:end-0 ds:top-0 ds:w-full",
-                        style: { transform: `translateY(${s.start}px)` },
-                        children: /* @__PURE__ */ t("div", { className: "ds:pt-[var(--spacing-xs)] ds:pb-[var(--spacing-xs)]", children: e.node })
-                      },
-                      e.id
-                    ) : null;
-                  })
-                }
-              ) : /* @__PURE__ */ t("ol", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)] ds:list-none ds:ps-0 ds:m-0", children: a.map((s) => /* @__PURE__ */ t("li", { children: s.node }, s.id)) }),
-              /* @__PURE__ */ t("div", { ref: f, "aria-hidden": "true", className: "ds:h-1 ds:w-full" })
-            ]
-          }
-        ),
-        k && !d ? /* @__PURE__ */ t(
-          "div",
-          {
-            className: [
-              "ds:pointer-events-none ds:absolute ds:inset-inline-end-0",
-              // `bottom` is measured from the bottom of the scroll
-              // column (i.e. the top edge of the composer slot). A
-              // small spacing-md gap keeps the FAB clear of the
-              // divider border above the composer.
-              "ds:bottom-[var(--spacing-md)] ds:pe-[var(--spacing-md)]",
-              // Enter animation — fade + scale in from 95%. The FAB only
-              // unmounts when the user returns to bottom, so an exit
-              // animation isn't justified (abrupt disappearance reads as
-              // "task complete" when they've scrolled back).
-              "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(" "),
-            children: /* @__PURE__ */ t("div", { className: "ds:pointer-events-auto", children: /* @__PURE__ */ t(
-              H,
-              {
-                icon: /* @__PURE__ */ t(S, {}),
-                "aria-label": u("ui.chat.scrollToLatest"),
-                size: "sm",
-                variant: "secondary",
-                position: "static",
-                onClick: () => i({ smooth: !0 })
-              }
-            ) })
-          }
-        ) : null
-      ] }),
-      m ? /* @__PURE__ */ t("div", { className: "ds:shrink-0 ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:pt-[var(--spacing-sm)] ds:pb-[var(--spacing-sm)] ds:bg-background", children: m }) : null
-    ] });
-  }
-);
-P.displayName = "ChatContainer";
-export {
-  P as C
-};
-//# sourceMappingURL=chat-container-Dl0Kfy5a.js.map

package/dist/_chunks/chat-container.agent-CM4WModE.js

@@ -1,27 +0,0 @@
-const e = {
-  id: "chat-container",
-  capabilities: ["navigate"],
-  state: {},
-  actions: {
-    scroll_to_bottom: {
-      safety: "read",
-      argsType: "{ smooth?: boolean }",
-      description: "Scroll the conversation viewport to the latest message.",
-      invoke: (t, o) => {
-        t.scrollToBottom(o);
-      }
-    }
-  },
-  domHooks: {
-    root: { attr: "data-component", value: "chat-container" },
-    instanceId: {
-      attr: "data-component-id",
-      sourceProp: "id",
-      description: "Sourced from the id prop."
-    }
-  }
-};
-export {
-  e as c
-};
-//# sourceMappingURL=chat-container.agent-CM4WModE.js.map

package/dist/_chunks/chat-input-C_tMQv92.js

@@ -1,252 +0,0 @@
-import { jsxs as d, jsx as r, Fragment as ge } from "react/jsx-runtime";
-import { forwardRef as he, useId as ve, useRef as H, useCallback as K, useState as be, useLayoutEffect as ye, useImperativeHandle as xe } from "react";
-import { c as Ie } from "./index-D2ZczOXr.js";
-import { useTranslation as Ce } from "react-i18next";
-import { I as W } from "./icon-button-Wnnde5lc.js";
-import { c as Ne } from "./createLucideIcon-CrFbzy84.js";
-import { C as ke } from "./circle-alert-ChA9opNA.js";
-import { S as ze } from "./send-CySZIRPJ.js";
-/**
- * @license lucide-react v1.8.0 - ISC
- *
- * This source code is licensed under the ISC license.
- * See the LICENSE file in the root directory of this source tree.
- */
-const we = [
-  [
-    "path",
-    {
-      d: "m16 6-8.414 8.586a2 2 0 0 0 2.829 2.829l8.414-8.586a4 4 0 1 0-5.657-5.657l-8.379 8.551a6 6 0 1 0 8.485 8.485l8.379-8.551",
-      key: "1miecu"
-    }
-  ]
-], Fe = Ne("paperclip", we), He = Ie(
-  [
-    "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)] ds:w-full",
-    // Soft drop-shadow + transparent border replaces a flat
-    // `border-border` (grey-800 since the WCAG 1.4.11 bump). Border kept
-    // at 1px so the focus-within color override + forced-colors
-    // fallback still paint a visible edge.
-    "ds:rounded-[var(--radius-md)] ds:shadow-[var(--shadow-sm)] ds:border ds:border-transparent",
-    "ds:bg-background ds:focus-within:border-[color:var(--primary)]",
-    "ds:transition-[border-color] ds:duration-[var(--animation-duration)]",
-    "ds:motion-reduce:transition-none",
-    "ds:forced-colors:border-[CanvasText]"
-  ].join(" "),
-  {
-    variants: {
-      size: {
-        sm: "ds:text-[length:var(--font-size-sm)]",
-        md: "ds:text-[length:var(--font-size-base)]",
-        lg: "ds:text-[length:var(--font-size-lg)]"
-      }
-    },
-    defaultVariants: { size: "md" }
-  }
-);
-function Te(c, u) {
-  if (typeof Intl < "u" && typeof Intl.Segmenter == "function")
-    try {
-      const p = new Intl.Segmenter(u, { granularity: "grapheme" });
-      let t = 0;
-      for (const T of p.segment(c)) t += 1;
-      return t;
-    } catch {
-    }
-  return Array.from(c).length;
-}
-const Ve = he(
-  ({
-    size: c = "md",
-    value: u,
-    defaultValue: p,
-    maxLength: t,
-    submitOnEnter: T = !1,
-    minRows: y = 1,
-    maxRows: V = 8,
-    onSubmit: x,
-    onAttach: f,
-    accept: Y,
-    disabled: m,
-    toolbar: q,
-    label: j,
-    placeholder: G,
-    className: J,
-    onChange: I,
-    onKeyDown: C,
-    onCompositionStart: N,
-    onCompositionEnd: k,
-    id: B,
-    ...L
-  }, O) => {
-    const { t: i, i18n: Q } = Ce(), U = ve(), g = H(!1), E = H(null), z = H(null), X = K(
-      (e) => {
-        z.current = e;
-      },
-      []
-    ), a = u !== void 0, [Z, h] = be(
-      String(p ?? "")
-    ), s = a ? String(u) : Z, w = Te(s, Q.language), v = typeof t == "number" && t > 0, D = v ? Math.max(0, t - w) : 0, A = v && w > t * 0.9, o = v && w >= t, M = K(() => {
-      const e = z.current;
-      if (!e) return;
-      const n = window.getComputedStyle(e), b = parseFloat(n.lineHeight) || 24, de = parseFloat(n.paddingTop) || 0, ce = parseFloat(n.paddingBottom) || 0, ue = parseFloat(n.borderTopWidth) || 0, pe = parseFloat(n.borderBottomWidth) || 0, R = de + ce + ue + pe, fe = b * y + R, _ = b * V + R;
-      e.style.height = "auto";
-      const me = Math.max(fe, Math.min(e.scrollHeight, _));
-      e.style.height = `${me}px`, e.style.overflowY = e.scrollHeight > _ ? "auto" : "hidden";
-    }, [y, V]);
-    ye(() => {
-      M();
-    }, [M, s]);
-    const ee = (e) => {
-      a || h(e.target.value), !g.current && (I == null || I(e));
-    }, te = (e) => {
-      g.current = !0, N == null || N(e);
-    }, se = (e) => {
-      g.current = !1, k == null || k(e);
-    }, re = (e) => e.nativeEvent.isComposing || e.keyCode === 229 || g.current, F = () => {
-      !s.trim() || m || o || (x == null || x(s), a || h(""));
-    };
-    xe(
-      O,
-      () => ({
-        getValue: () => s,
-        isEmpty: () => !s.trim(),
-        setValue: (e) => {
-          a || h(e);
-        },
-        clear: () => {
-          a || h("");
-        },
-        submit: () => {
-          F();
-        },
-        focus: () => {
-          var e;
-          (e = z.current) == null || e.focus();
-        }
-      }),
-      // `submit` is a local closure that always sees the latest currentValue
-      // via React's render cycle — depend on currentValue + isControlled so
-      // the handle picks up new values across renders.
-      // eslint-disable-next-line react-hooks/exhaustive-deps
-      [s, a]
-    );
-    const ae = (e) => {
-      if (C == null || C(e), !e.defaultPrevented && !re(e) && e.key === "Enter") {
-        const n = e.metaKey || e.ctrlKey, b = T && !e.shiftKey;
-        (n || b) && (e.preventDefault(), F());
-      }
-    }, ne = () => {
-      var e;
-      (e = E.current) == null || e.click();
-    }, ie = (e) => {
-      e.target.files && e.target.files.length > 0 && (f == null || f(e.target.files)), e.target.value = "";
-    }, l = B ?? U, P = `${l}-label`, S = v ? `${l}-counter` : void 0, $ = `${l}-hint`, oe = G ?? i("chat.input.placeholder"), le = j ?? i("chat.prompt");
-    return /* @__PURE__ */ d("div", { "data-component": "chat-input", "data-component-id": B, className: He({ size: c, className: J }), children: [
-      /* @__PURE__ */ r("label", { id: P, htmlFor: l, className: j ? "type-label ds:ps-[var(--spacing-sm)] ds:pt-[var(--spacing-sm)]" : "ds:sr-only", children: le }),
-      /* @__PURE__ */ r(
-        "textarea",
-        {
-          ref: X,
-          id: l,
-          value: a ? s : void 0,
-          defaultValue: a ? void 0 : p,
-          disabled: m,
-          rows: y,
-          maxLength: t,
-          placeholder: oe,
-          "aria-labelledby": P,
-          "aria-describedby": [S, $].filter(Boolean).join(" ") || void 0,
-          "aria-invalid": o || void 0,
-          onChange: ee,
-          onKeyDown: ae,
-          onCompositionStart: te,
-          onCompositionEnd: se,
-          className: [
-            "ds:w-full ds:resize-none ds:bg-transparent",
-            "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:pt-[var(--spacing-sm)] ds:pb-[var(--spacing-xs)]",
-            "ds:placeholder:text-[color:var(--muted-foreground)]",
-            "ds:leading-[var(--line-height-base)]",
-            "ds:disabled:opacity-50 ds:disabled:cursor-not-allowed",
-            // Tokenised focus ring on the textarea itself — the 1px border
-            // shift on the wrapper alone fails the 3px accessible-theme
-            // requirement. See a11y-critical-fixes.mdx.
-            "ds:outline-none",
-            "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
-            "ds:focus-visible:outline-[color:var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
-            "ds:rounded-[var(--radius-sm)]",
-            "ds:forced-colors:focus-visible:outline-[CanvasText]"
-          ].join(" "),
-          ...L
-        }
-      ),
-      /* @__PURE__ */ d("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: [
-        f ? /* @__PURE__ */ d(ge, { children: [
-          /* @__PURE__ */ r(
-            "input",
-            {
-              ref: E,
-              type: "file",
-              className: "ds:sr-only",
-              multiple: !0,
-              accept: Y,
-              onChange: ie
-            }
-          ),
-          /* @__PURE__ */ r(
-            W,
-            {
-              icon: /* @__PURE__ */ r(Fe, {}),
-              "aria-label": i("chat.input.attach"),
-              intent: "ghost",
-              size: "sm",
-              onClick: ne,
-              disabled: m
-            }
-          )
-        ] }) : null,
-        q,
-        /* @__PURE__ */ d("div", { className: "ds:ms-auto ds:inline-flex ds:items-center ds:gap-[var(--spacing-sm)]", children: [
-          A ? /* @__PURE__ */ d(
-            "span",
-            {
-              id: S,
-              "aria-live": "polite",
-              className: [
-                "ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]",
-                "type-meta ds:tabular-nums",
-                o ? "ds:text-[color:var(--destructive)]" : "ds:text-[color:var(--muted-foreground)]"
-              ].join(" "),
-              children: [
-                o ? (
-                  // Icon pairs with --destructive colour so the at-limit
-                  // state is not conveyed by hue alone (WCAG 1.4.1).
-                  /* @__PURE__ */ r(ke, { "aria-hidden": "true", className: "ds:size-3.5" })
-                ) : null,
-                i("chat.input.remaining", { count: D })
-              ]
-            }
-          ) : null,
-          /* @__PURE__ */ r("span", { id: $, className: "ds:sr-only", children: i("chat.input.sendHint") }),
-          /* @__PURE__ */ r(
-            W,
-            {
-              icon: /* @__PURE__ */ r(ze, {}),
-              "aria-label": i("chat.send"),
-              intent: "primary",
-              size: "sm",
-              disabled: m || !s.trim() || o,
-              onClick: F,
-              "aria-keyshortcuts": "Meta+Enter Control+Enter"
-            }
-          )
-        ] })
-      ] })
-    ] });
-  }
-);
-Ve.displayName = "ChatInput";
-export {
-  Ve as C
-};
-//# sourceMappingURL=chat-input-C_tMQv92.js.map

package/dist/_chunks/chat-input.agent-Bsz3ckGa.js

@@ -1,69 +0,0 @@
-const i = {
-  id: "chat-input",
-  capabilities: ["edit_inline", "submit"],
-  state: {
-    value: {
-      type: "string",
-      descriptionKey: "ui.agent.chatInput.state.value",
-      description: "Current text in the composer.",
-      read: (t) => t.getValue()
-    },
-    isEmpty: {
-      type: "boolean",
-      descriptionKey: "ui.agent.chatInput.state.isEmpty",
-      description: "True when the composer has no text.",
-      read: (t) => t.isEmpty()
-    }
-  },
-  actions: {
-    set_value: {
-      safety: "write",
-      argsType: "{ value: string }",
-      descriptionKey: "ui.agent.chatInput.actions.setValue",
-      description: "Replace the composer text.",
-      invoke: (t, e) => {
-        t.setValue(e.value);
-      }
-    },
-    clear: {
-      safety: "destructive",
-      descriptionKey: "ui.agent.chatInput.actions.clear",
-      description: "Clear the composer. Irreversible from the same UI.",
-      invoke: (t) => {
-        t.clear();
-      }
-    },
-    submit: {
-      safety: "write",
-      descriptionKey: "ui.agent.chatInput.actions.submit",
-      description: "Submit the current composer state via onSubmit.",
-      invoke: (t) => {
-        t.submit();
-      }
-    },
-    focus: {
-      safety: "read",
-      descriptionKey: "ui.agent.chatInput.actions.focus",
-      description: "Move keyboard focus into the textarea.",
-      invoke: (t) => {
-        t.focus();
-      }
-    }
-  },
-  domHooks: {
-    root: {
-      attr: "data-component",
-      value: "chat-input",
-      description: "Marks the ChatInput wrapper."
-    },
-    instanceId: {
-      attr: "data-component-id",
-      sourceProp: "id",
-      description: "Sourced from the id prop."
-    }
-  }
-};
-export {
-  i as c
-};
-//# sourceMappingURL=chat-input.agent-Bsz3ckGa.js.map