@soybeanjs/ui 0.1.8 → 0.1.10

package/dist/components/tree-menu/tree-menu-option.js

@@ -1 +1 @@
-import e from"../link/link.js";import t from"../dropdown-menu/dropdown-menu.js";import n from"../tooltip/tooltip.js";import{useTreeMenuContext as r,useTreeMenuExtraUi as i}from"./context.js";import a from"./tree-menu-option-slot.js";import{isChildActive as o}from"./shared.js";import{Fragment as s,computed as c,createBlock as l,createCommentVNode as u,createElementBlock as d,createElementVNode as f,createSlots as p,createVNode as m,defineComponent as h,guardReactiveProps as g,mergeProps as _,normalizeClass as v,normalizeProps as y,openBlock as b,renderList as x,renderSlot as S,resolveComponent as C,resolveDynamicComponent as w,unref as T,useSlots as E,withCtx as D}from"vue";import{TreeMenuButton as O,TreeMenuCollapsible as k,TreeMenuItem as A,TreeMenuSub as j,useTreeMenuRootContext as M}from"@soybeanjs/headless";var N=h({name:`STreeMenuOption`,__name:`tree-menu-option`,props:{as:{default:`li`},item:{}},emits:[`selectDropdown`],setup(h,{emit:N}){let P=h,F=N,I=E(),{collapsed:L,modelValue:R,onModelValueChange:z}=M(`TreeMenuOption`),{size:B,side:V}=r(`TreeMenuOption`),H=i(`itemAbsolute`),U=c(()=>Object.keys(I)),W=c(()=>!!P.item.children?.length),G=c(()=>o(P.item,R.value)),K=c(()=>!!(P.item.to||P.item.href)),q=c(()=>{let{disabled:e,to:t,href:n,target:r,external:i}=P.item;return K.value?{disabled:e,to:t,href:n,target:r,external:i}:{}}),J=c(()=>L.value&&W.value),Y=c(()=>L.value&&!J.value?P.item.label:void 0),X=c(()=>V.value===`left`?`right`:`left`),Z=c(()=>({...P.item.tooltipProps,placement:P.item.tooltipProps?.placement??X.value})),Q=c(()=>({...P.item.dropdownMenuProps,trigger:P.item.dropdownMenuProps?.trigger??`hover`,placement:P.item.dropdownMenuProps?.placement??X.value})),$=()=>{P.item.disabled||z(P.item.value)},ee=e=>{P.item.disabled||(z(e.value),F(`selectDropdown`,e.value))};return(r,i)=>{let o=C(`STreeMenuOption`);return W.value?(b(),l(T(A),{key:1,"as-child":``,value:h.item.value,disabled:h.item.disabled},{default:D(()=>[m(T(k),{as:h.as,"disabled-collapsible":T(L)},{trigger:D(()=>[m(T(O),{"disabled-active":``,"data-child-active":G.value},{default:D(()=>[m(a,{item:h.item},p({_:2},[x(U.value,e=>({name:e,fn:D(t=>[S(r.$slots,e,y(g(t)))])}))]),1032,[`item`])]),_:3},8,[`data-child-active`])]),extra:D(()=>[J.value?(b(),l(t,_({key:0},Q.value,{items:h.item.children??[],disabled:h.item.disabled,size:T(B),"data-menu":h.item.label,onSelect:ee}),{trigger:D(()=>[f(`div`,{class:v(T(H))},null,2)]),_:1},16,[`items`,`disabled`,`size`,`data-menu`])):u(`v-if`,!0)]),default:D(()=>[m(T(j),null,{default:D(()=>[(b(!0),d(s,null,x(h.item.children,e=>(b(),l(o,{key:e.value,item:e},p({_:2},[x(U.value,e=>({name:e,fn:D(t=>[S(r.$slots,e,_({ref_for:!0},t))])}))]),1032,[`item`]))),128))]),_:3})]),_:3},8,[`as`,`disabled-collapsible`])]),_:3},8,[`value`,`disabled`])):(b(),l(T(A),{key:0,as:h.as,value:h.item.value,disabled:h.item.disabled},{default:D(()=>[K.value?(b(),l(T(O),{key:0,"as-child":``},{default:D(()=>[m(e,y(g(q.value)),{default:D(({isHref:e})=>[m(a,{item:h.item,"show-link-icon":e},p({_:2},[x(U.value,e=>({name:e,fn:D(t=>[S(r.$slots,e,y(g(t)))])}))]),1032,[`item`,`show-link-icon`])]),_:3},16)]),_:3})):(b(),l(T(O),{key:1},{default:D(()=>[m(a,{item:h.item},p({_:2},[x(U.value,e=>({name:e,fn:D(t=>[S(r.$slots,e,y(g(t)))])}))]),1032,[`item`])]),_:3})),Y.value?(b(),l(n,_({key:2},Z.value,{size:T(B),content:Y.value}),{trigger:D(()=>[(b(),l(w(K.value?e:`div`),_(q.value,{class:T(H),onClick:$}),null,16,[`class`]))]),_:1},16,[`size`,`content`])):u(`v-if`,!0)]),_:3},8,[`as`,`value`,`disabled`]))}}});export{N as default};
+import e from"../link/link.js";import t from"../dropdown-menu/dropdown-menu.js";import n from"../tooltip/tooltip.js";import{useTreeMenuContext as r,useTreeMenuExtraUi as i}from"./context.js";import a from"./tree-menu-option-slot.js";import{isChildActive as o}from"./shared.js";import{Fragment as s,computed as c,createBlock as l,createCommentVNode as u,createElementBlock as d,createElementVNode as f,createSlots as p,createVNode as m,defineComponent as h,guardReactiveProps as g,mergeProps as _,normalizeClass as v,normalizeProps as y,openBlock as b,renderList as x,renderSlot as S,resolveComponent as C,resolveDynamicComponent as w,unref as T,useSlots as E,withCtx as D}from"vue";import{useOmitProps as O}from"@soybeanjs/headless/composables";import{TreeMenuButton as k,TreeMenuCollapsible as A,TreeMenuItem as j,TreeMenuSub as M,useTreeMenuRootContext as N}from"@soybeanjs/headless";var P=h({name:`STreeMenuOption`,__name:`tree-menu-option`,props:{as:{default:`li`},item:{},itemProps:{},buttonProps:{},linkProps:{},collapsibleProps:{},subProps:{}},emits:[`selectDropdown`],setup(h,{emit:P}){let F=h,I=P,L=E(),R=O(F,[`as`,`item`]),{collapsed:z,modelValue:B,onModelValueChange:V}=N(`TreeMenuOption`),{size:H,side:U}=r(`TreeMenuOption`),W=i(`itemAbsolute`),G=c(()=>Object.keys(L)),K=c(()=>!!F.item.children?.length),q=c(()=>o(F.item,B.value)),J=c(()=>!!(F.item.to||F.item.href)),Y=c(()=>{let{disabled:e,to:t,href:n,target:r,external:i}=F.item;return J.value?{disabled:e,to:t,href:n,target:r,external:i}:{}}),X=c(()=>z.value&&K.value),Z=c(()=>z.value&&!X.value?F.item.label:void 0),Q=c(()=>U.value===`left`?`right`:`left`),$=c(()=>({...F.item.tooltipProps,placement:F.item.tooltipProps?.placement??Q.value})),ee=c(()=>({...F.item.dropdownMenuProps,trigger:F.item.dropdownMenuProps?.trigger??`hover`,placement:F.item.dropdownMenuProps?.placement??Q.value})),te=()=>{F.item.disabled||V(F.item.value)},ne=e=>{F.item.disabled||(V(e.value),I(`selectDropdown`,e.value))};return(r,i)=>{let o=C(`STreeMenuOption`);return K.value?(b(),l(T(j),_({key:1},h.itemProps,{"as-child":``,value:h.item.value,disabled:h.item.disabled}),{default:D(()=>[m(T(A),_(h.collapsibleProps,{as:h.as,"disabled-collapsible":T(z)}),{trigger:D(()=>[m(T(k),_(h.buttonProps,{"disabled-active":``,"data-child-active":q.value}),{default:D(()=>[m(a,{item:h.item},p({_:2},[x(G.value,e=>({name:e,fn:D(t=>[S(r.$slots,e,y(g(t)))])}))]),1032,[`item`])]),_:3},16,[`data-child-active`])]),extra:D(()=>[X.value?(b(),l(t,_({key:0},ee.value,{items:h.item.children??[],disabled:h.item.disabled,size:T(H),"data-menu":h.item.label,onSelect:ne}),{trigger:D(()=>[f(`div`,{class:v(T(W))},null,2)]),_:1},16,[`items`,`disabled`,`size`,`data-menu`])):u(`v-if`,!0)]),default:D(()=>[m(T(M),y(g(h.subProps)),{default:D(()=>[(b(!0),d(s,null,x(h.item.children,e=>(b(),l(o,_({key:e.value},{ref_for:!0},T(R),{item:e}),p({_:2},[x(G.value,e=>({name:e,fn:D(t=>[S(r.$slots,e,_({ref_for:!0},t))])}))]),1040,[`item`]))),128))]),_:3},16)]),_:3},16,[`as`,`disabled-collapsible`])]),_:3},16,[`value`,`disabled`])):(b(),l(T(j),_({key:0},h.itemProps,{as:h.as,value:h.item.value,disabled:h.item.disabled}),{default:D(()=>[J.value?(b(),l(T(k),_({key:0},h.buttonProps,{"as-child":``}),{default:D(()=>[m(e,y(g(Y.value)),{default:D(({isHref:e})=>[m(a,{item:h.item,"show-link-icon":e},p({_:2},[x(G.value,e=>({name:e,fn:D(t=>[S(r.$slots,e,y(g(t)))])}))]),1032,[`item`,`show-link-icon`])]),_:3},16)]),_:3},16)):(b(),l(T(k),y(_({key:1},h.buttonProps)),{default:D(()=>[m(a,{item:h.item},p({_:2},[x(G.value,e=>({name:e,fn:D(t=>[S(r.$slots,e,y(g(t)))])}))]),1032,[`item`])]),_:3},16)),Z.value?(b(),l(n,_({key:2},$.value,{size:T(H),content:Z.value}),{trigger:D(()=>[(b(),l(w(J.value?e:`div`),_(Y.value,{class:T(W),onClick:te}),null,16,[`class`]))]),_:1},16,[`size`,`content`])):u(`v-if`,!0)]),_:3},16,[`as`,`value`,`disabled`]))}}});export{P as default};

