@soybeanjs/ui 0.22.3 → 0.23.0

package/README.md

@@ -21,7 +21,7 @@ SoybeanUI is built on a strict **two-layer separation** model:
 ┌─────────────────────────────────────────┐
 │           @soybeanjs/ui (src/)          │
 │  S-prefixed components   (SButton…)     │
-│  UnoCSS classes · tailwind-variants     │
+│  UnoCSS classes · @soybeanjs/cva        │
 │  provideXUi(ui)  ──────────────────┐    │
 └────────────────────────────────────┼────┘
                                      │ style injection
@@ -35,10 +35,10 @@ SoybeanUI is built on a strict **two-layer separation** model:
 
 ### Packages
 
-| Package                 | Role                              | Components                        |
-| ----------------------- | --------------------------------- | --------------------------------- |
-| **@soybeanjs/headless** | Logic, state, a11y. Zero styles.  | 95 component dirs, 25 composables |
-| **@soybeanjs/ui**       | Styled wrappers. UnoCSS + `tv()`. | 91 `S`-prefixed components        |
+| Package                 | Role                                                | Components                        |
+| ----------------------- | --------------------------------------------------- | --------------------------------- |
+| **@soybeanjs/headless** | Logic, state, a11y. Zero styles.                    | 95 component dirs, 25 composables |
+| **@soybeanjs/ui**       | Styled wrappers. UnoCSS + `@soybeanjs/cva` recipes. | 91 `S`-prefixed components        |
 
 **Data flow is strictly one-way**: `headless` → `src`. The styled layer never imports from headless's internals — it injects style tokens via `provideXUi(computedUi)` which headless components read through `useUiContext()`.
 
@@ -48,17 +48,11 @@ Current Compact-style coverage also includes flows such as card, date-field, dia
 
 ### Style Injection
 
-Every multi-slot headless component exposes a `provide{Name}Ui` function. The styled wrapper computes classes using `tailwind-variants` and injects them:
+Every multi-slot headless component exposes a `provide{Name}Ui` function. The styled wrapper computes classes with `@soybeanjs/cva` recipes and injects them:
 
 ```ts
 // In the styled wrapper (src/)
-const ui = computed(() =>
-  mergeVariants(
-    accordionVariants({ size: props.size }), // tv() output
-    props.ui, // user overrides
-    { root: props.class } // class prop
-  )
-);
+const ui = computed(() => accordionVariants({ size: props.size }, props.ui, { root: props.class }));
 provideAccordionUi(ui); // headless reads this via useAccordionUi()
 ```
 
@@ -67,7 +61,6 @@ provideAccordionUi(ui); // headless reads this via useAccordionUi()
 - **`ThemeColor`** — 8 semantic colors: `primary` · `destructive` · `success` · `warning` · `info` · `carbon` · `secondary` · `accent`
 - **`ThemeSize`** — 6 sizes: `xs` · `sm` · `md` · `lg` · `xl` · `2xl` (base 16px at `md`)
 - **`ConfigProvider`** — sets global `dir`, `locale`, `nonce`, and default `tooltip` config for the entire component tree, including RTL layout switching
-- **`cn()`** — Tailwind-aware class merge (`clsx` + `tailwind-merge`), used for conflict-free class composition
 
 ### Locale Support
 

package/README.zh-CN.md

@@ -21,7 +21,7 @@ SoybeanUI 采用严格的**双层分离**设计：
 ┌─────────────────────────────────────────┐
 │           @soybeanjs/ui (src/)          │
 │  S 前缀组件   (SButton、SDialog…)        │
-│  UnoCSS 类名 · tailwind-variants         │
+│  UnoCSS 类名 · @soybeanjs/cva            │
 │  provideXUi(ui)  ──────────────────┐    │
 └────────────────────────────────────┼────┘
                                      │ 样式注入
@@ -35,10 +35,10 @@ SoybeanUI 采用严格的**双层分离**设计：
 
 ### 包结构
 
-| 包                      | 职责                        | 组件数量                        |
-| ----------------------- | --------------------------- | ------------------------------- |
-| **@soybeanjs/headless** | 逻辑、状态、a11y，零样式    | 95 个组件目录，25 个 composable |
-| **@soybeanjs/ui**       | 样式包装层。UnoCSS + `tv()` | 91 个带 `S` 前缀的组件          |
+| 包                      | 职责                                         | 组件数量                        |
+| ----------------------- | -------------------------------------------- | ------------------------------- |
+| **@soybeanjs/headless** | 逻辑、状态、a11y，零样式                     | 95 个组件目录，25 个 composable |
+| **@soybeanjs/ui**       | 样式包装层。UnoCSS + `@soybeanjs/cva` recipe | 91 个带 `S` 前缀的组件          |
 
 **数据流严格单向**：`headless` → `src`。样式层不会导入 headless 的内部实现，而是通过 `provideXUi(computedUi)` 注入样式 token，headless 组件再通过 `useUiContext()` 读取。
 
@@ -48,17 +48,11 @@ SoybeanUI 采用严格的**双层分离**设计：
 
 ### 样式注入机制
 
-每个多橪位的 headless 组件都有对应的 `provide{Name}Ui` 函数。样式层通过 `tailwind-variants` 计算类名后注入：
+每个多插槽的 headless 组件都有对应的 `provide{Name}Ui` 函数。样式层通过 `@soybeanjs/cva` 的 recipe 计算类名后注入：
 
 ```ts
 // 样式包装层 (src/) 中
-const ui = computed(() =>
-  mergeVariants(
-    accordionVariants({ size: props.size }), // tv() 计算结果
-    props.ui, // 用户自定义覆盖
-    { root: props.class } // class prop 合并
-  )
-);
+const ui = computed(() => accordionVariants({ size: props.size }, props.ui, { root: props.class }));
 provideAccordionUi(ui); // headless 通过 useAccordionUi() 读取
 ```
 
@@ -67,7 +61,6 @@ provideAccordionUi(ui); // headless 通过 useAccordionUi() 读取
 - **`ThemeColor`** — 8 种语义色：`primary` · `destructive` · `success` · `warning` · `info` · `carbon` · `secondary` · `accent`
 - **`ThemeSize`** — 6 种尺寸：`xs` · `sm` · `md` · `lg` · `xl` · `2xl`（基准尺寸 `md` = 16px）
 - **`ConfigProvider`** — 全局设置 `dir`、`locale`、`nonce` 及默认 `tooltip` 配置，应用于整个组件树，并支持 RTL 布局切换
-- **`cn()`** — Tailwind 感知的类名合并工具（`clsx` + `tailwind-merge`），解决类名冲突
 
 ### 语言支持
 

package/dist/components/accordion/accordion.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{accordionVariants as t}from"./variants.js";import{computed as n,createBlock as r,createSlots as i,defineComponent as a,guardReactiveProps as o,mergeProps as s,normalizeProps as c,openBlock as l,renderList as u,renderSlot as d,toHandlers as f,unref as p,useSlots as m,withCtx as h}from"vue";import{AccordionCompact as g,provideAccordionUi as _}from"@soybeanjs/headless/accordion";import{useForwardListeners as v,useOmitProps as y}from"@soybeanjs/headless/composables";import{keysOf as b}from"@soybeanjs/utils";const x=a({name:`SAccordion`,__name:`accordion`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},items:{},itemProps:{},headerProps:{},triggerProps:{},contentProps:{},descriptionProps:{},collapsible:{type:Boolean,default:!0},dir:{},disabled:{type:Boolean},orientation:{},unmountOnHide:{type:Boolean,default:!0},modelValue:{},defaultValue:{},multiple:{},selectionBehavior:{}},emits:[`update:modelValue`],setup(a,{emit:x}){let S=a,C=x,w=m(),T=y(S,[`class`,`size`,`ui`]),E=v(C),D=n(()=>b(w).filter(e=>e!==`item`));return _(n(()=>e(t({size:S.size}),S.ui,{root:S.class}))),(e,t)=>(l(),r(p(g),s(p(T),f(p(E))),i({item:h(t=>[d(e.$slots,`item`,c(o(t)))]),_:2},[u(D.value,t=>({name:t,fn:h(n=>[d(e.$slots,t,c(o(n)))])}))]),1040))}});export{x as default};
+import{accordionVariants as e}from"../../styles/accordion.js";import{computed as t,createBlock as n,createSlots as r,defineComponent as i,guardReactiveProps as a,mergeProps as o,normalizeProps as s,openBlock as c,renderList as l,renderSlot as u,toHandlers as d,unref as f,useSlots as p,withCtx as m}from"vue";import{AccordionCompact as h,provideAccordionUi as g}from"@soybeanjs/headless/accordion";import{useForwardListeners as _,useOmitProps as v}from"@soybeanjs/headless/composables";import{keysOf as y}from"@soybeanjs/utils";const b=i({name:`SAccordion`,__name:`accordion`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},items:{},itemProps:{},headerProps:{},triggerProps:{},contentProps:{},descriptionProps:{},collapsible:{type:Boolean,default:!0},dir:{},disabled:{type:Boolean},orientation:{},unmountOnHide:{type:Boolean,default:!0},modelValue:{},defaultValue:{},multiple:{},selectionBehavior:{}},emits:[`update:modelValue`],setup(i,{emit:b}){let x=i,S=b,C=p(),w=v(x,[`class`,`size`,`ui`]),T=_(S),E=t(()=>y(C).filter(e=>e!==`item`));return g(t(()=>e({size:x.size},x.ui,{root:x.class}))),(e,t)=>(c(),n(f(h),o(f(w),d(f(T))),r({item:m(t=>[u(e.$slots,`item`,s(a(t)))]),_:2},[l(E.value,t=>({name:t,fn:m(n=>[u(e.$slots,t,s(a(n)))])}))]),1040))}});export{b as default};

package/dist/components/affix/affix.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{affixVariants as t}from"./variants.js";import{computed as n,createBlock as r,defineComponent as i,guardReactiveProps as a,mergeProps as o,normalizeProps as s,openBlock as c,renderSlot as l,toHandlers as u,unref as d,withCtx as f}from"vue";import{useForwardListeners as p,useOmitProps as m}from"@soybeanjs/headless/composables";import{AffixCompact as h,provideAffixUi as g}from"@soybeanjs/headless/affix";const _=i({name:`SAffix`,__name:`affix`,props:{class:{type:[Boolean,null,String,Object,Array]},ui:{},placeholderProps:{},contentProps:{},offsetTop:{},offsetBottom:{},target:{type:[String,Function,null]}},emits:[`change`],setup(i,{emit:_}){let v=i,y=_,b=m(v,[`class`,`ui`]),x=p(y);return g(n(()=>e(t(),v.ui,{content:v.class}))),(e,t)=>(c(),r(d(h),o(d(b),u(d(x))),{default:f(t=>[l(e.$slots,`default`,s(a(t)))]),_:3},16))}});export{_ as default};
+import{affixVariants as e}from"../../styles/affix.js";import{computed as t,createBlock as n,defineComponent as r,guardReactiveProps as i,mergeProps as a,normalizeProps as o,openBlock as s,renderSlot as c,toHandlers as l,unref as u,withCtx as d}from"vue";import{useForwardListeners as f,useOmitProps as p}from"@soybeanjs/headless/composables";import{AffixCompact as m,provideAffixUi as h}from"@soybeanjs/headless/affix";const g=r({name:`SAffix`,__name:`affix`,props:{class:{type:[Boolean,null,String,Object,Array]},ui:{},placeholderProps:{},contentProps:{},offsetTop:{},offsetBottom:{},target:{type:[String,Function,null]}},emits:[`change`],setup(r,{emit:g}){let _=r,v=g,y=p(_,[`class`,`ui`]),b=f(v);return h(t(()=>e(void 0,_.ui,{content:_.class}))),(e,t)=>(s(),n(u(m),a(u(y),l(u(b))),{default:d(t=>[c(e.$slots,`default`,o(i(t)))]),_:3},16))}});export{g as default};

