@olundot/ui 0.10.0 → 0.10.2

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @olundot/ui
 
+## 0.10.2
+
+### Patch Changes
+
+- fix(ui): Dialog 2026 재설계 — 글래스모피즘 블러 제거(단정한 scrim) · 무거운 그림자→floating elevation-8 · radius-lg · 헤더 좌측정렬 · footer 구분선(edge-bleed). API 변경 없음(시각/위계만).
+- fix: toast가 duration 경과 후 자동으로 사라지도록 - ToastRoot가 마운트 시 setTimeout 기반 auto-dismiss 타이머를 걸고 unmount 시 정리한다(기존엔 타이머가 없어 수동 dismiss 전까지 영구 잔존). hover/focus 중에는 일시정지하고 해제 시 남은 시간부터 재개(sonner 관례). 기존 ToastOptions/ToastRoot 공개 API는 변경 없음(additive).
+
+## 0.10.1
+
+### Patch Changes
+
+- 4b65ff6: fix: OTPField fluid가 좁은 폭에서 실제로 한 줄을 유지하도록 - fieldset의 min-content 쿼크 해제(min-w-0), 그룹 w-full/min-w-0 추가, cell cap을 표준 max-w 유틸로 전환해 소비 앱 스캔 의존 제거.
+
 ## 0.10.0
 
 ### Minor Changes

package/dist/index.d.ts