package/dist/components/tree-menu/tree-menu-styled-item.vue.d.ts

@@ -1,12 +1,12 @@
 import { TreeMenuStyledItemProps } from "./types.js";
-import * as vue304 from "vue";
+import * as vue233 from "vue";
 
 //#region src/components/tree-menu/tree-menu-styled-item.vue.d.ts
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
   default?: (props: typeof __VLS_1) => any;
 };
-declare const __VLS_base: vue304.DefineComponent<TreeMenuStyledItemProps, {}, {}, {}, {}, vue304.ComponentOptionsMixin, vue304.ComponentOptionsMixin, {}, string, vue304.PublicProps, Readonly<TreeMenuStyledItemProps> & Readonly<{}>, {}, {}, {}, {}, string, vue304.ComponentProvideOptions, false, {}, any>;
+declare const __VLS_base: vue233.DefineComponent<TreeMenuStyledItemProps, {}, {}, {}, {}, vue233.ComponentOptionsMixin, vue233.ComponentOptionsMixin, {}, string, vue233.PublicProps, Readonly<TreeMenuStyledItemProps> & Readonly<{}>, {}, {}, {}, {}, string, vue233.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 type __VLS_WithSlots<T, S> = T & {

package/dist/components/tree-menu/tree-menu.js

@@ -1 +1 @@
-import{mergeSlotVariants as e}from"../../theme/shared.js";import{themeSizeMap as t,themeSizeRatio as n}from"../../theme/config.js";import r from"../icon/icon.js";import{treeMenuVariants as i}from"../../variants/tree-menu.js";import{provideTreeMenuContext as a,provideTreeMenuExtraUi as o}from"./context.js";import{isGroupTreeMenu as s,treeMenuCssVars as c}from"./shared.js";import l from"./tree-menu-option.js";import{Fragment as u,computed as d,createBlock as f,createCommentVNode as p,createElementBlock as m,createElementVNode as h,createSlots as g,createVNode as _,defineComponent as v,mergeProps as y,openBlock as b,renderList as x,renderSlot as S,toDisplayString as C,toHandlers as w,unref as T,useSlots as E,withCtx as D}from"vue";import{useForwardListeners as O,useOmitProps as k}from"@soybeanjs/headless/composables";import{TreeMenuGroup as A,TreeMenuGroupLabel as j,TreeMenuGroupRoot as M,TreeMenuRoot as N,provideTreeMenuUi as P}from"@soybeanjs/headless";import{transformPropsToContext as F}from"@soybeanjs/headless/shared";var I=v({name:`STreeMenu`,__name:`tree-menu`,props:{class:{},size:{default:`md`},ui:{},side:{default:`left`},items:{},collapsedWidth:{default:50},indent:{default:16},groupRootProps:{},groupProps:{},groupLabelProps:{},buttonProps:{},collapsibleProps:{},subProps:{},modelValue:{},defaultValue:{},expanded:{},defaultExpanded:{},collapsed:{type:Boolean,default:void 0},defaultCollapsed:{type:Boolean}},emits:[`update:modelValue`,`update:expanded`,`update:collapsed`,`selectDropdown`],setup(v,{emit:I}){let L=v,R=I,z=E(),B=d(()=>Object.keys(z).filter(e=>e.startsWith(`item-`))),V=k(L,[`class`,`size`,`side`,`ui`,`items`,`collapsedWidth`,`indent`,`groupRootProps`,`groupProps`,`groupLabelProps`,`buttonProps`,`collapsibleProps`,`subProps`]),H=O(R),U=d(()=>{let e=L.collapsedWidth*n[L.size],r=L.indent*n[L.size];return{[c.collapsedWidth]:`${e/t.md}rem`,[c.indent]:`${r/t.md}rem`}}),W=d(()=>e(i({size:L.size}),L.ui,{root:L.class}));return P(W),o(W),a(F(L,[`size`,`side`])),(e,t)=>(b(),f(T(N),y(T(V),{style:U.value},w(T(H))),{default:D(()=>[S(e.$slots,`top`),(b(!0),m(u,null,x(v.items,t=>(b(),m(u,{key:t.value},[T(s)(t)?(b(),f(T(M),{key:0},{default:D(()=>[_(T(j),null,{default:D(()=>[t.icon?(b(),f(r,{key:0,icon:t.icon},null,8,[`icon`])):p(`v-if`,!0),h(`span`,null,C(t.label),1)]),_:2},1024),_(T(A),null,{default:D(()=>[(b(!0),m(u,null,x(t.children,t=>(b(),f(l,{key:t.value,item:t},g({_:2},[x(B.value,t=>({name:t,fn:D(n=>[S(e.$slots,t,y({ref_for:!0},n))])}))]),1032,[`item`]))),128))]),_:2},1024)]),_:2},1024)):(b(),f(l,{key:1,as:`div`,item:t},g({_:2},[x(B.value,t=>({name:t,fn:D(n=>[S(e.$slots,t,y({ref_for:!0},n))])}))]),1032,[`item`]))],64))),128)),S(e.$slots,`bottom`)]),_:3},16,[`style`]))}});export{I as default};
+import{mergeSlotVariants as e}from"../../theme/shared.js";import{themeSizeMap as t,themeSizeRatio as n}from"../../theme/config.js";import r from"../icon/icon.js";import{treeMenuVariants as i}from"../../variants/tree-menu.js";import{provideTreeMenuContext as a,provideTreeMenuExtraUi as o}from"./context.js";import{isGroupTreeMenu as s,treeMenuCssVars as c}from"./shared.js";import l from"./tree-menu-option.js";import{Fragment as u,computed as d,createBlock as f,createCommentVNode as p,createElementBlock as m,createElementVNode as h,createSlots as g,createVNode as _,defineComponent as v,mergeProps as y,openBlock as b,renderList as x,renderSlot as S,toDisplayString as C,toHandlers as w,unref as T,useSlots as E,withCtx as D}from"vue";import{useForwardListeners as O,useOmitProps as k,usePickProps as A}from"@soybeanjs/headless/composables";import{TreeMenuGroup as j,TreeMenuGroupLabel as M,TreeMenuGroupRoot as N,TreeMenuRoot as P,provideTreeMenuUi as F}from"@soybeanjs/headless";import{transformPropsToContext as I}from"@soybeanjs/headless/shared";var L=v({name:`STreeMenu`,__name:`tree-menu`,props:{class:{},size:{default:`md`},ui:{},side:{default:`left`},items:{},collapsedWidth:{default:50},indent:{default:16},showGroupIcon:{type:Boolean},groupRootProps:{},groupProps:{},groupLabelProps:{},modelValue:{},defaultValue:{},expanded:{},defaultExpanded:{},collapsed:{type:Boolean,default:void 0},defaultCollapsed:{type:Boolean},itemProps:{},buttonProps:{},linkProps:{},collapsibleProps:{},subProps:{}},emits:[`update:modelValue`,`update:expanded`,`update:collapsed`,`selectDropdown`],setup(v,{emit:L}){let R=v,z=L,B=E(),V=d(()=>Object.keys(B).filter(e=>e.startsWith(`item-`))),H=k(R,[`class`,`size`,`side`,`ui`,`items`,`collapsedWidth`,`indent`,`showGroupIcon`,`groupRootProps`,`groupProps`,`groupLabelProps`,`itemProps`,`buttonProps`,`linkProps`,`collapsibleProps`,`subProps`]),U=A(R,[`itemProps`,`buttonProps`,`linkProps`,`collapsibleProps`,`subProps`]),W=O(z),G=d(()=>{let e=R.collapsedWidth*n[R.size],r=R.indent*n[R.size];return{[c.collapsedWidth]:`${e/t.md}rem`,[c.indent]:`${r/t.md}rem`}}),K=d(()=>e(i({size:R.size}),R.ui,{root:R.class}));return F(K),o(K),a(I(R,[`size`,`side`])),(e,t)=>(b(),f(T(P),y(T(H),{style:G.value},w(T(W))),{default:D(()=>[S(e.$slots,`top`),(b(!0),m(u,null,x(v.items,t=>(b(),m(u,{key:t.value},[T(s)(t)?(b(),f(T(N),y({key:0,ref_for:!0},v.groupRootProps),{default:D(()=>[_(T(M),y({ref_for:!0},v.groupLabelProps),{default:D(()=>[S(e.$slots,`group-label`,{item:t},()=>[v.showGroupIcon&&t.icon?(b(),f(r,{key:0,icon:t.icon},null,8,[`icon`])):p(`v-if`,!0),h(`span`,null,C(t.label),1)])]),_:2},1040),_(T(j),y({ref_for:!0},v.groupProps),{default:D(()=>[(b(!0),m(u,null,x(t.children,t=>(b(),f(l,y({key:t.value},{ref_for:!0},T(U),{item:t}),g({_:2},[x(V.value,t=>({name:t,fn:D(n=>[S(e.$slots,t,y({ref_for:!0},n))])}))]),1040,[`item`]))),128))]),_:2},1040)]),_:2},1040)):(b(),f(l,y({key:1,as:`div`},{ref_for:!0},T(U),{item:t}),g({_:2},[x(V.value,t=>({name:t,fn:D(n=>[S(e.$slots,t,y({ref_for:!0},n))])}))]),1040,[`item`]))],64))),128)),S(e.$slots,`bottom`)]),_:3},16,[`style`]))}});export{L as default};

package/dist/components/tree-menu/tree-menu.vue.d.ts

@@ -1,9 +1,9 @@
-import { TreeMenuBaseOptionData, TreeMenuProps } from "./types.js";
-import * as vue302 from "vue";
+import { TreeMenuBaseOptionData, TreeMenuGroupOptionData, TreeMenuProps } from "./types.js";
+import * as vue231 from "vue";
 
 //#region src/components/tree-menu/tree-menu.vue.d.ts
 declare const __VLS_export: <T extends TreeMenuBaseOptionData = TreeMenuBaseOptionData>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-  props: vue302.PublicProps & __VLS_PrettifyLocal<TreeMenuProps<T> & {
+  props: vue231.PublicProps & __VLS_PrettifyLocal<TreeMenuProps<T> & {
     "onUpdate:modelValue"?: ((value: string) => any) | undefined;
     "onUpdate:expanded"?: ((value: string[]) => any) | undefined;
     "onUpdate:collapsed"?: ((value: boolean) => any) | undefined;
@@ -25,9 +25,12 @@ declare const __VLS_export: <T extends TreeMenuBaseOptionData = TreeMenuBaseOpti
     'item-trailing': (props: {
       item: T;
     }) => any;
+    'group-label': (props: {
+      item: TreeMenuGroupOptionData<T>;
+    }) => any;
   };
   emit: ((evt: "update:modelValue", value: string) => void) & ((evt: "update:expanded", value: string[]) => void) & ((evt: "update:collapsed", value: boolean) => void) & ((evt: "selectDropdown", value: string) => void);
-}>) => vue302.VNode & {
+}>) => vue231.VNode & {
   __ctx?: Awaited<typeof __VLS_setup>;
 };
 declare const _default: typeof __VLS_export;

