@soybeanjs/ui 0.16.0 → 0.18.0

package/dist/components/menubar/types.d.ts

@@ -1,17 +1,36 @@
 import { ThemeSize } from "../../theme/types.js";
-import { AlignSide, ClassValue, DefinedValue, MenubarCompactEmits, MenubarCompactProps, MenubarCompactSlots, MenubarUi } from "@soybeanjs/headless";
+import { MenubarCompactEmits, MenubarCompactProps, MenubarCompactSlots, MenubarUi } from "@soybeanjs/headless/menubar";
+import { AlignSide, ClassValue, DefinedValue } from "@soybeanjs/headless/types";
 
 //#region src/components/menubar/types.d.ts
+/**
+ * Properties for the Menubar component.
+ */
 interface MenubarProps<T extends DefinedValue = DefinedValue> extends MenubarCompactProps<T> {
   /**
    * class of menubar root
    */
   class?: ClassValue;
+  /**
+   * Visual size of the component.
+   */
   size?: ThemeSize;
+  /**
+   * Per-slot class overrides for the component.
+   */
   ui?: Partial<MenubarUi>;
+  /**
+   * Indicator position.
+   */
   indicatorPosition?: AlignSide;
 }
+/**
+ * Events for the Menubar component.
+ */
 type MenubarEmits<T extends DefinedValue = DefinedValue> = MenubarCompactEmits<T>;
+/**
+ * Slots for the Menubar component.
+ */
 type MenubarSlots<T extends DefinedValue = DefinedValue> = MenubarCompactSlots<T>;
 //#endregion
 export { MenubarEmits, MenubarProps, MenubarSlots };

package/dist/components/month-picker/index.d.ts

@@ -1,4 +1,3 @@
 import { MonthPickerEmits, MonthPickerProps, MonthPickerSlots } from "./types.js";
 import { _default } from "./month-picker.vue.js";
-import { MonthPickerPopupProps as MonthPickerPopupProps$1, MonthPickerRootEmits as MonthPickerRootEmits$1, MonthPickerRootProps as MonthPickerRootProps$1, MonthPickerTriggerProps as MonthPickerTriggerProps$1, MonthPickerUi as MonthPickerUi$1, MonthPickerUiSlot } from "@soybeanjs/headless/month-picker";
-export { type MonthPickerPopupProps$1 as MonthPickerPopupProps, type MonthPickerRootEmits$1 as MonthPickerRootEmits, type MonthPickerRootProps$1 as MonthPickerRootProps, type MonthPickerTriggerProps$1 as MonthPickerTriggerProps, type MonthPickerUi$1 as MonthPickerUi, type MonthPickerUiSlot };
+export * from "@soybeanjs/headless/month-picker";

package/dist/components/month-picker/month-picker.js

@@ -1 +1 @@
-import{mergeSlotVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import t from"../icon/icon.js";import{monthPickerVariants as n}from"./variants.js";import{computed as r,createBlock as i,createElementBlock as a,createTextVNode as o,createVNode as s,defineComponent as c,guardReactiveProps as l,mergeProps as u,normalizeProps as d,openBlock as f,renderSlot as p,toDisplayString as m,toHandlers as h,unref as g,withCtx as _}from"vue";import{useForwardListeners as v,useOmitProps as y}from"@soybeanjs/headless/composables";import{MonthPickerPopup as b,MonthPickerRoot as x,MonthPickerTrigger as S,provideMonthPickerUi as C}from"@soybeanjs/headless/month-picker";const w={key:0},T={key:1,class:`text-muted-foreground`},E=c({name:`SMonthPicker`,__name:`month-picker`,props:{class:{},size:{},ui:{},triggerProps:{},popupProps:{}},emits:[`update:modelValue`,`update:placeholder`,`update:open`],setup(c,{emit:E}){let D=c,O=v(E),k=y(D,[`class`,`size`,`ui`,`triggerProps`,`popupProps`]);return C(r(()=>e(n({size:D.size}),D.ui,{root:D.class}))),(e,n)=>(f(),i(g(x),u(g(k),h(g(O))),{default:_(n=>[s(g(S),d(l(c.triggerProps)),{default:_(()=>[p(e.$slots,`trigger`,{displayValue:n.displayValue,modelValue:n.modelValue,open:n.open},()=>[s(t,{class:`size-4`,icon:`lucide:calendar-range`}),n.displayValue?(f(),a(`span`,w,m(n.displayValue),1)):(f(),a(`span`,T,`Pick a month`))])]),_:2},1040),s(g(b),d(l(c.popupProps)),{heading:_(t=>[p(e.$slots,`heading`,d(l(t)),()=>[o(m(t.headingValue),1)])]),prev:_(n=>[p(e.$slots,`prev`,d(l(n)),()=>[s(t,{class:`size-4 rtl:rotate-180`,icon:`lucide:chevron-left`})])]),next:_(n=>[p(e.$slots,`next`,d(l(n)),()=>[s(t,{class:`size-4 rtl:rotate-180`,icon:`lucide:chevron-right`})])]),month:_(t=>[p(e.$slots,`month`,d(l(t)),()=>[o(m(t.label),1)])]),_:3},16),p(e.$slots,`default`,d(l(n)))]),_:3},16))}});export{E as default};
+import{mergeSlotVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import t from"../icon/icon.js";import{monthPickerVariants as n}from"./variants.js";import{computed as r,createBlock as i,createElementBlock as a,createTextVNode as o,createVNode as s,defineComponent as c,guardReactiveProps as l,mergeProps as u,normalizeProps as d,openBlock as f,renderSlot as p,toDisplayString as m,toHandlers as h,unref as g,withCtx as _}from"vue";import{useForwardListeners as v,useOmitProps as y}from"@soybeanjs/headless/composables";import{MonthPickerPopup as b,MonthPickerRoot as x,MonthPickerTrigger as S,provideMonthPickerUi as C}from"@soybeanjs/headless/month-picker";const w={key:0},T={key:1,class:`text-muted-foreground`},E=c({name:`SMonthPicker`,__name:`month-picker`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},triggerProps:{},popupProps:{}},emits:[`update:modelValue`,`update:placeholder`,`update:open`],setup(c,{emit:E}){let D=c,O=v(E),k=y(D,[`class`,`size`,`ui`,`triggerProps`,`popupProps`]);return C(r(()=>e(n({size:D.size}),D.ui,{root:D.class}))),(e,n)=>(f(),i(g(x),u(g(k),h(g(O))),{default:_(n=>[s(g(S),d(l(c.triggerProps)),{default:_(()=>[p(e.$slots,`trigger`,{displayValue:n.displayValue,modelValue:n.modelValue,open:n.open},()=>[s(t,{class:`size-4`,icon:`lucide:calendar-range`}),n.displayValue?(f(),a(`span`,w,m(n.displayValue),1)):(f(),a(`span`,T,`Pick a month`))])]),_:2},1040),s(g(b),d(l(c.popupProps)),{heading:_(t=>[p(e.$slots,`heading`,d(l(t)),()=>[o(m(t.headingValue),1)])]),prev:_(n=>[p(e.$slots,`prev`,d(l(n)),()=>[s(t,{class:`size-4 rtl:rotate-180`,icon:`lucide:chevron-left`})])]),next:_(n=>[p(e.$slots,`next`,d(l(n)),()=>[s(t,{class:`size-4 rtl:rotate-180`,icon:`lucide:chevron-right`})])]),month:_(t=>[p(e.$slots,`month`,d(l(t)),()=>[o(m(t.label),1)])]),_:3},16),p(e.$slots,`default`,d(l(n)))]),_:3},16))}});export{E as default};

package/dist/components/month-picker/types.d.ts

@@ -1,32 +1,71 @@
 import { ThemeSize } from "../../theme/types.js";
-import { ClassValue } from "@soybeanjs/headless";
 import { MonthPickerPopupProps, MonthPickerRootEmits, MonthPickerRootProps, MonthPickerTriggerProps, MonthPickerUi } from "@soybeanjs/headless/month-picker";
+import { ClassValue } from "@soybeanjs/headless/types";
 import { DateValue } from "@internationalized/date";
 
 //#region src/components/month-picker/types.d.ts