package/dist/components/alert/alert.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import{miniSizeMap as t}from"../../theme/config.js";import"../../theme/index.js";import{alertVariants as n}from"./variants.js";import{buttonIconVariants as r}from"../button/variants.js";import{computed as i,createBlock as a,createSlots as o,defineComponent as s,mergeProps as c,openBlock as l,renderList as u,renderSlot as d,unref as f,useSlots as p,withCtx as m}from"vue";import{useOmitProps as h}from"@soybeanjs/headless/composables";import{keysOf as g}from"@soybeanjs/utils";import{AlertCompact as _,provideAlertUi as v}from"@soybeanjs/headless/alert";const y=s({name:`SAlert`,__name:`alert`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},color:{},variant:{},ui:{},title:{},description:{},icon:{},closable:{type:Boolean},contentProps:{},titleProps:{},descriptionProps:{},closeProps:{},open:{type:Boolean,default:void 0}},emits:[`update:open`,`close`],setup(s,{emit:y}){let b=s,x=y,S=p(),C=h(b,[`class`,`size`,`color`,`variant`,`ui`]),w=i(()=>g(S));return v(i(()=>e({...n({size:b.size,color:b.color,variant:b.variant}),$base:{close:r({size:t[b.size??`md`]})}},b.ui,{root:b.class}))),(e,t)=>(l(),a(f(_),c(f(C),{"onUpdate:open":t[0]||=e=>x(`update:open`,e)}),o({_:2},[u(w.value,t=>({name:t,fn:m(()=>[d(e.$slots,t)])}))]),1040))}});export{y as default};
+import{alertVariants as e}from"../../styles/alert.js";import{computed as t,createBlock as n,createSlots as r,defineComponent as i,mergeProps as a,openBlock as o,renderList as s,renderSlot as c,unref as l,useSlots as u,withCtx as d}from"vue";import{useOmitProps as f}from"@soybeanjs/headless/composables";import{keysOf as p}from"@soybeanjs/utils";import{AlertCompact as m,provideAlertUi as h}from"@soybeanjs/headless/alert";const g=i({name:`SAlert`,__name:`alert`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},color:{},variant:{},ui:{},title:{},description:{},icon:{},closable:{type:Boolean},contentProps:{},titleProps:{},descriptionProps:{},closeProps:{},open:{type:Boolean,default:void 0}},emits:[`update:open`,`close`],setup(i,{emit:g}){let _=i,v=g,y=u(),b=f(_,[`class`,`size`,`color`,`variant`,`ui`]),x=t(()=>p(y));return h(t(()=>e({size:_.size,color:_.color,variant:_.variant},_.ui,{root:_.class}))),(e,t)=>(o(),n(l(m),a(l(b),{"onUpdate:open":t[0]||=e=>v(`update:open`,e)}),r({_:2},[s(x.value,t=>({name:t,fn:d(()=>[c(e.$slots,t)])}))]),1040))}});export{g as default};

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

@@ -1,4 +1,4 @@
-import { AlertVariant } from "./variants.js";
+import { AlertVariant } from "../../styles/alert.js";
 import { AlertEmits, AlertExtendedUi, AlertProps, AlertSlots } from "./types.js";
 import { _default } from "./alert.vue.js";
 export type * from "@soybeanjs/headless/alert";

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

@@ -1,5 +1,5 @@
 import { ThemeColor, ThemeSize } from "../../theme/types.js";
-import { AlertVariant } from "./variants.js";
+import { AlertVariant } from "../../styles/alert.js";
 import { AlertCompactEmits, AlertCompactProps, AlertCompactSlots, AlertUi } from "@soybeanjs/headless/alert";
 import { ClassValue } from "@soybeanjs/headless/types";
 

package/dist/components/anchor/anchor.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{anchorVariants as t}from"./variants.js";import{computed as n,createBlock as r,defineComponent as i,mergeProps as a,openBlock as o,toHandlers as s,unref as c}from"vue";import{useForwardListeners as l,useOmitProps as u}from"@soybeanjs/headless/composables";import{AnchorCompact as d,provideAnchorUi as f}from"@soybeanjs/headless/anchor";const p=i({name:`SAnchor`,__name:`anchor`,props:{color:{},size:{},ui:{},class:{type:[Boolean,null,String,Object,Array]},sticky:{type:Boolean,default:!0},items:{},linkProps:{},indicatorProps:{},titleProps:{},subProps:{},bounds:{},dir:{},getContainer:{},getCurrentAnchor:{},modelValue:{},offsetTop:{default:0},orientation:{},replace:{type:Boolean},targetOffset:{},asChild:{type:Boolean},as:{}},emits:[`update:modelValue`,`activeChange`,`itemSelect`],setup(i,{emit:p}){let m=i,h=p,g=u(m,[`color`,`size`,`ui`,`class`,`sticky`]),_=l(h),v=n(()=>({"--soybean-anchor-offset-top":`${m.offsetTop}px`}));return f(n(()=>e(t({color:m.color,orientation:m.orientation,size:m.size,sticky:m.sticky}),m.ui,{root:m.class}))),(e,t)=>(o(),r(c(d),a(c(g),{items:i.items,style:v.value},s(c(_))),null,16,[`items`,`style`]))}});export{p as default};
+import{anchorVariants as e}from"../../styles/anchor.js";import{computed as t,createBlock as n,defineComponent as r,mergeProps as i,openBlock as a,toHandlers as o,unref as s}from"vue";import{useForwardListeners as c,useOmitProps as l}from"@soybeanjs/headless/composables";import{AnchorCompact as u,provideAnchorUi as d}from"@soybeanjs/headless/anchor";const f=r({name:`SAnchor`,__name:`anchor`,props:{color:{},size:{},ui:{},class:{type:[Boolean,null,String,Object,Array]},sticky:{type:Boolean,default:!0},items:{},linkProps:{},indicatorProps:{},titleProps:{},subProps:{},bounds:{},dir:{},getContainer:{},getCurrentAnchor:{},modelValue:{},offsetTop:{default:0},orientation:{},replace:{type:Boolean},targetOffset:{},asChild:{type:Boolean},as:{}},emits:[`update:modelValue`,`activeChange`,`itemSelect`],setup(r,{emit:f}){let p=r,m=f,h=l(p,[`color`,`size`,`ui`,`class`,`sticky`]),g=c(m),_=t(()=>({"--soybean-anchor-offset-top":`${p.offsetTop}px`}));return d(t(()=>e({color:p.color,orientation:p.orientation,size:p.size,sticky:p.sticky},p.ui,{root:p.class}))),(e,t)=>(a(),n(s(u),i(s(h),{items:r.items,style:_.value},o(s(g))),null,16,[`items`,`style`]))}});export{f as default};

package/dist/components/autocomplete/autocomplete.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{autocompleteVariants as t}from"./variants.js";import{computed as n,createBlock as r,createCommentVNode as i,createSlots as a,defineComponent as o,guardReactiveProps as s,mergeProps as c,normalizeProps as l,openBlock as u,renderList as d,renderSlot as f,toHandlers as p,unref as m,useSlots as h,withCtx as g}from"vue";import{useForwardListeners as _,useOmitProps as v}from"@soybeanjs/headless/composables";import{keysOf as y}from"@soybeanjs/utils";import{AutocompleteCompact as b,provideAutocompleteUi as x}from"@soybeanjs/headless/autocomplete";const S=o({name:`SAutocomplete`,__name:`autocomplete`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},modelValue:{default:void 0},defaultValue:{},items:{},placeholder:{},clearable:{type:Boolean,default:!1},clearLabel:{default:`Clear input`},emptyLabel:{default:`No results found.`},fuseOptions:{},anchorProps:{},inputProps:{},triggerProps:{},portalProps:{},contentProps:{},viewportProps:{},groupProps:{},groupLabelProps:{},itemProps:{},itemIndicatorProps:{},separatorProps:{},open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean},dir:{},disabled:{type:Boolean},highlightOnHover:{type:Boolean},openOnFocus:{type:Boolean},openOnClick:{type:Boolean},name:{},required:{type:Boolean}},emits:[`update:modelValue`,`update:open`,`highlight`,`select`],setup(o,{emit:S}){let C=o,w=S,T=h(),E=v(C,[`class`,`size`,`ui`]),D=_(w),O=n(()=>y(T));return x(n(()=>e(t({size:C.size}),C.ui,{root:C.class}))),(e,t)=>(u(),r(m(b),c(m(E),{items:o.items},p(m(D))),a({_:2},[d(O.value,t=>({name:t,fn:g(n=>[i(` @vue-ignore ignore vue slot props type `),f(e.$slots,t,l(s(n)))])}))]),1040,[`items`]))}});export{S as default};
+import{autocompleteVariants as e}from"../../styles/autocomplete.js";import{computed as t,createBlock as n,createCommentVNode as r,createSlots as i,defineComponent as a,guardReactiveProps as o,mergeProps as s,normalizeProps as c,openBlock as l,renderList as u,renderSlot as d,toHandlers as f,unref as p,useSlots as m,withCtx as h}from"vue";import{useForwardListeners as g,useOmitProps as _}from"@soybeanjs/headless/composables";import{keysOf as v}from"@soybeanjs/utils";import{AutocompleteCompact as y,provideAutocompleteUi as b}from"@soybeanjs/headless/autocomplete";const x=a({name:`SAutocomplete`,__name:`autocomplete`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},modelValue:{default:void 0},defaultValue:{},items:{},placeholder:{},clearable:{type:Boolean,default:!1},clearLabel:{default:`Clear input`},emptyLabel:{default:`No results found.`},fuseOptions:{},anchorProps:{},inputProps:{},triggerProps:{},portalProps:{},contentProps:{},viewportProps:{},groupProps:{},groupLabelProps:{},itemProps:{},itemIndicatorProps:{},separatorProps:{},open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean},dir:{},disabled:{type:Boolean},highlightOnHover:{type:Boolean},openOnFocus:{type:Boolean},openOnClick:{type:Boolean},name:{},required:{type:Boolean}},emits:[`update:modelValue`,`update:open`,`highlight`,`select`],setup(a,{emit:x}){let S=a,C=x,w=m(),T=_(S,[`class`,`size`,`ui`]),E=g(C),D=t(()=>v(w));return b(t(()=>e({size:S.size},S.ui,{root:S.class}))),(e,t)=>(l(),n(p(y),s(p(T),{items:a.items},f(p(E))),i({_:2},[u(D.value,t=>({name:t,fn:h(n=>[r(` @vue-ignore ignore vue slot props type `),d(e.$slots,t,c(o(n)))])}))]),1040,[`items`]))}});export{x as default};

package/dist/components/avatar/avatar.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{avatarVariants as t}from"./variants.js";import{computed as n,createBlock as r,createSlots as i,defineComponent as a,mergeProps as o,openBlock as s,renderList as c,renderSlot as l,unref as u,useSlots as d,withCtx as f}from"vue";import{useOmitProps as p}from"@soybeanjs/headless/composables";import{keysOf as m}from"@soybeanjs/utils";import{AvatarCompact as h,provideAvatarUi as g}from"@soybeanjs/headless/avatar";const _=a({name:`SAvatar`,__name:`avatar`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},src:{},delayMs:{},fallbackLabel:{},imageProps:{},fallbackProps:{}},emits:[`loadingStatusChange`],setup(a,{emit:_}){let v=a,y=_,b=d(),x=p(v,[`class`,`size`,`ui`]),S=n(()=>m(b));return g(n(()=>e(t({size:v.size}),v.ui,{root:v.class}))),(e,t)=>(s(),r(u(h),o(u(x),{onLoadingStatusChange:t[0]||=e=>y(`loadingStatusChange`,e)}),i({_:2},[c(S.value,t=>({name:t,fn:f(()=>[l(e.$slots,t)])}))]),1040))}});export{_ as default};
+import{avatarVariants as e}from"../../styles/avatar.js";import{computed as t,createBlock as n,createSlots as r,defineComponent as i,mergeProps as a,openBlock as o,renderList as s,renderSlot as c,unref as l,useSlots as u,withCtx as d}from"vue";import{useOmitProps as f}from"@soybeanjs/headless/composables";import{keysOf as p}from"@soybeanjs/utils";import{AvatarCompact as m,provideAvatarUi as h}from"@soybeanjs/headless/avatar";const g=i({name:`SAvatar`,__name:`avatar`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},src:{},delayMs:{},fallbackLabel:{},imageProps:{},fallbackProps:{}},emits:[`loadingStatusChange`],setup(i,{emit:g}){let _=i,v=g,y=u(),b=f(_,[`class`,`size`,`ui`]),x=t(()=>p(y));return h(t(()=>e({size:_.size},_.ui,{root:_.class}))),(e,t)=>(o(),n(l(m),a(l(b),{onLoadingStatusChange:t[0]||=e=>v(`loadingStatusChange`,e)}),r({_:2},[s(x.value,t=>({name:t,fn:d(()=>[c(e.$slots,t)])}))]),1040))}});export{g as default};

package/dist/components/backtop/backtop.js