package/dist/components/tree-menu/types.d.ts

@@ -7,7 +7,7 @@ import { DropdownMenuProps } from "../dropdown-menu/types.js";
 import { TagProps as TagProps$1 } from "../tag/types.js";
 import { TooltipProps } from "../tooltip/types.js";
 import { HTMLAttributes } from "vue";
-import { AsTag, ClassValue, HorizontalSide, LinkBaseProps, PropsToContext, TreeMenuBaseItemProps, TreeMenuButtonProps, TreeMenuCollapsibleProps, TreeMenuGroupLabelProps, TreeMenuGroupProps, TreeMenuGroupRootProps, TreeMenuRootEmits, TreeMenuRootProps, TreeMenuSubProps, TreeMenuUiSlot, UiClass } from "@soybeanjs/headless";
+import { AsTag, ClassValue, HorizontalSide, LinkBaseProps, LinkProps, PropsToContext, TreeMenuBaseItemProps, TreeMenuButtonProps, TreeMenuCollapsibleProps, TreeMenuGroupLabelProps, TreeMenuGroupProps, TreeMenuGroupRootProps, TreeMenuItemProps, TreeMenuRootEmits, TreeMenuRootProps, TreeMenuSubProps, TreeMenuUiSlot, UiClass } from "@soybeanjs/headless";
 
 //#region src/components/tree-menu/types.d.ts
 interface TreeMenuBaseOptionData extends TreeMenuBaseItemProps, LinkBaseProps {
@@ -71,10 +71,15 @@ type TreeMenuOptionData<T extends TreeMenuBaseOptionData = TreeMenuBaseOptionDat
 interface TreeMenuOptionProps {
   as?: AsTag;
   item: TreeMenuBaseOptionData;
+  itemProps?: TreeMenuItemProps;
+  buttonProps?: TreeMenuButtonProps;
+  linkProps?: LinkProps;
+  collapsibleProps?: TreeMenuCollapsibleProps;
+  subProps?: TreeMenuSubProps;
 }
 type TreeMenuExtraUiSlot = 'itemLabel' | 'itemAbsolute' | 'itemBadge' | 'itemTag' | 'itemAction' | 'itemLinkIcon' | 'collapsibleIcon';
 type TreeMenuExtendedUi = UiClass<TreeMenuUiSlot | TreeMenuExtraUiSlot>;
-interface TreeMenuProps<T extends TreeMenuBaseOptionData = TreeMenuBaseOptionData> extends TreeMenuRootProps {
+interface TreeMenuProps<T extends TreeMenuBaseOptionData = TreeMenuBaseOptionData> extends TreeMenuRootProps, Omit<TreeMenuOptionProps, 'as' | 'item'> {
   class?: ClassValue;
   size?: ThemeSize;
   ui?: Partial<TreeMenuExtendedUi>;
@@ -97,12 +102,15 @@ interface TreeMenuProps<T extends TreeMenuBaseOptionData = TreeMenuBaseOptionDat
    * @default 16
    */
   indent?: number;
+  /**
+   * Whether to show the group icon.
+   *
+   * @default false
+   */
+  showGroupIcon?: boolean;
   groupRootProps?: TreeMenuGroupRootProps;
   groupProps?: TreeMenuGroupProps;
   groupLabelProps?: TreeMenuGroupLabelProps;
-  buttonProps?: Omit<TreeMenuButtonProps, 'disabledActive'>;
-  collapsibleProps?: Omit<TreeMenuCollapsibleProps, 'as' | 'asChild'>;
-  subProps?: Omit<TreeMenuSubProps, 'as' | 'asChild'>;
 }
 interface TreeMenuOptionSlotProps extends TreeMenuOptionProps {
   showLinkIcon?: boolean;

package/dist/components/virtualizer/virtualizer.vue.d.ts

@@ -1,10 +1,10 @@
 import { VirtualizerProps } from "./types.js";
-import * as vue36 from "vue";
+import * as vue229 from "vue";
 import * as _tanstack_vue_virtual0 from "@tanstack/vue-virtual";
 
 //#region src/components/virtualizer/virtualizer.vue.d.ts
 declare const __VLS_export: <T extends Record<string, any>>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-  props: vue36.PublicProps & __VLS_PrettifyLocal<VirtualizerProps<T>> & (typeof globalThis extends {
+  props: vue229.PublicProps & __VLS_PrettifyLocal<VirtualizerProps<T>> & (typeof globalThis extends {
     __VLS_PROPS_FALLBACK: infer P;
   } ? P : {});
   expose: (exposed: {}) => void;
@@ -17,7 +17,7 @@ declare const __VLS_export: <T extends Record<string, any>>(__VLS_props: NonNull
     }) => any;
   };
   emit: {};
-}>) => vue36.VNode & {
+}>) => vue229.VNode & {
   __ctx?: Awaited<typeof __VLS_setup>;
 };
 declare const _default: typeof __VLS_export;