@@ -769,6 +769,12 @@ declare const DialogFooter: {
 };
 declare const DialogTitle: React.ForwardRefExoticComponent<Omit<Dialog$1.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
 declare const DialogDescription: React.ForwardRefExoticComponent<Omit<Dialog$1.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+/**
+ * DialogEyebrow — 제목 위 카테고리 overline(eyebrow). 2026 editorial 헤더 위계의 최상단.
+ * DialogHeader 안에서 DialogTitle '위'에 둔다(예: "시간 제어" / "시험 제어").
+ * 작은 uppercase + tracking + muted 색으로 title(bold)과 대비.
+ */
+declare const DialogEyebrow: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
 /**
  * DialogRawContent — shadcn 기본 스타일 없는 순수 radix Content.
  * 자체 head/body/foot 슬롯을 가진 ModalShell 등 커스텀 구현용.
@@ -1465,4 +1471,4 @@ interface OrganizationLogoProps extends Omit<SVGProps<SVGSVGElement>, "width" |
 }
 declare function OrganizationLogo({ organization, size, className, style, role, "aria-label": ariaLabel, "aria-hidden": ariaHidden, ...props }: OrganizationLogoProps): react_jsx_runtime.JSX.Element;
 
-export { ActionFooter, type ActionFooterAction, type ActionFooterProps, type ActionFooterStatus, Alert, type AlertProps, type AlertVariant, Avatar, AvatarFallback, type AvatarFallbackProps, AvatarImage, Badge, type BadgeProps, type BadgeSize, type BadgeTone, type BadgeVariant, BulkActionBar, type BulkActionBarAction, type BulkActionBarProps, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, CardContent, CardDescription, CardFooter, CardHeader, type CardProps, CardProse, CardTitle, type CardVariant, type CardVariantOptions, Checkbox, type CheckboxCheckedState, CheckboxGroup, type CheckboxGroupAppearance, type CheckboxGroupColumns, CheckboxGroupContext, type CheckboxGroupContextValue, type CheckboxGroupDensity, type CheckboxGroupOrientation, type CheckboxGroupProps, type CheckboxProps, type CheckboxSize, Chip, type ChipProps, type ChipSize, type ChipTone, type ChipVariant, ConfirmDialog, type ConfirmDialogProps, ContextMenu, type ContextMenuPosition, type ContextMenuProps, CopyButton, type CopyButtonProps, DataTable, type DataTableBulkAction, type DataTableColumn, type DataTableProps, type DataTableSort, DetailLayout, type DetailLayoutProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogRawContent, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, type EmptyStateProps, type EmptyStateSize, type EmptyStateTone, type EmptyStateVariantOptions, ErrorState, type ErrorStateProps, FileUploadZone, type FileUploadZoneProps, FilterToolbar, type FilterToolbarProps, FormField, type FormFieldProps, type FormFieldRenderProps, FormLayout, type FormLayoutProps, type FormLayoutSection, FormModal, type FormModalProps, IconButton, type IconButtonBadgeTone, type IconButtonProps, type IconButtonSize, type IconButtonVariant, InfoModal, type InfoModalProps, InlineAlert, type InlineAlertProps, Input, type InputProps, type InputSize, type InputSizeLegacy, type InputState, Label, type LabelProps, ModeToggle, type ModeToggleOption, type ModeToggleProps, NotificationBadge, type NotificationBadgePlacement, type NotificationBadgeProps, type NotificationBadgeSize, OTPField, type OTPFieldProps, type OTPFieldSize, OlunLogo, OlunSymbol, type OlunTheme, type OlunThemeDuration, type OlunThemeState, OrganizationLogo, type OrganizationLogoId, type OrganizationLogoProps, PageHeader, type PageHeaderProps, Pagination, type PaginationProps, type PaginationSize, PermissionContext, type PermissionEvaluator, type PermissionFallback, PermissionGuard, type PermissionGuardProps, PermissionProvider, type PermissionProviderProps, type PermissionScope, type PermissionState, Popover, PopoverAnchor, PopoverArrow, PopoverClose, PopoverContent, type PopoverContentProps, type PopoverProps, PopoverTrigger, Progress, type ProgressProps, type ProgressStatus, Radio, RadioGroup, type RadioGroupAppearance, type RadioGroupColumns, type RadioGroupDensity, type RadioGroupOrientation, type RadioGroupProps, type RadioProps, ScrollArea, ScrollBar, SearchField, type SearchFieldProps, type SearchFieldSize, Select, type SelectAppearance, type SelectOption, type SelectProps, type SelectSize, type SelectState, type SelectVariant, Separator, type SetOlunThemeOptions, Sheet, SheetClose, SheetContent, SheetDescription, SheetDrawer, type SheetDrawerProps, SheetFooter, SheetHeader, type SheetMotionConfig, type SheetMotionDuration, type SheetMotionEasing, type SheetMotionType, SheetTitle, SheetTrigger, Skeleton, type SkeletonProps, SkeletonRow, type SkeletonRowColumn, type SkeletonRowProps, SkeletonText, type SkeletonTextProps, Spinner, type SpinnerProps, StatusBadge, type StatusBadgeProps, type StatusBadgeStatus, type SurfaceLevel, Switch, type SwitchProps, type TabItem, Tabs, TabsContent, type TabsProps, type TabsVariant, Textarea, type TextareaProps, type TextareaSize, type TextareaSizeLegacy, type TextareaState, ThemeFab, type ThemeFabProps, ThemeToggle, type ToastAction, type ToastItem, type ToastOptions, ToastProvider, ToastRoot, type ToastVariant, ToastViewport, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, type TreeItemRowVariantProps, type TreeItemState, type TreeNode, TreeView, type TreeViewProps, TwoTierBadge, type TwoTierBadgeIntent, type TwoTierBadgeProps, type UseOlunThemeValue, WizardLayout, type WizardLayoutProps, type WizardStep, type WizardStepState, actionFooterStatusVariants, actionFooterVariants, alertVariants, badgeDotVariants, badgeVariants, buttonVariants, cardVariants, checkboxBoxVariants, checkboxFieldVariants, checkboxGroupBoxVariants, checkboxGroupItemVariants, checkboxGroupVariants, checkboxRootVariants, checkboxVariants, chipCountVariants, chipVariants, cn, dataTableRowVariants, dataTableVariants, emptyStateIconVariants, emptyStateVariants, errorStateVariants, evaluatePermission, fileUploadIconVariants, fileUploadZoneVariants, formFieldControlStackClassName, formFieldDescriptionClassName, formFieldErrorClassName, formFieldLabelClassName, formFieldRequiredClassName, formFieldVariants, getOlunThemeState, getToastDuration, iconButtonBadgeVariants, iconButtonVariants, inlineAlertVariants, inputMessageVariants, inputVariants, limitToasts, modeToggleItemVariants, modeToggleVariants, notificationBadgeVariants, otpCellVariants, otpFieldGroupVariants, otpFieldMessageVariants, otpFieldVariants, paginationControlVariants, paginationVariants, radioControlVariants, radioGroupVariants, radioVariants, searchFieldInputVariants, searchFieldVariants, selectMessageVariants, selectVariants, setOlunTheme, skeletonVariants, spinnerVariants, statusBadgeDotVariants, statusBadgeVariants, tabsBadgeVariants, tabsListVariants, tabsRootVariants, tabsTriggerVariants, textareaMessageVariants, textareaVariants, toast, toastVariants, toastViewportVariants, treeItemRowVariants, treeViewVariants, twoTierBadgeLineVariants, twoTierBadgeVariants, useOlunTheme, usePermission };
+export { ActionFooter, type ActionFooterAction, type ActionFooterProps, type ActionFooterStatus, Alert, type AlertProps, type AlertVariant, Avatar, AvatarFallback, type AvatarFallbackProps, AvatarImage, Badge, type BadgeProps, type BadgeSize, type BadgeTone, type BadgeVariant, BulkActionBar, type BulkActionBarAction, type BulkActionBarProps, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, CardContent, CardDescription, CardFooter, CardHeader, type CardProps, CardProse, CardTitle, type CardVariant, type CardVariantOptions, Checkbox, type CheckboxCheckedState, CheckboxGroup, type CheckboxGroupAppearance, type CheckboxGroupColumns, CheckboxGroupContext, type CheckboxGroupContextValue, type CheckboxGroupDensity, type CheckboxGroupOrientation, type CheckboxGroupProps, type CheckboxProps, type CheckboxSize, Chip, type ChipProps, type ChipSize, type ChipTone, type ChipVariant, ConfirmDialog, type ConfirmDialogProps, ContextMenu, type ContextMenuPosition, type ContextMenuProps, CopyButton, type CopyButtonProps, DataTable, type DataTableBulkAction, type DataTableColumn, type DataTableProps, type DataTableSort, DetailLayout, type DetailLayoutProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogEyebrow, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogRawContent, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, type EmptyStateProps, type EmptyStateSize, type EmptyStateTone, type EmptyStateVariantOptions, ErrorState, type ErrorStateProps, FileUploadZone, type FileUploadZoneProps, FilterToolbar, type FilterToolbarProps, FormField, type FormFieldProps, type FormFieldRenderProps, FormLayout, type FormLayoutProps, type FormLayoutSection, FormModal, type FormModalProps, IconButton, type IconButtonBadgeTone, type IconButtonProps, type IconButtonSize, type IconButtonVariant, InfoModal, type InfoModalProps, InlineAlert, type InlineAlertProps, Input, type InputProps, type InputSize, type InputSizeLegacy, type InputState, Label, type LabelProps, ModeToggle, type ModeToggleOption, type ModeToggleProps, NotificationBadge, type NotificationBadgePlacement, type NotificationBadgeProps, type NotificationBadgeSize, OTPField, type OTPFieldProps, type OTPFieldSize, OlunLogo, OlunSymbol, type OlunTheme, type OlunThemeDuration, type OlunThemeState, OrganizationLogo, type OrganizationLogoId, type OrganizationLogoProps, PageHeader, type PageHeaderProps, Pagination, type PaginationProps, type PaginationSize, PermissionContext, type PermissionEvaluator, type PermissionFallback, PermissionGuard, type PermissionGuardProps, PermissionProvider, type PermissionProviderProps, type PermissionScope, type PermissionState, Popover, PopoverAnchor, PopoverArrow, PopoverClose, PopoverContent, type PopoverContentProps, type PopoverProps, PopoverTrigger, Progress, type ProgressProps, type ProgressStatus, Radio, RadioGroup, type RadioGroupAppearance, type RadioGroupColumns, type RadioGroupDensity, type RadioGroupOrientation, type RadioGroupProps, type RadioProps, ScrollArea, ScrollBar, SearchField, type SearchFieldProps, type SearchFieldSize, Select, type SelectAppearance, type SelectOption, type SelectProps, type SelectSize, type SelectState, type SelectVariant, Separator, type SetOlunThemeOptions, Sheet, SheetClose, SheetContent, SheetDescription, SheetDrawer, type SheetDrawerProps, SheetFooter, SheetHeader, type SheetMotionConfig, type SheetMotionDuration, type SheetMotionEasing, type SheetMotionType, SheetTitle, SheetTrigger, Skeleton, type SkeletonProps, SkeletonRow, type SkeletonRowColumn, type SkeletonRowProps, SkeletonText, type SkeletonTextProps, Spinner, type SpinnerProps, StatusBadge, type StatusBadgeProps, type StatusBadgeStatus, type SurfaceLevel, Switch, type SwitchProps, type TabItem, Tabs, TabsContent, type TabsProps, type TabsVariant, Textarea, type TextareaProps, type TextareaSize, type TextareaSizeLegacy, type TextareaState, ThemeFab, type ThemeFabProps, ThemeToggle, type ToastAction, type ToastItem, type ToastOptions, ToastProvider, ToastRoot, type ToastVariant, ToastViewport, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, type TreeItemRowVariantProps, type TreeItemState, type TreeNode, TreeView, type TreeViewProps, TwoTierBadge, type TwoTierBadgeIntent, type TwoTierBadgeProps, type UseOlunThemeValue, WizardLayout, type WizardLayoutProps, type WizardStep, type WizardStepState, actionFooterStatusVariants, actionFooterVariants, alertVariants, badgeDotVariants, badgeVariants, buttonVariants, cardVariants, checkboxBoxVariants, checkboxFieldVariants, checkboxGroupBoxVariants, checkboxGroupItemVariants, checkboxGroupVariants, checkboxRootVariants, checkboxVariants, chipCountVariants, chipVariants, cn, dataTableRowVariants, dataTableVariants, emptyStateIconVariants, emptyStateVariants, errorStateVariants, evaluatePermission, fileUploadIconVariants, fileUploadZoneVariants, formFieldControlStackClassName, formFieldDescriptionClassName, formFieldErrorClassName, formFieldLabelClassName, formFieldRequiredClassName, formFieldVariants, getOlunThemeState, getToastDuration, iconButtonBadgeVariants, iconButtonVariants, inlineAlertVariants, inputMessageVariants, inputVariants, limitToasts, modeToggleItemVariants, modeToggleVariants, notificationBadgeVariants, otpCellVariants, otpFieldGroupVariants, otpFieldMessageVariants, otpFieldVariants, paginationControlVariants, paginationVariants, radioControlVariants, radioGroupVariants, radioVariants, searchFieldInputVariants, searchFieldVariants, selectMessageVariants, selectVariants, setOlunTheme, skeletonVariants, spinnerVariants, statusBadgeDotVariants, statusBadgeVariants, tabsBadgeVariants, tabsListVariants, tabsRootVariants, tabsTriggerVariants, textareaMessageVariants, textareaVariants, toast, toastVariants, toastViewportVariants, treeItemRowVariants, treeViewVariants, twoTierBadgeLineVariants, twoTierBadgeVariants, useOlunTheme, usePermission };

package/dist/index.js

@@ -3185,7 +3185,8 @@ var DialogOverlay = React18.forwardRef(({ className, ...props }, ref) => /* @__P
     ref,
     className: cn(
       "fixed inset-0 z-[var(--z-modal)]",
-      "bg-[var(--bg-base)]/80 backdrop-blur-sm",
+      // 2026: 글래스모피즘 블러 제거 — 단정한 scrim 딤만(FE-skill anti-slop).
+      "bg-[var(--bg-base)]/65",
       "data-[state=open]:animate-in data-[state=closed]:animate-out",
       "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
       "motion-reduce:animate-none",
@@ -3205,8 +3206,12 @@ var DialogContent = React18.forwardRef(({ className, children, showCloseButton =
         "fixed left-1/2 top-1/2 z-[var(--z-modal)]",
         "-translate-x-1/2 -translate-y-1/2",
         "grid w-full max-w-lg gap-4 p-[var(--space-4)]",
-        "bg-raised text-foreground",
-        "border border-subtle rounded-[var(--radius-md)] shadow-elevation-4",
+        // modal은 dim overlay 위 — 가장 밝은 DS surface(--bg-base #F1F3F5·여전히 tinted·순백 아님)로 깨끗하게.
+        // arbitrary var 사용: 소비 site/app이 dist를 content-scan 안 해 `bg-base` 유틸이 purge될 수 있어 안전하게 var로.
+        "bg-[var(--bg-base)] text-foreground",
+        // 2026: generic 무거운 그림자 대신 floating elevation-8 + 또렷한 중립 grey border(--border·16%) + radius-lg.
+        // (border-subtle=8%는 너무 흐려 가장자리가 안 보였음 → border-border로 grey 또렷하게.)
+        "border border-border rounded-[var(--radius-lg)] shadow-elevation-8",
         "duration-200",
         "data-[state=open]:animate-in data-[state=closed]:animate-out",
         "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
@@ -3246,7 +3251,8 @@ var DialogHeader = ({
   "div",
   {
     className: cn(
-      "flex flex-col space-y-[var(--space-1)] text-center sm:text-left",
+      // 2026: 중앙정렬 폐기 — 좌측 정렬 editorial 헤더(eyebrow+title+desc 위계).
+      "flex flex-col space-y-[var(--space-1)] text-left",
       className
     ),
     ...props
@@ -3260,7 +3266,12 @@ var DialogFooter = ({
   "div",
   {
     className: cn(
-      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
+      // 2026: 본문과 footer를 구분선으로 분리(edge-bleed로 full-width border). DialogContent의 p-4를
+      // -mx/-mb로 상쇄해 구분선이 다이얼로그 가장자리까지 닿게 한다.
+      "-mx-[var(--space-4)] -mb-[var(--space-4)] mt-[var(--space-2)]",
+      "flex flex-col-reverse gap-[var(--space-2)] border-t border-border",
+      "px-[var(--space-4)] pb-[var(--space-4)] pt-[var(--space-3)]",
+      "sm:flex-row sm:justify-end",
       className
     ),
     ...props
@@ -3272,7 +3283,7 @@ var DialogTitle = React18.forwardRef(({ className, ...props }, ref) => /* @__PUR
   {
     ref,
     className: cn(
-      "text-lg font-semibold leading-tight tracking-tight text-foreground",
+      "text-xl font-bold leading-tight tracking-tight text-foreground",
       className
     ),
     ...props
@@ -3283,11 +3294,23 @@ var DialogDescription = React18.forwardRef(({ className, ...props }, ref) => /*
   DialogPrimitive.Description,
   {
     ref,
-    className: cn("text-sm text-muted-foreground", className),
+    className: cn("text-sm text-text-secondary", className),
     ...props
   }
 ));
 DialogDescription.displayName = DialogPrimitive.Description.displayName;
+var DialogEyebrow = React18.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx19(
+  "p",
+  {
+    ref,
+    className: cn(
+      "text-xs font-semibold uppercase tracking-wider text-muted-foreground",
+      className
+    ),
+    ...props
+  }
+));
+DialogEyebrow.displayName = "DialogEyebrow";
 var DialogRawContent = DialogPrimitive.Content;
 
 // src/components/ui/form-modal.tsx
@@ -7012,6 +7035,39 @@ function getToastDuration(options) {
   }
   return options.variant === "error" ? 7e3 : 3e3;
 }
+function createToastTimer(durationMs, onExpire) {
+  if (!Number.isFinite(durationMs)) {
+    return { pause() {
+    }, resume() {
+    }, clear() {
+    } };
+  }
+  let remaining = Math.max(0, durationMs);
+  let startedAt = Date.now();
+  let timeoutId;
+  const clear = () => {
+    if (timeoutId !== void 0) {
+      clearTimeout(timeoutId);
+      timeoutId = void 0;
+    }
+  };
+  const schedule = () => {
+    clear();
+    startedAt = Date.now();
+    timeoutId = setTimeout(onExpire, remaining);
+  };
+  const pause = () => {
+    if (timeoutId === void 0) return;
+    clear();
+    remaining = Math.max(0, remaining - (Date.now() - startedAt));
+  };
+  const resume = () => {
+    if (timeoutId !== void 0) return;
+    schedule();
+  };
+  schedule();
+  return { pause, resume, clear };
+}
 function createToast(options) {
   const id = `toast-${++toastCounter}`;
   toastItems = limitToasts([...toastItems, { id, ...options }]);
@@ -7059,10 +7115,27 @@ var ToastRoot = React36.forwardRef(
     duration,
     action,
     onClose,
+    onMouseEnter,
+    onMouseLeave,
+    onFocus,
+    onBlur,
     ...props
   }, ref) => {
     const Icon = toastIcons[variant];
     const hasIcon = Icon !== null;
+    const durationMs = getToastDuration({ message, variant, duration });
+    const onCloseRef = React36.useRef(onClose);
+    onCloseRef.current = onClose;
+    const timerRef = React36.useRef(null);
+    React36.useEffect(() => {
+      if (!onCloseRef.current) return void 0;
+      const timer = createToastTimer(durationMs, () => onCloseRef.current?.());
+      timerRef.current = timer;
+      return () => {
+        timer.clear();
+        timerRef.current = null;
+      };
+    }, [durationMs]);
     return /* @__PURE__ */ jsxs41(
       "div",
       {
@@ -7071,12 +7144,28 @@ var ToastRoot = React36.forwardRef(
         "data-slot": "toast",
         "data-variant": variant,
         role: variant === "error" ? "alert" : "status",
-        "data-duration": getToastDuration({ message, variant, duration }),
+        "data-duration": durationMs,
         className: cn(
           toastVariants({ variant }),
           hasIcon ? "grid-cols-[auto_1fr_auto]" : "grid-cols-[1fr_auto]",
           className
         ),
+        onMouseEnter: (event) => {
+          timerRef.current?.pause();
+          onMouseEnter?.(event);
+        },
+        onMouseLeave: (event) => {
+          timerRef.current?.resume();
+          onMouseLeave?.(event);
+        },
+        onFocus: (event) => {
+          timerRef.current?.pause();
+          onFocus?.(event);
+        },
+        onBlur: (event) => {
+          timerRef.current?.resume();
+          onBlur?.(event);
+        },
         ...props,
         children: [
           Icon ? /* @__PURE__ */ jsx46(
@@ -7153,7 +7242,7 @@ import * as React37 from "react";
 import { cva as cva25 } from "class-variance-authority";
 import { AlertCircle as AlertCircle6 } from "lucide-react";
 import { Fragment as Fragment8, jsx as jsx47, jsxs as jsxs42 } from "react/jsx-runtime";
-var otpFieldVariants = cva25("flex w-full flex-col gap-[var(--space-1-5)]", {
+var otpFieldVariants = cva25("flex w-full min-w-0 flex-col gap-[var(--space-1-5)]", {
   variants: {
     size: {
       default: "",
@@ -7171,7 +7260,7 @@ var otpFieldGroupVariants = cva25("flex items-start gap-[var(--space-1)] pt-[var
       compact: ""
     },
     fluid: {
-      true: "flex-nowrap justify-center",
+      true: "flex-nowrap justify-center w-full min-w-0",
       false: "flex-wrap"
     }
   },
@@ -7220,12 +7309,12 @@ var otpCellVariants = cva25(
       {
         size: "default",
         fluid: true,
-        className: "max-w-[52px]"
+        className: "max-w-13"
       },
       {
         size: "compact",
         fluid: true,
-        className: "max-w-[44px]"
+        className: "max-w-11"
       }
     ],
     defaultVariants: {
@@ -8586,6 +8675,7 @@ export {
   DialogClose,
   DialogContent,
   DialogDescription,
+  DialogEyebrow,
   DialogFooter,
   DialogHeader,
   DialogOverlay,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@olundot/ui",
-  "version": "0.10.0",
+  "version": "0.10.2",
   "description": "OLUN. shared React UI components built on OLUN design tokens",
   "license": "MIT",
   "keywords": [