-interface MonthPickerProps extends /* @vue-ignore */MonthPickerRootProps {
+/**
+ * Properties for the MonthPicker component.
+ */
+interface MonthPickerProps extends /** @vue-ignore */MonthPickerRootProps {
+  /**
+   * Additional class names applied to the root element.
+   */
   class?: ClassValue;
+  /**
+   * Visual size of the component.
+   */
   size?: ThemeSize;
+  /**
+   * Per-slot class overrides for the component.
+   */
   ui?: Partial<MonthPickerUi>;
+  /**
+   * Properties forwarded to the trigger element.
+   */
   triggerProps?: MonthPickerTriggerProps;
+  /**
+   * Properties forwarded to the popup element.
+   */
   popupProps?: MonthPickerPopupProps;
 }
+/**
+ * Events for the MonthPicker component.
+ */
 type MonthPickerEmits = MonthPickerRootEmits;
+/**
+ * Slots for the MonthPicker component.
+ */
 interface MonthPickerSlots {
+  /**
+   * Custom content for the trigger slot.
+   */
   trigger?: (props: {
     displayValue: string;
     modelValue: DateValue | undefined;
     open: boolean;
   }) => any;
+  /**
+   * Custom content for the heading slot.
+   */
   heading?: (props: {
     headingValue: string;
   }) => any;
+  /**
+   * Custom content for the prev slot.
+   */
   prev?: (props: {
     disabled: boolean;
   }) => any;
+  /**
+   * Custom content for the next slot.
+   */
   next?: (props: {
     disabled: boolean;
   }) => any;
+  /**
+   * Custom content for the month slot.
+   */
   month?: (props: {
     date: DateValue;
     label: string;
@@ -34,6 +73,9 @@ interface MonthPickerSlots {
     focused: boolean;
     selected: boolean;
   }) => any;
+  /**
+   * Custom content for the default slot.
+   */
   default?: (props: {
     displayValue: string;
     modelValue: DateValue | undefined;

package/dist/components/month-range-picker/index.d.ts

@@ -1,4 +1,3 @@
 import { MonthRangePickerEmits, MonthRangePickerProps, MonthRangePickerSlots } from "./types.js";
 import { _default } from "./month-range-picker.vue.js";
-import { MonthRangePickerPopupProps as MonthRangePickerPopupProps$1, MonthRangePickerRootEmits as MonthRangePickerRootEmits$1, MonthRangePickerRootProps as MonthRangePickerRootProps$1, MonthRangePickerTriggerProps as MonthRangePickerTriggerProps$1, MonthRangePickerUi as MonthRangePickerUi$1, MonthRangePickerUiSlot } from "@soybeanjs/headless/month-range-picker";
-export { type MonthRangePickerPopupProps$1 as MonthRangePickerPopupProps, type MonthRangePickerRootEmits$1 as MonthRangePickerRootEmits, type MonthRangePickerRootProps$1 as MonthRangePickerRootProps, type MonthRangePickerTriggerProps$1 as MonthRangePickerTriggerProps, type MonthRangePickerUi$1 as MonthRangePickerUi, type MonthRangePickerUiSlot };
+export * from "@soybeanjs/headless/month-range-picker";

package/dist/components/month-range-picker/month-range-picker.js

@@ -1 +1 @@
-import{mergeSlotVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import t from"../icon/icon.js";import{monthRangePickerVariants as n}from"./variants.js";import{computed as r,createBlock as i,createElementBlock as a,createTextVNode as o,createVNode as s,defineComponent as c,guardReactiveProps as l,mergeProps as u,normalizeProps as d,openBlock as f,renderSlot as p,toDisplayString as m,toHandlers as h,unref as g,withCtx as _}from"vue";import{useForwardListeners as v,useOmitProps as y}from"@soybeanjs/headless/composables";import{MonthRangePickerPopup as b,MonthRangePickerRoot as x,MonthRangePickerTrigger as S,provideMonthRangePickerUi as C}from"@soybeanjs/headless/month-range-picker";const w={key:0},T={key:1,class:`text-muted-foreground`},E=c({name:`SMonthRangePicker`,__name:`month-range-picker`,props:{class:{},size:{},ui:{},triggerProps:{},popupProps:{}},emits:[`update:modelValue`,`update:placeholder`,`update:startValue`,`update:endValue`,`update:open`],setup(c,{emit:E}){let D=c,O=v(E),k=y(D,[`class`,`size`,`ui`,`triggerProps`,`popupProps`]);return C(r(()=>e(n({size:D.size}),D.ui,{root:D.class}))),(e,n)=>(f(),i(g(x),u(g(k),h(g(O))),{default:_(n=>[s(g(S),d(l(c.triggerProps)),{default:_(()=>[p(e.$slots,`trigger`,{displayValue:n.displayValue,modelValue:n.modelValue,open:n.open},()=>[s(t,{class:`size-4`,icon:`lucide:calendar-range`}),n.displayValue?(f(),a(`span`,w,m(n.displayValue),1)):(f(),a(`span`,T,`Pick a month range`))])]),_:2},1040),s(g(b),d(l(c.popupProps)),{heading:_(t=>[p(e.$slots,`heading`,d(l(t)),()=>[o(m(t.headingValue),1)])]),prev:_(n=>[p(e.$slots,`prev`,d(l(n)),()=>[s(t,{class:`size-4 rtl:rotate-180`,icon:`lucide:chevron-left`})])]),next:_(n=>[p(e.$slots,`next`,d(l(n)),()=>[s(t,{class:`size-4 rtl:rotate-180`,icon:`lucide:chevron-right`})])]),month:_(t=>[p(e.$slots,`month`,d(l(t)),()=>[o(m(t.label),1)])]),_:3},16),p(e.$slots,`default`,d(l(n)))]),_:3},16))}});export{E as default};
+import{mergeSlotVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import t from"../icon/icon.js";import{monthRangePickerVariants as n}from"./variants.js";import{computed as r,createBlock as i,createElementBlock as a,createTextVNode as o,createVNode as s,defineComponent as c,guardReactiveProps as l,mergeProps as u,normalizeProps as d,openBlock as f,renderSlot as p,toDisplayString as m,toHandlers as h,unref as g,withCtx as _}from"vue";import{useForwardListeners as v,useOmitProps as y}from"@soybeanjs/headless/composables";import{MonthRangePickerPopup as b,MonthRangePickerRoot as x,MonthRangePickerTrigger as S,provideMonthRangePickerUi as C}from"@soybeanjs/headless/month-range-picker";const w={key:0},T={key:1,class:`text-muted-foreground`},E=c({name:`SMonthRangePicker`,__name:`month-range-picker`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},triggerProps:{},popupProps:{}},emits:[`update:modelValue`,`update:placeholder`,`update:startValue`,`update:endValue`,`update:open`],setup(c,{emit:E}){let D=c,O=v(E),k=y(D,[`class`,`size`,`ui`,`triggerProps`,`popupProps`]);return C(r(()=>e(n({size:D.size}),D.ui,{root:D.class}))),(e,n)=>(f(),i(g(x),u(g(k),h(g(O))),{default:_(n=>[s(g(S),d(l(c.triggerProps)),{default:_(()=>[p(e.$slots,`trigger`,{displayValue:n.displayValue,modelValue:n.modelValue,open:n.open},()=>[s(t,{class:`size-4`,icon:`lucide:calendar-range`}),n.displayValue?(f(),a(`span`,w,m(n.displayValue),1)):(f(),a(`span`,T,`Pick a month range`))])]),_:2},1040),s(g(b),d(l(c.popupProps)),{heading:_(t=>[p(e.$slots,`heading`,d(l(t)),()=>[o(m(t.headingValue),1)])]),prev:_(n=>[p(e.$slots,`prev`,d(l(n)),()=>[s(t,{class:`size-4 rtl:rotate-180`,icon:`lucide:chevron-left`})])]),next:_(n=>[p(e.$slots,`next`,d(l(n)),()=>[s(t,{class:`size-4 rtl:rotate-180`,icon:`lucide:chevron-right`})])]),month:_(t=>[p(e.$slots,`month`,d(l(t)),()=>[o(m(t.label),1)])]),_:3},16),p(e.$slots,`default`,d(l(n)))]),_:3},16))}});export{E as default};

package/dist/components/month-range-picker/types.d.ts

@@ -1,32 +1,71 @@
 import { ThemeSize } from "../../theme/types.js";
-import { ClassValue } from "@soybeanjs/headless";
 import { MonthRangePickerPopupProps, MonthRangePickerRootEmits, MonthRangePickerRootProps, MonthRangePickerTriggerProps, MonthRangePickerUi } from "@soybeanjs/headless/month-range-picker";
+import { ClassValue } from "@soybeanjs/headless/types";
 import { DateRange, DateValue } from "@soybeanjs/headless/date";
 
 //#region src/components/month-range-picker/types.d.ts
-interface MonthRangePickerProps extends /* @vue-ignore */MonthRangePickerRootProps {
+/**
+ * Properties for the MonthRangePicker component.
+ */
+interface MonthRangePickerProps extends /** @vue-ignore */MonthRangePickerRootProps {
+  /**
+   * Additional class names applied to the root element.
+   */
   class?: ClassValue;
+  /**
+   * Visual size of the component.
+   */
   size?: ThemeSize;
+  /**
+   * Per-slot class overrides for the component.
+   */
   ui?: Partial<MonthRangePickerUi>;
+  /**
+   * Properties forwarded to the trigger element.
+   */
   triggerProps?: MonthRangePickerTriggerProps;
+  /**
+   * Properties forwarded to the popup element.
+   */
   popupProps?: MonthRangePickerPopupProps;
 }
+/**
+ * Events for the MonthRangePicker component.
+ */
 type MonthRangePickerEmits = MonthRangePickerRootEmits;
+/**
+ * Slots for the MonthRangePicker component.
+ */
 interface MonthRangePickerSlots {
+  /**
+   * Custom content for the trigger slot.
+   */
   trigger?: (props: {
     displayValue: string;
     modelValue: DateRange;
     open: boolean;
   }) => any;
+  /**
+   * Custom content for the heading slot.
+   */
   heading?: (props: {
     headingValue: string;
   }) => any;
+  /**
+   * Custom content for the prev slot.
+   */
   prev?: (props: {
     disabled: boolean;
   }) => any;
+  /**
+   * Custom content for the next slot.
+   */
   next?: (props: {
     disabled: boolean;
   }) => any;
+  /**
+   * Custom content for the month slot.
+   */
   month?: (props: {
     date: DateValue;
     label: string;
@@ -37,6 +76,9 @@ interface MonthRangePickerSlots {
     rangeStart: boolean;
     selected: boolean;
   }) => any;
+  /**
+   * Custom content for the default slot.
+   */
   default?: (props: {
     displayValue: string;
     modelValue: DateRange;

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

@@ -1,4 +1,3 @@
 import { NavigationMenuEmits, NavigationMenuExtendedUi, NavigationMenuExtraUi, NavigationMenuExtraUiSlot, NavigationMenuOptionData, NavigationMenuOptionEmits, NavigationMenuOptionProps, NavigationMenuProps, NavigationMenuSubOptionEmits, NavigationMenuSubOptionProps } from "./types.js";
 import { _default } from "./navigation-menu.vue.js";
-import { NavigationMenuContentEmits, NavigationMenuContentProps, NavigationMenuIndicatorProps, NavigationMenuItemProps, NavigationMenuLinkEmits, NavigationMenuLinkProps, NavigationMenuListProps, NavigationMenuRootEmits, NavigationMenuRootProps, NavigationMenuSubEmits, NavigationMenuSubListProps, NavigationMenuSubProps, NavigationMenuTriggerProps, NavigationMenuViewportProps } from "@soybeanjs/headless/navigation-menu";
-export { type NavigationMenuContentEmits, type NavigationMenuContentProps, type NavigationMenuIndicatorProps, type NavigationMenuItemProps, type NavigationMenuLinkEmits, type NavigationMenuLinkProps, type NavigationMenuListProps, type NavigationMenuRootEmits, type NavigationMenuRootProps, type NavigationMenuSubEmits, type NavigationMenuSubListProps, type NavigationMenuSubProps, type NavigationMenuTriggerProps, type NavigationMenuViewportProps };
+export * from "@soybeanjs/headless/navigation-menu";

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

@@ -1 +1 @@
-import e from"../icon/icon.js";import{useNavigationMenuExtraUi as t}from"./context.js";import n from"./navigation-menu-item-slot.js";import{useCommonSlotKeys as r}from"./shared.js";import i from"./navigation-menu-sub-option.js";import{Fragment as a,computed as o,createBlock as s,createElementBlock as c,createElementVNode as l,createSlots as u,createVNode as d,defineComponent as f,guardReactiveProps as p,mergeProps as m,normalizeClass as h,normalizeProps as g,openBlock as _,renderList as v,renderSlot as y,resolveDynamicComponent as b,toDisplayString as x,toHandlers as S,unref as C,useSlots as w,withCtx as T}from"vue";import{useForwardListeners as E}from"@soybeanjs/headless/composables";import{NavigationMenuContent as D,NavigationMenuItem as O,NavigationMenuLink as k,NavigationMenuSubList as A,NavigationMenuTrigger as j}from"@soybeanjs/headless";const M=f({name:`SNavigationMenuOption`,__name:`navigation-menu-option`,props:{item:{},itemProps:{},linkProps:{},triggerProps:{},contentProps:{},viewportProps:{},indicatorProps:{},listProps:{},subListProps:{},subItemProps:{}},emits:[`update:modelValue`,`escapeKeyDown`,`pointerDownOutside`,`focusOutside`,`interactOutside`,`select`],setup(f,{emit:M}){let N=f,P=M,F=w(),I=E(P),L=o(()=>Object.keys(F)),R=r(F),z=t(),B=o(()=>!!(N.item.to||N.item.href)),V=o(()=>B.value?{...N.linkProps,disabled:N.item.disabled,to:N.item.to,href:N.item.href,target:N.item.target,external:N.item.external}:{});return(t,r)=>(_(),s(C(O),m(f.itemProps,{value:f.item.value}),{default:T(()=>[f.item.children?.length?(_(),c(a,{key:1},[d(C(j),m(f.triggerProps,{disabled:f.item.disabled,"as-child":B.value}),{default:T(()=>[(_(),s(b(B.value?C(k):`template`),m(V.value,{onSelect:r[1]||=e=>P(`select`,e)}),{default:T(()=>[d(n,{icon:f.item.icon},u({"trigger-icon":T(()=>[y(t.$slots,`item-trigger-icon`,{item:f.item},()=>[d(e,{icon:`lucide:chevron-down`,class:h(C(z).triggerIcon)},null,8,[`class`])])]),default:T(()=>[l(`span`,null,x(f.item.label),1)]),_:2},[v(C(R),e=>({name:e,fn:T(()=>[y(t.$slots,e,{item:f.item,isTrigger:!0})])}))]),1032,[`icon`])]),_:3},16))]),_:3},16,[`disabled`,`as-child`]),d(C(D),m(f.contentProps,S(C(I))),{default:T(()=>[d(C(A),g(p(f.subListProps)),{default:T(()=>[(_(!0),c(a,null,v(f.item.children,e=>(_(),s(i,{key:e.value,"sub-item":e,"sub-item-props":f.subItemProps,onSelect:r[2]||=e=>P(`select`,e)},u({"item-children":T(e=>[y(t.$slots,`item-children`,{item:e.item})]),_:2},[v(L.value,n=>({name:n,fn:T(()=>[y(t.$slots,n,{item:e})])}))]),1032,[`sub-item`,`sub-item-props`]))),128))]),_:3},16)]),_:3},16)],64)):(_(),s(C(k),m({key:0},V.value,{onSelect:r[0]||=e=>P(`select`,e)}),{default:T(({isHref:r})=>[d(n,{icon:f.item.icon},u({default:T(()=>[l(`span`,null,x(f.item.label),1)]),_:2},[v(C(R),e=>({name:e,fn:T(()=>[y(t.$slots,e,{item:f.item})])})),r?{name:`link-icon`,fn:T(()=>[y(t.$slots,`item-link-icon`,{item:f.item},()=>[d(e,{icon:`lucide:arrow-up-right`,class:h(C(z).linkIcon)},null,8,[`class`])])]),key:`0`}:void 0]),1032,[`icon`])]),_:3},16))]),_:3},16,[`value`]))}});export{M as default};
+import e from"../icon/icon.js";import{useNavigationMenuExtraUi as t}from"./context.js";import n from"./navigation-menu-item-slot.js";import{useCommonSlotKeys as r}from"./shared.js";import i from"./navigation-menu-sub-option.js";import{Fragment as a,computed as o,createBlock as s,createElementBlock as c,createElementVNode as l,createSlots as u,createVNode as d,defineComponent as f,guardReactiveProps as p,mergeProps as m,normalizeClass as h,normalizeProps as g,openBlock as _,renderList as v,renderSlot as y,resolveDynamicComponent as b,toDisplayString as x,toHandlers as S,unref as C,useSlots as w,withCtx as T}from"vue";import{useForwardListeners as E}from"@soybeanjs/headless/composables";import{NavigationMenuContent as D,NavigationMenuItem as O,NavigationMenuLink as k,NavigationMenuSubList as A,NavigationMenuTrigger as j}from"@soybeanjs/headless/navigation-menu";const M=f({name:`SNavigationMenuOption`,__name:`navigation-menu-option`,props:{item:{},itemProps:{},linkProps:{},triggerProps:{},contentProps:{},viewportProps:{},indicatorProps:{},listProps:{},subListProps:{},subItemProps:{}},emits:[`update:modelValue`,`escapeKeyDown`,`pointerDownOutside`,`focusOutside`,`interactOutside`,`select`],setup(f,{emit:M}){let N=f,P=M,F=w(),I=E(P),L=o(()=>Object.keys(F)),R=r(F),z=t(),B=o(()=>!!(N.item.to||N.item.href)),V=o(()=>B.value?{...N.linkProps,disabled:N.item.disabled,to:N.item.to,href:N.item.href,target:N.item.target,external:N.item.external}:{});return(t,r)=>(_(),s(C(O),m(f.itemProps,{value:f.item.value}),{default:T(()=>[f.item.children?.length?(_(),c(a,{key:1},[d(C(j),m(f.triggerProps,{disabled:f.item.disabled,"as-child":B.value}),{default:T(()=>[(_(),s(b(B.value?C(k):`template`),m(V.value,{onSelect:r[1]||=e=>P(`select`,e)}),{default:T(()=>[d(n,{icon:f.item.icon},u({"trigger-icon":T(()=>[y(t.$slots,`item-trigger-icon`,{item:f.item},()=>[d(e,{icon:`lucide:chevron-down`,class:h(C(z).triggerIcon)},null,8,[`class`])])]),default:T(()=>[l(`span`,null,x(f.item.label),1)]),_:2},[v(C(R),e=>({name:e,fn:T(()=>[y(t.$slots,e,{item:f.item,isTrigger:!0})])}))]),1032,[`icon`])]),_:3},16))]),_:3},16,[`disabled`,`as-child`]),d(C(D),m(f.contentProps,S(C(I))),{default:T(()=>[d(C(A),g(p(f.subListProps)),{default:T(()=>[(_(!0),c(a,null,v(f.item.children,e=>(_(),s(i,{key:e.value,"sub-item":e,"sub-item-props":f.subItemProps,onSelect:r[2]||=e=>P(`select`,e)},u({"item-children":T(e=>[y(t.$slots,`item-children`,{item:e.item})]),_:2},[v(L.value,n=>({name:n,fn:T(()=>[y(t.$slots,n,{item:e})])}))]),1032,[`sub-item`,`sub-item-props`]))),128))]),_:3},16)]),_:3},16)],64)):(_(),s(C(k),m({key:0},V.value,{onSelect:r[0]||=e=>P(`select`,e)}),{default:T(({isHref:r})=>[d(n,{icon:f.item.icon},u({default:T(()=>[l(`span`,null,x(f.item.label),1)]),_:2},[v(C(R),e=>({name:e,fn:T(()=>[y(t.$slots,e,{item:f.item})])})),r?{name:`link-icon`,fn:T(()=>[y(t.$slots,`item-link-icon`,{item:f.item},()=>[d(e,{icon:`lucide:arrow-up-right`,class:h(C(z).linkIcon)},null,8,[`class`])])]),key:`0`}:void 0]),1032,[`icon`])]),_:3},16))]),_:3},16,[`value`]))}});export{M as default};

package/dist/components/navigation-menu/navigation-menu-sub-option.js

@@ -1 +1 @@
-import e from"../icon/icon.js";import{useNavigationMenuExtraUi as t}from"./context.js";import n from"./navigation-menu-item-slot.js";import{useCommonSlotKeys as r}from"./shared.js";import{computed as i,createBlock as a,createCommentVNode as o,createElementVNode as s,createSlots as c,createVNode as l,defineComponent as u,mergeProps as d,normalizeClass as f,openBlock as p,renderList as m,renderSlot as h,resolveDynamicComponent as g,toDisplayString as _,unref as v,useSlots as y,withCtx as b}from"vue";import{NavigationMenuItem as x,NavigationMenuLink as S}from"@soybeanjs/headless";const C=u({name:`SNavigationMenuSubOption`,__name:`navigation-menu-sub-option`,props:{subItem:{},subItemProps:{},linkProps:{}},emits:[`select`],setup(u,{emit:C}){let w=u,T=C,E=r(y()),D=t(),O=i(()=>!!(w.subItem.to||w.subItem.href)),k=i(()=>O.value?{...w.linkProps,disabled:w.subItem.disabled,to:w.subItem.to,href:w.subItem.href,target:w.subItem.target,external:w.subItem.external}:{});return(t,r)=>(p(),a(v(x),d(u.subItemProps,{value:u.subItem.value}),{default:b(()=>[(p(),a(g(O.value?v(S):`div`),d(k.value,{onSelect:r[0]||=e=>T(`select`,e)}),{default:b(r=>[l(n,{icon:u.subItem.icon},c({default:b(()=>[s(`div`,{class:f(v(D).subLinkContent)},[s(`span`,{class:f(v(D).subLinkLabel)},_(u.subItem.label),3),s(`p`,{class:f(v(D).subLinkDescription)},_(u.subItem.description),3)],2)]),_:2},[m(v(E),e=>({name:e,fn:b(()=>[h(t.$slots,e,{item:u.subItem})])})),r?.isHref?{name:`link-icon`,fn:b(()=>[h(t.$slots,`item-link-icon`,{item:u.subItem},()=>[l(e,{icon:`lucide:arrow-up-right`,class:f(v(D).linkIcon)},null,8,[`class`])])]),key:`0`}:void 0]),1032,[`icon`])]),_:3},16)),u.subItem.children?.length?h(t.$slots,`item-children`,{key:0,item:u.subItem}):o(`v-if`,!0)]),_:3},16,[`value`]))}});export{C as default};
+import e from"../icon/icon.js";import{useNavigationMenuExtraUi as t}from"./context.js";import n from"./navigation-menu-item-slot.js";import{useCommonSlotKeys as r}from"./shared.js";import{computed as i,createBlock as a,createCommentVNode as o,createElementVNode as s,createSlots as c,createVNode as l,defineComponent as u,mergeProps as d,normalizeClass as f,openBlock as p,renderList as m,renderSlot as h,resolveDynamicComponent as g,toDisplayString as _,unref as v,useSlots as y,withCtx as b}from"vue";import{NavigationMenuItem as x,NavigationMenuLink as S}from"@soybeanjs/headless/navigation-menu";const C=u({name:`SNavigationMenuSubOption`,__name:`navigation-menu-sub-option`,props:{subItem:{},subItemProps:{},linkProps:{}},emits:[`select`],setup(u,{emit:C}){let w=u,T=C,E=r(y()),D=t(),O=i(()=>!!(w.subItem.to||w.subItem.href)),k=i(()=>O.value?{...w.linkProps,disabled:w.subItem.disabled,to:w.subItem.to,href:w.subItem.href,target:w.subItem.target,external:w.subItem.external}:{});return(t,r)=>(p(),a(v(x),d(u.subItemProps,{value:u.subItem.value}),{default:b(()=>[(p(),a(g(O.value?v(S):`div`),d(k.value,{onSelect:r[0]||=e=>T(`select`,e)}),{default:b(r=>[l(n,{icon:u.subItem.icon},c({default:b(()=>[s(`div`,{class:f(v(D).subLinkContent)},[s(`span`,{class:f(v(D).subLinkLabel)},_(u.subItem.label),3),s(`p`,{class:f(v(D).subLinkDescription)},_(u.subItem.description),3)],2)]),_:2},[m(v(E),e=>({name:e,fn:b(()=>[h(t.$slots,e,{item:u.subItem})])})),r?.isHref?{name:`link-icon`,fn:b(()=>[h(t.$slots,`item-link-icon`,{item:u.subItem},()=>[l(e,{icon:`lucide:arrow-up-right`,class:f(v(D).linkIcon)},null,8,[`class`])])]),key:`0`}:void 0]),1032,[`icon`])]),_:3},16)),u.subItem.children?.length?h(t.$slots,`item-children`,{key:0,item:u.subItem}):o(`v-if`,!0)]),_:3},16,[`value`]))}});export{C as default};

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

@@ -1 +1 @@
-import{mergeSlotVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{provideNavigationMenuExtraUi as t}from"./context.js";import{navigationMenuVariants as n}from"./variants.js";import r from"./navigation-menu-option.js";import{Fragment as i,computed as a,createBlock as o,createElementBlock as s,createElementVNode as c,createSlots as l,createVNode as u,defineComponent as d,guardReactiveProps as f,mergeProps as p,normalizeClass as m,normalizeProps as h,openBlock as g,renderList as _,renderSlot as v,toHandlers as y,unref as b,useSlots as x,withCtx as S}from"vue";import{useForwardListeners as C,useOmitProps as w,usePickProps as T}from"@soybeanjs/headless/composables";import{NavigationMenuIndicator as E,NavigationMenuList as D,NavigationMenuRoot as O,NavigationMenuViewport as k,provideNavigationMenuUi as A}from"@soybeanjs/headless";const j=d({name:`SNavigationMenu`,__name:`navigation-menu`,props:{class:{},size:{},ui:{},items:{},modelValue:{},defaultValue:{},dir:{},orientation:{},delayDuration:{},skipDelayDuration:{},disableClickTrigger:{type:Boolean},disableHoverTrigger:{type:Boolean},disablePointerLeaveClose:{type:Boolean},unmountOnHide:{type:Boolean},itemProps:{},linkProps:{},triggerProps:{},contentProps:{},viewportProps:{},indicatorProps:{},listProps:{},subListProps:{},subItemProps:{}},emits:[`update:modelValue`,`escapeKeyDown`,`pointerDownOutside`,`focusOutside`,`interactOutside`,`select`],setup(d,{emit:j}){let M=d,N=j,P=x(),F=[`itemProps`,`linkProps`,`triggerProps`,`contentProps`,`viewportProps`,`indicatorProps`,`listProps`,`subListProps`,`subItemProps`],I=w(M,[`class`,`size`,`ui`,`items`,...F]),L=T(M,[...F]),R=C(N),z=a(()=>Object.keys(P)),B=a(()=>e(n({size:M.size}),M.ui,{root:M.class}));return A(B),t(B),(e,t)=>(g(),o(b(O),p(b(I),{"onUpdate:modelValue":t[0]||=e=>N(`update:modelValue`,e)}),{default:S(()=>[u(b(D),h(f(d.listProps)),{default:S(()=>[(g(!0),s(i,null,_(d.items,t=>(g(),o(r,p({key:t.value},{ref_for:!0},b(L),{item:t},y(b(R))),l({"item-children":S(t=>[v(e.$slots,`item-children`,{item:t.item})]),_:2},[_(z.value,t=>({name:t,fn:S(n=>[v(e.$slots,t,p({ref_for:!0},n))])}))]),1040,[`item`]))),128))]),_:3},16),u(b(E),h(f(d.indicatorProps)),{default:S(()=>[c(`div`,{class:m(B.value?.arrow)},null,2)]),_:1},16),c(`div`,{class:m(B.value?.viewportRoot)},[u(b(k),h(f(d.viewportProps)),null,16)],2)]),_:3},16))}});export{j as default};
+import{mergeSlotVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{provideNavigationMenuExtraUi as t}from"./context.js";import{navigationMenuVariants as n}from"./variants.js";import r from"./navigation-menu-option.js";import{Fragment as i,computed as a,createBlock as o,createElementBlock as s,createElementVNode as c,createSlots as l,createVNode as u,defineComponent as d,guardReactiveProps as f,mergeProps as p,normalizeClass as m,normalizeProps as h,openBlock as g,renderList as _,renderSlot as v,toHandlers as y,unref as b,useSlots as x,withCtx as S}from"vue";import{useForwardListeners as C,useOmitProps as w,usePickProps as T}from"@soybeanjs/headless/composables";import{NavigationMenuIndicator as E,NavigationMenuList as D,NavigationMenuRoot as O,NavigationMenuViewport as k,provideNavigationMenuUi as A}from"@soybeanjs/headless/navigation-menu";const j=d({name:`SNavigationMenu`,__name:`navigation-menu`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},items:{},modelValue:{},defaultValue:{},dir:{},orientation:{},delayDuration:{},skipDelayDuration:{},disableClickTrigger:{type:Boolean},disableHoverTrigger:{type:Boolean},disablePointerLeaveClose:{type:Boolean},unmountOnHide:{type:Boolean},itemProps:{},linkProps:{},triggerProps:{},contentProps:{},viewportProps:{},indicatorProps:{},listProps:{},subListProps:{},subItemProps:{}},emits:[`update:modelValue`,`escapeKeyDown`,`pointerDownOutside`,`focusOutside`,`interactOutside`,`select`],setup(d,{emit:j}){let M=d,N=j,P=x(),F=[`itemProps`,`linkProps`,`triggerProps`,`contentProps`,`viewportProps`,`indicatorProps`,`listProps`,`subListProps`,`subItemProps`],I=w(M,[`class`,`size`,`ui`,`items`,...F]),L=T(M,[...F]),R=C(N),z=a(()=>Object.keys(P)),B=a(()=>e(n({size:M.size}),M.ui,{root:M.class}));return A(B),t(B),(e,t)=>(g(),o(b(O),p(b(I),{"onUpdate:modelValue":t[0]||=e=>N(`update:modelValue`,e)}),{default:S(()=>[u(b(D),h(f(d.listProps)),{default:S(()=>[(g(!0),s(i,null,_(d.items,t=>(g(),o(r,p({key:t.value},{ref_for:!0},b(L),{item:t},y(b(R))),l({"item-children":S(t=>[v(e.$slots,`item-children`,{item:t.item})]),_:2},[_(z.value,t=>({name:t,fn:S(n=>[v(e.$slots,t,p({ref_for:!0},n))])}))]),1040,[`item`]))),128))]),_:3},16),u(b(E),h(f(d.indicatorProps)),{default:S(()=>[c(`div`,{class:m(B.value?.arrow)},null,2)]),_:1},16),c(`div`,{class:m(B.value?.viewportRoot)},[u(b(k),h(f(d.viewportProps)),null,16)],2)]),_:3},16))}});export{j as default};

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

@@ -1,8 +1,13 @@
 import { ThemeSize } from "../../theme/types.js";
 import { IconValue } from "../icon/types.js";
-import { ClassValue, LinkBaseProps, NavigationMenuContentEmits, NavigationMenuContentProps, NavigationMenuIndicatorProps, NavigationMenuItemProps, NavigationMenuLinkEmits, NavigationMenuLinkProps, NavigationMenuListProps, NavigationMenuRootEmits, NavigationMenuRootProps, NavigationMenuSubEmits, NavigationMenuTriggerProps, NavigationMenuUi, NavigationMenuViewportProps, UiClass } from "@soybeanjs/headless";
+import { LinkBaseProps } from "@soybeanjs/headless/link";
+import { NavigationMenuContentEmits, NavigationMenuContentProps, NavigationMenuIndicatorProps, NavigationMenuItemProps, NavigationMenuLinkEmits, NavigationMenuLinkProps, NavigationMenuListProps, NavigationMenuRootEmits, NavigationMenuRootProps, NavigationMenuSubEmits, NavigationMenuTriggerProps, NavigationMenuUiSlot, NavigationMenuViewportProps } from "@soybeanjs/headless/navigation-menu";
+import { ClassValue, UiClass } from "@soybeanjs/headless/types";
 
 //#region src/components/navigation-menu/types.d.ts
+/**
+ * Option data for the NavigationMenu component.
+ */
 interface NavigationMenuOptionData extends LinkBaseProps {
   /** The value of the option. */
   value: string;
@@ -21,34 +26,112 @@ interface NavigationMenuOptionData extends LinkBaseProps {
   /** The children of the option. */
   children?: NavigationMenuOptionData[];
 }
+/**
+ * Additional UI slots for the navigation menu component.
+ */
 type NavigationMenuExtraUiSlot = 'triggerIcon' | 'linkIcon' | 'arrow' | 'viewportRoot' | 'subItemContent' | 'subLinkContent' | 'subLinkLabel' | 'subLinkDescription';
+/**
+ * UI class overrides for the NavigationMenuExtra component.
+ */
 type NavigationMenuExtraUi = UiClass<NavigationMenuExtraUiSlot>;
-type NavigationMenuExtendedUi = NavigationMenuUi & NavigationMenuExtraUi;
+/**
+ * Extended UI class overrides for the NavigationMenu component.
+ */
+type NavigationMenuExtendedUi = UiClass<NavigationMenuUiSlot | NavigationMenuExtraUiSlot>;
+/**
+ * Properties for the NavigationMenuSubOption component.
+ */
 interface NavigationMenuSubOptionProps {
+  /**
+   * Sub item.
+   */
   subItem: NavigationMenuOptionData;
+  /**
+   * Properties forwarded to the sub item element.
+   */
   subItemProps?: NavigationMenuItemProps;
+  /**
+   * Properties forwarded to the link element.
+   */
   linkProps?: NavigationMenuLinkProps;
 }
+/**
+ * Events for the NavigationMenuSubOption component.
+ */
 type NavigationMenuSubOptionEmits = NavigationMenuLinkEmits;
+/**
+ * Properties for the NavigationMenuOption component.
+ */
 interface NavigationMenuOptionProps {
+  /**
+   * Current item data.
+   */
   item: NavigationMenuOptionData;
+  /**
+   * Properties forwarded to the item element.
+   */
   itemProps?: NavigationMenuItemProps;
+  /**
+   * Properties forwarded to the link element.
+   */
   linkProps?: NavigationMenuLinkProps;
+  /**
+   * Properties forwarded to the trigger element.
+   */
   triggerProps?: NavigationMenuTriggerProps;
+  /**
+   * Properties forwarded to the content element.
+   */
   contentProps?: NavigationMenuContentProps;
+  /**
+   * Properties forwarded to the viewport element.
+   */
   viewportProps?: NavigationMenuViewportProps;
+  /**
+   * Properties forwarded to the indicator element.
+   */
   indicatorProps?: NavigationMenuIndicatorProps;
+  /**
+   * Properties forwarded to the list element.
+   */
   listProps?: NavigationMenuListProps;
+  /**
+   * Properties forwarded to the sub list element.
+   */
   subListProps?: NavigationMenuListProps;
+  /**
+   * Properties forwarded to the sub item element.
+   */
   subItemProps?: NavigationMenuItemProps;
 }
+/**
+ * Events for the NavigationMenuOption component.
+ */
 type NavigationMenuOptionEmits = NavigationMenuSubEmits & NavigationMenuContentEmits & NavigationMenuLinkEmits;
+/**
+ * Properties for the NavigationMenu component.
+ */
 interface NavigationMenuProps extends NavigationMenuRootProps, Omit<NavigationMenuOptionProps, 'item'> {
+  /**
+   * Additional class names applied to the root element.
+   */
   class?: ClassValue;
+  /**
+   * Visual size of the component.
+   */
   size?: ThemeSize;
+  /**
+   * Per-slot class overrides for the component.
+   */
   ui?: Partial<NavigationMenuExtendedUi>;
+  /**
+   * Items rendered by the component.
+   */
   items: NavigationMenuOptionData[];
 }
+/**
+ * Events for the NavigationMenu component.
+ */
 type NavigationMenuEmits = NavigationMenuRootEmits & NavigationMenuOptionEmits;
 //#endregion
 export { NavigationMenuEmits, NavigationMenuExtendedUi, NavigationMenuExtraUi, NavigationMenuExtraUiSlot, NavigationMenuOptionData, NavigationMenuOptionEmits, NavigationMenuOptionProps, NavigationMenuProps, NavigationMenuSubOptionEmits, NavigationMenuSubOptionProps };

package/dist/components/page-tabs/index.d.ts

@@ -1,3 +1,4 @@
 import { PageTabsVariant } from "./variants.js";
 import { PageTabsContextMenuOptionData, PageTabsEmits, PageTabsExtendedUi, PageTabsExtraUiSlot, PageTabsOptionData, PageTabsProps, PageTabsState } from "./types.js";
-import { _default } from "./page-tabs.vue.js";
+import { _default } from "./page-tabs.vue.js";
+export * from "@soybeanjs/headless/page-tabs";

package/dist/components/page-tabs/page-tabs.js

@@ -1 +1 @@
-import{mergeSlotVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import t from"../icon/icon.js";import n from"../context-menu/context-menu.js";import{usePageTabsState as r}from"./hooks.js";import{pageTabsVariants as i}from"./variants.js";import{Fragment as a,computed as o,createBlock as s,createCommentVNode as c,createElementBlock as l,createElementVNode as u,createVNode as d,defineComponent as f,isRef as p,mergeProps as m,normalizeClass as h,openBlock as g,renderList as _,shallowRef as v,toDisplayString as y,unref as b,watchEffect as x,withCtx as S}from"vue";import{useControllableState as C,useOmitProps as w}from"@soybeanjs/headless/composables";import{PageTabsClose as T,PageTabsItem as E,PageTabsPin as D,PageTabsRoot as O,providePageTabsUi as k}from"@soybeanjs/headless";const A=f({name:`SPageTabs`,__name:`page-tabs`,props:{class:{},size:{},variant:{default:`chrome`},ui:{},items:{},menuFactory:{},beforeClose:{type:Function,default:()=>!0},modelValue:{},middleClickClose:{type:Boolean}},emits:[`update:modelValue`,`update:items`,`click`,`close`,`pin`,`contextmenu`,`selectContextMenu`],setup(f,{emit:A}){let j=f,M=A,N=w(j,[`class`,`size`,`variant`,`ui`,`modelValue`,`items`,`menuFactory`,`beforeClose`]),P=C(()=>j.modelValue,e=>{M(`update:modelValue`,e??``)},``),F=C(()=>j.items,e=>{M(`update:items`,e)},[]),{closeTab:I,pinTab:L,sortTabs:R,getState:z}=r({items:F,modelValue:P,beforeClose:j.beforeClose}),B=v(null),V=v(null),H=o(()=>{if(!B.value||!j.menuFactory)return[];let e=z(B.value);return j.menuFactory(B.value,e)}),U=e=>{I(e.value,()=>{M(`close`,e)})},W=(e,t)=>{L(e,t),M(`pin`,e)},G=(e,t)=>{V.value=e.currentTarget,B.value=t,M(`contextmenu`,t)},K=async e=>{B.value&&(await e.action?.(),M(`selectContextMenu`,e,B.value))},q=o(()=>e(i({size:j.size,variant:j.variant}),j.ui,{root:j.class}));return x(()=>{R()}),k(q),(e,r)=>(g(),s(b(O),m(b(N),{modelValue:b(P),"onUpdate:modelValue":r[0]||=e=>p(P)?P.value=e:null}),{default:S(()=>[(g(!0),l(a,null,_(b(F),e=>(g(),s(b(E),{key:e.value,value:e.value,pinned:e.pinned,onClick:t=>M(`click`,e),onClose:t=>U(e),onPin:t=>W(e,t),onPointerenter:t=>G(t,e)},{default:S(()=>[d(t,{icon:e.icon},null,8,[`icon`]),u(`span`,{class:h(q.value.itemText)},y(e.label),3),e.hidePinnedIcon?c(`v-if`,!0):(g(),s(b(D),{key:0,"as-child":``},{default:S(()=>[d(t,{icon:`lucide:pin`})]),_:1})),d(b(T),{"as-child":``},{default:S(()=>[d(t,{icon:`lucide:x`})]),_:1}),f.variant===`chrome`?(g(),l(a,{key:1},[(g(),l(`svg`,{height:`100%`,width:`100%`,viewBox:`0 0 8 8`,class:h(q.value.chromeBgLeft)},[...r[1]||=[u(`path`,{d:`M 0 8 A 8 8 0 0 0 8 0 L 8 8 Z`},null,-1)]],2)),(g(),l(`svg`,{height:`100%`,width:`100%`,viewBox:`0 0 8 8`,class:h(q.value.chromeBgRight)},[...r[2]||=[u(`path`,{d:`M 0 0 A 8 8 0 0 0 8 8 L 0 8 Z`},null,-1)]],2))],64)):c(`v-if`,!0),f.variant===`slider`?(g(),l(`div`,{key:2,class:h(q.value.sliderIndicator)},null,2)):c(`v-if`,!0)]),_:2},1032,[`value`,`pinned`,`onClick`,`onClose`,`onPin`,`onPointerenter`]))),128)),H.value.length?(g(),s(n,{key:0,modal:!1,items:H.value,"trigger-props":{reference:V.value},onSelect:K},null,8,[`items`,`trigger-props`])):c(`v-if`,!0)]),_:1},16,[`modelValue`]))}});export{A as default};
+import{mergeSlotVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import t from"../icon/icon.js";import n from"../context-menu/context-menu.js";import{usePageTabsState as r}from"./hooks.js";import{pageTabsVariants as i}from"./variants.js";import{Fragment as a,computed as o,createBlock as s,createCommentVNode as c,createElementBlock as l,createElementVNode as u,createVNode as d,defineComponent as f,isRef as p,mergeProps as m,normalizeClass as h,openBlock as g,renderList as _,shallowRef as v,toDisplayString as y,unref as b,watchEffect as x,withCtx as S}from"vue";import{useControllableState as C,useOmitProps as w}from"@soybeanjs/headless/composables";import{PageTabsClose as T,PageTabsItem as E,PageTabsPin as D,PageTabsRoot as O,providePageTabsUi as k}from"@soybeanjs/headless/page-tabs";const A=f({name:`SPageTabs`,__name:`page-tabs`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},variant:{default:`chrome`},ui:{},items:{},menuFactory:{},beforeClose:{type:Function,default:()=>!0},modelValue:{},middleClickClose:{type:Boolean}},emits:[`update:modelValue`,`update:items`,`click`,`close`,`pin`,`contextmenu`,`selectContextMenu`],setup(f,{emit:A}){let j=f,M=A,N=w(j,[`class`,`size`,`variant`,`ui`,`modelValue`,`items`,`menuFactory`,`beforeClose`]),P=C(()=>j.modelValue,e=>{M(`update:modelValue`,e??``)},``),F=C(()=>j.items,e=>{M(`update:items`,e)},[]),{closeTab:I,pinTab:L,sortTabs:R,getState:z}=r({items:F,modelValue:P,beforeClose:j.beforeClose}),B=v(null),V=v(null),H=o(()=>{if(!B.value||!j.menuFactory)return[];let e=z(B.value);return j.menuFactory(B.value,e)}),U=e=>{I(e.value,()=>{M(`close`,e)})},W=(e,t)=>{L(e,t),M(`pin`,e)},G=(e,t)=>{V.value=e.currentTarget,B.value=t,M(`contextmenu`,t)},K=async e=>{B.value&&(await e.action?.(),M(`selectContextMenu`,e,B.value))},q=o(()=>e(i({size:j.size,variant:j.variant}),j.ui,{root:j.class}));return x(()=>{R()}),k(q),(e,r)=>(g(),s(b(O),m(b(N),{modelValue:b(P),"onUpdate:modelValue":r[0]||=e=>p(P)?P.value=e:null}),{default:S(()=>[(g(!0),l(a,null,_(b(F),e=>(g(),s(b(E),{key:e.value,value:e.value,pinned:e.pinned,onClick:t=>M(`click`,e),onClose:t=>U(e),onPin:t=>W(e,t),onPointerenter:t=>G(t,e)},{default:S(()=>[d(t,{icon:e.icon},null,8,[`icon`]),u(`span`,{class:h(q.value.itemText)},y(e.label),3),e.hidePinnedIcon?c(`v-if`,!0):(g(),s(b(D),{key:0,"as-child":``},{default:S(()=>[d(t,{icon:`lucide:pin`})]),_:1})),d(b(T),{"as-child":``},{default:S(()=>[d(t,{icon:`lucide:x`})]),_:1}),f.variant===`chrome`?(g(),l(a,{key:1},[(g(),l(`svg`,{height:`100%`,width:`100%`,viewBox:`0 0 8 8`,class:h(q.value.chromeBgLeft)},[...r[1]||=[u(`path`,{d:`M 0 8 A 8 8 0 0 0 8 0 L 8 8 Z`},null,-1)]],2)),(g(),l(`svg`,{height:`100%`,width:`100%`,viewBox:`0 0 8 8`,class:h(q.value.chromeBgRight)},[...r[2]||=[u(`path`,{d:`M 0 0 A 8 8 0 0 0 8 8 L 0 8 Z`},null,-1)]],2))],64)):c(`v-if`,!0),f.variant===`slider`?(g(),l(`div`,{key:2,class:h(q.value.sliderIndicator)},null,2)):c(`v-if`,!0)]),_:2},1032,[`value`,`pinned`,`onClick`,`onClose`,`onPin`,`onPointerenter`]))),128)),H.value.length?(g(),s(n,{key:0,modal:!1,items:H.value,"trigger-props":{reference:V.value},onSelect:K},null,8,[`items`,`trigger-props`])):c(`v-if`,!0)]),_:1},16,[`modelValue`]))}});export{A as default};

package/dist/components/page-tabs/page-tabs.vue.d.ts

@@ -4,9 +4,9 @@ import * as _$vue from "vue";
 //#region src/components/page-tabs/page-tabs.vue.d.ts
 declare const __VLS_export: <T extends PageTabsOptionData>(__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: _$vue.PublicProps & __VLS_PrettifyLocal<PageTabsProps<T> & {
+    onClick?: ((tab: T) => any) | undefined;
     onContextmenu?: ((tab: T) => any) | undefined;
     onClose?: ((tab: T) => any) | undefined;
-    onClick?: ((tab: T) => any) | undefined;
     "onUpdate:modelValue"?: ((value: string) => any) | undefined;
     "onUpdate:items"?: ((items: T[]) => any) | undefined;
     onPin?: ((tab: T) => any) | undefined;

package/dist/components/page-tabs/types.d.ts

@@ -1,48 +1,121 @@
 import { ThemeSize } from "../../theme/types.js";
 import { IconValue } from "../icon/types.js";
-import { MenuOptionData } from "../menu/index.js";
+import { index_d_exports } from "../menu/index.js";
 import { PageTabsVariant } from "./variants.js";
-import { ClassValue, MaybePromise, PageTabsItemProps, PageTabsRootEmits, PageTabsRootProps, PageTabsUiSlot } from "@soybeanjs/headless";
+import { PageTabsItemProps, PageTabsRootEmits, PageTabsRootProps, PageTabsUiSlot } from "@soybeanjs/headless/page-tabs";
+import { ClassValue, MaybePromise } from "@soybeanjs/headless/types";
 
 //#region src/components/page-tabs/types.d.ts
+/**
+ * Option data for the PageTabs component.
+ */
 interface PageTabsOptionData extends PageTabsItemProps {
+  /**
+   * Label text rendered by the component.
+   */
   label: string;
+  /**
+   * Icon rendered by the component.
+   */
   icon?: IconValue;
   /**
    * Whether to hide the pinned icon on the tab
    */
   hidePinnedIcon?: boolean;
 }
+/**
+ * Additional UI slots for the page tabs component.
+ */
 type PageTabsExtraUiSlot = 'itemText' | 'chromeBgLeft' | 'chromeBgRight' | 'sliderIndicator';
+/**
+ * Extended UI class overrides for the PageTabs component.
+ */
 type PageTabsExtendedUi = Record<PageTabsUiSlot | PageTabsExtraUiSlot, ClassValue>;
+/**
+ * State values for PageTabsState.
+ */
 interface PageTabsState {
+  /**
+   * Pin.
+   */
   pin: () => void;
+  /**
+   * Unpin.
+   */
   unpin: () => void;
+  /**
+   * Whether the component can be closed.
+   */
   closable: boolean;
+  /**
+   * Close.
+   */
   close: () => Promise<void>;
+  /**
+   * Whether left closable.
+   */
   leftClosable: boolean;
+  /**
+   * Close left.
+   */
   closeLeft: () => void;
+  /**
+   * Whether right closable.
+   */
   rightClosable: boolean;
+  /**
+   * Close right.
+   */
   closeRight: () => void;
+  /**
+   * Whether other closable.
+   */
   otherClosable: boolean;
+  /**
+   * Close other.
+   */
   closeOther: () => void;
+  /**
+   * Whether all closable.
+   */
   allClosable: boolean;
+  /**
+   * Close all.
+   */
   closeAll: () => void;
 }
-interface PageTabsContextMenuOptionData extends MenuOptionData<string> {
+/**
+ * Option data for the PageTabsContextMenu component.
+ */
+interface PageTabsContextMenuOptionData extends index_d_exports.MenuOptionData<string> {
   /**
    * Action to perform when the menu item is selected.
    */
   action?: () => MaybePromise<void>;
 }
+/**
+ * Properties for the PageTabs component.
+ */
 interface PageTabsProps<T extends PageTabsOptionData> extends PageTabsRootProps {
   /**
    * root element class
    */
   class?: ClassValue;
+  /**
+   * Visual size of the component.
+   */
   size?: ThemeSize;
+  /**
+   * Visual variant of the component.
+   */
   variant?: PageTabsVariant;
+  /**
+   * Per-slot class overrides for the component.
+   */
   ui?: Partial<PageTabsExtendedUi>;
+  /**
+   * Items rendered by the component.
+   */
   items: T[];
   /**
    * A factory function to generate context menu options for each tab.
@@ -56,6 +129,9 @@ interface PageTabsProps<T extends PageTabsOptionData> extends PageTabsRootProps
    */
   beforeClose?: (value: string) => MaybePromise<boolean | void>;
 }
+/**
+ * Events for the PageTabs component.
+ */
 type PageTabsEmits<T> = PageTabsRootEmits & {
   (e: 'update:items', items: T[]): void;
   (e: 'click', tab: T): void;

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

@@ -1,4 +1,3 @@
 import { PaginationEmits, PaginationProps } from "./types.js";
 import { _default } from "./pagination.vue.js";
-import { PaginationButtonProps, PaginationEllipsisProps, PaginationListItemProps, PaginationListProps, PaginationRootEmits, PaginationRootProps } from "@soybeanjs/headless/pagination";
-export { type PaginationButtonProps, type PaginationEllipsisProps, type PaginationListItemProps, type PaginationListProps, type PaginationRootEmits, type PaginationRootProps };
+export * from "@soybeanjs/headless/pagination";

package/dist/components/pagination/pagination.js

@@ -1 +1 @@
-import{mergeSlotVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import t from"../icon/icon.js";import{paginationVariants as n}from"./variants.js";import{Fragment as r,computed as i,createBlock as a,createCommentVNode as o,createElementBlock as s,createVNode as c,defineComponent as l,guardReactiveProps as u,mergeProps as d,normalizeProps as f,openBlock as p,renderList as m,renderSlot as h,unref as g,withCtx as _}from"vue";import{useOmitProps as v}from"@soybeanjs/headless/composables";import{PaginationEllipsis as y,PaginationFirst as b,PaginationLast as x,PaginationList as S,PaginationListItem as C,PaginationNext as w,PaginationPrev as T,PaginationRoot as E,providePaginationUi as D}from"@soybeanjs/headless";const O=l({name:`SPagination`,__name:`pagination`,props:{class:{},ui:{},size:{},variant:{},shape:{},actionAsSelected:{type:Boolean},showFirstOrLast:{type:Boolean,default:!0},listProps:{},listItemProps:{},ellipsisProps:{},firstProps:{},prevProps:{},nextProps:{},lastProps:{},page:{},defaultPage:{},pageSize:{},defaultPageSize:{},total:{},siblingCount:{},disabled:{type:Boolean},showEdges:{type:Boolean}},emits:[`update:page`,`update:pageSize`],setup(l,{emit:O}){let k=l,A=O,j=v(k,[`class`,`ui`,`size`,`variant`,`shape`,`actionAsSelected`,`showFirstOrLast`,`listProps`,`listItemProps`,`ellipsisProps`,`firstProps`,`prevProps`,`nextProps`,`lastProps`]),M=i(()=>k.actionAsSelected?``:void 0);return D(i(()=>{let t=n({size:k.size,variant:k.variant,shape:k.shape,actionAsSelected:k.actionAsSelected}),{button:r,navigationButton:i}=t;return e({...t,listItem:r,first:i,prev:i,next:i,last:i},k.ui,{root:k.class})})),(e,n)=>(p(),a(g(E),d(g(j),{"onUpdate:page":n[0]||=e=>A(`update:page`,e),"onUpdate:pageSize":n[1]||=e=>A(`update:pageSize`,e)}),{default:_(()=>[h(e.$slots,`leading`),c(g(S),f(u(l.listProps)),{default:_(({items:n})=>[l.showFirstOrLast?(p(),a(g(b),d({key:0},l.firstProps,{"data-selected":M.value}),{default:_(()=>[h(e.$slots,`first`,{},()=>[c(t,{icon:`lucide:chevrons-left`})])]),_:3},16,[`data-selected`])):o(`v-if`,!0),c(g(T),d(l.prevProps,{"data-selected":M.value}),{default:_(()=>[h(e.$slots,`prev`,{},()=>[c(t,{icon:`lucide:chevron-left`})])]),_:3},16,[`data-selected`]),(p(!0),s(r,null,m(n,n=>(p(),s(r,{key:n},[n.type===`page`?(p(),a(g(C),d({key:0,ref_for:!0},l.listItemProps,{value:n.value}),null,16,[`value`])):n.type===`ellipsis`?(p(),a(g(y),d({key:1,ref_for:!0},l.ellipsisProps),{default:_(()=>[h(e.$slots,`ellipsis`,{},()=>[c(t,{icon:`lucide:ellipsis`})])]),_:3},16)):o(`v-if`,!0)],64))),128)),c(g(w),d(l.nextProps,{"data-selected":M.value}),{default:_(()=>[h(e.$slots,`next`,{},()=>[c(t,{icon:`lucide:chevron-right`})])]),_:3},16,[`data-selected`]),l.showFirstOrLast?(p(),a(g(x),d({key:1},l.lastProps,{"data-selected":M.value}),{default:_(()=>[h(e.$slots,`last`,{},()=>[c(t,{icon:`lucide:chevrons-right`})])]),_:3},16,[`data-selected`])):o(`v-if`,!0)]),_:3},16),h(e.$slots,`trailing`)]),_:3},16))}});export{O as default};
+import{mergeSlotVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import t from"../icon/icon.js";import{paginationVariants as n}from"./variants.js";import{Fragment as r,computed as i,createBlock as a,createCommentVNode as o,createElementBlock as s,createVNode as c,defineComponent as l,guardReactiveProps as u,mergeProps as d,normalizeProps as f,openBlock as p,renderList as m,renderSlot as h,unref as g,withCtx as _}from"vue";import{useOmitProps as v}from"@soybeanjs/headless/composables";import{PaginationEllipsis as y,PaginationFirst as b,PaginationLast as x,PaginationList as S,PaginationListItem as C,PaginationNext as w,PaginationPrev as T,PaginationRoot as E,providePaginationUi as D}from"@soybeanjs/headless/pagination";const O=l({name:`SPagination`,__name:`pagination`,props:{class:{type:[Boolean,null,String,Object,Array]},ui:{},size:{},variant:{},shape:{},actionAsSelected:{type:Boolean},showFirstOrLast:{type:Boolean,default:!0},listProps:{},listItemProps:{},ellipsisProps:{},firstProps:{},prevProps:{},nextProps:{},lastProps:{},page:{},defaultPage:{},pageSize:{},defaultPageSize:{},total:{},siblingCount:{},disabled:{type:Boolean},showEdges:{type:Boolean}},emits:[`update:page`,`update:pageSize`],setup(l,{emit:O}){let k=l,A=O,j=v(k,[`class`,`ui`,`size`,`variant`,`shape`,`actionAsSelected`,`showFirstOrLast`,`listProps`,`listItemProps`,`ellipsisProps`,`firstProps`,`prevProps`,`nextProps`,`lastProps`]),M=i(()=>k.actionAsSelected?``:void 0);return D(i(()=>{let t=n({size:k.size,variant:k.variant,shape:k.shape,actionAsSelected:k.actionAsSelected}),{button:r,navigationButton:i}=t;return e({...t,listItem:r,first:i,prev:i,next:i,last:i},k.ui,{root:k.class})})),(e,n)=>(p(),a(g(E),d(g(j),{"onUpdate:page":n[0]||=e=>A(`update:page`,e),"onUpdate:pageSize":n[1]||=e=>A(`update:pageSize`,e)}),{default:_(()=>[h(e.$slots,`leading`),c(g(S),f(u(l.listProps)),{default:_(({items:n})=>[l.showFirstOrLast?(p(),a(g(b),d({key:0},l.firstProps,{"data-selected":M.value}),{default:_(()=>[h(e.$slots,`first`,{},()=>[c(t,{icon:`lucide:chevrons-left`})])]),_:3},16,[`data-selected`])):o(`v-if`,!0),c(g(T),d(l.prevProps,{"data-selected":M.value}),{default:_(()=>[h(e.$slots,`prev`,{},()=>[c(t,{icon:`lucide:chevron-left`})])]),_:3},16,[`data-selected`]),(p(!0),s(r,null,m(n,n=>(p(),s(r,{key:n},[n.type===`page`?(p(),a(g(C),d({key:0,ref_for:!0},l.listItemProps,{value:n.value}),null,16,[`value`])):n.type===`ellipsis`?(p(),a(g(y),d({key:1,ref_for:!0},l.ellipsisProps),{default:_(()=>[h(e.$slots,`ellipsis`,{},()=>[c(t,{icon:`lucide:ellipsis`})])]),_:3},16)):o(`v-if`,!0)],64))),128)),c(g(w),d(l.nextProps,{"data-selected":M.value}),{default:_(()=>[h(e.$slots,`next`,{},()=>[c(t,{icon:`lucide:chevron-right`})])]),_:3},16,[`data-selected`]),l.showFirstOrLast?(p(),a(g(x),d({key:1},l.lastProps,{"data-selected":M.value}),{default:_(()=>[h(e.$slots,`last`,{},()=>[c(t,{icon:`lucide:chevrons-right`})])]),_:3},16,[`data-selected`])):o(`v-if`,!0)]),_:3},16),h(e.$slots,`trailing`)]),_:3},16))}});export{O as default};