package/dist/variants/badge.d.ts

@@ -1,8 +1,8 @@
-import * as tailwind_variants9 from "tailwind-variants";
+import * as tailwind_variants1 from "tailwind-variants";
 import { VariantProps } from "tailwind-variants";
 
 //#region src/variants/badge.d.ts
-declare const badgeVariants: tailwind_variants9.TVReturnType<{
+declare const badgeVariants: tailwind_variants1.TVReturnType<{
   color: {
     primary: {
       content: string;
@@ -130,7 +130,7 @@ declare const badgeVariants: tailwind_variants9.TVReturnType<{
 }, {
   root: string;
   content: string;
-}, tailwind_variants9.TVReturnType<{
+}, tailwind_variants1.TVReturnType<{
   color: {
     primary: {
       content: string;

package/dist/variants/button.d.ts

@@ -1,8 +1,8 @@
-import * as tailwind_variants5 from "tailwind-variants";
+import * as tailwind_variants3 from "tailwind-variants";
 import { VariantProps } from "tailwind-variants";
 
 //#region src/variants/button.d.ts
-declare const buttonVariants: tailwind_variants5.TVReturnType<{
+declare const buttonVariants: tailwind_variants3.TVReturnType<{
   color: {
     primary: string;
     destructive: string;
@@ -92,7 +92,7 @@ declare const buttonVariants: tailwind_variants5.TVReturnType<{
     true: string;
     false: string;
   };
-}, undefined, tailwind_variants5.TVReturnType<{
+}, undefined, tailwind_variants3.TVReturnType<{
   color: {
     primary: string;
     destructive: string;

package/dist/variants/checkbox.d.ts

@@ -1,8 +1,8 @@
-import * as tailwind_variants1 from "tailwind-variants";
+import * as tailwind_variants7 from "tailwind-variants";
 import { VariantProps } from "tailwind-variants";
 
 //#region src/variants/checkbox.d.ts
-declare const checkboxVariants: tailwind_variants1.TVReturnType<{
+declare const checkboxVariants: tailwind_variants7.TVReturnType<{
   color: {
     primary: {
       control: string;
@@ -164,7 +164,7 @@ declare const checkboxVariants: tailwind_variants1.TVReturnType<{
   control: string[];
   indicator: string;
   label: string;
-}, tailwind_variants1.TVReturnType<{
+}, tailwind_variants7.TVReturnType<{
   color: {
     primary: {
       control: string;

package/dist/variants/radio-group.d.ts

@@ -1,8 +1,8 @@
-import * as tailwind_variants17 from "tailwind-variants";
+import * as tailwind_variants29 from "tailwind-variants";
 import { VariantProps } from "tailwind-variants";
 
 //#region src/variants/radio-group.d.ts
-declare const radioGroupVariants: tailwind_variants17.TVReturnType<{
+declare const radioGroupVariants: tailwind_variants29.TVReturnType<{
   color: {
     primary: {
       control: string;
@@ -180,7 +180,7 @@ declare const radioGroupVariants: tailwind_variants17.TVReturnType<{
   control: string[];
   indicator: string;
   label: string;
-}, tailwind_variants17.TVReturnType<{
+}, tailwind_variants29.TVReturnType<{
   color: {
     primary: {
       control: string;

package/dist/variants/separator.d.ts

@@ -1,8 +1,8 @@
-import * as tailwind_variants27 from "tailwind-variants";
+import * as tailwind_variants15 from "tailwind-variants";
 import { VariantProps } from "tailwind-variants";
 
 //#region src/variants/separator.d.ts
-declare const separatorVariants: tailwind_variants27.TVReturnType<{
+declare const separatorVariants: tailwind_variants15.TVReturnType<{
   size: {
     xs: {
       label: string;
@@ -114,7 +114,7 @@ declare const separatorVariants: tailwind_variants27.TVReturnType<{
 }, {
   root: string;
   label: string;
-}, tailwind_variants27.TVReturnType<{
+}, tailwind_variants15.TVReturnType<{
   size: {
     xs: {
       label: string;

package/dist/variants/switch.d.ts

@@ -1,8 +1,8 @@
-import * as tailwind_variants21 from "tailwind-variants";
+import * as tailwind_variants17 from "tailwind-variants";
 import { VariantProps } from "tailwind-variants";
 
 //#region src/variants/switch.d.ts
-declare const switchVariants: tailwind_variants21.TVReturnType<{
+declare const switchVariants: tailwind_variants17.TVReturnType<{
   color: {
     primary: {
       control: string;
@@ -136,7 +136,7 @@ declare const switchVariants: tailwind_variants21.TVReturnType<{
   root: string;
   control: string[];
   thumb: string;
-}, tailwind_variants21.TVReturnType<{
+}, tailwind_variants17.TVReturnType<{
   color: {
     primary: {
       control: string;

package/dist/variants/tabs.d.ts

@@ -1,8 +1,8 @@
-import * as tailwind_variants15 from "tailwind-variants";
+import * as tailwind_variants21 from "tailwind-variants";
 import { VariantProps } from "tailwind-variants";
 
 //#region src/variants/tabs.d.ts
-declare const tabsVariants: tailwind_variants15.TVReturnType<{
+declare const tabsVariants: tailwind_variants21.TVReturnType<{
   size: {
     xs: {
       root: string;
@@ -148,7 +148,7 @@ declare const tabsVariants: tailwind_variants15.TVReturnType<{
   indicator: string;
   indicatorContent: string;
   content: string;
-}, tailwind_variants15.TVReturnType<{
+}, tailwind_variants21.TVReturnType<{
   size: {
     xs: {
       root: string;

package/dist/variants/tag.d.ts

@@ -1,8 +1,8 @@
-import * as tailwind_variants31 from "tailwind-variants";
+import * as tailwind_variants19 from "tailwind-variants";
 import { VariantProps } from "tailwind-variants";
 
 //#region src/variants/tag.d.ts
-declare const tagVariants: tailwind_variants31.TVReturnType<{
+declare const tagVariants: tailwind_variants19.TVReturnType<{
   color: {
     primary: string;
     destructive: string;
@@ -64,7 +64,7 @@ declare const tagVariants: tailwind_variants31.TVReturnType<{
     auto: string;
     rounded: string;
   };
-}, undefined, tailwind_variants31.TVReturnType<{
+}, undefined, tailwind_variants19.TVReturnType<{
   color: {
     primary: string;
     destructive: string;

package/dist/variants/textarea.d.ts

@@ -1,8 +1,8 @@
-import * as tailwind_variants29 from "tailwind-variants";
+import * as tailwind_variants27 from "tailwind-variants";
 import { VariantProps } from "tailwind-variants";
 
 //#region src/variants/textarea.d.ts
-declare const textareaVariants: tailwind_variants29.TVReturnType<{
+declare const textareaVariants: tailwind_variants27.TVReturnType<{
   size: {
     xs: {
       root: string;
@@ -118,7 +118,7 @@ declare const textareaVariants: tailwind_variants29.TVReturnType<{
   control: string[];
   counter: string;
   clearable: string;
-}, tailwind_variants29.TVReturnType<{
+}, tailwind_variants27.TVReturnType<{
   size: {
     xs: {
       root: string;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@soybeanjs/ui",
   "type": "module",
-  "version": "0.1.8",
+  "version": "0.1.10",
   "description": "SoybeanUI is built on top of SoybeanHeadless, providing a collection of styled components for Vue 3.",
   "author": {
     "name": "Soybean",
@@ -55,7 +55,7 @@
     "tailwind-variants": "^3.2.2",
     "valibot": "^1.2.0",
     "zod": "^4.3.6",
-    "@soybeanjs/headless": "^0.1.8"
+    "@soybeanjs/headless": "^0.1.10"
   },
   "devDependencies": {
     "@soybeanjs/cli": "^1.4.4",