@@ -1 +1 @@
-import{cn as e}from"../../theme/merge.js";import"../../theme/index.js";import{buttonVariants as t}from"../button/variants.js";import n from"../icon/icon.js";import{backtopVariants as r}from"./variants.js";import{computed as i,createBlock as a,createVNode as o,defineComponent as s,mergeProps as c,openBlock as l,renderSlot as u,toHandlers as d,unref as f,withCtx as p}from"vue";import{useForwardListeners as m,useOmitProps as h}from"@soybeanjs/headless/composables";import{Backtop as g}from"@soybeanjs/headless/backtop";const _=s({name:`SBacktop`,__name:`backtop`,props:{class:{type:[Boolean,null,String,Object,Array]},color:{default:`primary`},size:{default:`lg`},variant:{default:`solid`},shape:{default:`circle`},shadow:{default:`lg`},fitContent:{type:Boolean,default:!0},icon:{default:`lucide:arrow-up`},iconClass:{type:[Boolean,null,String,Object,Array]},iconProps:{},visibilityHeight:{},target:{},duration:{},type:{},disabled:{type:Boolean},asChild:{type:Boolean},as:{}},emits:[`change`,`click`],setup(s,{emit:_}){let v=s,y=_,b=h(v,[`class`,`color`,`size`,`variant`,`shape`,`shadow`,`fitContent`,`icon`,`iconClass`,`iconProps`]),x=m(y),S=i(()=>{let n=r({size:v.size});return e(t({color:v.color,size:v.size,variant:v.variant,shape:v.shape,shadow:v.shadow,fitContent:v.fitContent}),n,v.class)});return(e,t)=>(l(),a(f(g),c(f(b),{class:S.value},d(f(x))),{default:p(()=>[u(e.$slots,`default`,{},()=>[o(n,c(s.iconProps,{icon:s.icon,class:s.iconClass}),null,16,[`icon`,`class`])])]),_:3},16,[`class`]))}});export{_ as default};
+import{backtopVariants as e}from"../../styles/backtop.js";import t from"../icon/icon.js";import{computed as n,createBlock as r,createVNode as i,defineComponent as a,mergeProps as o,openBlock as s,renderSlot as c,toHandlers as l,unref as u,withCtx as d}from"vue";import{useForwardListeners as f,useOmitProps as p}from"@soybeanjs/headless/composables";import{Backtop as m}from"@soybeanjs/headless/backtop";const h=a({name:`SBacktop`,__name:`backtop`,props:{class:{type:[Boolean,null,String,Object,Array]},color:{default:`primary`},size:{default:`lg`},variant:{default:`solid`},shape:{default:`circle`},shadow:{default:`lg`},fitContent:{type:Boolean,default:!0},icon:{default:`lucide:arrow-up`},iconClass:{type:[Boolean,null,String,Object,Array]},iconProps:{},visibilityHeight:{},target:{},duration:{},type:{},disabled:{type:Boolean},asChild:{type:Boolean},as:{}},emits:[`change`,`click`],setup(a,{emit:h}){let g=a,_=h,v=p(g,[`class`,`color`,`size`,`variant`,`shape`,`shadow`,`fitContent`,`icon`,`iconClass`,`iconProps`]),y=f(_),b=n(()=>e({color:g.color,size:g.size,variant:g.variant,shape:g.shape,shadow:g.shadow,fitContent:g.fitContent},g.class));return(e,n)=>(s(),r(u(m),o(u(v),{class:b.value},l(u(y))),{default:d(()=>[c(e.$slots,`default`,{},()=>[i(t,o(a.iconProps,{icon:a.icon,class:a.iconClass}),null,16,[`icon`,`class`])])]),_:3},16,[`class`]))}});export{h as default};

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

@@ -1,7 +1,6 @@
 import { ThemeColor, ThemeSize } from "../../theme/types.js";
-import { ButtonShadow, ButtonShape, ButtonVariant } from "../button/variants.js";
+import { ButtonShadow, ButtonShape, ButtonVariant } from "../../styles/button.js";
 import { BacktopProps } from "./types.js";
-
 //#region src/components/backtop/backtop.vue.d.ts
 declare var __VLS_8: {};
 type __VLS_Slots = {} & {
@@ -15,8 +14,8 @@ declare const __VLS_base: import("vue").DefineComponent<BacktopProps, {}, {}, {}
   onChange?: ((visible: boolean) => any) | undefined;
 }>, {
   icon: string;
-  color: ThemeColor;
   size: ThemeSize;
+  color: ThemeColor;
   shape: ButtonShape;
   variant: ButtonVariant;
   shadow: ButtonShadow;

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

@@ -1,6 +1,6 @@
 import { ThemeColor, ThemeSize } from "../../theme/types.js";
+import { ButtonShadow, ButtonShape, ButtonVariant } from "../../styles/button.js";
 import { IconProps } from "../icon/types.js";
-import { ButtonShadow, ButtonShape, ButtonVariant } from "../button/variants.js";
 import { BacktopEmits, BacktopProps } from "@soybeanjs/headless/backtop";
 import { ClassValue } from "@soybeanjs/headless/types";
 

package/dist/components/badge/badge.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{badgeVariants as t}from"./variants.js";import{computed as n,createBlock as r,createSlots as i,defineComponent as a,mergeProps as o,openBlock as s,renderList as c,renderSlot as l,unref as u,useSlots as d,withCtx as f}from"vue";import{useOmitProps as p}from"@soybeanjs/headless/composables";import{keysOf as m}from"@soybeanjs/utils";import{BadgeCompact as h,provideBadgeUi as g}from"@soybeanjs/headless/badge";const _=a({name:`SBadge`,__name:`badge`,props:{class:{type:[Boolean,null,String,Object,Array]},color:{},size:{},ui:{},position:{},content:{},contentProps:{},open:{type:Boolean,default:void 0}},emits:[`update:open`],setup(a,{emit:_}){let v=a,y=_,b=d(),x=p(v,[`class`,`color`,`size`,`ui`,`position`]),S=n(()=>m(b));return g(n(()=>e(t({color:v.color,size:v.size,position:v.position}),v.ui,{root:v.class}))),(e,t)=>(s(),r(u(h),o(u(x),{"onUpdate:open":t[0]||=e=>y(`update:open`,e)}),i({_:2},[c(S.value,t=>({name:t,fn:f(()=>[l(e.$slots,t)])}))]),1040))}});export{_ as default};
+import{badgeVariants as e}from"../../styles/badge.js";import{computed as t,createBlock as n,createSlots as r,defineComponent as i,mergeProps as a,openBlock as o,renderList as s,renderSlot as c,unref as l,useSlots as u,withCtx as d}from"vue";import{useOmitProps as f}from"@soybeanjs/headless/composables";import{keysOf as p}from"@soybeanjs/utils";import{BadgeCompact as m,provideBadgeUi as h}from"@soybeanjs/headless/badge";const g=i({name:`SBadge`,__name:`badge`,props:{class:{type:[Boolean,null,String,Object,Array]},color:{},size:{},ui:{},position:{},content:{},contentProps:{},open:{type:Boolean,default:void 0}},emits:[`update:open`],setup(i,{emit:g}){let _=i,v=g,y=u(),b=f(_,[`class`,`color`,`size`,`ui`,`position`]),x=t(()=>p(y));return h(t(()=>e({color:_.color,size:_.size,position:_.position},_.ui,{root:_.class}))),(e,t)=>(o(),n(l(m),a(l(b),{"onUpdate:open":t[0]||=e=>v(`update:open`,e)}),r({_:2},[s(x.value,t=>({name:t,fn:d(()=>[c(e.$slots,t)])}))]),1040))}});export{g as default};

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

@@ -1,4 +1,4 @@
-import { BadgePosition } from "./variants.js";
+import { BadgePosition } from "../../styles/badge.js";
 import { BadgeEmits, BadgeProps } from "./types.js";
 import { _default } from "./badge.vue.js";
 export type * from "@soybeanjs/headless/badge";

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

@@ -1,5 +1,5 @@
 import { ThemeColor, ThemeSize } from "../../theme/types.js";
-import { BadgePosition } from "./variants.js";
+import { BadgePosition } from "../../styles/badge.js";
 import { BadgeCompactProps, BadgeRootEmits, BadgeUi } from "@soybeanjs/headless/badge";
 import { ClassValue } from "@soybeanjs/headless/types";
 

package/dist/components/bottom-sheet/bottom-sheet.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import{miniSizeMap as t}from"../../theme/config.js";import"../../theme/index.js";import{buttonIconVariants as n,buttonVariants as r}from"../button/variants.js";import{dialogVariants as i}from"../dialog/variants.js";import{drawerVariants as a}from"../drawer/variants.js";import{bottomSheetVariants as o}from"./variants.js";import{computed as s,createBlock as c,createSlots as l,defineComponent as u,guardReactiveProps as d,mergeProps as f,normalizeProps as p,openBlock as m,renderList as h,renderSlot as g,toHandlers as _,unref as v,useSlots as y,withCtx as b}from"vue";import{useForwardListeners as x,useOmitProps as S}from"@soybeanjs/headless/composables";import{keysOf as C}from"@soybeanjs/utils";import{BottomSheetCompact as w,provideBottomSheetUi as T}from"@soybeanjs/headless/bottom-sheet";const E=u({name:`SBottomSheet`,__name:`bottom-sheet`,props:{title:{},description:{},icon:{},showClose:{type:Boolean,default:!0},pure:{type:Boolean},showCancel:{type:[String,Boolean]},cancelText:{},showConfirm:{type:Boolean,default:!0},confirmText:{},triggerProps:{},overlayProps:{},portalProps:{},popupProps:{},headerProps:{},contentProps:{},footerProps:{},titleProps:{},descriptionProps:{},closeProps:{},cancelProps:{},confirmProps:{},dir:{},isAlert:{type:Boolean},alertType:{},open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean},modal:{type:Boolean,default:!0},activeSnapPoint:{},closeThreshold:{},shouldScaleBackground:{type:Boolean,default:!0},setBackgroundColorOnScale:{type:Boolean,default:!0},scrollLockTimeout:{},fixed:{type:Boolean},dismissible:{type:Boolean,default:!0},nested:{type:Boolean},direction:{},noBodyStyles:{type:Boolean},handleOnly:{type:Boolean},preventScrollRestoration:{type:Boolean},snapPoints:{},fadeFromIndex:{},handleProps:{},class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{}},emits:[`update:open`,`click`,`escapeKeyDown`,`pointerDownOutside`,`focusOutside`,`interactOutside`,`openAutoFocus`,`closeAutoFocus`,`confirm`,`cancel`,`drag`,`release`,`close`,`update:activeSnapPoint`],setup(u,{emit:E}){let D=u,O=E,k=y(),A=S(D,[`class`,`size`,`ui`]),j=x(O),M=s(()=>C(k));return T(s(()=>e(Object.assign(o({size:D.size}),i({size:D.size,pure:D.pure}),a({size:D.size,side:`bottom`}),{$base:{cancel:r({variant:`pure`,size:t[D.size??`md`]}),confirm:r({variant:`solid`,size:t[D.size??`md`]}),close:n({size:t[D.size??`md`]})}}),D.ui,{popup:D.class}))),(e,t)=>(m(),c(v(w),f(v(A),_(v(j))),l({_:2},[h(M.value,t=>({name:t,fn:b(n=>[g(e.$slots,t,p(d(n)))])}))]),1040))}});export{E as default};
+import{bottomSheetVariants as e}from"../../styles/bottom-sheet.js";import{computed as t,createBlock as n,createSlots as r,defineComponent as i,guardReactiveProps as a,mergeProps as o,normalizeProps as s,openBlock as c,renderList as l,renderSlot as u,toHandlers as d,unref as f,useSlots as p,withCtx as m}from"vue";import{useForwardListeners as h,useOmitProps as g}from"@soybeanjs/headless/composables";import{keysOf as _}from"@soybeanjs/utils";import{BottomSheetCompact as v,provideBottomSheetUi as y}from"@soybeanjs/headless/bottom-sheet";const b=i({name:`SBottomSheet`,__name:`bottom-sheet`,props:{title:{},description:{},icon:{},showClose:{type:Boolean,default:!0},pure:{type:Boolean},showCancel:{type:[String,Boolean]},cancelText:{},showConfirm:{type:Boolean,default:!0},confirmText:{},triggerProps:{},overlayProps:{},portalProps:{},popupProps:{},headerProps:{},contentProps:{},footerProps:{},titleProps:{},descriptionProps:{},closeProps:{},cancelProps:{},confirmProps:{},dir:{},isAlert:{type:Boolean},alertType:{},open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean},modal:{type:Boolean,default:!0},activeSnapPoint:{},closeThreshold:{},shouldScaleBackground:{type:Boolean,default:!0},setBackgroundColorOnScale:{type:Boolean,default:!0},scrollLockTimeout:{},fixed:{type:Boolean},dismissible:{type:Boolean,default:!0},nested:{type:Boolean},direction:{},noBodyStyles:{type:Boolean},handleOnly:{type:Boolean},preventScrollRestoration:{type:Boolean},snapPoints:{},fadeFromIndex:{},handleProps:{},class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{}},emits:[`update:open`,`click`,`escapeKeyDown`,`pointerDownOutside`,`focusOutside`,`interactOutside`,`openAutoFocus`,`closeAutoFocus`,`confirm`,`cancel`,`drag`,`release`,`close`,`update:activeSnapPoint`],setup(i,{emit:b}){let x=i,S=b,C=p(),w=g(x,[`class`,`size`,`ui`]),T=h(S),E=t(()=>_(C));return y(t(()=>e({size:x.size},x.ui,{popup:x.class}))),(e,t)=>(c(),n(f(v),o(f(w),d(f(T))),r({_:2},[l(E.value,t=>({name:t,fn:m(n=>[u(e.$slots,t,s(a(n)))])}))]),1040))}});export{b as default};

