@soybeanjs/ui 0.6.4 → 0.6.6

package/dist/components/button/button-link.vue.d.ts

@@ -13,8 +13,8 @@ type __VLS_Slots = {} & {
 };
 declare const __VLS_base: vue.DefineComponent<ButtonLinkProps, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<ButtonLinkProps> & Readonly<{}>, {
   disabled: boolean;
-  variant: ButtonVariant;
   replace: boolean;
+  variant: ButtonVariant;
   external: boolean;
   viewTransition: boolean;
   noRel: boolean;

package/dist/components/config-provider/config-provider.js

@@ -1 +1 @@
-import{themeSizes as e}from"../../constants/common.js";import t from"../dialog/dialog-provider.js";import{provideConfigProviderContext as n}from"./context.js";import r from"../toast/toast-provider.js";import{createBlock as i,createTextVNode as a,createVNode as o,defineComponent as s,guardReactiveProps as c,normalizeProps as l,openBlock as u,renderSlot as d,shallowRef as f,toDisplayString as p,unref as m,watch as h,watchEffect as g,withCtx as _}from"vue";import{useOmitProps as v}from"@soybeanjs/headless/composables";import{ConfigProvider as y,Primitive as b}from"@soybeanjs/headless";import{isClient as x,transformPropsToContext as S}from"@soybeanjs/headless/shared";import{createShadcnTheme as C}from"@soybeanjs/shadcn-theme";const w=s({name:`SConfigProvider`,__name:`config-provider`,props:{theme:{default:()=>({})},size:{default:`md`},iconify:{default:()=>({width:`1.25em`,height:`1.25em`})},toast:{},dir:{default:`ltr`},locale:{},nonce:{},tooltip:{},nuxt:{type:Boolean}},setup(s){let w=s,T=v(w,[`theme`,`size`,`iconify`,`toast`]);n(S(w));let E=f(``),{getCss:D}=C(w.theme);function O(t){if(!x)return;document.documentElement.classList.add(`size-${t}`);let n=e.filter(e=>e!==t).map(e=>`size-${e}`);document.documentElement.classList.remove(...n)}return h(()=>w.size,e=>{O(e)},{immediate:!0,flush:`sync`}),g(()=>{let e=w.theme||{};E.value=D(e,e.radius)}),(e,n)=>(u(),i(m(y),l(c(m(T))),{default:_(()=>[o(m(b),{id:`__SOYBEAN_UI_THEME_VARS__`,as:`style`},{default:_(()=>[a(p(E.value),1)]),_:1}),o(t,null,{default:_(()=>[o(r,l(c(s.toast)),{default:_(()=>[d(e.$slots,`default`)]),_:3},16)]),_:3})]),_:3},16))}});export{w as default};
+import{themeSizes as e}from"../../constants/common.js";import t from"../dialog/dialog-provider.js";import{provideConfigProviderContext as n}from"./context.js";import r from"../toast/toast-provider.js";import{createBlock as i,createTextVNode as a,createVNode as o,defineComponent as s,guardReactiveProps as c,normalizeProps as l,openBlock as u,renderSlot as d,toDisplayString as f,unref as p,watch as m,watchEffect as h,withCtx as g}from"vue";import{useOmitProps as _}from"@soybeanjs/headless/composables";import{ConfigProvider as v,Primitive as y}from"@soybeanjs/headless";import{useStorage as b}from"@vueuse/core";import{isClient as x,transformPropsToContext as S}from"@soybeanjs/headless/shared";import{createShadcnTheme as C}from"@soybeanjs/shadcn-theme";const w=s({name:`SConfigProvider`,__name:`config-provider`,props:{theme:{default:()=>({})},size:{default:`md`},iconify:{default:()=>({width:`1.25em`,height:`1.25em`})},toast:{},dir:{default:`ltr`},locale:{},nonce:{},tooltip:{},nuxt:{type:Boolean}},setup(s){let w=s,T=_(w,[`theme`,`size`,`iconify`,`toast`]);n(S(w));let{getCss:E}=C(w.theme),D=()=>E(w.theme,w.theme.radius),O=b(`__SoybeanUI_themeVars`,D());function k(t){if(!x)return;document.documentElement.classList.add(`size-${t}`);let n=e.filter(e=>e!==t).map(e=>`size-${e}`);document.documentElement.classList.remove(...n)}return m(()=>w.size,e=>{k(e)},{immediate:!0,flush:`sync`}),h(()=>{O.value=D()}),(e,n)=>(u(),i(p(v),l(c(p(T))),{default:g(()=>[o(p(y),{id:`__SoybeanUI_themeVars`,as:`style`},{default:g(()=>[a(f(p(O)),1)]),_:1}),o(t,null,{default:g(()=>[o(r,l(c(s.toast)),{default:g(()=>[d(e.$slots,`default`)]),_:3},16)]),_:3})]),_:3},16))}});export{w as default};

package/dist/components/dialog/context.js

@@ -1 +1 @@
-import{computed as e,shallowRef as t,watch as n}from"vue";import{useContext as r}from"@soybeanjs/headless/composables";import{useDebounceFn as i}from"@vueuse/core";const[a,o]=r(`UiDialogProvider`,()=>{let r=t([]),a=e(()=>r.value.map(e=>e.id)),o=t([]),s=i(()=>{o.value=r.value},500);n(r,(e,t)=>{e.length>t.length?o.value=r.value:s()});let c=e=>{r.value=[...r.value,e]},l=e=>{r.value=r.value.filter(t=>t.id!==e)},u=()=>{r.value=[]},d=0,f=e=>{let{showIcon:t=!0,onClose:n,...r}=e,i=d;return d++,{id:i,showIcon:t,onClose:e=>{e||(l(i),n?.())},...r}},p=e=>{c(f(e))},m=p;m.clear=u;for(let e of[`destructive`,`success`,`warning`,`info`])m[e]=t=>p({type:e,...t});return typeof window<`u`&&(window.__Soybean__useDialog=m),{useDialog:m,clear:u,ids:a,states:e(()=>o.value),remove:l}}),s=()=>{if(typeof window<`u`&&window.__Soybean__useDialog)return window.__Soybean__useDialog;let{useDialog:e}=o(`UiDialogConsumer`);return e};export{a as provideDialogProviderContext,s as useDialog};
+import{computed as e,shallowRef as t,watch as n}from"vue";import{useContext as r}from"@soybeanjs/headless/composables";import{useDebounceFn as i}from"@vueuse/core";const[a,o]=r(`UiDialogProvider`,()=>{let r=t([]),a=e(()=>r.value.map(e=>e.id)),o=t([]),s=i(()=>{o.value=r.value},500);n(r,(e,t)=>{e.length>t.length?o.value=r.value:s()});let c=e=>{r.value=[...r.value,e]},l=e=>{r.value=r.value.filter(t=>t.id!==e)},u=()=>{r.value=[]},d=0,f=e=>{let{showIcon:t=!0,onClose:n,...r}=e,i=d;return d++,{id:i,showIcon:t,onClose:e=>{e||(l(i),n?.())},...r}},p=e=>{c(f(e))},m=p;m.clear=u;for(let e of[`destructive`,`success`,`warning`,`info`])m[e]=t=>p({type:e,...t});return typeof window<`u`&&(window.__SoybeanUI_useDialog=m),{useDialog:m,clear:u,ids:a,states:e(()=>o.value),remove:l}}),s=()=>{if(typeof window<`u`&&window.__SoybeanUI_useDialog)return window.__SoybeanUI_useDialog;let{useDialog:e}=o(`UiDialogConsumer`);return e};export{a as provideDialogProviderContext,s as useDialog};

package/dist/components/dialog/dialog-pure.vue.d.ts

@@ -31,9 +31,9 @@ declare const __VLS_base: vue.DefineComponent<DialogPureProps, {}, {}, {}, {}, v
   onOpenAutoFocus?: ((event: Event) => any) | undefined;
   onCloseAutoFocus?: ((event: Event) => any) | undefined;
 }>, {
+  closable: boolean;
   open: boolean;
   defaultOpen: boolean;
-  closable: boolean;
   modal: boolean;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

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

@@ -46,9 +46,9 @@ declare const __VLS_base: vue.DefineComponent<DialogProps, {}, {}, {}, {}, vue.C
   onOpenAutoFocus?: ((event: Event) => any) | undefined;
   onCloseAutoFocus?: ((event: Event) => any) | undefined;
 }>, {
+  closable: boolean;
   open: boolean;
   defaultOpen: boolean;
-  closable: boolean;
   modal: boolean;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

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

@@ -46,9 +46,9 @@ declare const __VLS_base: vue.DefineComponent<DrawerProps, {}, {}, {}, {}, vue.C
   onOpenAutoFocus?: ((event: Event) => any) | undefined;
   onCloseAutoFocus?: ((event: Event) => any) | undefined;
 }>, {
+  closable: boolean;
   open: boolean;
   defaultOpen: boolean;
-  closable: boolean;
   modal: boolean;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

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{pageTabsVariants as r}from"../../variants/page-tabs.js";import{usePageTabsState as i}from"./hooks.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`,`select-context-menu`],setup(f,{emit:A}){let j=f,M=A,N=w(j,[`class`,`size`,`variant`,`ui`,`modelValue`,`items`,`menuFactory`]),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}=i({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(`select-context-menu`,e,B.value))},q=o(()=>e(r({size:j.size,variant:j.variant}),j.ui,{root:j.class}));return x(()=>{R()}),k(q),(e,r)=>(g(),s(b(O),m({ref:`root`},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{pageTabsVariants as r}from"../../variants/page-tabs.js";import{usePageTabsState as i}from"./hooks.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`,`select-context-menu`],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}=i({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(`select-context-menu`,e,B.value))},q=o(()=>e(r({size:j.size,variant:j.variant}),j.ui,{root:j.class}));return x(()=>{R()}),k(q),(e,r)=>(g(),s(b(O),m({ref:`root`},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

@@ -7,9 +7,9 @@ declare const __VLS_export: <T extends PageTabsOptionData>(__VLS_props: NonNulla
     onContextmenu?: ((tab: T) => any) | undefined;
     "onUpdate:modelValue"?: ((value: string) => any) | undefined;
     onClose?: ((tab: T) => any) | undefined;
+    onClick?: ((tab: T) => any) | undefined;
     onPin?: ((tab: T) => any) | undefined;
     "onUpdate:items"?: ((items: T[]) => any) | undefined;
-    onClick?: ((tab: T) => any) | undefined;
     "onSelect-context-menu"?: ((menu: PageTabsContextMenuOptionData, tab: T) => any) | undefined;
   }> & (typeof globalThis extends {
     __VLS_PROPS_FALLBACK: infer P;

package/dist/components/toast/context.js

@@ -1 +1 @@
-import{mergeUi as e}from"../../theme/shared.js";import"../../theme/index.js";import{useThemeSize as t}from"../config-provider/context.js";import{toastTypes as n}from"./shared.js";import{computed as r,nextTick as i,shallowRef as a,watch as o}from"vue";import{useContext as s}from"@soybeanjs/headless/composables";import{useDebounceFn as c}from"@vueuse/core";const[l,u]=s(`UiToastProvider`,s=>{let{ui:l,limits:u,removeDelay:d}=s,f=a(s.position.value),p=t(),m=a([]),h=r(()=>m.value.map(e=>e.id)),g=a([]),_=c(()=>{g.value=m.value},d.value);o(m,(e,t)=>{e.length>=t.length?g.value=m.value:_()});let v=e=>{m.value=[e,...m.value].slice(0,u.value)},y=e=>{m.value=m.value.filter(t=>t.id!==e)},b=()=>{m.value=[]},x=0,S=t=>{let{showIcon:n=!0,size:r=p.value,ui:i,onClose:a,...o}=t,s=x;return x++,{id:s,size:r,showIcon:n,ui:e(l.value,i),onClose:e=>{e||(y(s),a?.())},...o}},C=e=>{let t=S(e),n=e.position??s.position.value;f.value!==n&&(f.value=n,b()),i(()=>{v(t)})},w=C;w.clear=b;for(let e of n)w[e]=t=>C({type:e,...t});return typeof window<`u`&&(window.__Soybean__useToast=w),{useToast:w,clear:b,ids:h,states:r(()=>g.value),remove:y,position:f}}),d=()=>{if(typeof window<`u`&&window.__Soybean__useToast)return window.__Soybean__useToast;let{useToast:e}=u(`UiToastConsumer`);return e};export{l as provideToastProviderContext,d as useToast};
+import{mergeUi as e}from"../../theme/shared.js";import"../../theme/index.js";import{useThemeSize as t}from"../config-provider/context.js";import{toastTypes as n}from"./shared.js";import{computed as r,nextTick as i,shallowRef as a,watch as o}from"vue";import{useContext as s}from"@soybeanjs/headless/composables";import{useDebounceFn as c}from"@vueuse/core";const[l,u]=s(`UiToastProvider`,s=>{let{ui:l,limits:u,removeDelay:d}=s,f=a(s.position.value),p=t(),m=a([]),h=r(()=>m.value.map(e=>e.id)),g=a([]),_=c(()=>{g.value=m.value},d.value);o(m,(e,t)=>{e.length>=t.length?g.value=m.value:_()});let v=e=>{m.value=[e,...m.value].slice(0,u.value)},y=e=>{m.value=m.value.filter(t=>t.id!==e)},b=()=>{m.value=[]},x=0,S=t=>{let{showIcon:n=!0,size:r=p.value,ui:i,onClose:a,...o}=t,s=x;return x++,{id:s,size:r,showIcon:n,ui:e(l.value,i),onClose:e=>{e||(y(s),a?.())},...o}},C=e=>{let t=S(e),n=e.position??s.position.value;f.value!==n&&(f.value=n,b()),i(()=>{v(t)})},w=C;w.clear=b;for(let e of n)w[e]=t=>C({type:e,...t});return typeof window<`u`&&(window.__SoybeanUI_useToast=w),{useToast:w,clear:b,ids:h,states:r(()=>g.value),remove:y,position:f}}),d=()=>{if(typeof window<`u`&&window.__SoybeanUI_useToast)return window.__SoybeanUI_useToast;let{useToast:e}=u(`UiToastConsumer`);return e};export{l as provideToastProviderContext,d as useToast};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@soybeanjs/ui",
-  "version": "0.6.4",
+  "version": "0.6.6",
   "description": "SoybeanUI is built on top of SoybeanHeadless, providing a collection of styled components for Vue 3.",
   "homepage": "https://github.com/soybeanjs/soybean-ui",
   "bugs": {
@@ -54,7 +54,7 @@
     "tailwind-variants": "^3.2.2",
     "valibot": "^1.2.0",
     "zod": "^4.3.6",
-    "@soybeanjs/headless": "^0.6.4"
+    "@soybeanjs/headless": "^0.6.6"
   },
   "devDependencies": {
     "@soybeanjs/cli": "^1.5.0",