@moduix/react-tailwind 1.1.0 → 2.0.0

package/dist/components/table/Table.js

@@ -24,6 +24,11 @@ const Table_TableRoot = /*#__PURE__*/ forwardRef(function({ asChild, className,
     return /*#__PURE__*/ jsx(ark.table, {
         ref: ref,
         asChild: asChild,
+        className: cn(tableVariants({
+            size,
+            variant
+        }), className),
+        ...props,
         "data-scope": "table",
         "data-part": "root",
         "data-interactive": interactive || void 0,
@@ -32,11 +37,6 @@ const Table_TableRoot = /*#__PURE__*/ forwardRef(function({ asChild, className,
         "data-sticky-header": stickyHeader || void 0,
         "data-striped": striped || void 0,
         "data-variant": variant,
-        className: cn(tableVariants({
-            size,
-            variant
-        }), className),
-        ...props,
         "data-slot": "table-root"
     });
 });
@@ -44,10 +44,10 @@ const Table_TableScrollArea = /*#__PURE__*/ forwardRef(function({ asChild, class
     return /*#__PURE__*/ jsx(ark.div, {
         ref: ref,
         asChild: asChild,
-        "data-scope": "table",
-        "data-part": "scroll-area",
         className: cn('relative isolate w-full min-w-0 overflow-x-auto rounded-lg border border-border bg-card', className),
         ...props,
+        "data-scope": "table",
+        "data-part": "scroll-area",
         "data-slot": "table-scroll-area"
     });
 });
@@ -55,11 +55,11 @@ const Table_TableCaption = /*#__PURE__*/ forwardRef(function({ asChild, classNam
     return /*#__PURE__*/ jsx(ark.caption, {
         ref: ref,
         asChild: asChild,
+        className: cn('px-4 text-left text-sm leading-5 text-pretty text-muted-foreground group-data-[size=lg]/table:px-5 group-data-[size=sm]/table:px-3 data-[side=bottom]:caption-bottom data-[side=bottom]:pt-3 data-[side=bottom]:pb-2 data-[side=top]:caption-top data-[side=top]:pt-2 data-[side=top]:pb-3', className),
+        ...props,
         "data-scope": "table",
         "data-part": "caption",
         "data-side": side,
-        className: cn('px-4 text-left text-sm leading-5 text-pretty text-muted-foreground group-data-[size=lg]/table:px-5 group-data-[size=sm]/table:px-3 data-[side=bottom]:caption-bottom data-[side=bottom]:pt-3 data-[side=bottom]:pb-2 data-[side=top]:caption-top data-[side=top]:pt-2 data-[side=top]:pb-3', className),
-        ...props,
         "data-slot": "table-caption"
     });
 });
@@ -67,10 +67,10 @@ const Table_TableColumnGroup = /*#__PURE__*/ forwardRef(function({ asChild, clas
     return /*#__PURE__*/ jsx(ark.colgroup, {
         ref: ref,
         asChild: asChild,
-        "data-scope": "table",
-        "data-part": "column-group",
         className: className,
         ...props,
+        "data-scope": "table",
+        "data-part": "column-group",
         "data-slot": "table-column-group"
     });
 });
@@ -78,11 +78,11 @@ const Table_TableColumn = /*#__PURE__*/ forwardRef(function({ asChild, className
     return /*#__PURE__*/ jsx(ark.col, {
         ref: ref,
         asChild: asChild,
-        "data-scope": "table",
-        "data-part": "column",
         width: htmlWidth ?? width,
         className: className,
         ...props,
+        "data-scope": "table",
+        "data-part": "column",
         "data-slot": "table-column"
     });
 });
@@ -90,10 +90,10 @@ const Table_TableHeader = /*#__PURE__*/ forwardRef(function({ asChild, className
     return /*#__PURE__*/ jsx(ark.thead, {
         ref: ref,
         asChild: asChild,
-        "data-scope": "table",
-        "data-part": "header",
         className: cn('group/table-header group-data-[sticky-header]/table:sticky group-data-[sticky-header]/table:top-0 group-data-[sticky-header]/table:z-3 group-data-[sticky-header]/table:bg-card', className),
         ...props,
+        "data-scope": "table",
+        "data-part": "header",
         "data-slot": "table-header"
     });
 });
@@ -101,10 +101,10 @@ const Table_TableBody = /*#__PURE__*/ forwardRef(function({ asChild, className,
     return /*#__PURE__*/ jsx(ark.tbody, {
         ref: ref,
         asChild: asChild,
-        "data-scope": "table",
-        "data-part": "body",
         className: cn('group/table-body', className),
         ...props,
+        "data-scope": "table",
+        "data-part": "body",
         "data-slot": "table-body"
     });
 });
@@ -112,10 +112,10 @@ const Table_TableFooter = /*#__PURE__*/ forwardRef(function({ asChild, className
     return /*#__PURE__*/ jsx(ark.tfoot, {
         ref: ref,
         asChild: asChild,
-        "data-scope": "table",
-        "data-part": "footer",
         className: cn('border-t border-border bg-muted font-medium', className),
         ...props,
+        "data-scope": "table",
+        "data-part": "footer",
         "data-slot": "table-footer"
     });
 });
@@ -123,10 +123,10 @@ const Table_TableRow = /*#__PURE__*/ forwardRef(function({ asChild, className, .
     return /*#__PURE__*/ jsx(ark.tr, {
         ref: ref,
         asChild: asChild,
+        className: cn('transition-colors duration-200 ease-in-out group-data-[slot=table-body]/table-body:border-b group-data-[slot=table-body]/table-body:border-border group-data-[slot=table-header]/table-header:border-b group-data-[slot=table-header]/table-header:border-border group-data-[slot=table-body]/table-body:last:border-b-0 motion-reduce:transition-none group-data-[interactive]/table:group-data-[slot=table-body]/table-body:[&:not([data-empty])]:focus-within:bg-muted group-data-[interactive]/table:group-data-[slot=table-body]/table-body:[&:not([data-empty])]:hover:bg-muted group-data-[striped]/table:group-data-[slot=table-body]/table-body:[&:nth-child(even):not([data-empty])]:bg-muted/35', className),
+        ...props,
         "data-scope": "table",
         "data-part": "row",
-        className: cn('transition-colors duration-200 ease-in-out group-data-[slot=table-body]/table-body:border-b group-data-[slot=table-body]/table-body:border-border group-data-[slot=table-header]/table-header:border-b group-data-[slot=table-header]/table-header:border-border group-data-[slot=table-body]/table-body:last:border-b-0 group-data-[interactive]/table:group-data-[slot=table-body]/table-body:[&:not([data-empty])]:focus-within:bg-muted group-data-[interactive]/table:group-data-[slot=table-body]/table-body:[&:not([data-empty])]:hover:bg-muted group-data-[striped]/table:[&:nth-child(even):not([data-empty])]:bg-muted/35', className),
-        ...props,
         "data-slot": "table-row"
     });
 });
@@ -134,11 +134,11 @@ const Table_TableColumnHeader = /*#__PURE__*/ forwardRef(function({ asChild, cla
     return /*#__PURE__*/ jsx(ark.th, {
         ref: ref,
         asChild: asChild,
+        className: cn('relative z-0 px-4 py-3 text-left align-middle font-medium whitespace-nowrap text-muted-foreground group-data-[size=lg]/table:px-5 group-data-[size=lg]/table:py-4 group-data-[size=sm]/table:px-3 group-data-[size=sm]/table:py-2 group-data-[sticky-header]/table:data-[sticky]:z-4 data-[sticky=end]:sticky data-[sticky=end]:end-0 data-[sticky=end]:z-2 data-[sticky=end]:bg-card data-[sticky=start]:sticky data-[sticky=start]:start-0 data-[sticky=start]:z-2 data-[sticky=start]:bg-card group-data-[show-column-border]/table:[&:not(:last-child)]:border-e group-data-[show-column-border]/table:[&:not(:last-child)]:border-border', numeric && 'text-end tabular-nums', className),
+        ...props,
         "data-scope": "table",
         "data-part": "column-header",
         "data-numeric": numeric || void 0,
-        className: cn('relative z-0 px-4 py-3 align-middle font-medium whitespace-nowrap text-muted-foreground group-data-[size=lg]/table:px-5 group-data-[size=lg]/table:py-4 group-data-[size=sm]/table:px-3 group-data-[size=sm]/table:py-2 group-data-[sticky-header]/table:data-[sticky]:z-4 data-[sticky=end]:sticky data-[sticky=end]:end-0 data-[sticky=end]:z-2 data-[sticky=end]:bg-card data-[sticky=start]:sticky data-[sticky=start]:start-0 data-[sticky=start]:z-2 data-[sticky=start]:bg-card group-data-[show-column-border]/table:[&:not(:last-child)]:border-e group-data-[show-column-border]/table:[&:not(:last-child)]:border-border', numeric && 'text-end tabular-nums', className),
-        ...props,
         "data-slot": "table-column-header"
     });
 });
@@ -146,11 +146,11 @@ const Table_TableCell = /*#__PURE__*/ forwardRef(function({ asChild, className,
     return /*#__PURE__*/ jsx(ark.td, {
         ref: ref,
         asChild: asChild,
+        className: cn('relative z-0 px-4 py-3 align-middle group-data-[size=lg]/table:px-5 group-data-[size=lg]/table:py-4 group-data-[size=sm]/table:px-3 group-data-[size=sm]/table:py-2 data-[sticky=end]:sticky data-[sticky=end]:end-0 data-[sticky=end]:z-2 data-[sticky=end]:bg-card data-[sticky=start]:sticky data-[sticky=start]:start-0 data-[sticky=start]:z-2 data-[sticky=start]:bg-card group-data-[show-column-border]/table:[&:not(:last-child)]:border-e group-data-[show-column-border]/table:[&:not(:last-child)]:border-border', numeric && 'text-end tabular-nums', className),
+        ...props,
         "data-scope": "table",
         "data-part": "cell",
         "data-numeric": numeric || void 0,
-        className: cn('relative z-0 px-4 py-3 align-middle group-data-[size=lg]/table:px-5 group-data-[size=lg]/table:py-4 group-data-[size=sm]/table:px-3 group-data-[size=sm]/table:py-2 data-[sticky=end]:sticky data-[sticky=end]:end-0 data-[sticky=end]:z-2 data-[sticky=end]:bg-card data-[sticky=start]:sticky data-[sticky=start]:start-0 data-[sticky=start]:z-2 data-[sticky=start]:bg-card group-data-[show-column-border]/table:[&:not(:last-child)]:border-e group-data-[show-column-border]/table:[&:not(:last-child)]:border-border', numeric && 'text-end tabular-nums', className),
-        ...props,
         "data-slot": "table-cell"
     });
 });
@@ -160,15 +160,15 @@ const Table_TableEmpty = /*#__PURE__*/ forwardRef(function({ asChild, children =
         "data-part": "row",
         "data-empty": true,
         "data-slot": "table-row",
-        className: "transition-colors duration-200 ease-in-out group-data-[slot=table-body]/table-body:border-b group-data-[slot=table-body]/table-body:border-border group-data-[slot=table-body]/table-body:last:border-b-0",
+        className: "transition-colors duration-200 ease-in-out group-data-[slot=table-body]/table-body:border-b group-data-[slot=table-body]/table-body:border-border group-data-[slot=table-body]/table-body:last:border-b-0 motion-reduce:transition-none",
         children: /*#__PURE__*/ jsx(ark.td, {
             ref: ref,
             asChild: asChild,
-            "data-scope": "table",
-            "data-part": "empty",
             colSpan: colSpan,
             className: cn('relative z-0 px-4 py-3 align-middle group-data-[size=lg]/table:px-5 group-data-[size=lg]/table:py-4 group-data-[size=sm]/table:px-3 group-data-[size=sm]/table:py-2 data-[sticky=end]:sticky data-[sticky=end]:end-0 data-[sticky=end]:z-2 data-[sticky=end]:bg-card data-[sticky=start]:sticky data-[sticky=start]:start-0 data-[sticky=start]:z-2 data-[sticky=start]:bg-card group-data-[show-column-border]/table:[&:not(:last-child)]:border-e group-data-[show-column-border]/table:[&:not(:last-child)]:border-border', 'py-6 text-center text-muted-foreground group-data-[size=lg]/table:py-8 group-data-[size=sm]/table:py-4', className),
             ...props,
+            "data-scope": "table",
+            "data-part": "empty",
             "data-slot": "table-empty",
             children: children
         })

package/dist/components/tabs/Tabs.js

@@ -7,10 +7,10 @@ const Tabs_TabsRoot = /*#__PURE__*/ forwardRef(function({ className, orientation
     const resolvedVariant = 'vertical' === orientation ? 'default' : variant;
     return /*#__PURE__*/ jsx(Tabs.Root, {
         ref: ref,
-        "data-variant": resolvedVariant,
         className: cn('group/tabs box-border flex w-full min-w-0 flex-col gap-3 text-foreground data-[orientation=vertical]:flex-row data-[orientation=vertical]:items-stretch', className),
         orientation: orientation,
         ...props,
+        "data-variant": resolvedVariant,
         "data-slot": "tabs-root"
     });
 });
@@ -19,10 +19,10 @@ const Tabs_TabsRootProvider = /*#__PURE__*/ forwardRef(function({ className, val
     const resolvedVariant = 'vertical' === orientation ? 'default' : variant;
     return /*#__PURE__*/ jsx(Tabs.RootProvider, {
         ref: ref,
-        "data-variant": resolvedVariant,
         className: cn('group/tabs box-border flex w-full min-w-0 flex-col gap-3 text-foreground data-[orientation=vertical]:flex-row data-[orientation=vertical]:items-stretch', className),
         value: value,
         ...props,
+        "data-variant": resolvedVariant,
         "data-slot": "tabs-root-provider"
     });
 });
@@ -45,7 +45,7 @@ const Tabs_TabsTrigger = /*#__PURE__*/ forwardRef(function({ className, ...props
 const Tabs_TabsIndicator = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(Tabs.Indicator, {
         ref: ref,
-        className: cn('pointer-events-none absolute top-1/2 left-[var(--left,0)] z-0 h-8 w-[var(--width,0)] -translate-y-1/2 rounded-md bg-background shadow-sm transition-[var(--transition-property,translate)] duration-200 ease-in-out group-data-[orientation=vertical]/tabs:top-[var(--top,0)] group-data-[orientation=vertical]/tabs:left-1/2 group-data-[orientation=vertical]/tabs:h-[var(--height,0)] group-data-[orientation=vertical]/tabs:w-[calc(100%-0.5rem)] group-data-[orientation=vertical]/tabs:-translate-x-1/2 group-data-[orientation=vertical]/tabs:translate-y-0 group-data-[variant=line]/tabs:top-auto group-data-[variant=line]/tabs:bottom-0 group-data-[variant=line]/tabs:h-0.5 group-data-[variant=line]/tabs:[translate:none] group-data-[variant=line]/tabs:rounded-full group-data-[variant=line]/tabs:bg-foreground group-data-[variant=line]/tabs:shadow-none motion-reduce:transition-none', className),
+        className: cn('pointer-events-none absolute top-1/2 left-[var(--left,0)] z-0 h-8 w-[var(--width,0)] -translate-y-1/2 rounded-md bg-background shadow-sm transition-[var(--transition-property,translate)] [--transition-duration:var(--moduix-duration-normal)] [--transition-timing-function:var(--moduix-ease-in-out)] group-data-[orientation=vertical]/tabs:top-[var(--top,0)] group-data-[orientation=vertical]/tabs:left-1/2 group-data-[orientation=vertical]/tabs:h-[var(--height,0)] group-data-[orientation=vertical]/tabs:w-[calc(100%-0.5rem)] group-data-[orientation=vertical]/tabs:-translate-x-1/2 group-data-[orientation=vertical]/tabs:translate-y-0 group-data-[variant=line]/tabs:top-auto group-data-[variant=line]/tabs:bottom-0 group-data-[variant=line]/tabs:h-0.5 group-data-[variant=line]/tabs:[translate:none] group-data-[variant=line]/tabs:rounded-full group-data-[variant=line]/tabs:bg-foreground group-data-[variant=line]/tabs:shadow-none motion-reduce:transition-none', className),
         ...props,
         "data-slot": "tabs-indicator"
     });

package/dist/components/tag/Tag.js

@@ -78,7 +78,7 @@ const Tag_TagCloseTrigger = /*#__PURE__*/ forwardRef(function({ asChild, classNa
         "data-slot": "tag-close-trigger",
         "aria-label": ariaLabel ?? (asChild || null != children || null != ariaLabelledBy ? void 0 : 'Remove tag'),
         "aria-labelledby": ariaLabelledBy,
-        className: cn('size-4 rounded-full bg-transparent p-0 text-inherit focus-visible:outline-1 focus-visible:outline-offset-0 [&>svg]:size-2.5 [@media(hover:hover)]:[&:not([data-disabled]):hover]:bg-current/10 [@media(hover:hover)]:[&:not([data-disabled]):hover]:text-inherit', className),
+        className: cn('size-4 rounded-full bg-transparent p-0 text-inherit focus-visible:outline-1 focus-visible:outline-offset-0 [&>svg]:size-2.5 [@media(hover:hover)]:[&:not([data-disabled]):hover]:bg-current/12 [@media(hover:hover)]:[&:not([data-disabled]):hover]:text-inherit', className),
         children: children
     });
 });

package/dist/components/tags-input/TagsInput.js

@@ -31,7 +31,7 @@ const TagsInput_TagsInputLabel = /*#__PURE__*/ forwardRef(function({ className,
 const TagsInput_TagsInputControl = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(TagsInput.Control, {
         ref: ref,
-        className: cn('flex min-h-control-md w-full flex-wrap items-center gap-1 rounded-md border border-border bg-background px-2 py-[0.3125rem] text-foreground outline-1 -outline-offset-1 outline-transparent transition-[border-color,outline-color,background-color,opacity] duration-200 ease-in-out data-disabled:pointer-events-none data-focus:outline-ring data-invalid:border-destructive data-invalid:data-focus:outline-destructive data-readonly:bg-background data-readonly:text-foreground motion-reduce:transition-none', className),
+        className: cn('group flex min-h-control-md w-full flex-wrap items-center gap-1 rounded-md border border-border bg-background px-2 py-[0.3125rem] text-foreground outline-1 -outline-offset-1 outline-transparent transition-[border-color,outline-color,background-color,opacity] duration-200 ease-in-out data-disabled:pointer-events-none data-focus:outline-ring data-invalid:border-destructive data-invalid:data-focus:outline-destructive data-readonly:bg-background data-readonly:text-foreground motion-reduce:transition-none', className),
         ...props,
         "data-slot": "tags-input-control"
     });
@@ -63,7 +63,7 @@ const TagsInput_TagsInputItemText = /*#__PURE__*/ forwardRef(function({ classNam
 const TagsInput_TagsInputItemDeleteTrigger = /*#__PURE__*/ forwardRef(function({ className, children, ...props }, ref) {
     return /*#__PURE__*/ jsx(TagsInput.ItemDeleteTrigger, {
         ref: ref,
-        className: cn('inline-flex size-4 shrink-0 cursor-pointer items-center justify-center rounded-full border-0 bg-transparent p-0 text-inherit outline-0 transition-[background-color,color,opacity,box-shadow] duration-200 ease-in-out focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:cursor-default disabled:opacity-50 data-disabled:pointer-events-none data-disabled:cursor-default data-disabled:opacity-50 motion-reduce:transition-none [&>svg]:pointer-events-none [&>svg]:size-2.5 [&>svg]:shrink-0 [@media(hover:hover)]:hover:bg-current/10', className),
+        className: cn('inline-flex size-4 shrink-0 cursor-pointer items-center justify-center rounded-full border-0 bg-transparent p-0 text-inherit outline-0 transition-[background-color,color,opacity,box-shadow] duration-200 ease-in-out group-data-readonly:hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:cursor-default disabled:opacity-50 data-disabled:pointer-events-none data-disabled:cursor-default data-disabled:opacity-50 motion-reduce:transition-none [&>svg]:pointer-events-none [&>svg]:size-2.5 [&>svg]:shrink-0 [@media(hover:hover)]:hover:bg-current/12', className),
         ...props,
         "data-slot": "tags-input-item-delete-trigger",
         children: children ?? /*#__PURE__*/ jsx(CloseIcon, {})
@@ -90,7 +90,7 @@ const TagsInput_TagsInputClearTrigger = /*#__PURE__*/ forwardRef(function({ asCh
     return /*#__PURE__*/ jsx(TagsInput.ClearTrigger, {
         ref: ref,
         asChild: true,
-        className: cn(asChild ? 'ms-auto shrink-0 self-center data-readonly:hidden' : 'ms-auto size-control-xs shrink-0 self-center rounded-sm bg-transparent text-muted-foreground transition-[background-color,color,opacity] duration-200 ease-in-out focus-visible:outline-1 focus-visible:outline-offset-1 focus-visible:outline-ring data-readonly:hidden motion-reduce:transition-none [&>svg]:size-3 [@media(hover:hover)]:hover:bg-muted [@media(hover:hover)]:hover:text-foreground', className),
+        className: cn(asChild ? 'ms-auto shrink-0 self-center data-readonly:hidden' : 'ms-auto size-control-xs shrink-0 self-center focus-visible:outline-1 data-readonly:hidden motion-reduce:transition-none [&>svg]:size-3', className),
         "aria-label": asChild ? ariaLabel : void 0,
         "aria-labelledby": asChild ? ariaLabelledBy : void 0,
         ...props,

package/dist/components/text/Text.js

@@ -66,7 +66,7 @@ const Text_TextRoot = /*#__PURE__*/ forwardRef(function({ as, asChild, size, wei
             weight: weight ?? defaultWeight,
             tone,
             align: align ?? 'start'
-        }), truncate && 'overflow-hidden text-ellipsis whitespace-nowrap', void 0 !== resolvedLineClamp && '[display:-webkit-box] overflow-hidden [white-space:normal] [-webkit-box-orient:vertical]', className),
+        }), truncate && 'overflow-hidden text-ellipsis whitespace-nowrap', void 0 !== resolvedLineClamp && '[display:-webkit-box] overflow-hidden whitespace-normal [-webkit-box-orient:vertical]', className),
         style: void 0 === resolvedLineClamp ? style : {
             ...style,
             WebkitLineClamp: resolvedLineClamp

package/dist/components/timer/Timer.js

@@ -54,7 +54,7 @@ const Timer_TimerControl = /*#__PURE__*/ forwardRef(function({ className, ...pro
 const Timer_TimerActionTrigger = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(Timer.ActionTrigger, {
         ref: ref,
-        className: cn('inline-flex min-h-control-md cursor-pointer appearance-none items-center justify-center gap-2 rounded-md border border-border bg-background px-3 py-1.5 text-sm leading-5 font-medium whitespace-nowrap text-foreground transition-[background-color,border-color,color,opacity,box-shadow] duration-200 ease-in-out focus-visible:outline-2 focus-visible:-outline-offset-1 focus-visible:outline-ring disabled:pointer-events-none disabled:cursor-default disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:cursor-default aria-disabled:opacity-50 [&_svg]:size-4 [&_svg]:shrink-0 [@media(hover:hover)]:hover:bg-accent', className),
+        className: cn('inline-flex min-h-control-md cursor-pointer appearance-none items-center justify-center gap-2 rounded-md border border-border bg-background px-3 py-1.5 text-sm leading-5 font-medium whitespace-nowrap text-foreground transition-[background-color,border-color,color,opacity,box-shadow] duration-200 ease-in-out focus-visible:outline-2 focus-visible:-outline-offset-1 focus-visible:outline-ring disabled:pointer-events-none disabled:cursor-default disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:cursor-default aria-disabled:opacity-50 motion-reduce:transition-none [&_svg]:size-4 [&_svg]:shrink-0 [@media(hover:hover)]:hover:bg-accent', className),
         ...props,
         "data-slot": "timer-action-trigger"
     });

package/dist/components/toast/Toast.js

@@ -13,7 +13,7 @@ const Toast_Toaster = /*#__PURE__*/ forwardRef(function({ className, portalled,
         children: /*#__PURE__*/ jsx(OverlayPortal, {
             children: /*#__PURE__*/ jsx(toast_Toaster, {
                 ref: ref,
-                className: cn('z-70 max-[40rem]:w-full', className),
+                className: cn('max-[40rem]:w-full', className),
                 ...props,
                 "data-slot": "toast-toaster",
                 children: props.children ?? ((toast)=>/*#__PURE__*/ jsx(DefaultToast, {
@@ -38,7 +38,7 @@ function DefaultToast({ toast }) {
 const Toast_ToastRoot = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(Toast.Root, {
         ref: ref,
-        className: cn('group/toast pointer-events-auto [z-index:var(--z-index)] box-border grid [height:var(--height)] min-h-0 w-80 max-w-[calc(100vw-2rem)] min-w-0 [translate:var(--x)_var(--y)] [scale:var(--scale)] items-start gap-1 rounded-lg border border-border bg-card bg-clip-padding p-4 pe-11 text-card-foreground [opacity:var(--opacity)] shadow-lg transition-[translate,scale,opacity,height,box-shadow] duration-350 ease-[cubic-bezier(0.21,1.02,0.73,1)] [will-change:translate,opacity,scale] data-[state=closed]:ease-[cubic-bezier(0.06,0.71,0.55,1)] data-[state=closed]:[transition:translate_350ms,scale_350ms,opacity_200ms] data-[type=error]:border-destructive/35 data-[type=error]:bg-destructive/9 data-[type=error]:text-foreground data-[type=success]:border-success/34 data-[type=success]:bg-success/10 data-[type=success]:text-foreground data-[type=warning]:border-warning/38 data-[type=warning]:bg-warning/13 data-[type=warning]:text-foreground motion-reduce:transition-none max-[40rem]:inset-x-0 max-[40rem]:w-[calc(100%_-_(var(--gap)*2))] max-[40rem]:max-w-none', className),
+        className: cn('group/toast pointer-events-auto [z-index:var(--z-index)] box-border grid [height:var(--height)] min-h-0 w-80 max-w-[calc(100vw-2rem)] min-w-0 [translate:var(--x)_var(--y)] [scale:var(--scale)] items-start gap-1 rounded-lg border border-border bg-card bg-clip-padding p-4 pe-11 text-card-foreground [opacity:var(--opacity)] shadow-lg transition-[translate,scale,opacity,height,box-shadow] duration-350 ease-[cubic-bezier(0.21,1.02,0.73,1)] [will-change:translate,opacity,scale] data-[state=closed]:[transition:translate_350ms_cubic-bezier(0.06,0.71,0.55,1),scale_350ms_cubic-bezier(0.06,0.71,0.55,1),opacity_200ms_cubic-bezier(0.06,0.71,0.55,1)] data-[type=error]:border-destructive/35 data-[type=error]:bg-destructive/9 data-[type=error]:text-foreground data-[type=success]:border-success/34 data-[type=success]:bg-success/10 data-[type=success]:text-foreground data-[type=warning]:border-warning/38 data-[type=warning]:bg-warning/13 data-[type=warning]:text-foreground motion-reduce:transition-none motion-reduce:data-[state=closed]:[transition:none] max-[40rem]:inset-x-0 max-[40rem]:w-[calc(100%_-_(var(--gap)*2))] max-[40rem]:max-w-none', className),
         ...props,
         "data-slot": "toast-root"
     });

package/dist/components/toc/Toc.js

@@ -23,12 +23,14 @@ const Toc_TocRoot = /*#__PURE__*/ forwardRef(function({ autoScroll = false, clas
     });
 });
 const Toc_TocRootProvider = /*#__PURE__*/ forwardRef(function({ className, style, value, ...props }, ref) {
+    const rootProps = value.getRootProps();
     return /*#__PURE__*/ jsx(Toc.RootProvider, {
         ref: ref,
         value: value,
+        ...rootProps,
         className: cn('group/toc box-border grid w-full min-w-0 grid-cols-[minmax(0,1fr)_minmax(12rem,16rem)] gap-6 text-foreground has-[[data-slot=toc-nav][data-placement=left]]:grid-cols-[minmax(12rem,16rem)_minmax(0,1fr)] max-md:grid-cols-[minmax(0,1fr)] max-md:has-[[data-slot=toc-nav][data-placement=left]]:grid-cols-[minmax(0,1fr)]', className),
         style: {
-            ...value.getRootProps().style,
+            ...rootProps.style,
             ...style
         },
         ...props,
@@ -78,7 +80,7 @@ const Toc_TocItem = /*#__PURE__*/ forwardRef(function({ className, ...props }, r
 const Toc_TocLink = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(Toc.Link, {
         ref: ref,
-        className: cn('group/toc-link relative block min-w-0 overflow-hidden rounded-sm py-1 ps-[calc(0.875rem+max(0px,((var(--depth)-2)*0.5rem)))] pe-1 text-sm leading-5 text-ellipsis whitespace-nowrap text-muted-foreground no-underline outline-0 transition-colors duration-200 ring-inset focus-visible:ring-1 focus-visible:ring-ring has-[[data-slot=toc-rail]]:overflow-visible data-active:font-medium data-active:text-foreground motion-reduce:transition-none [@media(hover:hover)]:hover:text-foreground', className),
+        className: cn('group/toc-link relative block min-w-0 overflow-hidden rounded-sm py-1 ps-[calc(0.875rem+max(0px,((var(--depth)-2)*0.5rem)))] pe-1 text-sm leading-5 text-ellipsis whitespace-nowrap text-muted-foreground no-underline outline-0 transition-colors duration-200 focus-visible:ring-1 focus-visible:ring-ring has-[[data-slot=toc-rail]]:overflow-visible data-active:font-medium data-active:text-foreground motion-reduce:transition-none [@media(hover:hover)]:hover:text-foreground', className),
         ...props,
         "data-slot": "toc-link"
     });

package/dist/components/toggle/Toggle.d.ts

@@ -6,10 +6,14 @@ type ToggleRootProps = ComponentProps<typeof TogglePrimitive.Root> & {
     variant?: ToggleVariant;
     size?: ToggleSize;
 };
+declare const toggleVariants: (props?: ({
+    variant?: "default" | "ghost" | "outline" | null | undefined;
+    size?: "icon-lg" | "icon-md" | "icon-sm" | "lg" | "md" | "sm" | "xs" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
 declare const Toggle: import("react").ForwardRefExoticComponent<Omit<ToggleRootProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>> & {
     Root: import("react").ForwardRefExoticComponent<Omit<ToggleRootProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
     Indicator: import("react").ForwardRefExoticComponent<Omit<TogglePrimitive.IndicatorProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
     Context: (props: TogglePrimitive.ContextProps) => import("react").ReactNode;
 };
-export { Toggle, useToggleContext };
+export { Toggle, toggleVariants, useToggleContext };
 export type { ToggleRootProps, ToggleSize, ToggleVariant };

package/dist/components/toggle/Toggle.js

@@ -4,7 +4,7 @@ import { Toggle, ToggleContext, useToggleContext } from "@ark-ui/react/toggle";
 import { cva } from "class-variance-authority";
 import { forwardRef } from "react";
 import { cn } from "../../internal/cn.js";
-const toggleVariants = cva('box-border inline-flex min-h-control-md cursor-pointer items-center justify-center gap-2 rounded-md border text-sm font-medium appearance-none transition-[background-color,border-color,color,opacity] duration-200 ease-in-out select-none whitespace-nowrap focus-visible:outline-2 focus-visible:-outline-offset-1 focus-visible:outline-ring data-disabled:pointer-events-none data-disabled:cursor-default data-disabled:opacity-50 motion-reduce:transition-none data-[state=off]:active:bg-accent [@media(hover:hover)]:data-[state=off]:hover:bg-accent [&>svg]:block [&>svg]:size-4 [&>svg]:shrink-0', {
+const toggleVariants = cva('box-border inline-flex cursor-pointer items-center justify-center gap-2 rounded-md border text-sm font-medium appearance-none transition-[background-color,border-color,color,opacity] duration-200 ease-in-out select-none whitespace-nowrap focus-visible:outline-2 focus-visible:-outline-offset-1 focus-visible:outline-ring data-disabled:pointer-events-none data-disabled:cursor-default data-disabled:opacity-50 motion-reduce:transition-none data-[state=off]:active:bg-accent [@media(hover:hover)]:data-[state=off]:hover:bg-accent [&>svg]:block [&>svg]:size-4 [&>svg]:shrink-0', {
     variants: {
         variant: {
             default: 'border-secondary bg-secondary text-secondary-foreground data-[state=on]:border-primary data-[state=on]:bg-primary data-[state=on]:text-primary-foreground',
@@ -29,13 +29,13 @@ const toggleVariants = cva('box-border inline-flex min-h-control-md cursor-point
 const Toggle_ToggleRoot = /*#__PURE__*/ forwardRef(function({ className, variant = 'default', size = 'md', ...props }, ref) {
     return /*#__PURE__*/ jsx(Toggle.Root, {
         ref: ref,
-        "data-variant": variant,
-        "data-size": size,
         className: cn(toggleVariants({
             variant,
             size
         }), className),
         ...props,
+        "data-variant": variant,
+        "data-size": size,
         "data-slot": "toggle-root"
     });
 });
@@ -52,4 +52,4 @@ const Toggle_Toggle = Object.assign(Toggle_ToggleRoot, {
     Indicator: Toggle_ToggleIndicator,
     Context: ToggleContext
 });
-export { Toggle_Toggle as Toggle, useToggleContext };
+export { Toggle_Toggle as Toggle, toggleVariants, useToggleContext };

package/dist/components/toggle-group/ToggleGroup.d.ts

@@ -1,7 +1,6 @@
 import { ToggleGroup as ToggleGroupPrimitive, useToggleGroup, useToggleGroupContext } from '@ark-ui/react/toggle-group';
 import type { ComponentProps } from 'react';
-type ToggleVariant = 'default' | 'outline' | 'ghost';
-type ToggleSize = 'xs' | 'sm' | 'md' | 'lg' | 'icon-sm' | 'icon-md' | 'icon-lg';
+import type { ToggleSize, ToggleVariant } from '../toggle/Toggle.js';
 type ToggleGroupRootProps = ComponentProps<typeof ToggleGroupPrimitive.Root> & {
     variant?: ToggleVariant;
     size?: ToggleSize;

package/dist/components/toggle-group/ToggleGroup.js

@@ -4,12 +4,13 @@ import { ToggleGroup, useToggleGroup, useToggleGroupContext } from "@ark-ui/reac
 import { cva } from "class-variance-authority";
 import { createContext, forwardRef, useContext } from "react";
 import { cn } from "../../internal/cn.js";
+import { toggleVariants } from "../toggle/Toggle.js";
 const defaultToggleGroupStyles = {
     variant: 'default',
     size: 'md'
 };
 const ToggleGroupStyleContext = /*#__PURE__*/ createContext(defaultToggleGroupStyles);
-const toggleGroupRootVariants = cva('group/toggle-group inline-flex max-w-full items-center gap-px overflow-x-auto rounded-lg border border-border bg-muted p-0.5 text-foreground [overscroll-behavior-inline:contain] [scrollbar-width:none] data-[orientation=vertical]:flex-col data-[orientation=vertical]:items-stretch [&::-webkit-scrollbar]:hidden', {
+const toggleGroupRootVariants = cva('group/toggle-group inline-flex max-w-full items-center gap-px overflow-x-auto overscroll-x-contain rounded-lg border border-border bg-muted p-0.5 text-foreground [scrollbar-width:none] data-[orientation=vertical]:flex-col data-[orientation=vertical]:items-stretch [&::-webkit-scrollbar]:hidden', {
     variants: {
         variant: {
             default: '',
@@ -21,28 +22,6 @@ const toggleGroupRootVariants = cva('group/toggle-group inline-flex max-w-full i
         variant: 'default'
     }
 });
-const toggleGroupItemVariants = cva('box-border inline-flex min-h-control-md flex-none cursor-pointer items-center justify-center gap-2 rounded-md border text-sm font-medium appearance-none transition-[background-color,border-color,color,opacity] duration-200 ease-in-out select-none whitespace-nowrap focus-visible:outline-2 focus-visible:-outline-offset-1 focus-visible:outline-ring group-data-[orientation=vertical]/toggle-group:w-full group-data-[orientation=vertical]/toggle-group:justify-start data-disabled:pointer-events-none data-disabled:cursor-default data-disabled:opacity-50 motion-reduce:transition-none data-[state=off]:active:bg-accent [@media(hover:hover)]:data-[state=off]:hover:bg-accent [&>svg]:block [&>svg]:size-4 [&>svg]:shrink-0', {
-    variants: {
-        variant: {
-            default: 'border-secondary bg-secondary text-secondary-foreground data-[state=on]:border-primary data-[state=on]:bg-primary data-[state=on]:text-primary-foreground',
-            outline: 'border-border bg-background text-foreground data-[state=on]:border-primary data-[state=on]:bg-primary data-[state=on]:text-primary-foreground',
-            ghost: 'border-transparent bg-transparent text-foreground data-[state=on]:bg-accent data-[state=on]:text-foreground'
-        },
-        size: {
-            xs: 'min-h-control-xs px-2.5 py-0.5 text-xs',
-            sm: 'min-h-control-sm px-3 py-1',
-            md: 'min-h-control-md px-4 py-1',
-            lg: 'min-h-control-lg px-5 py-1.5 text-md',
-            'icon-sm': 'size-control-sm min-w-control-sm gap-0 p-0',
-            'icon-md': 'size-control-md min-w-control-md gap-0 p-0',
-            'icon-lg': 'size-control-lg min-w-control-lg gap-0 p-0'
-        }
-    },
-    defaultVariants: {
-        variant: 'default',
-        size: 'md'
-    }
-});
 const ToggleGroup_ToggleGroupRoot = /*#__PURE__*/ forwardRef(function({ className, variant = 'default', size = 'md', ...props }, ref) {
     return /*#__PURE__*/ jsx(ToggleGroupStyleContext.Provider, {
         value: {
@@ -87,10 +66,10 @@ const ToggleGroup_ToggleGroupItem = /*#__PURE__*/ forwardRef(function({ classNam
         "data-slot": "toggle-group-item",
         "data-variant": variant ?? inherited.variant,
         "data-size": size ?? inherited.size,
-        className: cn(toggleGroupItemVariants({
+        className: cn(toggleVariants({
             variant: variant ?? inherited.variant,
             size: size ?? inherited.size
-        }), className)
+        }), 'flex-none text-foreground group-data-[orientation=vertical]/toggle-group:w-full group-data-[orientation=vertical]/toggle-group:justify-start', className)
     });
 });
 const ToggleGroup_ToggleGroup = Object.assign(ToggleGroup_ToggleGroupRoot, {

package/dist/components/tooltip/Tooltip.d.ts

@@ -18,3 +18,4 @@ declare const Tooltip: typeof TooltipRoot & {
     ArrowTip: import("react").ForwardRefExoticComponent<Omit<TooltipPrimitive.ArrowTipProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
 };
 export { Tooltip, useTooltip, useTooltipContext };
+export type { TooltipRootProps, TooltipRootProviderProps };

package/dist/components/tooltip/Tooltip.js

@@ -51,7 +51,7 @@ const Tooltip_TooltipPositioner = /*#__PURE__*/ forwardRef(function({ className,
     return /*#__PURE__*/ jsx(OverlayPortal, {
         children: /*#__PURE__*/ jsx(Tooltip.Positioner, {
             ref: ref,
-            className: cn('z-[var(--z-index)] max-h-[var(--available-height)] max-w-[var(--available-width)] outline-0', className),
+            className: cn('z-[var(--z-index,var(--moduix-z-popup))] max-h-[var(--available-height)] max-w-[var(--available-width)] outline-0', className),
             ...props,
             "data-slot": "tooltip-positioner"
         })
@@ -76,7 +76,7 @@ const Tooltip_TooltipBody = /*#__PURE__*/ forwardRef(function(props, ref) {
 const Tooltip_TooltipArrow = /*#__PURE__*/ forwardRef(function({ className, children, ...props }, ref) {
     return /*#__PURE__*/ jsx(Tooltip.Arrow, {
         ref: ref,
-        className: cn('[--arrow-background:var(--color-popover)] [--arrow-size:0.625rem]', className),
+        className: cn('[--arrow-background:var(--color-popover)] [--arrow-size:var(--spacing-2_5)]', className),
         ...props,
         "data-slot": "tooltip-arrow",
         children: children ?? /*#__PURE__*/ jsx(Tooltip_TooltipArrowTip, {})

package/dist/components/tour/Tour.d.ts

@@ -2,6 +2,7 @@ import { Tour as TourPrimitive, useTour, useTourContext, waitForElement, waitFor
 import type { ComponentProps } from 'react';
 import { type OverlayPortalProps } from '../../internal/overlayPortal.js';
 type TourRootProps = ComponentProps<typeof TourPrimitive.Root> & OverlayPortalProps;
+type TourCloseIconProps = Omit<ComponentProps<typeof TourPrimitive.CloseTrigger>, 'asChild'>;
 declare function TourRoot({ lazyMount, portalled, portalRef, unmountOnExit, ...props }: TourRootProps): import("react").JSX.Element;
 declare function TourActionList({ className }: {
     className?: string;
@@ -20,10 +21,11 @@ declare const Tour: typeof TourRoot & {
     ProgressText: import("react").ForwardRefExoticComponent<Omit<TourPrimitive.ProgressTextProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
     Body: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLDivElement>>;
     CloseTrigger: import("react").ForwardRefExoticComponent<Omit<TourPrimitive.CloseTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
-    CloseIcon: import("react").ForwardRefExoticComponent<Omit<Omit<TourPrimitive.CloseTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "asChild">, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    CloseIcon: import("react").ForwardRefExoticComponent<Omit<TourCloseIconProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
     Control: import("react").ForwardRefExoticComponent<Omit<TourPrimitive.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
     Actions: (props: TourPrimitive.ActionsProps) => import("react").ReactNode;
     ActionList: typeof TourActionList;
     ActionTrigger: import("react").ForwardRefExoticComponent<Omit<TourPrimitive.ActionTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
 };
 export { Tour, useTour, useTourContext, waitForElement, waitForElementValue, waitForEvent, waitForPromise, };
+export type { TourCloseIconProps, TourRootProps };

package/dist/components/tour/Tour.js

@@ -32,7 +32,7 @@ const Tour_TourSpotlight = /*#__PURE__*/ forwardRef(function({ className, ...pro
     return /*#__PURE__*/ jsx(OverlayPortal, {
         children: /*#__PURE__*/ jsx(Tour.Spotlight, {
             ref: ref,
-            className: cn('z-[calc(50+var(--tour-layer,0))] ring-2 ring-ring', className),
+            className: cn('z-[calc(50+var(--tour-layer,0)+var(--layer-index,0))] ring-2 ring-ring', className),
             ...props,
             "data-slot": "tour-spotlight"
         })

package/dist/components/tour/index.d.ts

@@ -1 +1,2 @@
 export { Tour, useTour, useTourContext, waitForElement, waitForElementValue, waitForEvent, waitForPromise, } from './Tour.js';
+export type { TourCloseIconProps, TourRootProps } from './Tour.js';

package/dist/components/tree-view/TreeView.d.ts

@@ -1,6 +1,6 @@
 import { TreeView as TreeViewPrimitive, createFileTreeCollection, createTreeCollection, type TreeNode, type TreeViewLoadChildrenDetails, type TreeViewNodeProviderProps, type TreeViewNodeState, type TreeViewRootComponent, type TreeViewRootProviderComponent, useTreeView, useTreeViewContext, useTreeViewNodeContext } from '@ark-ui/react/tree-view';
 import type { ComponentProps, ReactNode } from 'react';
-declare function TreeViewNodeCheckboxIndicator({ className, children, indeterminate, ...props }: ComponentProps<typeof TreeViewPrimitive.NodeCheckboxIndicator>): import("react").JSX.Element;
+declare function TreeViewNodeCheckboxIndicator({ className, children, indeterminate, fallback, ...props }: ComponentProps<typeof TreeViewPrimitive.NodeCheckboxIndicator>): import("react").JSX.Element;
 type TreeViewNodeRenderProps<T extends TreeNode> = {
     indexPath: number[];
     node: T;

package/dist/components/tree-view/TreeView.js

@@ -1,9 +1,11 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
 import { TreeView, createFileTreeCollection, createTreeCollection, useTreeView, useTreeViewContext, useTreeViewNodeContext } from "@ark-ui/react/tree-view";
+import { cva } from "class-variance-authority";
 import { forwardRef } from "react";
 import { cn } from "../../internal/cn.js";
 import { CheckIcon, ChevronRightIcon, IndeterminateIcon } from "../../internal/icons/ui/index.js";
+const treeViewRowVariants = cva("relative z-0 box-border flex min-h-8 w-full min-w-0 cursor-pointer items-center gap-2 rounded-sm bg-transparent py-1 pe-2 text-start text-foreground no-underline transition-[color,opacity] duration-200 ease-in-out outline-none select-none [font:inherit] before:pointer-events-none before:absolute before:inset-y-0 before:start-[calc(0.5rem+((var(--depth,1)-1)*1rem))] before:end-0 before:-z-1 before:rounded-sm before:bg-transparent before:ring-1 before:ring-transparent before:transition-[background-color,box-shadow] before:duration-200 before:ease-in-out before:content-[''] before:ring-inset focus-visible:before:ring-ring data-disabled:cursor-default data-disabled:text-muted-foreground data-disabled:opacity-50 data-focus:before:ring-ring data-selected:text-accent-foreground data-selected:before:bg-accent motion-reduce:before:transition-none [@media(hover:hover)]:[&:not([data-disabled]):hover]:text-accent-foreground [@media(hover:hover)]:[&:not([data-disabled]):hover]:before:bg-accent");
 const TreeView_TreeViewRoot = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(TreeView.Root, {
         ref: ref,
@@ -47,7 +49,7 @@ const TreeView_TreeViewBranch = /*#__PURE__*/ forwardRef(function({ className, .
 const TreeView_TreeViewBranchControl = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(TreeView.BranchControl, {
         ref: ref,
-        className: cn("relative z-0 box-border flex min-h-8 w-full min-w-0 cursor-pointer items-center gap-2 rounded-sm bg-transparent py-1 ps-[calc(0.5rem+((var(--depth,1)-1)*1rem))] pe-2 text-start text-foreground no-underline transition-[color,opacity] duration-200 ease-in-out outline-none select-none [font:inherit] before:pointer-events-none before:absolute before:inset-y-0 before:start-[calc(0.5rem+((var(--depth,1)-1)*1rem))] before:end-0 before:-z-1 before:rounded-sm before:bg-transparent before:ring-1 before:ring-transparent before:transition-[background-color,box-shadow] before:duration-200 before:ease-in-out before:content-[''] before:ring-inset focus-visible:before:ring-ring data-disabled:cursor-default data-disabled:text-muted-foreground data-disabled:opacity-50 data-focus:before:ring-ring data-selected:text-accent-foreground data-selected:before:bg-accent motion-reduce:before:transition-none [@media(hover:hover)]:[&:not([data-disabled]):hover]:text-accent-foreground [@media(hover:hover)]:[&:not([data-disabled]):hover]:before:bg-accent", className),
+        className: cn(treeViewRowVariants(), 'ps-[calc(0.5rem+((var(--depth,1)-1)*1rem))]', className),
         ...props,
         "data-slot": "tree-view-branch-control"
     });
@@ -97,7 +99,7 @@ const TreeView_TreeViewBranchIndentGuide = /*#__PURE__*/ forwardRef(function({ c
 const TreeView_TreeViewItem = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(TreeView.Item, {
         ref: ref,
-        className: cn("relative z-0 box-border flex min-h-8 w-full min-w-0 cursor-pointer items-center gap-2 rounded-sm bg-transparent py-1 ps-[calc(1rem+((var(--depth,1)-1)*1rem))] pe-2 text-start text-foreground no-underline transition-[color,opacity] duration-200 ease-in-out outline-none select-none [font:inherit] before:pointer-events-none before:absolute before:inset-y-0 before:start-[calc(0.5rem+((var(--depth,1)-1)*1rem))] before:end-0 before:-z-1 before:rounded-sm before:bg-transparent before:ring-1 before:ring-transparent before:transition-[background-color,box-shadow] before:duration-200 before:ease-in-out before:content-[''] before:ring-inset focus-visible:before:ring-ring data-disabled:cursor-default data-disabled:text-muted-foreground data-disabled:opacity-50 data-focus:before:ring-ring data-selected:text-accent-foreground data-selected:before:bg-accent motion-reduce:before:transition-none [@media(hover:hover)]:[&:not([data-disabled]):hover]:text-accent-foreground [@media(hover:hover)]:[&:not([data-disabled]):hover]:before:bg-accent", className),
+        className: cn(treeViewRowVariants(), 'ps-[calc(1rem+((var(--depth,1)-1)*1rem))]', className),
         ...props,
         "data-slot": "tree-view-item"
     });
@@ -127,13 +129,16 @@ const TreeView_TreeViewNodeCheckbox = /*#__PURE__*/ forwardRef(function({ classN
         "data-slot": "tree-view-node-checkbox"
     });
 });
-function TreeViewNodeCheckboxIndicator({ className, children, indeterminate, ...props }) {
-    return /*#__PURE__*/ jsx(TreeView.NodeCheckboxIndicator, {
+function TreeViewNodeCheckboxIndicator({ className, children, indeterminate, fallback, ...props }) {
+    return /*#__PURE__*/ jsx("span", {
         className: cn('inline-flex items-center justify-center', className),
-        indeterminate: indeterminate ?? /*#__PURE__*/ jsx(IndeterminateIcon, {}),
         ...props,
         "data-slot": "tree-view-node-checkbox-indicator",
-        children: children ?? /*#__PURE__*/ jsx(CheckIcon, {})
+        children: /*#__PURE__*/ jsx(TreeView.NodeCheckboxIndicator, {
+            fallback: fallback,
+            indeterminate: indeterminate ?? /*#__PURE__*/ jsx(IndeterminateIcon, {}),
+            children: children ?? /*#__PURE__*/ jsx(CheckIcon, {})
+        })
     });
 }
 const TreeView_TreeViewNodeRenameInput = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {

package/dist/components/typeset/Typeset_module.css

@@ -104,8 +104,9 @@
   }
 
   .root-DaHOOi :not(:where(.not-typeset, [data-not-typeset], .not-typeset *, [data-not-typeset] *)):where(a:focus-visible) {
-    outline: 2px solid var(--moduix-color-ring, currentColor);
-    outline-offset: 2px;
+    outline: var(--moduix-focus-ring-width, var(--moduix-border-width-md)) solid
+        var(--moduix-color-ring, currentColor);
+    outline-offset: var(--moduix-focus-ring-offset, var(--moduix-spacing-0-5));
     border-radius: .125em;
   }
 
@@ -118,9 +119,10 @@
   }
 
   .root-DaHOOi :not(:where(.not-typeset, [data-not-typeset], .not-typeset *, [data-not-typeset] *)):where(mark) {
+    background-color: color-mix(in oklab,
+        var(--moduix-color-warning, currentColor) 40%,
+        transparent);
     color: inherit;
-    background-color: #f4ce2366;
-    background-color: lab(84.3279% 2.77337 79.232 / .4);
     border-radius: .2em;
     padding: .05em .15em;
   }

package/dist/styles/animations.css

@@ -81,6 +81,16 @@
   }
 }
 
+@keyframes moduix-progress-circular-indeterminate {
+  from {
+    transform: rotate(-90deg);
+  }
+
+  to {
+    transform: rotate(270deg);
+  }
+}
+
 @keyframes moduix-progress-linear-indeterminate {
   from {
     transform: translateX(-100%);