@octaviaflow/core 3.1.0-beta.114 → 3.1.0-beta.115

package/dist/chunk-ZALBYWCU.js

@@ -0,0 +1,1547 @@
+import {
+  Slot,
+  resolveAccessibleName
+} from "./chunk-75JAQ4ZG.js";
+import {
+  cn
+} from "./chunk-ZAUUGK2Y.js";
+
+// src/components/Card/Card.tsx
+import { motion, useReducedMotion } from "framer-motion";
+import {
+  forwardRef
+} from "react";
+import { jsx } from "react/jsx-runtime";
+var Card = forwardRef(function Card2({
+  variant = "default",
+  padding = "md",
+  radius = "md",
+  hoverable = false,
+  disabled = false,
+  loading = false,
+  asChild = false,
+  onClick,
+  onKeyDown,
+  className,
+  children,
+  ...rest
+}, ref) {
+  const reducedMotion = useReducedMotion();
+  const isInteractive = Boolean(onClick) && !disabled && !loading;
+  const handleKeyDown = (e) => {
+    onKeyDown?.(e);
+    if (e.defaultPrevented) return;
+    if (!isInteractive) return;
+    if ((e.key === "Enter" || e.key === " ") && !e.repeat) {
+      e.preventDefault();
+      onClick?.(e);
+    }
+  };
+  const rootClassName = cn(
+    "ods-card",
+    `ods-card--${variant}`,
+    `ods-card--pad-${padding}`,
+    `ods-card--radius-${radius}`,
+    (hoverable || isInteractive) && !loading && !disabled && "ods-card--hoverable",
+    isInteractive && "ods-card--clickable",
+    disabled && "ods-card--disabled",
+    loading && "ods-card--loading",
+    className
+  );
+  if (asChild) {
+    return /* @__PURE__ */ jsx(
+      Slot,
+      {
+        ...rest,
+        ref,
+        className: rootClassName,
+        onClick: isInteractive ? onClick : void 0,
+        onKeyDown: isInteractive ? handleKeyDown : onKeyDown,
+        "aria-disabled": disabled || void 0,
+        children
+      }
+    );
+  }
+  if (loading) {
+    return /* @__PURE__ */ jsx("div", { ...rest, ref, className: rootClassName, "aria-busy": "true", "aria-label": "Loading", children: /* @__PURE__ */ jsx("div", { className: "ods-card__skeleton", "data-ods-animate": "shimmer" }) });
+  }
+  return /* @__PURE__ */ jsx(
+    motion.div,
+    {
+      ...rest,
+      ref,
+      onClick: isInteractive ? onClick : void 0,
+      onKeyDown: isInteractive ? handleKeyDown : onKeyDown,
+      className: rootClassName,
+      whileHover: (hoverable || isInteractive) && !reducedMotion ? { y: -2, transition: { duration: 0.15 } } : void 0,
+      whileTap: isInteractive && !reducedMotion ? { scale: 0.99 } : void 0,
+      role: isInteractive ? "button" : rest.role,
+      tabIndex: isInteractive ? rest.tabIndex ?? 0 : rest.tabIndex,
+      "aria-disabled": disabled || void 0,
+      children
+    }
+  );
+});
+Card.displayName = "Card";
+var CardHeader = forwardRef(function CardHeader2({ className, children, ...rest }, ref) {
+  return /* @__PURE__ */ jsx("div", { ...rest, ref, className: cn("ods-card__header", className), children });
+});
+CardHeader.displayName = "Card.Header";
+var CardBody = forwardRef(function CardBody2({ className, children, ...rest }, ref) {
+  return /* @__PURE__ */ jsx("div", { ...rest, ref, className: cn("ods-card__body", className), children });
+});
+CardBody.displayName = "Card.Body";
+var CardFooter = forwardRef(function CardFooter2({ className, children, ...rest }, ref) {
+  return /* @__PURE__ */ jsx("div", { ...rest, ref, className: cn("ods-card__footer", className), children });
+});
+CardFooter.displayName = "Card.Footer";
+var CardTitle = forwardRef(function CardTitle2({ as: Comp = "h3", className, children, ...rest }, ref) {
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      ...rest,
+      ref,
+      className: cn("ods-card__title", className),
+      children
+    }
+  );
+});
+CardTitle.displayName = "Card.Title";
+var CardDescription = forwardRef(
+  function CardDescription2({ className, children, ...rest }, ref) {
+    return /* @__PURE__ */ jsx("p", { ...rest, ref, className: cn("ods-card__description", className), children });
+  }
+);
+CardDescription.displayName = "Card.Description";
+Card.Header = CardHeader;
+Card.Body = CardBody;
+Card.Footer = CardFooter;
+Card.Title = CardTitle;
+Card.Description = CardDescription;
+
+// src/components/Avatar/Avatar.tsx
+import {
+  forwardRef as forwardRef2,
+  useCallback,
+  useMemo,
+  useState
+} from "react";
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+var PALETTE_SIZE = 12;
+function djb2(str) {
+  let h = 5381;
+  for (let i = 0; i < str.length; i++) h = (h << 5) + h + str.charCodeAt(i);
+  return h >>> 0;
+}
+function paletteIndexFor(seed) {
+  return djb2(seed) % PALETTE_SIZE;
+}
+var AVATAR_PALETTE_SIZE = PALETTE_SIZE;
+function avatarPaletteIndex(seed) {
+  return paletteIndexFor(seed);
+}
+function normalizeInitials(raw) {
+  const trimmed = raw.trim();
+  if (!trimmed) return "";
+  const tokens = trimmed.split(/\s+/).filter(Boolean);
+  if (tokens.length >= 2) {
+    return (tokens[0].charAt(0) + tokens[1].charAt(0)).toUpperCase();
+  }
+  return trimmed.slice(0, 2).toUpperCase();
+}
+var STATUS_DEFAULT_LABEL = {
+  online: "Online",
+  offline: "Offline",
+  busy: "Busy",
+  away: "Away"
+};
+var Avatar = forwardRef2(function Avatar2({
+  src,
+  alt,
+  initials,
+  icon,
+  fallback,
+  seed,
+  palette,
+  size = "md",
+  shape = "circle",
+  status,
+  statusLabel,
+  onClick,
+  imgLoading = "lazy",
+  referrerPolicy,
+  className,
+  ...rest
+}, ref) {
+  const [imgFailed, setImgFailed] = useState(false);
+  const handleImgError = useCallback(() => setImgFailed(true), []);
+  const showImage = Boolean(src) && !imgFailed;
+  const normalizedInitials = useMemo(
+    () => initials ? normalizeInitials(initials) : "",
+    [initials]
+  );
+  const paletteIdx = useMemo(() => {
+    if (palette !== void 0) {
+      return (Math.trunc(palette) % PALETTE_SIZE + PALETTE_SIZE) % PALETTE_SIZE;
+    }
+    const resolved = seed ?? alt ?? initials ?? "?";
+    return paletteIndexFor(resolved);
+  }, [palette, seed, alt, initials]);
+  const baseName = alt || normalizedInitials || "Avatar";
+  const announcedStatus = status ? statusLabel ?? STATUS_DEFAULT_LABEL[status] : "";
+  const accessibleName = announcedStatus ? `${baseName}, ${announcedStatus}` : baseName;
+  const isClickable = Boolean(onClick);
+  const handleKeyDown = (e) => {
+    if (!isClickable) return;
+    if ((e.key === "Enter" || e.key === " ") && !e.repeat) {
+      e.preventDefault();
+      onClick?.();
+    }
+  };
+  const rootClassName = cn(
+    "ods-avatar",
+    `ods-avatar--${size}`,
+    `ods-avatar--${shape}`,
+    isClickable && "ods-avatar--clickable",
+    className
+  );
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ...rest,
+      ref,
+      className: rootClassName,
+      role: isClickable ? "button" : "img",
+      "aria-label": accessibleName,
+      tabIndex: isClickable ? 0 : void 0,
+      onClick,
+      onKeyDown: isClickable ? handleKeyDown : void 0,
+      "data-status": status,
+      children: [
+        /* @__PURE__ */ jsx2("span", { className: "ods-avatar__inner", "data-palette": paletteIdx, children: showImage ? /* @__PURE__ */ jsx2(
+          "img",
+          {
+            src,
+            alt: "",
+            className: "ods-avatar__image",
+            loading: imgLoading,
+            decoding: "async",
+            referrerPolicy,
+            onError: handleImgError,
+            draggable: false
+          }
+        ) : icon ? /* @__PURE__ */ jsx2("span", { className: "ods-avatar__icon", "aria-hidden": "true", children: icon }) : normalizedInitials ? /* @__PURE__ */ jsx2("span", { className: "ods-avatar__initials", "aria-hidden": "true", children: normalizedInitials }) : /* @__PURE__ */ jsx2("span", { className: "ods-avatar__initials", "aria-hidden": "true", children: fallback ?? "?" }) }),
+        status && // Decorative — the textual status is folded into the wrapper's
+        // aria-label above. `aria-hidden` keeps AT from double-announcing.
+        /* @__PURE__ */ jsx2(
+          "span",
+          {
+            className: cn("ods-avatar__status", `ods-avatar__status--${status}`),
+            "aria-hidden": "true"
+          }
+        )
+      ]
+    }
+  );
+});
+Avatar.displayName = "Avatar";
+var AvatarStack = forwardRef2(function AvatarStack2({ children, max, size = "md", renderOverflow, direction = "ltr", className, ...rest }, ref) {
+  const arr = Array.isArray(children) ? children : [children];
+  const visible = max && arr.length > max ? arr.slice(0, max) : arr;
+  const overflow = max && arr.length > max ? arr.length - max : 0;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ...rest,
+      ref,
+      className: cn("ods-avatar-stack", `ods-avatar-stack--${direction}`, className),
+      children: [
+        visible,
+        overflow > 0 && (renderOverflow ? renderOverflow(overflow) : /* @__PURE__ */ jsx2(
+          "div",
+          {
+            className: cn(
+              "ods-avatar",
+              `ods-avatar--${size}`,
+              "ods-avatar--circle",
+              "ods-avatar-stack__overflow"
+            ),
+            role: "img",
+            "aria-label": `${overflow} more`,
+            children: /* @__PURE__ */ jsx2("span", { className: "ods-avatar__inner", children: /* @__PURE__ */ jsxs("span", { className: "ods-avatar__initials", "aria-hidden": "true", children: [
+              "+",
+              overflow
+            ] }) })
+          }
+        ))
+      ]
+    }
+  );
+});
+AvatarStack.displayName = "AvatarStack";
+
+// src/components/BlogCard/BlogCard.tsx
+import { forwardRef as forwardRef3, useId } from "react";
+import { Fragment, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+var BlogCard = forwardRef3(function BlogCard2({
+  cover,
+  coverAspect = "16/9",
+  category,
+  tags,
+  meta,
+  readingTime,
+  title,
+  titleAs = "h3",
+  description,
+  author,
+  footer,
+  radius = "md",
+  orientation = "vertical",
+  href,
+  onClick,
+  id: providedId,
+  className,
+  ...rest
+}, ref) {
+  const reactId = useId();
+  const baseId = providedId ?? `ods-blog-card-${reactId}`;
+  const titleId = `${baseId}-title`;
+  const descId = description ? `${baseId}-desc` : void 0;
+  const tagList = tags ?? (category ? [category] : []);
+  const body = /* @__PURE__ */ jsxs2(Fragment, { children: [
+    cover && /* @__PURE__ */ jsx3(
+      "div",
+      {
+        className: cn(
+          "ods-blog-card__cover",
+          `ods-blog-card__cover--aspect-${coverAspect.replace("/", "-")}`
+        ),
+        "aria-hidden": "true",
+        children: cover
+      }
+    ),
+    /* @__PURE__ */ jsxs2("div", { className: "ods-blog-card__body", children: [
+      (tagList.length > 0 || meta || readingTime) && /* @__PURE__ */ jsxs2("div", { className: "ods-blog-card__meta", children: [
+        tagList.length > 0 && /* @__PURE__ */ jsx3("span", { className: "ods-blog-card__tags", children: tagList.map((t, i) => /* @__PURE__ */ jsx3("span", { className: "ods-blog-card__tag", children: t }, i)) }),
+        meta && /* @__PURE__ */ jsx3("span", { className: "ods-blog-card__date", children: meta }),
+        readingTime && /* @__PURE__ */ jsx3("span", { className: "ods-blog-card__reading", children: readingTime })
+      ] }),
+      /* @__PURE__ */ jsx3(Card.Title, { as: titleAs, id: titleId, className: "ods-blog-card__title", children: title }),
+      description && /* @__PURE__ */ jsx3(Card.Description, { id: descId, className: "ods-blog-card__desc", children: description }),
+      (author || footer) && /* @__PURE__ */ jsxs2("div", { className: "ods-blog-card__footer", children: [
+        author && /* @__PURE__ */ jsxs2("div", { className: "ods-blog-card__author", children: [
+          author.avatar && /* @__PURE__ */ jsx3(
+            Avatar,
+            {
+              size: "sm",
+              src: author.avatar.src,
+              initials: author.avatar.initials,
+              seed: author.avatar.seed,
+              palette: author.avatar.palette,
+              alt: author.avatar.alt ?? (typeof author.name === "string" ? author.name : void 0)
+            }
+          ),
+          /* @__PURE__ */ jsxs2("div", { className: "ods-blog-card__author-text", children: [
+            /* @__PURE__ */ jsx3("span", { className: "ods-blog-card__author-name", children: author.name }),
+            author.byline && /* @__PURE__ */ jsx3("span", { className: "ods-blog-card__author-byline", children: author.byline })
+          ] })
+        ] }),
+        footer && /* @__PURE__ */ jsx3("div", { className: "ods-blog-card__action", children: footer })
+      ] })
+    ] })
+  ] });
+  if (href) {
+    return /* @__PURE__ */ jsx3(
+      Card,
+      {
+        asChild: true,
+        radius,
+        padding: "none",
+        className: cn(
+          "ods-blog-card",
+          `ods-blog-card--${orientation}`,
+          "ods-blog-card--interactive",
+          className
+        ),
+        "aria-labelledby": titleId,
+        "aria-describedby": descId,
+        children: /* @__PURE__ */ jsx3(
+          "a",
+          {
+            ...rest,
+            ref,
+            href,
+            id: baseId,
+            onClick,
+            children: body
+          }
+        )
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx3(
+    Card,
+    {
+      ...rest,
+      ref,
+      id: baseId,
+      radius,
+      padding: "none",
+      onClick,
+      className: cn(
+        "ods-blog-card",
+        `ods-blog-card--${orientation}`,
+        onClick && "ods-blog-card--interactive",
+        className
+      ),
+      "aria-labelledby": titleId,
+      "aria-describedby": descId,
+      children: body
+    }
+  );
+});
+BlogCard.displayName = "BlogCard";
+
+// src/components/CountUp/CountUp.tsx
+import {
+  forwardRef as forwardRef4,
+  useEffect,
+  useRef,
+  useState as useState2
+} from "react";
+import { jsxs as jsxs3 } from "react/jsx-runtime";
+var easeLinear = (t) => t;
+var easeOutCubic = (t) => 1 - (1 - t) ** 3;
+var easeOutQuart = (t) => 1 - (1 - t) ** 4;
+var easeOutExpo = (t) => t === 1 ? 1 : 1 - 2 ** (-10 * t);
+var CountUp = forwardRef4(function CountUp2({
+  value,
+  from = 0,
+  duration = 800,
+  easing = easeOutCubic,
+  decimals = 0,
+  formatValue,
+  prefix,
+  suffix,
+  delay = 0,
+  disableAnimation = false,
+  onComplete,
+  className,
+  ...rest
+}, ref) {
+  const [n, setN] = useState2(disableAnimation ? value : from);
+  const lastRendered = useRef(disableAnimation ? value : from);
+  useEffect(() => {
+    const reduced = typeof window !== "undefined" && window.matchMedia?.("(prefers-reduced-motion: reduce)").matches;
+    if (disableAnimation || reduced) {
+      setN(value);
+      lastRendered.current = value;
+      onComplete?.();
+      return;
+    }
+    const startValue = lastRendered.current;
+    const delta = value - startValue;
+    if (delta === 0) return;
+    let raf = null;
+    let timeoutId = null;
+    let startTime = null;
+    let cancelled = false;
+    const tick = (ts) => {
+      if (cancelled) return;
+      if (startTime === null) startTime = ts;
+      const t = Math.min(1, (ts - startTime) / Math.max(1, duration));
+      const eased = easing(t);
+      const current = startValue + delta * eased;
+      setN(current);
+      lastRendered.current = current;
+      if (t < 1) {
+        raf = requestAnimationFrame(tick);
+      } else {
+        lastRendered.current = value;
+        setN(value);
+        onComplete?.();
+      }
+    };
+    const start = () => {
+      raf = requestAnimationFrame(tick);
+    };
+    if (delay > 0) {
+      timeoutId = window.setTimeout(start, delay);
+    } else {
+      start();
+    }
+    return () => {
+      cancelled = true;
+      if (raf !== null) cancelAnimationFrame(raf);
+      if (timeoutId !== null) window.clearTimeout(timeoutId);
+    };
+  }, [value, duration, delay, disableAnimation]);
+  const display = formatValue ? formatValue(n) : n.toFixed(decimals);
+  return /* @__PURE__ */ jsxs3(
+    "span",
+    {
+      ...rest,
+      ref,
+      className: cn("ods-count-up", className),
+      "aria-live": "polite",
+      "aria-atomic": "true",
+      children: [
+        prefix,
+        display,
+        suffix
+      ]
+    }
+  );
+});
+CountUp.displayName = "CountUp";
+
+// src/hooks/useTextareaCommands.ts
+import {
+  useCallback as useCallback2,
+  useEffect as useEffect2,
+  useMemo as useMemo2,
+  useRef as useRef2,
+  useState as useState3
+} from "react";
+function findOpenTrigger(value, caret, trigger) {
+  let i = caret - 1;
+  while (i >= 0) {
+    const ch = value[i];
+    if (ch === "\n" || ch === " " || ch === "	") return null;
+    if (value.startsWith(trigger, i)) {
+      const before = i === 0 ? "" : value[i - 1];
+      if (i === 0 || before === " " || before === "\n" || before === "	") {
+        return {
+          triggerIndex: i,
+          query: value.slice(i + trigger.length, caret)
+        };
+      }
+      return null;
+    }
+    i--;
+  }
+  return null;
+}
+function getCaretRect(textarea, caret) {
+  if (typeof document === "undefined") return null;
+  const mirror = document.createElement("div");
+  const styles = window.getComputedStyle(textarea);
+  for (const prop of [
+    "boxSizing",
+    "width",
+    "fontFamily",
+    "fontSize",
+    "fontWeight",
+    "fontStyle",
+    "letterSpacing",
+    "lineHeight",
+    "paddingTop",
+    "paddingRight",
+    "paddingBottom",
+    "paddingLeft",
+    "borderTopWidth",
+    "borderRightWidth",
+    "borderBottomWidth",
+    "borderLeftWidth",
+    "textTransform",
+    "wordSpacing",
+    "tabSize",
+    "whiteSpace"
+  ]) {
+    mirror.style[prop] = styles[prop];
+  }
+  mirror.style.position = "absolute";
+  mirror.style.visibility = "hidden";
+  mirror.style.overflow = "hidden";
+  mirror.style.top = "0";
+  mirror.style.left = "0";
+  mirror.style.whiteSpace = "pre-wrap";
+  mirror.style.wordWrap = "break-word";
+  mirror.textContent = textarea.value.slice(0, caret);
+  const marker = document.createElement("span");
+  marker.textContent = "\u200B";
+  mirror.appendChild(marker);
+  document.body.appendChild(mirror);
+  const taRect = textarea.getBoundingClientRect();
+  const markerRect = marker.getBoundingClientRect();
+  const mirrorRect = mirror.getBoundingClientRect();
+  const x = taRect.left + (markerRect.left - mirrorRect.left) - textarea.scrollLeft;
+  const y = taRect.top + (markerRect.top - mirrorRect.top) - textarea.scrollTop;
+  const out = new DOMRect(x, y, 0, markerRect.height || 16);
+  document.body.removeChild(mirror);
+  return out;
+}
+function useTextareaCommands({
+  textareaRef,
+  value,
+  onChange,
+  commands,
+  trigger = "/",
+  openOnEmptyTrigger = true,
+  maxItems = 8
+}) {
+  const [isOpen, setIsOpen] = useState3(false);
+  const [query, setQuery] = useState3("");
+  const [activeIndex, setActiveIndex] = useState3(0);
+  const [triggerIndex, setTriggerIndex] = useState3(null);
+  const [caretRect, setCaretRect] = useState3(null);
+  const dismissedAtRef = useRef2(null);
+  const items = useMemo2(() => {
+    const q = query.trim().toLowerCase();
+    if (!q) return commands.slice(0, maxItems);
+    return commands.filter((c) => {
+      const hay = [
+        typeof c.label === "string" ? c.label : "",
+        typeof c.description === "string" ? c.description : "",
+        c.id,
+        ...c.keywords ?? []
+      ].join(" ").toLowerCase();
+      return hay.includes(q);
+    }).slice(0, maxItems);
+  }, [commands, query, maxItems]);
+  useEffect2(() => {
+    const ta = textareaRef.current;
+    if (!ta) return;
+    const caret = ta.selectionStart ?? 0;
+    const dismissedAt = dismissedAtRef.current;
+    if (dismissedAt && dismissedAt.value === value && dismissedAt.caret === caret) {
+      return;
+    }
+    const found = findOpenTrigger(value, caret, trigger);
+    if (!found) {
+      if (isOpen) setIsOpen(false);
+      setTriggerIndex(null);
+      return;
+    }
+    if (dismissedAt) dismissedAtRef.current = null;
+    if (found.query.length > 0 || openOnEmptyTrigger) {
+      setQuery(found.query);
+      setTriggerIndex(found.triggerIndex);
+      setIsOpen(true);
+      setActiveIndex(0);
+      setCaretRect(getCaretRect(ta, caret));
+    }
+  }, [value, trigger, openOnEmptyTrigger, isOpen, textareaRef]);
+  const commit = useCallback2(
+    (cmd) => {
+      const ta = textareaRef.current;
+      if (!ta || triggerIndex == null) return;
+      const insertText = typeof cmd.insert === "function" ? cmd.insert(query) : cmd.insert;
+      const caret = ta.selectionStart ?? value.length;
+      const before = value.slice(0, triggerIndex);
+      const after = value.slice(caret);
+      const next = `${before}${insertText}${after}`;
+      dismissedAtRef.current = {
+        value,
+        caret
+      };
+      onChange(next);
+      setIsOpen(false);
+      setTriggerIndex(null);
+      requestAnimationFrame(() => {
+        const pos = before.length + insertText.length;
+        ta.focus();
+        ta.setSelectionRange(pos, pos);
+      });
+    },
+    [textareaRef, triggerIndex, query, value, onChange]
+  );
+  const dismiss = useCallback2(() => {
+    const ta = textareaRef.current;
+    dismissedAtRef.current = {
+      value,
+      caret: ta?.selectionStart ?? value.length
+    };
+    setIsOpen(false);
+    setTriggerIndex(null);
+  }, [textareaRef, value]);
+  const onKeyDown = useCallback2(
+    (e) => {
+      if (!isOpen) return false;
+      if (e.key === "ArrowDown") {
+        e.preventDefault();
+        setActiveIndex((i) => Math.min(items.length - 1, i + 1));
+        return true;
+      }
+      if (e.key === "ArrowUp") {
+        e.preventDefault();
+        setActiveIndex((i) => Math.max(0, i - 1));
+        return true;
+      }
+      if (e.key === "Enter" || e.key === "Tab") {
+        const pick = items[activeIndex];
+        if (pick) {
+          e.preventDefault();
+          commit(pick);
+          return true;
+        }
+      }
+      if (e.key === "Escape") {
+        e.preventDefault();
+        dismiss();
+        return true;
+      }
+      return false;
+    },
+    [isOpen, items, activeIndex, commit, dismiss]
+  );
+  return {
+    isOpen,
+    query,
+    activeIndex,
+    items,
+    onKeyDown,
+    dismiss,
+    commit,
+    caretRect
+  };
+}
+
+// src/hooks/useTextareaSelection.ts
+import { useCallback as useCallback3, useEffect as useEffect3, useState as useState4 } from "react";
+function getSelectionRect(textarea, start, end) {
+  if (typeof document === "undefined") return null;
+  if (start === end) return null;
+  const mirror = document.createElement("div");
+  const styles = window.getComputedStyle(textarea);
+  for (const prop of [
+    "boxSizing",
+    "width",
+    "fontFamily",
+    "fontSize",
+    "fontWeight",
+    "fontStyle",
+    "letterSpacing",
+    "lineHeight",
+    "paddingTop",
+    "paddingRight",
+    "paddingBottom",
+    "paddingLeft",
+    "borderTopWidth",
+    "borderRightWidth",
+    "borderBottomWidth",
+    "borderLeftWidth",
+    "textTransform",
+    "wordSpacing",
+    "tabSize",
+    "whiteSpace"
+  ]) {
+    mirror.style[prop] = styles[prop];
+  }
+  mirror.style.position = "absolute";
+  mirror.style.visibility = "hidden";
+  mirror.style.overflow = "hidden";
+  mirror.style.top = "0";
+  mirror.style.left = "0";
+  mirror.style.whiteSpace = "pre-wrap";
+  mirror.style.wordWrap = "break-word";
+  const pre = document.createTextNode(textarea.value.slice(0, start));
+  const range = document.createElement("span");
+  range.textContent = textarea.value.slice(start, end) || "\u200B";
+  const post = document.createTextNode(textarea.value.slice(end));
+  mirror.appendChild(pre);
+  mirror.appendChild(range);
+  mirror.appendChild(post);
+  document.body.appendChild(mirror);
+  const taRect = textarea.getBoundingClientRect();
+  const rangeRect = range.getBoundingClientRect();
+  const mirrorRect = mirror.getBoundingClientRect();
+  const out = new DOMRect(
+    taRect.left + (rangeRect.left - mirrorRect.left) - textarea.scrollLeft,
+    taRect.top + (rangeRect.top - mirrorRect.top) - textarea.scrollTop,
+    rangeRect.width,
+    rangeRect.height
+  );
+  document.body.removeChild(mirror);
+  return out;
+}
+function useTextareaSelection({
+  textareaRef,
+  value,
+  onChange
+}) {
+  const [start, setStart] = useState4(0);
+  const [end, setEnd] = useState4(0);
+  const [rect, setRect] = useState4(null);
+  useEffect3(() => {
+    if (typeof document === "undefined") return;
+    const handler = () => {
+      const ta = textareaRef.current;
+      if (!ta || document.activeElement !== ta) {
+        setStart(0);
+        setEnd(0);
+        setRect(null);
+        return;
+      }
+      const s = ta.selectionStart ?? 0;
+      const e = ta.selectionEnd ?? 0;
+      setStart(s);
+      setEnd(e);
+      setRect(s !== e ? getSelectionRect(ta, s, e) : null);
+    };
+    document.addEventListener("selectionchange", handler);
+    return () => document.removeEventListener("selectionchange", handler);
+  }, [textareaRef]);
+  const active = start !== end;
+  const text = active ? value.slice(start, end) : "";
+  const writeToClipboard = useCallback3(async (str) => {
+    try {
+      if (typeof navigator !== "undefined" && navigator.clipboard?.writeText) {
+        await navigator.clipboard.writeText(str);
+        return true;
+      }
+    } catch {
+    }
+    try {
+      const tmp = document.createElement("textarea");
+      tmp.value = str;
+      tmp.style.position = "fixed";
+      tmp.style.left = "-9999px";
+      document.body.appendChild(tmp);
+      tmp.select();
+      const ok = document.execCommand("copy");
+      document.body.removeChild(tmp);
+      return ok;
+    } catch {
+      return false;
+    }
+  }, []);
+  const copy = useCallback3(async () => {
+    if (!active) return false;
+    return writeToClipboard(text);
+  }, [active, text, writeToClipboard]);
+  const replace = useCallback3(
+    (str) => {
+      const ta = textareaRef.current;
+      if (!ta) return;
+      const next = value.slice(0, start) + str + value.slice(end);
+      onChange(next);
+      requestAnimationFrame(() => {
+        ta.focus();
+        const caret = start + str.length;
+        ta.setSelectionRange(caret, caret);
+      });
+    },
+    [textareaRef, value, start, end, onChange]
+  );
+  const cut = useCallback3(async () => {
+    if (!active) return false;
+    const ok = await writeToClipboard(text);
+    if (ok) replace("");
+    return ok;
+  }, [active, text, writeToClipboard, replace]);
+  const wrap = useCallback3(
+    (open, close) => {
+      const ta = textareaRef.current;
+      if (!ta) return;
+      const closing = close ?? open;
+      const before = value.slice(0, start);
+      const sel = value.slice(start, end);
+      const after = value.slice(end);
+      const next = `${before}${open}${sel}${closing}${after}`;
+      onChange(next);
+      requestAnimationFrame(() => {
+        ta.focus();
+        const newStart = start;
+        const newEnd = end + open.length + closing.length;
+        ta.setSelectionRange(newStart, newEnd);
+      });
+    },
+    [textareaRef, value, start, end, onChange]
+  );
+  return {
+    active,
+    text,
+    start,
+    end,
+    rect,
+    copy,
+    cut,
+    wrap,
+    replace
+  };
+}
+
+// src/hooks/useTextareaTools.tsx
+import {
+  CodeIcon,
+  HeadingIcon,
+  ListBulletedIcon,
+  ListNumberedIcon,
+  QuotesIcon,
+  RedoIcon,
+  TextBoldIcon,
+  TextItalicIcon,
+  TextLinkIcon,
+  TextStrikethroughIcon,
+  UndoIcon
+} from "@octaviaflow/icons";
+import { useCallback as useCallback4, useMemo as useMemo3, useRef as useRef3 } from "react";
+import { jsx as jsx4 } from "react/jsx-runtime";
+function useTextareaTools({
+  textareaRef,
+  value,
+  onChange,
+  tools
+}) {
+  const valueRef = useRef3(value);
+  valueRef.current = value;
+  const helpers = useMemo3(() => {
+    const getTa = () => textareaRef.current;
+    const getSelection = () => {
+      const ta = getTa();
+      const s = ta?.selectionStart ?? 0;
+      const e = ta?.selectionEnd ?? 0;
+      return {
+        text: valueRef.current.slice(s, e),
+        start: s,
+        end: e,
+        active: s !== e
+      };
+    };
+    const setValue = (next) => onChange(next);
+    const replace = (text) => {
+      const ta = getTa();
+      if (!ta) return;
+      const { start, end } = getSelection();
+      const next = valueRef.current.slice(0, start) + text + valueRef.current.slice(end);
+      onChange(next);
+      requestAnimationFrame(() => {
+        ta.focus();
+        const caret = start + text.length;
+        ta.setSelectionRange(caret, caret);
+      });
+    };
+    const insert = (text) => replace(text);
+    const wrap = (open, close) => {
+      const ta = getTa();
+      if (!ta) return;
+      const closing = close ?? open;
+      const { start, end } = getSelection();
+      const sel = valueRef.current.slice(start, end);
+      const next = valueRef.current.slice(0, start) + open + sel + closing + valueRef.current.slice(end);
+      onChange(next);
+      requestAnimationFrame(() => {
+        ta.focus();
+        if (start === end) {
+          const caret = start + open.length;
+          ta.setSelectionRange(caret, caret);
+        } else {
+          ta.setSelectionRange(start, end + open.length + closing.length);
+        }
+      });
+    };
+    const prependLines = (prefix) => {
+      const ta = getTa();
+      if (!ta) return;
+      const { start, end } = getSelection();
+      const v = valueRef.current;
+      const lineStart = v.lastIndexOf("\n", start - 1) + 1;
+      const lineEnd = (() => {
+        const idx = v.indexOf("\n", end);
+        return idx === -1 ? v.length : idx;
+      })();
+      const block = v.slice(lineStart, lineEnd);
+      const updated = block.split("\n").map((line) => `${prefix}${line}`).join("\n");
+      const next = v.slice(0, lineStart) + updated + v.slice(lineEnd);
+      onChange(next);
+      requestAnimationFrame(() => {
+        ta.focus();
+        ta.setSelectionRange(lineStart, lineStart + updated.length);
+      });
+    };
+    const undo = () => {
+      try {
+        getTa()?.focus();
+        document.execCommand("undo");
+      } catch {
+      }
+    };
+    const redo = () => {
+      try {
+        getTa()?.focus();
+        document.execCommand("redo");
+      } catch {
+      }
+    };
+    return {
+      get value() {
+        return valueRef.current;
+      },
+      get selection() {
+        return getSelection();
+      },
+      setValue,
+      replace,
+      insert,
+      wrap,
+      prependLines,
+      undo,
+      redo,
+      getTextarea: getTa
+    };
+  }, [textareaRef, onChange]);
+  const visibleTools = useMemo3(
+    () => tools.filter((t) => t.isVisible ? t.isVisible(helpers) : true),
+    [tools, helpers]
+  );
+  const runTool = useCallback4(
+    async (id) => {
+      const tool = tools.find((t) => t.id === id);
+      if (!tool || tool.kind === "divider") return;
+      await tool.onAction?.(helpers);
+    },
+    [tools, helpers]
+  );
+  return { tools: visibleTools, runTool, helpers };
+}
+var wrapTool = (id, open, close, label, icon, title) => ({
+  id,
+  label,
+  icon,
+  title,
+  onAction: (h) => h.wrap(open, close)
+});
+var prependLineTool = (id, prefix, label, icon, title) => ({
+  id,
+  label,
+  icon,
+  title,
+  onAction: (h) => h.prependLines(prefix)
+});
+var textareaTools = {
+  bold: () => wrapTool("bold", "**", "**", "Bold", /* @__PURE__ */ jsx4(TextBoldIcon, {}), "Bold (\u2318B)"),
+  italic: () => wrapTool("italic", "*", "*", "Italic", /* @__PURE__ */ jsx4(TextItalicIcon, {}), "Italic (\u2318I)"),
+  strikethrough: () => wrapTool("strike", "~~", "~~", "Strikethrough", /* @__PURE__ */ jsx4(TextStrikethroughIcon, {}), "Strikethrough"),
+  code: () => wrapTool("code", "`", "`", "Code", /* @__PURE__ */ jsx4(CodeIcon, {}), "Inline code"),
+  codeBlock: () => ({
+    id: "code-block",
+    label: "Code block",
+    icon: /* @__PURE__ */ jsx4(CodeIcon, {}),
+    title: "Code block",
+    onAction: (h) => h.wrap("```\n", "\n```")
+  }),
+  link: () => ({
+    id: "link",
+    label: "Link",
+    icon: /* @__PURE__ */ jsx4(TextLinkIcon, {}),
+    title: "Insert link",
+    onAction: (h) => {
+      const sel = h.selection;
+      const text = sel.active ? sel.text : "link text";
+      h.replace(`[${text}](https://)`);
+    }
+  }),
+  /** Heading. Defaults to H2. Pass a `level` (1–6) to override. */
+  heading: (level = 2) => prependLineTool(
+    `heading-${level}`,
+    `${"#".repeat(level)} `,
+    `H${level}`,
+    /* @__PURE__ */ jsx4(HeadingIcon, {}),
+    `Heading ${level}`
+  ),
+  bulletList: () => prependLineTool("ul", "- ", "Bullet list", /* @__PURE__ */ jsx4(ListBulletedIcon, {}), "Bullet list"),
+  numberedList: () => prependLineTool("ol", "1. ", "Numbered list", /* @__PURE__ */ jsx4(ListNumberedIcon, {}), "Numbered list"),
+  quote: () => prependLineTool("quote", "> ", "Quote", /* @__PURE__ */ jsx4(QuotesIcon, {}), "Quote"),
+  undo: () => ({
+    id: "undo",
+    label: "Undo",
+    icon: /* @__PURE__ */ jsx4(UndoIcon, {}),
+    title: "Undo (\u2318Z)",
+    onAction: (h) => h.undo()
+  }),
+  redo: () => ({
+    id: "redo",
+    label: "Redo",
+    icon: /* @__PURE__ */ jsx4(RedoIcon, {}),
+    title: "Redo (\u2318\u21E7Z)",
+    onAction: (h) => h.redo()
+  }),
+  divider: (id = "divider") => ({
+    id: `${id}-${Math.random().toString(36).slice(2, 8)}`,
+    label: "",
+    kind: "divider"
+  })
+};
+
+// src/components/Textarea/Textarea.tsx
+import { CopyIcon, CutIcon } from "@octaviaflow/icons";
+import {
+  forwardRef as forwardRef5,
+  useEffect as useEffect4,
+  useId as useId2,
+  useRef as useRef4,
+  useState as useState5
+} from "react";
+import { useTextField } from "react-aria";
+import { createPortal } from "react-dom";
+import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+var Textarea = forwardRef5(function Textarea2({
+  label,
+  error = false,
+  errorMessage,
+  helperText,
+  resize = "vertical",
+  autoResize = false,
+  minRows,
+  maxRows,
+  maxHeight,
+  maxWidth,
+  minHeight,
+  minWidth,
+  maxLength,
+  size = "md",
+  rows = 3,
+  disabled = false,
+  className,
+  style: consumerStyle,
+  defaultValue,
+  value,
+  onChange,
+  id: providedId,
+  commands,
+  commandTrigger = "/",
+  selectionToolbar = false,
+  selectionActions,
+  tools,
+  toolbarPosition = "top",
+  ...props
+}, forwardedRef) {
+  const innerRef = useRef4(null);
+  const setRef = (node) => {
+    innerRef.current = node;
+    if (typeof forwardedRef === "function") forwardedRef(node);
+    else if (forwardedRef) forwardedRef.current = node;
+  };
+  const reactId = useId2();
+  const baseId = providedId ?? `ods-textarea-${reactId}`;
+  const hintId = error && errorMessage || helperText ? `${baseId}-hint` : void 0;
+  const [charCount, setCharCount] = useState5(() => String(value ?? defaultValue ?? "").length);
+  const ariaNameProps = resolveAccessibleName({
+    label: typeof label === "string" ? label : void 0,
+    ariaLabel: props["aria-label"],
+    ariaLabelledby: props["aria-labelledby"],
+    componentName: "Textarea"
+  });
+  const { labelProps, inputProps } = useTextField(
+    {
+      label: typeof label === "string" ? label : void 0,
+      ...ariaNameProps,
+      isDisabled: disabled,
+      errorMessage: typeof errorMessage === "string" ? errorMessage : void 0,
+      validationState: error ? "invalid" : void 0,
+      inputElementType: "textarea",
+      value,
+      defaultValue
+    },
+    innerRef
+  );
+  const describedBy = [props["aria-describedby"], hintId].filter(Boolean).join(" ") || void 0;
+  const handleChange = (e) => {
+    setCharCount(e.target.value.length);
+    onChange?.(e);
+  };
+  const [liveValue, setLiveValue] = useState5(String(value ?? defaultValue ?? ""));
+  useEffect4(() => {
+    if (value != null) setLiveValue(String(value));
+  }, [value]);
+  const handleChangeWithMirror = (e) => {
+    setLiveValue(e.target.value);
+    handleChange(e);
+  };
+  const setLiveAndCommit = (next) => {
+    setLiveValue(next);
+    if (innerRef.current) innerRef.current.value = next;
+    onChange?.({
+      target: innerRef.current,
+      currentTarget: innerRef.current
+    });
+    setCharCount(next.length);
+  };
+  const cmdPalette = useTextareaCommands({
+    textareaRef: innerRef,
+    value: liveValue,
+    onChange: setLiveAndCommit,
+    commands: commands ?? [],
+    trigger: commandTrigger
+  });
+  const cmdEnabled = (commands?.length ?? 0) > 0;
+  const sel = useTextareaSelection({
+    textareaRef: innerRef,
+    value: liveValue,
+    onChange: setLiveAndCommit
+  });
+  const toolbar = useTextareaTools({
+    textareaRef: innerRef,
+    value: liveValue,
+    onChange: setLiveAndCommit,
+    tools: tools ?? []
+  });
+  const toolbarEnabled = (tools?.length ?? 0) > 0;
+  const handleKeyDownWithCommands = (e) => {
+    if (cmdEnabled) {
+      const consumed = cmdPalette.onKeyDown(e);
+      if (consumed) return;
+    }
+    props.onKeyDown?.(e);
+  };
+  useEffect4(() => {
+    if (!autoResize) return;
+    const el = innerRef.current;
+    if (!el) return;
+    const computed = window.getComputedStyle(el);
+    const fontSize = parseFloat(computed.fontSize) || 16;
+    const lhRaw = computed.lineHeight;
+    const lh = lhRaw === "normal" ? fontSize * 1.2 : lhRaw.endsWith("px") ? parseFloat(lhRaw) : parseFloat(lhRaw) * fontSize;
+    const padding = parseFloat(computed.paddingTop) + parseFloat(computed.paddingBottom);
+    const rowCap = maxRows != null && Number.isFinite(maxRows) ? lh * maxRows + padding : Number.POSITIVE_INFINITY;
+    const pixelCap = typeof maxHeight === "number" ? maxHeight : Number.POSITIVE_INFINITY;
+    const effectiveMax = Math.min(rowCap, pixelCap);
+    const rowFloor = lh * (minRows ?? rows) + padding;
+    el.style.height = "auto";
+    const target = Math.max(rowFloor, Math.min(effectiveMax, el.scrollHeight));
+    el.style.height = `${target}px`;
+    el.style.overflowY = el.scrollHeight > effectiveMax ? "auto" : "hidden";
+  }, [autoResize, value, defaultValue, minRows, maxRows, maxHeight, rows]);
+  const resolvedResize = typeof resize === "boolean" ? resize ? "vertical" : "none" : resize;
+  const toCss = (v) => v == null ? void 0 : typeof v === "number" ? `${v}px` : v;
+  const fieldStyle = {
+    maxHeight: toCss(maxHeight),
+    maxWidth: toCss(maxWidth),
+    minHeight: toCss(minHeight),
+    minWidth: toCss(minWidth),
+    resize: resolvedResize
+  };
+  return /* @__PURE__ */ jsxs4(
+    "div",
+    {
+      className: cn(
+        "ods-textarea",
+        `ods-textarea--${size}`,
+        `ods-textarea--resize-${resolvedResize}`,
+        autoResize && "ods-textarea--auto-resize",
+        error && "ods-textarea--error",
+        disabled && "ods-textarea--disabled",
+        className
+      ),
+      style: consumerStyle,
+      children: [
+        label && /* @__PURE__ */ jsx5("label", { ...labelProps, htmlFor: baseId, className: "ods-textarea__label", children: label }),
+        toolbarEnabled && toolbarPosition === "top" && /* @__PURE__ */ jsx5(TextareaToolbar, { tools: toolbar.tools, onRun: toolbar.runTool }),
+        /* @__PURE__ */ jsxs4("div", { className: "ods-textarea__wrapper", children: [
+          /* @__PURE__ */ jsx5(
+            "textarea",
+            {
+              ...props,
+              ...inputProps,
+              ref: setRef,
+              id: baseId,
+              rows: autoResize ? minRows ?? rows : rows,
+              disabled,
+              maxLength,
+              defaultValue,
+              value,
+              onChange: handleChangeWithMirror,
+              onKeyDown: handleKeyDownWithCommands,
+              className: "ods-textarea__field",
+              style: fieldStyle,
+              "aria-invalid": error || void 0,
+              "aria-describedby": describedBy,
+              "aria-autocomplete": cmdEnabled ? "list" : void 0,
+              "aria-expanded": cmdEnabled ? cmdPalette.isOpen : void 0,
+              "aria-controls": cmdEnabled && cmdPalette.isOpen ? `${baseId}-cmd-list` : void 0,
+              "aria-activedescendant": cmdEnabled && cmdPalette.isOpen && cmdPalette.items[cmdPalette.activeIndex] ? `${baseId}-cmd-${cmdPalette.items[cmdPalette.activeIndex].id}` : void 0
+            }
+          ),
+          cmdEnabled && cmdPalette.isOpen && cmdPalette.items.length > 0 && typeof document !== "undefined" && createPortal(
+            /* @__PURE__ */ jsx5(
+              "ul",
+              {
+                id: `${baseId}-cmd-list`,
+                role: "listbox",
+                "aria-label": "Inline commands",
+                className: "ods-textarea__cmd-popover",
+                style: {
+                  position: "fixed",
+                  top: (cmdPalette.caretRect?.bottom ?? 0) + 6,
+                  left: cmdPalette.caretRect?.left ?? 0
+                },
+                children: cmdPalette.items.map((c, i) => /* @__PURE__ */ jsxs4(
+                  "li",
+                  {
+                    id: `${baseId}-cmd-${c.id}`,
+                    role: "option",
+                    "aria-selected": i === cmdPalette.activeIndex,
+                    className: cn(
+                      "ods-textarea__cmd-item",
+                      i === cmdPalette.activeIndex && "ods-textarea__cmd-item--active"
+                    ),
+                    onMouseDown: (e) => {
+                      e.preventDefault();
+                      cmdPalette.commit(c);
+                    },
+                    onMouseEnter: () => {
+                    },
+                    children: [
+                      c.icon && /* @__PURE__ */ jsx5("span", { className: "ods-textarea__cmd-icon", children: c.icon }),
+                      /* @__PURE__ */ jsxs4("span", { className: "ods-textarea__cmd-text", children: [
+                        /* @__PURE__ */ jsx5("span", { className: "ods-textarea__cmd-label", children: c.label }),
+                        c.description && /* @__PURE__ */ jsx5("span", { className: "ods-textarea__cmd-desc", children: c.description })
+                      ] })
+                    ]
+                  },
+                  c.id
+                ))
+              }
+            ),
+            document.body
+          ),
+          selectionToolbar && sel.active && sel.rect && typeof document !== "undefined" && createPortal(
+            /* @__PURE__ */ jsxs4(
+              "div",
+              {
+                role: "toolbar",
+                "aria-label": "Selection actions",
+                className: "ods-textarea__sel-toolbar",
+                style: {
+                  position: "fixed",
+                  top: sel.rect.top - 36,
+                  left: sel.rect.left
+                },
+                onMouseDown: (e) => e.preventDefault(),
+                children: [
+                  /* @__PURE__ */ jsx5(
+                    "button",
+                    {
+                      type: "button",
+                      className: "ods-textarea__sel-btn",
+                      onClick: () => sel.copy(),
+                      "aria-label": "Copy selection",
+                      title: "Copy",
+                      children: /* @__PURE__ */ jsx5(CopyIcon, { size: "xs" })
+                    }
+                  ),
+                  /* @__PURE__ */ jsx5(
+                    "button",
+                    {
+                      type: "button",
+                      className: "ods-textarea__sel-btn",
+                      onClick: () => sel.cut(),
+                      "aria-label": "Cut selection",
+                      title: "Cut",
+                      children: /* @__PURE__ */ jsx5(CutIcon, { size: "xs" })
+                    }
+                  ),
+                  selectionActions?.map((a) => /* @__PURE__ */ jsxs4(
+                    "button",
+                    {
+                      type: "button",
+                      className: "ods-textarea__sel-btn",
+                      onClick: () => a.onAction(sel.text, {
+                        replace: sel.replace,
+                        wrap: sel.wrap,
+                        copy: sel.copy,
+                        cut: sel.cut
+                      }),
+                      title: typeof a.label === "string" ? a.label : void 0,
+                      children: [
+                        a.icon,
+                        a.label && /* @__PURE__ */ jsx5("span", { className: "ods-textarea__sel-btn-label", children: a.label })
+                      ]
+                    },
+                    a.id
+                  ))
+                ]
+              }
+            ),
+            document.body
+          ),
+          maxLength != null && /* @__PURE__ */ jsxs4(
+            "span",
+            {
+              className: "ods-textarea__count",
+              "aria-live": charCount > maxLength ? "polite" : "off",
+              children: [
+                charCount,
+                "/",
+                maxLength
+              ]
+            }
+          )
+        ] }),
+        toolbarEnabled && toolbarPosition === "bottom" && /* @__PURE__ */ jsx5(TextareaToolbar, { tools: toolbar.tools, onRun: toolbar.runTool }),
+        error && errorMessage ? /* @__PURE__ */ jsx5("div", { id: hintId, className: "ods-textarea__error-message", role: "alert", children: errorMessage }) : helperText ? /* @__PURE__ */ jsx5("div", { id: hintId, className: "ods-textarea__hint", children: helperText }) : null
+      ]
+    }
+  );
+});
+Textarea.displayName = "Textarea";
+function TextareaToolbar({
+  tools,
+  onRun
+}) {
+  return /* @__PURE__ */ jsx5(
+    "div",
+    {
+      role: "toolbar",
+      "aria-label": "Formatting",
+      className: "ods-textarea__toolbar",
+      onMouseDown: (e) => {
+        if (e.target.closest(".ods-textarea__toolbar-btn")) {
+          e.preventDefault();
+        }
+      },
+      children: tools.map((t) => {
+        if (t.kind === "divider") {
+          return /* @__PURE__ */ jsx5("span", { className: "ods-textarea__toolbar-divider", "aria-hidden": "true" }, t.id);
+        }
+        return /* @__PURE__ */ jsx5(
+          "button",
+          {
+            type: "button",
+            className: "ods-textarea__toolbar-btn",
+            title: t.title ?? (typeof t.label === "string" ? t.label : void 0),
+            "aria-label": typeof t.label === "string" ? t.label : t.id,
+            onClick: () => onRun(t.id),
+            children: t.icon ? /* @__PURE__ */ jsx5("span", { className: "ods-textarea__toolbar-icon", children: t.icon }) : /* @__PURE__ */ jsx5("span", { className: "ods-textarea__toolbar-text", children: t.label })
+          },
+          t.id
+        );
+      })
+    }
+  );
+}
+
+// src/components/TestimonialCard/TestimonialCard.tsx
+import { QuotesIcon as QuotesIcon2, StarFilledIcon, StarIcon } from "@octaviaflow/icons";
+import { forwardRef as forwardRef6, useId as useId3 } from "react";
+import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+function isAuthorObject(v) {
+  return typeof v === "object" && v !== null && !("type" in v) && // exclude React elements
+  "name" in v;
+}
+var TestimonialCard = forwardRef6(
+  function TestimonialCard2({
+    quote,
+    author,
+    role: legacyRole,
+    avatar: legacyAvatar,
+    initial: legacyInitial,
+    rating,
+    logo,
+    size = "md",
+    radius = "md",
+    id: providedId,
+    className,
+    ...rest
+  }, ref) {
+    const reactId = useId3();
+    const baseId = providedId ?? `ods-testimonial-${reactId}`;
+    const quoteId = `${baseId}-quote`;
+    const authorId = `${baseId}-author`;
+    const resolved = isAuthorObject(author) ? author : {
+      name: author,
+      role: legacyRole,
+      avatar: legacyAvatar ? void 0 : {
+        initials: typeof legacyInitial === "string" ? legacyInitial : typeof author === "string" ? author.charAt(0).toUpperCase() : void 0
+      }
+    };
+    const renderAvatar = () => {
+      if (!isAuthorObject(author) && legacyAvatar) {
+        return /* @__PURE__ */ jsx6(
+          "span",
+          {
+            className: "ods-testimonial__avatar ods-testimonial__avatar--legacy",
+            "aria-hidden": "true",
+            children: legacyAvatar
+          }
+        );
+      }
+      return /* @__PURE__ */ jsx6(
+        Avatar,
+        {
+          size: size === "sm" ? "xs" : size === "lg" ? "md" : "sm",
+          src: resolved.avatar?.src,
+          initials: resolved.avatar?.initials,
+          seed: resolved.avatar?.seed,
+          palette: resolved.avatar?.palette,
+          alt: resolved.avatar?.alt ?? (typeof resolved.name === "string" ? resolved.name : void 0),
+          className: "ods-testimonial__avatar"
+        }
+      );
+    };
+    return /* @__PURE__ */ jsxs5(
+      Card,
+      {
+        ...rest,
+        ref,
+        id: baseId,
+        radius,
+        padding: "none",
+        variant: "subtle",
+        className: cn("ods-testimonial", `ods-testimonial--${size}`, className),
+        "aria-labelledby": authorId,
+        "aria-describedby": quoteId,
+        children: [
+          /* @__PURE__ */ jsxs5("div", { className: "ods-testimonial__head", children: [
+            /* @__PURE__ */ jsx6("span", { className: "ods-testimonial__quote", "aria-hidden": "true", children: /* @__PURE__ */ jsx6(QuotesIcon2, { size: "md" }) }),
+            logo && /* @__PURE__ */ jsx6("span", { className: "ods-testimonial__logo", "aria-hidden": "true", children: logo })
+          ] }),
+          /* @__PURE__ */ jsx6("blockquote", { id: quoteId, className: "ods-testimonial__text", children: quote }),
+          typeof rating === "number" && /* @__PURE__ */ jsx6(
+            "div",
+            {
+              className: "ods-testimonial__rating",
+              role: "img",
+              "aria-label": `${rating} out of 5 stars`,
+              children: Array.from({ length: 5 }).map(
+                (_, i) => i < Math.round(rating) ? /* @__PURE__ */ jsx6(
+                  StarFilledIcon,
+                  {
+                    size: "xs",
+                    className: "ods-testimonial__star ods-testimonial__star--on"
+                  },
+                  i
+                ) : /* @__PURE__ */ jsx6(StarIcon, { size: "xs", className: "ods-testimonial__star" }, i)
+              )
+            }
+          ),
+          /* @__PURE__ */ jsxs5("figcaption", { className: "ods-testimonial__author", id: authorId, children: [
+            renderAvatar(),
+            /* @__PURE__ */ jsxs5("span", { className: "ods-testimonial__author-info", children: [
+              /* @__PURE__ */ jsx6("span", { className: "ods-testimonial__author-name", children: resolved.name }),
+              resolved.role && /* @__PURE__ */ jsx6("span", { className: "ods-testimonial__author-role", children: resolved.role })
+            ] })
+          ] })
+        ]
+      }
+    );
+  }
+);
+TestimonialCard.displayName = "TestimonialCard";
+
+export {
+  Card,
+  CardHeader,
+  CardBody,
+  CardFooter,
+  CardTitle,
+  CardDescription,
+  AVATAR_PALETTE_SIZE,
+  avatarPaletteIndex,
+  Avatar,
+  AvatarStack,
+  BlogCard,
+  easeLinear,
+  easeOutCubic,
+  easeOutQuart,
+  easeOutExpo,
+  CountUp,
+  useTextareaCommands,
+  useTextareaSelection,
+  useTextareaTools,
+  textareaTools,
+  Textarea,
+  TestimonialCard
+};
+//# sourceMappingURL=chunk-ZALBYWCU.js.map