package/dist/components/breadcrumb/breadcrumb.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{breadcrumbVariants as t}from"./variants.js";import{computed as n,createBlock as r,createCommentVNode as i,createSlots as a,defineComponent as o,guardReactiveProps as s,mergeProps as c,normalizeProps as l,openBlock as u,renderList as d,renderSlot as f,toHandlers as p,unref as m,useSlots as h,withCtx as g}from"vue";import{useForwardListeners as _,useOmitProps as v}from"@soybeanjs/headless/composables";import{keysOf as y}from"@soybeanjs/utils";import{BreadcrumbCompact as b,provideBreadcrumbUi as x}from"@soybeanjs/headless/breadcrumb";const S=o({name:`SBreadcrumb`,__name:`breadcrumb`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},items:{},ellipsis:{type:[Boolean,Array,null]},listProps:{},itemProps:{},linkProps:{},pageProps:{},separatorProps:{},ellipsisProps:{}},emits:[`click`],setup(o,{emit:S}){let C=o,w=S,T=h(),E=v(C,[`class`,`size`,`ui`]),D=_(w),O=n(()=>y(T));return x(n(()=>e(t({size:C.size}),C.ui,{root:C.class}))),(e,t)=>(u(),r(m(b),c(m(E),p(m(D))),a({_:2},[d(O.value,t=>({name:t,fn:g(n=>[i(` @vue-ignore ignore vue slot props type `),f(e.$slots,t,l(s(n)))])}))]),1040))}});export{S as default};
+import{breadcrumbVariants as e}from"../../styles/breadcrumb.js";import{computed as t,createBlock as n,createCommentVNode as r,createSlots as i,defineComponent as a,guardReactiveProps as o,mergeProps as s,normalizeProps as c,openBlock as l,renderList as u,renderSlot as d,toHandlers as f,unref as p,useSlots as m,withCtx as h}from"vue";import{useForwardListeners as g,useOmitProps as _}from"@soybeanjs/headless/composables";import{keysOf as v}from"@soybeanjs/utils";import{BreadcrumbCompact as y,provideBreadcrumbUi as b}from"@soybeanjs/headless/breadcrumb";const x=a({name:`SBreadcrumb`,__name:`breadcrumb`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},items:{},ellipsis:{type:[Boolean,Array,null]},listProps:{},itemProps:{},linkProps:{},pageProps:{},separatorProps:{},ellipsisProps:{}},emits:[`click`],setup(a,{emit:x}){let S=a,C=x,w=m(),T=_(S,[`class`,`size`,`ui`]),E=g(C),D=t(()=>v(w));return b(t(()=>e({size:S.size},S.ui,{root:S.class}))),(e,t)=>(l(),n(p(y),s(p(T),f(p(E))),i({_:2},[u(D.value,t=>({name:t,fn:h(n=>[r(` @vue-ignore ignore vue slot props type `),d(e.$slots,t,c(o(n)))])}))]),1040))}});export{x as default};

package/dist/components/button/button-group.js

@@ -1 +1 @@
-import{cn as e}from"../../theme/merge.js";import"../../theme/index.js";import{buttonGroupVariants as t}from"./variants.js";import{useConfigProvider as n}from"../config-provider/context.js";import{provideButtonGroupContext as r}from"./context.js";import{computed as i,createBlock as a,defineComponent as o,mergeProps as s,openBlock as c,renderSlot as l,unref as u,withCtx as d}from"vue";import{useOmitProps as f}from"@soybeanjs/headless/composables";import{Primitive as p}from"@soybeanjs/headless/primitive";import{transformPropsToContext as m}from"@soybeanjs/headless/shared";const h=o({name:`SButtonGroup`,__name:`button-group`,props:{orientation:{default:`horizontal`},dir:{},class:{type:[Boolean,null,String,Object,Array]},color:{},size:{},variant:{},shape:{},shadow:{},fitContent:{type:Boolean},type:{},disabled:{type:Boolean},asChild:{type:Boolean},as:{}},setup(o){let h=o,g=f(h,[`class`,`orientation`,`color`,`size`,`variant`,`shape`,`shadow`,`disabled`]),_=n(`ButtonGroup`),v=i(()=>e(t({orientation:h.orientation}),h.class)),y=i(()=>h.dir??_.dir.value);return r(m(h,[`color`,`size`,`variant`,`shape`,`shadow`,`fitContent`,`disabled`])),(e,t)=>(c(),a(u(p),s(u(g),{class:v.value,dir:y.value}),{default:d(()=>[l(e.$slots,`default`)]),_:3},16,[`class`,`dir`]))}});export{h as default};
+import{buttonGroupVariants as e}from"../../styles/button.js";import{useConfigProvider as t}from"../config-provider/context.js";import{provideButtonGroupContext as n}from"./context.js";import{computed as r,createBlock as i,defineComponent as a,mergeProps as o,openBlock as s,renderSlot as c,unref as l,withCtx as u}from"vue";import{useOmitProps as d}from"@soybeanjs/headless/composables";import{Primitive as f}from"@soybeanjs/headless/primitive";import{transformPropsToContext as p}from"@soybeanjs/headless/shared";const m=a({name:`SButtonGroup`,__name:`button-group`,props:{orientation:{default:`horizontal`},dir:{},class:{type:[Boolean,null,String,Object,Array]},color:{},size:{},variant:{},shape:{},shadow:{},fitContent:{type:Boolean},type:{},disabled:{type:Boolean},asChild:{type:Boolean},as:{}},setup(a){let m=a,h=d(m,[`class`,`orientation`,`color`,`size`,`variant`,`shape`,`shadow`,`disabled`]),g=t(`ButtonGroup`),_=r(()=>e({orientation:m.orientation},m.class)),v=r(()=>m.dir??g.dir.value);return n(p(m,[`color`,`size`,`variant`,`shape`,`shadow`,`fitContent`,`disabled`])),(e,t)=>(s(),i(l(f),o(l(h),{class:_.value,dir:v.value}),{default:u(()=>[c(e.$slots,`default`)]),_:3},16,[`class`,`dir`]))}});export{m as default};

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

@@ -1,5 +1,5 @@
 import { ThemeColor } from "../../theme/types.js";
-import { ButtonShape, ButtonVariant } from "./variants.js";
+import { ButtonShape, ButtonVariant } from "../../styles/button.js";
 import { ButtonIconProps } from "./types.js";
 //#region src/components/button/button-icon.vue.d.ts
 declare const __VLS_export: import("vue").DefineComponent<ButtonIconProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ButtonIconProps> & Readonly<{}>, {

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

@@ -1,4 +1,4 @@
-import { ButtonVariant } from "./variants.js";
+import { ButtonVariant } from "../../styles/button.js";
 import { ButtonLinkProps } from "./types.js";
 
 //#region src/components/button/button-link.vue.d.ts
@@ -11,9 +11,9 @@ type __VLS_Slots = {} & {
   default?: (props: typeof __VLS_14) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<ButtonLinkProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ButtonLinkProps> & Readonly<{}>, {
+  replace: boolean;
   variant: ButtonVariant;
   disabled: boolean;
-  replace: boolean;
   external: boolean;
   viewTransition: boolean;
   noRel: boolean;

package/dist/components/button/button.js

@@ -1 +1 @@
-import{cn as e}from"../../theme/merge.js";import"../../theme/index.js";import{buttonVariants as t}from"./variants.js";import{useButtonGroupContext as n}from"./context.js";import{computed as r,createBlock as i,defineComponent as a,mergeProps as o,openBlock as s,renderSlot as c,unref as l,withCtx as u}from"vue";import{useOmitProps as d}from"@soybeanjs/headless/composables";import{Button as f}from"@soybeanjs/headless/button";const p=a({name:`SButton`,__name:`button`,props:{class:{type:[Boolean,null,String,Object,Array]},color:{},size:{},variant:{},shape:{},shadow:{},fitContent:{type:Boolean},type:{},disabled:{type:Boolean},asChild:{type:Boolean},as:{}},emits:[`click`],setup(a,{emit:p}){let m=a,h=p,g=n(),_=d(m,[`class`,`size`,`color`,`variant`,`shape`,`shadow`,`disabled`,`fitContent`]),v=r(()=>{let{size:n,color:r,variant:i,shape:a,shadow:o,fitContent:s}=g||{};return e(t({size:m.size||n?.value,color:m.color||r?.value,variant:m.variant||i?.value,shape:m.shape||a?.value,shadow:m.shadow||o?.value,fitContent:m.fitContent||s?.value}),m.class)}),y=r(()=>m.disabled||g?.disabled.value);return(e,t)=>(s(),i(l(f),o(l(_),{class:v.value,disabled:y.value,onClick:t[0]||=e=>h(`click`,e)}),{default:u(()=>[c(e.$slots,`leading`),c(e.$slots,`default`),c(e.$slots,`trailing`)]),_:3},16,[`class`,`disabled`]))}});export{p as default};
+import{buttonVariants as e}from"../../styles/button.js";import{useButtonGroupContext as t}from"./context.js";import{computed as n,createBlock as r,defineComponent as i,mergeProps as a,openBlock as o,renderSlot as s,unref as c,withCtx as l}from"vue";import{useOmitProps as u}from"@soybeanjs/headless/composables";import{Button as d}from"@soybeanjs/headless/button";const f=i({name:`SButton`,__name:`button`,props:{class:{type:[Boolean,null,String,Object,Array]},color:{},size:{},variant:{},shape:{},shadow:{},fitContent:{type:Boolean},type:{},disabled:{type:Boolean},asChild:{type:Boolean},as:{}},emits:[`click`],setup(i,{emit:f}){let p=i,m=f,h=t(),g=u(p,[`class`,`size`,`color`,`variant`,`shape`,`shadow`,`disabled`,`fitContent`]),_=n(()=>{let{size:t,color:n,variant:r,shape:i,shadow:a,fitContent:o}=h||{};return e({size:p.size||t?.value,color:p.color||n?.value,variant:p.variant||r?.value,shape:p.shape||i?.value,shadow:p.shadow||a?.value,fitContent:p.fitContent||o?.value},p.class)}),v=n(()=>p.disabled||h?.disabled.value);return(e,t)=>(o(),r(c(d),a(c(g),{class:_.value,disabled:v.value,onClick:t[0]||=e=>m(`click`,e)}),{default:l(()=>[s(e.$slots,`leading`),s(e.$slots,`default`),s(e.$slots,`trailing`)]),_:3},16,[`class`,`disabled`]))}});export{f as default};

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

@@ -1,4 +1,4 @@
-import { ButtonShadow, ButtonShape, ButtonVariant } from "./variants.js";
+import { ButtonShadow, ButtonShape, ButtonVariant } from "../../styles/button.js";
 import { ButtonEmits, ButtonGroupProps, ButtonIconProps, ButtonLinkProps, ButtonLoadingProps, ButtonProps } from "./types.js";
 import { _default } from "./button.vue.js";
 import { _default as _default$1 } from "./button-loading.vue.js";

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

@@ -1,7 +1,7 @@
 import { ThemeColor, ThemeSize } from "../../theme/types.js";
+import { ButtonShadow, ButtonShape, ButtonVariant } from "../../styles/button.js";
 import { IconProps } from "../icon/types.js";
 import { LinkProps } from "../link/types.js";
-import { ButtonShadow, ButtonShape, ButtonVariant } from "./variants.js";
 import { ButtonEmits, ButtonProps } from "@soybeanjs/headless/button";
 import { Align, ClassValue, DataOrientation, Direction } from "@soybeanjs/headless/types";
 

package/dist/components/calendar/calendar.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import{miniSizeMap as t}from"../../theme/config.js";import"../../theme/index.js";import{buttonIconVariants as n}from"../button/variants.js";import r from"../icon/icon.js";import i from"../select/select.js";import{calendarVariants as a}from"./variants.js";import{computed as o,createBlock as s,createSlots as c,createTextVNode as l,createVNode as u,defineComponent as d,guardReactiveProps as f,mergeProps as p,normalizeProps as m,openBlock as h,renderSlot as g,toDisplayString as _,toHandlers as v,unref as y,withCtx as b}from"vue";import{useForwardListeners as x,useOmitProps as S}from"@soybeanjs/headless/composables";import{useLocaleMessages as C}from"@soybeanjs/headless";import{CalendarCompact as w,provideCalendarUi as T}from"@soybeanjs/headless/calendar";const E=d({name:`SCalendar`,__name:`calendar`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},headerProps:{},headingProps:{},prevProps:{},nextProps:{},gridProps:{},gridHeadProps:{},gridBodyProps:{},gridRowProps:{},headCellProps:{},cellProps:{},cellTriggerProps:{},dir:{},locale:{},modelValue:{},defaultValue:{},multiple:{},placeholder:{},defaultPlaceholder:{},disabled:{type:Boolean},readonly:{type:Boolean},pagedNavigation:{type:Boolean},preventDeselect:{type:Boolean},weekStartsOn:{},weekdayFormat:{},calendarLabel:{},fixedWeeks:{type:Boolean},maxValue:{},minValue:{},numberOfMonths:{},initialFocus:{type:Boolean},isDateDisabled:{type:Function},isDateUnavailable:{type:Function},nextPage:{type:Function},prevPage:{type:Function},disableDaysOutsideCurrentView:{type:Boolean},asChild:{type:Boolean},as:{}},emits:[`update:modelValue`,`update:placeholder`],setup(d,{emit:E}){let D=d,O=E,k=S(D,[`class`,`size`,`ui`]),A=x(O),j=C(),M=o(()=>({"aria-label":j.value.calendar.selectMonth})),N=o(()=>({"aria-label":j.value.calendar.selectYear})),P=o(()=>{let r=t[D.size||`md`];return e(Object.assign(a({size:D.size}),{$base:{prev:n({size:r,variant:`pure`}),next:n({size:r,variant:`pure`})}}),D.ui,{root:D.class})}),F=o(()=>t[D.size||`md`]);return T(P),(e,t)=>(h(),s(y(w),p(y(k),v(y(A))),c({prev:b(t=>[g(e.$slots,`prev`,m(f(t)),()=>[u(r,{icon:`lucide:chevron-left`})])]),next:b(t=>[g(e.$slots,`next`,m(f(t)),()=>[u(r,{icon:`lucide:chevron-right`})])]),"head-cell":b(t=>[g(e.$slots,`head-cell`,m(f(t)),()=>[l(_(t.label),1)])]),day:b(t=>[g(e.$slots,`day`,m(f(t)),()=>[l(_(t.dayValue),1)])]),default:b(t=>[g(e.$slots,`default`,m(f(t)))]),_:2},[e.$slots.heading?{name:`heading`,fn:b(t=>[g(e.$slots,`heading`,m(f(t)))]),key:`0`}:{name:`heading`,fn:b(({monthOptions:e,yearOptions:t,selectedMonth:n,selectedYear:r,onMonthChange:a,onYearChange:o})=>[u(i,{size:F.value,disabled:d.disabled,clearable:!1,items:e,"model-value":n,"trigger-props":M.value,ui:{trigger:`w-fit`},"onUpdate:modelValue":a},null,8,[`size`,`disabled`,`items`,`model-value`,`trigger-props`,`onUpdate:modelValue`]),u(i,{size:F.value,disabled:d.disabled,clearable:!1,items:t,"model-value":r,"trigger-props":N.value,ui:{popup:`max-h-72`,trigger:`w-fit`},"onUpdate:modelValue":o},null,8,[`size`,`disabled`,`items`,`model-value`,`trigger-props`,`onUpdate:modelValue`])]),key:`1`}]),1040))}});export{E as default};
+import{miniSizeMap as e}from"../../theme/config.js";import"../../theme/index.js";import t from"../icon/icon.js";import{calendarVariants as n}from"../../styles/calendar.js";import r from"../select/select.js";import{computed as i,createBlock as a,createSlots as o,createTextVNode as s,createVNode as c,defineComponent as l,guardReactiveProps as u,mergeProps as d,normalizeProps as f,openBlock as p,renderSlot as m,toDisplayString as h,toHandlers as g,unref as _,withCtx as v}from"vue";import{useForwardListeners as y,useOmitProps as b}from"@soybeanjs/headless/composables";import{useLocaleMessages as x}from"@soybeanjs/headless";import{CalendarCompact as S,provideCalendarUi as C}from"@soybeanjs/headless/calendar";const w=l({name:`SCalendar`,__name:`calendar`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},headerProps:{},headingProps:{},prevProps:{},nextProps:{},gridProps:{},gridHeadProps:{},gridBodyProps:{},gridRowProps:{},headCellProps:{},cellProps:{},cellTriggerProps:{},dir:{},locale:{},modelValue:{},defaultValue:{},multiple:{},placeholder:{},defaultPlaceholder:{},disabled:{type:Boolean},readonly:{type:Boolean},pagedNavigation:{type:Boolean},preventDeselect:{type:Boolean},weekStartsOn:{},weekdayFormat:{},calendarLabel:{},fixedWeeks:{type:Boolean},maxValue:{},minValue:{},numberOfMonths:{},initialFocus:{type:Boolean},isDateDisabled:{type:Function},isDateUnavailable:{type:Function},nextPage:{type:Function},prevPage:{type:Function},disableDaysOutsideCurrentView:{type:Boolean},asChild:{type:Boolean},as:{}},emits:[`update:modelValue`,`update:placeholder`],setup(l,{emit:w}){let T=l,E=w,D=b(T,[`class`,`size`,`ui`]),O=y(E),k=x(),A=i(()=>({"aria-label":k.value.calendar.selectMonth})),j=i(()=>({"aria-label":k.value.calendar.selectYear})),M=i(()=>n({size:T.size},T.ui,{root:T.class})),N=i(()=>e[T.size||`md`]);return C(M),(e,n)=>(p(),a(_(S),d(_(D),g(_(O))),o({prev:v(n=>[m(e.$slots,`prev`,f(u(n)),()=>[c(t,{icon:`lucide:chevron-left`})])]),next:v(n=>[m(e.$slots,`next`,f(u(n)),()=>[c(t,{icon:`lucide:chevron-right`})])]),"head-cell":v(t=>[m(e.$slots,`head-cell`,f(u(t)),()=>[s(h(t.label),1)])]),day:v(t=>[m(e.$slots,`day`,f(u(t)),()=>[s(h(t.dayValue),1)])]),default:v(t=>[m(e.$slots,`default`,f(u(t)))]),_:2},[e.$slots.heading?{name:`heading`,fn:v(t=>[m(e.$slots,`heading`,f(u(t)))]),key:`0`}:{name:`heading`,fn:v(({monthOptions:e,yearOptions:t,selectedMonth:n,selectedYear:i,onMonthChange:a,onYearChange:o})=>[c(r,{size:N.value,disabled:l.disabled,clearable:!1,items:e,"model-value":n,"trigger-props":A.value,ui:{trigger:`w-fit`},"onUpdate:modelValue":a},null,8,[`size`,`disabled`,`items`,`model-value`,`trigger-props`,`onUpdate:modelValue`]),c(r,{size:N.value,disabled:l.disabled,clearable:!1,items:t,"model-value":i,"trigger-props":j.value,ui:{popup:`max-h-72`,trigger:`w-fit`},"onUpdate:modelValue":o},null,8,[`size`,`disabled`,`items`,`model-value`,`trigger-props`,`onUpdate:modelValue`])]),key:`1`}]),1040))}});export{w as default};

