@haklex/rich-editor-ui 0.0.93 → 0.0.95

package/dist/index.mjs

@@ -1,12 +1,14 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { useState, useRef, useCallback, useEffect, createContext, use, createElement, useSyncExternalStore } from "react";
-import { ChevronDown, Check, X } from "lucide-react";
+import { AlertCircle, AlertTriangle, Info, Check, Copy, ChevronDown, ChevronRight, X, ChevronUp } from "lucide-react";
+import { useState, useRef, useCallback, useEffect, forwardRef, useImperativeHandle, useMemo, createContext, use, createElement, useSyncExternalStore } from "react";
+import { Collapsible as Collapsible$1 } from "@base-ui/react/collapsible";
 import { Popover as Popover$1 } from "@base-ui/react/popover";
 import { PortalThemeWrapper, PortalThemeProvider } from "@haklex/rich-style-token";
 import { PortalThemeProvider as PortalThemeProvider2, PortalThemeWrapper as PortalThemeWrapper2, usePortalTheme } from "@haklex/rich-style-token";
 import { Combobox as Combobox$1 } from "@base-ui/react/combobox";
 import { Dialog as Dialog$1 } from "@base-ui/react/dialog";
 import { Menu } from "@base-ui/react/menu";
+import { Select as Select$1 } from "@base-ui/react/select";
 import { Tooltip } from "@base-ui/react/tooltip";
 function toPrimitive(t, r) {
   if ("object" != typeof t || !t) return t;
@@ -114,7 +116,7 @@ var createRuntimeFn = (config) => {
 };
 var semanticClassNames = { actionBar: "re-ui-action-bar", actionButton: "re-ui-action-btn", actionButtonEnd: "re-ui-action-btn--end", actionButtonDanger: "re-ui-action-btn--danger", actionButtonIcon: "re-ui-action-btn--icon" };
 var actionBar = "_73ej2i0";
-var actionButton = createRuntimeFn({ defaultClassName: "_73ej2i1", variantClassNames: { variant: { ghost: "_73ej2i2", solid: "_73ej2i3", outline: "_73ej2i4", accent: "_73ej2i5" }, size: { sm: "_73ej2i6", md: "_73ej2i7", lg: "_73ej2i8" }, icon: { true: "_73ej2i9", false: "_73ej2ia" }, end: { true: "_73ej2ib", false: "_73ej2ic" }, danger: { true: "_73ej2id", false: "_73ej2ie" } }, defaultVariants: { variant: "ghost", size: "sm", icon: false, end: false, danger: false }, compoundVariants: [[{ icon: true, size: "sm" }, "_73ej2if"], [{ icon: true, size: "md" }, "_73ej2ig"], [{ icon: true, size: "lg" }, "_73ej2ih"], [{ danger: true }, "_73ej2ii"]] });
+var actionButton = createRuntimeFn({ defaultClassName: "_73ej2i1", variantClassNames: { variant: { ghost: "_73ej2i2", solid: "_73ej2i3", outline: "_73ej2i4", accent: "_73ej2i5" }, size: { sm: "_73ej2i6", md: "_73ej2i7", lg: "_73ej2i8" }, icon: { true: "_73ej2i9", false: "_73ej2ia" }, end: { true: "_73ej2ib", false: "_73ej2ic" }, danger: { true: "_73ej2id", false: "_73ej2ie" }, rounded: { true: "_73ej2if", false: "_73ej2ig" } }, defaultVariants: { variant: "ghost", size: "sm", icon: false, end: false, danger: false, rounded: false }, compoundVariants: [[{ icon: true, size: "sm" }, "_73ej2ih"], [{ icon: true, size: "md" }, "_73ej2ii"], [{ icon: true, size: "lg" }, "_73ej2ij"], [{ rounded: true, icon: true }, "_73ej2ik"], [{ danger: true }, "_73ej2il"]] });
 function ActionBar({ className, gap, style, ...props }) {
   return /* @__PURE__ */ jsx(
     "div",
@@ -131,6 +133,7 @@ function ActionButton({
   end = false,
   danger = false,
   icon = false,
+  rounded = false,
   className,
   type = "button",
   ...props
@@ -139,7 +142,7 @@ function ActionButton({
   if (end) semanticParts.push(semanticClassNames.actionButtonEnd);
   if (danger) semanticParts.push(semanticClassNames.actionButtonDanger);
   if (icon) semanticParts.push(semanticClassNames.actionButtonIcon);
-  const recipeClass = actionButton({ variant, size, end, danger, icon });
+  const recipeClass = actionButton({ variant, size, end, danger, icon, rounded });
   return /* @__PURE__ */ jsx(
     "button",
     {
@@ -152,6 +155,23 @@ function ActionButton({
 function getActionButtonClassName(options) {
   return `${actionButton(options)} ${semanticClassNames.actionButton}`;
 }
+var alert = createRuntimeFn({ defaultClassName: "_15r7gwx0", variantClassNames: { variant: { info: "_15r7gwx1", warning: "_15r7gwx2", error: "_15r7gwx3" } }, defaultVariants: { variant: "info" }, compoundVariants: [] });
+var alertContent = "_15r7gwx4";
+var alertIcon = "_15r7gwx5";
+var alertAction = "_15r7gwx6";
+const icons = {
+  info: Info,
+  warning: AlertTriangle,
+  error: AlertCircle
+};
+function Alert({ variant, children, action, className }) {
+  const IconComponent = icons[variant];
+  return /* @__PURE__ */ jsxs("div", { className: `${alert({ variant })}${className ? ` ${className}` : ""}`, role: "alert", children: [
+    /* @__PURE__ */ jsx(IconComponent, { className: alertIcon }),
+    /* @__PURE__ */ jsx("div", { className: alertContent, children }),
+    action && /* @__PURE__ */ jsx("div", { className: alertAction, children: action })
+  ] });
+}
 var root$1 = "iryuae0";
 var tablist = "iryuae1";
 var tab = "iryuae2";
@@ -230,6 +250,49 @@ function AnimatedTabs({ tabs, defaultTab, value, onChange, className }) {
     )
   ] });
 }
+var textarea = "_1b25hgb0";
+var overflowing = "_1b25hgb1";
+const AutoResizeTextArea = forwardRef(
+  function AutoResizeTextArea2({ maxRows = 6, minRows = 1, className, onInput, ...props }, ref) {
+    const innerRef = useRef(null);
+    useImperativeHandle(ref, () => innerRef.current);
+    const resize = useCallback(() => {
+      const el = innerRef.current;
+      if (!el) return;
+      el.style.height = "auto";
+      const lineHeight = Number.parseFloat(getComputedStyle(el).lineHeight) || 21;
+      const maxHeight = lineHeight * maxRows + 16;
+      const scrollHeight = el.scrollHeight;
+      if (scrollHeight > maxHeight) {
+        el.style.height = `${maxHeight}px`;
+        el.classList.add(overflowing);
+      } else {
+        el.style.height = `${scrollHeight}px`;
+        el.classList.remove(overflowing);
+      }
+    }, [maxRows]);
+    useEffect(() => {
+      resize();
+    }, [resize, props.value]);
+    return /* @__PURE__ */ jsx(
+      "textarea",
+      {
+        className: `${textarea}${className ? ` ${className}` : ""}`,
+        ref: innerRef,
+        rows: minRows,
+        onInput: (e) => {
+          resize();
+          onInput?.(e);
+        },
+        ...props
+      }
+    );
+  }
+);
+var badge = createRuntimeFn({ defaultClassName: "_1vt0sm10", variantClassNames: { variant: { neutral: "_1vt0sm11", success: "_1vt0sm12", error: "_1vt0sm13", warning: "_1vt0sm14", info: "_1vt0sm15" }, size: { sm: "_1vt0sm16", md: "_1vt0sm17" } }, defaultVariants: { variant: "neutral", size: "sm" }, compoundVariants: [] });
+function Badge({ variant, size, children, className }) {
+  return /* @__PURE__ */ jsx("span", { className: `${badge({ variant, size })}${className ? ` ${className}` : ""}`, children });
+}
 var root = "_10muorc2";
 var rootDisabled = "_10muorc3";
 var box = "_10muorc4";
@@ -334,6 +397,255 @@ function AnimatedCheckbox({
     }
   );
 }
+const languageToColorMap = {
+  javascript: "#f7df1e",
+  js: "#f7df1e",
+  typescript: "#3178c6",
+  ts: "#3178c6",
+  jsx: "#61dafb",
+  tsx: "#61dafb",
+  html: "#e34f26",
+  css: "#1572b6",
+  scss: "#cc6699",
+  json: "#f59e0b",
+  markdown: "#737373",
+  md: "#737373",
+  bash: "#4eaa25",
+  sh: "#4eaa25",
+  shell: "#4eaa25",
+  zsh: "#4eaa25",
+  python: "#3776ab",
+  py: "#3776ab",
+  rust: "#dea584",
+  go: "#00add8",
+  java: "#b07219",
+  c: "#a8b9cc",
+  cpp: "#00599c",
+  "c++": "#00599c",
+  swift: "#fa7343",
+  kotlin: "#7f52ff",
+  yaml: "#cb171e",
+  yml: "#cb171e",
+  sql: "#e38c00"
+};
+function normalizeLanguage(lang2) {
+  if (!lang2) return "text";
+  return lang2.trim().toLowerCase() || "text";
+}
+function getLanguageDisplayName(lang2) {
+  if (lang2 === "text") return "TEXT";
+  return lang2.toUpperCase();
+}
+var card = "_1gq8hf90";
+var lang = "_1gq8hf91";
+var copyButton = "_1gq8hf92";
+var bodyBackground = "_1gq8hf93";
+var bodyBackgroundStatic = "_1gq8hf94 _1gq8hf93";
+var scroll = "_1gq8hf95";
+var scrollCollapsed = "_1gq8hf96";
+var expandWrap = "_1gq8hf97";
+var expandButton = "_1gq8hf98";
+var lined = "_1gq8hf99";
+var linedWithNumbers = "_1gq8hf9a";
+const CopyIcon = /* @__PURE__ */ jsx(Copy, { size: 16 });
+const CheckIcon$1 = /* @__PURE__ */ jsx(Check, { size: 16 });
+const ExpandIcon = /* @__PURE__ */ jsx(ChevronDown, { size: 14 });
+function CodeBlockCard({
+  children,
+  className,
+  code,
+  collapsible = true,
+  language,
+  showCopyButton = true,
+  static: staticMode = false
+}) {
+  const normalizedLanguage = normalizeLanguage(language);
+  const languageLabel = getLanguageDisplayName(normalizedLanguage);
+  const accent = languageToColorMap[normalizedLanguage] || "#737373";
+  const [copied, setCopied] = useState(false);
+  const copyTimerRef = useRef(void 0);
+  const [isCollapsed, setIsCollapsed] = useState(true);
+  const [isOverflow, setIsOverflow] = useState(false);
+  const scrollRef = useRef(null);
+  useEffect(() => {
+    if (!collapsible) {
+      setIsOverflow(false);
+      return;
+    }
+    const el = scrollRef.current;
+    if (!el) return;
+    const check = () => {
+      const halfVh = window.innerHeight / 2;
+      setIsOverflow(el.scrollHeight >= halfVh);
+    };
+    const raf = requestAnimationFrame(check);
+    return () => cancelAnimationFrame(raf);
+  }, [children, code, collapsible]);
+  useEffect(() => () => clearTimeout(copyTimerRef.current), []);
+  const handleCopy = useCallback(() => {
+    navigator.clipboard.writeText(code).then(() => {
+      setCopied(true);
+      clearTimeout(copyTimerRef.current);
+      copyTimerRef.current = setTimeout(() => setCopied(false), 2e3);
+    }).catch(() => {
+    });
+  }, [code]);
+  const cardStyle = useMemo(() => ({ "--rr-code-accent": accent }), [accent]);
+  const scrollClassName = [
+    scroll,
+    collapsible && isCollapsed && isOverflow && scrollCollapsed
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `${card}${className ? ` ${className}` : ""}`,
+      style: cardStyle,
+      children: [
+        language && normalizedLanguage !== "text" && /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: lang, children: /* @__PURE__ */ jsx("span", { children: languageLabel }) }),
+        showCopyButton && /* @__PURE__ */ jsx(
+          "button",
+          {
+            "aria-label": copied ? "Copied" : "Copy code",
+            className: copyButton,
+            type: "button",
+            onClick: handleCopy,
+            children: copied ? CheckIcon$1 : CopyIcon
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: staticMode ? bodyBackgroundStatic : bodyBackground, children: [
+          /* @__PURE__ */ jsx("div", { className: scrollClassName, ref: scrollRef, children }),
+          collapsible && isOverflow && isCollapsed && /* @__PURE__ */ jsx("div", { className: expandWrap, children: /* @__PURE__ */ jsxs(
+            "button",
+            {
+              className: expandButton,
+              type: "button",
+              onClick: () => setIsCollapsed(false),
+              children: [
+                ExpandIcon,
+                /* @__PURE__ */ jsx("span", { children: "Expand" })
+              ]
+            }
+          ) })
+        ] })
+      ]
+    }
+  );
+}
+let highlighterPromise = null;
+function getHighlighter() {
+  if (!highlighterPromise) {
+    highlighterPromise = import("shiki/bundle/web").then(
+      (mod) => mod.createHighlighter({
+        langs: [],
+        themes: ["github-light", "github-dark"]
+      })
+    );
+  }
+  return highlighterPromise;
+}
+async function getHighlighterWithLang(language) {
+  const highlighter = await getHighlighter();
+  if (language && language !== "text" && language !== "plaintext") {
+    const loaded = highlighter.getLoadedLanguages();
+    if (!loaded.includes(language)) {
+      try {
+        await highlighter.loadLanguage(language);
+      } catch {
+      }
+    }
+  }
+  return highlighter;
+}
+const SHIKI_DUAL_THEMES = {
+  light: "github-light",
+  dark: "github-dark"
+};
+function CodeBlock({
+  className,
+  collapsible = true,
+  code,
+  language,
+  showCopyButton = true,
+  showLineNumbers = false
+}) {
+  const normalizedLanguage = normalizeLanguage(language);
+  const [html, setHtml] = useState(null);
+  useEffect(() => {
+    let cancelled = false;
+    setHtml(null);
+    (async () => {
+      const highlighter = await getHighlighterWithLang(normalizedLanguage);
+      if (cancelled) return;
+      const loaded = highlighter.getLoadedLanguages();
+      const lang2 = loaded.includes(normalizedLanguage) ? normalizedLanguage : "text";
+      const result = highlighter.codeToHtml(code, {
+        lang: lang2,
+        themes: SHIKI_DUAL_THEMES
+      });
+      if (!cancelled) {
+        setHtml(result);
+      }
+    })();
+    return () => {
+      cancelled = true;
+    };
+  }, [code, normalizedLanguage]);
+  const fallbackLines = useMemo(() => code.split("\n"), [code]);
+  const linedClassName = [
+    showLineNumbers && lined,
+    showLineNumbers && linedWithNumbers
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx(
+    CodeBlockCard,
+    {
+      className,
+      code,
+      collapsible,
+      language,
+      showCopyButton,
+      static: true,
+      children: html ? /* @__PURE__ */ jsx("div", { className: linedClassName, dangerouslySetInnerHTML: { __html: html } }) : /* @__PURE__ */ jsx("pre", { className: linedClassName, children: /* @__PURE__ */ jsx("code", { children: fallbackLines.map((line, i) => /* @__PURE__ */ jsx("span", { className: "line", children: line }, i)) }) })
+    }
+  );
+}
+var trigger$1 = "_1hdi6a90";
+var chevron = "_1hdi6a91";
+var panel$1 = "_1hdi6a92";
+function Collapsible(props) {
+  return /* @__PURE__ */ jsx(Collapsible$1.Root, { ...props });
+}
+function CollapsibleTrigger({
+  children,
+  className,
+  hideChevron,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    Collapsible$1.Trigger,
+    {
+      ...props,
+      className: `${trigger$1}${className ? ` ${className}` : ""}`,
+      children: [
+        !hideChevron && /* @__PURE__ */ jsx(ChevronRight, { className: chevron }),
+        children
+      ]
+    }
+  );
+}
+function CollapsiblePanel({
+  children,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Collapsible$1.Panel,
+    {
+      ...props,
+      className: `${panel$1}${className ? ` ${className}` : ""}`,
+      children
+    }
+  );
+}
 function getStrictContext(name) {
   const Context = createContext(void 0);
   const Provider = ({
@@ -349,7 +661,7 @@ function getStrictContext(name) {
   };
   return [Provider, useSafeContext];
 }
-var popup$4 = "f2q44l2";
+var popup$5 = "f2q44l2";
 var arrow = "f2q44l3";
 var title$1 = "f2q44l4";
 var description$1 = "f2q44l5";
@@ -382,7 +694,7 @@ function PopoverPopup({
   return /* @__PURE__ */ jsx(
     Popover$1.Popup,
     {
-      className: `${popup$4}${className ? ` ${className}` : ""}`,
+      className: `${popup$5}${className ? ` ${className}` : ""}`,
       ...props,
       children
     }
@@ -497,12 +809,15 @@ function ColorPicker({ currentColor, onSelect, className }) {
     )) }) })
   ] });
 }
