@sofya-ds/react 1.3.6 → 1.3.8

package/dist/index.js

@@ -612,7 +612,7 @@ var accordionItemClasses = {
   card: "group/accordion-item bg-transparent text-foreground"
 };
 var accordionTriggerClasses = {
-  default: "sofya-accordion-trigger flex flex-1 items-center justify-between gap-4 py-4 text-left [font-family:var(--sofya-text-body-font-family)] text-[length:var(--sofya-text-body-font-size)] font-medium leading-[var(--sofya-text-body-line-height)] tracking-[var(--sofya-text-body-letter-spacing)] text-foreground transition-colors duration-sofya ease-sofya focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50",
+  default: "sofya-accordion-trigger flex flex-1 items-center justify-between gap-4 py-4 text-left [font-family:var(--sofya-text-tiny-font-family)] text-[length:var(--sofya-text-tiny-font-size)] font-medium leading-[var(--sofya-text-tiny-line-height)] tracking-[var(--sofya-text-tiny-letter-spacing)] text-foreground transition-colors duration-sofya ease-sofya focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50",
   card: "sofya-accordion-trigger flex w-full items-center justify-between gap-4 rounded-[16px] border border-secondary bg-[color:var(--sofya-background)] px-6 py-4 text-left text-foreground transition-[background-color,border-color,box-shadow,color] duration-sofya ease-sofya hover:border-secondary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[color:var(--sofya-focus-ring-soft)] focus-visible:ring-offset-0 disabled:pointer-events-none disabled:opacity-50"
 };
 var accordionContentClasses = {
@@ -690,7 +690,7 @@ var AccordionTrigger = React4.forwardRef(
                       renderTextContent(children, {
                         as: "span",
                         className: "block min-w-0 text-foreground",
-                        size: appearance === "card" ? "h5" : "body",
+                        size: appearance === "card" ? "body" : "tiny",
                         style: appearance === "card" ? void 0 : {
                           color: "inherit",
                           fontFamily: "inherit",
@@ -703,7 +703,7 @@ var AccordionTrigger = React4.forwardRef(
                       hasDescription ? renderTextContent(description, {
                         as: "span",
                         className: "block min-w-0 text-muted-foreground",
-                        size: "body"
+                        size: "tiny"
                       }) : null
                     ]
                   }
@@ -746,7 +746,8 @@ var AccordionContent = React4.forwardRef(({ className, children, contentClassNam
             contentClassName
           ),
           children: renderTextContent(children, {
-            className: appearance === "card" ? "text-foreground" : "text-muted-foreground"
+            className: appearance === "card" ? "text-foreground" : "text-muted-foreground",
+            size: "tiny"
           })
         }
       )
@@ -862,7 +863,7 @@ var AlertDescription = React5.forwardRef(function AlertDescription2({ children,
       children: renderTextContent(children, {
         as: "span",
         className: "block text-current/80",
-        size: "body"
+        size: "tiny"
       })
     }
   );
@@ -886,7 +887,7 @@ var badgeVariantOptions = [
 var badgeAlertOptions = ["default", "medium", "high"];
 var badgePillToneOptions = ["neutral", "danger"];
 var badgeVariants = cva3(
-  "inline-flex min-h-[34px] items-center justify-center whitespace-nowrap rounded-[5px] px-4 py-2 text-[14px] font-semibold uppercase leading-none tracking-[0.08em] transition-colors duration-sofya ease-sofya",
+  "inline-flex min-h-[34px] items-center justify-center whitespace-nowrap rounded-[5px] px-4 py-2 [font-family:var(--sofya-text-tiny-font-family)] text-[length:var(--sofya-text-tiny-font-size)] font-semibold uppercase leading-none tracking-[0.08em] transition-colors duration-sofya ease-sofya",
   {
     variants: {
       variant: {
@@ -905,7 +906,7 @@ var badgeVariants = cva3(
   }
 );
 var badgeAlertVariants = cva3(
-  "inline-flex min-h-[34px] items-center justify-center whitespace-nowrap rounded-[5px] px-4 py-2 text-[14px] font-semibold uppercase leading-none tracking-[0.08em] transition-colors duration-sofya ease-sofya",
+  "inline-flex min-h-[34px] items-center justify-center whitespace-nowrap rounded-[5px] px-4 py-2 [font-family:var(--sofya-text-tiny-font-family)] text-[length:var(--sofya-text-tiny-font-size)] font-semibold uppercase leading-none tracking-[0.08em] transition-colors duration-sofya ease-sofya",
   {
     variants: {
       alert: {
@@ -920,7 +921,7 @@ var badgeAlertVariants = cva3(
   }
 );
 var badgePillVariants = cva3(
-  "inline-flex h-[30px] items-center justify-center whitespace-nowrap rounded-full border px-4 py-2 text-[12px] font-semibold leading-none tracking-normal transition-colors duration-sofya ease-sofya",
+  "inline-flex h-[30px] items-center justify-center whitespace-nowrap rounded-full border px-4 py-2 [font-family:var(--sofya-text-extra-tiny-font-family)] text-[length:var(--sofya-text-extra-tiny-font-size)] font-semibold leading-none tracking-normal transition-colors duration-sofya ease-sofya",
   {
     variants: {
       tone: {
@@ -1734,7 +1735,7 @@ var Checkbox = React10.forwardRef(
                 children: renderTextContent(label, {
                   as: "span",
                   className: "text-[color:var(--sofya-text-default)]",
-                  size: "body"
+                  size: "tiny"
                 })
               }
             ) : null,
@@ -1749,7 +1750,7 @@ var Checkbox = React10.forwardRef(
                 children: renderTextContent(description, {
                   as: "span",
                   className: "text-muted-foreground",
-                  size: "body"
+                  size: "tiny"
                 })
               }
             ) : null
@@ -1792,7 +1793,8 @@ import { jsx as jsx12, jsxs as jsxs5 } from "react/jsx-runtime";
 var dropdownVariantOptions = [
   "card",
   "language",
-  "selected"
+  "selected",
+  "action"
 ];
 var dropdownAppearanceOptions = ["card"];
 var dropdownTriggerSizeOptions = ["default", "sm", "lg"];
@@ -1804,7 +1806,8 @@ var dropdownLanguageItems = [
 var dropdownTriggerToneClasses = {
   card: "text-primary",
   language: "",
-  selected: "w-full border-[color:var(--sofya-border-strong)] [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)]"
+  selected: "w-full border-[color:var(--sofya-border-strong)] [font-family:var(--sofya-text-tiny-font-family)] text-[length:var(--sofya-text-tiny-font-size)] [font-weight:var(--sofya-text-tiny-font-weight)] leading-[var(--sofya-text-tiny-line-height)] tracking-[var(--sofya-text-tiny-letter-spacing)]",
+  action: ""
 };
 var dropdownTriggerSizeClasses = {
   regular: {
@@ -1821,6 +1824,11 @@ var dropdownTriggerSizeClasses = {
     default: "h-5 w-5 p-0",
     sm: "h-[18px] w-[18px] p-0",
     lg: "h-6 w-6 p-0"
+  },
+  action: {
+    default: "h-10 w-10 p-0",
+    sm: "h-8 w-8 p-0",
+    lg: "h-12 w-12 p-0"
   }
 };
 var dropdownAppearanceClasses = {
@@ -1832,12 +1840,14 @@ var dropdownAppearanceClasses = {
 var dropdownContentBaseClasses = {
   card: "border-[color:var(--sofya-border-strong)] text-foreground shadow-[var(--sofya-shadow-soft)]",
   language: "w-[224px] min-w-[224px] border-[color:var(--sofya-border-strong)] text-foreground shadow-[var(--sofya-shadow-soft)]",
-  selected: "w-[var(--radix-dropdown-menu-trigger-width)] min-w-[var(--radix-dropdown-menu-trigger-width)] border-[color:var(--sofya-border-strong)] text-foreground shadow-[var(--sofya-shadow-soft)]"
+  selected: "w-[var(--radix-dropdown-menu-trigger-width)] min-w-[var(--radix-dropdown-menu-trigger-width)] border-[color:var(--sofya-border-strong)] text-foreground shadow-[var(--sofya-shadow-soft)]",
+  action: "w-[224px] min-w-[224px] border-[color:var(--sofya-border-strong)] text-foreground shadow-[var(--sofya-shadow-soft)]"
 };
 var dropdownItemClasses = {
   card: "text-foreground",
   language: "text-foreground",
-  selected: "text-foreground"
+  selected: "text-foreground",
+  action: "text-foreground"
 };
 function isButtonLanguageLocale(value) {
   return buttonLanguageLocaleOptions.includes(value);
@@ -1863,6 +1873,9 @@ function resolveDropdownTriggerSizeFamily(variant) {
   if (variant === "selected") {
     return "selected";
   }
+  if (variant === "action") {
+    return "action";
+  }
   return "regular";
 }
 function DefaultDropdownTriggerIcon({ variant }) {
@@ -1901,6 +1914,7 @@ function Dropdown({
   defaultOpen,
   defaultValue,
   disabled = false,
+  iconTrigger,
   items,
   itemClassName,
   modal,
@@ -1917,9 +1931,10 @@ function Dropdown({
 }) {
   const isLanguageVariant = variant === "language";
   const isSelectedVariant = variant === "selected";
+  const isActionVariant = variant === "action";
   const resolvedAppearance = resolveDropdownAppearance({ appearance, variant });
   const triggerSizeFamily = resolveDropdownTriggerSizeFamily(variant);
-  const usesDefaultListStyle = !isLanguageVariant;
+  const usesDefaultListStyle = !isLanguageVariant && !isActionVariant;
   const resolvedItems = React12.useMemo(
     () => isLanguageVariant ? items && items.length > 0 ? items : dropdownLanguageItems : items ?? [],
     [isLanguageVariant, items]
@@ -1930,6 +1945,7 @@ function Dropdown({
     onChange: onValueChange,
     value
   });
+  const [subValues, setSubValues] = React12.useState({});
   const radioValue = selectedValue ?? "";
   const selectedItem = resolvedItems.find(
     (item) => item.value === selectedValue
@@ -1951,7 +1967,7 @@ function Dropdown({
     setUncontrolledSelectedValue,
     value
   ]);
-  const resolvedTriggerIcon = isLanguageVariant ? void 0 : triggerIcon === void 0 ? /* @__PURE__ */ jsx12(DefaultDropdownTriggerIcon, { variant }) : triggerIcon;
+  const resolvedTriggerIcon = isLanguageVariant || isActionVariant ? void 0 : triggerIcon === void 0 ? /* @__PURE__ */ jsx12(DefaultDropdownTriggerIcon, { variant }) : triggerIcon;
   const triggerLabel = selectedItem?.triggerLabel ?? selectedItem?.label ?? placeholder;
   const selectedTriggerToneClassName = isSelectedVariant ? hasSelectedItem ? "text-foreground" : "text-[color:var(--sofya-text-soft)]" : void 0;
   return /* @__PURE__ */ jsxs5(
@@ -1966,7 +1982,7 @@ function Dropdown({
           Button,
           {
             type: "button",
-            variant: isLanguageVariant ? "language" : "dropdown",
+            variant: isLanguageVariant ? "language" : isActionVariant ? "ghost" : "dropdown",
             languageLocale: selectedLanguageLocale,
             "data-appearance": resolvedAppearance,
             "data-trigger-size": triggerSize,
@@ -1978,11 +1994,12 @@ function Dropdown({
               selectedTriggerToneClassName,
               triggerClassName
             ),
+            leftIcon: isActionVariant ? iconTrigger : void 0,
             rightIcon: resolvedTriggerIcon,
-            children: isLanguageVariant ? null : /* @__PURE__ */ jsx12("span", { className: "min-w-0 truncate", children: renderTextContent(triggerLabel, {
+            children: isLanguageVariant || isActionVariant ? null : /* @__PURE__ */ jsx12("span", { className: "min-w-0 truncate", children: renderTextContent(triggerLabel, {
               as: "span",
               className: "block min-w-0 truncate text-inherit",
-              size: "body"
+              size: "tiny"
             }) })
           }
         ) }),
@@ -2009,43 +2026,121 @@ function Dropdown({
                   const itemLanguageLocale = resolveItemLanguageLocale(item);
                   const indicator = item.indicator ?? /* @__PURE__ */ jsx12(DefaultDropdownItemIndicator, {});
                   const itemIcon = item.icon ?? (variant === "language" && itemLanguageLocale ? /* @__PURE__ */ jsx12(LanguageFlagIcon, { locale: itemLanguageLocale }) : null);
+                  if (isActionVariant && item.subItems && item.subItems.length > 0) {
+                    const currentSubValue = subValues[item.value];
+                    return /* @__PURE__ */ jsxs5(DropdownMenuPrimitive.Sub, { children: [
+                      /* @__PURE__ */ jsxs5(
+                        DropdownMenuPrimitive.SubTrigger,
+                        {
+                          disabled: item.disabled,
+                          className: cn(
+                            "flex w-full min-w-0 overflow-hidden cursor-pointer items-center gap-2.5 rounded-full px-1.5 py-1 outline-none transition-colors duration-sofya ease-sofya",
+                            "data-[highlighted]:bg-muted data-[state=open]:bg-muted data-[disabled]:pointer-events-none data-[disabled]:opacity-40",
+                            dropdownItemClasses[variant],
+                            itemClassName
+                          ),
+                          children: [
+                            itemIcon && /* @__PURE__ */ jsx12("span", { className: "flex shrink-0 items-center justify-center", children: itemIcon }),
+                            /* @__PURE__ */ jsx12("span", { className: "min-w-0 flex-1 truncate", children: renderTextContent(item.label, {
+                              as: "span",
+                              className: "block truncate text-inherit",
+                              size: "tiny"
+                            }) }),
+                            /* @__PURE__ */ jsx12("span", { className: "flex shrink-0 items-center justify-center text-[color:var(--sofya-text-subtle)]", children: /* @__PURE__ */ jsx12(Icon, { name: "caret-right", size: 12 }) })
+                          ]
+                        }
+                      ),
+                      /* @__PURE__ */ jsx12(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx12(
+                        DropdownMenuPrimitive.SubContent,
+                        {
+                          sideOffset: 4,
+                          className: cn(
+                            "sofya-dropdown-content z-50 w-[224px] min-w-[224px] overflow-hidden border bg-card p-2 outline-none",
+                            "rounded-[20px] border-[color:var(--sofya-border-strong)] text-foreground shadow-[var(--sofya-shadow-soft)]"
+                          ),
+                          children: /* @__PURE__ */ jsx12(
+                            DropdownMenuPrimitive.RadioGroup,
+                            {
+                              value: currentSubValue ?? "",
+                              onValueChange: (subValue) => {
+                                setSubValues((prev) => ({
+                                  ...prev,
+                                  [item.value]: subValue
+                                }));
+                                setSelectedValue(subValue);
+                              },
+                              className: "grid gap-1",
+                              children: item.subItems.map((subItem) => {
+                                const isSubSelected = subItem.value === currentSubValue;
+                                return /* @__PURE__ */ jsxs5(
+                                  DropdownMenuPrimitive.RadioItem,
+                                  {
+                                    value: subItem.value,
+                                    disabled: subItem.disabled,
+                                    className: cn(
+                                      "flex w-full min-w-0 overflow-hidden cursor-pointer items-center gap-2.5 rounded-full px-1.5 py-1 text-foreground outline-none transition-colors duration-sofya ease-sofya",
+                                      "data-[highlighted]:bg-muted data-[disabled]:pointer-events-none data-[disabled]:opacity-40"
+                                    ),
+                                    children: [
+                                      subItem.icon && /* @__PURE__ */ jsx12("span", { className: "flex shrink-0 items-center justify-center", children: subItem.icon }),
+                                      /* @__PURE__ */ jsx12("span", { className: "min-w-0 flex-1 truncate", children: renderTextContent(subItem.label, {
+                                        as: "span",
+                                        className: "block truncate text-inherit",
+                                        size: "tiny"
+                                      }) }),
+                                      /* @__PURE__ */ jsx12(
+                                        "span",
+                                        {
+                                          "aria-hidden": "true",
+                                          className: cn(
+                                            "flex h-4 w-4 shrink-0 items-center justify-center text-primary transition-opacity duration-sofya ease-sofya",
+                                            isSubSelected ? "opacity-100" : "opacity-0"
+                                          ),
+                                          children: /* @__PURE__ */ jsx12(DefaultDropdownItemIndicator, {})
+                                        }
+                                      )
+                                    ]
+                                  },
+                                  subItem.value
+                                );
+                              })
+                            }
+                          )
+                        }
+                      ) })
+                    ] }, item.value);
+                  }
                   if (!usesDefaultListStyle) {
-                    return /* @__PURE__ */ jsx12(
+                    return /* @__PURE__ */ jsxs5(
                       DropdownMenuPrimitive.RadioItem,
                       {
                         value: item.value,
                         disabled: item.disabled,
-                        asChild: true,
-                        children: /* @__PURE__ */ jsx12(
-                          Button,
-                          {
-                            variant: "ghost",
-                            className: cn(
-                              "h-auto w-full px-1.5 py-1 font-normal data-[highlighted]:bg-muted [&>span.relative]:w-full",
-                              dropdownItemClasses[variant],
-                              itemClassName
-                            ),
-                            children: /* @__PURE__ */ jsxs5("span", { className: "flex w-full items-center gap-2.5", children: [
-                              itemIcon && /* @__PURE__ */ jsx12("span", { className: "flex shrink-0 items-center justify-center", children: itemIcon }),
-                              /* @__PURE__ */ jsx12("span", { className: "min-w-0 flex-1 truncate text-left", children: renderTextContent(item.label, {
-                                as: "span",
-                                className: "block truncate text-inherit",
-                                size: "tiny"
-                              }) }),
-                              /* @__PURE__ */ jsx12(
-                                "span",
-                                {
-                                  "aria-hidden": "true",
-                                  className: cn(
-                                    "flex h-4 w-4 shrink-0 items-center justify-center text-primary transition-opacity duration-sofya ease-sofya",
-                                    isSelected ? "opacity-100" : "opacity-0"
-                                  ),
-                                  children: indicator
-                                }
-                              )
-                            ] })
-                          }
-                        )
+                        className: cn(
+                          "flex w-full min-w-0 overflow-hidden cursor-pointer items-center gap-2.5 rounded-full px-1.5 py-1 outline-none transition-colors duration-sofya ease-sofya",
+                          "data-[highlighted]:bg-muted data-[disabled]:pointer-events-none data-[disabled]:opacity-40",
+                          dropdownItemClasses[variant],
+                          itemClassName
+                        ),
+                        children: [
+                          itemIcon && /* @__PURE__ */ jsx12("span", { className: "flex shrink-0 items-center justify-center", children: itemIcon }),
+                          /* @__PURE__ */ jsx12("span", { className: "min-w-0 flex-1 truncate", children: renderTextContent(item.label, {
+                            as: "span",
+                            className: "block truncate text-inherit",
+                            size: "tiny"
+                          }) }),
+                          /* @__PURE__ */ jsx12(
+                            "span",
+                            {
+                              "aria-hidden": "true",
+                              className: cn(
+                                "flex h-4 w-4 shrink-0 items-center justify-center text-primary transition-opacity duration-sofya ease-sofya",
+                                isSelected ? "opacity-100" : "opacity-0"
+                              ),
+                              children: indicator
+                            }
+                          )
+                        ]
                       },
                       item.value
                     );
@@ -2056,7 +2151,7 @@ function Dropdown({
                       value: item.value,
                       disabled: item.disabled,
                       className: cn(
-                        "flex w-full cursor-pointer items-center rounded-[4px] [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-[22px] tracking-[var(--sofya-text-body-letter-spacing)] outline-none transition-colors duration-sofya ease-sofya data-[disabled]:pointer-events-none data-[disabled]:opacity-40",
+                        "flex w-full cursor-pointer items-center rounded-[4px] [font-family:var(--sofya-text-tiny-font-family)] text-[length:var(--sofya-text-tiny-font-size)] [font-weight:var(--sofya-text-tiny-font-weight)] leading-[22px] tracking-[var(--sofya-text-tiny-letter-spacing)] outline-none transition-colors duration-sofya ease-sofya data-[disabled]:pointer-events-none data-[disabled]:opacity-40",
                         "px-0 py-0 data-[highlighted]:bg-transparent [&[data-highlighted]_span[data-dropdown-item-body]]:bg-[color:var(--sofya-surface-selected)]",
                         dropdownItemClasses[variant],
                         itemClassName
@@ -2100,262 +2195,21 @@ function Dropdown({
   );
 }
 
-// src/components/dialog.tsx
-import * as React13 from "react";
-import * as DialogPrimitive from "@radix-ui/react-dialog";
-import { jsx as jsx13, jsxs as jsxs6 } from "react/jsx-runtime";
-var Dialog = DialogPrimitive.Root;
-var DialogTrigger = DialogPrimitive.Trigger;
-var DialogPortal = DialogPrimitive.Portal;
-var DialogClose = DialogPrimitive.Close;
-var DialogInternalContext = React13.createContext({
-  showCloseButton: true
-});
-var DialogOverlay = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
-  DialogPrimitive.Overlay,
-  {
-    ref,
-    className: cn(
-      "sofya-dialog-overlay fixed inset-0 z-50 bg-foreground/24 backdrop-blur-[6px]",
-      className
-    ),
-    ...props
-  }
-));
-DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
-var DialogContent = React13.forwardRef(
-  ({
-    className,
-    children,
-    cardClassName,
-    overlayClassName,
-    showCloseButton = true,
-    variant = "card",
-    ...props
-  }, ref) => {
-    const dialogCardStyle = {
-      "--sofya-surface-shadow-override": "var(--sofya-shadow-lg)"
-    };
-    return /* @__PURE__ */ jsx13(DialogInternalContext.Provider, { value: { showCloseButton }, children: /* @__PURE__ */ jsxs6(DialogPortal, { children: [
-      /* @__PURE__ */ jsx13(DialogOverlay, { className: overlayClassName }),
-      /* @__PURE__ */ jsx13("div", { className: "sofya-dialog-positioner fixed inset-0 z-50 flex items-center justify-center p-4", children: /* @__PURE__ */ jsx13(
-        DialogPrimitive.Content,
-        {
-          ref,
-          className: cn(
-            "sofya-dialog-content relative flex w-full max-w-[680px] max-h-[calc(100vh-2rem)] outline-none",
-            className
-          ),
-          ...props,
-          children: /* @__PURE__ */ jsx13(
-            Card,
-            {
-              variant,
-              className: cn(
-                "flex max-h-[inherit] min-h-0 w-full flex-col gap-6 overflow-y-auto overflow-x-hidden p-6",
-                cardClassName
-              ),
-              style: dialogCardStyle,
-              children
-            }
-          )
-        }
-      ) })
-    ] }) });
-  }
-);
-DialogContent.displayName = DialogPrimitive.Content.displayName;
-function DialogHeader({ className, children, ...props }) {
-  const { showCloseButton } = React13.useContext(DialogInternalContext);
-  return /* @__PURE__ */ jsxs6(
-    "div",
-    {
-      className: cn("flex w-full items-start justify-between gap-4", className),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsx13("div", { className: "flex min-w-0 flex-1 flex-col gap-2 text-left", children }),
-        showCloseButton ? /* @__PURE__ */ jsx13(DialogPrimitive.Close, { asChild: true, children: /* @__PURE__ */ jsx13(
-          Button,
-          {
-            type: "button",
-            variant: "ghost",
-            size: "icon",
-            "aria-label": "Close",
-            leftIcon: /* @__PURE__ */ jsx13(Icon, { name: "x", size: 18 }),
-            className: "shrink-0 text-muted-foreground hover:text-foreground"
-          }
-        ) }) : null
-      ]
-    }
-  );
-}
-function DialogBody({ className, ...props }) {
-  return /* @__PURE__ */ jsx13(
-    "div",
-    {
-      className: cn("flex flex-col gap-4", className),
-      ...props
-    }
-  );
-}
-function DialogFooter({ className, ...props }) {
-  return /* @__PURE__ */ jsx13(
-    "div",
-    {
-      className: cn("flex items-center justify-end gap-2", className),
-      ...props
-    }
-  );
-}
-var DialogCancel = React13.forwardRef(
-  ({ type = "button", variant = "ghost", ...props }, ref) => /* @__PURE__ */ jsx13(DialogPrimitive.Close, { asChild: true, children: /* @__PURE__ */ jsx13(Button, { ref, type, variant, ...props }) })
-);
-DialogCancel.displayName = "DialogCancel";
-var DialogTitle = React13.forwardRef(({ children, className, ...props }, ref) => /* @__PURE__ */ jsx13(
-  DialogPrimitive.Title,
-  {
-    ref,
-    className: cn("text-card-foreground", className),
-    ...props,
-    children: renderTextContent(children, {
-      as: "span",
-      className: "block text-card-foreground",
-      size: "h3"
-    })
-  }
-));
-DialogTitle.displayName = DialogPrimitive.Title.displayName;
-var DialogDescription = React13.forwardRef(({ children, className, ...props }, ref) => /* @__PURE__ */ jsx13(
-  DialogPrimitive.Description,
-  {
-    ref,
-    className: cn("text-muted-foreground", className),
-    ...props,
-    children: renderTextContent(children, {
-      as: "span",
-      className: "block text-muted-foreground",
-      size: "body"
-    })
-  }
-));
-DialogDescription.displayName = DialogPrimitive.Description.displayName;
-
-// src/components/empty.tsx
-import * as React14 from "react";
-import { cva as cva5 } from "class-variance-authority";
-import { Fragment as Fragment2, jsx as jsx14, jsxs as jsxs7 } from "react/jsx-runtime";
-var emptyMediaVariantOptions = ["default", "icon"];
-var emptyMediaVariants = cva5(
-  "inline-flex shrink-0 items-center justify-center transition-[background-color,border-color,color,box-shadow] duration-sofya ease-sofya",
-  {
-    variants: {
-      variant: {
-        default: "[&_img]:max-w-full [&_svg]:shrink-0 [&_svg]:text-primary",
-        icon: "h-16 w-16 rounded-full border border-primary/10 bg-primary/10 text-primary [&_svg]:h-7 [&_svg]:w-7 [&_svg]:shrink-0"
-      }
-    },
-    defaultVariants: {
-      variant: "default"
-    }
-  }
-);
-var EmptyMedia = React14.forwardRef(function EmptyMedia2({ className, variant, ...props }, ref) {
-  return /* @__PURE__ */ jsx14("div", { ref, className: cn(emptyMediaVariants({ variant }), className), ...props });
-});
-function EmptyHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx14(
-    "div",
-    {
-      className: cn("flex max-w-[34rem] flex-col items-center gap-4 text-center", className),
-      ...props
-    }
-  );
-}
-function EmptyTitle({ children, className, ...props }) {
-  return /* @__PURE__ */ jsx14(
-    "h2",
-    {
-      className: cn("text-foreground", className),
-      ...props,
-      children: renderTextContent(children, {
-        as: "span",
-        className: "block text-foreground",
-        size: "h4"
-      })
-    }
-  );
-}
-function EmptyDescription({
-  children,
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx14(
-    "p",
-    {
-      className: cn("max-w-full text-muted-foreground whitespace-nowrap", className),
-      ...props,
-      children: renderTextContent(children, {
-        as: "span",
-        className: "inline-block whitespace-nowrap text-muted-foreground",
-        size: "body"
-      })
-    }
-  );
-}
-function EmptyContent({ children, className, ...props }) {
-  return /* @__PURE__ */ jsx14(
-    "div",
-    {
-      className: cn("flex flex-wrap items-center justify-center gap-4 text-center", className),
-      ...props,
-      children: renderTextContent(children, {
-        as: "span"
-      })
-    }
-  );
-}
-var Empty = React14.forwardRef(function Empty2({ children, className, content, description, media, title, ...props }, ref) {
-  const hasCustomChildren = React14.Children.count(children) > 0;
-  return /* @__PURE__ */ jsx14(
-    "div",
-    {
-      ref,
-      className: cn(
-        "flex min-h-[280px] w-full flex-col items-center justify-center gap-6 rounded-[28px] bg-gradient-to-b from-card via-card to-muted/45 px-6 py-10 text-center",
-        className
-      ),
-      ...props,
-      children: hasCustomChildren ? children : /* @__PURE__ */ jsxs7(Fragment2, { children: [
-        /* @__PURE__ */ jsxs7(EmptyHeader, { children: [
-          media ?? /* @__PURE__ */ jsx14(EmptyMedia, { variant: "icon", "aria-hidden": "true", children: /* @__PURE__ */ jsx14(Icon, { name: "folders", size: 28 }) }),
-          /* @__PURE__ */ jsx14(EmptyTitle, { children: title ?? "Nada por aqui" }),
-          /* @__PURE__ */ jsx14(EmptyDescription, { children: description ?? "Quando houver conte\xFAdo dispon\xEDvel, ele aparecer\xE1 aqui." })
-        ] }),
-        content !== void 0 && content !== null ? /* @__PURE__ */ jsx14(EmptyContent, { children: content }) : null
-      ] })
-    }
-  );
-});
-Empty.displayName = "Empty";
-EmptyMedia.displayName = "EmptyMedia";
-EmptyHeader.displayName = "EmptyHeader";
-EmptyTitle.displayName = "EmptyTitle";
-EmptyDescription.displayName = "EmptyDescription";
-EmptyContent.displayName = "EmptyContent";
+// src/components/dropdown-search.tsx
+import * as React18 from "react";
 
 // src/components/input.tsx
-import * as React17 from "react";
+import * as React15 from "react";
 import { REGEXP_ONLY_DIGITS as REGEXP_ONLY_DIGITS2 } from "input-otp";
 
 // src/lib/field-shell.tsx
-import { jsx as jsx15, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx13, jsxs as jsxs6 } from "react/jsx-runtime";
 function FieldLabel({
   children,
   className,
   htmlFor,
   textClassName = "block text-[color:var(--sofya-text-default)]",
-  textSize = "body",
+  textSize = "tiny",
   textStyle = {
     fontWeight: 500
   }
@@ -2364,7 +2218,7 @@ function FieldLabel({
     return null;
   }
   const Component = htmlFor ? "label" : "div";
-  return /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx13(
     Component,
     {
       className: cn("text-[color:var(--sofya-text-default)]", className),
@@ -2391,8 +2245,8 @@ function FieldShell({
   if (!label && !containerClassName) {
     return control;
   }
-  return /* @__PURE__ */ jsxs8("div", { className: cn("grid w-full gap-2", containerClassName), children: [
-    label ? /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsxs6("div", { className: cn("grid w-full gap-2", containerClassName), children: [
+    label ? /* @__PURE__ */ jsx13(
       FieldLabel,
       {
         className: labelClassName,
@@ -2408,7 +2262,7 @@ function FieldShell({
 }
 
 // src/components/input-upload.tsx
-import * as React15 from "react";
+import * as React13 from "react";
 import {
   IconFileText,
   IconPhoto,
@@ -2416,7 +2270,7 @@ import {
   IconVideo
 } from "@tabler/icons-react";
 import { AnimatePresence, motion as motion2, useReducedMotion as useReducedMotion2 } from "motion/react";
-import { jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx14, jsxs as jsxs7 } from "react/jsx-runtime";
 var uploadKindOptions = ["document", "image", "video"];
 var uploadAcceptByKind = {
   document: ".pdf,.doc,.docx,.txt,.rtf,.odt,.jpg,.jpeg,.png,.webp,.gif",
@@ -2510,7 +2364,7 @@ function resolveUploadFileVisualKind(file, fallbackKind) {
   return "document";
 }
 function UploadGlyph({ className }) {
-  return /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsx14(
     IconUpload,
     {
       "aria-hidden": "true",
@@ -2523,7 +2377,7 @@ function UploadFileTypeGlyph({
   kind
 }) {
   if (kind === "image") {
-    return /* @__PURE__ */ jsx16(
+    return /* @__PURE__ */ jsx14(
       IconPhoto,
       {
         "aria-hidden": "true",
@@ -2532,7 +2386,7 @@ function UploadFileTypeGlyph({
     );
   }
   if (kind === "video") {
-    return /* @__PURE__ */ jsx16(
+    return /* @__PURE__ */ jsx14(
       IconVideo,
       {
         "aria-hidden": "true",
@@ -2540,7 +2394,7 @@ function UploadFileTypeGlyph({
       }
     );
   }
-  return /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsx14(
     IconFileText,
     {
       "aria-hidden": "true",
@@ -2548,7 +2402,7 @@ function UploadFileTypeGlyph({
     }
   );
 }
-var UploadInputControl = React15.forwardRef(function UploadInputControl2({
+var UploadInputControl = React13.forwardRef(function UploadInputControl2({
   accept,
   "aria-label": ariaLabel,
   className,
@@ -2562,17 +2416,17 @@ var UploadInputControl = React15.forwardRef(function UploadInputControl2({
   resolvedId,
   ...uploadProps
 }, ref) {
-  const inputRef = React15.useRef(null);
-  const [isDragActive, setIsDragActive] = React15.useState(false);
-  const [selectedFiles, setSelectedFiles] = React15.useState([]);
+  const inputRef = React13.useRef(null);
+  const [isDragActive, setIsDragActive] = React13.useState(false);
+  const [selectedFiles, setSelectedFiles] = React13.useState([]);
   const resolvedMultiple = multiple ?? true;
   const prefersReducedMotion = useReducedMotion2();
-  React15.useImperativeHandle(ref, () => inputRef.current);
+  React13.useImperativeHandle(ref, () => inputRef.current);
   const resolvedAccept = accept ?? uploadAcceptByKind[uploadKind];
   const resolvedAriaLabel = ariaLabel ?? uploadAriaLabelByKind[uploadKind];
   const resolvedTitle = uploadTitle ?? "Arraste arquivos aqui ou clique para selecionar";
   const resolvedDescription = uploadDescription ?? uploadDescriptionByKind[uploadKind];
-  const syncSelectedFiles = React15.useCallback(
+  const syncSelectedFiles = React13.useCallback(
     (files) => {
       const normalizedFiles = resolvedMultiple ? files : files.slice(0, 1);
       setSelectedFiles(normalizedFiles);
@@ -2580,7 +2434,7 @@ var UploadInputControl = React15.forwardRef(function UploadInputControl2({
     },
     [onFilesChange, resolvedMultiple]
   );
-  const applyFilesToInput = React15.useCallback((files) => {
+  const applyFilesToInput = React13.useCallback((files) => {
     const inputElement = inputRef.current;
     if (!inputElement || typeof DataTransfer === "undefined") {
       return false;
@@ -2599,7 +2453,7 @@ var UploadInputControl = React15.forwardRef(function UploadInputControl2({
       return false;
     }
   }, []);
-  const handleInputChange = React15.useCallback(
+  const handleInputChange = React13.useCallback(
     (event) => {
       const nextFiles = mergeUploadFiles(
         selectedFiles,
@@ -2618,12 +2472,12 @@ var UploadInputControl = React15.forwardRef(function UploadInputControl2({
       syncSelectedFiles
     ]
   );
-  const openPicker = React15.useCallback(() => {
+  const openPicker = React13.useCallback(() => {
     if (!disabled) {
       inputRef.current?.click();
     }
   }, [disabled]);
-  const handleKeyDown = React15.useCallback(
+  const handleKeyDown = React13.useCallback(
     (event) => {
       if (disabled) {
         return;
@@ -2635,7 +2489,7 @@ var UploadInputControl = React15.forwardRef(function UploadInputControl2({
     },
     [disabled, openPicker]
   );
-  const handleDragEnter = React15.useCallback(
+  const handleDragEnter = React13.useCallback(
     (event) => {
       event.preventDefault();
       if (!disabled) {
@@ -2644,7 +2498,7 @@ var UploadInputControl = React15.forwardRef(function UploadInputControl2({
     },
     [disabled]
   );
-  const handleDragLeave = React15.useCallback(
+  const handleDragLeave = React13.useCallback(
     (event) => {
       if (disabled) {
         return;
@@ -2657,7 +2511,7 @@ var UploadInputControl = React15.forwardRef(function UploadInputControl2({
     },
     [disabled]
   );
-  const handleDragOver = React15.useCallback(
+  const handleDragOver = React13.useCallback(
     (event) => {
       event.preventDefault();
       if (disabled) {
@@ -2668,7 +2522,7 @@ var UploadInputControl = React15.forwardRef(function UploadInputControl2({
     },
     [disabled]
   );
-  const handleDrop = React15.useCallback(
+  const handleDrop = React13.useCallback(
     (event) => {
       event.preventDefault();
       if (disabled) {
@@ -2701,7 +2555,7 @@ var UploadInputControl = React15.forwardRef(function UploadInputControl2({
       syncSelectedFiles
     ]
   );
-  const handleRemoveFile = React15.useCallback(
+  const handleRemoveFile = React13.useCallback(
     (fileIndex) => {
       if (disabled) {
         return;
@@ -2712,8 +2566,8 @@ var UploadInputControl = React15.forwardRef(function UploadInputControl2({
     },
     [applyFilesToInput, disabled, selectedFiles, syncSelectedFiles]
   );
-  return /* @__PURE__ */ jsxs9("div", { className: "grid w-full gap-4", children: [
-    /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsxs7("div", { className: "grid w-full gap-4", children: [
+    /* @__PURE__ */ jsx14(
       "input",
       {
         ...uploadProps,
@@ -2728,7 +2582,7 @@ var UploadInputControl = React15.forwardRef(function UploadInputControl2({
         onChange: handleInputChange
       }
     ),
-    /* @__PURE__ */ jsxs9(
+    /* @__PURE__ */ jsxs7(
       "label",
       {
         "aria-disabled": disabled || void 0,
@@ -2748,16 +2602,16 @@ var UploadInputControl = React15.forwardRef(function UploadInputControl2({
         onDrop: handleDrop,
         onKeyDown: handleKeyDown,
         children: [
-          /* @__PURE__ */ jsx16("span", { className: "flex size-10 items-center justify-center rounded-[6px] p-2 text-[color:var(--sofya-text-default)]", children: /* @__PURE__ */ jsx16(UploadGlyph, { className: "size-[18px]" }) }),
-          /* @__PURE__ */ jsx16("span", { className: "text-[color:var(--sofya-text-default)]", children: renderTextContent(resolvedTitle, {
+          /* @__PURE__ */ jsx14("span", { className: "flex size-10 items-center justify-center rounded-[6px] p-2 text-[color:var(--sofya-text-default)]", children: /* @__PURE__ */ jsx14(UploadGlyph, { className: "size-[18px]" }) }),
+          /* @__PURE__ */ jsx14("span", { className: "text-[color:var(--sofya-text-default)]", children: renderTextContent(resolvedTitle, {
             as: "span",
             className: "block text-[color:var(--sofya-text-default)]",
-            size: "body",
+            size: "tiny",
             style: {
               fontWeight: 500
             }
           }) }),
-          resolvedDescription ? /* @__PURE__ */ jsx16("span", { className: "text-[color:var(--sofya-text-subtle)]", children: renderTextContent(resolvedDescription, {
+          resolvedDescription ? /* @__PURE__ */ jsx14("span", { className: "text-[color:var(--sofya-text-subtle)]", children: renderTextContent(resolvedDescription, {
             as: "span",
             className: "block text-[color:var(--sofya-text-subtle)]",
             size: "extra-tiny"
@@ -2765,9 +2619,9 @@ var UploadInputControl = React15.forwardRef(function UploadInputControl2({
         ]
       }
     ),
-    /* @__PURE__ */ jsx16("div", { role: "list", className: "grid gap-4 overflow-hidden", children: /* @__PURE__ */ jsx16(AnimatePresence, { initial: false, children: selectedFiles.map((file, index) => {
+    /* @__PURE__ */ jsx14("div", { role: "list", className: "grid gap-4 overflow-hidden", children: /* @__PURE__ */ jsx14(AnimatePresence, { initial: false, children: selectedFiles.map((file, index) => {
       const fileKey = resolveUploadFileSignature(file);
-      return /* @__PURE__ */ jsx16(
+      return /* @__PURE__ */ jsx14(
         motion2.div,
         {
           role: "listitem",
@@ -2776,24 +2630,24 @@ var UploadInputControl = React15.forwardRef(function UploadInputControl2({
           animate: prefersReducedMotion ? { opacity: 1 } : { opacity: 1, y: 0 },
           exit: prefersReducedMotion ? { opacity: 0 } : { opacity: 0, y: -6 },
           transition: uploadListItemTransition,
-          children: /* @__PURE__ */ jsxs9(Card, { variant: "card", className: "flex items-center gap-4 p-4", children: [
-            /* @__PURE__ */ jsx16("span", { className: "flex size-11 shrink-0 items-center justify-center rounded-full bg-[color:var(--sofya-surface-hover)] text-primary", children: /* @__PURE__ */ jsx16(
+          children: /* @__PURE__ */ jsxs7(Card, { variant: "card", className: "flex items-center gap-4 p-4", children: [
+            /* @__PURE__ */ jsx14("span", { className: "flex size-11 shrink-0 items-center justify-center rounded-full bg-[color:var(--sofya-surface-hover)] text-primary", children: /* @__PURE__ */ jsx14(
               UploadFileTypeGlyph,
               {
                 className: "size-[18px]",
                 kind: resolveUploadFileVisualKind(file, uploadKind)
               }
             ) }),
-            /* @__PURE__ */ jsxs9("div", { className: "min-w-0 flex-1", children: [
-              /* @__PURE__ */ jsx16("p", { className: "truncate text-[color:var(--sofya-text-default)]", children: renderTextContent(file.name, {
+            /* @__PURE__ */ jsxs7("div", { className: "min-w-0 flex-1", children: [
+              /* @__PURE__ */ jsx14("p", { className: "truncate text-[color:var(--sofya-text-default)]", children: renderTextContent(file.name, {
                 as: "span",
                 className: "block truncate text-[color:var(--sofya-text-default)]",
-                size: "body",
+                size: "tiny",
                 style: {
                   fontWeight: 500
                 }
               }) }),
-              /* @__PURE__ */ jsx16("p", { className: "mt-2 text-[color:var(--sofya-text-subtle)]", children: renderTextContent(
+              /* @__PURE__ */ jsx14("p", { className: "mt-2 text-[color:var(--sofya-text-subtle)]", children: renderTextContent(
                 `${resolveUploadFileBadge(
                   file
                 )} \xB7 ${formatUploadFileSize(file.size)}`,
@@ -2804,7 +2658,7 @@ var UploadInputControl = React15.forwardRef(function UploadInputControl2({
                 }
               ) })
             ] }),
-            /* @__PURE__ */ jsx16(
+            /* @__PURE__ */ jsx14(
               "button",
               {
                 "aria-label": `Remover ${file.name}`,
@@ -2816,7 +2670,7 @@ var UploadInputControl = React15.forwardRef(function UploadInputControl2({
                   event.stopPropagation();
                   handleRemoveFile(index);
                 },
-                children: /* @__PURE__ */ jsx16(
+                children: /* @__PURE__ */ jsx14(
                   Icon,
                   {
                     "aria-hidden": "true",
@@ -2837,15 +2691,15 @@ var UploadInputControl = React15.forwardRef(function UploadInputControl2({
 UploadInputControl.displayName = "UploadInputControl";
 
 // src/components/input-otp.tsx
-import * as React16 from "react";
+import * as React14 from "react";
 import {
   OTPInput,
   OTPInputContext,
   REGEXP_ONLY_DIGITS
 } from "input-otp";
-import { jsx as jsx17, jsxs as jsxs10 } from "react/jsx-runtime";
-var InputOTP = React16.forwardRef(({ className, containerClassName, ...props }, ref) => {
-  return /* @__PURE__ */ jsx17(
+import { jsx as jsx15, jsxs as jsxs8 } from "react/jsx-runtime";
+var InputOTP = React14.forwardRef(({ className, containerClassName, ...props }, ref) => {
+  return /* @__PURE__ */ jsx15(
     OTPInput,
     {
       ref,
@@ -2859,8 +2713,8 @@ var InputOTP = React16.forwardRef(({ className, containerClassName, ...props },
   );
 });
 InputOTP.displayName = "InputOTP";
-var InputOTPGroup = React16.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx17(
+var InputOTPGroup = React14.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx15(
     "div",
     {
       ref,
@@ -2873,12 +2727,12 @@ var InputOTPGroup = React16.forwardRef(({ className, ...props }, ref) => {
   );
 });
 InputOTPGroup.displayName = "InputOTPGroup";
-var InputOTPSlot = React16.forwardRef(
+var InputOTPSlot = React14.forwardRef(
   ({ className, index, ...props }, ref) => {
-    const otpContext = React16.useContext(OTPInputContext);
+    const otpContext = React14.useContext(OTPInputContext);
     const slot = otpContext.slots[index];
     if (!slot) {
-      return /* @__PURE__ */ jsx17(
+      return /* @__PURE__ */ jsx15(
         "div",
         {
           ref,
@@ -2890,7 +2744,7 @@ var InputOTPSlot = React16.forwardRef(
         }
       );
     }
-    return /* @__PURE__ */ jsxs10(
+    return /* @__PURE__ */ jsxs8(
       "div",
       {
         ref,
@@ -2902,15 +2756,15 @@ var InputOTPSlot = React16.forwardRef(
         ...props,
         children: [
           slot.char ?? null,
-          slot.hasFakeCaret ? /* @__PURE__ */ jsx17("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ jsx17("div", { className: "h-10 w-[2px] animate-pulse rounded-full bg-primary shadow-[var(--sofya-shadow-caret-glow)]" }) }) : null
+          slot.hasFakeCaret ? /* @__PURE__ */ jsx15("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ jsx15("div", { className: "h-10 w-[2px] animate-pulse rounded-full bg-primary shadow-[var(--sofya-shadow-caret-glow)]" }) }) : null
         ]
       }
     );
   }
 );
 InputOTPSlot.displayName = "InputOTPSlot";
-var InputOTPSeparator = React16.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx17(
+var InputOTPSeparator = React14.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx15(
     "div",
     {
       ref,
@@ -2920,22 +2774,22 @@ var InputOTPSeparator = React16.forwardRef(({ className, ...props }, ref) => {
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx17("span", { "aria-hidden": "true", children: "." })
+      children: /* @__PURE__ */ jsx15("span", { "aria-hidden": "true", children: "." })
     }
   );
 });
 InputOTPSeparator.displayName = "InputOTPSeparator";
 
 // src/components/input.tsx
-import { Fragment as Fragment3, jsx as jsx18, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
 var inputVariantOptions = [
   "default",
   "search",
   "otp",
   "upload"
 ];
-var Input = React17.forwardRef((props, ref) => {
-  const generatedId = React17.useId();
+var Input = React15.forwardRef((props, ref) => {
+  const generatedId = React15.useId();
   const resolvedId = props.id ?? generatedId;
   const variant = props.variant ?? "default";
   if (variant === "otp") {
@@ -2963,7 +2817,7 @@ var Input = React17.forwardRef((props, ref) => {
     );
     const hasTrailingGroup = resolvedSplitIndex < resolvedLength;
     const otpAriaLabel = otpProps["aria-label"] ?? "Verification code";
-    const otpControl = /* @__PURE__ */ jsxs11(
+    const otpControl = /* @__PURE__ */ jsxs9(
       InputOTP,
       {
         ref,
@@ -2976,7 +2830,7 @@ var Input = React17.forwardRef((props, ref) => {
         containerClassName: className2,
         ...otpProps,
         children: [
-          /* @__PURE__ */ jsx18(InputOTPGroup, { className: otpGroupClassName, children: Array.from({ length: resolvedSplitIndex }, (_, index) => /* @__PURE__ */ jsx18(
+          /* @__PURE__ */ jsx16(InputOTPGroup, { className: otpGroupClassName, children: Array.from({ length: resolvedSplitIndex }, (_, index) => /* @__PURE__ */ jsx16(
             InputOTPSlot,
             {
               className: otpSlotClassName,
@@ -2984,10 +2838,10 @@ var Input = React17.forwardRef((props, ref) => {
             },
             `otp-leading-${index}`
           )) }),
-          hasTrailingGroup ? otpSeparator ?? /* @__PURE__ */ jsx18(InputOTPSeparator, { className: otpSeparatorClassName }) : null,
-          hasTrailingGroup ? /* @__PURE__ */ jsx18(InputOTPGroup, { className: otpGroupClassName, children: Array.from(
+          hasTrailingGroup ? otpSeparator ?? /* @__PURE__ */ jsx16(InputOTPSeparator, { className: otpSeparatorClassName }) : null,
+          hasTrailingGroup ? /* @__PURE__ */ jsx16(InputOTPGroup, { className: otpGroupClassName, children: Array.from(
             { length: resolvedLength - resolvedSplitIndex },
-            (_, index) => /* @__PURE__ */ jsx18(
+            (_, index) => /* @__PURE__ */ jsx16(
               InputOTPSlot,
               {
                 className: otpSlotClassName,
@@ -2999,7 +2853,7 @@ var Input = React17.forwardRef((props, ref) => {
         ]
       }
     );
-    return /* @__PURE__ */ jsx18(
+    return /* @__PURE__ */ jsx16(
       FieldShell,
       {
         containerClassName: containerClassName2,
@@ -3018,7 +2872,7 @@ var Input = React17.forwardRef((props, ref) => {
       variant: _variant2,
       ...uploadProps
     } = props;
-    const uploadControl = /* @__PURE__ */ jsx18(
+    const uploadControl = /* @__PURE__ */ jsx16(
       UploadInputControl,
       {
         ...uploadProps,
@@ -3026,22 +2880,22 @@ var Input = React17.forwardRef((props, ref) => {
         resolvedId
       }
     );
-    const uploadLabel = label2 || uploadOptionalLabel ? /* @__PURE__ */ jsxs11(Fragment3, { children: [
+    const uploadLabel = label2 || uploadOptionalLabel ? /* @__PURE__ */ jsxs9(Fragment2, { children: [
       renderTextContent(label2, {
         as: "span",
         className: "text-[color:var(--sofya-text-default)]",
-        size: "body",
+        size: "tiny",
         style: {
           fontWeight: 700
         }
       }),
-      uploadOptionalLabel ? /* @__PURE__ */ jsx18("span", { className: "ml-2 text-[color:var(--sofya-text-subtle)]", children: renderTextContent(uploadOptionalLabel, {
+      uploadOptionalLabel ? /* @__PURE__ */ jsx16("span", { className: "ml-2 text-[color:var(--sofya-text-subtle)]", children: renderTextContent(uploadOptionalLabel, {
         as: "span",
         className: "text-[color:var(--sofya-text-subtle)]",
         size: "tiny"
       }) }) : null
     ] }) : void 0;
-    return /* @__PURE__ */ jsx18(
+    return /* @__PURE__ */ jsx16(
       FieldShell,
       {
         containerClassName: containerClassName2,
@@ -3064,8 +2918,8 @@ var Input = React17.forwardRef((props, ref) => {
   const isSearch = variant === "search";
   const resolvedType = type ?? (isSearch ? "search" : void 0);
   const ariaLabel = nativeProps["aria-label"] ?? (typeof label === "string" ? label : isSearch ? "Search" : void 0);
-  const nativeControl = isSearch ? /* @__PURE__ */ jsxs11("div", { className: "flex h-[88px] w-full items-center gap-6 rounded-full border border-[color:var(--sofya-border-strong)] bg-card px-8 shadow-none transition-[border-color,box-shadow,background-color] duration-sofya ease-sofya hover:border-[color:var(--sofya-border-hover)] hover:ring-2 hover:ring-[color:var(--sofya-focus-ring-soft)] focus-within:border-transparent focus-within:ring-2 focus-within:ring-[color:var(--sofya-focus-ring-soft)] has-[:active]:border-transparent has-[:active]:ring-2 has-[:active]:ring-[color:var(--sofya-focus-ring-soft)]", children: [
-    /* @__PURE__ */ jsx18(
+  const nativeControl = isSearch ? /* @__PURE__ */ jsxs9("div", { className: "flex h-[88px] w-full items-center gap-6 rounded-full border border-[color:var(--sofya-border-strong)] bg-card px-8 shadow-none transition-[border-color,box-shadow,background-color] duration-sofya ease-sofya hover:border-[color:var(--sofya-border-hover)] hover:ring-2 hover:ring-[color:var(--sofya-focus-ring-soft)] focus-within:border-transparent focus-within:ring-2 focus-within:ring-[color:var(--sofya-focus-ring-soft)] has-[:active]:border-transparent has-[:active]:ring-2 has-[:active]:ring-[color:var(--sofya-focus-ring-soft)]", children: [
+    /* @__PURE__ */ jsx16(
       Icon,
       {
         "aria-hidden": "true",
@@ -3074,7 +2928,7 @@ var Input = React17.forwardRef((props, ref) => {
         size: 32
       }
     ),
-    /* @__PURE__ */ jsx18(
+    /* @__PURE__ */ jsx16(
       "input",
       {
         id: resolvedId,
@@ -3090,39 +2944,587 @@ var Input = React17.forwardRef((props, ref) => {
         placeholder: nativeProps.placeholder ?? "Search"
       }
     )
-  ] }) : /* @__PURE__ */ jsx18(
+  ] }) : /* @__PURE__ */ jsx16(
     "input",
     {
-      id: resolvedId,
+      id: resolvedId,
+      ref,
+      type: resolvedType,
+      className: cn(
+        "flex h-10 w-full rounded-[10px] border border-[color:var(--sofya-border-strong)] bg-card px-4 py-2 [font-family:var(--sofya-text-tiny-font-family)] text-[length:var(--sofya-text-tiny-font-size)] [font-weight:var(--sofya-text-tiny-font-weight)] leading-[var(--sofya-text-tiny-line-height)] tracking-[var(--sofya-text-tiny-letter-spacing)] text-[color:var(--sofya-text-default)] shadow-none transition-[border-color,box-shadow,background-color,color] duration-sofya ease-sofya placeholder:text-[color:var(--sofya-text-placeholder)] hover:border-[color:var(--sofya-border-hover)] focus:border-transparent 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",
+        className
+      ),
+      ...nativeProps,
+      "aria-label": ariaLabel
+    }
+  );
+  return /* @__PURE__ */ jsx16(
+    FieldShell,
+    {
+      containerClassName,
+      control: nativeControl,
+      label: isSearch ? void 0 : label,
+      labelClassName: isSearch ? void 0 : labelClassName,
+      labelHtmlFor: isSearch ? void 0 : resolvedId
+    }
+  );
+});
+Input.displayName = "Input";
+
+// src/components/popover.tsx
+import * as React16 from "react";
+import * as PopoverPrimitive from "@radix-ui/react-popover";
+import { jsx as jsx17 } from "react/jsx-runtime";
+var Popover = PopoverPrimitive.Root;
+var PopoverTrigger = PopoverPrimitive.Trigger;
+var PopoverAnchor = PopoverPrimitive.Anchor;
+var PopoverPortal = PopoverPrimitive.Portal;
+var PopoverClose = PopoverPrimitive.Close;
+var PopoverContent = React16.forwardRef(function PopoverContent2({
+  align = "center",
+  className,
+  collisionPadding = 8,
+  sideOffset = 8,
+  ...props
+}, ref) {
+  return /* @__PURE__ */ jsx17(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx17(
+    PopoverPrimitive.Content,
+    {
+      ref,
+      align,
+      collisionPadding,
+      sideOffset,
+      "data-slot": "popover-content",
+      className: cn(
+        "sofya-dropdown-content z-50 w-72 max-w-[min(24rem,calc(100vw-1rem))] rounded-[14px] border border-[color:var(--sofya-border-strong)] bg-[hsl(var(--sofya-popover))] p-4 text-[hsl(var(--sofya-popover-foreground))] shadow-[var(--sofya-shadow-soft)] outline-none",
+        className
+      ),
+      ...props
+    }
+  ) });
+});
+PopoverContent.displayName = PopoverPrimitive.Content.displayName;
+var PopoverTitle = React16.forwardRef(function PopoverTitle2({ children, className, ...props }, ref) {
+  return /* @__PURE__ */ jsx17(
+    "h4",
+    {
+      ref,
+      "data-slot": "popover-title",
+      className: cn("text-[hsl(var(--sofya-popover-foreground))]", className),
+      ...props,
+      children: renderTextContent(children, {
+        as: "span",
+        className: "block text-[hsl(var(--sofya-popover-foreground))]",
+        size: "h4"
+      })
+    }
+  );
+});
+PopoverTitle.displayName = "PopoverTitle";
+var PopoverDescription = React16.forwardRef(function PopoverDescription2({ children, className, ...props }, ref) {
+  return /* @__PURE__ */ jsx17(
+    "p",
+    {
+      ref,
+      "data-slot": "popover-description",
+      className: cn("text-muted-foreground", className),
+      ...props,
+      children: renderTextContent(children, {
+        as: "span",
+        className: "block text-muted-foreground",
+        size: "body"
+      })
+    }
+  );
+});
+PopoverDescription.displayName = "PopoverDescription";
+
+// src/components/spinner.tsx
+import * as React17 from "react";
+import { IconLoader2 as IconLoader22 } from "@tabler/icons-react";
+import { jsx as jsx18 } from "react/jsx-runtime";
+var spinnerSizeOptions = ["sm", "default", "lg"];
+var Spinner = React17.forwardRef(function Spinner2({
+  "aria-label": ariaLabelProp,
+  "aria-labelledby": ariaLabelledby,
+  className,
+  role = "status",
+  size = "default",
+  ...props
+}, ref) {
+  const ariaLabel = ariaLabelProp ?? (ariaLabelledby ? void 0 : "Loading");
+  return /* @__PURE__ */ jsx18(
+    IconLoader22,
+    {
+      ref,
+      "data-size": size,
+      "data-slot": "spinner",
+      role,
+      "aria-label": ariaLabel,
+      "aria-labelledby": ariaLabelledby,
+      className: cn(
+        "shrink-0 animate-spin text-primary data-[size=sm]:h-3.5 data-[size=sm]:w-3.5 data-[size=default]:h-4 data-[size=default]:w-4 data-[size=lg]:h-6 data-[size=lg]:w-6",
+        className
+      ),
+      ...props
+    }
+  );
+});
+Spinner.displayName = "Spinner";
+
+// src/components/dropdown-search.tsx
+import { jsx as jsx19, jsxs as jsxs10 } from "react/jsx-runtime";
+var DropdownSearch = React18.forwardRef(
+  function DropdownSearch2({
+    className,
+    containerClassName,
+    defaultQuery = "",
+    defaultValue,
+    disabled,
+    emptyMessage = "No results found",
+    label,
+    labelClassName,
+    loading,
+    onChange,
+    onQueryChange,
+    options = [],
+    placeholder = "Search...",
+    query: queryProp,
+    value: valueProp
+  }, ref) {
+    const listboxId = React18.useId();
+    const [open, setOpen] = React18.useState(false);
+    const [query, setQuery] = useControllableState({
+      defaultValue: defaultQuery,
+      onChange: onQueryChange,
+      value: queryProp
+    });
+    const [value, setValue] = useControllableState({
+      defaultValue,
+      onChange,
+      value: valueProp
+    });
+    const inputRef = React18.useRef(null);
+    const listRef = React18.useRef(null);
+    const setInputRef = React18.useCallback(
+      (node) => {
+        inputRef.current = node;
+        if (typeof ref === "function") {
+          ref(node);
+        } else if (ref) {
+          ref.current = node;
+        }
+      },
+      [ref]
+    );
+    function handleInputChange(e) {
+      setQuery(e.target.value);
+      setOpen(true);
+    }
+    function handleInputFocus() {
+      setOpen(true);
+    }
+    function handleInputKeyDown(e) {
+      if (e.key === "ArrowDown") {
+        e.preventDefault();
+        listRef.current?.querySelector(
+          "[data-dropdown-search-item]:not([disabled])"
+        )?.focus();
+      }
+      if (e.key === "Escape") {
+        setOpen(false);
+      }
+    }
+    function handleItemKeyDown(e, option) {
+      if (e.key === "Enter" || e.key === " ") {
+        e.preventDefault();
+        handleSelect(option);
+        return;
+      }
+      if (e.key === "ArrowDown") {
+        e.preventDefault();
+        e.currentTarget.closest("li")?.nextElementSibling?.querySelector("[data-dropdown-search-item]")?.focus();
+        return;
+      }
+      if (e.key === "ArrowUp") {
+        e.preventDefault();
+        const prevLi = e.currentTarget.closest("li")?.previousElementSibling;
+        if (prevLi) {
+          prevLi.querySelector("[data-dropdown-search-item]")?.focus();
+        } else {
+          inputRef.current?.focus();
+        }
+        return;
+      }
+      if (e.key === "Escape") {
+        setOpen(false);
+        inputRef.current?.focus();
+      }
+    }
+    function handleSelect(option) {
+      if (option.disabled) return;
+      setValue(option.value);
+      setQuery(option.label);
+      setOpen(false);
+    }
+    return /* @__PURE__ */ jsxs10(Popover, { open, onOpenChange: setOpen, children: [
+      /* @__PURE__ */ jsx19(PopoverAnchor, { asChild: true, children: /* @__PURE__ */ jsx19("div", { className: cn("w-full", containerClassName), children: /* @__PURE__ */ jsx19(
+        Input,
+        {
+          ref: setInputRef,
+          "aria-autocomplete": "list",
+          "aria-controls": open ? listboxId : void 0,
+          "aria-expanded": open,
+          "aria-haspopup": "listbox",
+          autoComplete: "off",
+          className,
+          disabled,
+          label,
+          labelClassName,
+          placeholder,
+          role: "combobox",
+          value: query ?? "",
+          onChange: handleInputChange,
+          onFocus: handleInputFocus,
+          onKeyDown: handleInputKeyDown
+        }
+      ) }) }),
+      /* @__PURE__ */ jsx19(
+        PopoverContent,
+        {
+          align: "start",
+          className: "w-[var(--radix-popover-trigger-width)] p-1",
+          onOpenAutoFocus: (e) => e.preventDefault(),
+          onInteractOutside: (e) => {
+            if (inputRef.current?.closest("div")?.contains(e.target)) {
+              e.preventDefault();
+            }
+          },
+          children: loading ? /* @__PURE__ */ jsx19("div", { className: "flex items-center justify-center py-4", children: /* @__PURE__ */ jsx19(Spinner, { size: "sm" }) }) : options.length === 0 ? /* @__PURE__ */ jsx19("div", { className: "px-3 py-4 text-center", children: /* @__PURE__ */ jsx19(
+            Text,
+            {
+              as: "span",
+              size: "tiny",
+              className: "text-[color:var(--sofya-text-subtle)]",
+              children: emptyMessage
+            }
+          ) }) : /* @__PURE__ */ jsx19(
+            "ul",
+            {
+              ref: listRef,
+              id: listboxId,
+              role: "listbox",
+              "aria-label": typeof label === "string" ? label : "Options",
+              className: "flex flex-col gap-0.5",
+              children: options.map((option) => /* @__PURE__ */ jsx19(
+                "li",
+                {
+                  role: "option",
+                  "aria-selected": value === option.value,
+                  "aria-disabled": option.disabled,
+                  children: /* @__PURE__ */ jsxs10(
+                    "button",
+                    {
+                      "data-dropdown-search-item": true,
+                      type: "button",
+                      disabled: option.disabled,
+                      className: cn(
+                        "flex w-full items-center gap-3 rounded-[8px] px-3 py-2 text-left",
+                        "[font-family:var(--sofya-text-tiny-font-family)] text-[length:var(--sofya-text-tiny-font-size)] [font-weight:var(--sofya-text-tiny-font-weight)] leading-[var(--sofya-text-tiny-line-height)]",
+                        "transition-colors duration-sofya ease-sofya",
+                        "text-[color:var(--sofya-text-default)] hover:bg-muted focus-visible:bg-muted focus-visible:outline-none",
+                        "disabled:cursor-not-allowed disabled:opacity-40",
+                        value === option.value && "bg-muted"
+                      ),
+                      onClick: () => handleSelect(option),
+                      onKeyDown: (e) => handleItemKeyDown(e, option),
+                      children: [
+                        /* @__PURE__ */ jsxs10("div", { className: "flex min-w-0 flex-1 flex-col gap-0.5", children: [
+                          /* @__PURE__ */ jsx19(Text, { as: "span", size: "tiny", className: "truncate", children: option.label }),
+                          option.description ? /* @__PURE__ */ jsx19(
+                            Text,
+                            {
+                              as: "span",
+                              size: "tiny",
+                              className: "truncate text-[color:var(--sofya-text-subtle)]",
+                              children: option.description
+                            }
+                          ) : null
+                        ] }),
+                        value === option.value ? /* @__PURE__ */ jsx19(
+                          Icon,
+                          {
+                            "aria-hidden": "true",
+                            className: "shrink-0 text-primary",
+                            name: "check",
+                            size: 16
+                          }
+                        ) : null
+                      ]
+                    }
+                  )
+                },
+                option.value
+              ))
+            }
+          )
+        }
+      )
+    ] });
+  }
+);
+DropdownSearch.displayName = "DropdownSearch";
+
+// src/components/dialog.tsx
+import * as React19 from "react";
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+import { jsx as jsx20, jsxs as jsxs11 } from "react/jsx-runtime";
+var Dialog = DialogPrimitive.Root;
+var DialogTrigger = DialogPrimitive.Trigger;
+var DialogPortal = DialogPrimitive.Portal;
+var DialogClose = DialogPrimitive.Close;
+var DialogInternalContext = React19.createContext({
+  showCloseButton: true
+});
+var DialogOverlay = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx20(
+  DialogPrimitive.Overlay,
+  {
+    ref,
+    className: cn(
+      "sofya-dialog-overlay fixed inset-0 z-50 bg-foreground/24 backdrop-blur-[6px]",
+      className
+    ),
+    ...props
+  }
+));
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+var DialogContent = React19.forwardRef(
+  ({
+    className,
+    children,
+    cardClassName,
+    overlayClassName,
+    showCloseButton = true,
+    variant = "card",
+    ...props
+  }, ref) => {
+    const dialogCardStyle = {
+      "--sofya-surface-shadow-override": "var(--sofya-shadow-lg)"
+    };
+    return /* @__PURE__ */ jsx20(DialogInternalContext.Provider, { value: { showCloseButton }, children: /* @__PURE__ */ jsxs11(DialogPortal, { children: [
+      /* @__PURE__ */ jsx20(DialogOverlay, { className: overlayClassName }),
+      /* @__PURE__ */ jsx20("div", { className: "sofya-dialog-positioner fixed inset-0 z-50 flex items-center justify-center p-4", children: /* @__PURE__ */ jsx20(
+        DialogPrimitive.Content,
+        {
+          ref,
+          className: cn(
+            "sofya-dialog-content relative flex w-full max-w-[680px] max-h-[calc(100vh-2rem)] outline-none",
+            className
+          ),
+          ...props,
+          children: /* @__PURE__ */ jsx20(
+            Card,
+            {
+              variant,
+              className: cn(
+                "flex max-h-[inherit] min-h-0 w-full flex-col gap-6 overflow-y-auto overflow-x-hidden p-6",
+                cardClassName
+              ),
+              style: dialogCardStyle,
+              children
+            }
+          )
+        }
+      ) })
+    ] }) });
+  }
+);
+DialogContent.displayName = DialogPrimitive.Content.displayName;
+function DialogHeader({ className, children, ...props }) {
+  const { showCloseButton } = React19.useContext(DialogInternalContext);
+  return /* @__PURE__ */ jsxs11(
+    "div",
+    {
+      className: cn("flex w-full items-start justify-between gap-4", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx20("div", { className: "flex min-w-0 flex-1 flex-col gap-2 text-left", children }),
+        showCloseButton ? /* @__PURE__ */ jsx20(DialogPrimitive.Close, { asChild: true, children: /* @__PURE__ */ jsx20(
+          Button,
+          {
+            type: "button",
+            variant: "ghost",
+            size: "icon",
+            "aria-label": "Close",
+            leftIcon: /* @__PURE__ */ jsx20(Icon, { name: "x", size: 18 }),
+            className: "shrink-0 text-muted-foreground hover:text-foreground"
+          }
+        ) }) : null
+      ]
+    }
+  );
+}
+function DialogBody({ className, ...props }) {
+  return /* @__PURE__ */ jsx20(
+    "div",
+    {
+      className: cn("flex flex-col gap-4", className),
+      ...props
+    }
+  );
+}
+function DialogFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsx20(
+    "div",
+    {
+      className: cn("flex items-center justify-end gap-2", className),
+      ...props
+    }
+  );
+}
+var DialogCancel = React19.forwardRef(
+  ({ type = "button", variant = "ghost", ...props }, ref) => /* @__PURE__ */ jsx20(DialogPrimitive.Close, { asChild: true, children: /* @__PURE__ */ jsx20(Button, { ref, type, variant, ...props }) })
+);
+DialogCancel.displayName = "DialogCancel";
+var DialogTitle = React19.forwardRef(({ children, className, ...props }, ref) => /* @__PURE__ */ jsx20(
+  DialogPrimitive.Title,
+  {
+    ref,
+    className: cn("text-card-foreground", className),
+    ...props,
+    children: renderTextContent(children, {
+      as: "span",
+      className: "block text-card-foreground",
+      size: "h3"
+    })
+  }
+));
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
+var DialogDescription = React19.forwardRef(({ children, className, ...props }, ref) => /* @__PURE__ */ jsx20(
+  DialogPrimitive.Description,
+  {
+    ref,
+    className: cn("text-muted-foreground", className),
+    ...props,
+    children: renderTextContent(children, {
+      as: "span",
+      className: "block text-muted-foreground",
+      size: "body"
+    })
+  }
+));
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
+
+// src/components/empty.tsx
+import * as React20 from "react";
+import { cva as cva5 } from "class-variance-authority";
+import { Fragment as Fragment3, jsx as jsx21, jsxs as jsxs12 } from "react/jsx-runtime";
+var emptyMediaVariantOptions = ["default", "icon"];
+var emptyMediaVariants = cva5(
+  "inline-flex shrink-0 items-center justify-center transition-[background-color,border-color,color,box-shadow] duration-sofya ease-sofya",
+  {
+    variants: {
+      variant: {
+        default: "[&_img]:max-w-full [&_svg]:shrink-0 [&_svg]:text-primary",
+        icon: "h-16 w-16 rounded-full border border-primary/10 bg-primary/10 text-primary [&_svg]:h-7 [&_svg]:w-7 [&_svg]:shrink-0"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+var EmptyMedia = React20.forwardRef(function EmptyMedia2({ className, variant, ...props }, ref) {
+  return /* @__PURE__ */ jsx21("div", { ref, className: cn(emptyMediaVariants({ variant }), className), ...props });
+});
+function EmptyHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsx21(
+    "div",
+    {
+      className: cn("flex max-w-[34rem] flex-col items-center gap-4 text-center", className),
+      ...props
+    }
+  );
+}
+function EmptyTitle({ children, className, ...props }) {
+  return /* @__PURE__ */ jsx21(
+    "h2",
+    {
+      className: cn("text-foreground", className),
+      ...props,
+      children: renderTextContent(children, {
+        as: "span",
+        className: "block text-foreground",
+        size: "h4"
+      })
+    }
+  );
+}
+function EmptyDescription({
+  children,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx21(
+    "p",
+    {
+      className: cn("max-w-full text-muted-foreground whitespace-nowrap", className),
+      ...props,
+      children: renderTextContent(children, {
+        as: "span",
+        className: "inline-block whitespace-nowrap text-muted-foreground",
+        size: "body"
+      })
+    }
+  );
+}
+function EmptyContent({ children, className, ...props }) {
+  return /* @__PURE__ */ jsx21(
+    "div",
+    {
+      className: cn("flex flex-wrap items-center justify-center gap-4 text-center", className),
+      ...props,
+      children: renderTextContent(children, {
+        as: "span"
+      })
+    }
+  );
+}
+var Empty = React20.forwardRef(function Empty2({ children, className, content, description, media, title, ...props }, ref) {
+  const hasCustomChildren = React20.Children.count(children) > 0;
+  return /* @__PURE__ */ jsx21(
+    "div",
+    {
       ref,
-      type: resolvedType,
       className: cn(
-        "flex h-10 w-full rounded-[10px] border border-[color:var(--sofya-border-strong)] bg-card px-4 py-2 [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 placeholder:text-[color:var(--sofya-text-placeholder)] hover:border-[color:var(--sofya-border-hover)] focus:border-transparent 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",
+        "flex min-h-[280px] w-full flex-col items-center justify-center gap-6 rounded-[28px] bg-gradient-to-b from-card via-card to-muted/45 px-6 py-10 text-center",
         className
       ),
-      ...nativeProps,
-      "aria-label": ariaLabel
-    }
-  );
-  return /* @__PURE__ */ jsx18(
-    FieldShell,
-    {
-      containerClassName,
-      control: nativeControl,
-      label: isSearch ? void 0 : label,
-      labelClassName: isSearch ? void 0 : labelClassName,
-      labelHtmlFor: isSearch ? void 0 : resolvedId
+      ...props,
+      children: hasCustomChildren ? children : /* @__PURE__ */ jsxs12(Fragment3, { children: [
+        /* @__PURE__ */ jsxs12(EmptyHeader, { children: [
+          media ?? /* @__PURE__ */ jsx21(EmptyMedia, { variant: "icon", "aria-hidden": "true", children: /* @__PURE__ */ jsx21(Icon, { name: "folders", size: 28 }) }),
+          /* @__PURE__ */ jsx21(EmptyTitle, { children: title ?? "Nada por aqui" }),
+          /* @__PURE__ */ jsx21(EmptyDescription, { children: description ?? "Quando houver conte\xFAdo dispon\xEDvel, ele aparecer\xE1 aqui." })
+        ] }),
+        content !== void 0 && content !== null ? /* @__PURE__ */ jsx21(EmptyContent, { children: content }) : null
+      ] })
     }
   );
 });
-Input.displayName = "Input";
+Empty.displayName = "Empty";
+EmptyMedia.displayName = "EmptyMedia";
+EmptyHeader.displayName = "EmptyHeader";
+EmptyTitle.displayName = "EmptyTitle";
+EmptyDescription.displayName = "EmptyDescription";
+EmptyContent.displayName = "EmptyContent";
 
 // src/components/label.tsx
-import * as React18 from "react";
-import { jsx as jsx19 } from "react/jsx-runtime";
-var Label = React18.forwardRef(
+import * as React21 from "react";
+import { jsx as jsx22 } from "react/jsx-runtime";
+var Label = React21.forwardRef(
   ({ children, className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx19(
+    return /* @__PURE__ */ jsx22(
       "label",
       {
         ref,
@@ -3134,7 +3536,7 @@ var Label = React18.forwardRef(
         children: renderTextContent(children, {
           as: "span",
           className: "block text-foreground",
-          size: "body",
+          size: "tiny",
           style: {
             fontWeight: 500
           }
@@ -3146,10 +3548,10 @@ var Label = React18.forwardRef(
 Label.displayName = "Label";
 
 // src/components/link.tsx
-import * as React19 from "react";
+import * as React22 from "react";
 import { Slot as Slot3 } from "@radix-ui/react-slot";
 import { cva as cva6 } from "class-variance-authority";
-import { jsx as jsx20 } from "react/jsx-runtime";
+import { jsx as jsx23 } from "react/jsx-runtime";
 var linkVariants = cva6(
   "inline bg-[linear-gradient(currentColor,currentColor)] bg-[position:0_100%] bg-no-repeat pb-0 text-primary no-underline transition-[color,background-size,box-shadow] duration-sofya ease-sofya hover:text-[color:var(--sofya-link-hover)] focus-visible:rounded-[4px] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[color:var(--sofya-focus-ring-soft)] focus-visible:ring-offset-0",
   {
@@ -3164,9 +3566,9 @@ var linkVariants = cva6(
     }
   }
 );
-var Link = React19.forwardRef(function Link2({ asChild = false, children, className, variant = "default", ...props }, ref) {
+var Link = React22.forwardRef(function Link2({ asChild = false, children, className, variant = "default", ...props }, ref) {
   const Component = asChild ? Slot3 : "a";
-  return /* @__PURE__ */ jsx20(
+  return /* @__PURE__ */ jsx23(
     Component,
     {
       ref,
@@ -3176,7 +3578,7 @@ var Link = React19.forwardRef(function Link2({ asChild = false, children, classN
       children: renderTextContent(children, {
         as: "span",
         className: "text-current",
-        size: "body"
+        size: "tiny"
       })
     }
   );
@@ -3184,7 +3586,7 @@ var Link = React19.forwardRef(function Link2({ asChild = false, children, classN
 Link.displayName = "Link";
 
 // src/components/logo.tsx
-import * as React20 from "react";
+import * as React23 from "react";
 
 // src/components/logo-data.ts
 var logoAssets = {
@@ -3281,7 +3683,7 @@ var logoAssets = {
 };
 
 // src/components/logo.tsx
-import { jsx as jsx21, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx24, jsxs as jsxs13 } from "react/jsx-runtime";
 var logoVariants = ["mono", "default", "text", "full"];
 var logoSizeOptions = ["sm", "md", "lg", "xl", "2xl"];
 var logoSizeScale = {
@@ -3317,7 +3719,7 @@ function resolveLogoDimensions(variant, size, width, height) {
     height: resolvedHeight
   };
 }
-var Logo = React20.forwardRef(function Logo2({
+var Logo = React23.forwardRef(function Logo2({
   variant = "full",
   size = "lg",
   width,
@@ -3328,10 +3730,10 @@ var Logo = React20.forwardRef(function Logo2({
   ...props
 }, ref) {
   const asset = logoAssets[variant];
-  const titleId = React20.useId();
+  const titleId = React23.useId();
   const dimensions = resolveLogoDimensions(variant, size, width, height);
   const monoFill = variant === "mono" ? monoColor ?? "currentColor" : void 0;
-  return /* @__PURE__ */ jsxs12(
+  return /* @__PURE__ */ jsxs13(
     "svg",
     {
       ref,
@@ -3346,8 +3748,8 @@ var Logo = React20.forwardRef(function Logo2({
       focusable: "false",
       ...props,
       children: [
-        title ? /* @__PURE__ */ jsx21("title", { id: titleId, children: title }) : null,
-        asset.paths.map((path, index) => /* @__PURE__ */ jsx21(
+        title ? /* @__PURE__ */ jsx24("title", { id: titleId, children: title }) : null,
+        asset.paths.map((path, index) => /* @__PURE__ */ jsx24(
           "path",
           {
             d: path.d,
@@ -3379,7 +3781,7 @@ var inheritedTypographyStyle = {
 };
 
 // src/components/pagination.tsx
-import { jsx as jsx22, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs14 } from "react/jsx-runtime";
 var paginationLinkVariants = cva7(
   "inline-flex h-10 min-w-10 items-center justify-center rounded-full border border-transparent px-4 [font-family:var(--sofya-text-body-font-family)] text-[length:var(--sofya-text-body-font-size)] font-medium leading-[var(--sofya-text-body-line-height)] tracking-[var(--sofya-text-body-letter-spacing)] text-[color:var(--sofya-text-soft)] no-underline transition-[transform,background-color,border-color,color,box-shadow] duration-sofya ease-sofya motion-safe:active:scale-[0.985] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[color:var(--sofya-focus-ring-soft)] focus-visible:ring-offset-0",
   {
@@ -3400,7 +3802,7 @@ var paginationLinkVariants = cva7(
   }
 );
 function Pagination({ className, ...props }) {
-  return /* @__PURE__ */ jsx22(
+  return /* @__PURE__ */ jsx25(
     "nav",
     {
       "aria-label": "Pagination",
@@ -3413,7 +3815,7 @@ function PaginationContent({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx22(
+  return /* @__PURE__ */ jsx25(
     "ul",
     {
       className: cn(
@@ -3425,7 +3827,7 @@ function PaginationContent({
   );
 }
 function PaginationItem({ className, ...props }) {
-  return /* @__PURE__ */ jsx22("li", { className: cn("list-none", className), ...props });
+  return /* @__PURE__ */ jsx25("li", { className: cn("list-none", className), ...props });
 }
 function PaginationLink({
   asChild = false,
@@ -3435,7 +3837,7 @@ function PaginationLink({
   ...props
 }) {
   const Component = asChild ? Slot4 : "a";
-  return /* @__PURE__ */ jsx22(
+  return /* @__PURE__ */ jsx25(
     Component,
     {
       "aria-current": isActive ? "page" : void 0,
@@ -3445,25 +3847,25 @@ function PaginationLink({
   );
 }
 function PaginationChevronLeft() {
-  return /* @__PURE__ */ jsx22(IconChevronLeft2, { "aria-hidden": "true", className: "h-4 w-4", stroke: 1.75 });
+  return /* @__PURE__ */ jsx25(IconChevronLeft2, { "aria-hidden": "true", className: "h-4 w-4", stroke: 1.75 });
 }
 function PaginationChevronRight() {
-  return /* @__PURE__ */ jsx22(IconChevronRight2, { "aria-hidden": "true", className: "h-4 w-4", stroke: 1.75 });
+  return /* @__PURE__ */ jsx25(IconChevronRight2, { "aria-hidden": "true", className: "h-4 w-4", stroke: 1.75 });
 }
 function PaginationPrevious({
   className,
   text = "Previous",
   ...props
 }) {
-  return /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs14(
     PaginationLink,
     {
       "aria-label": "Go to previous page",
       className: cn("gap-2 px-4", className),
       ...props,
       children: [
-        /* @__PURE__ */ jsx22(PaginationChevronLeft, {}),
-        /* @__PURE__ */ jsx22("span", { className: "hidden sm:block", children: renderTextContent(text, {
+        /* @__PURE__ */ jsx25(PaginationChevronLeft, {}),
+        /* @__PURE__ */ jsx25("span", { className: "hidden sm:block", children: renderTextContent(text, {
           as: "span",
           className: "block text-inherit",
           size: "body",
@@ -3478,20 +3880,20 @@ function PaginationNext({
   text = "Next",
   ...props
 }) {
-  return /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs14(
     PaginationLink,
     {
       "aria-label": "Go to next page",
       className: cn("gap-2 px-4", className),
       ...props,
       children: [
-        /* @__PURE__ */ jsx22("span", { className: "hidden sm:block", children: renderTextContent(text, {
+        /* @__PURE__ */ jsx25("span", { className: "hidden sm:block", children: renderTextContent(text, {
           as: "span",
           className: "block text-inherit",
           size: "body",
           style: inheritedTypographyStyle
         }) }),
-        /* @__PURE__ */ jsx22(PaginationChevronRight, {})
+        /* @__PURE__ */ jsx25(PaginationChevronRight, {})
       ]
     }
   );
@@ -3500,7 +3902,7 @@ function PaginationEllipsis({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs14(
     "span",
     {
       "aria-hidden": "true",
@@ -3510,90 +3912,22 @@ function PaginationEllipsis({
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx22("span", { children: renderTextContent("...", {
+        /* @__PURE__ */ jsx25("span", { children: renderTextContent("...", {
           as: "span",
           className: "block text-inherit",
           size: "h5",
           style: inheritedTypographyStyle
         }) }),
-        /* @__PURE__ */ jsx22("span", { className: "sr-only", children: "More pages" })
+        /* @__PURE__ */ jsx25("span", { className: "sr-only", children: "More pages" })
       ]
     }
   );
 }
 
-// src/components/popover.tsx
-import * as React21 from "react";
-import * as PopoverPrimitive from "@radix-ui/react-popover";
-import { jsx as jsx23 } from "react/jsx-runtime";
-var Popover = PopoverPrimitive.Root;
-var PopoverTrigger = PopoverPrimitive.Trigger;
-var PopoverAnchor = PopoverPrimitive.Anchor;
-var PopoverPortal = PopoverPrimitive.Portal;
-var PopoverClose = PopoverPrimitive.Close;
-var PopoverContent = React21.forwardRef(function PopoverContent2({
-  align = "center",
-  className,
-  collisionPadding = 8,
-  sideOffset = 8,
-  ...props
-}, ref) {
-  return /* @__PURE__ */ jsx23(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx23(
-    PopoverPrimitive.Content,
-    {
-      ref,
-      align,
-      collisionPadding,
-      sideOffset,
-      "data-slot": "popover-content",
-      className: cn(
-        "sofya-dropdown-content z-50 w-72 max-w-[min(24rem,calc(100vw-1rem))] rounded-[14px] border border-[color:var(--sofya-border-strong)] bg-[hsl(var(--sofya-popover))] p-4 text-[hsl(var(--sofya-popover-foreground))] shadow-[var(--sofya-shadow-soft)] outline-none",
-        className
-      ),
-      ...props
-    }
-  ) });
-});
-PopoverContent.displayName = PopoverPrimitive.Content.displayName;
-var PopoverTitle = React21.forwardRef(function PopoverTitle2({ children, className, ...props }, ref) {
-  return /* @__PURE__ */ jsx23(
-    "h4",
-    {
-      ref,
-      "data-slot": "popover-title",
-      className: cn("text-[hsl(var(--sofya-popover-foreground))]", className),
-      ...props,
-      children: renderTextContent(children, {
-        as: "span",
-        className: "block text-[hsl(var(--sofya-popover-foreground))]",
-        size: "h4"
-      })
-    }
-  );
-});
-PopoverTitle.displayName = "PopoverTitle";
-var PopoverDescription = React21.forwardRef(function PopoverDescription2({ children, className, ...props }, ref) {
-  return /* @__PURE__ */ jsx23(
-    "p",
-    {
-      ref,
-      "data-slot": "popover-description",
-      className: cn("text-muted-foreground", className),
-      ...props,
-      children: renderTextContent(children, {
-        as: "span",
-        className: "block text-muted-foreground",
-        size: "body"
-      })
-    }
-  );
-});
-PopoverDescription.displayName = "PopoverDescription";
-
 // src/components/progress.tsx
-import * as React22 from "react";
+import * as React24 from "react";
 import * as ProgressPrimitive from "@radix-ui/react-progress";
-import { jsx as jsx24 } from "react/jsx-runtime";
+import { jsx as jsx26 } from "react/jsx-runtime";
 var progressSizeOptions = ["sm", "default", "lg"];
 function clampProgressValue(value, max) {
   if (Number.isNaN(value)) {
@@ -3601,7 +3935,7 @@ function clampProgressValue(value, max) {
   }
   return Math.min(Math.max(value, 0), max);
 }
-var Progress = React22.forwardRef(function Progress2({
+var Progress = React24.forwardRef(function Progress2({
   className,
   indicatorClassName,
   max = 100,
@@ -3612,7 +3946,7 @@ var Progress = React22.forwardRef(function Progress2({
   const safeMax = max > 0 ? max : 100;
   const resolvedValue = typeof value === "number" ? clampProgressValue(value, safeMax) : null;
   const progressScale = resolvedValue === null ? void 0 : Number((resolvedValue / safeMax).toFixed(4));
-  return /* @__PURE__ */ jsx24(
+  return /* @__PURE__ */ jsx26(
     ProgressPrimitive.Root,
     {
       ref,
@@ -3625,7 +3959,7 @@ var Progress = React22.forwardRef(function Progress2({
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx24(
+      children: /* @__PURE__ */ jsx26(
         ProgressPrimitive.Indicator,
         {
           "data-slot": "progress-indicator",
@@ -3642,12 +3976,12 @@ var Progress = React22.forwardRef(function Progress2({
 Progress.displayName = ProgressPrimitive.Root.displayName;
 
 // src/components/radio-group.tsx
-import * as React23 from "react";
+import * as React25 from "react";
 import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
-import { jsx as jsx25, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs15 } from "react/jsx-runtime";
 var radioGroupOrientationOptions = ["horizontal", "vertical"];
-var RadioGroup2 = React23.forwardRef(function RadioGroup3({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx25(
+var RadioGroup2 = React25.forwardRef(function RadioGroup3({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx27(
     RadioGroupPrimitive.Root,
     {
       ref,
@@ -3661,7 +3995,7 @@ var RadioGroup2 = React23.forwardRef(function RadioGroup3({ className, ...props
   );
 });
 RadioGroup2.displayName = RadioGroupPrimitive.Root.displayName;
-var RadioGroupItem = React23.forwardRef(function RadioGroupItem2({
+var RadioGroupItem = React25.forwardRef(function RadioGroupItem2({
   className,
   controlClassName,
   description,
@@ -3673,12 +4007,12 @@ var RadioGroupItem = React23.forwardRef(function RadioGroupItem2({
   labelClassName,
   ...props
 }, ref) {
-  const generatedId = React23.useId();
+  const generatedId = React25.useId();
   const resolvedId = id ?? generatedId;
   const labelId = label ? `${resolvedId}-label` : void 0;
   const descriptionId = description ? `${resolvedId}-description` : void 0;
   const alignClassName = description ? "items-start" : "items-center";
-  return /* @__PURE__ */ jsxs14(
+  return /* @__PURE__ */ jsxs15(
     "label",
     {
       className: selectionControlContainerClasses({
@@ -3687,7 +4021,7 @@ var RadioGroupItem = React23.forwardRef(function RadioGroupItem2({
         disabled
       }),
       children: [
-        /* @__PURE__ */ jsx25(
+        /* @__PURE__ */ jsx27(
           RadioGroupPrimitive.Item,
           {
             ref,
@@ -3703,7 +4037,7 @@ var RadioGroupItem = React23.forwardRef(function RadioGroupItem2({
               controlClassName
             ),
             ...props,
-            children: /* @__PURE__ */ jsx25(RadioGroupPrimitive.Indicator, { asChild: true, children: /* @__PURE__ */ jsx25(
+            children: /* @__PURE__ */ jsx27(RadioGroupPrimitive.Indicator, { asChild: true, children: /* @__PURE__ */ jsx27(
               "span",
               {
                 "data-slot": "radio-group-indicator",
@@ -3715,8 +4049,8 @@ var RadioGroupItem = React23.forwardRef(function RadioGroupItem2({
             ) })
           }
         ),
-        label || description ? /* @__PURE__ */ jsxs14("span", { className: selectionControlContentBaseClasses, children: [
-          label ? /* @__PURE__ */ jsx25(
+        label || description ? /* @__PURE__ */ jsxs15("span", { className: selectionControlContentBaseClasses, children: [
+          label ? /* @__PURE__ */ jsx27(
             "span",
             {
               id: labelId,
@@ -3727,11 +4061,11 @@ var RadioGroupItem = React23.forwardRef(function RadioGroupItem2({
               children: renderTextContent(label, {
                 as: "span",
                 className: "text-[color:var(--sofya-text-default)]",
-                size: "body"
+                size: "tiny"
               })
             }
           ) : null,
-          description ? /* @__PURE__ */ jsx25(
+          description ? /* @__PURE__ */ jsx27(
             "span",
             {
               id: descriptionId,
@@ -3742,7 +4076,7 @@ var RadioGroupItem = React23.forwardRef(function RadioGroupItem2({
               children: renderTextContent(description, {
                 as: "span",
                 className: "text-muted-foreground",
-                size: "body"
+                size: "tiny"
               })
             }
           ) : null
@@ -3754,12 +4088,12 @@ var RadioGroupItem = React23.forwardRef(function RadioGroupItem2({
 RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;
 
 // src/components/scroll-area.tsx
-import * as React24 from "react";
+import * as React26 from "react";
 import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
-import { jsx as jsx26 } from "react/jsx-runtime";
+import { jsx as jsx28 } from "react/jsx-runtime";
 var scrollAreaOrientationOptions = ["horizontal", "vertical"];
-var ScrollArea = React24.forwardRef(function ScrollArea2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx26(
+var ScrollArea = React26.forwardRef(function ScrollArea2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx28(
     ScrollAreaPrimitive.Root,
     {
       ref,
@@ -3770,8 +4104,8 @@ var ScrollArea = React24.forwardRef(function ScrollArea2({ className, ...props }
   );
 });
 ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
-var ScrollAreaViewport = React24.forwardRef(function ScrollAreaViewport2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx26(
+var ScrollAreaViewport = React26.forwardRef(function ScrollAreaViewport2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx28(
     ScrollAreaPrimitive.Viewport,
     {
       ref,
@@ -3785,8 +4119,8 @@ var ScrollAreaViewport = React24.forwardRef(function ScrollAreaViewport2({ class
   );
 });
 ScrollAreaViewport.displayName = ScrollAreaPrimitive.Viewport.displayName;
-var ScrollAreaScrollbar = React24.forwardRef(function ScrollAreaScrollbar2({ className, orientation = "vertical", thumbClassName, ...props }, ref) {
-  return /* @__PURE__ */ jsx26(
+var ScrollAreaScrollbar = React26.forwardRef(function ScrollAreaScrollbar2({ className, orientation = "vertical", thumbClassName, ...props }, ref) {
+  return /* @__PURE__ */ jsx28(
     ScrollAreaPrimitive.Scrollbar,
     {
       ref,
@@ -3797,7 +4131,7 @@ var ScrollAreaScrollbar = React24.forwardRef(function ScrollAreaScrollbar2({ cla
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx26(
+      children: /* @__PURE__ */ jsx28(
         ScrollAreaPrimitive.Thumb,
         {
           "data-slot": "scroll-area-thumb",
@@ -3811,8 +4145,8 @@ var ScrollAreaScrollbar = React24.forwardRef(function ScrollAreaScrollbar2({ cla
   );
 });
 ScrollAreaScrollbar.displayName = ScrollAreaPrimitive.Scrollbar.displayName;
-var ScrollAreaCorner = React24.forwardRef(function ScrollAreaCorner2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx26(
+var ScrollAreaCorner = React26.forwardRef(function ScrollAreaCorner2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx28(
     ScrollAreaPrimitive.Corner,
     {
       ref,
@@ -3825,34 +4159,34 @@ var ScrollAreaCorner = React24.forwardRef(function ScrollAreaCorner2({ className
 ScrollAreaCorner.displayName = ScrollAreaPrimitive.Corner.displayName;
 
 // src/components/select.tsx
-import * as React25 from "react";
+import * as React27 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 jsx27, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx29, jsxs as jsxs16 } from "react/jsx-runtime";
 var selectSizeOptions = ["default", "sm"];
 var Select = SelectPrimitive.Root;
 var SelectGroup = SelectPrimitive.Group;
-var SelectValue = React25.forwardRef(function SelectValue2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx27(
+var SelectValue = React27.forwardRef(function SelectValue2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx29(
     Text,
     {
       ref,
       as: "span",
       "data-slot": "select-value",
       className: cn("block truncate text-inherit", className),
-      size: "body",
+      size: "tiny",
       style: inheritedTypographyStyle,
-      children: /* @__PURE__ */ jsx27(SelectPrimitive.Value, { className: "block truncate", ...props })
+      children: /* @__PURE__ */ jsx29(SelectPrimitive.Value, { className: "block truncate", ...props })
     }
   );
 });
 SelectValue.displayName = SelectPrimitive.Value.displayName;
-var SelectTrigger = React25.forwardRef(function SelectTrigger2({ className, children, size = "default", ...props }, ref) {
-  return /* @__PURE__ */ jsxs15(
+var SelectTrigger = React27.forwardRef(function SelectTrigger2({ className, children, size = "default", ...props }, ref) {
+  return /* @__PURE__ */ jsxs16(
     SelectPrimitive.Trigger,
     {
       ref,
@@ -3866,7 +4200,7 @@ var SelectTrigger = React25.forwardRef(function SelectTrigger2({ className, chil
       ...props,
       children: [
         children,
-        /* @__PURE__ */ jsx27(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx27(
+        /* @__PURE__ */ jsx29(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx29(
           Icon,
           {
             name: "caret-down",
@@ -3879,8 +4213,8 @@ var SelectTrigger = React25.forwardRef(function SelectTrigger2({ className, chil
   );
 });
 SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
-var SelectScrollUpButton = React25.forwardRef(function SelectScrollUpButton2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx27(
+var SelectScrollUpButton = React27.forwardRef(function SelectScrollUpButton2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx29(
     SelectPrimitive.ScrollUpButton,
     {
       ref,
@@ -3890,13 +4224,13 @@ var SelectScrollUpButton = React25.forwardRef(function SelectScrollUpButton2({ c
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx27(Icon, { name: "caret-up", size: 12 })
+      children: /* @__PURE__ */ jsx29(Icon, { name: "caret-up", size: 12 })
     }
   );
 });
 SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
-var SelectScrollDownButton = React25.forwardRef(function SelectScrollDownButton2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx27(
+var SelectScrollDownButton = React27.forwardRef(function SelectScrollDownButton2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx29(
     SelectPrimitive.ScrollDownButton,
     {
       ref,
@@ -3906,13 +4240,13 @@ var SelectScrollDownButton = React25.forwardRef(function SelectScrollDownButton2
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx27(Icon, { name: "caret-down", size: 12 })
+      children: /* @__PURE__ */ jsx29(Icon, { name: "caret-down", size: 12 })
     }
   );
 });
 SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
-var SelectContent = React25.forwardRef(function SelectContent2({ className, children, position = "popper", ...props }, ref) {
-  return /* @__PURE__ */ jsx27(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs15(
+var SelectContent = React27.forwardRef(function SelectContent2({ className, children, position = "popper", ...props }, ref) {
+  return /* @__PURE__ */ jsx29(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs16(
     SelectPrimitive.Content,
     {
       ref,
@@ -3925,8 +4259,8 @@ var SelectContent = React25.forwardRef(function SelectContent2({ className, chil
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx27(SelectScrollUpButton, {}),
-        /* @__PURE__ */ jsx27(
+        /* @__PURE__ */ jsx29(SelectScrollUpButton, {}),
+        /* @__PURE__ */ jsx29(
           SelectPrimitive.Viewport,
           {
             "data-slot": "select-viewport",
@@ -3934,14 +4268,14 @@ var SelectContent = React25.forwardRef(function SelectContent2({ className, chil
             children
           }
         ),
-        /* @__PURE__ */ jsx27(SelectScrollDownButton, {})
+        /* @__PURE__ */ jsx29(SelectScrollDownButton, {})
       ]
     }
   ) });
 });
 SelectContent.displayName = SelectPrimitive.Content.displayName;
-var SelectLabel = React25.forwardRef(function SelectLabel2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx27(
+var SelectLabel = React27.forwardRef(function SelectLabel2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx29(
     SelectPrimitive.Label,
     {
       ref,
@@ -3963,32 +4297,32 @@ var SelectLabel = React25.forwardRef(function SelectLabel2({ className, ...props
   );
 });
 SelectLabel.displayName = SelectPrimitive.Label.displayName;
-var SelectItem = React25.forwardRef(function SelectItem2({ className, children, ...props }, ref) {
-  return /* @__PURE__ */ jsxs15(
+var SelectItem = React27.forwardRef(function SelectItem2({ className, children, ...props }, ref) {
+  return /* @__PURE__ */ jsxs16(
     SelectPrimitive.Item,
     {
       ref,
       "data-slot": "select-item",
       className: cn(
-        "relative flex min-w-0 cursor-pointer select-none items-center self-stretch rounded-[8px] px-4 py-2 pr-8 [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)] outline-none transition-colors duration-sofya ease-sofya data-[disabled]:pointer-events-none data-[disabled]:opacity-40 data-[highlighted]:bg-[color:var(--sofya-surface-hover)] data-[highlighted]:text-[color:var(--sofya-text-default)] data-[state=checked]:bg-[color:var(--sofya-surface-selected)]",
+        "relative flex min-w-0 cursor-pointer select-none items-center self-stretch rounded-[8px] px-4 py-2 pr-8 [font-family:var(--sofya-text-tiny-font-family)] text-[length:var(--sofya-text-tiny-font-size)] [font-weight:var(--sofya-text-tiny-font-weight)] leading-[var(--sofya-text-tiny-line-height)] tracking-[var(--sofya-text-tiny-letter-spacing)] text-[color:var(--sofya-text-default)] outline-none transition-colors duration-sofya ease-sofya data-[disabled]:pointer-events-none data-[disabled]:opacity-40 data-[highlighted]:bg-[color:var(--sofya-surface-hover)] data-[highlighted]:text-[color:var(--sofya-text-default)] data-[state=checked]:bg-[color:var(--sofya-surface-selected)]",
         className
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx27(SelectPrimitive.ItemText, { className: "truncate", children: renderTextContent(children, {
+        /* @__PURE__ */ jsx29(SelectPrimitive.ItemText, { className: "truncate", children: renderTextContent(children, {
           as: "span",
           className: "block truncate text-[color:var(--sofya-text-default)]",
-          size: "body",
+          size: "tiny",
           style: inheritedTypographyStyle
         }) }),
-        /* @__PURE__ */ jsx27(SelectPrimitive.ItemIndicator, { asChild: true, children: /* @__PURE__ */ jsx27("span", { className: "absolute right-4 inline-flex h-4 w-4 items-center justify-center text-primary", children: /* @__PURE__ */ jsx27(Icon, { name: "check", size: 14 }) }) })
+        /* @__PURE__ */ jsx29(SelectPrimitive.ItemIndicator, { asChild: true, children: /* @__PURE__ */ jsx29("span", { className: "absolute right-4 inline-flex h-4 w-4 items-center justify-center text-primary", children: /* @__PURE__ */ jsx29(Icon, { name: "check", size: 14 }) }) })
       ]
     }
   );
 });
 SelectItem.displayName = SelectPrimitive.Item.displayName;
-var SelectSeparator = React25.forwardRef(function SelectSeparator2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx27(
+var SelectSeparator = React27.forwardRef(function SelectSeparator2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx29(
     SelectPrimitive.Separator,
     {
       ref,
@@ -4001,11 +4335,11 @@ var SelectSeparator = React25.forwardRef(function SelectSeparator2({ className,
 SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
 
 // src/components/separator.tsx
-import * as React26 from "react";
+import * as React28 from "react";
 import * as SeparatorPrimitive from "@radix-ui/react-separator";
-import { jsx as jsx28 } from "react/jsx-runtime";
-var Separator2 = React26.forwardRef(function Separator3({ className, decorative = true, orientation = "horizontal", ...props }, ref) {
-  return /* @__PURE__ */ jsx28(
+import { jsx as jsx30 } from "react/jsx-runtime";
+var Separator2 = React28.forwardRef(function Separator3({ className, decorative = true, orientation = "horizontal", ...props }, ref) {
+  return /* @__PURE__ */ jsx30(
     SeparatorPrimitive.Root,
     {
       ref,
@@ -4024,8 +4358,8 @@ var Separator2 = React26.forwardRef(function Separator3({ className, decorative
 Separator2.displayName = SeparatorPrimitive.Root.displayName;
 
 // src/components/slider.tsx
-import * as React27 from "react";
-import { jsx as jsx29, jsxs as jsxs16 } from "react/jsx-runtime";
+import * as React29 from "react";
+import { jsx as jsx31, jsxs as jsxs17 } from "react/jsx-runtime";
 function clampSliderValue(value, min, max) {
   if (Number.isNaN(value)) {
     return min;
@@ -4050,7 +4384,7 @@ function resolveSliderMeasurement(value, fallback) {
 function isTextValue(value) {
   return typeof value === "string" || typeof value === "number";
 }
-var Slider = React27.forwardRef(function Slider2({
+var Slider = React29.forwardRef(function Slider2({
   className,
   defaultValue,
   formatValue,
@@ -4073,7 +4407,7 @@ var Slider = React27.forwardRef(function Slider2({
   valueClassName,
   ...props
 }, ref) {
-  const resolvedId = React27.useId();
+  const resolvedId = React29.useId();
   const inputId = id ?? resolvedId;
   const safeMin = min;
   const safeMax = resolveSliderMax(safeMin, max);
@@ -4082,7 +4416,7 @@ var Slider = React27.forwardRef(function Slider2({
     onChange: onValueChange,
     value
   });
-  React27.useEffect(() => {
+  React29.useEffect(() => {
     if (value !== void 0) {
       return;
     }
@@ -4129,14 +4463,14 @@ var Slider = React27.forwardRef(function Slider2({
     setControllableValue(nextValue);
     onChange?.(event);
   };
-  return /* @__PURE__ */ jsxs16(
+  return /* @__PURE__ */ jsxs17(
     "div",
     {
       "data-slot": "slider",
       className: cn("grid w-full gap-2", className),
       children: [
-        label || showValue ? /* @__PURE__ */ jsxs16("div", { className: "flex items-center justify-between gap-4", children: [
-          label ? /* @__PURE__ */ jsx29(
+        label || showValue ? /* @__PURE__ */ jsxs17("div", { className: "flex items-center justify-between gap-4", children: [
+          label ? /* @__PURE__ */ jsx31(
             FieldLabel,
             {
               htmlFor: inputId,
@@ -4147,8 +4481,8 @@ var Slider = React27.forwardRef(function Slider2({
               textClassName: "block min-w-0 text-[color:var(--sofya-text-default)]",
               children: label
             }
-          ) : /* @__PURE__ */ jsx29("span", {}),
-          showValue ? /* @__PURE__ */ jsx29(
+          ) : /* @__PURE__ */ jsx31("span", {}),
+          showValue ? /* @__PURE__ */ jsx31(
             "div",
             {
               className: cn(
@@ -4166,7 +4500,7 @@ var Slider = React27.forwardRef(function Slider2({
             }
           ) : null
         ] }) : null,
-        /* @__PURE__ */ jsxs16(
+        /* @__PURE__ */ jsxs17(
           "div",
           {
             "data-slot": "slider-control",
@@ -4176,7 +4510,7 @@ var Slider = React27.forwardRef(function Slider2({
             ),
             style: controlStyle,
             children: [
-              /* @__PURE__ */ jsx29(
+              /* @__PURE__ */ jsx31(
                 "input",
                 {
                   ...props,
@@ -4193,7 +4527,7 @@ var Slider = React27.forwardRef(function Slider2({
                   style: inputBoundsStyle
                 }
               ),
-              /* @__PURE__ */ jsx29(
+              /* @__PURE__ */ jsx31(
                 "div",
                 {
                   "data-slot": "slider-track",
@@ -4204,7 +4538,7 @@ var Slider = React27.forwardRef(function Slider2({
                   style: trackBoundsStyle
                 }
               ),
-              /* @__PURE__ */ jsx29(
+              /* @__PURE__ */ jsx31(
                 "div",
                 {
                   "data-slot": "slider-range",
@@ -4215,7 +4549,7 @@ var Slider = React27.forwardRef(function Slider2({
                   style: rangeStyle
                 }
               ),
-              /* @__PURE__ */ jsx29(
+              /* @__PURE__ */ jsx31(
                 "div",
                 {
                   "data-slot": "slider-thumb",
@@ -4236,10 +4570,10 @@ var Slider = React27.forwardRef(function Slider2({
 Slider.displayName = "Slider";
 
 // src/components/skeleton.tsx
-import * as React28 from "react";
-import { jsx as jsx30 } from "react/jsx-runtime";
-var Skeleton = React28.forwardRef(function Skeleton2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx30(
+import * as React30 from "react";
+import { jsx as jsx32 } from "react/jsx-runtime";
+var Skeleton = React30.forwardRef(function Skeleton2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx32(
     "div",
     {
       ref,
@@ -4254,18 +4588,18 @@ var Skeleton = React28.forwardRef(function Skeleton2({ className, ...props }, re
 Skeleton.displayName = "Skeleton";
 
 // src/components/sonner.tsx
-import * as React29 from "react";
+import * as React31 from "react";
 import {
   Toaster as SonnerToaster,
   toast
 } from "sonner";
-import { jsx as jsx31 } from "react/jsx-runtime";
+import { jsx as jsx33 } from "react/jsx-runtime";
 var notificationVariantOptions = ["default", "success", "error", "warning"];
 function ToastStatusIcon({
   iconName,
   className
 }) {
-  return /* @__PURE__ */ jsx31(
+  return /* @__PURE__ */ jsx33(
     "span",
     {
       "aria-hidden": "true",
@@ -4273,7 +4607,7 @@ function ToastStatusIcon({
         "inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-full border shadow-sofya-sm",
         className
       ),
-      children: /* @__PURE__ */ jsx31(Icon, { name: iconName, size: 16 })
+      children: /* @__PURE__ */ jsx33(Icon, { name: iconName, size: 16 })
     }
   );
 }
@@ -4294,35 +4628,35 @@ var defaultToastClassNames = {
   loading: "border-border bg-card text-foreground"
 };
 var defaultToastIcons = {
-  success: /* @__PURE__ */ jsx31(
+  success: /* @__PURE__ */ jsx33(
     ToastStatusIcon,
     {
       iconName: "check",
       className: "border-success/15 bg-success/12 text-success"
     }
   ),
-  error: /* @__PURE__ */ jsx31(
+  error: /* @__PURE__ */ jsx33(
     ToastStatusIcon,
     {
       iconName: "x",
       className: "border-destructive/15 bg-destructive/12 text-destructive"
     }
   ),
-  warning: /* @__PURE__ */ jsx31(
+  warning: /* @__PURE__ */ jsx33(
     ToastStatusIcon,
     {
       iconName: "question",
       className: "border-warning/20 bg-warning/15 text-foreground"
     }
   ),
-  info: /* @__PURE__ */ jsx31(
+  info: /* @__PURE__ */ jsx33(
     ToastStatusIcon,
     {
       iconName: "question",
       className: "border-primary/15 bg-primary/10 text-primary"
     }
   ),
-  close: /* @__PURE__ */ jsx31(Icon, { name: "x", size: 12 })
+  close: /* @__PURE__ */ jsx33(Icon, { name: "x", size: 12 })
 };
 function mergeToastClassNames(overrides) {
   return {
@@ -4330,7 +4664,7 @@ function mergeToastClassNames(overrides) {
     ...overrides
   };
 }
-var Toaster = React29.forwardRef(
+var Toaster = React31.forwardRef(
   function Toaster2({
     className,
     closeButton = true,
@@ -4342,7 +4676,7 @@ var Toaster = React29.forwardRef(
     visibleToasts = 5,
     ...props
   }, ref) {
-    return /* @__PURE__ */ jsx31(
+    return /* @__PURE__ */ jsx33(
       SonnerToaster,
       {
         ref,
@@ -4371,43 +4705,10 @@ var Toaster = React29.forwardRef(
 );
 Toaster.displayName = "Toaster";
 
-// src/components/spinner.tsx
-import * as React30 from "react";
-import { IconLoader2 as IconLoader22 } from "@tabler/icons-react";
-import { jsx as jsx32 } from "react/jsx-runtime";
-var spinnerSizeOptions = ["sm", "default", "lg"];
-var Spinner = React30.forwardRef(function Spinner2({
-  "aria-label": ariaLabelProp,
-  "aria-labelledby": ariaLabelledby,
-  className,
-  role = "status",
-  size = "default",
-  ...props
-}, ref) {
-  const ariaLabel = ariaLabelProp ?? (ariaLabelledby ? void 0 : "Loading");
-  return /* @__PURE__ */ jsx32(
-    IconLoader22,
-    {
-      ref,
-      "data-size": size,
-      "data-slot": "spinner",
-      role,
-      "aria-label": ariaLabel,
-      "aria-labelledby": ariaLabelledby,
-      className: cn(
-        "shrink-0 animate-spin text-primary data-[size=sm]:h-3.5 data-[size=sm]:w-3.5 data-[size=default]:h-4 data-[size=default]:w-4 data-[size=lg]:h-6 data-[size=lg]:w-6",
-        className
-      ),
-      ...props
-    }
-  );
-});
-Spinner.displayName = "Spinner";
-
 // src/components/switch.tsx
-import * as React31 from "react";
+import * as React32 from "react";
 import * as SwitchPrimitives from "@radix-ui/react-switch";
-import { jsx as jsx33, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx34, jsxs as jsxs18 } from "react/jsx-runtime";
 var switchSizeOptions = ["default", "sm"];
 var switchRootSizeClasses = {
   default: "h-6 w-11",
@@ -4417,7 +4718,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 = React31.forwardRef(
+var Switch = React32.forwardRef(
   ({
     "aria-describedby": ariaDescribedBy,
     "aria-labelledby": ariaLabelledBy,
@@ -4432,7 +4733,7 @@ var Switch = React31.forwardRef(
     size,
     ...props
   }, ref) => {
-    const generatedId = React31.useId();
+    const generatedId = React32.useId();
     const resolvedId = id ?? generatedId;
     const labelId = label ? `${resolvedId}-label` : void 0;
     const descriptionId = description ? `${resolvedId}-description` : void 0;
@@ -4441,7 +4742,7 @@ var Switch = React31.forwardRef(
     const alignClassName = description ? "items-start" : "items-center";
     const resolvedAriaDescribedBy = [ariaDescribedBy, descriptionId].filter(Boolean).join(" ") || void 0;
     const resolvedAriaLabelledBy = ariaLabelledBy ?? labelId;
-    const switchControl = /* @__PURE__ */ jsx33(
+    const switchControl = /* @__PURE__ */ jsx34(
       SwitchPrimitives.Root,
       {
         id: resolvedId,
@@ -4456,7 +4757,7 @@ var Switch = React31.forwardRef(
         "data-size": resolvedSize,
         ...props,
         ref,
-        children: /* @__PURE__ */ jsx33(
+        children: /* @__PURE__ */ jsx34(
           SwitchPrimitives.Thumb,
           {
             className: cn(
@@ -4470,7 +4771,7 @@ var Switch = React31.forwardRef(
     if (!hasTextContent) {
       return switchControl;
     }
-    return /* @__PURE__ */ jsxs17(
+    return /* @__PURE__ */ jsxs18(
       "div",
       {
         "data-slot": "switch-container",
@@ -4481,8 +4782,8 @@ var Switch = React31.forwardRef(
         }),
         children: [
           switchControl,
-          /* @__PURE__ */ jsxs17("span", { className: selectionControlContentBaseClasses, children: [
-            label ? /* @__PURE__ */ jsx33("label", { htmlFor: resolvedId, className: selectionControlLabelTextBaseClasses, children: /* @__PURE__ */ jsx33(
+          /* @__PURE__ */ jsxs18("span", { className: selectionControlContentBaseClasses, children: [
+            label ? /* @__PURE__ */ jsx34("label", { htmlFor: resolvedId, className: selectionControlLabelTextBaseClasses, children: /* @__PURE__ */ jsx34(
               "span",
               {
                 id: labelId,
@@ -4493,11 +4794,11 @@ var Switch = React31.forwardRef(
                 children: renderTextContent(label, {
                   as: "span",
                   className: "text-[color:var(--sofya-text-default)]",
-                  size: "body"
+                  size: "tiny"
                 })
               }
             ) }) : null,
-            description ? /* @__PURE__ */ jsx33(
+            description ? /* @__PURE__ */ jsx34(
               "span",
               {
                 id: descriptionId,
@@ -4508,7 +4809,7 @@ var Switch = React31.forwardRef(
                 children: renderTextContent(description, {
                   as: "span",
                   className: "text-muted-foreground",
-                  size: "body"
+                  size: "tiny"
                 })
               }
             ) : null
@@ -4522,8 +4823,8 @@ Switch.displayName = SwitchPrimitives.Root.displayName;
 
 // src/components/table.tsx
 import { cva as cva8 } from "class-variance-authority";
-import * as React32 from "react";
-import { jsx as jsx34 } from "react/jsx-runtime";
+import * as React33 from "react";
+import { jsx as jsx35 } from "react/jsx-runtime";
 var tableCellVariantOptions = ["default", "primary", "muted"];
 var tableStatusToneOptions = [
   "active",
@@ -4573,13 +4874,13 @@ var tableActionButtonVariants = cva8(
     }
   }
 );
-var Table = React32.forwardRef(function Table2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx34(
+var Table = React33.forwardRef(function Table2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx35(
     "div",
     {
       "data-slot": "table-container",
       className: "relative w-full overflow-x-auto",
-      children: /* @__PURE__ */ jsx34(
+      children: /* @__PURE__ */ jsx35(
         "table",
         {
           "data-slot": "table",
@@ -4594,8 +4895,8 @@ var Table = React32.forwardRef(function Table2({ className, ...props }, ref) {
     }
   );
 });
-var TableHeader = React32.forwardRef(function TableHeader2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx34(
+var TableHeader = React33.forwardRef(function TableHeader2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx35(
     "thead",
     {
       "data-slot": "table-header",
@@ -4608,8 +4909,8 @@ var TableHeader = React32.forwardRef(function TableHeader2({ className, ...props
     }
   );
 });
-var TableBody = React32.forwardRef(function TableBody2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx34(
+var TableBody = React33.forwardRef(function TableBody2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx35(
     "tbody",
     {
       "data-slot": "table-body",
@@ -4619,8 +4920,8 @@ var TableBody = React32.forwardRef(function TableBody2({ className, ...props },
     }
   );
 });
-var TableFooter = React32.forwardRef(function TableFooter2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx34(
+var TableFooter = React33.forwardRef(function TableFooter2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx35(
     "tfoot",
     {
       "data-slot": "table-footer",
@@ -4633,8 +4934,8 @@ var TableFooter = React32.forwardRef(function TableFooter2({ className, ...props
     }
   );
 });
-var TableRow = React32.forwardRef(function TableRow2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx34(
+var TableRow = React33.forwardRef(function TableRow2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx35(
     "tr",
     {
       "data-slot": "table-row",
@@ -4647,8 +4948,8 @@ var TableRow = React32.forwardRef(function TableRow2({ className, ...props }, re
     }
   );
 });
-var TableHead = React32.forwardRef(function TableHead2({ className, children, ...props }, ref) {
-  return /* @__PURE__ */ jsx34(
+var TableHead = React33.forwardRef(function TableHead2({ className, children, ...props }, ref) {
+  return /* @__PURE__ */ jsx35(
     "th",
     {
       "data-slot": "table-head",
@@ -4667,9 +4968,9 @@ var TableHead = React32.forwardRef(function TableHead2({ className, children, ..
     }
   );
 });
-var TableCell = React32.forwardRef(
+var TableCell = React33.forwardRef(
   function TableCell2({ className, variant, children, ...props }, ref) {
-    return /* @__PURE__ */ jsx34(
+    return /* @__PURE__ */ jsx35(
       "td",
       {
         "data-slot": "table-cell",
@@ -4686,8 +4987,8 @@ var TableCell = React32.forwardRef(
     );
   }
 );
-var TableCaption = React32.forwardRef(function TableCaption2({ className, children, ...props }, ref) {
-  return /* @__PURE__ */ jsx34(
+var TableCaption = React33.forwardRef(function TableCaption2({ className, children, ...props }, ref) {
+  return /* @__PURE__ */ jsx35(
     "caption",
     {
       "data-slot": "table-caption",
@@ -4712,7 +5013,7 @@ function TableStatusBadge({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsx34(
+  return /* @__PURE__ */ jsx35(
     Badge,
     {
       variant: "pill",
@@ -4727,8 +5028,8 @@ function TableStatusBadge({
     }
   );
 }
-var TableActionButton = React32.forwardRef(function TableActionButton2({ className, tone, type = "button", children, ...props }, ref) {
-  return /* @__PURE__ */ jsx34(
+var TableActionButton = React33.forwardRef(function TableActionButton2({ className, tone, type = "button", children, ...props }, ref) {
+  return /* @__PURE__ */ jsx35(
     Button,
     {
       ref,
@@ -4746,8 +5047,8 @@ var TableActionButton = React32.forwardRef(function TableActionButton2({ classNa
     }
   );
 });
-var TableActions = React32.forwardRef(function TableActions2({ className, ...props }, ref) {
-  return /* @__PURE__ */ jsx34(
+var TableActions = React33.forwardRef(function TableActions2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx35(
     "div",
     {
       ref,
@@ -4768,10 +5069,10 @@ TableActionButton.displayName = "TableActionButton";
 TableActions.displayName = "TableActions";
 
 // src/components/tabs.tsx
-import * as React33 from "react";
+import * as React34 from "react";
 import * as TabsPrimitive from "@radix-ui/react-tabs";
 import { motion as motion3 } from "motion/react";
-import { jsx as jsx35, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx36, jsxs as jsxs19 } from "react/jsx-runtime";
 function resolveDefaultValue(items, defaultValue) {
   if (defaultValue) {
     return defaultValue;
@@ -4795,13 +5096,13 @@ function Tabs({
     onChange: onValueChange,
     value
   });
-  const indicatorLayoutId = React33.useId();
-  React33.useEffect(() => {
+  const indicatorLayoutId = React34.useId();
+  React34.useEffect(() => {
     if (value === void 0) {
       setUncontrolledCurrentValue(resolvedDefaultValue);
     }
   }, [resolvedDefaultValue, setUncontrolledCurrentValue, value]);
-  return /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs19(
     TabsPrimitive.Root,
     {
       className: cn("w-full", className),
@@ -4809,7 +5110,7 @@ function Tabs({
       value: currentValue,
       ...props,
       children: [
-        /* @__PURE__ */ jsx35(
+        /* @__PURE__ */ jsx36(
           TabsPrimitive.List,
           {
             "aria-label": "Subtelas navegaveis",
@@ -4820,19 +5121,19 @@ function Tabs({
             children: items.map((item) => {
               const isUnavailable = item.disabled || item.loading;
               const isActive = item.value === currentValue;
-              return /* @__PURE__ */ jsxs18(
+              return /* @__PURE__ */ jsxs19(
                 TabsPrimitive.Trigger,
                 {
                   value: item.value,
                   disabled: isUnavailable,
                   className: cn(
-                    "relative inline-flex min-h-[76px] shrink-0 items-center justify-center px-8 pb-4 pt-6 [font-family:var(--sofya-text-h5-font-family)] text-[length:var(--sofya-text-h5-font-size)] [font-weight:var(--sofya-text-h5-font-weight)] leading-[var(--sofya-text-h5-line-height)] tracking-[var(--sofya-text-h5-letter-spacing)] text-[color:var(--sofya-text-subtle)] transition-[color,opacity] duration-sofya ease-sofya focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[color:var(--sofya-focus-ring-soft)] focus-visible:ring-offset-0 disabled:pointer-events-none disabled:text-[color:var(--sofya-text-placeholder)] data-[state=active]:text-primary",
+                    "relative inline-flex min-h-[76px] shrink-0 items-center justify-center px-8 pb-4 pt-6 [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-subtle)] transition-[color,opacity] duration-sofya ease-sofya focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[color:var(--sofya-focus-ring-soft)] focus-visible:ring-offset-0 disabled:pointer-events-none disabled:text-[color:var(--sofya-text-placeholder)] data-[state=active]:text-primary",
                     item.loading && "disabled:text-[color:var(--sofya-text-soft)]",
                     triggerClassName,
                     item.triggerClassName
                   ),
                   children: [
-                    isActive ? /* @__PURE__ */ jsx35(
+                    isActive ? /* @__PURE__ */ jsx36(
                       motion3.span,
                       {
                         "aria-hidden": "true",
@@ -4842,18 +5143,18 @@ function Tabs({
                         transition: { duration: 0.25, ease: "easeInOut" }
                       }
                     ) : null,
-                    /* @__PURE__ */ jsxs18("span", { className: "relative z-10 inline-flex items-center gap-2", children: [
-                      item.loading ? /* @__PURE__ */ jsx35(
+                    /* @__PURE__ */ jsxs19("span", { className: "relative z-10 inline-flex items-center gap-2", children: [
+                      item.loading ? /* @__PURE__ */ jsx36(
                         "span",
                         {
                           "aria-hidden": "true",
                           className: "h-4 w-4 animate-spin rounded-full border-2 border-current border-r-transparent"
                         }
                       ) : null,
-                      /* @__PURE__ */ jsx35("span", { children: renderTextContent(item.label, {
+                      /* @__PURE__ */ jsx36("span", { children: renderTextContent(item.label, {
                         as: "span",
                         className: "block text-inherit",
-                        size: "h5"
+                        size: "body"
                       }) })
                     ] })
                   ]
@@ -4864,7 +5165,7 @@ function Tabs({
           }
         ),
         items.map(
-          (item) => item.content !== void 0 ? /* @__PURE__ */ jsx35(
+          (item) => item.content !== void 0 ? /* @__PURE__ */ jsx36(
             TabsPrimitive.Content,
             {
               value: item.value,
@@ -4887,9 +5188,9 @@ function Tabs({
 Tabs.displayName = "Tabs";
 
 // src/components/textarea.tsx
-import * as React34 from "react";
-import { jsx as jsx36 } from "react/jsx-runtime";
-var Textarea = React34.forwardRef(
+import * as React35 from "react";
+import { jsx as jsx37 } from "react/jsx-runtime";
+var Textarea = React35.forwardRef(
   ({
     className,
     containerClassName,
@@ -4899,14 +5200,14 @@ var Textarea = React34.forwardRef(
     rows = 5,
     ...props
   }, ref) => {
-    const generatedId = React34.useId();
+    const generatedId = React35.useId();
     const resolvedId = id ?? generatedId;
     const ariaLabel = props["aria-label"] ?? (typeof label === "string" ? label : void 0);
-    const control = /* @__PURE__ */ jsx36(
+    const control = /* @__PURE__ */ jsx37(
       "textarea",
       {
         className: cn(
-          "flex min-h-[120px] w-full resize-y rounded-[10px] border border-[color:var(--sofya-border-strong)] bg-card px-4 py-2 [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 placeholder:text-[color:var(--sofya-text-placeholder)] hover:border-[color:var(--sofya-border-hover)] focus: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-[color:var(--sofya-border-hover)] disabled:cursor-not-allowed disabled:bg-muted disabled:opacity-50",
+          "flex min-h-[120px] w-full resize-y rounded-[10px] border border-[color:var(--sofya-border-strong)] bg-card px-4 py-2 [font-family:var(--sofya-text-tiny-font-family)] text-[length:var(--sofya-text-tiny-font-size)] [font-weight:var(--sofya-text-tiny-font-weight)] leading-[var(--sofya-text-tiny-line-height)] tracking-[var(--sofya-text-tiny-letter-spacing)] text-[color:var(--sofya-text-default)] shadow-none transition-[border-color,box-shadow,background-color,color] duration-sofya ease-sofya placeholder:text-[color:var(--sofya-text-placeholder)] hover:border-[color:var(--sofya-border-hover)] focus: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-[color:var(--sofya-border-hover)] disabled:cursor-not-allowed disabled:bg-muted disabled:opacity-50",
           className
         ),
         id: resolvedId,
@@ -4916,7 +5217,7 @@ var Textarea = React34.forwardRef(
         "aria-label": ariaLabel
       }
     );
-    return /* @__PURE__ */ jsx36(
+    return /* @__PURE__ */ jsx37(
       FieldShell,
       {
         control,
@@ -4931,14 +5232,14 @@ var Textarea = React34.forwardRef(
 Textarea.displayName = "Textarea";
 
 // src/components/tooltip.tsx
-import * as React35 from "react";
+import * as React36 from "react";
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
-import { jsx as jsx37 } from "react/jsx-runtime";
+import { jsx as jsx38 } from "react/jsx-runtime";
 var TooltipProvider = TooltipPrimitive.Provider;
 var Tooltip = TooltipPrimitive.Root;
 var TooltipTrigger = TooltipPrimitive.Trigger;
-var TooltipContent = React35.forwardRef(function TooltipContent2({ className, sideOffset = 8, ...props }, ref) {
-  return /* @__PURE__ */ jsx37(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsx37(
+var TooltipContent = React36.forwardRef(function TooltipContent2({ className, sideOffset = 8, ...props }, ref) {
+  return /* @__PURE__ */ jsx38(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsx38(
     TooltipPrimitive.Content,
     {
       ref,
@@ -4962,13 +5263,13 @@ var TooltipContent = React35.forwardRef(function TooltipContent2({ className, si
 TooltipContent.displayName = TooltipPrimitive.Content.displayName;
 
 // src/theme/provider.tsx
-import * as React36 from "react";
+import * as React37 from "react";
 import {
   createWhitelabelTheme,
   defaultTheme,
   themeToCssVariables
 } from "@sofya-ds/tokens";
-import { jsx as jsx38 } from "react/jsx-runtime";
+import { jsx as jsx39 } from "react/jsx-runtime";
 var SOFYA_FONT_LINKS = [
   {
     id: "preconnect-googleapis",
@@ -4988,7 +5289,7 @@ var SOFYA_FONT_LINKS = [
   }
 ];
 function useSofyaFontLinks() {
-  React36.useEffect(() => {
+  React37.useEffect(() => {
     if (typeof document === "undefined") {
       return;
     }
@@ -5021,7 +5322,7 @@ function SofyaProvider({
   useSofyaFontLinks();
   const theme = createWhitelabelTheme(overrides ?? {}, preset);
   const cssVariables = themeToCssVariables(theme);
-  return /* @__PURE__ */ jsx38(
+  return /* @__PURE__ */ jsx39(
     "div",
     {
       "data-sofya-theme": theme.name,
@@ -5084,6 +5385,7 @@ export {
   DialogTitle,
   DialogTrigger,
   Dropdown,
+  DropdownSearch,
   Empty,
   EmptyContent,
   EmptyDescription,