package/dist/components/calendar-range/calendar-range.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import{miniSizeMap as t}from"../../theme/config.js";import"../../theme/index.js";import{buttonVariants as n}from"../button/variants.js";import r from"../select/select.js";import{calendarRangeVariants as i}from"./variants.js";import{computed as a,createBlock as o,createCommentVNode as s,createSlots as c,createVNode as l,defineComponent as u,guardReactiveProps as d,mergeProps as f,normalizeProps as p,openBlock as m,renderList as h,renderSlot as g,toHandlers as _,unref as v,useSlots as y,withCtx as b}from"vue";import{useForwardListeners as x,useOmitProps as S}from"@soybeanjs/headless/composables";import{keysOf as C}from"@soybeanjs/utils";import{useLocaleMessages as w}from"@soybeanjs/headless";import{CalendarRangeCompact as T,provideCalendarRangeUi as E}from"@soybeanjs/headless/calendar-range";const D=u({name:`SCalendarRange`,__name:`calendar-range`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},headerProps:{},headingProps:{},prevProps:{},nextProps:{},gridProps:{},gridHeadProps:{},gridBodyProps:{},gridRowProps:{},headCellProps:{},cellProps:{},cellTriggerProps:{},defaultValue:{},defaultPlaceholder:{},placeholder:{},modelValue:{},allowNonContiguousRanges:{type:Boolean},pagedNavigation:{type:Boolean},preventDeselect:{type:Boolean},maximumDays:{},weekStartsOn:{},weekdayFormat:{},calendarLabel:{},fixedWeeks:{type:Boolean},maxValue:{},minValue:{},locale:{},numberOfMonths:{},disabled:{type:Boolean},readonly:{type:Boolean},initialFocus:{type:Boolean},isDateDisabled:{type:Function},isDateUnavailable:{type:Function},isDateHighlightable:{type:Function},dir:{},nextPage:{type:Function},prevPage:{type:Function},disableDaysOutsideCurrentView:{type:Boolean},fixedDate:{},asChild:{type:Boolean},as:{}},emits:[`update:modelValue`,`update:placeholder`,`update:startValue`],setup(u,{emit:D}){let O=u,k=D,A=y(),j=S(O,[`class`,`ui`,`size`]),M=x(k),N=w(),P=a(()=>({"aria-label":N.value.calendar.selectMonth})),F=a(()=>({"aria-label":N.value.calendar.selectYear})),I=a(()=>C(A).filter(e=>e!==`heading`)),L=a(()=>e(Object.assign(i({size:O.size}),{$base:{prev:n({size:O.size,variant:`pure`,fitContent:!0}),next:n({size:O.size,variant:`pure`,fitContent:!0})}}),O.ui,{root:O.class})),R=a(()=>t[O.size||`md`]);return E(L),(e,t)=>(m(),o(v(T),f(v(j),_(v(M))),c({_:2},[h(I.value,t=>({name:t,fn:b(n=>[s(` @vue-expect-error ignore slot props type `),g(e.$slots,t,p(d(n)))])})),e.$slots.heading?{name:`heading`,fn:b(t=>[g(e.$slots,`heading`,p(d(t)))]),key:`0`}:{name:`heading`,fn:b(({monthOptions:e,yearOptions:t,selectedMonth:n,selectedYear:i,onMonthChange:a,onYearChange:o})=>[l(r,{size:R.value,disabled:u.disabled,clearable:!1,items:e,"model-value":n,"trigger-props":P.value,ui:{trigger:`w-fit`},"onUpdate:modelValue":a},null,8,[`size`,`disabled`,`items`,`model-value`,`trigger-props`,`onUpdate:modelValue`]),l(r,{size:R.value,disabled:u.disabled,clearable:!1,items:t,"model-value":i,"trigger-props":F.value,ui:{popup:`max-h-72`,trigger:`w-fit`},"onUpdate:modelValue":o},null,8,[`size`,`disabled`,`items`,`model-value`,`trigger-props`,`onUpdate:modelValue`])]),key:`1`}]),1040))}});export{D as default};
+import{miniSizeMap as e}from"../../theme/config.js";import"../../theme/index.js";import t from"../select/select.js";import{calendarRangeVariants as n}from"../../styles/calendar-range.js";import{computed as r,createBlock as i,createCommentVNode as a,createSlots as o,createVNode as s,defineComponent as c,guardReactiveProps as l,mergeProps as u,normalizeProps as d,openBlock as f,renderList as p,renderSlot as m,toHandlers as h,unref as g,useSlots as _,withCtx as v}from"vue";import{useForwardListeners as y,useOmitProps as b}from"@soybeanjs/headless/composables";import{keysOf as x}from"@soybeanjs/utils";import{useLocaleMessages as S}from"@soybeanjs/headless";import{CalendarRangeCompact as C,provideCalendarRangeUi as w}from"@soybeanjs/headless/calendar-range";const T=c({name:`SCalendarRange`,__name:`calendar-range`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},headerProps:{},headingProps:{},prevProps:{},nextProps:{},gridProps:{},gridHeadProps:{},gridBodyProps:{},gridRowProps:{},headCellProps:{},cellProps:{},cellTriggerProps:{},defaultValue:{},defaultPlaceholder:{},placeholder:{},modelValue:{},allowNonContiguousRanges:{type:Boolean},pagedNavigation:{type:Boolean},preventDeselect:{type:Boolean},maximumDays:{},weekStartsOn:{},weekdayFormat:{},calendarLabel:{},fixedWeeks:{type:Boolean},maxValue:{},minValue:{},locale:{},numberOfMonths:{},disabled:{type:Boolean},readonly:{type:Boolean},initialFocus:{type:Boolean},isDateDisabled:{type:Function},isDateUnavailable:{type:Function},isDateHighlightable:{type:Function},dir:{},nextPage:{type:Function},prevPage:{type:Function},disableDaysOutsideCurrentView:{type:Boolean},fixedDate:{},asChild:{type:Boolean},as:{}},emits:[`update:modelValue`,`update:placeholder`,`update:startValue`],setup(c,{emit:T}){let E=c,D=T,O=_(),k=b(E,[`class`,`ui`,`size`]),A=y(D),j=S(),M=r(()=>({"aria-label":j.value.calendar.selectMonth})),N=r(()=>({"aria-label":j.value.calendar.selectYear})),P=r(()=>x(O).filter(e=>e!==`heading`)),F=r(()=>n({size:E.size},E.ui,{root:E.class})),I=r(()=>e[E.size||`md`]);return w(F),(e,n)=>(f(),i(g(C),u(g(k),h(g(A))),o({_:2},[p(P.value,t=>({name:t,fn:v(n=>[a(` @vue-expect-error ignore slot props type `),m(e.$slots,t,d(l(n)))])})),e.$slots.heading?{name:`heading`,fn:v(t=>[m(e.$slots,`heading`,d(l(t)))]),key:`0`}:{name:`heading`,fn:v(({monthOptions:e,yearOptions:n,selectedMonth:r,selectedYear:i,onMonthChange:a,onYearChange:o})=>[s(t,{size:I.value,disabled:c.disabled,clearable:!1,items:e,"model-value":r,"trigger-props":M.value,ui:{trigger:`w-fit`},"onUpdate:modelValue":a},null,8,[`size`,`disabled`,`items`,`model-value`,`trigger-props`,`onUpdate:modelValue`]),s(t,{size:I.value,disabled:c.disabled,clearable:!1,items:n,"model-value":i,"trigger-props":N.value,ui:{popup:`max-h-72`,trigger:`w-fit`},"onUpdate:modelValue":o},null,8,[`size`,`disabled`,`items`,`model-value`,`trigger-props`,`onUpdate:modelValue`])]),key:`1`}]),1040))}});export{T as default};