-var popup$3 = "_2buwsh0";
-var item$2 = "_2buwsh1";
+var popup$4 = "_2buwsh0";
+var item$3 = "_2buwsh1";
 var empty = "_2buwsh2";
 function Combobox(props) {
   return /* @__PURE__ */ jsx(Combobox$1.Root, { ...props });
 }
+function ComboboxTrigger({ className, ...props }) {
+  return /* @__PURE__ */ jsx(Combobox$1.Trigger, { className, ...props });
+}
 function ComboboxInput({ className, ...props }) {
   return /* @__PURE__ */ jsx(Combobox$1.Input, { className, ...props });
 }
@@ -531,7 +846,7 @@ function ComboboxContent({
       children: /* @__PURE__ */ jsx(
         Combobox$1.Popup,
         {
-          className: `${popup$3}${className ? ` ${className}` : ""}`,
+          className: `${popup$4}${className ? ` ${className}` : ""}`,
           ...popupProps,
           children
         }
@@ -546,7 +861,7 @@ function ComboboxItem({ className, ...props }) {
   return /* @__PURE__ */ jsx(
     Combobox$1.Item,
     {
-      className: `${item$2}${className ? ` ${className}` : ""}`,
+      className: `${item$3}${className ? ` ${className}` : ""}`,
       ...props
     }
   );
@@ -570,7 +885,7 @@ function ComboboxGroupLabel(props) {
   return /* @__PURE__ */ jsx(Combobox$1.GroupLabel, { ...props });
 }
 var backdrop = "vwlngv4";
-var popup$2 = "vwlngv5";
+var popup$3 = "vwlngv5";
 var closeButton = "vwlngv6";
 var header = "vwlngv7";
 var headerContent = "vwlngv8";
@@ -613,7 +928,7 @@ function DialogPopup({
     /* @__PURE__ */ jsxs(
       Dialog$1.Popup,
       {
-        className: `${popup$2}${className ? ` ${className}` : ""}`,
+        className: `${popup$3}${className ? ` ${className}` : ""}`,
         ...props,
         children: [
           children,
@@ -876,7 +1191,7 @@ const DialogStackEntry = ({ item: item2, index }) => {
           Dialog$1.Popup,
           {
             suppressHydrationWarning: true,
-            className: `${popup$2}${className ? ` ${className}` : ""}`,
+            className: `${popup$3}${className ? ` ${className}` : ""}`,
             "data-theme": theme,
             style: { zIndex: zIndex + 1 },
             children: [
@@ -905,10 +1220,10 @@ const DialogStackProvider = ({ children }) => {
     )
   ] });
 };
-var popup$1 = "oih0op0";
-var positioner$1 = "oih0op1";
-var item$1 = "oih0op2";
-var separator = "_1sxaacb2";
+var popup$2 = "oih0op0";
+var positioner$2 = "oih0op1";
+var item$2 = "oih0op2";
+var separator$1 = "_1sxaacb2";
 var label = "_1sxaacb3";
 var checkboxItem = "oih0op3";
 var radioItem = "oih0op3";
@@ -938,7 +1253,7 @@ function DropdownMenuContent({
     {
       align,
       alignOffset,
-      className: positioner$1,
+      className: positioner$2,
       "data-slot": "dropdown-menu-positioner",
       positionMethod,
       side,
@@ -947,7 +1262,7 @@ function DropdownMenuContent({
       children: /* @__PURE__ */ jsx(
         Menu.Popup,
         {
-          className: `${popup$1}${className ? ` ${className}` : ""}`,
+          className: `${popup$2}${className ? ` ${className}` : ""}`,
           "data-slot": "dropdown-menu-content",
           ...popupProps,
           children
@@ -973,7 +1288,7 @@ function DropdownMenuItem({ className, ...props }) {
   return /* @__PURE__ */ jsx(
     Menu.Item,
     {
-      className: `${item$1}${className ? ` ${className}` : ""}`,
+      className: `${item$2}${className ? ` ${className}` : ""}`,
       "data-slot": "dropdown-menu-item",
       ...props
     }
@@ -983,7 +1298,7 @@ function DropdownMenuSeparator({ className, ...props }) {
   return /* @__PURE__ */ jsx(
     Menu.Separator,
     {
-      className: `${separator}${className ? ` ${className}` : ""}`,
+      className: `${separator$1}${className ? ` ${className}` : ""}`,
       "data-slot": "dropdown-menu-separator",
       ...props
     }
@@ -1000,7 +1315,7 @@ function DropdownMenuRadioItem({
   return /* @__PURE__ */ jsxs(
     Menu.RadioItem,
     {
-      className: `${item$1} ${radioItem}${className ? ` ${className}` : ""}`,
+      className: `${item$2} ${radioItem}${className ? ` ${className}` : ""}`,
       "data-slot": "dropdown-menu-radio-item",
       ...props,
       children: [
@@ -1025,7 +1340,7 @@ function DropdownMenuCheckboxItem({
   return /* @__PURE__ */ jsxs(
     Menu.CheckboxItem,
     {
-      className: `${item$1} ${checkboxItem}${className ? ` ${className}` : ""}`,
+      className: `${item$2} ${checkboxItem}${className ? ` ${className}` : ""}`,
       "data-slot": "dropdown-menu-checkbox-item",
       ...props,
       children: [
@@ -1045,9 +1360,41 @@ function DropdownMenuCheckboxItem({
 function CheckIcon() {
   return /* @__PURE__ */ jsx(Check, { size: 16 });
 }
+var scrollArea = "_1y5k2ih0";
+function ScrollArea({
+  children,
+  className,
+  autoScrollToBottom = false,
+  scrollRef
+}) {
+  const innerRef = useRef(null);
+  const ref = scrollRef ?? innerRef;
+  const isAtBottomRef = useRef(true);
+  const handleScroll = useCallback(() => {
+    const el = ref.current;
+    if (!el) return;
+    const threshold = 40;
+    isAtBottomRef.current = el.scrollHeight - el.scrollTop - el.clientHeight < threshold;
+  }, [ref]);
+  useEffect(() => {
+    if (!autoScrollToBottom) return;
+    const el = ref.current;
+    if (!el || !isAtBottomRef.current) return;
+    el.scrollTo({ top: el.scrollHeight, behavior: "smooth" });
+  });
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: `${scrollArea}${className ? ` ${className}` : ""}`,
+      ref,
+      onScroll: autoScrollToBottom ? handleScroll : void 0,
+      children
+    }
+  );
+}
 var container = createRuntimeFn({ defaultClassName: "_6d8tz20", variantClassNames: { size: { sm: "_6d8tz21", md: "_6d8tz22" }, fullWidth: { true: "_6d8tz23", false: "_6d8tz24" } }, defaultVariants: { size: "sm", fullWidth: false }, compoundVariants: [] });
 var indicator = createRuntimeFn({ defaultClassName: "_6d8tz25", variantClassNames: { ready: { true: "_6d8tz26", false: "_6d8tz27" } }, defaultVariants: { ready: true }, compoundVariants: [] });
-var item = createRuntimeFn({ defaultClassName: "_6d8tz28", variantClassNames: { size: { sm: "_6d8tz29", md: "_6d8tz2a" }, active: { true: "_6d8tz2b", false: "_6d8tz2c" }, disabled: { true: "_6d8tz2d", false: "_6d8tz2e" }, fullWidth: { true: "_6d8tz2f", false: "_6d8tz2g" } }, defaultVariants: { size: "sm", active: false, disabled: false, fullWidth: false }, compoundVariants: [] });
+var item$1 = createRuntimeFn({ defaultClassName: "_6d8tz28", variantClassNames: { size: { sm: "_6d8tz29", md: "_6d8tz2a" }, active: { true: "_6d8tz2b", false: "_6d8tz2c" }, disabled: { true: "_6d8tz2d", false: "_6d8tz2e" }, fullWidth: { true: "_6d8tz2f", false: "_6d8tz2g" } }, defaultVariants: { size: "sm", active: false, disabled: false, fullWidth: false }, compoundVariants: [] });
 function SegmentedControl({
   items,
   value,
@@ -1138,37 +1485,144 @@ function SegmentedControl({
             }
           }
         ),
-        items.map((item$12) => {
-          const isActive = item$12.value === value;
+        items.map((item2) => {
+          const isActive = item2.value === value;
           return /* @__PURE__ */ jsx(
             "button",
             {
               "aria-selected": isActive,
               "data-active": isActive || void 0,
-              disabled: item$12.disabled,
+              disabled: item2.disabled,
               role: "tab",
               tabIndex: isActive ? 0 : -1,
               type: "button",
-              className: item({
+              className: item$1({
                 size,
                 active: isActive,
-                disabled: Boolean(item$12.disabled),
+                disabled: Boolean(item2.disabled),
                 fullWidth
               }),
               ref: (el) => {
-                if (el) itemElementsRef.current.set(item$12.value, el);
-                else itemElementsRef.current.delete(item$12.value);
+                if (el) itemElementsRef.current.set(item2.value, el);
+                else itemElementsRef.current.delete(item2.value);
               },
-              onClick: () => onChange(item$12.value),
-              children: item$12.label
+              onClick: () => onChange(item2.value),
+              children: item2.label
             },
-            item$12.value
+            item2.value
           );
         })
       ]
     }
   );
 }
+var triggerButton = "p74a622";
+var triggerIcon = "p74a623";
+var positioner$1 = "p74a624";
+var popup$1 = "p74a625";
+var group = "p74a626";
+var item = "p74a627";
+var itemIndicator = "p74a628";
+var groupLabel = "p74a629";
+var separator = "p74a62a";
+var scrollButton = "p74a62b";
+function Select(props) {
+  return /* @__PURE__ */ jsx(Select$1.Root, { ...props });
+}
+function SelectTrigger({ children, className, ...props }) {
+  return /* @__PURE__ */ jsxs(
+    Select$1.Trigger,
+    {
+      ...props,
+      className: `${triggerButton}${className ? ` ${className}` : ""}`,
+      children: [
+        children,
+        /* @__PURE__ */ jsx(Select$1.Icon, { className: triggerIcon, children: /* @__PURE__ */ jsx(ChevronDown, { size: 16 }) })
+      ]
+    }
+  );
+}
+function SelectValue(props) {
+  return /* @__PURE__ */ jsx(Select$1.Value, { ...props });
+}
+function SelectContent({
+  children,
+  className,
+  align = "center",
+  alignItemWithTrigger = true,
+  side = "bottom",
+  sideOffset = 4,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(Select$1.Portal, { children: /* @__PURE__ */ jsx(PortalThemeWrapper, { children: /* @__PURE__ */ jsx(
+    Select$1.Positioner,
+    {
+      align,
+      alignItemWithTrigger,
+      className: positioner$1,
+      side,
+      sideOffset,
+      children: /* @__PURE__ */ jsxs(
+        Select$1.Popup,
+        {
+          ...props,
+          className: `${popup$1}${className ? ` ${className}` : ""}`,
+          children: [
+            /* @__PURE__ */ jsx(Select$1.ScrollUpArrow, { className: scrollButton, children: /* @__PURE__ */ jsx(ChevronUp, { size: 16 }) }),
+            /* @__PURE__ */ jsx(Select$1.List, { children }),
+            /* @__PURE__ */ jsx(Select$1.ScrollDownArrow, { className: scrollButton, children: /* @__PURE__ */ jsx(ChevronDown, { size: 16 }) })
+          ]
+        }
+      )
+    }
+  ) }) });
+}
+function SelectItem({ className, children, ...props }) {
+  return /* @__PURE__ */ jsxs(Select$1.Item, { ...props, className: `${item}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsx(Select$1.ItemText, { children }),
+    /* @__PURE__ */ jsx(Select$1.ItemIndicator, { className: itemIndicator, children: /* @__PURE__ */ jsx(Check, { size: 16 }) })
+  ] });
+}
+function SelectGroup({ className, ...props }) {
+  return /* @__PURE__ */ jsx(Select$1.Group, { ...props, className: `${group}${className ? ` ${className}` : ""}` });
+}
+function SelectGroupLabel({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    Select$1.GroupLabel,
+    {
+      ...props,
+      className: `${groupLabel}${className ? ` ${className}` : ""}`
+    }
+  );
+}
+function SelectSeparator({ className }) {
+  return /* @__PURE__ */ jsx("div", { className: `${separator}${className ? ` ${className}` : ""}` });
+}
+var spinner = createRuntimeFn({ defaultClassName: "_131cfek1", variantClassNames: { size: { sm: "_131cfek2", md: "_131cfek3" } }, defaultVariants: { size: "sm" }, compoundVariants: [] });
+function Spinner({ size, className }) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      "aria-hidden": "true",
+      className: `${spinner({ size })}${className ? ` ${className}` : ""}`,
+      role: "status"
+    }
+  );
+}
+var statusDotWrapper = "_73cmpa1";
+var dot = createRuntimeFn({ defaultClassName: "_73cmpa2", variantClassNames: { status: { idle: "_73cmpa3", active: "_73cmpa4", success: "_73cmpa5", error: "_73cmpa6", warning: "_73cmpa7" }, size: { sm: "_73cmpa8", md: "_73cmpa9" } }, defaultVariants: { status: "idle", size: "sm" }, compoundVariants: [] });
+var pulseRing = createRuntimeFn({ defaultClassName: "_73cmpaa", variantClassNames: { status: { idle: "_73cmpab", active: "_73cmpac", success: "_73cmpad", error: "_73cmpae", warning: "_73cmpaf" }, size: { sm: "_73cmpag", md: "_73cmpah" } }, defaultVariants: { status: "idle", size: "sm" }, compoundVariants: [] });
+function StatusDot({
+  status,
+  pulse: showPulse,
+  size,
+  className
+}) {
+  return /* @__PURE__ */ jsxs("span", { className: `${statusDotWrapper}${className ? ` ${className}` : ""}`, children: [
+    showPulse && /* @__PURE__ */ jsx("span", { className: pulseRing({ status, size }) }),
+    /* @__PURE__ */ jsx("span", { className: dot({ status, size }) })
+  ] });
+}
 var positioner = "_1cspf2m2";
 var popup = "_1cspf2m3";
 function TooltipProvider(props) {
@@ -1245,8 +1699,15 @@ function ViewportGate({
 export {
   ActionBar,
   ActionButton,
+  Alert,
   AnimatedCheckbox,
   AnimatedTabs,
+  AutoResizeTextArea,
+  Badge,
+  CodeBlock,
+  Collapsible,
+  CollapsiblePanel,
+  CollapsibleTrigger,
   ColorPicker,
   Combobox,
   ComboboxContent,
@@ -1257,6 +1718,7 @@ export {
   ComboboxItem,
   ComboboxItemIndicator,
   ComboboxList,
+  ComboboxTrigger,
   Dialog,
   DialogBackdrop,
   DialogClose,
@@ -1290,7 +1752,18 @@ export {
   PopoverTrigger,
   PortalThemeProvider2 as PortalThemeProvider,
   PortalThemeWrapper2 as PortalThemeWrapper,
+  ScrollArea,
   SegmentedControl,
+  Select,
+  SelectContent,
+  SelectGroup,
+  SelectGroupLabel,
+  SelectItem,
+  SelectSeparator,
+  SelectTrigger,
+  SelectValue,
+  Spinner,
+  StatusDot,
   TooltipContent,
   TooltipPopup,
   TooltipPortal,