@sofya-ds/react 1.13.1 → 1.14.0

package/dist/index.js

@@ -107,26 +107,42 @@ import * as React2 from "react";
 // src/components/icon-data.ts
 import {
   IconAdjustmentsHorizontalFilled,
+  IconActivity,
+  IconActivityHeartbeat,
   IconAlignCenter,
   IconAlignJustified,
   IconAlignLeft,
   IconAlignRight,
+  IconAlertCircle,
   IconArrowUp,
   IconArchive,
   IconBold,
+  IconBrain,
   IconBuildingHospital,
   IconBooks,
   IconBulb,
   IconChartBar,
   IconCheck,
   IconChecklist,
+  IconClipboardList,
+  IconClipboardText,
   IconCode,
+  IconFileText,
+  IconFlask,
+  IconHeartbeat,
   IconItalic,
   IconLink,
   IconList,
+  IconListCheck,
   IconListNumbers,
+  IconNotes,
+  IconPill,
   IconQuote,
+  IconReportMedical,
   IconStrikethrough,
+  IconStethoscope,
+  IconTable,
+  IconTemperature,
   IconUnderline,
   IconChevronLeft,
   IconChevronDown,
@@ -166,26 +182,42 @@ import {
 } from "@tabler/icons-react";
 var tablerIconRegistry = {
   IconAdjustmentsHorizontalFilled,
+  IconActivity,
+  IconActivityHeartbeat,
   IconAlignCenter,
   IconAlignJustified,
   IconAlignLeft,
   IconAlignRight,
+  IconAlertCircle,
   IconArrowUp,
   IconArchive,
   IconBold,
+  IconBrain,
   IconBuildingHospital,
   IconBooks,
   IconBulb,
   IconChartBar,
   IconCheck,
   IconChecklist,
+  IconClipboardList,
+  IconClipboardText,
   IconCode,
+  IconFileText,
+  IconFlask,
+  IconHeartbeat,
   IconItalic,
   IconLink,
   IconList,
+  IconListCheck,
   IconListNumbers,
+  IconNotes,
+  IconPill,
   IconQuote,
+  IconReportMedical,
   IconStrikethrough,
+  IconStethoscope,
+  IconTable,
+  IconTemperature,
   IconUnderline,
   IconChevronLeft,
   IconChevronDown,
@@ -253,6 +285,7 @@ var legacyIconToTablerNameMap = {
   "lightbulb": "IconBulb",
   "chats": "IconMessages",
   "file": "IconFile",
+  "file-text": "IconFileText",
   "folders": "IconFolders",
   "sparkle": "IconSparkles",
   "x": "IconX",
@@ -260,6 +293,21 @@ var legacyIconToTablerNameMap = {
   "search": "IconSearch",
   "arrow-up": "IconArrowUp",
   "question": "IconHelpCircle",
+  "activity": "IconActivity",
+  "activity-heartbeat": "IconActivityHeartbeat",
+  "alert-circle": "IconAlertCircle",
+  "brain": "IconBrain",
+  "clipboard-list": "IconClipboardList",
+  "clipboard-text": "IconClipboardText",
+  "flask": "IconFlask",
+  "heartbeat": "IconHeartbeat",
+  "list-check": "IconListCheck",
+  "notes": "IconNotes",
+  "pill": "IconPill",
+  "report-medical": "IconReportMedical",
+  "stethoscope": "IconStethoscope",
+  "table": "IconTable",
+  "temperature": "IconTemperature",
   "user-filled": "IconUserFilled",
   "caret-up": "IconChevronUp",
   "caret-left": "IconChevronLeft",
@@ -475,8 +523,10 @@ var defaultElements = {
   "body-md": "p",
   "body-sm": "p",
   body: "p",
+  "clinical-body": "p",
   "label-md": "span",
   "settings-section-title": "span",
+  "clinical-section-title": "span",
   "section-label": "span",
   "eyebrow-md": "span",
   "overline-md": "span",
@@ -504,7 +554,7 @@ var textSizeStyles = Object.fromEntries(
       fontWeight: `var(--sofya-text-${size}-font-weight)`,
       lineHeight: `var(--sofya-text-${size}-line-height)`,
       letterSpacing: `var(--sofya-text-${size}-letter-spacing)`,
-      ...size === "settings-section-title" ? { textTransform: "uppercase" } : {}
+      ...size === "settings-section-title" || size === "clinical-section-title" ? { textTransform: "uppercase" } : {}
     }
   ])
 );
@@ -2575,7 +2625,7 @@ function FieldShell({
 // src/components/input-upload.tsx
 import * as React14 from "react";
 import {
-  IconFileText,
+  IconFileText as IconFileText2,
   IconPhoto,
   IconUpload,
   IconVideo
@@ -2706,7 +2756,7 @@ function UploadFileTypeGlyph({
     );
   }
   return /* @__PURE__ */ jsx15(
-    IconFileText,
+    IconFileText2,
     {
       "aria-hidden": "true",
       className: cn("inline-block shrink-0 align-middle", className)
@@ -4994,11 +5044,1424 @@ var RichTextToolbarButton = React31.forwardRef(function RichTextToolbarButton2({
 });
 RichTextToolbarButton.displayName = "RichTextToolbarButton";
 
-// src/components/right-rail-action.tsx
+// src/components/reasoning-widget.tsx
 import * as React32 from "react";
-import { jsx as jsx34 } from "react/jsx-runtime";
-var RightRailAction = React32.forwardRef(
-  ({ active = false, className, icon, ...props }, ref) => /* @__PURE__ */ jsx34(
+import { jsx as jsx34, jsxs as jsxs17 } from "react/jsx-runtime";
+var reasoningWidgetToneOptions = [
+  "default",
+  "info",
+  "success",
+  "warning",
+  "critical",
+  "muted"
+];
+var reasoningWidgetDensityOptions = ["default", "compact"];
+var reasoningWidgetVariantOptions = [
+  "flat",
+  "outline",
+  "muted",
+  "suggestion"
+];
+var reasoningWidgetActionScopeOptions = ["item", "widget"];
+var reasoningWidgetActionToneOptions = [
+  "primary",
+  "neutral",
+  "danger"
+];
+var reasoningWidgetTableAlignOptions = [
+  "left",
+  "center",
+  "right"
+];
+var reasoningWidgetTableColumnVariantOptions = [
+  "default",
+  "value"
+];
+var reasoningWidgetFrameOptions = ["bordered", "minimal"];
+var ReasoningWidgetDensityContext = React32.createContext("default");
+var actionIconNames = {
+  accept: "check",
+  add: "plus",
+  edit: "edit",
+  reject: "x",
+  remove: "trash"
+};
+var actionToneById = {
+  accept: "primary",
+  add: "primary",
+  edit: "neutral",
+  reject: "danger",
+  remove: "danger"
+};
+var actionVariantByTone = {
+  danger: "destructive",
+  neutral: "ghost",
+  primary: "subtle"
+};
+var toneSurfaceClassName = {
+  default: "border-[color:var(--sofya-neutral-600)] bg-card",
+  info: "border-[color:var(--sofya-tone-info-border)] bg-[color:var(--sofya-tone-info-background)]",
+  success: "border-[color:var(--sofya-tone-success-border)] bg-[color:var(--sofya-tone-success-background)]",
+  warning: "border-[color:var(--sofya-tone-warning-border)] bg-[color:var(--sofya-tone-warning-background)]",
+  critical: "border-[color:var(--sofya-tone-destructive-border)] bg-[color:var(--sofya-tone-destructive-background)]",
+  muted: "border-[color:var(--sofya-neutral-600)] bg-card"
+};
+var clinicalToneMarkerClassName = {
+  default: "bg-[color:var(--sofya-neutral-600)]",
+  info: "bg-secondary",
+  success: "bg-[color:var(--sofya-tag-green)]",
+  warning: "bg-[color:var(--sofya-tag-red)]",
+  critical: "bg-[color:var(--sofya-tag-red)]",
+  muted: "bg-[color:var(--sofya-neutral-600)]"
+};
+var clinicalToneSurfaceClassName = {
+  default: "bg-transparent",
+  info: "bg-[color:var(--sofya-neutral-50)]",
+  success: "bg-transparent",
+  warning: "bg-transparent",
+  critical: "bg-transparent",
+  muted: "bg-transparent"
+};
+var clinicalToneStatusClassName = {
+  default: "text-[color:var(--sofya-text-subtle)]",
+  info: "text-secondary",
+  success: "text-[color:var(--sofya-tag-green)]",
+  warning: "text-[color:var(--sofya-tag-red)]",
+  critical: "text-[color:var(--sofya-tag-red)]",
+  muted: "text-[color:var(--sofya-text-subtle)]"
+};
+var clinicalToneValueClassName = {
+  default: "text-[color:var(--sofya-neutral-900)]",
+  info: "text-[color:var(--sofya-neutral-900)]",
+  success: "text-[color:var(--sofya-neutral-900)]",
+  warning: "text-[color:var(--sofya-tag-red)]",
+  critical: "text-[color:var(--sofya-tag-red)]",
+  muted: "text-[color:var(--sofya-neutral-900)]"
+};
+var clinicalToneBadgeClassName = {
+  default: "bg-[color:var(--sofya-neutral-50)] text-[color:var(--sofya-text-subtle)]",
+  info: "bg-[color:var(--sofya-neutral-50)] text-secondary",
+  success: "bg-[color:var(--sofya-agent-mint)] text-[color:var(--sofya-tag-green)]",
+  warning: "bg-[color:var(--sofya-tag-sand)] text-[color:var(--sofya-tag-red)]",
+  critical: "bg-[color:var(--sofya-tag-sand)] text-[color:var(--sofya-tag-red)]",
+  muted: "bg-[color:var(--sofya-neutral-50)] text-[color:var(--sofya-text-subtle)]"
+};
+var clinicalDataFrameClassName = {
+  bordered: "w-full overflow-hidden rounded-[var(--sofya-radius-lg)] border border-[color:var(--sofya-neutral-600)] bg-card",
+  minimal: "w-full overflow-hidden rounded-[var(--sofya-radius-md)] border-0 bg-[color:var(--sofya-neutral-50)]"
+};
+var clinicalDataHeaderClassName = {
+  bordered: "border-b border-[color:var(--sofya-neutral-600)] bg-[color:var(--sofya-neutral-50)]",
+  minimal: "border-b border-[color:var(--sofya-neutral-600)] bg-transparent"
+};
+var clinicalLabsFrameClassName = {
+  bordered: "w-full overflow-x-auto overflow-y-hidden rounded-[var(--sofya-radius-lg)] border border-[color:var(--sofya-neutral-600)] bg-card",
+  minimal: "w-fit max-w-full overflow-x-auto overflow-y-hidden rounded-[var(--sofya-radius-md)] border-0 bg-[color:var(--sofya-neutral-50)]"
+};
+var tableAlignClassName = {
+  center: "text-center",
+  left: "text-left",
+  right: "text-right"
+};
+function isWidgetAction(action) {
+  return action.scope === "widget";
+}
+function isItemAction(action) {
+  return action.scope !== "widget";
+}
+function getActionIcon(action) {
+  if (action.icon) {
+    return action.icon;
+  }
+  return actionIconNames[action.id] ?? "square-toggle";
+}
+function getActionTone(action) {
+  if (action.tone) {
+    return action.tone;
+  }
+  return actionToneById[action.id] ?? "neutral";
+}
+function getTargetLabel(target) {
+  if (!target) {
+    return void 0;
+  }
+  if ("label" in target) {
+    return typeof target.label === "string" || typeof target.label === "number" ? String(target.label) : target.id;
+  }
+  return target.id;
+}
+function getActionLabel(action, target) {
+  if (action.ariaLabel) {
+    return action.ariaLabel;
+  }
+  const targetLabel = getTargetLabel(target);
+  return targetLabel ? `${action.label} ${targetLabel}` : action.label;
+}
+function getItemsFromDescriptor(widget) {
+  return widget.items ?? widget.data?.items ?? [];
+}
+function getDescriptionFromDescriptor(widget) {
+  return widget.description ?? widget.data?.description;
+}
+function getEmptyLabelFromDescriptor(widget) {
+  return widget.emptyLabel ?? widget.data?.emptyLabel;
+}
+function getFrameFromDescriptor(widget) {
+  return widget.frame ?? widget.data?.frame;
+}
+function getDescriptorKind(widget) {
+  return `${widget.component ?? ""} ${widget.type ?? ""}`.toLowerCase();
+}
+function getIconFromDescriptor(widget) {
+  if (widget.icon) {
+    return widget.icon;
+  }
+  const descriptorKind = getDescriptorKind(widget);
+  if (descriptorKind.includes("summary") || descriptorKind.includes("impression") || hasRenderableNode(widget.data?.impression)) {
+    return "stethoscope";
+  }
+  if (descriptorKind.includes("vitals")) {
+    return "activity-heartbeat";
+  }
+  if (descriptorKind.includes("question")) {
+    return "question";
+  }
+  if (descriptorKind.includes("prescription") || descriptorKind.includes("medication")) {
+    return "pill";
+  }
+  if (descriptorKind.includes("lab")) {
+    return "flask";
+  }
+  if (descriptorKind.includes("alert")) {
+    return "alert-circle";
+  }
+  if (widget.data?.tableColumns && widget.data.rows) {
+    return "table";
+  }
+  return "clipboard-list";
+}
+function hasRenderableNode(value) {
+  return value !== null && value !== void 0 && value !== false;
+}
+function isEditableTextValue(value) {
+  return typeof value === "string" || typeof value === "number";
+}
+function ReasoningEditableText({
+  as = "span",
+  ariaLabel,
+  className,
+  editable = false,
+  multiline = false,
+  onCommit,
+  size,
+  value,
+  weight
+}) {
+  if (!editable || !isEditableTextValue(value)) {
+    return renderTextContent(value, {
+      as,
+      className,
+      size,
+      weight
+    });
+  }
+  const initialValue = String(value);
+  return /* @__PURE__ */ jsx34(
+    Text,
+    {
+      as,
+      "aria-label": ariaLabel,
+      className: cn(
+        "rounded-[4px] text-inherit outline-none transition-[background-color,box-shadow] duration-sofya ease-sofya",
+        "-mx-1 px-1 hover:bg-[color:var(--sofya-surface-hover)] focus-visible:bg-card focus-visible:ring-2 focus-visible:ring-[color:var(--sofya-focus-ring-strong)]",
+        multiline ? "whitespace-pre-wrap" : "truncate",
+        className
+      ),
+      contentEditable: true,
+      "data-editable": "true",
+      role: "textbox",
+      size,
+      spellCheck: true,
+      suppressContentEditableWarning: true,
+      tabIndex: 0,
+      weight,
+      onBlur: (event) => {
+        const nextValue = event.currentTarget.textContent ?? "";
+        if (nextValue !== initialValue) {
+          onCommit?.(nextValue);
+        }
+      },
+      onKeyDown: (event) => {
+        if (event.key === "Enter" && !multiline) {
+          event.preventDefault();
+          event.currentTarget.blur();
+        }
+      },
+      children: initialValue
+    }
+  );
+}
+var ReasoningWidgetActionButton = React32.forwardRef(function ReasoningWidgetActionButton2({ action, className, disabled, onAction, target, widgetId, ...props }, ref) {
+  const tone = getActionTone(action);
+  return /* @__PURE__ */ jsx34(
+    IconButton,
+    {
+      ref,
+      "aria-label": getActionLabel(
+        action,
+        target
+      ),
+      "data-action-id": action.id,
+      "data-action-scope": action.scope,
+      disabled: disabled ?? action.disabled,
+      icon: /* @__PURE__ */ jsx34(Icon, { name: getActionIcon(action), size: "sm" }),
+      size: "sm",
+      variant: actionVariantByTone[tone],
+      className: cn(
+        "rounded-[var(--sofya-radius-sm)] text-[color:var(--sofya-text-soft)]",
+        tone === "primary" && "text-primary",
+        className
+      ),
+      onClick: () => {
+        onAction?.({
+          action,
+          target,
+          widgetId
+        });
+      },
+      ...props
+    }
+  );
+});
+var ReasoningWidgetActions = React32.forwardRef(function ReasoningWidgetActions2({
+  actions = [],
+  className,
+  onAction,
+  reveal = "widget-hover",
+  target,
+  widgetId,
+  ...props
+}, ref) {
+  if (actions.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx34(
+    "div",
+    {
+      ref,
+      "data-slot": "reasoning-widget-actions",
+      "data-reveal": reveal,
+      className: cn(
+        "z-10 flex shrink-0 items-center gap-1 transition-opacity duration-sofya ease-sofya",
+        reveal === "widget-hover" && "pointer-events-none opacity-0 group-hover/reasoning:pointer-events-auto group-hover/reasoning:opacity-100 group-focus-within/reasoning:pointer-events-auto group-focus-within/reasoning:opacity-100",
+        reveal === "item-hover" && "pointer-events-none opacity-0 group-hover/item:pointer-events-auto group-hover/item:opacity-100 group-focus-within/item:pointer-events-auto group-focus-within/item:opacity-100",
+        className
+      ),
+      ...props,
+      children: actions.map((action) => /* @__PURE__ */ jsx34(
+        ReasoningWidgetActionButton,
+        {
+          action,
+          onAction,
+          target,
+          widgetId
+        },
+        action.id
+      ))
+    }
+  );
+});
+var ReasoningWidget = React32.forwardRef(
+  function ReasoningWidget2({
+    actions = [],
+    children,
+    className,
+    density = "default",
+    description,
+    empty = false,
+    emptyLabel = "No extracted information yet.",
+    eyebrow,
+    icon,
+    onAction,
+    sectionDivider = false,
+    title,
+    variant = "flat",
+    widgetId,
+    ...props
+  }, ref) {
+    const widgetActions = actions.filter(isWidgetAction);
+    return /* @__PURE__ */ jsx34(ReasoningWidgetDensityContext.Provider, { value: density, children: /* @__PURE__ */ jsxs17(
+      "article",
+      {
+        ref,
+        "data-density": density,
+        "data-slot": "reasoning-widget",
+        "data-variant": variant,
+        className: cn(
+          "group/reasoning w-full shadow-none",
+          "transition-[border-color,box-shadow] duration-sofya ease-sofya",
+          variant === "flat" && "rounded-none border-0 bg-transparent p-0",
+          variant === "outline" && "rounded-[var(--sofya-radius-md)] border border-[color:var(--sofya-border-strong)] bg-card",
+          variant === "muted" && "rounded-[var(--sofya-radius-md)] border-0 bg-[color:var(--sofya-surface-muted)]",
+          variant === "suggestion" && "rounded-[var(--sofya-radius-md)] border border-[color:var(--sofya-border-hover)] bg-card",
+          variant !== "flat" && (density === "compact" ? "p-4" : "p-5"),
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs17(
+            "div",
+            {
+              "data-slot": "reasoning-widget-header",
+              className: "relative flex items-start gap-4",
+              children: [
+                /* @__PURE__ */ jsxs17("div", { className: "flex min-w-0 flex-1 items-start gap-3", children: [
+                  /* @__PURE__ */ jsxs17("div", { className: "flex min-w-0 items-start gap-2.5", children: [
+                    icon ? /* @__PURE__ */ jsx34(
+                      "span",
+                      {
+                        "aria-hidden": "true",
+                        "data-icon": icon,
+                        "data-slot": "reasoning-widget-icon",
+                        className: "mt-0.5 inline-flex size-4 shrink-0 items-center justify-center text-secondary",
+                        children: /* @__PURE__ */ jsx34(Icon, { name: icon, size: 14, strokeWidth: 1.8 })
+                      }
+                    ) : null,
+                    /* @__PURE__ */ jsxs17("div", { className: "min-w-0", children: [
+                      eyebrow ? renderTextContent(eyebrow, {
+                        as: "span",
+                        className: "mb-1 block uppercase text-secondary [font-weight:var(--sofya-text-section-label-font-weight)]",
+                        size: "section-label"
+                      }) : null,
+                      /* @__PURE__ */ jsx34(
+                        "h3",
+                        {
+                          className: cn(
+                            "m-0",
+                            eyebrow ? "text-[color:var(--sofya-neutral-800)]" : "text-secondary"
+                          ),
+                          children: renderTextContent(title, {
+                            as: "span",
+                            className: cn(
+                              "block text-inherit",
+                              !eyebrow && "uppercase"
+                            ),
+                            size: eyebrow ? density === "compact" ? "label-md" : "title-sm" : density === "compact" ? "section-label" : "clinical-section-title"
+                          })
+                        }
+                      ),
+                      description ? renderTextContent(description, {
+                        as: "p",
+                        className: "mt-2 text-[color:var(--sofya-text-subtle)]",
+                        size: "body-md"
+                      }) : null
+                    ] })
+                  ] }),
+                  sectionDivider ? /* @__PURE__ */ jsx34(
+                    "span",
+                    {
+                      "aria-hidden": "true",
+                      "data-slot": "reasoning-widget-section-divider",
+                      className: cn(
+                        "mt-2 h-px min-w-8 flex-1 bg-[color:var(--sofya-neutral-600)]",
+                        widgetActions.length > 0 && "mr-12"
+                      )
+                    }
+                  ) : null
+                ] }),
+                /* @__PURE__ */ jsx34(
+                  ReasoningWidgetActions,
+                  {
+                    actions: widgetActions,
+                    className: "absolute right-0 top-1/2 -translate-y-1/2",
+                    onAction,
+                    reveal: "widget-hover",
+                    widgetId
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx34(
+            "div",
+            {
+              "data-slot": "reasoning-widget-content",
+              className: cn(density === "compact" ? "mt-3" : "mt-4"),
+              children: empty ? renderTextContent(emptyLabel, {
+                as: "p",
+                className: "m-0 text-[color:var(--sofya-text-subtle)]",
+                size: "body-md"
+              }) : children
+            }
+          )
+        ]
+      }
+    ) });
+  }
+);
+var ReasoningWidgetList = React32.forwardRef(function ReasoningWidgetList2({
+  actions = [],
+  className,
+  editable = false,
+  emptyLabel,
+  items,
+  onAction,
+  onItemEdit,
+  widgetId,
+  ...props
+}, ref) {
+  const itemActions = actions.filter(isItemAction);
+  const density = React32.useContext(ReasoningWidgetDensityContext);
+  const primaryTextSize = density === "compact" ? "body-md" : "clinical-body";
+  const supportingTextSize = density === "compact" ? "body-sm" : "clinical-body";
+  if (items.length === 0) {
+    return /* @__PURE__ */ jsx34("p", { className: "m-0 text-[color:var(--sofya-text-subtle)]", children: renderTextContent(emptyLabel ?? "No extracted items.", {
+      as: "span",
+      className: "block text-inherit",
+      size: "body-md"
+    }) });
+  }
+  return /* @__PURE__ */ jsx34(
+    "ul",
+    {
+      ref,
+      "data-slot": "reasoning-widget-list",
+      className: cn("m-0 list-none space-y-0 p-0", className),
+      ...props,
+      children: items.map((item, index) => /* @__PURE__ */ jsxs17(
+        "li",
+        {
+          "data-slot": "reasoning-widget-list-item",
+          "data-tone": item.tone,
+          className: "group/item relative grid grid-cols-[auto_minmax(0,1fr)] items-start gap-3 rounded-[var(--sofya-radius-sm)] pr-2 transition-colors duration-sofya ease-sofya hover:bg-[color:var(--sofya-surface-hover)] focus-within:bg-[color:var(--sofya-surface-hover)]",
+          children: [
+            /* @__PURE__ */ jsx34(
+              "span",
+              {
+                "aria-hidden": "true",
+                "data-slot": "reasoning-widget-list-marker",
+                className: "mt-2 size-2 rounded-full bg-[color:var(--sofya-text-soft)]"
+              }
+            ),
+            /* @__PURE__ */ jsxs17("div", { className: "min-w-0", children: [
+              /* @__PURE__ */ jsxs17("div", { className: "flex min-w-0 flex-wrap items-baseline gap-x-2 gap-y-1", children: [
+                /* @__PURE__ */ jsx34("span", { className: "min-w-0 text-[color:var(--sofya-neutral-800)]", children: /* @__PURE__ */ jsx34(
+                  ReasoningEditableText,
+                  {
+                    ariaLabel: `Edit ${getTargetLabel(item) ?? "item"} label`,
+                    className: "block text-inherit",
+                    editable,
+                    size: primaryTextSize,
+                    value: item.label,
+                    onCommit: (value) => {
+                      onItemEdit?.({
+                        field: "label",
+                        item,
+                        value,
+                        widgetId
+                      });
+                    }
+                  }
+                ) }),
+                hasRenderableNode(item.value) ? /* @__PURE__ */ jsx34(
+                  ReasoningEditableText,
+                  {
+                    ariaLabel: `Edit ${getTargetLabel(item) ?? "item"} value`,
+                    className: "text-[color:var(--sofya-text-soft)]",
+                    editable,
+                    size: primaryTextSize,
+                    value: item.value,
+                    onCommit: (value) => {
+                      onItemEdit?.({
+                        field: "value",
+                        item,
+                        value,
+                        widgetId
+                      });
+                    }
+                  }
+                ) : null,
+                hasRenderableNode(item.status) ? /* @__PURE__ */ jsx34(
+                  ReasoningEditableText,
+                  {
+                    ariaLabel: `Edit ${getTargetLabel(item) ?? "item"} status`,
+                    className: "text-[color:var(--sofya-text-subtle)]",
+                    editable,
+                    size: "caption",
+                    value: item.status,
+                    onCommit: (value) => {
+                      onItemEdit?.({
+                        field: "status",
+                        item,
+                        value,
+                        widgetId
+                      });
+                    }
+                  }
+                ) : null
+              ] }),
+              hasRenderableNode(item.evidence) ? /* @__PURE__ */ jsx34(
+                ReasoningEditableText,
+                {
+                  as: "p",
+                  ariaLabel: `Edit ${getTargetLabel(item) ?? "item"} evidence`,
+                  className: "mt-1 text-[color:var(--sofya-text-subtle)]",
+                  editable,
+                  multiline: true,
+                  size: supportingTextSize,
+                  value: item.evidence,
+                  onCommit: (value) => {
+                    onItemEdit?.({
+                      field: "evidence",
+                      item,
+                      value,
+                      widgetId
+                    });
+                  }
+                }
+              ) : null
+            ] }),
+            /* @__PURE__ */ jsx34(
+              ReasoningWidgetActions,
+              {
+                actions: itemActions,
+                className: "absolute right-1 top-1",
+                onAction,
+                reveal: "item-hover",
+                target: item,
+                widgetId
+              }
+            )
+          ]
+        },
+        item.id ?? `reasoning-widget-item-${index}`
+      ))
+    }
+  );
+});
+var ReasoningWidgetTable = React32.forwardRef(function ReasoningWidgetTable2({
+  actions = [],
+  className,
+  columns,
+  editable = false,
+  emptyLabel = "No rows available.",
+  onAction,
+  onCellEdit,
+  rows,
+  showHeader = true,
+  widgetId,
+  ...props
+}, ref) {
+  const itemActions = actions.filter(isItemAction);
+  const hasActions = itemActions.length > 0;
+  const density = React32.useContext(ReasoningWidgetDensityContext);
+  const headerTextSize = density === "compact" ? "label-md" : "body-sm";
+  const cellTextSize = density === "compact" ? "body-sm" : "body-sm";
+  if (rows.length === 0) {
+    return /* @__PURE__ */ jsx34("p", { className: "m-0 text-[color:var(--sofya-text-subtle)]", children: renderTextContent(emptyLabel, {
+      as: "span",
+      className: "block text-inherit",
+      size: "body-md"
+    }) });
+  }
+  return /* @__PURE__ */ jsx34(
+    "div",
+    {
+      ref,
+      "data-slot": "reasoning-widget-table",
+      className: cn(
+        "overflow-hidden rounded-[10px] border border-[color:var(--sofya-neutral-600)] bg-[color:var(--sofya-neutral-50)]",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsxs17("table", { className: "w-full border-collapse table-fixed", children: [
+        showHeader ? /* @__PURE__ */ jsx34("thead", { children: /* @__PURE__ */ jsx34("tr", { className: "border-b border-[color:var(--sofya-neutral-600)]", children: columns.map((column, columnIndex) => /* @__PURE__ */ jsx34(
+          "th",
+          {
+            className: cn(
+              "align-middle text-[color:var(--sofya-text-subtle)]",
+              density === "compact" ? "px-3 py-2" : "px-4 py-2",
+              columnIndex > 0 && "border-l border-[color:var(--sofya-neutral-600)]",
+              tableAlignClassName[column.align ?? "left"]
+            ),
+            style: column.width ? { width: column.width } : void 0,
+            scope: "col",
+            children: renderTextContent(column.header, {
+              as: "span",
+              className: "block truncate text-inherit",
+              size: headerTextSize
+            })
+          },
+          column.key
+        )) }) }) : null,
+        /* @__PURE__ */ jsx34("tbody", { children: rows.map((row, rowIndex) => /* @__PURE__ */ jsx34(
+          "tr",
+          {
+            "data-tone": row.tone,
+            className: cn(
+              "group/item border-t border-[color:var(--sofya-neutral-600)] transition-colors duration-sofya ease-sofya first:border-t-0 hover:bg-[color:var(--sofya-surface-hover)] focus-within:bg-[color:var(--sofya-surface-hover)]",
+              row.tone && toneSurfaceClassName[row.tone]
+            ),
+            children: columns.map((column, columnIndex) => {
+              const isLastColumn = columnIndex === columns.length - 1;
+              return /* @__PURE__ */ jsxs17(
+                "td",
+                {
+                  className: cn(
+                    "relative min-w-0 align-top",
+                    density === "compact" ? "px-3 py-2" : "px-4 py-2",
+                    column.variant === "value" ? "text-[color:var(--sofya-neutral-800)]" : "text-[color:var(--sofya-neutral-800)]",
+                    columnIndex > 0 && "border-l border-[color:var(--sofya-neutral-600)]",
+                    hasActions && isLastColumn && "pr-24",
+                    tableAlignClassName[column.align ?? "left"]
+                  ),
+                  children: [
+                    /* @__PURE__ */ jsx34(
+                      ReasoningEditableText,
+                      {
+                        ariaLabel: `Edit ${row.id ?? "row"} ${column.key}`,
+                        className: "block truncate text-inherit",
+                        editable,
+                        size: cellTextSize,
+                        value: row.cells[column.key] ?? null,
+                        weight: column.variant === "value" ? 600 : void 0,
+                        onCommit: (value) => {
+                          onCellEdit?.({
+                            columnKey: column.key,
+                            row,
+                            value,
+                            widgetId
+                          });
+                        }
+                      }
+                    ),
+                    hasActions && isLastColumn ? /* @__PURE__ */ jsx34(
+                      ReasoningWidgetActions,
+                      {
+                        actions: itemActions,
+                        className: "absolute right-2 top-1/2 -translate-y-1/2",
+                        onAction,
+                        reveal: "item-hover",
+                        target: row,
+                        widgetId
+                      }
+                    ) : null
+                  ]
+                },
+                column.key
+              );
+            })
+          },
+          row.id ?? `reasoning-widget-row-${rowIndex}`
+        )) })
+      ] })
+    }
+  );
+});
+var ReasoningVitalsWidget = React32.forwardRef(function ReasoningVitalsWidget2({
+  actions = [],
+  editable = false,
+  emptyLabel = "No vitals extracted.",
+  frame = "bordered",
+  icon = "activity-heartbeat",
+  items,
+  onAction,
+  onItemEdit,
+  title = "Vitals",
+  widgetId,
+  ...props
+}, ref) {
+  const itemActions = actions.filter(isItemAction);
+  const hasActions = itemActions.length > 0;
+  return /* @__PURE__ */ jsx34(
+    ReasoningWidget,
+    {
+      ref,
+      actions,
+      empty: items.length === 0,
+      emptyLabel,
+      icon,
+      onAction,
+      title,
+      widgetId,
+      ...props,
+      children: /* @__PURE__ */ jsx34(
+        "div",
+        {
+          "data-slot": "reasoning-vitals-list",
+          "data-frame": frame,
+          className: clinicalDataFrameClassName[frame],
+          children: items.map((item, index) => {
+            const tone = item.tone ?? "muted";
+            const unit = item.unit ?? (typeof item.metadata?.unit === "string" ? item.metadata.unit : void 0);
+            const hasValue = hasRenderableNode(item.value);
+            const value = hasValue ? item.value : item.label;
+            const label = hasValue ? item.label : void 0;
+            return /* @__PURE__ */ jsxs17(
+              "div",
+              {
+                "data-slot": "reasoning-vital",
+                "data-tone": tone,
+                className: cn(
+                  "group/item relative grid min-w-0 grid-cols-[auto_minmax(0,1fr)_auto] items-stretch gap-0 border-t border-[color:var(--sofya-neutral-600)] transition-colors duration-sofya ease-sofya first:border-t-0 hover:bg-[color:var(--sofya-surface-hover)] focus-within:bg-[color:var(--sofya-surface-hover)]",
+                  clinicalToneSurfaceClassName[tone]
+                ),
+                children: [
+                  /* @__PURE__ */ jsx34(
+                    "span",
+                    {
+                      "aria-hidden": "true",
+                      "data-slot": "reasoning-vital-marker",
+                      className: cn(
+                        "my-5 ml-0 mr-5 w-1 rounded-r-full",
+                        clinicalToneMarkerClassName[tone]
+                      )
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs17("div", { className: "min-w-0 py-5", children: [
+                    hasRenderableNode(label) ? /* @__PURE__ */ jsx34(
+                      ReasoningEditableText,
+                      {
+                        as: "p",
+                        ariaLabel: `Edit ${getTargetLabel(item) ?? "vital"} label`,
+                        className: "text-[color:var(--sofya-neutral-900)]",
+                        editable,
+                        size: "title-sm",
+                        weight: 500,
+                        value: label,
+                        onCommit: (nextValue) => {
+                          onItemEdit?.({
+                            field: "label",
+                            item,
+                            value: nextValue,
+                            widgetId
+                          });
+                        }
+                      }
+                    ) : null,
+                    hasRenderableNode(item.referenceRange) ? /* @__PURE__ */ jsx34(
+                      ReasoningEditableText,
+                      {
+                        as: "p",
+                        ariaLabel: `Edit ${getTargetLabel(item) ?? "vital"} reference range`,
+                        className: "mt-1 text-[color:var(--sofya-text-subtle)]",
+                        editable,
+                        size: "body-sm",
+                        value: item.referenceRange,
+                        onCommit: (nextValue) => {
+                          onItemEdit?.({
+                            field: "referenceRange",
+                            item,
+                            value: nextValue,
+                            widgetId
+                          });
+                        }
+                      }
+                    ) : null,
+                    hasRenderableNode(item.evidence) ? /* @__PURE__ */ jsx34(
+                      ReasoningEditableText,
+                      {
+                        as: "p",
+                        ariaLabel: `Edit ${getTargetLabel(item) ?? "vital"} evidence`,
+                        className: "mt-1 text-[color:var(--sofya-text-subtle)]",
+                        editable,
+                        multiline: true,
+                        size: "body-sm",
+                        value: item.evidence,
+                        onCommit: (nextValue) => {
+                          onItemEdit?.({
+                            field: "evidence",
+                            item,
+                            value: nextValue,
+                            widgetId
+                          });
+                        }
+                      }
+                    ) : null,
+                    hasRenderableNode(item.observedAt) ? /* @__PURE__ */ jsx34(
+                      ReasoningEditableText,
+                      {
+                        as: "p",
+                        ariaLabel: `Edit ${getTargetLabel(item) ?? "vital"} observed time`,
+                        className: "mt-1 text-[color:var(--sofya-text-subtle)]",
+                        editable,
+                        size: "body-sm",
+                        value: item.observedAt,
+                        onCommit: (nextValue) => {
+                          onItemEdit?.({
+                            field: "observedAt",
+                            item,
+                            value: nextValue,
+                            widgetId
+                          });
+                        }
+                      }
+                    ) : null
+                  ] }),
+                  /* @__PURE__ */ jsxs17(
+                    "div",
+                    {
+                      className: cn(
+                        "min-w-[7.5rem] py-4 pr-6 text-right",
+                        hasActions && "pr-24"
+                      ),
+                      children: [
+                        /* @__PURE__ */ jsxs17("div", { className: "flex min-w-0 items-baseline justify-end gap-1", children: [
+                          /* @__PURE__ */ jsx34(
+                            "span",
+                            {
+                              className: cn("min-w-0", clinicalToneValueClassName[tone]),
+                              children: /* @__PURE__ */ jsx34(
+                                ReasoningEditableText,
+                                {
+                                  ariaLabel: `Edit ${getTargetLabel(item) ?? "vital"} value`,
+                                  className: "block text-inherit",
+                                  editable,
+                                  size: "title-md",
+                                  value,
+                                  weight: 600,
+                                  onCommit: (nextValue) => {
+                                    onItemEdit?.({
+                                      field: hasValue ? "value" : "label",
+                                      item,
+                                      value: nextValue,
+                                      widgetId
+                                    });
+                                  }
+                                }
+                              )
+                            }
+                          ),
+                          hasRenderableNode(unit) && hasValue ? /* @__PURE__ */ jsx34(
+                            ReasoningEditableText,
+                            {
+                              ariaLabel: `Edit ${getTargetLabel(item) ?? "vital"} unit`,
+                              className: "text-[color:var(--sofya-text-subtle)]",
+                              editable,
+                              size: "body-sm",
+                              value: unit,
+                              onCommit: (nextValue) => {
+                                onItemEdit?.({
+                                  field: "unit",
+                                  item,
+                                  value: nextValue,
+                                  widgetId
+                                });
+                              }
+                            }
+                          ) : null
+                        ] }),
+                        hasRenderableNode(item.status) ? /* @__PURE__ */ jsx34(
+                          ReasoningEditableText,
+                          {
+                            as: "p",
+                            ariaLabel: `Edit ${getTargetLabel(item) ?? "vital"} status`,
+                            className: cn(
+                              "mt-1 text-right",
+                              clinicalToneStatusClassName[tone]
+                            ),
+                            editable,
+                            size: "label-md",
+                            value: item.status,
+                            weight: 600,
+                            onCommit: (nextValue) => {
+                              onItemEdit?.({
+                                field: "status",
+                                item,
+                                value: nextValue,
+                                widgetId
+                              });
+                            }
+                          }
+                        ) : null
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ jsx34(
+                    ReasoningWidgetActions,
+                    {
+                      actions: itemActions,
+                      className: "absolute right-2 top-1/2 -translate-y-1/2",
+                      onAction,
+                      reveal: "item-hover",
+                      target: item,
+                      widgetId
+                    }
+                  )
+                ]
+              },
+              item.id ?? `reasoning-vital-${index}`
+            );
+          })
+        }
+      )
+    }
+  );
+});
+var ReasoningLabsWidget = React32.forwardRef(function ReasoningLabsWidget2({
+  actions = [],
+  columnLabels,
+  editable = false,
+  emptyLabel = "No labs extracted.",
+  frame = "bordered",
+  icon = "flask",
+  items,
+  onAction,
+  onItemEdit,
+  title = "Labs",
+  widgetId,
+  ...props
+}, ref) {
+  const itemActions = actions.filter(isItemAction);
+  const labColumns = [
+    {
+      key: "test",
+      label: columnLabels?.test ?? "Test",
+      width: "260px"
+    },
+    {
+      key: "result",
+      label: columnLabels?.result ?? "Result",
+      width: "150px"
+    },
+    {
+      key: "reference",
+      label: columnLabels?.reference ?? "Reference",
+      width: "150px"
+    },
+    {
+      key: "flag",
+      label: columnLabels?.flag ?? "Flag",
+      width: "160px"
+    }
+  ];
+  return /* @__PURE__ */ jsx34(
+    ReasoningWidget,
+    {
+      ref,
+      actions,
+      empty: items.length === 0,
+      emptyLabel,
+      icon,
+      onAction,
+      title,
+      widgetId,
+      ...props,
+      children: /* @__PURE__ */ jsx34(
+        "div",
+        {
+          "data-slot": "reasoning-labs-table",
+          "data-frame": frame,
+          className: clinicalLabsFrameClassName[frame],
+          children: /* @__PURE__ */ jsxs17("table", { className: "w-auto min-w-[720px] border-collapse table-fixed", children: [
+            /* @__PURE__ */ jsx34("thead", { children: /* @__PURE__ */ jsxs17("tr", { className: clinicalDataHeaderClassName[frame], children: [
+              /* @__PURE__ */ jsx34("th", { className: "w-7 px-4 py-3", scope: "col", children: /* @__PURE__ */ jsx34("span", { className: "sr-only", children: columnLabels?.tone ?? "Tone" }) }),
+              labColumns.map((column) => /* @__PURE__ */ jsx34(
+                "th",
+                {
+                  className: "px-4 py-3 text-left align-middle text-[color:var(--sofya-text-subtle)]",
+                  scope: "col",
+                  style: { width: column.width },
+                  children: renderTextContent(column.label, {
+                    as: "span",
+                    className: "block truncate text-inherit",
+                    size: "clinical-section-title"
+                  })
+                },
+                column.key
+              ))
+            ] }) }),
+            /* @__PURE__ */ jsx34("tbody", { children: items.map((item, index) => {
+              const tone = item.tone ?? "muted";
+              const unit = item.unit ?? (typeof item.metadata?.unit === "string" ? item.metadata.unit : void 0);
+              const interpretation = item.interpretation ?? item.status;
+              return /* @__PURE__ */ jsxs17(
+                "tr",
+                {
+                  "data-slot": "reasoning-lab",
+                  "data-tone": tone,
+                  className: cn(
+                    "group/item border-t border-[color:var(--sofya-neutral-600)] transition-colors duration-sofya ease-sofya first:border-t-0 hover:bg-[color:var(--sofya-surface-hover)] focus-within:bg-[color:var(--sofya-surface-hover)]",
+                    clinicalToneSurfaceClassName[tone]
+                  ),
+                  children: [
+                    /* @__PURE__ */ jsx34("td", { className: "px-0 py-4 align-top", children: /* @__PURE__ */ jsx34(
+                      "span",
+                      {
+                        "aria-hidden": "true",
+                        "data-slot": "reasoning-lab-marker",
+                        className: cn(
+                          "mt-1 block h-12 w-1 rounded-r-full",
+                          clinicalToneMarkerClassName[tone]
+                        )
+                      }
+                    ) }),
+                    /* @__PURE__ */ jsxs17("td", { className: "min-w-0 px-4 py-4 align-top text-[color:var(--sofya-neutral-900)]", children: [
+                      /* @__PURE__ */ jsx34(
+                        ReasoningEditableText,
+                        {
+                          ariaLabel: `Edit ${getTargetLabel(item) ?? "lab"} label`,
+                          className: "block text-inherit",
+                          editable,
+                          size: "title-sm",
+                          value: item.label,
+                          weight: 500,
+                          onCommit: (nextValue) => {
+                            onItemEdit?.({
+                              field: "label",
+                              item,
+                              value: nextValue,
+                              widgetId
+                            });
+                          }
+                        }
+                      ),
+                      hasRenderableNode(item.evidence) ? /* @__PURE__ */ jsx34(
+                        ReasoningEditableText,
+                        {
+                          as: "p",
+                          ariaLabel: `Edit ${getTargetLabel(item) ?? "lab"} evidence`,
+                          className: "mt-1 text-[color:var(--sofya-text-subtle)]",
+                          editable,
+                          multiline: true,
+                          size: "body-sm",
+                          value: item.evidence,
+                          onCommit: (nextValue) => {
+                            onItemEdit?.({
+                              field: "evidence",
+                              item,
+                              value: nextValue,
+                              widgetId
+                            });
+                          }
+                        }
+                      ) : null
+                    ] }),
+                    /* @__PURE__ */ jsx34("td", { className: "min-w-0 px-4 py-4 align-top", children: /* @__PURE__ */ jsxs17("div", { className: "flex min-w-0 flex-col items-start", children: [
+                      /* @__PURE__ */ jsx34(
+                        "span",
+                        {
+                          className: cn(
+                            "min-w-0",
+                            clinicalToneValueClassName[tone]
+                          ),
+                          children: /* @__PURE__ */ jsx34(
+                            ReasoningEditableText,
+                            {
+                              ariaLabel: `Edit ${getTargetLabel(item) ?? "lab"} value`,
+                              className: "block text-inherit",
+                              editable,
+                              size: "title-sm",
+                              value: item.value ?? null,
+                              weight: 600,
+                              onCommit: (nextValue) => {
+                                onItemEdit?.({
+                                  field: "value",
+                                  item,
+                                  value: nextValue,
+                                  widgetId
+                                });
+                              }
+                            }
+                          )
+                        }
+                      ),
+                      hasRenderableNode(unit) ? /* @__PURE__ */ jsx34(
+                        ReasoningEditableText,
+                        {
+                          ariaLabel: `Edit ${getTargetLabel(item) ?? "lab"} unit`,
+                          className: "text-[color:var(--sofya-text-subtle)]",
+                          editable,
+                          size: "body-sm",
+                          value: unit,
+                          onCommit: (nextValue) => {
+                            onItemEdit?.({
+                              field: "unit",
+                              item,
+                              value: nextValue,
+                              widgetId
+                            });
+                          }
+                        }
+                      ) : null
+                    ] }) }),
+                    /* @__PURE__ */ jsx34("td", { className: "min-w-0 px-4 py-4 align-top text-[color:var(--sofya-text-soft)]", children: hasRenderableNode(item.referenceRange) ? /* @__PURE__ */ jsx34(
+                      ReasoningEditableText,
+                      {
+                        ariaLabel: `Edit ${getTargetLabel(item) ?? "lab"} reference range`,
+                        className: "block truncate text-inherit",
+                        editable,
+                        size: "body-sm",
+                        value: item.referenceRange,
+                        onCommit: (nextValue) => {
+                          onItemEdit?.({
+                            field: "referenceRange",
+                            item,
+                            value: nextValue,
+                            widgetId
+                          });
+                        }
+                      }
+                    ) : null }),
+                    /* @__PURE__ */ jsxs17("td", { className: "relative min-w-0 px-4 py-4 align-top", children: [
+                      hasRenderableNode(interpretation) ? /* @__PURE__ */ jsx34(
+                        ReasoningEditableText,
+                        {
+                          ariaLabel: `Edit ${getTargetLabel(item) ?? "lab"} interpretation`,
+                          className: cn(
+                            "inline-flex rounded-full px-3 py-1",
+                            clinicalToneBadgeClassName[tone]
+                          ),
+                          editable,
+                          multiline: true,
+                          size: "label-md",
+                          value: interpretation,
+                          weight: tone === "muted" ? void 0 : 600,
+                          onCommit: (nextValue) => {
+                            onItemEdit?.({
+                              field: "status",
+                              item,
+                              value: nextValue,
+                              widgetId
+                            });
+                          }
+                        }
+                      ) : null,
+                      /* @__PURE__ */ jsx34(
+                        ReasoningWidgetActions,
+                        {
+                          actions: itemActions,
+                          className: "absolute right-2 top-1/2 -translate-y-1/2",
+                          onAction,
+                          reveal: "item-hover",
+                          target: item,
+                          widgetId
+                        }
+                      )
+                    ] })
+                  ]
+                },
+                item.id ?? `reasoning-lab-${index}`
+              );
+            }) })
+          ] })
+        }
+      )
+    }
+  );
+});
+var ReasoningSummaryWidget = React32.forwardRef(function ReasoningSummaryWidget2({
+  actions,
+  clinicalImpression,
+  description,
+  editable = false,
+  findings = [],
+  eyebrow = "Summary",
+  icon = "stethoscope",
+  onAction,
+  onItemEdit,
+  onSummaryEdit,
+  title,
+  widgetId,
+  ...props
+}, ref) {
+  return /* @__PURE__ */ jsxs17(
+    ReasoningWidget,
+    {
+      ref,
+      actions,
+      description,
+      eyebrow,
+      icon,
+      onAction,
+      title,
+      widgetId,
+      ...props,
+      children: [
+        hasRenderableNode(clinicalImpression) ? /* @__PURE__ */ jsx34(
+          ReasoningEditableText,
+          {
+            as: "p",
+            ariaLabel: "Edit clinical impression",
+            className: "m-0 text-[color:var(--sofya-neutral-800)]",
+            editable,
+            multiline: true,
+            size: "clinical-body",
+            value: clinicalImpression,
+            onCommit: (value) => {
+              onSummaryEdit?.({
+                field: "clinicalImpression",
+                value,
+                widgetId
+              });
+            }
+          }
+        ) : null,
+        findings.length > 0 ? /* @__PURE__ */ jsx34(
+          ReasoningWidgetList,
+          {
+            actions,
+            className: hasRenderableNode(clinicalImpression) ? "mt-3" : void 0,
+            editable,
+            items: findings,
+            onAction,
+            onItemEdit,
+            widgetId
+          }
+        ) : null
+      ]
+    }
+  );
+});
+function ReasoningWidgetRenderer({
+  editable = false,
+  onAction,
+  onCellEdit,
+  onItemEdit,
+  onSummaryEdit,
+  widget,
+  ...props
+}) {
+  const descriptorKind = getDescriptorKind(widget);
+  const description = getDescriptionFromDescriptor(widget);
+  const emptyLabel = getEmptyLabelFromDescriptor(widget);
+  const frame = getFrameFromDescriptor(widget);
+  const items = getItemsFromDescriptor(widget);
+  const actions = widget.actions ?? [];
+  const icon = getIconFromDescriptor(widget);
+  if (descriptorKind.includes("summary") || hasRenderableNode(widget.data?.impression)) {
+    return /* @__PURE__ */ jsx34(
+      ReasoningSummaryWidget,
+      {
+        actions,
+        clinicalImpression: widget.data?.impression,
+        description,
+        editable,
+        findings: items,
+        icon,
+        onAction,
+        onItemEdit,
+        onSummaryEdit,
+        sectionDivider: widget.sectionDivider,
+        title: widget.title,
+        widgetId: widget.id,
+        ...props
+      }
+    );
+  }
+  if (descriptorKind.includes("vitals")) {
+    return /* @__PURE__ */ jsx34(
+      ReasoningVitalsWidget,
+      {
+        actions,
+        description,
+        editable,
+        emptyLabel,
+        frame,
+        icon,
+        items,
+        onAction,
+        onItemEdit,
+        sectionDivider: widget.sectionDivider,
+        title: widget.title,
+        widgetId: widget.id,
+        ...props
+      }
+    );
+  }
+  if (descriptorKind.includes("lab") && items.length > 0) {
+    return /* @__PURE__ */ jsx34(
+      ReasoningLabsWidget,
+      {
+        actions,
+        columnLabels: widget.data?.labColumnLabels,
+        description,
+        editable,
+        emptyLabel,
+        frame,
+        icon,
+        items,
+        onAction,
+        onItemEdit,
+        sectionDivider: widget.sectionDivider,
+        title: widget.title,
+        widgetId: widget.id,
+        ...props
+      }
+    );
+  }
+  if (widget.data?.tableColumns && widget.data.rows) {
+    return /* @__PURE__ */ jsx34(
+      ReasoningWidget,
+      {
+        actions,
+        description,
+        empty: widget.data.rows.length === 0,
+        emptyLabel,
+        icon,
+        onAction,
+        sectionDivider: widget.sectionDivider,
+        title: widget.title,
+        widgetId: widget.id,
+        ...props,
+        children: /* @__PURE__ */ jsx34(
+          ReasoningWidgetTable,
+          {
+            actions,
+            columns: widget.data.tableColumns,
+            editable,
+            emptyLabel,
+            onAction,
+            onCellEdit,
+            rows: widget.data.rows,
+            widgetId: widget.id
+          }
+        )
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx34(
+    ReasoningWidget,
+    {
+      actions,
+      description,
+      empty: items.length === 0,
+      emptyLabel,
+      icon,
+      onAction,
+      sectionDivider: widget.sectionDivider,
+      title: widget.title,
+      widgetId: widget.id,
+      ...props,
+      children: /* @__PURE__ */ jsx34(
+        ReasoningWidgetList,
+        {
+          actions,
+          editable,
+          emptyLabel,
+          items,
+          onAction,
+          onItemEdit,
+          widgetId: widget.id
+        }
+      )
+    }
+  );
+}
+ReasoningWidgetActionButton.displayName = "ReasoningWidgetActionButton";
+ReasoningWidgetActions.displayName = "ReasoningWidgetActions";
+ReasoningWidget.displayName = "ReasoningWidget";
+ReasoningWidgetList.displayName = "ReasoningWidgetList";
+ReasoningWidgetTable.displayName = "ReasoningWidgetTable";
+ReasoningVitalsWidget.displayName = "ReasoningVitalsWidget";
+ReasoningLabsWidget.displayName = "ReasoningLabsWidget";
+ReasoningSummaryWidget.displayName = "ReasoningSummaryWidget";
+
+// src/components/right-rail-action.tsx
+import * as React33 from "react";
+import { jsx as jsx35 } from "react/jsx-runtime";
+var RightRailAction = React33.forwardRef(
+  ({ active = false, className, icon, ...props }, ref) => /* @__PURE__ */ jsx35(
     IconButton,
     {
       ref,
@@ -5017,12 +6480,12 @@ var RightRailAction = React32.forwardRef(
 RightRailAction.displayName = "RightRailAction";
 
 // src/components/scroll-area.tsx
-import * as React33 from "react";
+import * as React34 from "react";
 import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
-import { jsx as jsx35 } from "react/jsx-runtime";
+import { jsx as jsx36 } from "react/jsx-runtime";
 var scrollAreaOrientationOptions = ["horizontal", "vertical"];
-var ScrollArea = React33.forwardRef(function ScrollArea2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx35(
+var ScrollArea = React34.forwardRef(function ScrollArea2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx36(
     ScrollAreaPrimitive.Root,
     {
       ref,
@@ -5033,8 +6496,8 @@ var ScrollArea = React33.forwardRef(function ScrollArea2({ className, ...props }
   );
 });
 ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
-var ScrollAreaViewport = React33.forwardRef(function ScrollAreaViewport2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx35(
+var ScrollAreaViewport = React34.forwardRef(function ScrollAreaViewport2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx36(
     ScrollAreaPrimitive.Viewport,
     {
       ref,
@@ -5048,8 +6511,8 @@ var ScrollAreaViewport = React33.forwardRef(function ScrollAreaViewport2({ class
   );
 });
 ScrollAreaViewport.displayName = ScrollAreaPrimitive.Viewport.displayName;
-var ScrollAreaScrollbar = React33.forwardRef(function ScrollAreaScrollbar2({ className, orientation = "vertical", thumbClassName, ...props }, ref) {
-  return /* @__PURE__ */ jsx35(
+var ScrollAreaScrollbar = React34.forwardRef(function ScrollAreaScrollbar2({ className, orientation = "vertical", thumbClassName, ...props }, ref) {
+  return /* @__PURE__ */ jsx36(
     ScrollAreaPrimitive.Scrollbar,
     {
       ref,
@@ -5060,7 +6523,7 @@ var ScrollAreaScrollbar = React33.forwardRef(function ScrollAreaScrollbar2({ cla
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx35(
+      children: /* @__PURE__ */ jsx36(
         ScrollAreaPrimitive.Thumb,
         {
           "data-slot": "scroll-area-thumb",
@@ -5074,8 +6537,8 @@ var ScrollAreaScrollbar = React33.forwardRef(function ScrollAreaScrollbar2({ cla
   );
 });
 ScrollAreaScrollbar.displayName = ScrollAreaPrimitive.Scrollbar.displayName;
-var ScrollAreaCorner = React33.forwardRef(function ScrollAreaCorner2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx35(
+var ScrollAreaCorner = React34.forwardRef(function ScrollAreaCorner2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx36(
     ScrollAreaPrimitive.Corner,
     {
       ref,
@@ -5088,19 +6551,19 @@ var ScrollAreaCorner = React33.forwardRef(function ScrollAreaCorner2({ className
 ScrollAreaCorner.displayName = ScrollAreaPrimitive.Corner.displayName;
 
 // src/components/select.tsx
-import * as React34 from "react";
+import * as React35 from "react";
 import * as SelectPrimitive from "@radix-ui/react-select";
 
 // src/lib/form-control-classes.ts
 var formControlBaseClasses = "flex w-full items-center justify-between gap-4 rounded-[10px] border border-[color:var(--sofya-border-strong)] bg-card px-4 text-left [font-family:var(--sofya-text-body-font-family)] text-[length:var(--sofya-text-body-font-size)] [font-weight:var(--sofya-text-body-font-weight)] leading-[var(--sofya-text-body-line-height)] tracking-[var(--sofya-text-body-letter-spacing)] text-[color:var(--sofya-text-default)] shadow-none transition-[border-color,box-shadow,background-color,color] duration-sofya ease-sofya hover:border-[color:var(--sofya-border-hover)] focus:outline-none focus:ring-2 focus:ring-[color:var(--sofya-focus-ring-soft)] focus:ring-offset-0 active:border-transparent active:ring-2 active:ring-[color:var(--sofya-focus-ring-soft)] disabled:cursor-not-allowed disabled:bg-muted disabled:opacity-50 aria-invalid:border-destructive aria-invalid:focus:ring-destructive/20 data-[placeholder]:text-[color:var(--sofya-text-placeholder)]";
 
 // src/components/select.tsx
-import { jsx as jsx36, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx37, jsxs as jsxs18 } from "react/jsx-runtime";
 var selectSizeOptions = ["default", "sm"];
 var Select = SelectPrimitive.Root;
 var SelectGroup = SelectPrimitive.Group;
-var SelectValue = React34.forwardRef(function SelectValue2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx36(
+var SelectValue = React35.forwardRef(function SelectValue2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx37(
     Text,
     {
       ref,
@@ -5109,13 +6572,13 @@ var SelectValue = React34.forwardRef(function SelectValue2({ className, ...props
       className: cn("block truncate text-inherit", className),
       size: "tiny",
       style: inheritedTypographyStyle,
-      children: /* @__PURE__ */ jsx36(SelectPrimitive.Value, { className: "block truncate", ...props })
+      children: /* @__PURE__ */ jsx37(SelectPrimitive.Value, { className: "block truncate", ...props })
     }
   );
 });
 SelectValue.displayName = SelectPrimitive.Value.displayName;
-var SelectTrigger = React34.forwardRef(function SelectTrigger2({ className, children, size = "default", ...props }, ref) {
-  return /* @__PURE__ */ jsxs17(
+var SelectTrigger = React35.forwardRef(function SelectTrigger2({ className, children, size = "default", ...props }, ref) {
+  return /* @__PURE__ */ jsxs18(
     SelectPrimitive.Trigger,
     {
       ref,
@@ -5129,7 +6592,7 @@ var SelectTrigger = React34.forwardRef(function SelectTrigger2({ className, chil
       ...props,
       children: [
         children,
-        /* @__PURE__ */ jsx36(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx36(
+        /* @__PURE__ */ jsx37(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx37(
           Icon,
           {
             name: "caret-down",
@@ -5142,8 +6605,8 @@ var SelectTrigger = React34.forwardRef(function SelectTrigger2({ className, chil
   );
 });
 SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
-var SelectScrollUpButton = React34.forwardRef(function SelectScrollUpButton2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx36(
+var SelectScrollUpButton = React35.forwardRef(function SelectScrollUpButton2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx37(
     SelectPrimitive.ScrollUpButton,
     {
       ref,
@@ -5153,13 +6616,13 @@ var SelectScrollUpButton = React34.forwardRef(function SelectScrollUpButton2({ c
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx36(Icon, { name: "caret-up", size: 12 })
+      children: /* @__PURE__ */ jsx37(Icon, { name: "caret-up", size: 12 })
     }
   );
 });
 SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
-var SelectScrollDownButton = React34.forwardRef(function SelectScrollDownButton2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx36(
+var SelectScrollDownButton = React35.forwardRef(function SelectScrollDownButton2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx37(
     SelectPrimitive.ScrollDownButton,
     {
       ref,
@@ -5169,13 +6632,13 @@ var SelectScrollDownButton = React34.forwardRef(function SelectScrollDownButton2
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx36(Icon, { name: "caret-down", size: 12 })
+      children: /* @__PURE__ */ jsx37(Icon, { name: "caret-down", size: 12 })
     }
   );
 });
 SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
-var SelectContent = React34.forwardRef(function SelectContent2({ className, children, position = "popper", ...props }, ref) {
-  return /* @__PURE__ */ jsx36(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs17(
+var SelectContent = React35.forwardRef(function SelectContent2({ className, children, position = "popper", ...props }, ref) {
+  return /* @__PURE__ */ jsx37(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs18(
     SelectPrimitive.Content,
     {
       ref,
@@ -5188,8 +6651,8 @@ var SelectContent = React34.forwardRef(function SelectContent2({ className, chil
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx36(SelectScrollUpButton, {}),
-        /* @__PURE__ */ jsx36(
+        /* @__PURE__ */ jsx37(SelectScrollUpButton, {}),
+        /* @__PURE__ */ jsx37(
           SelectPrimitive.Viewport,
           {
             "data-slot": "select-viewport",
@@ -5197,14 +6660,14 @@ var SelectContent = React34.forwardRef(function SelectContent2({ className, chil
             children
           }
         ),
-        /* @__PURE__ */ jsx36(SelectScrollDownButton, {})
+        /* @__PURE__ */ jsx37(SelectScrollDownButton, {})
       ]
     }
   ) });
 });
 SelectContent.displayName = SelectPrimitive.Content.displayName;
-var SelectLabel = React34.forwardRef(function SelectLabel2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx36(
+var SelectLabel = React35.forwardRef(function SelectLabel2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx37(
     SelectPrimitive.Label,
     {
       ref,
@@ -5226,8 +6689,8 @@ var SelectLabel = React34.forwardRef(function SelectLabel2({ className, ...props
   );
 });
 SelectLabel.displayName = SelectPrimitive.Label.displayName;
-var SelectItem = React34.forwardRef(function SelectItem2({ className, children, ...props }, ref) {
-  return /* @__PURE__ */ jsxs17(
+var SelectItem = React35.forwardRef(function SelectItem2({ className, children, ...props }, ref) {
+  return /* @__PURE__ */ jsxs18(
     SelectPrimitive.Item,
     {
       ref,
@@ -5238,20 +6701,20 @@ var SelectItem = React34.forwardRef(function SelectItem2({ className, children,
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx36(SelectPrimitive.ItemText, { className: "truncate", children: renderTextContent(children, {
+        /* @__PURE__ */ jsx37(SelectPrimitive.ItemText, { className: "truncate", children: renderTextContent(children, {
           as: "span",
           className: "block truncate text-[color:var(--sofya-text-default)]",
           size: "tiny",
           style: inheritedTypographyStyle
         }) }),
-        /* @__PURE__ */ jsx36(SelectPrimitive.ItemIndicator, { asChild: true, children: /* @__PURE__ */ jsx36("span", { className: "absolute right-4 inline-flex h-4 w-4 items-center justify-center text-primary", children: /* @__PURE__ */ jsx36(Icon, { name: "check", size: 14 }) }) })
+        /* @__PURE__ */ jsx37(SelectPrimitive.ItemIndicator, { asChild: true, children: /* @__PURE__ */ jsx37("span", { className: "absolute right-4 inline-flex h-4 w-4 items-center justify-center text-primary", children: /* @__PURE__ */ jsx37(Icon, { name: "check", size: 14 }) }) })
       ]
     }
   );
 });
 SelectItem.displayName = SelectPrimitive.Item.displayName;
-var SelectSeparator = React34.forwardRef(function SelectSeparator2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx36(
+var SelectSeparator = React35.forwardRef(function SelectSeparator2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx37(
     SelectPrimitive.Separator,
     {
       ref,
@@ -5264,11 +6727,11 @@ var SelectSeparator = React34.forwardRef(function SelectSeparator2({ className,
 SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
 
 // src/components/separator.tsx
-import * as React35 from "react";
+import * as React36 from "react";
 import * as SeparatorPrimitive from "@radix-ui/react-separator";
-import { jsx as jsx37 } from "react/jsx-runtime";
-var Separator2 = React35.forwardRef(function Separator3({ className, decorative = true, orientation = "horizontal", ...props }, ref) {
-  return /* @__PURE__ */ jsx37(
+import { jsx as jsx38 } from "react/jsx-runtime";
+var Separator2 = React36.forwardRef(function Separator3({ className, decorative = true, orientation = "horizontal", ...props }, ref) {
+  return /* @__PURE__ */ jsx38(
     SeparatorPrimitive.Root,
     {
       ref,
@@ -5287,8 +6750,8 @@ var Separator2 = React35.forwardRef(function Separator3({ className, decorative
 Separator2.displayName = SeparatorPrimitive.Root.displayName;
 
 // src/components/sidebar-nav-item.tsx
-import * as React36 from "react";
-import { jsx as jsx38, jsxs as jsxs18 } from "react/jsx-runtime";
+import * as React37 from "react";
+import { jsx as jsx39, jsxs as jsxs19 } from "react/jsx-runtime";
 var sidebarNavItemAppearanceClassNames = {
   settings: "rounded-[var(--sofya-radius-md)] py-[var(--sofya-space-2)] pl-[var(--sofya-space-3)] pr-[var(--sofya-space-3)] text-[color:var(--sofya-text-soft)] hover:bg-[color:var(--sofya-surface-hover)] hover:text-[color:var(--sofya-text-default)] data-[active=true]:bg-[color:var(--sofya-surface-selected)] data-[active=true]:text-[color:var(--sofya-text-default)] data-[active=true]:hover:bg-[color:var(--sofya-surface-selected-strong)] data-[disabled=true]:text-[color:var(--sofya-text-subtle)] data-[disabled=true]:hover:bg-transparent",
   workspace: "rounded-[var(--sofya-radius-sm)] bg-transparent px-0 py-0 text-[color:var(--sofya-text-subtle)] hover:bg-transparent hover:text-[color:var(--sofya-text-default)] data-[active=true]:bg-transparent data-[active=true]:text-primary data-[active=true]:hover:bg-transparent data-[active=true]:hover:text-primary data-[disabled=true]:text-[color:var(--sofya-text-subtle)] data-[disabled=true]:hover:bg-transparent"
@@ -5301,10 +6764,10 @@ var sidebarNavItemTextSize = {
   settings: "sidebar-title",
   workspace: "sidebar-title-regular"
 };
-var SidebarNav = React36.forwardRef(
+var SidebarNav = React37.forwardRef(
   ({ as, className, ...props }, ref) => {
     const Comp = as ?? "nav";
-    return /* @__PURE__ */ jsx38(
+    return /* @__PURE__ */ jsx39(
       Comp,
       {
         ref,
@@ -5316,8 +6779,8 @@ var SidebarNav = React36.forwardRef(
   }
 );
 SidebarNav.displayName = "SidebarNav";
-var SidebarNavSection = React36.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx38(
+var SidebarNavSection = React37.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx39(
     "div",
     {
       ref,
@@ -5328,10 +6791,10 @@ var SidebarNavSection = React36.forwardRef(
   )
 );
 SidebarNavSection.displayName = "SidebarNavSection";
-var SidebarNavSectionLabel = React36.forwardRef(
+var SidebarNavSectionLabel = React37.forwardRef(
   ({ as, className, children, ...props }, ref) => {
     const Comp = as ?? "h5";
-    return /* @__PURE__ */ jsx38(
+    return /* @__PURE__ */ jsx39(
       Comp,
       {
         ref,
@@ -5348,8 +6811,8 @@ var SidebarNavSectionLabel = React36.forwardRef(
   }
 );
 SidebarNavSectionLabel.displayName = "SidebarNavSectionLabel";
-var SidebarNavSectionItems = React36.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx38(
+var SidebarNavSectionItems = React37.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx39(
     "div",
     {
       ref,
@@ -5360,7 +6823,7 @@ var SidebarNavSectionItems = React36.forwardRef(
   )
 );
 SidebarNavSectionItems.displayName = "SidebarNavSectionItems";
-var SidebarNavItem = React36.forwardRef(
+var SidebarNavItem = React37.forwardRef(
   function SidebarNavItem2({
     as,
     active = false,
@@ -5373,7 +6836,7 @@ var SidebarNavItem = React36.forwardRef(
   }, ref) {
     const Comp = as ?? (props.href ? "a" : "button");
     const isNativeButton = Comp === "button";
-    return /* @__PURE__ */ jsxs18(
+    return /* @__PURE__ */ jsxs19(
       Comp,
       {
         ref,
@@ -5394,7 +6857,7 @@ var SidebarNavItem = React36.forwardRef(
         ),
         ...props,
         children: [
-          appearance === "settings" ? /* @__PURE__ */ jsx38(
+          appearance === "settings" ? /* @__PURE__ */ jsx39(
             "span",
             {
               "aria-hidden": "true",
@@ -5405,7 +6868,7 @@ var SidebarNavItem = React36.forwardRef(
               )
             }
           ) : null,
-          icon ? /* @__PURE__ */ jsx38(
+          icon ? /* @__PURE__ */ jsx39(
             "span",
             {
               "data-slot": "sidebar-nav-item-icon",
@@ -5413,7 +6876,7 @@ var SidebarNavItem = React36.forwardRef(
               children: icon
             }
           ) : null,
-          /* @__PURE__ */ jsx38("span", { className: "min-w-0 flex-1 truncate", children: renderTextContent(children, {
+          /* @__PURE__ */ jsx39("span", { className: "min-w-0 flex-1 truncate", children: renderTextContent(children, {
             as: "span",
             className: "block min-w-0 truncate text-inherit",
             size: sidebarNavItemTextSize[appearance]
@@ -5427,8 +6890,8 @@ SidebarNavItem.displayName = "SidebarNavItem";
 var SettingsNavItem = SidebarNavItem;
 
 // src/components/slider.tsx
-import * as React37 from "react";
-import { jsx as jsx39, jsxs as jsxs19 } from "react/jsx-runtime";
+import * as React38 from "react";
+import { jsx as jsx40, jsxs as jsxs20 } from "react/jsx-runtime";
 function clampSliderValue(value, min, max) {
   if (Number.isNaN(value)) {
     return min;
@@ -5453,7 +6916,7 @@ function resolveSliderMeasurement(value, fallback) {
 function isTextValue(value) {
   return typeof value === "string" || typeof value === "number";
 }
-var Slider = React37.forwardRef(function Slider2({
+var Slider = React38.forwardRef(function Slider2({
   className,
   defaultValue,
   formatValue,
@@ -5476,7 +6939,7 @@ var Slider = React37.forwardRef(function Slider2({
   valueClassName,
   ...props
 }, ref) {
-  const resolvedId = React37.useId();
+  const resolvedId = React38.useId();
   const inputId = id ?? resolvedId;
   const safeMin = min;
   const safeMax = resolveSliderMax(safeMin, max);
@@ -5485,7 +6948,7 @@ var Slider = React37.forwardRef(function Slider2({
     onChange: onValueChange,
     value
   });
-  React37.useEffect(() => {
+  React38.useEffect(() => {
     if (value !== void 0) {
       return;
     }
@@ -5532,14 +6995,14 @@ var Slider = React37.forwardRef(function Slider2({
     setControllableValue(nextValue);
     onChange?.(event);
   };
-  return /* @__PURE__ */ jsxs19(
+  return /* @__PURE__ */ jsxs20(
     "div",
     {
       "data-slot": "slider",
       className: cn("grid w-full gap-2", className),
       children: [
-        label || showValue ? /* @__PURE__ */ jsxs19("div", { className: "flex items-center justify-between gap-4", children: [
-          label ? /* @__PURE__ */ jsx39(
+        label || showValue ? /* @__PURE__ */ jsxs20("div", { className: "flex items-center justify-between gap-4", children: [
+          label ? /* @__PURE__ */ jsx40(
             FieldLabel,
             {
               htmlFor: inputId,
@@ -5550,8 +7013,8 @@ var Slider = React37.forwardRef(function Slider2({
               textClassName: "block min-w-0 text-[color:var(--sofya-text-default)]",
               children: label
             }
-          ) : /* @__PURE__ */ jsx39("span", {}),
-          showValue ? /* @__PURE__ */ jsx39(
+          ) : /* @__PURE__ */ jsx40("span", {}),
+          showValue ? /* @__PURE__ */ jsx40(
             "div",
             {
               className: cn(
@@ -5569,7 +7032,7 @@ var Slider = React37.forwardRef(function Slider2({
             }
           ) : null
         ] }) : null,
-        /* @__PURE__ */ jsxs19(
+        /* @__PURE__ */ jsxs20(
           "div",
           {
             "data-slot": "slider-control",
@@ -5579,7 +7042,7 @@ var Slider = React37.forwardRef(function Slider2({
             ),
             style: controlStyle,
             children: [
-              /* @__PURE__ */ jsx39(
+              /* @__PURE__ */ jsx40(
                 "input",
                 {
                   ...props,
@@ -5596,7 +7059,7 @@ var Slider = React37.forwardRef(function Slider2({
                   style: inputBoundsStyle
                 }
               ),
-              /* @__PURE__ */ jsx39(
+              /* @__PURE__ */ jsx40(
                 "div",
                 {
                   "data-slot": "slider-track",
@@ -5607,7 +7070,7 @@ var Slider = React37.forwardRef(function Slider2({
                   style: trackBoundsStyle
                 }
               ),
-              /* @__PURE__ */ jsx39(
+              /* @__PURE__ */ jsx40(
                 "div",
                 {
                   "data-slot": "slider-range",
@@ -5618,7 +7081,7 @@ var Slider = React37.forwardRef(function Slider2({
                   style: rangeStyle
                 }
               ),
-              /* @__PURE__ */ jsx39(
+              /* @__PURE__ */ jsx40(
                 "div",
                 {
                   "data-slot": "slider-thumb",
@@ -5639,10 +7102,10 @@ var Slider = React37.forwardRef(function Slider2({
 Slider.displayName = "Slider";
 
 // src/components/skeleton.tsx
-import * as React38 from "react";
-import { jsx as jsx40 } from "react/jsx-runtime";
-var Skeleton = React38.forwardRef(function Skeleton2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx40(
+import * as React39 from "react";
+import { jsx as jsx41 } from "react/jsx-runtime";
+var Skeleton = React39.forwardRef(function Skeleton2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx41(
     "div",
     {
       ref,
@@ -5657,18 +7120,18 @@ var Skeleton = React38.forwardRef(function Skeleton2({ className, ...props }, re
 Skeleton.displayName = "Skeleton";
 
 // src/components/sonner.tsx
-import * as React39 from "react";
+import * as React40 from "react";
 import {
   Toaster as SonnerToaster,
   toast
 } from "sonner";
-import { jsx as jsx41 } from "react/jsx-runtime";
+import { jsx as jsx42 } from "react/jsx-runtime";
 var notificationVariantOptions = ["default", "success", "error", "warning"];
 function ToastStatusIcon({
   iconName,
   className
 }) {
-  return /* @__PURE__ */ jsx41(
+  return /* @__PURE__ */ jsx42(
     "span",
     {
       "aria-hidden": "true",
@@ -5676,7 +7139,7 @@ function ToastStatusIcon({
         "inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-full border shadow-none",
         className
       ),
-      children: /* @__PURE__ */ jsx41(Icon, { name: iconName, size: 16 })
+      children: /* @__PURE__ */ jsx42(Icon, { name: iconName, size: 16 })
     }
   );
 }
@@ -5700,35 +7163,35 @@ var defaultToastClassNames = {
   loading: "border-border bg-card text-foreground"
 };
 var defaultToastIcons = {
-  success: /* @__PURE__ */ jsx41(
+  success: /* @__PURE__ */ jsx42(
     ToastStatusIcon,
     {
       iconName: "check",
       className: "border-success/15 bg-success/12 text-success"
     }
   ),
-  error: /* @__PURE__ */ jsx41(
+  error: /* @__PURE__ */ jsx42(
     ToastStatusIcon,
     {
       iconName: "x",
       className: "border-destructive/15 bg-destructive/12 text-destructive"
     }
   ),
-  warning: /* @__PURE__ */ jsx41(
+  warning: /* @__PURE__ */ jsx42(
     ToastStatusIcon,
     {
       iconName: "question",
       className: "border-warning/20 bg-warning/15 text-foreground"
     }
   ),
-  info: /* @__PURE__ */ jsx41(
+  info: /* @__PURE__ */ jsx42(
     ToastStatusIcon,
     {
       iconName: "question",
       className: "border-primary/15 bg-primary/10 text-primary"
     }
   ),
-  close: /* @__PURE__ */ jsx41(Icon, { name: "x", size: 12 })
+  close: /* @__PURE__ */ jsx42(Icon, { name: "x", size: 12 })
 };
 function mergeToastClassNames(overrides) {
   return {
@@ -5736,7 +7199,7 @@ function mergeToastClassNames(overrides) {
     ...overrides
   };
 }
-var Toaster = React39.forwardRef(
+var Toaster = React40.forwardRef(
   function Toaster2({
     className,
     closeButton = true,
@@ -5748,7 +7211,7 @@ var Toaster = React39.forwardRef(
     visibleToasts = 5,
     ...props
   }, ref) {
-    return /* @__PURE__ */ jsx41(
+    return /* @__PURE__ */ jsx42(
       SonnerToaster,
       {
         ref,
@@ -5803,12 +7266,12 @@ notify.dismiss = toast.dismiss;
 notify.promise = toast.promise;
 
 // src/components/status-indicator.tsx
-import * as React41 from "react";
+import * as React42 from "react";
 
 // src/components/tooltip.tsx
-import * as React40 from "react";
+import * as React41 from "react";
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
-import { Fragment as Fragment4, jsx as jsx42, jsxs as jsxs20 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx43, jsxs as jsxs21 } from "react/jsx-runtime";
 var TooltipProvider = TooltipPrimitive.Provider;
 var Tooltip = TooltipPrimitive.Root;
 var TooltipTrigger = TooltipPrimitive.Trigger;
@@ -5826,8 +7289,8 @@ var tooltipToneClassNames = {
   warning: "border-[color:var(--sofya-tone-warning-border)] bg-[color:var(--sofya-tone-warning-background)] text-[color:var(--sofya-tone-warning-foreground)]",
   destructive: "border-[color:var(--sofya-tone-destructive-border)] bg-[color:var(--sofya-tone-destructive-background)] text-[color:var(--sofya-tone-destructive-foreground)]"
 };
-var TooltipContent = React40.forwardRef(function TooltipContent2({ className, sideOffset = 8, align = "center", tone = "default", ...props }, ref) {
-  return /* @__PURE__ */ jsx42(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsx42(
+var TooltipContent = React41.forwardRef(function TooltipContent2({ className, sideOffset = 8, align = "center", tone = "default", ...props }, ref) {
+  return /* @__PURE__ */ jsx43(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsx43(
     TooltipPrimitive.Content,
     {
       ref,
@@ -5853,7 +7316,7 @@ var TooltipContent = React40.forwardRef(function TooltipContent2({ className, si
   ) });
 });
 TooltipContent.displayName = TooltipPrimitive.Content.displayName;
-var StatusTooltip = React40.forwardRef(function StatusTooltip2({
+var StatusTooltip = React41.forwardRef(function StatusTooltip2({
   children,
   label,
   status = "default",
@@ -5868,11 +7331,11 @@ var StatusTooltip = React40.forwardRef(function StatusTooltip2({
   className
 }, ref) {
   if (disabled) {
-    return /* @__PURE__ */ jsx42(Fragment4, { children });
+    return /* @__PURE__ */ jsx43(Fragment4, { children });
   }
-  return /* @__PURE__ */ jsx42(TooltipProvider, { delayDuration, children: /* @__PURE__ */ jsxs20(Tooltip, { open, defaultOpen, onOpenChange, children: [
-    /* @__PURE__ */ jsx42(TooltipTrigger, { asChild: true, children }),
-    /* @__PURE__ */ jsx42(
+  return /* @__PURE__ */ jsx43(TooltipProvider, { delayDuration, children: /* @__PURE__ */ jsxs21(Tooltip, { open, defaultOpen, onOpenChange, children: [
+    /* @__PURE__ */ jsx43(TooltipTrigger, { asChild: true, children }),
+    /* @__PURE__ */ jsx43(
       TooltipContent,
       {
         ref,
@@ -5890,7 +7353,7 @@ var StatusTooltip = React40.forwardRef(function StatusTooltip2({
 StatusTooltip.displayName = "StatusTooltip";
 
 // src/components/status-indicator.tsx
-import { jsx as jsx43, jsxs as jsxs21 } from "react/jsx-runtime";
+import { jsx as jsx44, jsxs as jsxs22 } from "react/jsx-runtime";
 var workflowStatusOptions = [
   "draft",
   "in_progress",
@@ -5971,7 +7434,7 @@ var toneTextClassName = {
   warning: "text-[color:var(--sofya-tone-warning-foreground)]",
   destructive: "text-[color:var(--sofya-tone-destructive-foreground)]"
 };
-var StatusIndicator = React41.forwardRef(
+var StatusIndicator = React42.forwardRef(
   function StatusIndicator2({
     className,
     label,
@@ -5982,7 +7445,7 @@ var StatusIndicator = React41.forwardRef(
     ...props
   }, ref) {
     const resolved = resolveWorkflowStatus(status, { label });
-    const indicator = /* @__PURE__ */ jsxs21(
+    const indicator = /* @__PURE__ */ jsxs22(
       "span",
       {
         ref,
@@ -5997,7 +7460,7 @@ var StatusIndicator = React41.forwardRef(
         ),
         ...props,
         children: [
-          /* @__PURE__ */ jsx43(
+          /* @__PURE__ */ jsx44(
             "span",
             {
               "aria-hidden": "true",
@@ -6018,15 +7481,15 @@ var StatusIndicator = React41.forwardRef(
     if (!tooltip) {
       return indicator;
     }
-    return /* @__PURE__ */ jsx43(StatusTooltip, { status: resolved.tone, label: resolved.label, side, children: indicator });
+    return /* @__PURE__ */ jsx44(StatusTooltip, { status: resolved.tone, label: resolved.label, side, children: indicator });
   }
 );
 StatusIndicator.displayName = "StatusIndicator";
 
 // src/components/switch.tsx
-import * as React42 from "react";
+import * as React43 from "react";
 import * as SwitchPrimitives from "@radix-ui/react-switch";
-import { jsx as jsx44, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx45, jsxs as jsxs23 } from "react/jsx-runtime";
 var switchSizeOptions = ["default", "sm"];
 var switchRootSizeClasses = {
   default: "h-6 w-11",
@@ -6036,7 +7499,7 @@ var switchThumbSizeClasses = {
   default: "h-5 w-5 data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0",
   sm: "h-4 w-4 data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0"
 };
-var Switch = React42.forwardRef(
+var Switch = React43.forwardRef(
   ({
     "aria-describedby": ariaDescribedBy,
     "aria-labelledby": ariaLabelledBy,
@@ -6051,7 +7514,7 @@ var Switch = React42.forwardRef(
     size,
     ...props
   }, ref) => {
-    const generatedId = React42.useId();
+    const generatedId = React43.useId();
     const resolvedId = id ?? generatedId;
     const labelId = label ? `${resolvedId}-label` : void 0;
     const descriptionId = description ? `${resolvedId}-description` : void 0;
@@ -6060,7 +7523,7 @@ var Switch = React42.forwardRef(
     const alignClassName2 = description ? "items-start" : "items-center";
     const resolvedAriaDescribedBy = [ariaDescribedBy, descriptionId].filter(Boolean).join(" ") || void 0;
     const resolvedAriaLabelledBy = ariaLabelledBy ?? labelId;
-    const switchControl = /* @__PURE__ */ jsx44(
+    const switchControl = /* @__PURE__ */ jsx45(
       SwitchPrimitives.Root,
       {
         id: resolvedId,
@@ -6075,7 +7538,7 @@ var Switch = React42.forwardRef(
         "data-size": resolvedSize,
         ...props,
         ref,
-        children: /* @__PURE__ */ jsx44(
+        children: /* @__PURE__ */ jsx45(
           SwitchPrimitives.Thumb,
           {
             className: cn(
@@ -6089,7 +7552,7 @@ var Switch = React42.forwardRef(
     if (!hasTextContent) {
       return switchControl;
     }
-    return /* @__PURE__ */ jsxs22(
+    return /* @__PURE__ */ jsxs23(
       "div",
       {
         "data-slot": "switch-container",
@@ -6100,8 +7563,8 @@ var Switch = React42.forwardRef(
         }),
         children: [
           switchControl,
-          /* @__PURE__ */ jsxs22("span", { className: selectionControlContentBaseClasses, children: [
-            label ? /* @__PURE__ */ jsx44("label", { htmlFor: resolvedId, className: selectionControlLabelTextBaseClasses, children: /* @__PURE__ */ jsx44(
+          /* @__PURE__ */ jsxs23("span", { className: selectionControlContentBaseClasses, children: [
+            label ? /* @__PURE__ */ jsx45("label", { htmlFor: resolvedId, className: selectionControlLabelTextBaseClasses, children: /* @__PURE__ */ jsx45(
               "span",
               {
                 id: labelId,
@@ -6116,7 +7579,7 @@ var Switch = React42.forwardRef(
                 })
               }
             ) }) : null,
-            description ? /* @__PURE__ */ jsx44(
+            description ? /* @__PURE__ */ jsx45(
               "span",
               {
                 id: descriptionId,
@@ -6141,8 +7604,8 @@ Switch.displayName = SwitchPrimitives.Root.displayName;
 
 // src/components/table.tsx
 import { cva as cva8 } from "class-variance-authority";
-import * as React43 from "react";
-import { jsx as jsx45 } from "react/jsx-runtime";
+import * as React44 from "react";
+import { jsx as jsx46 } from "react/jsx-runtime";
 var tableDensityOptions = ["default", "compact"];
 var tableCellVariantOptions = ["default", "primary", "muted"];
 var tableStatusToneOptions = [
@@ -6152,10 +7615,10 @@ var tableStatusToneOptions = [
   "warning"
 ];
 var tableActionToneOptions = ["primary", "neutral", "danger"];
-var TableDensityContext = React43.createContext("default");
-var TableHeaderDensityContext = React43.createContext("default");
+var TableDensityContext = React44.createContext("default");
+var TableHeaderDensityContext = React44.createContext("default");
 function useTableDensity(density) {
-  const inheritedDensity = React43.useContext(TableDensityContext);
+  const inheritedDensity = React44.useContext(TableDensityContext);
   return density ?? inheritedDensity;
 }
 var tableCellVariants = cva8(
@@ -6211,13 +7674,13 @@ var tableActionButtonVariants = cva8(
     }
   }
 );
-var Table = React43.forwardRef(function Table2({ className, density = "default", ...props }, ref) {
-  return /* @__PURE__ */ jsx45(TableDensityContext.Provider, { value: density, children: /* @__PURE__ */ jsx45(
+var Table = React44.forwardRef(function Table2({ className, density = "default", ...props }, ref) {
+  return /* @__PURE__ */ jsx46(TableDensityContext.Provider, { value: density, children: /* @__PURE__ */ jsx46(
     "div",
     {
       "data-slot": "table-container",
       className: "relative w-full overflow-x-auto",
-      children: /* @__PURE__ */ jsx45(
+      children: /* @__PURE__ */ jsx46(
         "table",
         {
           "data-density": density,
@@ -6234,10 +7697,10 @@ var Table = React43.forwardRef(function Table2({ className, density = "default",
     }
   ) });
 });
-var TableHeader = React43.forwardRef(function TableHeader2({ className, density, ...props }, ref) {
+var TableHeader = React44.forwardRef(function TableHeader2({ className, density, ...props }, ref) {
   const tableDensity = useTableDensity();
   const headerDensity = density ?? tableDensity;
-  return /* @__PURE__ */ jsx45(TableHeaderDensityContext.Provider, { value: headerDensity, children: /* @__PURE__ */ jsx45(TableDensityContext.Provider, { value: "default", children: /* @__PURE__ */ jsx45(
+  return /* @__PURE__ */ jsx46(TableHeaderDensityContext.Provider, { value: headerDensity, children: /* @__PURE__ */ jsx46(TableDensityContext.Provider, { value: "default", children: /* @__PURE__ */ jsx46(
     "thead",
     {
       "data-slot": "table-header",
@@ -6251,8 +7714,8 @@ var TableHeader = React43.forwardRef(function TableHeader2({ className, density,
     }
   ) }) });
 });
-var TableBody = React43.forwardRef(function TableBody2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx45(
+var TableBody = React44.forwardRef(function TableBody2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx46(
     "tbody",
     {
       "data-slot": "table-body",
@@ -6262,8 +7725,8 @@ var TableBody = React43.forwardRef(function TableBody2({ className, ...props },
     }
   );
 });
-var TableFooter = React43.forwardRef(function TableFooter2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx45(
+var TableFooter = React44.forwardRef(function TableFooter2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx46(
     "tfoot",
     {
       "data-slot": "table-footer",
@@ -6276,10 +7739,10 @@ var TableFooter = React43.forwardRef(function TableFooter2({ className, ...props
     }
   );
 });
-var TableRow = React43.forwardRef(
+var TableRow = React44.forwardRef(
   function TableRow2({ className, density, ...props }, ref) {
     const resolvedDensity = useTableDensity(density);
-    return /* @__PURE__ */ jsx45(TableDensityContext.Provider, { value: resolvedDensity, children: /* @__PURE__ */ jsx45(
+    return /* @__PURE__ */ jsx46(TableDensityContext.Provider, { value: resolvedDensity, children: /* @__PURE__ */ jsx46(
       "tr",
       {
         "data-density": resolvedDensity,
@@ -6295,9 +7758,9 @@ var TableRow = React43.forwardRef(
     ) });
   }
 );
-var TableHead = React43.forwardRef(function TableHead2({ className, children, ...props }, ref) {
-  const headerDensity = React43.useContext(TableHeaderDensityContext);
-  return /* @__PURE__ */ jsx45(
+var TableHead = React44.forwardRef(function TableHead2({ className, children, ...props }, ref) {
+  const headerDensity = React44.useContext(TableHeaderDensityContext);
+  return /* @__PURE__ */ jsx46(
     "th",
     {
       "data-slot": "table-head",
@@ -6318,10 +7781,10 @@ var TableHead = React43.forwardRef(function TableHead2({ className, children, ..
     }
   );
 });
-var TableCell = React43.forwardRef(
+var TableCell = React44.forwardRef(
   function TableCell2({ className, density, variant, truncate, children, ...props }, ref) {
     const resolvedDensity = useTableDensity(density);
-    return /* @__PURE__ */ jsx45(
+    return /* @__PURE__ */ jsx46(
       "td",
       {
         "data-density": resolvedDensity,
@@ -6346,8 +7809,8 @@ var TableCell = React43.forwardRef(
     );
   }
 );
-var TableCaption = React43.forwardRef(function TableCaption2({ className, children, ...props }, ref) {
-  return /* @__PURE__ */ jsx45(
+var TableCaption = React44.forwardRef(function TableCaption2({ className, children, ...props }, ref) {
+  return /* @__PURE__ */ jsx46(
     "caption",
     {
       "data-slot": "table-caption",
@@ -6366,12 +7829,12 @@ var TableCaption = React43.forwardRef(function TableCaption2({ className, childr
     }
   );
 });
-var TableCellTitle = React43.forwardRef(
+var TableCellTitle = React44.forwardRef(
   function TableCellTitle2({ className, children, size, ...props }, ref) {
     const density = useTableDensity();
     const resolvedSize = size ?? (density === "compact" ? "compact" : "default");
     const textSize = resolvedSize === "compact" ? "label-md" : "body";
-    return /* @__PURE__ */ jsx45(
+    return /* @__PURE__ */ jsx46(
       "span",
       {
         "data-slot": "table-cell-title",
@@ -6391,11 +7854,11 @@ var TableCellTitle = React43.forwardRef(
     );
   }
 );
-var TableCellDescription = React43.forwardRef(function TableCellDescription2({ className, children, size, ...props }, ref) {
+var TableCellDescription = React44.forwardRef(function TableCellDescription2({ className, children, size, ...props }, ref) {
   const density = useTableDensity();
   const resolvedSize = size ?? (density === "compact" ? "compact" : "default");
   const textSize = resolvedSize === "compact" ? "body-sm" : "tiny";
-  return /* @__PURE__ */ jsx45(
+  return /* @__PURE__ */ jsx46(
     "span",
     {
       "data-slot": "table-cell-description",
@@ -6423,7 +7886,7 @@ function TableStatusBadge({
   ...props
 }) {
   const resolvedDensity = useTableDensity(density);
-  return /* @__PURE__ */ jsx45(
+  return /* @__PURE__ */ jsx46(
     Badge,
     {
       "data-density": resolvedDensity,
@@ -6442,8 +7905,8 @@ function TableStatusBadge({
     }
   );
 }
-var TableActionButton = React43.forwardRef(function TableActionButton2({ className, tone, type = "button", children, ...props }, ref) {
-  return /* @__PURE__ */ jsx45(
+var TableActionButton = React44.forwardRef(function TableActionButton2({ className, tone, type = "button", children, ...props }, ref) {
+  return /* @__PURE__ */ jsx46(
     Button,
     {
       ref,
@@ -6461,8 +7924,8 @@ var TableActionButton = React43.forwardRef(function TableActionButton2({ classNa
     }
   );
 });
-var TableActions = React43.forwardRef(function TableActions2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx45(
+var TableActions = React44.forwardRef(function TableActions2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx46(
     "div",
     {
       ref,
@@ -6489,8 +7952,8 @@ TableActions.displayName = "TableActions";
 
 // src/components/tag.tsx
 import { cva as cva9 } from "class-variance-authority";
-import * as React44 from "react";
-import { jsx as jsx46, jsxs as jsxs23 } from "react/jsx-runtime";
+import * as React45 from "react";
+import { jsx as jsx47, jsxs as jsxs24 } from "react/jsx-runtime";
 var tagVariantOptions = [
   "neutral",
   "organization",
@@ -6531,9 +7994,9 @@ var tagStatusToneClasses = {
   warning: "border-[color:var(--sofya-tone-warning-border)] bg-[color:var(--sofya-tone-warning-background)] text-[color:var(--sofya-tone-warning-foreground)]",
   destructive: "border-[color:var(--sofya-tone-destructive-border)] bg-[color:var(--sofya-tone-destructive-background)] text-[color:var(--sofya-tone-destructive-foreground)]"
 };
-var Tag = React44.forwardRef(function Tag2({ children, className, icon, tone = "info", truncate = false, variant, ...props }, ref) {
+var Tag = React45.forwardRef(function Tag2({ children, className, icon, tone = "info", truncate = false, variant, ...props }, ref) {
   const resolvedVariant = variant ?? "neutral";
-  return /* @__PURE__ */ jsxs23(
+  return /* @__PURE__ */ jsxs24(
     "span",
     {
       ref,
@@ -6547,7 +8010,7 @@ var Tag = React44.forwardRef(function Tag2({ children, className, icon, tone = "
       ),
       ...props,
       children: [
-        icon ? /* @__PURE__ */ jsx46("span", { className: "inline-flex shrink-0 items-center justify-center", children: icon }) : null,
+        icon ? /* @__PURE__ */ jsx47("span", { className: "inline-flex shrink-0 items-center justify-center", children: icon }) : null,
         renderTextContent(children, {
           as: "span",
           className: cn("text-inherit", truncate && "min-w-0 truncate"),
@@ -6568,11 +8031,11 @@ var privacyDefaultLabels = {
   organization: "Minha organiza\xE7\xE3o",
   public: "P\xFAblico"
 };
-var PrivacyLabel = React44.forwardRef(
+var PrivacyLabel = React45.forwardRef(
   function PrivacyLabel2({ appearance = "text", className, icon, label, privacy, ...props }, ref) {
     const content = label ?? privacyDefaultLabels[privacy];
     if (appearance === "tag") {
-      return /* @__PURE__ */ jsx46(
+      return /* @__PURE__ */ jsx47(
         Tag,
         {
           ref,
@@ -6585,7 +8048,7 @@ var PrivacyLabel = React44.forwardRef(
         }
       );
     }
-    return /* @__PURE__ */ jsxs23(
+    return /* @__PURE__ */ jsxs24(
       "span",
       {
         ref,
@@ -6597,7 +8060,7 @@ var PrivacyLabel = React44.forwardRef(
         ),
         ...props,
         children: [
-          icon ? /* @__PURE__ */ jsx46("span", { className: "inline-flex shrink-0 items-center justify-center", children: icon }) : null,
+          icon ? /* @__PURE__ */ jsx47("span", { className: "inline-flex shrink-0 items-center justify-center", children: icon }) : null,
           renderTextContent(content, {
             as: "span",
             className: "text-inherit",
@@ -6611,12 +8074,12 @@ var PrivacyLabel = React44.forwardRef(
 PrivacyLabel.displayName = "PrivacyLabel";
 
 // src/components/template-card.tsx
-import * as React45 from "react";
-import { Fragment as Fragment5, jsx as jsx47, jsxs as jsxs24 } from "react/jsx-runtime";
+import * as React46 from "react";
+import { Fragment as Fragment5, jsx as jsx48, jsxs as jsxs25 } from "react/jsx-runtime";
 var templateCardLayoutOptions = ["card", "list"];
 var templateCardFavoriteDisplayOptions = ["action", "inline"];
 var templateCardMetaPlacementOptions = ["block", "inline"];
-var TemplateCard = React45.forwardRef(
+var TemplateCard = React46.forwardRef(
   function TemplateCard2({
     className,
     description,
@@ -6643,14 +8106,14 @@ var TemplateCard = React45.forwardRef(
     const showInlineMeta = metaPlacement === "inline" && Boolean(meta);
     const showBlockMeta = metaPlacement !== "inline" && Boolean(meta);
     const showFavoriteAction = favoriteDisplay !== "inline" && (onToggleFavorite !== void 0 || favorited !== void 0);
-    const actions = showFavoriteAction || overflow ? /* @__PURE__ */ jsxs24("div", { className: "flex shrink-0 items-center gap-[var(--sofya-gap-tight)]", children: [
-      showFavoriteAction ? /* @__PURE__ */ jsx47(
+    const actions = showFavoriteAction || overflow ? /* @__PURE__ */ jsxs25("div", { className: "flex shrink-0 items-center gap-[var(--sofya-gap-tight)]", children: [
+      showFavoriteAction ? /* @__PURE__ */ jsx48(
         IconButton,
         {
           "aria-label": favoriteLabel,
           selected: Boolean(favorited),
           onClick: onToggleFavorite,
-          icon: /* @__PURE__ */ jsx47(Icon, { name: "star", size: 18 })
+          icon: /* @__PURE__ */ jsx48(Icon, { name: "star", size: 18 })
         }
       ) : null,
       overflow
@@ -6665,10 +8128,10 @@ var TemplateCard = React45.forwardRef(
       style: selectable ? { fontSize: "15px", lineHeight: "26px", fontWeight: 600 } : void 0
     });
     const hasInlineTitleExtras = showInlineStar || showInlineMeta;
-    const titleRow = hasInlineTitleExtras ? /* @__PURE__ */ jsxs24("div", { className: "flex min-w-0 items-center gap-[var(--sofya-gap-tight)]", children: [
-      showInlineStar ? /* @__PURE__ */ jsx47(Icon, { name: "star-filled", size: 18, color: "primary" }) : null,
+    const titleRow = hasInlineTitleExtras ? /* @__PURE__ */ jsxs25("div", { className: "flex min-w-0 items-center gap-[var(--sofya-gap-tight)]", children: [
+      showInlineStar ? /* @__PURE__ */ jsx48(Icon, { name: "star-filled", size: 18, color: "primary" }) : null,
       titleNode,
-      showInlineMeta ? /* @__PURE__ */ jsx47(
+      showInlineMeta ? /* @__PURE__ */ jsx48(
         "span",
         {
           "data-slot": "template-card-meta-inline",
@@ -6677,7 +8140,7 @@ var TemplateCard = React45.forwardRef(
         }
       ) : null
     ] }) : titleNode;
-    const heading = /* @__PURE__ */ jsxs24("div", { className: "flex min-w-0 flex-col gap-[var(--sofya-space-1)]", children: [
+    const heading = /* @__PURE__ */ jsxs25("div", { className: "flex min-w-0 flex-col gap-[var(--sofya-space-1)]", children: [
       titleRow,
       description ? renderTextContent(description, {
         as: "span",
@@ -6695,7 +8158,7 @@ var TemplateCard = React45.forwardRef(
         style: selectable ? { fontSize: "14px", lineHeight: "18px", fontWeight: 400 } : void 0
       }) : null
     ] });
-    const blockMeta = showBlockMeta ? /* @__PURE__ */ jsx47(
+    const blockMeta = showBlockMeta ? /* @__PURE__ */ jsx48(
       "div",
       {
         "data-slot": "template-card-meta",
@@ -6719,7 +8182,7 @@ var TemplateCard = React45.forwardRef(
       }
       onKeyDown?.(event);
     };
-    return /* @__PURE__ */ jsx47(
+    return /* @__PURE__ */ jsx48(
       "div",
       {
         ref,
@@ -6745,13 +8208,13 @@ var TemplateCard = React45.forwardRef(
           className
         ),
         ...props,
-        children: selectable ? /* @__PURE__ */ jsxs24(Fragment5, { children: [
-          /* @__PURE__ */ jsx47(
+        children: selectable ? /* @__PURE__ */ jsxs25(Fragment5, { children: [
+          /* @__PURE__ */ jsx48(
             "span",
             {
               className: "shrink-0",
               onClick: (event) => event.stopPropagation(),
-              children: /* @__PURE__ */ jsx47(
+              children: /* @__PURE__ */ jsx48(
                 Checkbox,
                 {
                   checked: selected,
@@ -6761,15 +8224,15 @@ var TemplateCard = React45.forwardRef(
               )
             }
           ),
-          /* @__PURE__ */ jsx47("div", { className: "min-w-0 flex-1", children: heading }),
+          /* @__PURE__ */ jsx48("div", { className: "min-w-0 flex-1", children: heading }),
           blockMeta,
           actions
-        ] }) : isList ? /* @__PURE__ */ jsxs24(Fragment5, { children: [
-          /* @__PURE__ */ jsx47("div", { className: "min-w-0 flex-1", children: heading }),
+        ] }) : isList ? /* @__PURE__ */ jsxs25(Fragment5, { children: [
+          /* @__PURE__ */ jsx48("div", { className: "min-w-0 flex-1", children: heading }),
           blockMeta,
           actions
-        ] }) : /* @__PURE__ */ jsxs24(Fragment5, { children: [
-          /* @__PURE__ */ jsxs24("div", { className: "flex items-start justify-between gap-[var(--sofya-gap-compact)]", children: [
+        ] }) : /* @__PURE__ */ jsxs25(Fragment5, { children: [
+          /* @__PURE__ */ jsxs25("div", { className: "flex items-start justify-between gap-[var(--sofya-gap-compact)]", children: [
             heading,
             actions
           ] }),
@@ -6780,16 +8243,16 @@ var TemplateCard = React45.forwardRef(
   }
 );
 TemplateCard.displayName = "TemplateCard";
-var TemplateListItem = React45.forwardRef(function TemplateListItem2(props, ref) {
-  return /* @__PURE__ */ jsx47(TemplateCard, { ref, layout: "list", ...props });
+var TemplateListItem = React46.forwardRef(function TemplateListItem2(props, ref) {
+  return /* @__PURE__ */ jsx48(TemplateCard, { ref, layout: "list", ...props });
 });
 TemplateListItem.displayName = "TemplateListItem";
 
 // src/components/tabs.tsx
-import * as React46 from "react";
+import * as React47 from "react";
 import * as TabsPrimitive from "@radix-ui/react-tabs";
 import { motion as motion3 } from "motion/react";
-import { jsx as jsx48, jsxs as jsxs25 } from "react/jsx-runtime";
+import { jsx as jsx49, jsxs as jsxs26 } from "react/jsx-runtime";
 function resolveDefaultValue(items, defaultValue) {
   if (defaultValue) {
     return defaultValue;
@@ -6813,13 +8276,13 @@ function Tabs({
     onChange: onValueChange,
     value
   });
-  const indicatorLayoutId = React46.useId();
-  React46.useEffect(() => {
+  const indicatorLayoutId = React47.useId();
+  React47.useEffect(() => {
     if (value === void 0) {
       setUncontrolledCurrentValue(resolvedDefaultValue);
     }
   }, [resolvedDefaultValue, setUncontrolledCurrentValue, value]);
-  return /* @__PURE__ */ jsxs25(
+  return /* @__PURE__ */ jsxs26(
     TabsPrimitive.Root,
     {
       className: cn("w-full", className),
@@ -6827,7 +8290,7 @@ function Tabs({
       value: currentValue,
       ...props,
       children: [
-        /* @__PURE__ */ jsx48(
+        /* @__PURE__ */ jsx49(
           TabsPrimitive.List,
           {
             "aria-label": "Subtelas navegaveis",
@@ -6838,7 +8301,7 @@ function Tabs({
             children: items.map((item) => {
               const isUnavailable = item.disabled || item.loading;
               const isActive = item.value === currentValue;
-              return /* @__PURE__ */ jsxs25(
+              return /* @__PURE__ */ jsxs26(
                 TabsPrimitive.Trigger,
                 {
                   value: item.value,
@@ -6850,7 +8313,7 @@ function Tabs({
                     item.triggerClassName
                   ),
                   children: [
-                    isActive ? /* @__PURE__ */ jsx48(
+                    isActive ? /* @__PURE__ */ jsx49(
                       motion3.span,
                       {
                         "aria-hidden": "true",
@@ -6860,15 +8323,15 @@ function Tabs({
                         transition: { duration: 0.25, ease: "easeInOut" }
                       }
                     ) : null,
-                    /* @__PURE__ */ jsxs25("span", { className: "relative z-10 inline-flex items-center gap-2", children: [
-                      item.loading ? /* @__PURE__ */ jsx48(
+                    /* @__PURE__ */ jsxs26("span", { className: "relative z-10 inline-flex items-center gap-2", children: [
+                      item.loading ? /* @__PURE__ */ jsx49(
                         "span",
                         {
                           "aria-hidden": "true",
                           className: "h-4 w-4 animate-spin rounded-full border-2 border-current border-r-transparent"
                         }
                       ) : null,
-                      /* @__PURE__ */ jsx48("span", { children: renderTextContent(item.label, {
+                      /* @__PURE__ */ jsx49("span", { children: renderTextContent(item.label, {
                         as: "span",
                         className: "block text-inherit",
                         size: "body"
@@ -6882,7 +8345,7 @@ function Tabs({
           }
         ),
         items.map(
-          (item) => item.content !== void 0 ? /* @__PURE__ */ jsx48(
+          (item) => item.content !== void 0 ? /* @__PURE__ */ jsx49(
             TabsPrimitive.Content,
             {
               value: item.value,
@@ -6905,9 +8368,9 @@ function Tabs({
 Tabs.displayName = "Tabs";
 
 // src/components/textarea.tsx
-import * as React47 from "react";
-import { jsx as jsx49 } from "react/jsx-runtime";
-var Textarea = React47.forwardRef(
+import * as React48 from "react";
+import { jsx as jsx50 } from "react/jsx-runtime";
+var Textarea = React48.forwardRef(
   ({
     className,
     containerClassName,
@@ -6917,10 +8380,10 @@ var Textarea = React47.forwardRef(
     rows = 5,
     ...props
   }, ref) => {
-    const generatedId = React47.useId();
+    const generatedId = React48.useId();
     const resolvedId = id ?? generatedId;
     const ariaLabel = props["aria-label"] ?? (typeof label === "string" ? label : void 0);
-    const control = /* @__PURE__ */ jsx49(
+    const control = /* @__PURE__ */ jsx50(
       "textarea",
       {
         className: cn(
@@ -6934,7 +8397,7 @@ var Textarea = React47.forwardRef(
         "aria-label": ariaLabel
       }
     );
-    return /* @__PURE__ */ jsx49(
+    return /* @__PURE__ */ jsx50(
       FieldShell,
       {
         control,
@@ -6949,10 +8412,10 @@ var Textarea = React47.forwardRef(
 Textarea.displayName = "Textarea";
 
 // src/components/toggle.tsx
-import * as React48 from "react";
+import * as React49 from "react";
 import * as SwitchPrimitives2 from "@radix-ui/react-switch";
-import { jsx as jsx50, jsxs as jsxs26 } from "react/jsx-runtime";
-var Toggle = React48.forwardRef(function Toggle2({
+import { jsx as jsx51, jsxs as jsxs27 } from "react/jsx-runtime";
+var Toggle = React49.forwardRef(function Toggle2({
   "aria-describedby": ariaDescribedBy,
   "aria-labelledby": ariaLabelledBy,
   className,
@@ -6965,7 +8428,7 @@ var Toggle = React48.forwardRef(function Toggle2({
   labelClassName,
   ...props
 }, ref) {
-  const generatedId = React48.useId();
+  const generatedId = React49.useId();
   const resolvedId = id ?? generatedId;
   const labelId = label ? `${resolvedId}-label` : void 0;
   const descriptionId = description ? `${resolvedId}-description` : void 0;
@@ -6973,7 +8436,7 @@ var Toggle = React48.forwardRef(function Toggle2({
   const alignClassName2 = description ? "items-start" : "items-center";
   const resolvedAriaDescribedBy = [ariaDescribedBy, descriptionId].filter(Boolean).join(" ") || void 0;
   const resolvedAriaLabelledBy = ariaLabelledBy ?? labelId;
-  const toggleControl = /* @__PURE__ */ jsx50(
+  const toggleControl = /* @__PURE__ */ jsx51(
     SwitchPrimitives2.Root,
     {
       id: resolvedId,
@@ -6987,7 +8450,7 @@ var Toggle = React48.forwardRef(function Toggle2({
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx50(
+      children: /* @__PURE__ */ jsx51(
         SwitchPrimitives2.Thumb,
         {
           "data-slot": "toggle-thumb",
@@ -6999,7 +8462,7 @@ var Toggle = React48.forwardRef(function Toggle2({
   if (!hasTextContent) {
     return toggleControl;
   }
-  return /* @__PURE__ */ jsxs26(
+  return /* @__PURE__ */ jsxs27(
     "div",
     {
       "data-slot": "toggle-container",
@@ -7010,8 +8473,8 @@ var Toggle = React48.forwardRef(function Toggle2({
       }),
       children: [
         toggleControl,
-        /* @__PURE__ */ jsxs26("span", { className: selectionControlContentBaseClasses, children: [
-          label ? /* @__PURE__ */ jsx50("label", { htmlFor: resolvedId, className: selectionControlLabelTextBaseClasses, children: /* @__PURE__ */ jsx50(
+        /* @__PURE__ */ jsxs27("span", { className: selectionControlContentBaseClasses, children: [
+          label ? /* @__PURE__ */ jsx51("label", { htmlFor: resolvedId, className: selectionControlLabelTextBaseClasses, children: /* @__PURE__ */ jsx51(
             "span",
             {
               id: labelId,
@@ -7023,7 +8486,7 @@ var Toggle = React48.forwardRef(function Toggle2({
               })
             }
           ) }) : null,
-          description ? /* @__PURE__ */ jsx50(
+          description ? /* @__PURE__ */ jsx51(
             "span",
             {
               id: descriptionId,
@@ -7046,13 +8509,13 @@ var Toggle = React48.forwardRef(function Toggle2({
 Toggle.displayName = "Toggle";
 
 // src/theme/provider.tsx
-import * as React49 from "react";
+import * as React50 from "react";
 import {
   createWhitelabelTheme,
   defaultTheme,
   themeToCssVariables
 } from "@sofya-ds/tokens";
-import { jsx as jsx51 } from "react/jsx-runtime";
+import { jsx as jsx52 } from "react/jsx-runtime";
 var SOFYA_FONT_LINKS = [
   {
     id: "preconnect-googleapis",
@@ -7072,7 +8535,7 @@ var SOFYA_FONT_LINKS = [
   }
 ];
 function useSofyaFontLinks() {
-  React49.useEffect(() => {
+  React50.useEffect(() => {
     if (typeof document === "undefined") {
       return;
     }
@@ -7105,7 +8568,7 @@ function SofyaProvider({
   useSofyaFontLinks();
   const theme = createWhitelabelTheme(overrides ?? {}, preset);
   const cssVariables = themeToCssVariables(theme);
-  return /* @__PURE__ */ jsx51(
+  return /* @__PURE__ */ jsx52(
     "div",
     {
       "data-sofya-theme": theme.name,
@@ -7225,6 +8688,15 @@ export {
   RadioGroupOptionDescription,
   RadioGroupOptionIndicator,
   RadioGroupOptionLabel,
+  ReasoningLabsWidget,
+  ReasoningSummaryWidget,
+  ReasoningVitalsWidget,
+  ReasoningWidget,
+  ReasoningWidgetActionButton,
+  ReasoningWidgetActions,
+  ReasoningWidgetList,
+  ReasoningWidgetRenderer,
+  ReasoningWidgetTable,
   RichTextToolbar,
   RichTextToolbarButton,
   RichTextToolbarGroup,
@@ -7329,6 +8801,14 @@ export {
   progressSizeOptions,
   radioGroupOrientationOptions,
   radioGroupVariantOptions,
+  reasoningWidgetActionScopeOptions,
+  reasoningWidgetActionToneOptions,
+  reasoningWidgetDensityOptions,
+  reasoningWidgetFrameOptions,
+  reasoningWidgetTableAlignOptions,
+  reasoningWidgetTableColumnVariantOptions,
+  reasoningWidgetToneOptions,
+  reasoningWidgetVariantOptions,
   renderTextContent,
   resolveSurfaceToken,
   resolveTextStyle,