package/dist/components/card/card.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{cardVariants as t}from"./variants.js";import{computed as n,createBlock as r,createSlots as i,defineComponent as a,guardReactiveProps as o,normalizeProps as s,openBlock as c,renderSlot as l,unref as u,useSlots as d,withCtx as f}from"vue";import{useOmitProps as p}from"@soybeanjs/headless/composables";import{CardCompact as m,provideCardUi as h}from"@soybeanjs/headless/card";const g=a({name:`SCard`,__name:`card`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},scrollable:{type:Boolean,default:!0},split:{type:Boolean},title:{},description:{},headerProps:{},contentProps:{},footerProps:{},titleRootProps:{},titleProps:{},descriptionProps:{},defaultOpen:{type:Boolean,default:!0},open:{type:Boolean,default:void 0},disabled:{type:Boolean},unmountOnHide:{type:Boolean},asChild:{type:Boolean},as:{}},setup(a){let g=a,_=p(g,[`class`,`size`,`ui`,`scrollable`,`split`]),v=d();return h(n(()=>e(t({size:g.size,scrollable:g.scrollable,split:g.split}),g.ui,{root:g.class}))),(e,t)=>(c(),r(u(m),s(o(u(_))),i({default:f(()=>[l(e.$slots,`default`)]),_:2},[v.header?{name:`header`,fn:f(()=>[l(e.$slots,`header`)]),key:`0`}:void 0,v[`title-leading`]?{name:`title-leading`,fn:f(()=>[l(e.$slots,`title-leading`)]),key:`1`}:void 0,v.title?{name:`title`,fn:f(()=>[l(e.$slots,`title`)]),key:`2`}:void 0,v[`title-trailing`]?{name:`title-trailing`,fn:f(()=>[l(e.$slots,`title-trailing`)]),key:`3`}:void 0,v.extra?{name:`extra`,fn:f(()=>[l(e.$slots,`extra`)]),key:`4`}:void 0,v.description?{name:`description`,fn:f(()=>[l(e.$slots,`description`)]),key:`5`}:void 0,v.footer?{name:`footer`,fn:f(()=>[l(e.$slots,`footer`)]),key:`6`}:void 0]),1040))}});export{g as default};
+import{cardVariants as e}from"../../styles/card.js";import{computed as t,createBlock as n,createSlots as r,defineComponent as i,guardReactiveProps as a,normalizeProps as o,openBlock as s,renderSlot as c,unref as l,useSlots as u,withCtx as d}from"vue";import{useOmitProps as f}from"@soybeanjs/headless/composables";import{CardCompact as p,provideCardUi as m}from"@soybeanjs/headless/card";const h=i({name:`SCard`,__name:`card`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},scrollable:{type:Boolean,default:!0},split:{type:Boolean},title:{},description:{},headerProps:{},contentProps:{},footerProps:{},titleRootProps:{},titleProps:{},descriptionProps:{},defaultOpen:{type:Boolean,default:!0},open:{type:Boolean,default:void 0},disabled:{type:Boolean},unmountOnHide:{type:Boolean},asChild:{type:Boolean},as:{}},setup(i){let h=i,g=f(h,[`class`,`size`,`ui`,`scrollable`,`split`]),_=u();return m(t(()=>e({size:h.size,scrollable:h.scrollable,split:h.split},h.ui,{root:h.class}))),(e,t)=>(s(),n(l(p),o(a(l(g))),r({default:d(()=>[c(e.$slots,`default`)]),_:2},[_.header?{name:`header`,fn:d(()=>[c(e.$slots,`header`)]),key:`0`}:void 0,_[`title-leading`]?{name:`title-leading`,fn:d(()=>[c(e.$slots,`title-leading`)]),key:`1`}:void 0,_.title?{name:`title`,fn:d(()=>[c(e.$slots,`title`)]),key:`2`}:void 0,_[`title-trailing`]?{name:`title-trailing`,fn:d(()=>[c(e.$slots,`title-trailing`)]),key:`3`}:void 0,_.extra?{name:`extra`,fn:d(()=>[c(e.$slots,`extra`)]),key:`4`}:void 0,_.description?{name:`description`,fn:d(()=>[c(e.$slots,`description`)]),key:`5`}:void 0,_.footer?{name:`footer`,fn:d(()=>[c(e.$slots,`footer`)]),key:`6`}:void 0]),1040))}});export{h as default};

package/dist/components/carousel/carousel.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{buttonIconVariants as t}from"../button/variants.js";import{carouselVariants as n}from"./variants.js";import{computed as r,createBlock as i,createSlots as a,defineComponent as o,guardReactiveProps as s,mergeProps as c,normalizeProps as l,openBlock as u,renderList as d,renderSlot as f,toHandlers as p,unref as m,useSlots as h,withCtx as g}from"vue";import{useForwardListeners as _,useOmitProps as v}from"@soybeanjs/headless/composables";import{keysOf as y}from"@soybeanjs/utils";import{CarouselCompact as b,provideCarouselUi as x}from"@soybeanjs/headless/carousel";const S=o({name:`SCarousel`,__name:`carousel`,props:{class:{type:[Boolean,null,String,Object,Array]},ui:{},size:{},floatNav:{type:Boolean},slides:{},contentProps:{},containerProps:{},itemProps:{},controlProps:{},navigationProps:{},previousProps:{},nextProps:{},dir:{},orientation:{},options:{},plugins:{}},emits:[`init`],setup(o,{emit:S}){let C=o,w=S,T=h(),E=v(C,[`class`,`ui`,`size`,`floatNav`]),D=_(w),O=r(()=>y(T).filter(e=>e!==`item`));return x(r(()=>e(Object.assign(n({size:C.size,orientation:C.orientation,floatNav:C.floatNav}),{$base:{previous:t({size:C.size,variant:`pure`,shape:`circle`}),next:t({size:C.size,variant:`pure`,shape:`circle`})}}),C.ui,{root:C.class}))),(e,t)=>(u(),i(m(b),c(m(E),p(m(D))),a({item:g(t=>[f(e.$slots,`item`,l(s(t)))]),_:2},[d(O.value,t=>({name:t,fn:g(n=>[f(e.$slots,t,l(s(n)))])}))]),1040))}});export{S as default};
+import{carouselVariants as e}from"../../styles/carousel.js";import{computed as t,createBlock as n,createSlots as r,defineComponent as i,guardReactiveProps as a,mergeProps as o,normalizeProps as s,openBlock as c,renderList as l,renderSlot as u,toHandlers as d,unref as f,useSlots as p,withCtx as m}from"vue";import{useForwardListeners as h,useOmitProps as g}from"@soybeanjs/headless/composables";import{keysOf as _}from"@soybeanjs/utils";import{CarouselCompact as v,provideCarouselUi as y}from"@soybeanjs/headless/carousel";const b=i({name:`SCarousel`,__name:`carousel`,props:{class:{type:[Boolean,null,String,Object,Array]},ui:{},size:{},floatNav:{type:Boolean},slides:{},contentProps:{},containerProps:{},itemProps:{},controlProps:{},navigationProps:{},previousProps:{},nextProps:{},dir:{},orientation:{},options:{},plugins:{}},emits:[`init`],setup(i,{emit:b}){let x=i,S=b,C=p(),w=g(x,[`class`,`ui`,`size`,`floatNav`]),T=h(S),E=t(()=>_(C).filter(e=>e!==`item`));return y(t(()=>e({size:x.size,orientation:x.orientation,floatNav:x.floatNav},x.ui,{root:x.class}))),(e,t)=>(c(),n(f(v),o(f(w),d(f(T))),r({item:m(t=>[u(e.$slots,`item`,s(a(t)))]),_:2},[l(E.value,t=>({name:t,fn:m(n=>[u(e.$slots,t,s(a(n)))])}))]),1040))}});export{b as default};

package/dist/components/checkbox/checkbox-card-group.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{checkboxCardVariants as t}from"./variants.js";import{computed as n,createBlock as r,defineComponent as i,mergeProps as a,openBlock as o,unref as s}from"vue";import{useOmitProps as c}from"@soybeanjs/headless/composables";import{CheckboxCardGroupCompact as l,provideCheckboxCardUi as u}from"@soybeanjs/headless/checkbox";const d=i({name:`SCheckboxCardGroup`,__name:`checkbox-card-group`,props:{class:{type:[Boolean,null,String,Object,Array]},ui:{},color:{},size:{},shape:{},items:{},rootProps:{},controlProps:{},indicatorProps:{},labelProps:{},modelValue:{},defaultValue:{},rovingFocus:{type:Boolean,default:!0},disabled:{type:Boolean},orientation:{},dir:{},loop:{type:Boolean},name:{},required:{type:Boolean}},emits:[`update:modelValue`],setup(i,{emit:d}){let f=i,p=d,m=c(f,[`class`,`ui`,`color`,`size`,`shape`]),h=n(()=>e(t({color:f.color,size:f.size,shape:f.shape}),f.ui,{groupRoot:f.class}));return u(h),(e,t)=>(o(),r(s(l),a(s(m),{"content-class":h.value.content,"text-content-class":h.value.textContent,"icon-class":h.value.icon,"description-class":h.value.description,"onUpdate:modelValue":t[0]||=e=>p(`update:modelValue`,e)}),null,16,[`content-class`,`text-content-class`,`icon-class`,`description-class`]))}});export{d as default};
+import{checkboxCardVariants as e}from"../../styles/checkbox.js";import{computed as t,createBlock as n,defineComponent as r,mergeProps as i,openBlock as a,unref as o}from"vue";import{useOmitProps as s}from"@soybeanjs/headless/composables";import{CheckboxCardGroupCompact as c,provideCheckboxCardUi as l}from"@soybeanjs/headless/checkbox";const u=r({name:`SCheckboxCardGroup`,__name:`checkbox-card-group`,props:{class:{type:[Boolean,null,String,Object,Array]},ui:{},color:{},size:{},shape:{},items:{},rootProps:{},controlProps:{},indicatorProps:{},labelProps:{},modelValue:{},defaultValue:{},rovingFocus:{type:Boolean,default:!0},disabled:{type:Boolean},orientation:{},dir:{},loop:{type:Boolean},name:{},required:{type:Boolean}},emits:[`update:modelValue`],setup(r,{emit:u}){let d=r,f=u,p=s(d,[`class`,`ui`,`color`,`size`,`shape`]),m=t(()=>e({color:d.color,size:d.size,shape:d.shape},d.ui,{groupRoot:d.class}));return l(m),(e,t)=>(a(),n(o(c),i(o(p),{"content-class":m.value.content,"text-content-class":m.value.textContent,"icon-class":m.value.icon,"description-class":m.value.description,"onUpdate:modelValue":t[0]||=e=>f(`update:modelValue`,e)}),null,16,[`content-class`,`text-content-class`,`icon-class`,`description-class`]))}});export{u as default};

