@moduix/solid-tailwind 1.1.1 → 2.0.0

package/dist/components/json-tree-view/JsonTreeView.js

@@ -3,6 +3,7 @@ import { JsonTreeView, useJsonTreeView } from "@ark-ui/solid/json-tree-view";
 import { splitProps } from "solid-js";
 import { cn } from "../../internal/cn.js";
 import { ChevronRightIcon } from "../../internal/icons/ui/Icons.js";
+const rootClassName = "box-border flex w-full min-w-0 flex-col font-mono text-xs leading-4 text-foreground data-disabled:opacity-50 [&_[data-kind='brace']]:font-medium [&_[data-kind='brace']]:text-muted-foreground [&_[data-kind='colon']]:text-muted-foreground [&_[data-kind='constructor']]:font-medium [&_[data-kind='constructor']]:text-muted-foreground [&_[data-kind='error-stack']]:text-destructive [&_[data-kind='function-body']]:text-[color-mix(in_oklab,var(--color-chart-5)_72%,var(--color-foreground))] [&_[data-kind='function-body']]:italic [&_[data-kind='function-type']]:text-[color-mix(in_oklab,var(--color-chart-5)_72%,var(--color-foreground))] [&_[data-kind='function-type']]:italic [&_[data-kind='key']]:font-medium [&_[data-kind='key']]:text-[color-mix(in_oklab,var(--color-chart-1)_72%,var(--color-foreground))] [&_[data-kind='operator']]:text-destructive [&_[data-kind='preview'][data-type='bigint']]:text-[color-mix(in_oklab,var(--color-chart-3)_78%,var(--color-foreground))] [&_[data-kind='preview'][data-type='boolean']]:font-medium [&_[data-kind='preview'][data-type='boolean']]:text-[color-mix(in_oklab,var(--color-chart-4)_74%,var(--color-foreground))] [&_[data-kind='preview'][data-type='error']]:text-destructive [&_[data-kind='preview'][data-type='function']]:text-[color-mix(in_oklab,var(--color-chart-5)_72%,var(--color-foreground))] [&_[data-kind='preview'][data-type='null']]:font-medium [&_[data-kind='preview'][data-type='null']]:text-muted-foreground [&_[data-kind='preview'][data-type='null']]:italic [&_[data-kind='preview'][data-type='number']]:text-[color-mix(in_oklab,var(--color-chart-3)_78%,var(--color-foreground))] [&_[data-kind='preview'][data-type='string']]:text-[color-mix(in_oklab,var(--color-success)_78%,var(--color-foreground))] [&_[data-kind='preview'][data-type='undefined']]:font-medium [&_[data-kind='preview'][data-type='undefined']]:text-muted-foreground [&_[data-kind='preview'][data-type='undefined']]:italic [&_[data-kind='preview-text']]:text-muted-foreground [&_[data-scope='json-tree-view'][data-part='branch']]:flex [&_[data-scope='json-tree-view'][data-part='branch']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch']]:flex-col [&_[data-scope='json-tree-view'][data-part='branch']]:gap-1 [&_[data-scope='json-tree-view'][data-part='branch-content']]:flex [&_[data-scope='json-tree-view'][data-part='branch-content']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch-content']]:flex-col [&_[data-scope='json-tree-view'][data-part='branch-content']]:gap-1 [&_[data-scope='json-tree-view'][data-part='branch-content']]:overflow-hidden [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:relative [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:z-0 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:box-border [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:flex [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:min-h-5 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:w-full [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:cursor-pointer [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:items-center [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:gap-0.5 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:rounded-xs [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:bg-transparent [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:py-0.5 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:ps-[calc(0.5rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:pe-1 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:text-start [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:text-inherit [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:transition-[color,opacity] [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:duration-200 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:ease-in-out [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:outline-none [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:select-none [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:[font:inherit] [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:pointer-events-none [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:absolute [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:inset-y-0 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:start-[calc(0.25rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:end-0 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:-z-1 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:rounded-[inherit] [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:bg-transparent [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:ring-1 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:ring-transparent [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:transition-[background-color,box-shadow] [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:duration-200 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:ease-in-out [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:content-[''] [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:ring-inset motion-reduce:[&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:transition-none motion-reduce:[&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:transition-none [&_[data-scope='json-tree-view'][data-part='branch-control']:focus-visible,&_[data-scope='json-tree-view'][data-part='item']:focus-visible]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='branch-control'][data-disabled],&_[data-scope='json-tree-view'][data-part='item'][data-disabled]]:cursor-default [&_[data-scope='json-tree-view'][data-part='branch-control'][data-disabled],&_[data-scope='json-tree-view'][data-part='item'][data-disabled]]:text-muted-foreground [&_[data-scope='json-tree-view'][data-part='branch-control'][data-focus],&_[data-scope='json-tree-view'][data-part='item'][data-focus]]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='branch-control'][data-selected],&_[data-scope='json-tree-view'][data-part='item'][data-selected]]:before:bg-[color-mix(in_oklab,var(--color-accent)_72%,var(--color-background))] [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:inline-flex [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:size-3 [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:shrink-0 [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:items-center [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:justify-center [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:text-[color-mix(in_oklab,var(--color-muted-foreground)_42%,var(--color-foreground))] [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:transition-transform [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:duration-200 [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:ease-in-out motion-reduce:[&_[data-scope='json-tree-view'][data-part='branch-indicator']]:transition-none [&_[data-scope='json-tree-view'][data-part='branch-indicator']_svg]:size-3 [&_[data-scope='json-tree-view'][data-part='branch-indicator'][data-state='open']]:rotate-90 [&_[data-scope='json-tree-view'][data-part='branch-text']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch-text']]:wrap-anywhere [&_[data-scope='json-tree-view'][data-part='item-text']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='item-text']]:wrap-anywhere [@media(hover:hover)]:[&_[data-scope='json-tree-view'][data-part='branch-control']:not([data-disabled]):hover,&_[data-scope='json-tree-view'][data-part='item']:not([data-disabled]):hover]:before:bg-[color-mix(in_oklab,var(--color-accent)_72%,var(--color-background))]";
 function JsonTreeViewRoot(props) {
     const [local, others] = splitProps(props, [
         'asChild',
@@ -16,7 +17,7 @@ function JsonTreeViewRoot(props) {
     }, others, {
         "data-slot": "json-tree-view-root",
         get ["class"] () {
-            return cn("box-border flex w-full min-w-0 flex-col font-mono text-xs leading-4 text-foreground data-disabled:opacity-50 [&_[data-kind='brace']]:font-medium [&_[data-kind='brace']]:text-muted-foreground [&_[data-kind='colon']]:text-muted-foreground [&_[data-kind='constructor']]:font-medium [&_[data-kind='constructor']]:text-muted-foreground [&_[data-kind='error-stack']]:text-destructive [&_[data-kind='function-body']]:text-[color-mix(in_oklab,theme(--color-chart-5)_72%,theme(--color-foreground))] [&_[data-kind='function-body']]:italic [&_[data-kind='function-type']]:text-[color-mix(in_oklab,theme(--color-chart-5)_72%,theme(--color-foreground))] [&_[data-kind='function-type']]:italic [&_[data-kind='key']]:font-medium [&_[data-kind='key']]:text-[color-mix(in_oklab,theme(--color-chart-1)_72%,theme(--color-foreground))] [&_[data-kind='operator']]:text-destructive [&_[data-kind='preview'][data-type='bigint']]:text-[color-mix(in_oklab,theme(--color-chart-3)_78%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='boolean']]:font-medium [&_[data-kind='preview'][data-type='boolean']]:text-[color-mix(in_oklab,theme(--color-chart-4)_74%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='error']]:text-destructive [&_[data-kind='preview'][data-type='function']]:text-[color-mix(in_oklab,theme(--color-chart-5)_72%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='null']]:font-medium [&_[data-kind='preview'][data-type='null']]:text-muted-foreground [&_[data-kind='preview'][data-type='null']]:italic [&_[data-kind='preview'][data-type='number']]:text-[color-mix(in_oklab,theme(--color-chart-3)_78%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='string']]:text-[color-mix(in_oklab,theme(--color-success)_78%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='undefined']]:font-medium [&_[data-kind='preview'][data-type='undefined']]:text-muted-foreground [&_[data-kind='preview'][data-type='undefined']]:italic [&_[data-kind='preview-text']]:text-muted-foreground [&_[data-scope='json-tree-view'][data-part='branch']]:flex [&_[data-scope='json-tree-view'][data-part='branch']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch']]:flex-col [&_[data-scope='json-tree-view'][data-part='branch']]:gap-1 [&_[data-scope='json-tree-view'][data-part='branch-content']]:flex [&_[data-scope='json-tree-view'][data-part='branch-content']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch-content']]:flex-col [&_[data-scope='json-tree-view'][data-part='branch-content']]:gap-1 [&_[data-scope='json-tree-view'][data-part='branch-content']]:overflow-hidden [&_[data-scope='json-tree-view'][data-part='branch-control']]:relative [&_[data-scope='json-tree-view'][data-part='branch-control']]:z-0 [&_[data-scope='json-tree-view'][data-part='branch-control']]:box-border [&_[data-scope='json-tree-view'][data-part='branch-control']]:flex [&_[data-scope='json-tree-view'][data-part='branch-control']]:min-h-5 [&_[data-scope='json-tree-view'][data-part='branch-control']]:w-full [&_[data-scope='json-tree-view'][data-part='branch-control']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch-control']]:cursor-pointer [&_[data-scope='json-tree-view'][data-part='branch-control']]:items-center [&_[data-scope='json-tree-view'][data-part='branch-control']]:gap-0.5 [&_[data-scope='json-tree-view'][data-part='branch-control']]:rounded-xs [&_[data-scope='json-tree-view'][data-part='branch-control']]:bg-transparent [&_[data-scope='json-tree-view'][data-part='branch-control']]:py-0.5 [&_[data-scope='json-tree-view'][data-part='branch-control']]:ps-[calc(0.5rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='branch-control']]:pe-1 [&_[data-scope='json-tree-view'][data-part='branch-control']]:text-start [&_[data-scope='json-tree-view'][data-part='branch-control']]:text-inherit [&_[data-scope='json-tree-view'][data-part='branch-control']]:transition-[color,opacity] [&_[data-scope='json-tree-view'][data-part='branch-control']]:duration-200 [&_[data-scope='json-tree-view'][data-part='branch-control']]:ease-in-out [&_[data-scope='json-tree-view'][data-part='branch-control']]:outline-none [&_[data-scope='json-tree-view'][data-part='branch-control']]:select-none [&_[data-scope='json-tree-view'][data-part='branch-control']]:[font:inherit] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:pointer-events-none [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:absolute [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:inset-y-0 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:start-[calc(0.25rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:end-0 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:-z-1 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:rounded-[inherit] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:bg-transparent [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:ring-1 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:ring-transparent [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:transition-[background-color,box-shadow] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:duration-200 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:ease-in-out [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:content-[''] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:ring-inset motion-reduce:[&_[data-scope='json-tree-view'][data-part='branch-control']]:transition-none motion-reduce:[&_[data-scope='json-tree-view'][data-part='branch-control']]:before:transition-none [&_[data-scope='json-tree-view'][data-part='branch-control']:focus-visible]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='branch-control'][data-disabled]]:cursor-default [&_[data-scope='json-tree-view'][data-part='branch-control'][data-disabled]]:text-muted-foreground [&_[data-scope='json-tree-view'][data-part='branch-control'][data-focus]]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='branch-control'][data-selected]]:before:bg-[color-mix(in_oklab,theme(--color-accent)_72%,theme(--color-background))] [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:inline-flex [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:size-3 [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:shrink-0 [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:items-center [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:justify-center [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:text-[color-mix(in_oklab,theme(--color-muted-foreground)_42%,theme(--color-foreground))] [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:transition-transform [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:duration-200 [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:ease-in-out motion-reduce:[&_[data-scope='json-tree-view'][data-part='branch-indicator']]:transition-none [&_[data-scope='json-tree-view'][data-part='branch-indicator']_svg]:size-3 [&_[data-scope='json-tree-view'][data-part='branch-indicator'][data-state='open']]:rotate-90 [&_[data-scope='json-tree-view'][data-part='branch-text']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch-text']]:wrap-anywhere [&_[data-scope='json-tree-view'][data-part='item']]:relative [&_[data-scope='json-tree-view'][data-part='item']]:z-0 [&_[data-scope='json-tree-view'][data-part='item']]:box-border [&_[data-scope='json-tree-view'][data-part='item']]:flex [&_[data-scope='json-tree-view'][data-part='item']]:min-h-5 [&_[data-scope='json-tree-view'][data-part='item']]:w-full [&_[data-scope='json-tree-view'][data-part='item']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='item']]:cursor-pointer [&_[data-scope='json-tree-view'][data-part='item']]:items-center [&_[data-scope='json-tree-view'][data-part='item']]:gap-0.5 [&_[data-scope='json-tree-view'][data-part='item']]:rounded-xs [&_[data-scope='json-tree-view'][data-part='item']]:bg-transparent [&_[data-scope='json-tree-view'][data-part='item']]:py-0.5 [&_[data-scope='json-tree-view'][data-part='item']]:ps-[calc(0.5rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='item']]:pe-1 [&_[data-scope='json-tree-view'][data-part='item']]:text-start [&_[data-scope='json-tree-view'][data-part='item']]:text-inherit [&_[data-scope='json-tree-view'][data-part='item']]:transition-[color,opacity] [&_[data-scope='json-tree-view'][data-part='item']]:duration-200 [&_[data-scope='json-tree-view'][data-part='item']]:ease-in-out [&_[data-scope='json-tree-view'][data-part='item']]:outline-none [&_[data-scope='json-tree-view'][data-part='item']]:select-none [&_[data-scope='json-tree-view'][data-part='item']]:[font:inherit] [&_[data-scope='json-tree-view'][data-part='item']]:before:pointer-events-none [&_[data-scope='json-tree-view'][data-part='item']]:before:absolute [&_[data-scope='json-tree-view'][data-part='item']]:before:inset-y-0 [&_[data-scope='json-tree-view'][data-part='item']]:before:start-[calc(0.25rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='item']]:before:end-0 [&_[data-scope='json-tree-view'][data-part='item']]:before:-z-1 [&_[data-scope='json-tree-view'][data-part='item']]:before:rounded-[inherit] [&_[data-scope='json-tree-view'][data-part='item']]:before:bg-transparent [&_[data-scope='json-tree-view'][data-part='item']]:before:ring-1 [&_[data-scope='json-tree-view'][data-part='item']]:before:ring-transparent [&_[data-scope='json-tree-view'][data-part='item']]:before:transition-[background-color,box-shadow] [&_[data-scope='json-tree-view'][data-part='item']]:before:duration-200 [&_[data-scope='json-tree-view'][data-part='item']]:before:ease-in-out [&_[data-scope='json-tree-view'][data-part='item']]:before:content-[''] [&_[data-scope='json-tree-view'][data-part='item']]:before:ring-inset motion-reduce:[&_[data-scope='json-tree-view'][data-part='item']]:transition-none motion-reduce:[&_[data-scope='json-tree-view'][data-part='item']]:before:transition-none [&_[data-scope='json-tree-view'][data-part='item']:focus-visible]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='item'][data-disabled]]:cursor-default [&_[data-scope='json-tree-view'][data-part='item'][data-disabled]]:text-muted-foreground [&_[data-scope='json-tree-view'][data-part='item'][data-focus]]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='item'][data-selected]]:before:bg-[color-mix(in_oklab,theme(--color-accent)_72%,theme(--color-background))] [&_[data-scope='json-tree-view'][data-part='item-text']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='item-text']]:wrap-anywhere [@media(hover:hover)]:[&_[data-scope='json-tree-view'][data-part='branch-control']:not([data-disabled]):hover]:before:bg-[color-mix(in_oklab,theme(--color-accent)_72%,theme(--color-background))] [@media(hover:hover)]:[&_[data-scope='json-tree-view'][data-part='item']:not([data-disabled]):hover]:before:bg-[color-mix(in_oklab,theme(--color-accent)_72%,theme(--color-background))]", local.class);
+            return cn(rootClassName, local.class);
         },
         get children () {
             return local.children;
@@ -35,7 +36,7 @@ function JsonTreeViewRootProvider(props) {
         }
     }, others, {
         get ["class"] () {
-            return cn("box-border flex w-full min-w-0 flex-col font-mono text-xs leading-4 text-foreground data-disabled:opacity-50 [&_[data-kind='brace']]:font-medium [&_[data-kind='brace']]:text-muted-foreground [&_[data-kind='colon']]:text-muted-foreground [&_[data-kind='constructor']]:font-medium [&_[data-kind='constructor']]:text-muted-foreground [&_[data-kind='error-stack']]:text-destructive [&_[data-kind='function-body']]:text-[color-mix(in_oklab,theme(--color-chart-5)_72%,theme(--color-foreground))] [&_[data-kind='function-body']]:italic [&_[data-kind='function-type']]:text-[color-mix(in_oklab,theme(--color-chart-5)_72%,theme(--color-foreground))] [&_[data-kind='function-type']]:italic [&_[data-kind='key']]:font-medium [&_[data-kind='key']]:text-[color-mix(in_oklab,theme(--color-chart-1)_72%,theme(--color-foreground))] [&_[data-kind='operator']]:text-destructive [&_[data-kind='preview'][data-type='bigint']]:text-[color-mix(in_oklab,theme(--color-chart-3)_78%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='boolean']]:font-medium [&_[data-kind='preview'][data-type='boolean']]:text-[color-mix(in_oklab,theme(--color-chart-4)_74%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='error']]:text-destructive [&_[data-kind='preview'][data-type='function']]:text-[color-mix(in_oklab,theme(--color-chart-5)_72%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='null']]:font-medium [&_[data-kind='preview'][data-type='null']]:text-muted-foreground [&_[data-kind='preview'][data-type='null']]:italic [&_[data-kind='preview'][data-type='number']]:text-[color-mix(in_oklab,theme(--color-chart-3)_78%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='string']]:text-[color-mix(in_oklab,theme(--color-success)_78%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='undefined']]:font-medium [&_[data-kind='preview'][data-type='undefined']]:text-muted-foreground [&_[data-kind='preview'][data-type='undefined']]:italic [&_[data-kind='preview-text']]:text-muted-foreground [&_[data-scope='json-tree-view'][data-part='branch']]:flex [&_[data-scope='json-tree-view'][data-part='branch']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch']]:flex-col [&_[data-scope='json-tree-view'][data-part='branch']]:gap-1 [&_[data-scope='json-tree-view'][data-part='branch-content']]:flex [&_[data-scope='json-tree-view'][data-part='branch-content']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch-content']]:flex-col [&_[data-scope='json-tree-view'][data-part='branch-content']]:gap-1 [&_[data-scope='json-tree-view'][data-part='branch-content']]:overflow-hidden [&_[data-scope='json-tree-view'][data-part='branch-control']]:relative [&_[data-scope='json-tree-view'][data-part='branch-control']]:z-0 [&_[data-scope='json-tree-view'][data-part='branch-control']]:box-border [&_[data-scope='json-tree-view'][data-part='branch-control']]:flex [&_[data-scope='json-tree-view'][data-part='branch-control']]:min-h-5 [&_[data-scope='json-tree-view'][data-part='branch-control']]:w-full [&_[data-scope='json-tree-view'][data-part='branch-control']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch-control']]:cursor-pointer [&_[data-scope='json-tree-view'][data-part='branch-control']]:items-center [&_[data-scope='json-tree-view'][data-part='branch-control']]:gap-0.5 [&_[data-scope='json-tree-view'][data-part='branch-control']]:rounded-xs [&_[data-scope='json-tree-view'][data-part='branch-control']]:bg-transparent [&_[data-scope='json-tree-view'][data-part='branch-control']]:py-0.5 [&_[data-scope='json-tree-view'][data-part='branch-control']]:ps-[calc(0.5rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='branch-control']]:pe-1 [&_[data-scope='json-tree-view'][data-part='branch-control']]:text-start [&_[data-scope='json-tree-view'][data-part='branch-control']]:text-inherit [&_[data-scope='json-tree-view'][data-part='branch-control']]:transition-[color,opacity] [&_[data-scope='json-tree-view'][data-part='branch-control']]:duration-200 [&_[data-scope='json-tree-view'][data-part='branch-control']]:ease-in-out [&_[data-scope='json-tree-view'][data-part='branch-control']]:outline-none [&_[data-scope='json-tree-view'][data-part='branch-control']]:select-none [&_[data-scope='json-tree-view'][data-part='branch-control']]:[font:inherit] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:pointer-events-none [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:absolute [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:inset-y-0 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:start-[calc(0.25rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:end-0 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:-z-1 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:rounded-[inherit] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:bg-transparent [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:ring-1 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:ring-transparent [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:transition-[background-color,box-shadow] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:duration-200 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:ease-in-out [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:content-[''] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:ring-inset motion-reduce:[&_[data-scope='json-tree-view'][data-part='branch-control']]:transition-none motion-reduce:[&_[data-scope='json-tree-view'][data-part='branch-control']]:before:transition-none [&_[data-scope='json-tree-view'][data-part='branch-control']:focus-visible]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='branch-control'][data-disabled]]:cursor-default [&_[data-scope='json-tree-view'][data-part='branch-control'][data-disabled]]:text-muted-foreground [&_[data-scope='json-tree-view'][data-part='branch-control'][data-focus]]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='branch-control'][data-selected]]:before:bg-[color-mix(in_oklab,theme(--color-accent)_72%,theme(--color-background))] [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:inline-flex [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:size-3 [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:shrink-0 [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:items-center [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:justify-center [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:text-[color-mix(in_oklab,theme(--color-muted-foreground)_42%,theme(--color-foreground))] [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:transition-transform [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:duration-200 [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:ease-in-out motion-reduce:[&_[data-scope='json-tree-view'][data-part='branch-indicator']]:transition-none [&_[data-scope='json-tree-view'][data-part='branch-indicator']_svg]:size-3 [&_[data-scope='json-tree-view'][data-part='branch-indicator'][data-state='open']]:rotate-90 [&_[data-scope='json-tree-view'][data-part='branch-text']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch-text']]:wrap-anywhere [&_[data-scope='json-tree-view'][data-part='item']]:relative [&_[data-scope='json-tree-view'][data-part='item']]:z-0 [&_[data-scope='json-tree-view'][data-part='item']]:box-border [&_[data-scope='json-tree-view'][data-part='item']]:flex [&_[data-scope='json-tree-view'][data-part='item']]:min-h-5 [&_[data-scope='json-tree-view'][data-part='item']]:w-full [&_[data-scope='json-tree-view'][data-part='item']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='item']]:cursor-pointer [&_[data-scope='json-tree-view'][data-part='item']]:items-center [&_[data-scope='json-tree-view'][data-part='item']]:gap-0.5 [&_[data-scope='json-tree-view'][data-part='item']]:rounded-xs [&_[data-scope='json-tree-view'][data-part='item']]:bg-transparent [&_[data-scope='json-tree-view'][data-part='item']]:py-0.5 [&_[data-scope='json-tree-view'][data-part='item']]:ps-[calc(0.5rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='item']]:pe-1 [&_[data-scope='json-tree-view'][data-part='item']]:text-start [&_[data-scope='json-tree-view'][data-part='item']]:text-inherit [&_[data-scope='json-tree-view'][data-part='item']]:transition-[color,opacity] [&_[data-scope='json-tree-view'][data-part='item']]:duration-200 [&_[data-scope='json-tree-view'][data-part='item']]:ease-in-out [&_[data-scope='json-tree-view'][data-part='item']]:outline-none [&_[data-scope='json-tree-view'][data-part='item']]:select-none [&_[data-scope='json-tree-view'][data-part='item']]:[font:inherit] [&_[data-scope='json-tree-view'][data-part='item']]:before:pointer-events-none [&_[data-scope='json-tree-view'][data-part='item']]:before:absolute [&_[data-scope='json-tree-view'][data-part='item']]:before:inset-y-0 [&_[data-scope='json-tree-view'][data-part='item']]:before:start-[calc(0.25rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='item']]:before:end-0 [&_[data-scope='json-tree-view'][data-part='item']]:before:-z-1 [&_[data-scope='json-tree-view'][data-part='item']]:before:rounded-[inherit] [&_[data-scope='json-tree-view'][data-part='item']]:before:bg-transparent [&_[data-scope='json-tree-view'][data-part='item']]:before:ring-1 [&_[data-scope='json-tree-view'][data-part='item']]:before:ring-transparent [&_[data-scope='json-tree-view'][data-part='item']]:before:transition-[background-color,box-shadow] [&_[data-scope='json-tree-view'][data-part='item']]:before:duration-200 [&_[data-scope='json-tree-view'][data-part='item']]:before:ease-in-out [&_[data-scope='json-tree-view'][data-part='item']]:before:content-[''] [&_[data-scope='json-tree-view'][data-part='item']]:before:ring-inset motion-reduce:[&_[data-scope='json-tree-view'][data-part='item']]:transition-none motion-reduce:[&_[data-scope='json-tree-view'][data-part='item']]:before:transition-none [&_[data-scope='json-tree-view'][data-part='item']:focus-visible]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='item'][data-disabled]]:cursor-default [&_[data-scope='json-tree-view'][data-part='item'][data-disabled]]:text-muted-foreground [&_[data-scope='json-tree-view'][data-part='item'][data-focus]]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='item'][data-selected]]:before:bg-[color-mix(in_oklab,theme(--color-accent)_72%,theme(--color-background))] [&_[data-scope='json-tree-view'][data-part='item-text']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='item-text']]:wrap-anywhere [@media(hover:hover)]:[&_[data-scope='json-tree-view'][data-part='branch-control']:not([data-disabled]):hover]:before:bg-[color-mix(in_oklab,theme(--color-accent)_72%,theme(--color-background))] [@media(hover:hover)]:[&_[data-scope='json-tree-view'][data-part='item']:not([data-disabled]):hover]:before:bg-[color-mix(in_oklab,theme(--color-accent)_72%,theme(--color-background))]", local.class);
+            return cn(rootClassName, local.class);
         }
     }, others, {
         "data-slot": "json-tree-view-root-provider",

package/dist/components/json-tree-view/JsonTreeView.jsx

@@ -2,13 +2,14 @@ import { JsonTreeView, useJsonTreeView } from "@ark-ui/solid/json-tree-view";
 import { splitProps } from "solid-js";
 import { cn } from "../../internal/cn.jsx";
 import { ChevronRightIcon } from "../../internal/icons/ui/Icons.jsx";
+const rootClassName = "box-border flex w-full min-w-0 flex-col font-mono text-xs leading-4 text-foreground data-disabled:opacity-50 [&_[data-kind='brace']]:font-medium [&_[data-kind='brace']]:text-muted-foreground [&_[data-kind='colon']]:text-muted-foreground [&_[data-kind='constructor']]:font-medium [&_[data-kind='constructor']]:text-muted-foreground [&_[data-kind='error-stack']]:text-destructive [&_[data-kind='function-body']]:text-[color-mix(in_oklab,var(--color-chart-5)_72%,var(--color-foreground))] [&_[data-kind='function-body']]:italic [&_[data-kind='function-type']]:text-[color-mix(in_oklab,var(--color-chart-5)_72%,var(--color-foreground))] [&_[data-kind='function-type']]:italic [&_[data-kind='key']]:font-medium [&_[data-kind='key']]:text-[color-mix(in_oklab,var(--color-chart-1)_72%,var(--color-foreground))] [&_[data-kind='operator']]:text-destructive [&_[data-kind='preview'][data-type='bigint']]:text-[color-mix(in_oklab,var(--color-chart-3)_78%,var(--color-foreground))] [&_[data-kind='preview'][data-type='boolean']]:font-medium [&_[data-kind='preview'][data-type='boolean']]:text-[color-mix(in_oklab,var(--color-chart-4)_74%,var(--color-foreground))] [&_[data-kind='preview'][data-type='error']]:text-destructive [&_[data-kind='preview'][data-type='function']]:text-[color-mix(in_oklab,var(--color-chart-5)_72%,var(--color-foreground))] [&_[data-kind='preview'][data-type='null']]:font-medium [&_[data-kind='preview'][data-type='null']]:text-muted-foreground [&_[data-kind='preview'][data-type='null']]:italic [&_[data-kind='preview'][data-type='number']]:text-[color-mix(in_oklab,var(--color-chart-3)_78%,var(--color-foreground))] [&_[data-kind='preview'][data-type='string']]:text-[color-mix(in_oklab,var(--color-success)_78%,var(--color-foreground))] [&_[data-kind='preview'][data-type='undefined']]:font-medium [&_[data-kind='preview'][data-type='undefined']]:text-muted-foreground [&_[data-kind='preview'][data-type='undefined']]:italic [&_[data-kind='preview-text']]:text-muted-foreground [&_[data-scope='json-tree-view'][data-part='branch']]:flex [&_[data-scope='json-tree-view'][data-part='branch']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch']]:flex-col [&_[data-scope='json-tree-view'][data-part='branch']]:gap-1 [&_[data-scope='json-tree-view'][data-part='branch-content']]:flex [&_[data-scope='json-tree-view'][data-part='branch-content']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch-content']]:flex-col [&_[data-scope='json-tree-view'][data-part='branch-content']]:gap-1 [&_[data-scope='json-tree-view'][data-part='branch-content']]:overflow-hidden [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:relative [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:z-0 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:box-border [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:flex [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:min-h-5 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:w-full [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:cursor-pointer [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:items-center [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:gap-0.5 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:rounded-xs [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:bg-transparent [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:py-0.5 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:ps-[calc(0.5rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:pe-1 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:text-start [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:text-inherit [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:transition-[color,opacity] [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:duration-200 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:ease-in-out [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:outline-none [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:select-none [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:[font:inherit] [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:pointer-events-none [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:absolute [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:inset-y-0 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:start-[calc(0.25rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:end-0 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:-z-1 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:rounded-[inherit] [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:bg-transparent [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:ring-1 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:ring-transparent [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:transition-[background-color,box-shadow] [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:duration-200 [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:ease-in-out [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:content-[''] [&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:ring-inset motion-reduce:[&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:transition-none motion-reduce:[&_[data-scope='json-tree-view'][data-part='branch-control'],&_[data-scope='json-tree-view'][data-part='item']]:before:transition-none [&_[data-scope='json-tree-view'][data-part='branch-control']:focus-visible,&_[data-scope='json-tree-view'][data-part='item']:focus-visible]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='branch-control'][data-disabled],&_[data-scope='json-tree-view'][data-part='item'][data-disabled]]:cursor-default [&_[data-scope='json-tree-view'][data-part='branch-control'][data-disabled],&_[data-scope='json-tree-view'][data-part='item'][data-disabled]]:text-muted-foreground [&_[data-scope='json-tree-view'][data-part='branch-control'][data-focus],&_[data-scope='json-tree-view'][data-part='item'][data-focus]]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='branch-control'][data-selected],&_[data-scope='json-tree-view'][data-part='item'][data-selected]]:before:bg-[color-mix(in_oklab,var(--color-accent)_72%,var(--color-background))] [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:inline-flex [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:size-3 [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:shrink-0 [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:items-center [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:justify-center [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:text-[color-mix(in_oklab,var(--color-muted-foreground)_42%,var(--color-foreground))] [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:transition-transform [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:duration-200 [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:ease-in-out motion-reduce:[&_[data-scope='json-tree-view'][data-part='branch-indicator']]:transition-none [&_[data-scope='json-tree-view'][data-part='branch-indicator']_svg]:size-3 [&_[data-scope='json-tree-view'][data-part='branch-indicator'][data-state='open']]:rotate-90 [&_[data-scope='json-tree-view'][data-part='branch-text']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch-text']]:wrap-anywhere [&_[data-scope='json-tree-view'][data-part='item-text']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='item-text']]:wrap-anywhere [@media(hover:hover)]:[&_[data-scope='json-tree-view'][data-part='branch-control']:not([data-disabled]):hover,&_[data-scope='json-tree-view'][data-part='item']:not([data-disabled]):hover]:before:bg-[color-mix(in_oklab,var(--color-accent)_72%,var(--color-background))]";
 function JsonTreeViewRoot(props) {
     const [local, others] = splitProps(props, [
         'asChild',
         'children',
         'class'
     ]);
-    return <JsonTreeView.Root asChild={local.asChild} {...others} data-slot="json-tree-view-root" class={cn("box-border flex w-full min-w-0 flex-col font-mono text-xs leading-4 text-foreground data-disabled:opacity-50 [&_[data-kind='brace']]:font-medium [&_[data-kind='brace']]:text-muted-foreground [&_[data-kind='colon']]:text-muted-foreground [&_[data-kind='constructor']]:font-medium [&_[data-kind='constructor']]:text-muted-foreground [&_[data-kind='error-stack']]:text-destructive [&_[data-kind='function-body']]:text-[color-mix(in_oklab,theme(--color-chart-5)_72%,theme(--color-foreground))] [&_[data-kind='function-body']]:italic [&_[data-kind='function-type']]:text-[color-mix(in_oklab,theme(--color-chart-5)_72%,theme(--color-foreground))] [&_[data-kind='function-type']]:italic [&_[data-kind='key']]:font-medium [&_[data-kind='key']]:text-[color-mix(in_oklab,theme(--color-chart-1)_72%,theme(--color-foreground))] [&_[data-kind='operator']]:text-destructive [&_[data-kind='preview'][data-type='bigint']]:text-[color-mix(in_oklab,theme(--color-chart-3)_78%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='boolean']]:font-medium [&_[data-kind='preview'][data-type='boolean']]:text-[color-mix(in_oklab,theme(--color-chart-4)_74%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='error']]:text-destructive [&_[data-kind='preview'][data-type='function']]:text-[color-mix(in_oklab,theme(--color-chart-5)_72%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='null']]:font-medium [&_[data-kind='preview'][data-type='null']]:text-muted-foreground [&_[data-kind='preview'][data-type='null']]:italic [&_[data-kind='preview'][data-type='number']]:text-[color-mix(in_oklab,theme(--color-chart-3)_78%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='string']]:text-[color-mix(in_oklab,theme(--color-success)_78%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='undefined']]:font-medium [&_[data-kind='preview'][data-type='undefined']]:text-muted-foreground [&_[data-kind='preview'][data-type='undefined']]:italic [&_[data-kind='preview-text']]:text-muted-foreground [&_[data-scope='json-tree-view'][data-part='branch']]:flex [&_[data-scope='json-tree-view'][data-part='branch']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch']]:flex-col [&_[data-scope='json-tree-view'][data-part='branch']]:gap-1 [&_[data-scope='json-tree-view'][data-part='branch-content']]:flex [&_[data-scope='json-tree-view'][data-part='branch-content']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch-content']]:flex-col [&_[data-scope='json-tree-view'][data-part='branch-content']]:gap-1 [&_[data-scope='json-tree-view'][data-part='branch-content']]:overflow-hidden [&_[data-scope='json-tree-view'][data-part='branch-control']]:relative [&_[data-scope='json-tree-view'][data-part='branch-control']]:z-0 [&_[data-scope='json-tree-view'][data-part='branch-control']]:box-border [&_[data-scope='json-tree-view'][data-part='branch-control']]:flex [&_[data-scope='json-tree-view'][data-part='branch-control']]:min-h-5 [&_[data-scope='json-tree-view'][data-part='branch-control']]:w-full [&_[data-scope='json-tree-view'][data-part='branch-control']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch-control']]:cursor-pointer [&_[data-scope='json-tree-view'][data-part='branch-control']]:items-center [&_[data-scope='json-tree-view'][data-part='branch-control']]:gap-0.5 [&_[data-scope='json-tree-view'][data-part='branch-control']]:rounded-xs [&_[data-scope='json-tree-view'][data-part='branch-control']]:bg-transparent [&_[data-scope='json-tree-view'][data-part='branch-control']]:py-0.5 [&_[data-scope='json-tree-view'][data-part='branch-control']]:ps-[calc(0.5rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='branch-control']]:pe-1 [&_[data-scope='json-tree-view'][data-part='branch-control']]:text-start [&_[data-scope='json-tree-view'][data-part='branch-control']]:text-inherit [&_[data-scope='json-tree-view'][data-part='branch-control']]:transition-[color,opacity] [&_[data-scope='json-tree-view'][data-part='branch-control']]:duration-200 [&_[data-scope='json-tree-view'][data-part='branch-control']]:ease-in-out [&_[data-scope='json-tree-view'][data-part='branch-control']]:outline-none [&_[data-scope='json-tree-view'][data-part='branch-control']]:select-none [&_[data-scope='json-tree-view'][data-part='branch-control']]:[font:inherit] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:pointer-events-none [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:absolute [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:inset-y-0 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:start-[calc(0.25rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:end-0 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:-z-1 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:rounded-[inherit] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:bg-transparent [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:ring-1 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:ring-transparent [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:transition-[background-color,box-shadow] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:duration-200 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:ease-in-out [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:content-[''] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:ring-inset motion-reduce:[&_[data-scope='json-tree-view'][data-part='branch-control']]:transition-none motion-reduce:[&_[data-scope='json-tree-view'][data-part='branch-control']]:before:transition-none [&_[data-scope='json-tree-view'][data-part='branch-control']:focus-visible]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='branch-control'][data-disabled]]:cursor-default [&_[data-scope='json-tree-view'][data-part='branch-control'][data-disabled]]:text-muted-foreground [&_[data-scope='json-tree-view'][data-part='branch-control'][data-focus]]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='branch-control'][data-selected]]:before:bg-[color-mix(in_oklab,theme(--color-accent)_72%,theme(--color-background))] [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:inline-flex [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:size-3 [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:shrink-0 [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:items-center [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:justify-center [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:text-[color-mix(in_oklab,theme(--color-muted-foreground)_42%,theme(--color-foreground))] [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:transition-transform [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:duration-200 [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:ease-in-out motion-reduce:[&_[data-scope='json-tree-view'][data-part='branch-indicator']]:transition-none [&_[data-scope='json-tree-view'][data-part='branch-indicator']_svg]:size-3 [&_[data-scope='json-tree-view'][data-part='branch-indicator'][data-state='open']]:rotate-90 [&_[data-scope='json-tree-view'][data-part='branch-text']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch-text']]:wrap-anywhere [&_[data-scope='json-tree-view'][data-part='item']]:relative [&_[data-scope='json-tree-view'][data-part='item']]:z-0 [&_[data-scope='json-tree-view'][data-part='item']]:box-border [&_[data-scope='json-tree-view'][data-part='item']]:flex [&_[data-scope='json-tree-view'][data-part='item']]:min-h-5 [&_[data-scope='json-tree-view'][data-part='item']]:w-full [&_[data-scope='json-tree-view'][data-part='item']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='item']]:cursor-pointer [&_[data-scope='json-tree-view'][data-part='item']]:items-center [&_[data-scope='json-tree-view'][data-part='item']]:gap-0.5 [&_[data-scope='json-tree-view'][data-part='item']]:rounded-xs [&_[data-scope='json-tree-view'][data-part='item']]:bg-transparent [&_[data-scope='json-tree-view'][data-part='item']]:py-0.5 [&_[data-scope='json-tree-view'][data-part='item']]:ps-[calc(0.5rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='item']]:pe-1 [&_[data-scope='json-tree-view'][data-part='item']]:text-start [&_[data-scope='json-tree-view'][data-part='item']]:text-inherit [&_[data-scope='json-tree-view'][data-part='item']]:transition-[color,opacity] [&_[data-scope='json-tree-view'][data-part='item']]:duration-200 [&_[data-scope='json-tree-view'][data-part='item']]:ease-in-out [&_[data-scope='json-tree-view'][data-part='item']]:outline-none [&_[data-scope='json-tree-view'][data-part='item']]:select-none [&_[data-scope='json-tree-view'][data-part='item']]:[font:inherit] [&_[data-scope='json-tree-view'][data-part='item']]:before:pointer-events-none [&_[data-scope='json-tree-view'][data-part='item']]:before:absolute [&_[data-scope='json-tree-view'][data-part='item']]:before:inset-y-0 [&_[data-scope='json-tree-view'][data-part='item']]:before:start-[calc(0.25rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='item']]:before:end-0 [&_[data-scope='json-tree-view'][data-part='item']]:before:-z-1 [&_[data-scope='json-tree-view'][data-part='item']]:before:rounded-[inherit] [&_[data-scope='json-tree-view'][data-part='item']]:before:bg-transparent [&_[data-scope='json-tree-view'][data-part='item']]:before:ring-1 [&_[data-scope='json-tree-view'][data-part='item']]:before:ring-transparent [&_[data-scope='json-tree-view'][data-part='item']]:before:transition-[background-color,box-shadow] [&_[data-scope='json-tree-view'][data-part='item']]:before:duration-200 [&_[data-scope='json-tree-view'][data-part='item']]:before:ease-in-out [&_[data-scope='json-tree-view'][data-part='item']]:before:content-[''] [&_[data-scope='json-tree-view'][data-part='item']]:before:ring-inset motion-reduce:[&_[data-scope='json-tree-view'][data-part='item']]:transition-none motion-reduce:[&_[data-scope='json-tree-view'][data-part='item']]:before:transition-none [&_[data-scope='json-tree-view'][data-part='item']:focus-visible]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='item'][data-disabled]]:cursor-default [&_[data-scope='json-tree-view'][data-part='item'][data-disabled]]:text-muted-foreground [&_[data-scope='json-tree-view'][data-part='item'][data-focus]]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='item'][data-selected]]:before:bg-[color-mix(in_oklab,theme(--color-accent)_72%,theme(--color-background))] [&_[data-scope='json-tree-view'][data-part='item-text']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='item-text']]:wrap-anywhere [@media(hover:hover)]:[&_[data-scope='json-tree-view'][data-part='branch-control']:not([data-disabled]):hover]:before:bg-[color-mix(in_oklab,theme(--color-accent)_72%,theme(--color-background))] [@media(hover:hover)]:[&_[data-scope='json-tree-view'][data-part='item']:not([data-disabled]):hover]:before:bg-[color-mix(in_oklab,theme(--color-accent)_72%,theme(--color-background))]", local.class)}>
+    return <JsonTreeView.Root asChild={local.asChild} {...others} data-slot="json-tree-view-root" class={cn(rootClassName, local.class)}>
       {local.children}
     </JsonTreeView.Root>;
 }
@@ -18,7 +19,7 @@ function JsonTreeViewRootProvider(props) {
         'children',
         'class'
     ]);
-    return <JsonTreeView.RootProvider asChild={local.asChild} {...others} class={cn("box-border flex w-full min-w-0 flex-col font-mono text-xs leading-4 text-foreground data-disabled:opacity-50 [&_[data-kind='brace']]:font-medium [&_[data-kind='brace']]:text-muted-foreground [&_[data-kind='colon']]:text-muted-foreground [&_[data-kind='constructor']]:font-medium [&_[data-kind='constructor']]:text-muted-foreground [&_[data-kind='error-stack']]:text-destructive [&_[data-kind='function-body']]:text-[color-mix(in_oklab,theme(--color-chart-5)_72%,theme(--color-foreground))] [&_[data-kind='function-body']]:italic [&_[data-kind='function-type']]:text-[color-mix(in_oklab,theme(--color-chart-5)_72%,theme(--color-foreground))] [&_[data-kind='function-type']]:italic [&_[data-kind='key']]:font-medium [&_[data-kind='key']]:text-[color-mix(in_oklab,theme(--color-chart-1)_72%,theme(--color-foreground))] [&_[data-kind='operator']]:text-destructive [&_[data-kind='preview'][data-type='bigint']]:text-[color-mix(in_oklab,theme(--color-chart-3)_78%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='boolean']]:font-medium [&_[data-kind='preview'][data-type='boolean']]:text-[color-mix(in_oklab,theme(--color-chart-4)_74%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='error']]:text-destructive [&_[data-kind='preview'][data-type='function']]:text-[color-mix(in_oklab,theme(--color-chart-5)_72%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='null']]:font-medium [&_[data-kind='preview'][data-type='null']]:text-muted-foreground [&_[data-kind='preview'][data-type='null']]:italic [&_[data-kind='preview'][data-type='number']]:text-[color-mix(in_oklab,theme(--color-chart-3)_78%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='string']]:text-[color-mix(in_oklab,theme(--color-success)_78%,theme(--color-foreground))] [&_[data-kind='preview'][data-type='undefined']]:font-medium [&_[data-kind='preview'][data-type='undefined']]:text-muted-foreground [&_[data-kind='preview'][data-type='undefined']]:italic [&_[data-kind='preview-text']]:text-muted-foreground [&_[data-scope='json-tree-view'][data-part='branch']]:flex [&_[data-scope='json-tree-view'][data-part='branch']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch']]:flex-col [&_[data-scope='json-tree-view'][data-part='branch']]:gap-1 [&_[data-scope='json-tree-view'][data-part='branch-content']]:flex [&_[data-scope='json-tree-view'][data-part='branch-content']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch-content']]:flex-col [&_[data-scope='json-tree-view'][data-part='branch-content']]:gap-1 [&_[data-scope='json-tree-view'][data-part='branch-content']]:overflow-hidden [&_[data-scope='json-tree-view'][data-part='branch-control']]:relative [&_[data-scope='json-tree-view'][data-part='branch-control']]:z-0 [&_[data-scope='json-tree-view'][data-part='branch-control']]:box-border [&_[data-scope='json-tree-view'][data-part='branch-control']]:flex [&_[data-scope='json-tree-view'][data-part='branch-control']]:min-h-5 [&_[data-scope='json-tree-view'][data-part='branch-control']]:w-full [&_[data-scope='json-tree-view'][data-part='branch-control']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch-control']]:cursor-pointer [&_[data-scope='json-tree-view'][data-part='branch-control']]:items-center [&_[data-scope='json-tree-view'][data-part='branch-control']]:gap-0.5 [&_[data-scope='json-tree-view'][data-part='branch-control']]:rounded-xs [&_[data-scope='json-tree-view'][data-part='branch-control']]:bg-transparent [&_[data-scope='json-tree-view'][data-part='branch-control']]:py-0.5 [&_[data-scope='json-tree-view'][data-part='branch-control']]:ps-[calc(0.5rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='branch-control']]:pe-1 [&_[data-scope='json-tree-view'][data-part='branch-control']]:text-start [&_[data-scope='json-tree-view'][data-part='branch-control']]:text-inherit [&_[data-scope='json-tree-view'][data-part='branch-control']]:transition-[color,opacity] [&_[data-scope='json-tree-view'][data-part='branch-control']]:duration-200 [&_[data-scope='json-tree-view'][data-part='branch-control']]:ease-in-out [&_[data-scope='json-tree-view'][data-part='branch-control']]:outline-none [&_[data-scope='json-tree-view'][data-part='branch-control']]:select-none [&_[data-scope='json-tree-view'][data-part='branch-control']]:[font:inherit] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:pointer-events-none [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:absolute [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:inset-y-0 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:start-[calc(0.25rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:end-0 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:-z-1 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:rounded-[inherit] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:bg-transparent [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:ring-1 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:ring-transparent [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:transition-[background-color,box-shadow] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:duration-200 [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:ease-in-out [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:content-[''] [&_[data-scope='json-tree-view'][data-part='branch-control']]:before:ring-inset motion-reduce:[&_[data-scope='json-tree-view'][data-part='branch-control']]:transition-none motion-reduce:[&_[data-scope='json-tree-view'][data-part='branch-control']]:before:transition-none [&_[data-scope='json-tree-view'][data-part='branch-control']:focus-visible]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='branch-control'][data-disabled]]:cursor-default [&_[data-scope='json-tree-view'][data-part='branch-control'][data-disabled]]:text-muted-foreground [&_[data-scope='json-tree-view'][data-part='branch-control'][data-focus]]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='branch-control'][data-selected]]:before:bg-[color-mix(in_oklab,theme(--color-accent)_72%,theme(--color-background))] [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:inline-flex [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:size-3 [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:shrink-0 [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:items-center [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:justify-center [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:text-[color-mix(in_oklab,theme(--color-muted-foreground)_42%,theme(--color-foreground))] [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:transition-transform [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:duration-200 [&_[data-scope='json-tree-view'][data-part='branch-indicator']]:ease-in-out motion-reduce:[&_[data-scope='json-tree-view'][data-part='branch-indicator']]:transition-none [&_[data-scope='json-tree-view'][data-part='branch-indicator']_svg]:size-3 [&_[data-scope='json-tree-view'][data-part='branch-indicator'][data-state='open']]:rotate-90 [&_[data-scope='json-tree-view'][data-part='branch-text']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='branch-text']]:wrap-anywhere [&_[data-scope='json-tree-view'][data-part='item']]:relative [&_[data-scope='json-tree-view'][data-part='item']]:z-0 [&_[data-scope='json-tree-view'][data-part='item']]:box-border [&_[data-scope='json-tree-view'][data-part='item']]:flex [&_[data-scope='json-tree-view'][data-part='item']]:min-h-5 [&_[data-scope='json-tree-view'][data-part='item']]:w-full [&_[data-scope='json-tree-view'][data-part='item']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='item']]:cursor-pointer [&_[data-scope='json-tree-view'][data-part='item']]:items-center [&_[data-scope='json-tree-view'][data-part='item']]:gap-0.5 [&_[data-scope='json-tree-view'][data-part='item']]:rounded-xs [&_[data-scope='json-tree-view'][data-part='item']]:bg-transparent [&_[data-scope='json-tree-view'][data-part='item']]:py-0.5 [&_[data-scope='json-tree-view'][data-part='item']]:ps-[calc(0.5rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='item']]:pe-1 [&_[data-scope='json-tree-view'][data-part='item']]:text-start [&_[data-scope='json-tree-view'][data-part='item']]:text-inherit [&_[data-scope='json-tree-view'][data-part='item']]:transition-[color,opacity] [&_[data-scope='json-tree-view'][data-part='item']]:duration-200 [&_[data-scope='json-tree-view'][data-part='item']]:ease-in-out [&_[data-scope='json-tree-view'][data-part='item']]:outline-none [&_[data-scope='json-tree-view'][data-part='item']]:select-none [&_[data-scope='json-tree-view'][data-part='item']]:[font:inherit] [&_[data-scope='json-tree-view'][data-part='item']]:before:pointer-events-none [&_[data-scope='json-tree-view'][data-part='item']]:before:absolute [&_[data-scope='json-tree-view'][data-part='item']]:before:inset-y-0 [&_[data-scope='json-tree-view'][data-part='item']]:before:start-[calc(0.25rem+((var(--depth,1)-1)*1rem))] [&_[data-scope='json-tree-view'][data-part='item']]:before:end-0 [&_[data-scope='json-tree-view'][data-part='item']]:before:-z-1 [&_[data-scope='json-tree-view'][data-part='item']]:before:rounded-[inherit] [&_[data-scope='json-tree-view'][data-part='item']]:before:bg-transparent [&_[data-scope='json-tree-view'][data-part='item']]:before:ring-1 [&_[data-scope='json-tree-view'][data-part='item']]:before:ring-transparent [&_[data-scope='json-tree-view'][data-part='item']]:before:transition-[background-color,box-shadow] [&_[data-scope='json-tree-view'][data-part='item']]:before:duration-200 [&_[data-scope='json-tree-view'][data-part='item']]:before:ease-in-out [&_[data-scope='json-tree-view'][data-part='item']]:before:content-[''] [&_[data-scope='json-tree-view'][data-part='item']]:before:ring-inset motion-reduce:[&_[data-scope='json-tree-view'][data-part='item']]:transition-none motion-reduce:[&_[data-scope='json-tree-view'][data-part='item']]:before:transition-none [&_[data-scope='json-tree-view'][data-part='item']:focus-visible]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='item'][data-disabled]]:cursor-default [&_[data-scope='json-tree-view'][data-part='item'][data-disabled]]:text-muted-foreground [&_[data-scope='json-tree-view'][data-part='item'][data-focus]]:before:ring-ring [&_[data-scope='json-tree-view'][data-part='item'][data-selected]]:before:bg-[color-mix(in_oklab,theme(--color-accent)_72%,theme(--color-background))] [&_[data-scope='json-tree-view'][data-part='item-text']]:min-w-0 [&_[data-scope='json-tree-view'][data-part='item-text']]:wrap-anywhere [@media(hover:hover)]:[&_[data-scope='json-tree-view'][data-part='branch-control']:not([data-disabled]):hover]:before:bg-[color-mix(in_oklab,theme(--color-accent)_72%,theme(--color-background))] [@media(hover:hover)]:[&_[data-scope='json-tree-view'][data-part='item']:not([data-disabled]):hover]:before:bg-[color-mix(in_oklab,theme(--color-accent)_72%,theme(--color-background))]", local.class)} {...others} data-slot="json-tree-view-root-provider">
+    return <JsonTreeView.RootProvider asChild={local.asChild} {...others} class={cn(rootClassName, local.class)} {...others} data-slot="json-tree-view-root-provider">
       {local.children}
     </JsonTreeView.RootProvider>;
 }

package/dist/components/menu/Menu.d.ts

@@ -15,6 +15,8 @@ type MenuRadioItemProps = ComponentProps<typeof MenuPrimitive.RadioItem> & {
 };
 type MenuRootProps = ComponentProps<typeof MenuPrimitive.Root> & OverlayPortalProps;
 type MenuRootProviderProps = ComponentProps<typeof MenuPrimitive.RootProvider> & OverlayPortalProps;
+declare const menuPositionerVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+declare const menuContentVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 declare function MenuRoot(props: MenuRootProps): import("solid-js").JSX.Element;
 declare function MenuRootProvider(props: MenuRootProviderProps): import("solid-js").JSX.Element;
 declare function MenuTrigger(props: ComponentProps<typeof MenuPrimitive.Trigger>): import("solid-js").JSX.Element;
@@ -71,4 +73,4 @@ declare const Menu: typeof MenuRoot & {
     ItemShortcut: typeof MenuItemShortcut;
     ItemContext: (props: MenuPrimitive.ItemContextProps) => import("solid-js").JSX.Element;
 };
-export { Menu, useMenu, useMenuContext, useMenuItemContext };
+export { Menu, menuContentVariants, menuPositionerVariants, useMenu, useMenuContext, useMenuItemContext, };

package/dist/components/menu/Menu.js

@@ -1,5 +1,4 @@
 import { createComponent, insert, mergeProps, spread, template } from "solid-js/web";
-import { useFocusVisible } from "@ark-ui/solid";
 import { ark } from "@ark-ui/solid/factory";
 import { Menu, useMenu, useMenuContext, useMenuItemContext } from "@ark-ui/solid/menu";
 import { cva } from "class-variance-authority";
@@ -29,6 +28,8 @@ const menuItemStyles = cva("relative z-0 min-h-control-sm cursor-default rounded
         tone: 'default'
     }
 });
+const menuPositionerVariants = cva('z-[var(--z-index)] w-[var(--positioner-width,auto)] max-w-[var(--available-width)] outline-0');
+const menuContentVariants = cva('relative z-[calc(var(--moduix-z-popup)+var(--layer-index,0))] flex max-w-[min(20rem,var(--available-width,100vw))] min-w-[min(max(var(--reference-width,0px),12rem),var(--available-width,100vw))] origin-[var(--transform-origin)] flex-col overflow-visible rounded-md bg-popover py-1 text-popover-foreground shadow-lg outline-1 outline-border [--arrow-background:var(--color-popover)] [--arrow-size:0.625rem] data-[state=closed]:animate-moduix-menu-closed data-[state=open]:animate-moduix-menu-open motion-reduce:[animation-delay:0ms] motion-reduce:[animation-duration:1ms]');
 function MenuRoot(props) {
     const [local, others] = splitProps(props, [
         'children',
@@ -92,7 +93,6 @@ function MenuRootProvider(props) {
     });
 }
 function MenuTrigger(props) {
-    const focusVisible = useFocusVisible();
     const [local, others] = splitProps(props, [
         'asChild',
         'class'
@@ -101,11 +101,8 @@ function MenuTrigger(props) {
         get asChild () {
             return local.asChild;
         },
-        get ["data-focus-visible"] () {
-            return focusVisible() ? '' : void 0;
-        },
         get ["class"] () {
-            return cn(!local.asChild && 'inline-flex min-h-control-md cursor-pointer items-center justify-center gap-2 rounded-md border border-border bg-background px-4 py-1 text-sm font-medium text-foreground outline-0 transition-colors duration-200 ease-in-out select-none active:bg-muted data-disabled:pointer-events-none data-disabled:opacity-50 data-[current]:data-[state=open]:bg-muted motion-reduce:transition-none [&:focus[data-focus-visible]]:outline-1 [&:focus[data-focus-visible]]:-outline-offset-1 [&:focus[data-focus-visible]]:outline-ring [@media(hover:hover)]:hover:bg-muted', local.class);
+            return cn(!local.asChild && 'inline-flex min-h-control-md cursor-pointer items-center justify-center gap-2 rounded-md border border-border bg-background px-4 py-1 text-sm font-medium text-foreground outline-0 transition-colors duration-200 ease-in-out select-none focus-visible:outline-1 focus-visible:-outline-offset-1 focus-visible:outline-ring active:bg-muted data-disabled:pointer-events-none data-disabled:opacity-50 data-[current]:data-[state=open]:bg-muted motion-reduce:transition-none [@media(hover:hover)]:hover:bg-muted', local.class);
         }
     }, others, {
         "data-slot": "menu-trigger"
@@ -148,7 +145,6 @@ function MenuIndicator(props) {
     }));
 }
 function MenuContextTrigger(props) {
-    const focusVisible = useFocusVisible();
     const [local, others] = splitProps(props, [
         'asChild',
         'class'
@@ -157,11 +153,8 @@ function MenuContextTrigger(props) {
         get asChild () {
             return local.asChild;
         },
-        get ["data-focus-visible"] () {
-            return focusVisible() ? '' : void 0;
-        },
         get ["class"] () {
-            return cn(!local.asChild && 'inline-flex min-h-control-md cursor-pointer items-center justify-center gap-2 rounded-md border border-border bg-background px-4 py-1 text-sm font-medium text-foreground outline-0 transition-colors duration-200 ease-in-out select-none active:bg-muted data-disabled:pointer-events-none data-disabled:opacity-50 data-[current]:data-[state=open]:bg-muted motion-reduce:transition-none [&:focus[data-focus-visible]]:outline-1 [&:focus[data-focus-visible]]:-outline-offset-1 [&:focus[data-focus-visible]]:outline-ring [@media(hover:hover)]:hover:bg-muted', local.class);
+            return cn(!local.asChild && 'inline-flex min-h-control-md cursor-pointer items-center justify-center gap-2 rounded-md border border-border bg-background px-4 py-1 text-sm font-medium text-foreground outline-0 transition-colors duration-200 ease-in-out select-none focus-visible:outline-1 focus-visible:-outline-offset-1 focus-visible:outline-ring active:bg-muted data-disabled:pointer-events-none data-disabled:opacity-50 data-[current]:data-[state=open]:bg-muted motion-reduce:transition-none [@media(hover:hover)]:hover:bg-muted', local.class);
         }
     }, others, {
         "data-slot": "menu-context-trigger"
@@ -175,7 +168,7 @@ function MenuPositioner(props) {
         get children () {
             return createComponent(Menu.Positioner, mergeProps({
                 get ["class"] () {
-                    return cn('z-[var(--z-index)] w-[var(--positioner-width,auto)] max-w-[var(--available-width)] outline-0', local.class);
+                    return cn(menuPositionerVariants(), local.class);
                 }
             }, others, {
                 "data-slot": "menu-positioner"
@@ -194,7 +187,7 @@ function MenuContent(props) {
             return local.asChild;
         },
         get ["class"] () {
-            return cn('relative z-[calc(var(--moduix-z-popup)+var(--layer-index,0))] flex max-w-[min(20rem,var(--available-width,100vw))] min-w-[min(max(var(--reference-width,0px),12rem),var(--available-width,100vw))] origin-[var(--transform-origin)] flex-col overflow-visible rounded-md bg-popover py-1 text-popover-foreground shadow-lg outline-1 outline-border [--arrow-background:var(--color-popover)] [--arrow-size:0.625rem] data-[state=closed]:animate-moduix-menu-closed data-[state=open]:animate-moduix-menu-open motion-reduce:[animation-delay:0ms] motion-reduce:[animation-duration:1ms]', local.class);
+            return cn(menuContentVariants(), local.class);
         }
     }, others, {
         "data-slot": "menu-content",
@@ -212,12 +205,12 @@ function MenuViewport(props) {
         get asChild () {
             return local.asChild;
         },
-        "data-scope": "menu",
-        "data-part": "viewport",
         get ["class"] () {
             return cn('flex max-h-[min(24rem,var(--available-height,100dvh))] flex-col overflow-auto', local.class);
         }
     }, others, {
+        "data-scope": "menu",
+        "data-part": "viewport",
         "data-slot": "menu-viewport"
     }));
 }
@@ -256,9 +249,6 @@ function MenuItem(props) {
         'tone'
     ]);
     return createComponent(Menu.Item, mergeProps({
-        get ["data-tone"] () {
-            return local.tone ?? 'default';
-        },
         get ["class"] () {
             return cn(menuItemStyles({
                 layout: 'item',
@@ -266,6 +256,9 @@ function MenuItem(props) {
             }), local.class);
         }
     }, others, {
+        get ["data-tone"] () {
+            return local.tone ?? 'default';
+        },
         "data-slot": "menu-item"
     }));
 }
@@ -356,9 +349,6 @@ function MenuRadioItem(props) {
         'indicator'
     ]);
     return createComponent(Menu.RadioItem, mergeProps({
-        get ["data-indicator-position"] () {
-            return local.indicator ?? 'start';
-        },
         get ["class"] () {
             return cn(menuItemStyles({
                 layout: 'indicatorItem',
@@ -366,6 +356,9 @@ function MenuRadioItem(props) {
             }), local.class);
         }
     }, others, {
+        get ["data-indicator-position"] () {
+            return local.indicator ?? 'start';
+        },
         "data-slot": "menu-radio-item"
     }));
 }
@@ -375,9 +368,6 @@ function MenuCheckboxItem(props) {
         'indicator'
     ]);
     return createComponent(Menu.CheckboxItem, mergeProps({
-        get ["data-indicator-position"] () {
-            return local.indicator ?? 'start';
-        },
         get ["class"] () {
             return cn(menuItemStyles({
                 layout: 'indicatorItem',
@@ -385,6 +375,9 @@ function MenuCheckboxItem(props) {
             }), local.class);
         }
     }, others, {
+        get ["data-indicator-position"] () {
+            return local.indicator ?? 'start';
+        },
         "data-slot": "menu-checkbox-item"
     }));
 }
@@ -495,4 +488,4 @@ const Menu_Menu = Object.assign(MenuRoot, {
     ItemShortcut: MenuItemShortcut,
     ItemContext: Menu.ItemContext
 });
-export { Menu_Menu as Menu, useMenu, useMenuContext, useMenuItemContext };
+export { Menu_Menu as Menu, menuContentVariants, menuPositionerVariants, useMenu, useMenuContext, useMenuItemContext };

package/dist/components/menu/Menu.jsx

@@ -1,4 +1,3 @@
-import { useFocusVisible } from "@ark-ui/solid";
 import { ark } from "@ark-ui/solid/factory";
 import { Menu, useMenu, useMenuContext, useMenuItemContext } from "@ark-ui/solid/menu";
 import { cva } from "class-variance-authority";
@@ -27,6 +26,8 @@ const menuItemStyles = cva("relative z-0 min-h-control-sm cursor-default rounded
         tone: 'default'
     }
 });
+const menuPositionerVariants = cva('z-[var(--z-index)] w-[var(--positioner-width,auto)] max-w-[var(--available-width)] outline-0');
+const menuContentVariants = cva('relative z-[calc(var(--moduix-z-popup)+var(--layer-index,0))] flex max-w-[min(20rem,var(--available-width,100vw))] min-w-[min(max(var(--reference-width,0px),12rem),var(--available-width,100vw))] origin-[var(--transform-origin)] flex-col overflow-visible rounded-md bg-popover py-1 text-popover-foreground shadow-lg outline-1 outline-border [--arrow-background:var(--color-popover)] [--arrow-size:0.625rem] data-[state=closed]:animate-moduix-menu-closed data-[state=open]:animate-moduix-menu-open motion-reduce:[animation-delay:0ms] motion-reduce:[animation-duration:1ms]');
 function MenuRoot(props) {
     const [local, others] = splitProps(props, [
         'children',
@@ -56,12 +57,11 @@ function MenuRootProvider(props) {
     </OverlayPortalProvider>;
 }
 function MenuTrigger(props) {
-    const focusVisible = useFocusVisible();
     const [local, others] = splitProps(props, [
         'asChild',
         'class'
     ]);
-    return <Menu.Trigger asChild={local.asChild} data-focus-visible={focusVisible() ? '' : void 0} class={cn(!local.asChild && 'inline-flex min-h-control-md cursor-pointer items-center justify-center gap-2 rounded-md border border-border bg-background px-4 py-1 text-sm font-medium text-foreground outline-0 transition-colors duration-200 ease-in-out select-none active:bg-muted data-disabled:pointer-events-none data-disabled:opacity-50 data-[current]:data-[state=open]:bg-muted motion-reduce:transition-none [&:focus[data-focus-visible]]:outline-1 [&:focus[data-focus-visible]]:-outline-offset-1 [&:focus[data-focus-visible]]:outline-ring [@media(hover:hover)]:hover:bg-muted', local.class)} {...others} data-slot="menu-trigger"/>;
+    return <Menu.Trigger asChild={local.asChild} class={cn(!local.asChild && 'inline-flex min-h-control-md cursor-pointer items-center justify-center gap-2 rounded-md border border-border bg-background px-4 py-1 text-sm font-medium text-foreground outline-0 transition-colors duration-200 ease-in-out select-none focus-visible:outline-1 focus-visible:-outline-offset-1 focus-visible:outline-ring active:bg-muted data-disabled:pointer-events-none data-disabled:opacity-50 data-[current]:data-[state=open]:bg-muted motion-reduce:transition-none [@media(hover:hover)]:hover:bg-muted', local.class)} {...others} data-slot="menu-trigger"/>;
 }
 function MenuTriggerIcon(props) {
     const [local, others] = splitProps(props, [
@@ -84,19 +84,18 @@ function MenuIndicator(props) {
     </Menu.Indicator>;
 }
 function MenuContextTrigger(props) {
-    const focusVisible = useFocusVisible();
     const [local, others] = splitProps(props, [
         'asChild',
         'class'
     ]);
-    return <Menu.ContextTrigger asChild={local.asChild} data-focus-visible={focusVisible() ? '' : void 0} class={cn(!local.asChild && 'inline-flex min-h-control-md cursor-pointer items-center justify-center gap-2 rounded-md border border-border bg-background px-4 py-1 text-sm font-medium text-foreground outline-0 transition-colors duration-200 ease-in-out select-none active:bg-muted data-disabled:pointer-events-none data-disabled:opacity-50 data-[current]:data-[state=open]:bg-muted motion-reduce:transition-none [&:focus[data-focus-visible]]:outline-1 [&:focus[data-focus-visible]]:-outline-offset-1 [&:focus[data-focus-visible]]:outline-ring [@media(hover:hover)]:hover:bg-muted', local.class)} {...others} data-slot="menu-context-trigger"/>;
+    return <Menu.ContextTrigger asChild={local.asChild} class={cn(!local.asChild && 'inline-flex min-h-control-md cursor-pointer items-center justify-center gap-2 rounded-md border border-border bg-background px-4 py-1 text-sm font-medium text-foreground outline-0 transition-colors duration-200 ease-in-out select-none focus-visible:outline-1 focus-visible:-outline-offset-1 focus-visible:outline-ring active:bg-muted data-disabled:pointer-events-none data-disabled:opacity-50 data-[current]:data-[state=open]:bg-muted motion-reduce:transition-none [@media(hover:hover)]:hover:bg-muted', local.class)} {...others} data-slot="menu-context-trigger"/>;
 }
 function MenuPositioner(props) {
     const [local, others] = splitProps(props, [
         'class'
     ]);
     return <OverlayPortal>
-      <Menu.Positioner class={cn('z-[var(--z-index)] w-[var(--positioner-width,auto)] max-w-[var(--available-width)] outline-0', local.class)} {...others} data-slot="menu-positioner"/>
+      <Menu.Positioner class={cn(menuPositionerVariants(), local.class)} {...others} data-slot="menu-positioner"/>
     </OverlayPortal>;
 }
 function MenuContent(props) {
@@ -105,7 +104,7 @@ function MenuContent(props) {
         'children',
         'class'
     ]);
-    return <Menu.Content asChild={local.asChild} class={cn('relative z-[calc(var(--moduix-z-popup)+var(--layer-index,0))] flex max-w-[min(20rem,var(--available-width,100vw))] min-w-[min(max(var(--reference-width,0px),12rem),var(--available-width,100vw))] origin-[var(--transform-origin)] flex-col overflow-visible rounded-md bg-popover py-1 text-popover-foreground shadow-lg outline-1 outline-border [--arrow-background:var(--color-popover)] [--arrow-size:0.625rem] data-[state=closed]:animate-moduix-menu-closed data-[state=open]:animate-moduix-menu-open motion-reduce:[animation-delay:0ms] motion-reduce:[animation-duration:1ms]', local.class)} {...others} data-slot="menu-content">
+    return <Menu.Content asChild={local.asChild} class={cn(menuContentVariants(), local.class)} {...others} data-slot="menu-content">
       {local.children}
     </Menu.Content>;
 }
@@ -114,7 +113,7 @@ function MenuViewport(props) {
         'asChild',
         'class'
     ]);
-    return <ark.div asChild={local.asChild} data-scope="menu" data-part="viewport" class={cn('flex max-h-[min(24rem,var(--available-height,100dvh))] flex-col overflow-auto', local.class)} {...others} data-slot="menu-viewport"/>;
+    return <ark.div asChild={local.asChild} class={cn('flex max-h-[min(24rem,var(--available-height,100dvh))] flex-col overflow-auto', local.class)} {...others} data-scope="menu" data-part="viewport" data-slot="menu-viewport"/>;
 }
 function MenuArrow(props) {
     const [local, others] = splitProps(props, [
@@ -137,10 +136,10 @@ function MenuItem(props) {
         'class',
         'tone'
     ]);
-    return <Menu.Item data-tone={local.tone ?? 'default'} class={cn(menuItemStyles({
+    return <Menu.Item class={cn(menuItemStyles({
         layout: 'item',
         tone: local.tone
-    }), local.class)} {...others} data-slot="menu-item"/>;
+    }), local.class)} {...others} data-tone={local.tone ?? 'default'} data-slot="menu-item"/>;
 }
 function MenuTriggerItem(props) {
     const [local, others] = splitProps(props, [
@@ -189,20 +188,20 @@ function MenuRadioItem(props) {
         'class',
         'indicator'
     ]);
-    return <Menu.RadioItem data-indicator-position={local.indicator ?? 'start'} class={cn(menuItemStyles({
+    return <Menu.RadioItem class={cn(menuItemStyles({
         layout: 'indicatorItem',
         indicator: local.indicator ?? 'start'
-    }), local.class)} {...others} data-slot="menu-radio-item"/>;
+    }), local.class)} {...others} data-indicator-position={local.indicator ?? 'start'} data-slot="menu-radio-item"/>;
 }
 function MenuCheckboxItem(props) {
     const [local, others] = splitProps(props, [
         'class',
         'indicator'
     ]);
-    return <Menu.CheckboxItem data-indicator-position={local.indicator ?? 'start'} class={cn(menuItemStyles({
+    return <Menu.CheckboxItem class={cn(menuItemStyles({
         layout: 'indicatorItem',
         indicator: local.indicator ?? 'start'
-    }), local.class)} {...others} data-slot="menu-checkbox-item"/>;
+    }), local.class)} {...others} data-indicator-position={local.indicator ?? 'start'} data-slot="menu-checkbox-item"/>;
 }
 function MenuItemIndicator(props) {
     const [local, others] = splitProps(props, [
@@ -274,4 +273,4 @@ const Menu_Menu = Object.assign(MenuRoot, {
     ItemShortcut: MenuItemShortcut,
     ItemContext: Menu.ItemContext
 });
-export { Menu_Menu as Menu, useMenu, useMenuContext, useMenuItemContext };
+export { Menu_Menu as Menu, menuContentVariants, menuPositionerVariants, useMenu, useMenuContext, useMenuItemContext };

package/dist/components/native-select/NativeSelect.d.ts

@@ -2,7 +2,6 @@ import type { FieldSelectProps } from '@ark-ui/solid/field';
 import type { JSX } from 'solid-js';
 type NativeSelectRootProps = FieldSelectProps & {
     controlProps?: JSX.HTMLAttributes<HTMLSpanElement>;
-    defaultValue?: FieldSelectProps['value'];
 };
 declare function NativeSelectRoot(props: NativeSelectRootProps): JSX.Element;
 declare const NativeSelect: typeof NativeSelectRoot & {

package/dist/components/native-select/NativeSelect.js

@@ -4,13 +4,11 @@ import { splitProps } from "solid-js";
 import { cn } from "../../internal/cn.js";
 import { ChevronDownIcon } from "../../internal/icons/ui/Icons.js";
 var _tmpl$ = /*#__PURE__*/ template("<span><span aria-hidden=true data-scope=native-select data-part=indicator data-slot=native-select-indicator>");
-const NativeFieldSelect = Field.Select;
 function NativeSelectRoot(props) {
     const [local, others] = splitProps(props, [
         'asChild',
         'class',
-        'controlProps',
-        'defaultValue'
+        'controlProps'
     ]);
     const isList = ()=>props.multiple || void 0 !== props.size && Number(props.size) > 1;
     return (()=>{
@@ -23,7 +21,7 @@ function NativeSelectRoot(props) {
                 return cn('relative inline-grid w-fit max-w-full min-w-0', local.controlProps?.class);
             }
         }), false, true);
-        insert(_el$, createComponent(NativeFieldSelect, mergeProps({
+        insert(_el$, createComponent(Field.Select, mergeProps({
             get asChild () {
                 return local.asChild;
             }
@@ -33,9 +31,6 @@ function NativeSelectRoot(props) {
             "data-slot": "native-select-root",
             get ["class"] () {
                 return cn('peer/native-select box-border h-control-md w-56 max-w-full min-w-0 cursor-pointer appearance-none rounded-md border border-border bg-background ps-3 pe-11 text-foreground outline-1 -outline-offset-1 outline-transparent transition-[background-color,border-color,outline-color,opacity] duration-200 ease-in-out [font:inherit] focus-visible:border-ring focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:outline-destructive aria-invalid:focus-visible:outline-destructive data-disabled:pointer-events-none data-disabled:opacity-50 data-invalid:border-destructive data-invalid:outline-destructive data-invalid:focus-visible:outline-destructive motion-reduce:transition-none forced-colors:appearance-auto forced-colors:pe-3', isList() && 'h-auto appearance-auto px-3 py-2', local.class);
-            },
-            get ["prop:defaultValue"] () {
-                return local.defaultValue;
             }
         })), _el$2);
         insert(_el$2, createComponent(ChevronDownIcon, {}));

package/dist/components/native-select/NativeSelect.jsx

@@ -2,17 +2,15 @@ import { Field } from "@ark-ui/solid/field";
 import { splitProps } from "solid-js";
 import { cn } from "../../internal/cn.jsx";
 import { ChevronDownIcon } from "../../internal/icons/ui/Icons.jsx";
-const NativeFieldSelect = Field.Select;
 function NativeSelectRoot(props) {
     const [local, others] = splitProps(props, [
         'asChild',
         'class',
-        'controlProps',
-        'defaultValue'
+        'controlProps'
     ]);
     const isList = ()=>props.multiple || void 0 !== props.size && Number(props.size) > 1;
     return <span {...local.controlProps} data-scope="native-select" data-part="control" data-slot="native-select-control" class={cn('relative inline-grid w-fit max-w-full min-w-0', local.controlProps?.class)}>
-      <NativeFieldSelect asChild={local.asChild} {...others} data-scope="field" data-part="select" data-slot="native-select-root" class={cn('peer/native-select box-border h-control-md w-56 max-w-full min-w-0 cursor-pointer appearance-none rounded-md border border-border bg-background ps-3 pe-11 text-foreground outline-1 -outline-offset-1 outline-transparent transition-[background-color,border-color,outline-color,opacity] duration-200 ease-in-out [font:inherit] focus-visible:border-ring focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:outline-destructive aria-invalid:focus-visible:outline-destructive data-disabled:pointer-events-none data-disabled:opacity-50 data-invalid:border-destructive data-invalid:outline-destructive data-invalid:focus-visible:outline-destructive motion-reduce:transition-none forced-colors:appearance-auto forced-colors:pe-3', isList() && 'h-auto appearance-auto px-3 py-2', local.class)} prop:defaultValue={local.defaultValue}/>
+      <Field.Select asChild={local.asChild} {...others} data-scope="field" data-part="select" data-slot="native-select-root" class={cn('peer/native-select box-border h-control-md w-56 max-w-full min-w-0 cursor-pointer appearance-none rounded-md border border-border bg-background ps-3 pe-11 text-foreground outline-1 -outline-offset-1 outline-transparent transition-[background-color,border-color,outline-color,opacity] duration-200 ease-in-out [font:inherit] focus-visible:border-ring focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:outline-destructive aria-invalid:focus-visible:outline-destructive data-disabled:pointer-events-none data-disabled:opacity-50 data-invalid:border-destructive data-invalid:outline-destructive data-invalid:focus-visible:outline-destructive motion-reduce:transition-none forced-colors:appearance-auto forced-colors:pe-3', isList() && 'h-auto appearance-auto px-3 py-2', local.class)}/>
       <span aria-hidden="true" data-scope="native-select" data-part="indicator" data-slot="native-select-indicator" class={cn('pointer-events-none absolute end-2 top-1/2 inline-flex size-6 -translate-y-1/2 items-center justify-center rounded-sm bg-transparent leading-none text-muted-foreground transition-[background-color,color,opacity] duration-200 ease-in-out peer-disabled/native-select:opacity-50 peer-data-disabled/native-select:opacity-50 motion-reduce:transition-none forced-colors:hidden [&>svg]:block [&>svg]:size-4 [@media(hover:hover)]:peer-[:not([disabled]):not([data-disabled]):hover]/native-select:bg-muted [@media(hover:hover)]:peer-[:not([disabled]):not([data-disabled]):hover]/native-select:text-foreground', isList() && 'hidden')}>
         <ChevronDownIcon/>
       </span>

package/dist/components/navigation-menu/NavigationMenu.d.ts

@@ -26,6 +26,7 @@ declare const NavigationMenu: typeof NavigationMenuRoot & {
     Arrow: typeof NavigationMenuArrow;
     ViewportPositioner: typeof NavigationMenuViewportPositioner;
     Viewport: typeof NavigationMenuViewport;
+    useNavigationMenu: (props?: import("@ark-ui/solid/navigation-menu").UseNavigationMenuProps) => import("@ark-ui/solid/navigation-menu").UseNavigationMenuReturn;
 };
 export { useNavigationMenu, useNavigationMenuContext };
 export { NavigationMenu };

package/dist/components/navigation-menu/NavigationMenu.js

@@ -163,6 +163,7 @@ const NavigationMenu_NavigationMenu = Object.assign(NavigationMenuRoot, {
     ItemIndicator: NavigationMenuItemIndicator,
     Arrow: NavigationMenuArrow,
     ViewportPositioner: NavigationMenuViewportPositioner,
-    Viewport: NavigationMenuViewport
+    Viewport: NavigationMenuViewport,
+    useNavigationMenu: useNavigationMenu
 });
 export { NavigationMenu_NavigationMenu as NavigationMenu, useNavigationMenu, useNavigationMenuContext };