package/dist/components/checkbox/checkbox-card.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{checkboxCardVariants as t}from"./variants.js";import{computed as n,createBlock as r,defineComponent as i,mergeProps as a,openBlock as o,renderSlot as s,unref as c,withCtx as l}from"vue";import{useOmitProps as u}from"@soybeanjs/headless/composables";import{CheckboxCardCompact as d,provideCheckboxCardUi as f}from"@soybeanjs/headless/checkbox";const p=i({name:`SCheckboxCard`,__name:`checkbox-card`,props:{class:{type:[Boolean,null,String,Object,Array]},ui:{},color:{},size:{},shape:{},icon:{},description:{},label:{},controlProps:{},indicatorProps:{},labelProps:{},id:{},modelValue:{type:[Boolean,String,null],default:void 0},defaultValue:{type:[Boolean,String]},value:{},disabled:{type:Boolean},name:{},required:{type:Boolean}},emits:[`update:modelValue`],setup(i,{emit:p}){let m=i,h=p,g=u(m,[`class`,`ui`,`color`,`size`,`shape`]);return f(n(()=>e(t({color:m.color,size:m.size,shape:m.shape}),m.ui,{root:m.class}))),(e,t)=>(o(),r(c(d),a(c(g),{"onUpdate:modelValue":t[0]||=e=>h(`update:modelValue`,e)}),{description:l(()=>[s(e.$slots,`description`)]),default:l(()=>[s(e.$slots,`default`)]),_:3},16))}});export{p as default};
+import{checkboxCardVariants as e}from"../../styles/checkbox.js";import{computed as t,createBlock as n,defineComponent as r,mergeProps as i,openBlock as a,renderSlot as o,unref as s,withCtx as c}from"vue";import{useOmitProps as l}from"@soybeanjs/headless/composables";import{CheckboxCardCompact as u,provideCheckboxCardUi as d}from"@soybeanjs/headless/checkbox";const f=r({name:`SCheckboxCard`,__name:`checkbox-card`,props:{class:{type:[Boolean,null,String,Object,Array]},ui:{},color:{},size:{},shape:{},icon:{},description:{},label:{},controlProps:{},indicatorProps:{},labelProps:{},id:{},modelValue:{type:[Boolean,String,null],default:void 0},defaultValue:{type:[Boolean,String]},value:{},disabled:{type:Boolean},name:{},required:{type:Boolean}},emits:[`update:modelValue`],setup(r,{emit:f}){let p=r,m=f,h=l(p,[`class`,`ui`,`color`,`size`,`shape`]);return d(t(()=>e({color:p.color,size:p.size,shape:p.shape},p.ui,{root:p.class}))),(e,t)=>(a(),n(s(u),i(s(h),{"onUpdate:modelValue":t[0]||=e=>m(`update:modelValue`,e)}),{description:c(()=>[o(e.$slots,`description`)]),default:c(()=>[o(e.$slots,`default`)]),_:3},16))}});export{f as default};

package/dist/components/checkbox/checkbox-group.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{checkboxVariants as t}from"./variants.js";import{computed as n,createBlock as r,defineComponent as i,mergeProps as a,openBlock as o,unref as s}from"vue";import{useOmitProps as c}from"@soybeanjs/headless/composables";import{CheckboxGroupCompact as l,provideCheckboxUi as u}from"@soybeanjs/headless/checkbox";const d=i({name:`SCheckboxGroup`,__name:`checkbox-group`,props:{class:{type:[Boolean,null,String,Object,Array]},ui:{},color:{},size:{},shape:{},items:{},rootProps:{},controlProps:{},indicatorProps:{},labelProps:{},modelValue:{},defaultValue:{},rovingFocus:{type:Boolean,default:!0},disabled:{type:Boolean},orientation:{},dir:{},loop:{type:Boolean},name:{},required:{type:Boolean}},emits:[`update:modelValue`],setup(i,{emit:d}){let f=i,p=d,m=c(f,[`class`,`ui`,`color`,`size`,`shape`]);return u(n(()=>e(t({color:f.color,size:f.size,shape:f.shape,orientation:f.orientation}),f.ui,{groupRoot:f.class}))),(e,t)=>(o(),r(s(l),a(s(m),{"onUpdate:modelValue":t[0]||=e=>p(`update:modelValue`,e)}),null,16))}});export{d as default};
+import{checkboxVariants as e}from"../../styles/checkbox.js";import{computed as t,createBlock as n,defineComponent as r,mergeProps as i,openBlock as a,unref as o}from"vue";import{useOmitProps as s}from"@soybeanjs/headless/composables";import{CheckboxGroupCompact as c,provideCheckboxUi as l}from"@soybeanjs/headless/checkbox";const u=r({name:`SCheckboxGroup`,__name:`checkbox-group`,props:{class:{type:[Boolean,null,String,Object,Array]},ui:{},color:{},size:{},shape:{},items:{},rootProps:{},controlProps:{},indicatorProps:{},labelProps:{},modelValue:{},defaultValue:{},rovingFocus:{type:Boolean,default:!0},disabled:{type:Boolean},orientation:{},dir:{},loop:{type:Boolean},name:{},required:{type:Boolean}},emits:[`update:modelValue`],setup(r,{emit:u}){let d=r,f=u,p=s(d,[`class`,`ui`,`color`,`size`,`shape`]);return l(t(()=>e({color:d.color,size:d.size,shape:d.shape,orientation:d.orientation},d.ui,{groupRoot:d.class}))),(e,t)=>(a(),n(o(c),i(o(p),{"onUpdate:modelValue":t[0]||=e=>f(`update:modelValue`,e)}),null,16))}});export{u as default};

package/dist/components/checkbox/checkbox.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{checkboxVariants as t}from"./variants.js";import{computed as n,createBlock as r,defineComponent as i,mergeProps as a,openBlock as o,renderSlot as s,unref as c,withCtx as l}from"vue";import{useOmitProps as u}from"@soybeanjs/headless/composables";import{CheckboxCompact as d,provideCheckboxUi as f}from"@soybeanjs/headless/checkbox";const p=i({name:`SCheckbox`,__name:`checkbox`,props:{class:{type:[Boolean,null,String,Object,Array]},ui:{},color:{},size:{},shape:{},label:{},controlProps:{},indicatorProps:{},labelProps:{},id:{},modelValue:{type:[Boolean,String,null],default:void 0},defaultValue:{type:[Boolean,String]},value:{},disabled:{type:Boolean},name:{},required:{type:Boolean}},emits:[`update:modelValue`],setup(i,{emit:p}){let m=i,h=p,g=u(m,[`class`,`ui`,`color`,`size`,`shape`]);return f(n(()=>e(t({color:m.color,size:m.size,shape:m.shape}),m.ui,{root:m.class}))),(e,t)=>(o(),r(c(d),a(c(g),{"onUpdate:modelValue":t[0]||=e=>h(`update:modelValue`,e)}),{default:l(()=>[s(e.$slots,`default`)]),_:3},16))}});export{p as default};
+import{checkboxVariants as e}from"../../styles/checkbox.js";import{computed as t,createBlock as n,defineComponent as r,mergeProps as i,openBlock as a,renderSlot as o,unref as s,withCtx as c}from"vue";import{useOmitProps as l}from"@soybeanjs/headless/composables";import{CheckboxCompact as u,provideCheckboxUi as d}from"@soybeanjs/headless/checkbox";const f=r({name:`SCheckbox`,__name:`checkbox`,props:{class:{type:[Boolean,null,String,Object,Array]},ui:{},color:{},size:{},shape:{},label:{},controlProps:{},indicatorProps:{},labelProps:{},id:{},modelValue:{type:[Boolean,String,null],default:void 0},defaultValue:{type:[Boolean,String]},value:{},disabled:{type:Boolean},name:{},required:{type:Boolean}},emits:[`update:modelValue`],setup(r,{emit:f}){let p=r,m=f,h=l(p,[`class`,`ui`,`color`,`size`,`shape`]);return d(t(()=>e({color:p.color,size:p.size,shape:p.shape},p.ui,{root:p.class}))),(e,t)=>(a(),n(s(u),i(s(h),{"onUpdate:modelValue":t[0]||=e=>m(`update:modelValue`,e)}),{default:c(()=>[o(e.$slots,`default`)]),_:3},16))}});export{f as default};

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

@@ -1,5 +1,5 @@
 import { ThemeColor, ThemeSize } from "../../theme/types.js";
-import { CheckboxShape } from "./variants.js";
+import { CheckboxShape } from "../../styles/checkbox.js";
 import { CheckboxCardCompactEmits, CheckboxCardCompactProps, CheckboxCardGroupCompactEmits, CheckboxCardGroupCompactProps, CheckboxCardGroupOptionData, CheckboxCardUi, CheckboxCompactEmits, CheckboxCompactProps, CheckboxGroupCompactEmits, CheckboxGroupCompactProps, CheckboxGroupOptionData, CheckboxUi } from "@soybeanjs/headless/checkbox";
 import { ClassValue, DefinedValue } from "@soybeanjs/headless/types";
 

package/dist/components/clipboard/clipboard.js

@@ -1 +1 @@
-import{cn as e}from"../../theme/merge.js";import"../../theme/index.js";import{buttonVariants as t}from"../button/variants.js";import{computed as n,createBlock as r,defineComponent as i,guardReactiveProps as a,mergeProps as o,normalizeProps as s,openBlock as c,renderSlot as l,toHandlers as u,unref as d,withCtx as f}from"vue";import{useForwardListeners as p,useOmitProps as m}from"@soybeanjs/headless/composables";import{Clipboard as h}from"@soybeanjs/headless/clipboard";const g=i({name:`SClipboard`,__name:`clipboard`,props:{class:{type:[Boolean,null,String,Object,Array]},color:{},size:{},variant:{},shape:{},fitContent:{type:Boolean},value:{},copiedDuration:{},legacy:{type:Boolean},copyIcon:{},copiedIcon:{},copyText:{},copiedText:{},type:{},disabled:{type:Boolean},asChild:{type:Boolean},as:{}},emits:[`click`,`copied`,`copyError`],setup(i,{emit:g}){let _=i,v=p(g),y=m(_,[`class`,`color`,`size`,`variant`,`shape`,`fitContent`]),b=n(()=>e(t({color:_.color,size:_.size,variant:_.variant,shape:_.shape,fitContent:_.fitContent}),_.class));return(e,t)=>(c(),r(d(h),o(d(y),{class:b.value},u(d(v))),{leading:f(t=>[l(e.$slots,`leading`,s(a(t)))]),default:f(t=>[l(e.$slots,`default`,s(a(t)))]),trailing:f(t=>[l(e.$slots,`trailing`,s(a(t)))]),_:3},16,[`class`]))}});export{g as default};
+import{buttonVariants as e}from"../../styles/button.js";import"../../styles/clipboard.js";import{computed as t,createBlock as n,defineComponent as r,guardReactiveProps as i,mergeProps as a,normalizeProps as o,openBlock as s,renderSlot as c,toHandlers as l,unref as u,withCtx as d}from"vue";import{useForwardListeners as f,useOmitProps as p}from"@soybeanjs/headless/composables";import{Clipboard as m}from"@soybeanjs/headless/clipboard";const h=r({name:`SClipboard`,__name:`clipboard`,props:{class:{type:[Boolean,null,String,Object,Array]},color:{},size:{},variant:{},shape:{},fitContent:{type:Boolean},value:{},copiedDuration:{},legacy:{type:Boolean},copyIcon:{},copiedIcon:{},copyText:{},copiedText:{},type:{},disabled:{type:Boolean},asChild:{type:Boolean},as:{}},emits:[`click`,`copied`,`copyError`],setup(r,{emit:h}){let g=r,_=f(h),v=p(g,[`class`,`color`,`size`,`variant`,`shape`,`fitContent`]),y=t(()=>e({color:g.color,size:g.size,variant:g.variant,shape:g.shape,fitContent:g.fitContent},g.class));return(e,t)=>(s(),n(u(m),a(u(v),{class:y.value},l(u(_))),{leading:d(t=>[c(e.$slots,`leading`,o(i(t)))]),default:d(t=>[c(e.$slots,`default`,o(i(t)))]),trailing:d(t=>[c(e.$slots,`trailing`,o(i(t)))]),_:3},16,[`class`]))}});export{h as default};

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

@@ -1,4 +1,4 @@
-import { ButtonShape, ButtonVariant } from "../button/variants.js";
+import { ButtonShape, ButtonVariant } from "../../styles/button.js";
 import { ClipboardEmits, ClipboardProps, ClipboardSlotProps } from "./types.js";
 import { _default } from "./clipboard.vue.js";
 export type * from "@soybeanjs/headless/clipboard";

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

@@ -1,5 +1,5 @@
 import { ThemeColor, ThemeSize } from "../../theme/types.js";
-import { ButtonShape, ButtonVariant } from "../button/variants.js";
+import { ButtonShape, ButtonVariant } from "../../styles/button.js";
 import { ClipboardEmits, ClipboardProps, ClipboardSlotProps } from "@soybeanjs/headless/clipboard";
 import { ClassValue } from "@soybeanjs/headless/types";
 

package/dist/components/collapsible/collapsible.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{collapsibleVariants as t}from"./variants.js";import{computed as n,createBlock as r,defineComponent as i,guardReactiveProps as a,mergeProps as o,normalizeProps as s,openBlock as c,renderSlot as l,unref as u,withCtx as d}from"vue";import{useOmitProps as f}from"@soybeanjs/headless/composables";import{CollapsibleRoot as p,provideCollapsibleUi as m}from"@soybeanjs/headless/collapsible";const h=i({name:`SCollapsible`,__name:`collapsible`,props:{size:{},ui:{},defaultOpen:{type:Boolean,default:!1},open:{type:Boolean,default:void 0},disabled:{type:Boolean},unmountOnHide:{type:Boolean,default:!0},asChild:{type:Boolean},as:{}},emits:[`update:open`],setup(i,{emit:h}){let g=i,_=h,v=f(g,[`class`,`size`,`ui`]);return m(n(()=>e(t({size:g.size}),g.ui))),(e,t)=>(c(),r(u(p),o(u(v),{"onUpdate:open":t[0]||=e=>_(`update:open`,e)}),{default:d(t=>[l(e.$slots,`default`,s(a(t)))]),_:3},16))}});export{h as default};
+import{collapsibleVariants as e}from"../../styles/collapsible.js";import{computed as t,createBlock as n,defineComponent as r,guardReactiveProps as i,mergeProps as a,normalizeProps as o,openBlock as s,renderSlot as c,unref as l,withCtx as u}from"vue";import{useOmitProps as d}from"@soybeanjs/headless/composables";import{CollapsibleRoot as f,provideCollapsibleUi as p}from"@soybeanjs/headless/collapsible";const m=r({name:`SCollapsible`,__name:`collapsible`,props:{size:{},ui:{},defaultOpen:{type:Boolean,default:!1},open:{type:Boolean,default:void 0},disabled:{type:Boolean},unmountOnHide:{type:Boolean,default:!0},asChild:{type:Boolean},as:{}},emits:[`update:open`],setup(r,{emit:m}){let h=r,g=m,_=d(h,[`class`,`size`,`ui`]);return p(t(()=>e({size:h.size},h.ui))),(e,t)=>(s(),n(l(f),a(l(_),{"onUpdate:open":t[0]||=e=>g(`update:open`,e)}),{default:u(t=>[c(e.$slots,`default`,o(i(t)))]),_:3},16))}});export{m as default};

package/dist/components/color-area/color-area.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{colorAreaVariants as t}from"./variants.js";import{computed as n,createBlock as r,defineComponent as i,mergeProps as a,openBlock as o,toHandlers as s,unref as c}from"vue";import{useForwardListeners as l,useOmitProps as u}from"@soybeanjs/headless/composables";import{ColorAreaCompact as d,provideColorAreaUi as f}from"@soybeanjs/headless/color-area";const p=i({name:`SColorArea`,__name:`color-area`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},areaProps:{},thumbProps:{},modelValue:{},defaultValue:{},colorSpace:{},format:{},xChannel:{},yChannel:{},disabled:{type:Boolean},xName:{},yName:{},name:{},required:{type:Boolean},asChild:{type:Boolean},as:{}},emits:[`update:modelValue`,`update:color`,`change`,`changeEnd`],setup(i,{emit:p}){let m=i,h=l(p),g=u(m,[`class`,`size`,`ui`]);return f(n(()=>e(t({size:m.size}),m.ui,{root:m.class}))),(e,t)=>(o(),r(c(d),a(c(g),s(c(h))),null,16))}});export{p as default};
+import{colorAreaVariants as e}from"../../styles/color-area.js";import{computed as t,createBlock as n,defineComponent as r,mergeProps as i,openBlock as a,toHandlers as o,unref as s}from"vue";import{useForwardListeners as c,useOmitProps as l}from"@soybeanjs/headless/composables";import{ColorAreaCompact as u,provideColorAreaUi as d}from"@soybeanjs/headless/color-area";const f=r({name:`SColorArea`,__name:`color-area`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},areaProps:{},thumbProps:{},modelValue:{},defaultValue:{},colorSpace:{},format:{},xChannel:{},yChannel:{},disabled:{type:Boolean},xName:{},yName:{},name:{},required:{type:Boolean},asChild:{type:Boolean},as:{}},emits:[`update:modelValue`,`update:color`,`change`,`changeEnd`],setup(r,{emit:f}){let p=r,m=c(f),h=l(p,[`class`,`size`,`ui`]);return d(t(()=>e({size:p.size},p.ui,{root:p.class}))),(e,t)=>(a(),n(s(u),i(s(h),o(s(m))),null,16))}});export{f as default};

package/dist/components/color-field/color-field.js

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{colorFieldVariants as t}from"./variants.js";import{computed as n,createBlock as r,defineComponent as i,mergeProps as a,openBlock as o,toHandlers as s,unref as c}from"vue";import{useForwardListeners as l,useOmitProps as u}from"@soybeanjs/headless/composables";import{ColorFieldCompact as d,provideColorFieldUi as f}from"@soybeanjs/headless/color-field";const p=i({name:`SColorField`,__name:`color-field`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},inputProps:{},modelValue:{},defaultValue:{},colorSpace:{},channel:{},format:{},placeholder:{},disabled:{type:Boolean},readonly:{type:Boolean},disableWheelChange:{type:Boolean},step:{},name:{},required:{type:Boolean},asChild:{type:Boolean},as:{}},emits:[`update:modelValue`,`update:color`],setup(i,{emit:p}){let m=i,h=l(p),g=u(m,[`class`,`size`,`ui`]);return f(n(()=>e(t({size:m.size}),m.ui,{root:m.class}))),(e,t)=>(o(),r(c(d),a(c(g),s(c(h))),null,16))}});export{p as default};
+import{colorFieldVariants as e}from"../../styles/color-field.js";import{computed as t,createBlock as n,defineComponent as r,mergeProps as i,openBlock as a,toHandlers as o,unref as s}from"vue";import{useForwardListeners as c,useOmitProps as l}from"@soybeanjs/headless/composables";import{ColorFieldCompact as u,provideColorFieldUi as d}from"@soybeanjs/headless/color-field";const f=r({name:`SColorField`,__name:`color-field`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},inputProps:{},modelValue:{},defaultValue:{},colorSpace:{},channel:{},format:{},placeholder:{},disabled:{type:Boolean},readonly:{type:Boolean},disableWheelChange:{type:Boolean},step:{},name:{},required:{type:Boolean},asChild:{type:Boolean},as:{}},emits:[`update:modelValue`,`update:color`],setup(r,{emit:f}){let p=r,m=c(f),h=l(p,[`class`,`size`,`ui`]);return d(t(()=>e({size:p.size},p.ui,{root:p.class}))),(e,t)=>(a(),n(s(u),i(s(h),o(s(m))),null,16))}});export{f as default};

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

@@ -1 +1 @@
-import{mergeVariants as e}from"../../theme/shared.js";import{miniSizeMap as t}from"../../theme/config.js";import"../../theme/index.js";import{buttonIconVariants as n,buttonVariants as r}from"../button/variants.js";import{colorAreaVariants as i}from"../color-area/variants.js";import{colorFieldVariants as a}from"../color-field/variants.js";import{popoverVariants as o}from"../popover/variants.js";import{colorSwatchVariants as s}from"../color-swatch/variants.js";import{colorSwatchPickerVariants as c}from"../color-swatch-picker/variants.js";import{sliderVariants as l}from"../slider/variants.js";import{tabsVariants as u}from"../tabs/variants.js";import{colorPickerVariants as d}from"./variants.js";import{computed as f,createBlock as p,defineComponent as m,mergeProps as h,openBlock as g,toHandlers as _,unref as v}from"vue";import{useForwardListeners as y,useOmitProps as b}from"@soybeanjs/headless/composables";import{provideColorAreaUi as x}from"@soybeanjs/headless/color-area";import{provideColorFieldUi as S}from"@soybeanjs/headless/color-field";import{ColorPickerCompact as C,provideColorPickerUi as w}from"@soybeanjs/headless/color-picker";import{provideColorSwatchUi as T}from"@soybeanjs/headless/color-swatch";import{provideColorSwatchPickerUi as E}from"@soybeanjs/headless/color-swatch-picker";import{provideColorSliderUi as D}from"@soybeanjs/headless/color-slider";import{providePopoverUi as O}from"@soybeanjs/headless/popover";import{provideTabsUi as k}from"@soybeanjs/headless/tabs";const A=m({name:`SColorPicker`,__name:`color-picker`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},showAlpha:{type:Boolean,default:!0},showFields:{type:Boolean,default:!0},showSwatches:{type:Boolean,default:!0},swatches:{},swatchProps:{},segmentProps:{},areaProps:{},hueSliderProps:{},alphaSliderProps:{},alphaFieldProps:{},fieldProps:{},swatchPickerProps:{},modelValue:{},defaultValue:{},format:{},defaultFormat:{},colorSpace:{},disabled:{type:Boolean},name:{},required:{type:Boolean},placement:{},showArrow:{type:Boolean,default:!0},triggerProps:{},portalProps:{},positionerProps:{},popupProps:{},arrowProps:{},closeProps:{},open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean},modal:{type:Boolean}},emits:[`update:modelValue`,`update:color`,`update:format`,`change`,`update:open`,`escapeKeyDown`,`pointerDownOutside`,`focusOutside`,`interactOutside`,`openAutoFocus`,`closeAutoFocus`],setup(m,{emit:A}){let j=m,M=A,N=b(j,[`class`,`size`,`ui`]),P=y(M),F=f(()=>t[j.size??`md`]),I=f(()=>{let t=d({size:j.size});return e(Object.assign(t,{$base:{trigger:r({size:j.size,variant:`pure`}),close:n({size:F.value})}}),j.ui,{trigger:j.class})}),L=f(()=>e(Object.assign(o({size:j.size}),{$base:{close:n({size:F.value})}}),j.ui)),R=f(()=>e(i({size:j.size}))),z=f(()=>e(a({size:j.size}))),B=f(()=>e(s({size:j.size,shape:`square`}))),V=f(()=>e(c({size:j.size,shape:`square`}))),H=f(()=>e(l({size:j.size}))),U=f(()=>e(u({size:j.size,orientation:`horizontal`,shape:`square`,fill:`auto`,enableIndicator:!0})));return w(I),O(L),x(R),S(z),E(V),D(H),T(B),k(U),(e,t)=>(g(),p(v(C),h(v(N),_(v(P))),null,16))}});export{A as default};
+import{colorAreaVariants as e}from"../../styles/color-area.js";import{colorFieldVariants as t}from"../../styles/color-field.js";import{popoverVariants as n}from"../../styles/popover.js";import{colorSwatchVariants as r}from"../../styles/color-swatch.js";import{colorSwatchPickerVariants as i}from"../../styles/color-swatch-picker.js";import{sliderVariants as a}from"../../styles/slider.js";import{tabsVariants as o}from"../../styles/tabs.js";import{colorPickerVariants as s}from"../../styles/color-picker.js";import{computed as c,createBlock as l,defineComponent as u,mergeProps as d,openBlock as f,toHandlers as p,unref as m}from"vue";import{useForwardListeners as h,useOmitProps as g}from"@soybeanjs/headless/composables";import{provideColorAreaUi as _}from"@soybeanjs/headless/color-area";import{provideColorFieldUi as v}from"@soybeanjs/headless/color-field";import{ColorPickerCompact as y,provideColorPickerUi as b}from"@soybeanjs/headless/color-picker";import{provideColorSwatchUi as x}from"@soybeanjs/headless/color-swatch";import{provideColorSwatchPickerUi as S}from"@soybeanjs/headless/color-swatch-picker";import{provideColorSliderUi as C}from"@soybeanjs/headless/color-slider";import{providePopoverUi as w}from"@soybeanjs/headless/popover";import{provideTabsUi as T}from"@soybeanjs/headless/tabs";const E=u({name:`SColorPicker`,__name:`color-picker`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},showAlpha:{type:Boolean,default:!0},showFields:{type:Boolean,default:!0},showSwatches:{type:Boolean,default:!0},swatches:{},swatchProps:{},segmentProps:{},areaProps:{},hueSliderProps:{},alphaSliderProps:{},alphaFieldProps:{},fieldProps:{},swatchPickerProps:{},modelValue:{},defaultValue:{},format:{},defaultFormat:{},colorSpace:{},disabled:{type:Boolean},name:{},required:{type:Boolean},placement:{},showArrow:{type:Boolean,default:!0},triggerProps:{},portalProps:{},positionerProps:{},popupProps:{},arrowProps:{},closeProps:{},open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean},modal:{type:Boolean}},emits:[`update:modelValue`,`update:color`,`update:format`,`change`,`update:open`,`escapeKeyDown`,`pointerDownOutside`,`focusOutside`,`interactOutside`,`openAutoFocus`,`closeAutoFocus`],setup(u,{emit:E}){let D=u,O=E,k=g(D,[`class`,`size`,`ui`]),A=h(O),j=c(()=>s({size:D.size},D.ui,{trigger:D.class})),M=c(()=>n({size:D.size},{popup:D.ui?.popup})),N=c(()=>e({size:D.size})),P=c(()=>t({size:D.size})),F=c(()=>r({size:D.size,shape:`square`})),I=c(()=>i({size:D.size,shape:`square`})),L=c(()=>a({size:D.size})),R=c(()=>o({size:D.size,orientation:`horizontal`,shape:`square`,fill:`auto`,enableIndicator:!0}));return b(j),w(M),_(N),v(P),S(I),C(L),x(F),T(R),(e,t)=>(f(),l(m(y),d(m(k),p(m(A))),null,16))}});export{E as default};