@soybeanjs/ui 0.18.0 → 0.19.0

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

@@ -1,13 +1,13 @@
 import { ThemeColor, ThemeSize } from "../../theme/types.js";
 import { SwitchShape } from "./variants.js";
-import { SwitchControlProps, SwitchRootEmits, SwitchRootProps, SwitchThumbProps, SwitchUi } from "@soybeanjs/headless/switch";
+import { SwitchCompactEmits, SwitchCompactProps, SwitchCompactSlots, SwitchUi } from "@soybeanjs/headless/switch";
 import { AcceptableBooleanValue, ClassValue } from "@soybeanjs/headless/types";
 
 //#region src/components/switch/types.d.ts
 /**
  * Properties for the Switch component.
  */
-interface SwitchProps<T extends AcceptableBooleanValue = boolean> extends SwitchRootProps<T> {
+interface SwitchProps<T extends AcceptableBooleanValue = boolean> extends SwitchCompactProps<T> {
   /**
    * Additional class names applied to the root element.
    */
@@ -28,18 +28,14 @@ interface SwitchProps<T extends AcceptableBooleanValue = boolean> extends Switch
    * Shape of the component.
    */
   shape?: SwitchShape;
-  /**
-   * Properties forwarded to the control element.
-   */
-  controlProps?: SwitchControlProps;
-  /**
-   * Properties forwarded to the thumb element.
-   */
-  thumbProps?: SwitchThumbProps;
 }
 /**
  * Events for the Switch component.
  */
-type SwitchEmits<T extends AcceptableBooleanValue = boolean> = SwitchRootEmits<T>;
+type SwitchEmits<T extends AcceptableBooleanValue = boolean> = SwitchCompactEmits<T>;
+/**
+ * Slots for the Switch component.
+ */
+type SwitchSlots<T extends AcceptableBooleanValue = boolean> = SwitchCompactSlots<T>;
 //#endregion
-export { SwitchEmits, SwitchProps };
+export { SwitchEmits, SwitchProps, SwitchSlots };

package/dist/components/switch/variants.d.ts

@@ -69,7 +69,7 @@ declare const switchVariants: _$tailwind_variants0.TVReturnType<{
   root: string;
   control: string[];
   thumb: string;
-}, never[], {
+}, undefined, {
   color: {
     primary: {
       control: string;
@@ -203,7 +203,7 @@ declare const switchVariants: _$tailwind_variants0.TVReturnType<{
   root: string;
   control: string[];
   thumb: string;
-}, never[], unknown, unknown, undefined>>;
+}, undefined, unknown, unknown, undefined>>;
 type SwitchVariants = VariantProps<typeof switchVariants>;
 type SwitchShape = NonNullable<SwitchVariants['shape']>;
 //#endregion

package/dist/components/switch/variants.js

@@ -1 +1 @@
-import{tv as e}from"tailwind-variants";const t=e({base:[],slots:{root:`inline-flex`,control:[`peer shrink-0 inline-flex items-center rounded-full border-0 shadow-sm transition-colors-200`,`outline-none focus-visible:ring-3  focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=unchecked]:bg-input`],thumb:`flex justify-center items-center rounded-full shadow-lg transition-transform-200 bg-background pointer-events-none data-[state=unchecked]:translate-x-0.5`},variants:{color:{primary:{control:`data-[state=checked]:bg-primary focus-visible:ring-primary/30`},destructive:{control:`data-[state=checked]:bg-destructive focus-visible:ring-destructive/30`},success:{control:`data-[state=checked]:bg-success focus-visible:ring-success/30`},warning:{control:`data-[state=checked]:bg-warning focus-visible:ring-warning/30`},info:{control:`data-[state=checked]:bg-info focus-visible:ring-info/30`},carbon:{control:`data-[state=checked]:bg-carbon focus-visible:ring-carbon/30`},secondary:{control:`data-[state=checked]:bg-secondary-foreground/20 focus-visible:ring-secondary-foreground/20`},accent:{control:`data-[state=checked]:bg-accent-foreground/20 focus-visible:ring-accent-foreground/20`}},size:{xs:{control:`h-4 w-7`,thumb:`size-3 data-[state=checked]:translate-x-3.5`},sm:{control:`h-4.5 w-8`,thumb:`size-3.5 data-[state=checked]:translate-x-4`},md:{control:`h-5 w-9`,thumb:`size-4 data-[state=checked]:translate-x-4.5`},lg:{control:`h-5.5 w-10`,thumb:`size-4.5 data-[state=checked]:translate-x-5`},xl:{control:`h-6 w-11`,thumb:`size-5 data-[state=checked]:translate-x-5.5`},"2xl":{control:`h-7 w-13`,thumb:`size-6 data-[state=checked]:translate-x-6.5`}},shape:{rounded:{control:`rounded-full`,thumb:`rounded-full`},square:{control:`rounded-md`,thumb:`rounded-sm`}}},defaultVariants:{color:`primary`,size:`md`,shape:`rounded`}});export{t as switchVariants};
+import{tv as e}from"tailwind-variants";const t=e({slots:{root:`inline-flex`,control:[`peer shrink-0 inline-flex items-center rounded-full border-0 shadow-sm transition-colors-200`,`outline-none focus-visible:ring-3  focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=unchecked]:bg-input`],thumb:`flex justify-center items-center rounded-full shadow-lg transition-transform-200 bg-background pointer-events-none data-[state=unchecked]:translate-x-0.5`},variants:{color:{primary:{control:`data-[state=checked]:bg-primary focus-visible:ring-primary/30`},destructive:{control:`data-[state=checked]:bg-destructive focus-visible:ring-destructive/30`},success:{control:`data-[state=checked]:bg-success focus-visible:ring-success/30`},warning:{control:`data-[state=checked]:bg-warning focus-visible:ring-warning/30`},info:{control:`data-[state=checked]:bg-info focus-visible:ring-info/30`},carbon:{control:`data-[state=checked]:bg-carbon focus-visible:ring-carbon/30`},secondary:{control:`data-[state=checked]:bg-secondary-foreground/20 focus-visible:ring-secondary-foreground/20`},accent:{control:`data-[state=checked]:bg-accent-foreground/20 focus-visible:ring-accent-foreground/20`}},size:{xs:{control:`h-4 w-7`,thumb:`size-3 data-[state=checked]:translate-x-3.5`},sm:{control:`h-4.5 w-8`,thumb:`size-3.5 data-[state=checked]:translate-x-4`},md:{control:`h-5 w-9`,thumb:`size-4 data-[state=checked]:translate-x-4.5`},lg:{control:`h-5.5 w-10`,thumb:`size-4.5 data-[state=checked]:translate-x-5`},xl:{control:`h-6 w-11`,thumb:`size-5 data-[state=checked]:translate-x-5.5`},"2xl":{control:`h-7 w-13`,thumb:`size-6 data-[state=checked]:translate-x-6.5`}},shape:{rounded:{control:`rounded-full`,thumb:`rounded-full`},square:{control:`rounded-md`,thumb:`rounded-sm`}}},defaultVariants:{color:`primary`,size:`md`,shape:`rounded`}});export{t as switchVariants};

package/dist/components/table/hooks.d.ts

@@ -17,11 +17,11 @@ type UsePaginatedTableOptions<ResponseData, ApiData extends TableBaseData> = Use
   page?: number;
   pageSize?: number;
   /**
-   * Whether to fetch data when page or pageSize changes. [是否在 page 或 pageSize 变化时自动请求数据]
+   * Whether to fetch data when page or pageSize changes.
    *
-   * Set this to `false` if you want to handle pagination change manually, such as fetching data in a parent component. [如果你想手动处理分页变化，比如在父组件中请求数据，可以将此项设置为 `false`]
+   * Set this to `false` if you want to handle pagination change manually, such as fetching data in a parent component.
    *
-   * In this case, you can listen to `update:page` and `update:pageSize` events to get the current page and page size. [在这种情况下，你可以监听 `update:page` 和 `update:pageSize` 事件来获取当前页码和每页条数]
+   * In this case, you can listen to `update:page` and `update:pageSize` events to get the current page and page size.
    *
    * @default true
    */

package/dist/components/table/table-filter-popover.js

@@ -1 +1 @@
-import{miniSizeMap as e}from"../../theme/config.js";import"../../theme/index.js";import t from"../button/button.js";import n from"../button/button-icon.js";import r from"../checkbox/checkbox.js";import i from"../popover/popover.js";import a from"../input/input.js";import{Fragment as o,computed as s,createBlock as c,createCommentVNode as l,createElementBlock as u,createElementVNode as d,createTextVNode as f,createVNode as p,defineComponent as m,normalizeClass as h,openBlock as g,renderList as _,toDisplayString as v,withCtx as y}from"vue";const b=m({name:`STableFilterPopover`,__name:`table-filter-popover`,props:{size:{},ui:{},column:{},filterValue:{},filterValues:{},filterState:{},filtered:{type:Boolean},filterOptions:{},setFilterValue:{type:Function},setFilterValues:{type:Function},setFilterState:{type:Function},toggleFilterOption:{type:Function},isFilterOptionSelected:{type:Function},clearFilter:{type:Function}},setup(m){let b=m,x=s(()=>b.column.title??b.column.key??b.column.dataIndex??`column`),S=s(()=>{let e=b.filterValue.trim().toLowerCase();return e?b.filterOptions.filter(t=>t.label.toLowerCase().includes(e)||t.value.toLowerCase().includes(e)):b.filterOptions}),C=s(()=>S.value.length>0),w=s(()=>b.filterValues.length>0?`${b.filterValues.length} selected`:b.filterValue.trim().length>0?`Keyword active`:b.filterOptions.length>0?`${b.filterOptions.length} options`:`No filter options`),T=s(()=>b.filtered?`Edit filter for ${x.value}`:`Filter ${x.value}`),E=s(()=>`Search filter options for ${x.value}`),D=s(()=>e[b.size??`md`]);function O(e){b.setFilterValue(String(e??``))}return(e,s)=>(g(),c(i,{class:h(m.ui.filterPopup),size:m.size,placement:`bottom-end`,"show-arrow":!1},{trigger:y(()=>[p(n,{icon:`lucide:funnel`,"data-filtered":b.filtered?``:void 0,class:h(m.ui.filterTrigger),size:D.value,"aria-label":T.value,"aria-pressed":m.filtered||void 0},null,8,[`data-filtered`,`class`,`size`,`aria-label`,`aria-pressed`])]),default:y(()=>[p(a,{class:h(m.ui.filterSearch),size:D.value,"model-value":m.filterValue,"control-props":{"aria-label":E.value,placeholder:`Search ${x.value}`},"onUpdate:modelValue":O},null,8,[`class`,`size`,`model-value`,`control-props`]),m.filterOptions.length>0?(g(),u(`div`,{key:0,class:h(m.ui.filterOptions)},[(g(!0),u(o,null,_(S.value,e=>(g(),c(r,{key:e.value,class:h(m.ui.filterOption),size:D.value,disabled:e.disabled,"model-value":m.isFilterOptionSelected(e.value),label:e.label,ui:{label:m.ui.filterOptionLabel},"control-props":{"aria-label":`Select ${e.label}`},"onUpdate:modelValue":t=>m.toggleFilterOption(e.value)},null,8,[`class`,`size`,`disabled`,`model-value`,`label`,`ui`,`control-props`,`onUpdate:modelValue`]))),128)),C.value?l(`v-if`,!0):(g(),u(`div`,{key:0,class:h(m.ui.filterEmpty)},`No matching options`,2))],2)):l(`v-if`,!0),d(`div`,{class:h(m.ui.filterFooter)},[d(`span`,{class:h(m.ui.filterCount)},v(w.value),3),m.filtered?(g(),c(t,{key:0,variant:`ghost`,color:`accent`,"fit-content":``,size:D.value,class:h(m.ui.filterAction),onClick:m.clearFilter},{default:y(()=>[...s[0]||=[f(` Clear `,-1)]]),_:1},8,[`size`,`class`,`onClick`])):l(`v-if`,!0)],2)]),_:1},8,[`class`,`size`]))}});export{b as default};
+import{miniSizeMap as e}from"../../theme/config.js";import"../../theme/index.js";import t from"../button/button.js";import n from"../button/button-icon.js";import r from"../checkbox/checkbox.js";import i from"../input/input.js";import a from"../popover/popover.js";import{Fragment as o,computed as s,createBlock as c,createCommentVNode as l,createElementBlock as u,createElementVNode as d,createTextVNode as f,createVNode as p,defineComponent as m,normalizeClass as h,openBlock as g,renderList as _,toDisplayString as v,withCtx as y}from"vue";const b=m({name:`STableFilterPopover`,__name:`table-filter-popover`,props:{size:{},ui:{},column:{},filterValue:{},filterValues:{},filterState:{},filtered:{type:Boolean},filterOptions:{},setFilterValue:{type:Function},setFilterValues:{type:Function},setFilterState:{type:Function},toggleFilterOption:{type:Function},isFilterOptionSelected:{type:Function},clearFilter:{type:Function}},setup(m){let b=m,x=s(()=>b.column.title??b.column.key??b.column.dataIndex??`column`),S=s(()=>{let e=b.filterValue.trim().toLowerCase();return e?b.filterOptions.filter(t=>t.label.toLowerCase().includes(e)||t.value.toLowerCase().includes(e)):b.filterOptions}),C=s(()=>S.value.length>0),w=s(()=>b.filterValues.length>0?`${b.filterValues.length} selected`:b.filterValue.trim().length>0?`Keyword active`:b.filterOptions.length>0?`${b.filterOptions.length} options`:`No filter options`),T=s(()=>b.filtered?`Edit filter for ${x.value}`:`Filter ${x.value}`),E=s(()=>`Search filter options for ${x.value}`),D=s(()=>e[b.size??`md`]);function O(e){b.setFilterValue(String(e??``))}return(e,s)=>(g(),c(a,{class:h(m.ui.filterPopup),size:m.size,placement:`bottom-end`,"show-arrow":!1},{trigger:y(()=>[p(n,{icon:`lucide:funnel`,"data-filtered":b.filtered?``:void 0,class:h(m.ui.filterTrigger),size:D.value,"aria-label":T.value,"aria-pressed":m.filtered||void 0},null,8,[`data-filtered`,`class`,`size`,`aria-label`,`aria-pressed`])]),default:y(()=>[p(i,{class:h(m.ui.filterSearch),size:D.value,"model-value":m.filterValue,"control-props":{"aria-label":E.value,placeholder:`Search ${x.value}`},"onUpdate:modelValue":O},null,8,[`class`,`size`,`model-value`,`control-props`]),m.filterOptions.length>0?(g(),u(`div`,{key:0,class:h(m.ui.filterOptions)},[(g(!0),u(o,null,_(S.value,e=>(g(),c(r,{key:e.value,class:h(m.ui.filterOption),size:D.value,disabled:e.disabled,"model-value":m.isFilterOptionSelected(e.value),label:e.label,ui:{label:m.ui.filterOptionLabel},"control-props":{"aria-label":`Select ${e.label}`},"onUpdate:modelValue":t=>m.toggleFilterOption(e.value)},null,8,[`class`,`size`,`disabled`,`model-value`,`label`,`ui`,`control-props`,`onUpdate:modelValue`]))),128)),C.value?l(`v-if`,!0):(g(),u(`div`,{key:0,class:h(m.ui.filterEmpty)},`No matching options`,2))],2)):l(`v-if`,!0),d(`div`,{class:h(m.ui.filterFooter)},[d(`span`,{class:h(m.ui.filterCount)},v(w.value),3),m.filtered?(g(),c(t,{key:0,variant:`ghost`,color:`accent`,"fit-content":``,size:D.value,class:h(m.ui.filterAction),onClick:m.clearFilter},{default:y(()=>[...s[0]||=[f(` Clear `,-1)]]),_:1},8,[`size`,`class`,`onClick`])):l(`v-if`,!0)],2)]),_:1},8,[`class`,`size`]))}});export{b as default};

package/dist/components/table/table.js

@@ -1 +1 @@
-import{mergeSlotVariants as e}from"../../theme/shared.js";import{miniSizeMap as t}from"../../theme/config.js";import"../../theme/index.js";import n from"../button/button-icon.js";import r from"../checkbox/checkbox.js";import i from"../empty/empty.js";import a from"./table-filter-popover.js";import{tableVariants as o}from"./variants.js";import s from"./table-radio.js";import{computed as c,createBlock as l,createCommentVNode as u,createElementVNode as d,createSlots as f,createVNode as p,defineComponent as m,guardReactiveProps as h,mergeProps as g,normalizeClass as _,normalizeProps as v,openBlock as y,renderList as b,renderSlot as x,toHandlers as S,unref as C,useSlots as w,withCtx as T}from"vue";import{useForwardListeners as E,useOmitProps as D}from"@soybeanjs/headless/composables";import{TableCompact as O,provideTableUi as k}from"@soybeanjs/headless/table";const A=[`aria-label`,`aria-pressed`,`data-resizing`,`onPointerdown`,`onKeydown`],j=m({name:`STable`,__name:`table`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},variant:{},bordered:{type:Boolean},rounded:{type:Boolean,default:!0},striped:{type:Boolean},columns:{},data:{},rowKey:{},defaultSortState:{},sortState:{},defaultFilterState:{},filterState:{},defaultColumnWidths:{},columnWidths:{},getChildren:{},indent:{},virtual:{type:Boolean},height:{},estimateSize:{},virtualizerOptions:{},defaultExpanded:{},expanded:{},defaultExpandAll:{type:Boolean},contentProps:{},headerProps:{},bodyProps:{},footerProps:{},headProps:{},rowProps:{},cellProps:{},dir:{},defaultSelected:{},selected:{},multiple:{default:!0}},emits:[`update:sortState`,`update:filterState`,`update:columnWidths`,`update:expanded`,`update:selected`],setup(m,{emit:j}){let M=m,N=j,P=w(),F=D(M,[`class`,`ui`,`size`,`variant`,`bordered`,`rounded`,`striped`]),I=E(N),L=c(()=>Object.keys(P)),R=c(()=>e(o({size:M.size,variant:M.variant,bordered:M.bordered,rounded:M.rounded,striped:M.striped}),M.ui,{root:M.class})),z=c(()=>t[M.size??`md`]),B=e=>e===`asc`?`lucide:arrow-up`:e===`desc`?`lucide:arrow-down`:`lucide:arrow-up-down`;return k(R),(e,t)=>(y(),l(C(O),g(C(F),S(C(I))),f({_:2},[b(L.value,t=>({name:t,fn:T(n=>[x(e.$slots,t,v(h(n)))])})),P[`header-selection`]?void 0:{name:`header-selection`,fn:T(({checked:e,disabled:t,multiple:n,updateChecked:i})=>[n?(y(),l(r,{key:0,disabled:t,"model-value":e,class:_(R.value.selection),"control-props":{"aria-label":`Select all rows`},"onUpdate:modelValue":i},null,8,[`disabled`,`model-value`,`class`,`onUpdate:modelValue`])):u(`v-if`,!0)]),key:`0`},P.selection?void 0:{name:`selection`,fn:T(({checked:e,multiple:t,ariaLabel:n,toggleSelect:i})=>[t?(y(),l(r,{key:0,class:_(R.value.selection),"model-value":e,"control-props":{"aria-label":n},"onUpdate:modelValue":e=>i()},null,8,[`class`,`model-value`,`control-props`,`onUpdate:modelValue`])):(y(),l(s,{key:1,size:m.size,checked:e,"aria-label":n,onClick:e=>i()},null,8,[`size`,`checked`,`aria-label`,`onClick`]))]),key:`1`},P[`header-sort`]?void 0:{name:`header-sort`,fn:T(({sortOrder:e,ariaLabel:t,toggleSort:r})=>[p(n,{icon:B(e),class:_(R.value.sortTrigger),size:z.value,"aria-label":t,"data-sorted":e?``:void 0,onClick:e=>r()},null,8,[`icon`,`class`,`size`,`aria-label`,`data-sorted`,`onClick`])]),key:`2`},P[`header-filter`]?void 0:{name:`header-filter`,fn:T(e=>[p(a,g(e,{ui:R.value,size:m.size}),null,16,[`ui`,`size`])]),key:`3`},P[`header-resize`]?void 0:{name:`header-resize`,fn:T(({resizing:e,ariaLabel:t,onPointerdown:n,onKeydown:r})=>[d(`button`,{type:`button`,class:_(R.value.resizeHandle),"aria-label":t,"aria-pressed":e,"data-resizing":e||void 0,onPointerdown:n,onKeydown:r},null,42,A)]),key:`4`},P[`tree-toggle`]?void 0:{name:`tree-toggle`,fn:T(({expanded:e,ariaLabel:t,toggleExpand:r})=>[p(n,{class:_(R.value.treeToggle),size:z.value,"aria-expanded":e,"aria-label":t,icon:e?`lucide:chevron-down`:`lucide:chevron-right`,onClick:e=>r()},null,8,[`class`,`size`,`aria-expanded`,`aria-label`,`icon`,`onClick`])]),key:`5`},P.expand?void 0:{name:`expand`,fn:T(({expanded:e,ariaLabel:t,hasChildren:r,toggleExpand:i})=>[r||P[`expanded-row`]?(y(),l(n,{key:0,icon:e?`lucide:chevron-down`:`lucide:chevron-right`,class:_(R.value.treeToggle),size:z.value,"aria-expanded":e,"aria-label":t,"data-expanded":e?``:void 0,onClick:e=>i()},null,8,[`icon`,`class`,`size`,`aria-expanded`,`aria-label`,`data-expanded`,`onClick`])):u(`v-if`,!0)]),key:`6`},P.empty?void 0:{name:`empty`,fn:T(()=>[p(i,{title:`No data`,description:`There is no data to display.`,icon:`lucide:inbox`,"media-variant":`icon`})]),key:`7`}]),1040))}});export{j as default};
+import{mergeVariants as e}from"../../theme/shared.js";import{miniSizeMap as t}from"../../theme/config.js";import"../../theme/index.js";import n from"../button/button-icon.js";import r from"../checkbox/checkbox.js";import i from"../empty/empty.js";import a from"./table-filter-popover.js";import{tableVariants as o}from"./variants.js";import s from"./table-radio.js";import{computed as c,createBlock as l,createCommentVNode as u,createElementVNode as d,createSlots as f,createVNode as p,defineComponent as m,guardReactiveProps as h,mergeProps as g,normalizeClass as _,normalizeProps as v,openBlock as y,renderList as b,renderSlot as x,toHandlers as S,unref as C,useSlots as w,withCtx as T}from"vue";import{useForwardListeners as E,useOmitProps as D}from"@soybeanjs/headless/composables";import{useLocaleMessages as O}from"@soybeanjs/headless";import{TableCompact as k,provideTableUi as A}from"@soybeanjs/headless/table";const j=[`aria-label`,`aria-pressed`,`data-resizing`,`onPointerdown`,`onKeydown`],M=m({name:`STable`,__name:`table`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},variant:{},bordered:{type:Boolean},rounded:{type:Boolean,default:!0},striped:{type:Boolean},columns:{},data:{},rowKey:{},defaultSortState:{},sortState:{},defaultFilterState:{},filterState:{},defaultColumnWidths:{},columnWidths:{},getChildren:{},indent:{},virtual:{type:Boolean},height:{},estimateSize:{},virtualizerOptions:{},defaultExpanded:{},expanded:{},defaultExpandAll:{type:Boolean},contentProps:{},headerProps:{},bodyProps:{},footerProps:{},headProps:{},rowProps:{},cellProps:{},dir:{},defaultSelected:{},selected:{},multiple:{default:!0}},emits:[`update:sortState`,`update:filterState`,`update:columnWidths`,`update:expanded`,`update:selected`],setup(m,{emit:M}){let N=m,P=M,F=w(),I=D(N,[`class`,`ui`,`size`,`variant`,`bordered`,`rounded`,`striped`]),L=E(P),R=c(()=>Object.keys(F)),z=c(()=>e(o({size:N.size,variant:N.variant,bordered:N.bordered,rounded:N.rounded,striped:N.striped}),N.ui,{root:N.class})),B=c(()=>t[N.size??`md`]),V=O(),H=e=>e===`asc`?`lucide:arrow-up`:e===`desc`?`lucide:arrow-down`:`lucide:arrow-up-down`;return A(z),(e,t)=>(y(),l(C(k),g(C(I),S(C(L))),f({_:2},[b(R.value,t=>({name:t,fn:T(n=>[x(e.$slots,t,v(h(n)))])})),F[`header-selection`]?void 0:{name:`header-selection`,fn:T(({checked:e,disabled:t,multiple:n,ariaLabel:i,updateChecked:a})=>[n?(y(),l(r,{key:0,disabled:t,"model-value":e,class:_(z.value.selection),"control-props":{"aria-label":i},"onUpdate:modelValue":a},null,8,[`disabled`,`model-value`,`class`,`control-props`,`onUpdate:modelValue`])):u(`v-if`,!0)]),key:`0`},F.selection?void 0:{name:`selection`,fn:T(({checked:e,multiple:t,ariaLabel:n,toggleSelect:i})=>[t?(y(),l(r,{key:0,class:_(z.value.selection),"model-value":e,"control-props":{"aria-label":n},"onUpdate:modelValue":e=>i()},null,8,[`class`,`model-value`,`control-props`,`onUpdate:modelValue`])):(y(),l(s,{key:1,size:m.size,checked:e,"aria-label":n,onClick:e=>i()},null,8,[`size`,`checked`,`aria-label`,`onClick`]))]),key:`1`},F[`header-sort`]?void 0:{name:`header-sort`,fn:T(({sortOrder:e,ariaLabel:t,toggleSort:r})=>[p(n,{icon:H(e),class:_(z.value.sortTrigger),size:B.value,"aria-label":t,"data-sorted":e?``:void 0,onClick:e=>r()},null,8,[`icon`,`class`,`size`,`aria-label`,`data-sorted`,`onClick`])]),key:`2`},F[`header-filter`]?void 0:{name:`header-filter`,fn:T(e=>[p(a,g(e,{ui:z.value,size:m.size}),null,16,[`ui`,`size`])]),key:`3`},F[`header-resize`]?void 0:{name:`header-resize`,fn:T(({resizing:e,ariaLabel:t,onPointerdown:n,onKeydown:r})=>[d(`button`,{type:`button`,class:_(z.value.resizeHandle),"aria-label":t,"aria-pressed":e,"data-resizing":e||void 0,onPointerdown:n,onKeydown:r},null,42,j)]),key:`4`},F[`tree-toggle`]?void 0:{name:`tree-toggle`,fn:T(({expanded:e,ariaLabel:t,toggleExpand:r})=>[p(n,{class:_(z.value.treeToggle),size:B.value,"aria-expanded":e,"aria-label":t,icon:e?`lucide:chevron-down`:`lucide:chevron-right`,onClick:e=>r()},null,8,[`class`,`size`,`aria-expanded`,`aria-label`,`icon`,`onClick`])]),key:`5`},F.expand?void 0:{name:`expand`,fn:T(({expanded:e,ariaLabel:t,hasChildren:r,toggleExpand:i})=>[r||F[`expanded-row`]?(y(),l(n,{key:0,icon:e?`lucide:chevron-down`:`lucide:chevron-right`,class:_(z.value.treeToggle),size:B.value,"aria-expanded":e,"aria-label":t,"data-expanded":e?``:void 0,onClick:e=>i()},null,8,[`icon`,`class`,`size`,`aria-expanded`,`aria-label`,`data-expanded`,`onClick`])):u(`v-if`,!0)]),key:`6`},F.empty?void 0:{name:`empty`,fn:T(()=>[p(i,{title:C(V).table.emptyTitle,description:C(V).table.emptyDescription,icon:`lucide:inbox`,"media-variant":`icon`},null,8,[`title`,`description`])]),key:`7`}]),1040))}});export{M as default};

package/dist/components/tabs/tabs.js

@@ -1 +1 @@
-import{mergeSlotVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{tabsVariants 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{TabsCompact as b,provideTabsUi as x}from"@soybeanjs/headless/tabs";const S=o({name:`STabs`,__name:`tabs`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},fill:{default:`full`},items:{},enableIndicator:{type:Boolean,default:!0},listProps:{},triggerProps:{},contentProps:{},indicatorProps:{},modelValue:{default:void 0},defaultValue:{},activationMode:{},unmountOnHide:{type:Boolean,default:!0},orientation:{},dir:{},loop:{type:Boolean,default:!0}},emits:[`update:modelValue`],setup(o,{emit:S}){let C=o,w=S,T=h(),E=v(C,[`class`,`size`,`ui`,`fill`]),D=_(w),O=n(()=>y(T));return x(n(()=>e(t({size:C.size,orientation:C.orientation,fill:C.fill,enableIndicator:C.enableIndicator}),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{mergeVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{tabsVariants 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{TabsCompact as b,provideTabsUi as x}from"@soybeanjs/headless/tabs";const S=o({name:`STabs`,__name:`tabs`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},fill:{default:`full`},items:{},enableIndicator:{type:Boolean,default:!0},listProps:{},triggerProps:{},contentProps:{},indicatorProps:{},modelValue:{default:void 0},defaultValue:{},activationMode:{},unmountOnHide:{type:Boolean,default:!0},orientation:{},dir:{},loop:{type:Boolean,default:!0}},emits:[`update:modelValue`],setup(o,{emit:S}){let C=o,w=S,T=h(),E=v(C,[`class`,`size`,`ui`,`fill`]),D=_(w),O=n(()=>y(T));return x(n(()=>e(t({size:C.size,orientation:C.orientation,fill:C.fill,enableIndicator:C.enableIndicator}),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};

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

@@ -4,14 +4,14 @@ import * as _$vue from "vue";
 //#region src/components/tabs/tabs.vue.d.ts
 declare const __VLS_export: <T extends TabsOptionData = TabsOptionData>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
   props: _$vue.PublicProps & __VLS_PrettifyLocal<TabsProps<T> & {
-    "onUpdate:modelValue"?: ((payload: T["value"]) => any) | undefined;
+    "onUpdate:modelValue"?: ((payload: Exclude<T["value"], undefined>) => any) | undefined;
   }> & (typeof globalThis extends {
     __VLS_PROPS_FALLBACK: infer P;
   } ? P : {});
   expose: (exposed: {}) => void;
   attrs: any;
   slots: TabsSlots<T>;
-  emit: (evt: "update:modelValue", payload: T["value"]) => void;
+  emit: (evt: "update:modelValue", payload: Exclude<T["value"], undefined>) => void;
 }>) => _$vue.VNode & {
   __ctx?: Awaited<typeof __VLS_setup>;
 };

package/dist/components/tags-input/index.d.ts

@@ -1,6 +1,5 @@
-import { TagsInputEmits, TagsInputProps } from "./types.js";
+import { TagsInputEmits, TagsInputProps, TagsInputSlots } from "./types.js";
 import { _default } from "./tags-input.vue.js";
-import { _default as _default$1 } from "./tags-input-item-delete.vue.js";
-import { TagsInputClear as STagsInputClear, TagsInputInput as STagsInputInput, TagsInputItem as STagsInputItem, TagsInputItemText as STagsInputItemText } from "@soybeanjs/headless/tags-input";
+import { TagsInputItemDelete as STagsInputItemDelete, TagsInputItemText as STagsInputItemText } from "@soybeanjs/headless/tags-input";
 export * from "@soybeanjs/headless/tags-input";
-export { STagsInputClear, STagsInputInput, STagsInputItem, STagsInputItemText };
+export { STagsInputItemDelete, STagsInputItemText };

package/dist/components/tags-input/index.js

@@ -1 +1 @@
-import"./tags-input.js";import"./tags-input-item-delete.js";import{TagsInputClear as e,TagsInputInput as t,TagsInputItem as n,TagsInputItemText as r}from"@soybeanjs/headless/tags-input";export{e as STagsInputClear,t as STagsInputInput,n as STagsInputItem,r as STagsInputItemText};
+import"./tags-input.js";import{TagsInputItemDelete as e,TagsInputItemText as t}from"@soybeanjs/headless/tags-input";export{e as STagsInputItemDelete,t as STagsInputItemText};

package/dist/components/tags-input/tags-input.js

@@ -1 +1 @@
-import{mergeSlotVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{tagsInputVariants 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{TagsInputRoot as h,provideTagsInputUi as g}from"@soybeanjs/headless/tags-input";const _=i({name:`STagsInput`,__name:`tags-input`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},id:{},modelValue:{},defaultValue:{},addOnPaste:{type:Boolean},addOnTab:{type:Boolean},addOnBlur:{type:Boolean},duplicate:{type:Boolean},disabled:{type:Boolean},delimiter:{},dir:{},max:{},convertValue:{type:Function},displayValue:{type:Function},name:{},required:{type:Boolean}},emits:[`update:modelValue`,`invalid`,`addTag`,`removeTag`],setup(i,{emit:_}){let v=i,y=_,b=m(v,[`class`,`size`,`ui`,`onInvalid`]),x=p(y);return g(n(()=>e(t({size:v.size}),v.ui,{root: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{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{tagsInputVariants as r}from"./variants.js";import{computed as i,createBlock as a,createSlots as o,defineComponent as s,guardReactiveProps as c,mergeProps as l,normalizeProps as u,openBlock 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{TagsInputCompact as y,provideTagsInputUi as b}from"@soybeanjs/headless/tags-input";const x=s({name:`STagsInput`,__name:`tags-input`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},clearable:{type:Boolean},controlProps:{},clearProps:{},itemProps:{},itemTextProps:{},itemDeleteProps:{},dir:{},modelValue:{},defaultValue:{},addOnPaste:{type:Boolean},addOnTab:{type:Boolean},addOnBlur:{type:Boolean},duplicate:{type:Boolean},delimiter:{},max:{},displayValue:{type:Function},id:{},autofocus:{type:Boolean},disabled:{type:Boolean},maxlength:{},minlength:{},pattern:{},placeholder:{},readonly:{type:Boolean},name:{},required:{type:Boolean}},emits:[`update:modelValue`,`invalid`,`addTag`,`removeTag`],setup(s,{emit:x}){let S=s,C=x,w=h(),T=v(S,[`class`,`size`,`ui`]),E=_(C);return b(i(()=>{let i=t[S.size||`md`];return e(Object.assign(r({size:S.size}),{$base:{itemDelete:n({size:i,shape:`circle`}),clear:n({size:S.size})}}),S.ui,{root:S.class})})),(e,t)=>(d(),a(m(y),l(m(T),p(m(E))),o({_:2},[w.item?{name:`item`,fn:g(t=>[f(e.$slots,`item`,u(c(t)))]),key:`0`}:void 0]),1040))}});export{x as default};

package/dist/components/tags-input/tags-input.vue.d.ts

@@ -1,29 +1,25 @@
-import { TagsInputProps } from "./types.js";
+import { TagsInputProps, TagsInputSlots } from "./types.js";
 import * as _$vue from "vue";
-import { TagsInputAcceptableValue } from "@soybeanjs/headless/tags-input";
 
 //#region src/components/tags-input/tags-input.vue.d.ts
-declare const __VLS_export: <T extends TagsInputAcceptableValue = string>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-  props: _$vue.PublicProps & __VLS_PrettifyLocal<TagsInputProps<T> & {
-    "onUpdate:modelValue"?: ((value: T[]) => any) | undefined;
-    onInvalid?: ((value: T) => any) | undefined;
-    onAddTag?: ((value: T) => any) | undefined;
-    onRemoveTag?: ((value: T) => any) | undefined;
-  }> & (typeof globalThis extends {
-    __VLS_PROPS_FALLBACK: infer P;
-  } ? P : {});
-  expose: (exposed: {}) => void;
-  attrs: any;
-  slots: {
-    default?: (props: {
-      modelValue: TagsInputAcceptableValue[] | undefined;
-    }) => any;
+type __VLS_Slots = TagsInputSlots;
+declare const __VLS_base: _$vue.DefineComponent<TagsInputProps, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+  invalid: (value: string) => any;
+  "update:modelValue": (value: string[]) => any;
+  addTag: (value: string) => any;
+  removeTag: (value: string) => any;
+}, string, _$vue.PublicProps, Readonly<TagsInputProps> & Readonly<{
+  onInvalid?: ((value: string) => any) | undefined;
+  "onUpdate:modelValue"?: ((value: string[]) => any) | undefined;
+  onAddTag?: ((value: string) => any) | undefined;
+  onRemoveTag?: ((value: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+type __VLS_WithSlots<T, S> = T & {
+  new (): {
+    $slots: S;
   };
-  emit: ((evt: "update:modelValue", value: T[]) => void) & ((evt: "invalid", value: T) => void) & ((evt: "addTag", value: T) => void) & ((evt: "removeTag", value: T) => void);
-}>) => _$vue.VNode & {
-  __ctx?: Awaited<typeof __VLS_setup>;
 };
-declare const _default: typeof __VLS_export;
-type __VLS_PrettifyLocal<T> = (T extends any ? { [K in keyof T]: T[K] } : { [K in keyof T as K]: T[K] }) & {};
 //#endregion
 export { _default };

package/dist/components/tags-input/types.d.ts

@@ -1,12 +1,12 @@
 import { ThemeSize } from "../../theme/types.js";
-import { TagsInputRootEmits, TagsInputRootProps, TagsInputUi } from "@soybeanjs/headless/tags-input";
+import { TagsInputCompactEmits, TagsInputCompactProps, TagsInputCompactSlots, TagsInputUi } from "@soybeanjs/headless/tags-input";
 import { ClassValue } from "@soybeanjs/headless/types";
 
 //#region src/components/tags-input/types.d.ts
 /**
  * Properties for the TagsInput component.
  */
-interface TagsInputProps<T = string> extends TagsInputRootProps<T> {
+interface TagsInputProps extends TagsInputCompactProps {
   /**
    * Additional class names applied to the root element.
    */
@@ -23,6 +23,10 @@ interface TagsInputProps<T = string> extends TagsInputRootProps<T> {
 /**
  * Events for the TagsInput component.
  */
-type TagsInputEmits<T = string> = TagsInputRootEmits<T>;
+type TagsInputEmits = TagsInputCompactEmits;
+/**
+ * Slots for the TagsInput component.
+ */
+type TagsInputSlots = TagsInputCompactSlots;
 //#endregion
-export { TagsInputEmits, TagsInputProps };
+export { TagsInputEmits, TagsInputProps, TagsInputSlots };

package/dist/components/tags-input/variants.js

@@ -1 +1 @@
-import{tv as e}from"tailwind-variants";const t=e({slots:{root:[`flex w-full flex-wrap items-center rounded-md border border-input bg-background shadow-xs transition-[color,box-shadow]`,`focus-within:border-ring focus-within:ring-3 focus-within:ring-ring/50`,`data-[invalid]:border-destructive data-[invalid]:ring-3 data-[invalid]:ring-destructive/20`,`data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50`],item:[`inline-flex items-center rounded-md bg-secondary ring-offset-background transition-[box-shadow,background-color]`,`data-[state=active]:ring-2 data-[state=active]:ring-ring data-[state=active]:ring-offset-2`,`data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50`],itemText:`rounded bg-transparent`,itemDelete:[`inline-flex items-center justify-center rounded bg-transparent text-muted-foreground transition-colors`,`hover:text-foreground outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2`],input:[`min-w-24 flex-1 bg-transparent text-foreground outline-none`,`placeholder:text-muted-foreground disabled:cursor-not-allowed`],clear:[`inline-flex items-center justify-center rounded-md text-muted-foreground transition-colors`,`hover:text-foreground outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2`,`data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50`]},variants:{size:{xs:{root:`gap-1 px-1.5 py-1 text-2xs`,item:`min-h-5 gap-0.5`,itemText:`px-1.5 py-0.5 text-2xs`,itemDelete:`me-0.5 size-4`,input:`min-h-5 px-1 text-2xs`,clear:`size-4 text-xs`},sm:{root:`gap-1.5 px-2 py-1 text-xs`,item:`min-h-5 gap-0.75`,itemText:`px-1.5 py-0.5 text-xs`,itemDelete:`me-0.5 size-4`,input:`min-h-5 px-1 text-xs`,clear:`size-4 text-xs`},md:{root:`gap-2 px-2 py-1 text-sm`,item:`min-h-5 gap-1`,itemText:`px-2 py-0.5 text-sm`,itemDelete:`me-1 size-4`,input:`min-h-5 px-1 text-sm`,clear:`size-4 text-sm`},lg:{root:`gap-2 px-2.5 py-1.5 text-base`,item:`min-h-6 gap-1`,itemText:`px-2 py-0.5 text-base`,itemDelete:`me-1 size-4.5`,input:`min-h-6 px-1 text-base`,clear:`size-4.5 text-base`},xl:{root:`gap-2.5 px-3 py-2 text-lg`,item:`min-h-7 gap-1.5`,itemText:`px-2.5 py-1 text-lg`,itemDelete:`me-1 size-5`,input:`min-h-7 px-1.5 text-lg`,clear:`size-5 text-lg`},"2xl":{root:`gap-3 px-3.5 py-2.5 text-xl`,item:`min-h-8 gap-1.5`,itemText:`px-3 py-1 text-xl`,itemDelete:`me-1.5 size-5.5`,input:`min-h-8 px-1.5 text-xl`,clear:`size-5.5 text-xl`}}},defaultVariants:{size:`md`}});export{t as tagsInputVariants};
+import{tv as e}from"tailwind-variants";const t=e({slots:{root:[`group relative flex w-full flex-wrap items-center rounded-md border border-input bg-background shadow-sm transition-all-150`,`outline-none focus-within:ring-3 focus-within:ring-offset-background focus-within:ring-primary/30`,`data-[invalid]:focus-within:ring-destructive/30`,`data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50`],item:[`inline-flex items-center rounded-md bg-accent ring-offset-background transition-[box-shadow,background-color]`,`data-[state=active]:ring-2 data-[state=active]:ring-primary/30 data-[state=active]:ring-offset-2`,`data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50`],itemText:`rounded bg-transparent`,itemDelete:``,control:[`grow min-w-0 bg-transparent text-foreground outline-none`,`placeholder:text-muted-foreground disabled:cursor-not-allowed`],clear:`absolute opacity-0 transition-opacity group-data-[has-value]:opacity-100`},variants:{size:{xs:{root:`gap-1 px-1.5 py-1 text-2xs`,item:`min-h-4 gap-0.5`,itemText:`px-1.5 py-0.5`,itemDelete:`me-0.5`,input:`min-h-5 px-0.5`,clear:`end-0.5 top-0.5`},sm:{root:`gap-1.5 px-2 py-1 text-xs`,item:`min-h-4.5 gap-0.75`,itemText:`px-1.5 py-0.5`,itemDelete:`me-0.5`,input:`min-h-5 px-0.75`,clear:`end-0.75 top-0.75`},md:{root:`gap-2 px-2 py-1 text-sm`,item:`min-h-5 gap-1`,itemText:`px-2 py-0.5`,itemDelete:`me-1`,input:`min-h-5 px-1`,clear:`end-1 top-1`},lg:{root:`gap-2 px-2.5 py-1.5 text-base`,item:`min-h-6 gap-1`,itemText:`px-2 py-0.5`,itemDelete:`me-1`,input:`min-h-6 px-1.25`,clear:`end-1.25 top-1.25`},xl:{root:`gap-2.5 px-3 py-2 text-lg`,item:`min-h-7 gap-1.5`,itemText:`px-2.5 py-1`,itemDelete:`me-1`,input:`min-h-7 px-1.5`,clear:`end-1.5 top-1.5`},"2xl":{root:`gap-3 px-3.5 py-2.5 text-xl`,item:`min-h-8 gap-1.5`,itemText:`px-3 py-1`,itemDelete:`me-1.5`,input:`min-h-8 px-2`,clear:`end-2 top-2`}}},defaultVariants:{size:`md`}});export{t as tagsInputVariants};

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

@@ -1,4 +1,6 @@
 import { TextareaResize } from "./variants.js";
-import { TextareaEmits, TextareaExtraUiSlot, TextareaProps } from "./types.js";
+import { TextareaEmits, TextareaProps, TextareaSlots } from "./types.js";
 import { _default } from "./textarea.vue.js";
-export * from "@soybeanjs/headless/textarea";
+import { TextareaClear as STextareaClear } from "@soybeanjs/headless/textarea";
+export * from "@soybeanjs/headless/textarea";
+export { STextareaClear };

package/dist/components/textarea/index.js

@@ -1 +1 @@
-import"./textarea.js";
+import"./textarea.js";import{TextareaClear as e}from"@soybeanjs/headless/textarea";export{e as STextareaClear};

package/dist/components/textarea/textarea.js

@@ -1 +1 @@
-import{mergeSlotVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import t from"../icon/icon.js";import{textareaVariants as n}from"./variants.js";import{computed as r,createBlock as i,createCommentVNode as a,createVNode as o,defineComponent as s,guardReactiveProps as c,mergeProps as l,normalizeClass as u,normalizeProps as d,openBlock as f,renderSlot as p,unref as m,withCtx as h}from"vue";import{useForwardElement as g,useOmitProps as _}from"@soybeanjs/headless/composables";import{TextareaControl as v,TextareaCounter as y,TextareaRoot as b,provideTextareaUi as x}from"@soybeanjs/headless/textarea";const S=s({name:`STextarea`,__name:`textarea`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},resize:{},clearable:{type:Boolean},showCounter:{type:Boolean},textareaRef:{type:Function},controlProps:{},counterProps:{},defaultValue:{},modelValue:{},autosize:{type:[Boolean,Object]},id:{},autofocus:{type:Boolean},disabled:{type:Boolean},maxlength:{},minlength:{},placeholder:{},readonly:{type:Boolean},name:{},required:{type:Boolean}},emits:[`update:modelValue`],setup(s,{emit:S}){let C=s,w=S,[T,E]=g(e=>C.textareaRef?.(e)),D=_(C,[`class`,`size`,`ui`,`resize`,`clearable`,`showCounter`,`textareaRef`,`controlProps`,`counterProps`]),O=r(()=>e(n({size:C.size,resize:C.autosize?!1:C.resize}),C.ui,{root:C.class}));return x(O),(e,n)=>(f(),i(m(b),l(m(D),{"onUpdate:modelValue":n[0]||=e=>w(`update:modelValue`,e)}),{default:h(({clear:n})=>[o(m(v),l(s.controlProps,{ref:m(E)}),null,16),s.clearable?(f(),i(t,{key:0,icon:`lucide:x`,class:u(O.value.clearable),onClick:n},null,8,[`class`,`onClick`])):a(`v-if`,!0),s.showCounter?(f(),i(m(y),{key:1},{default:h(t=>[p(e.$slots,`counter`,d(c(t)))]),_:3})):a(`v-if`,!0),p(e.$slots,`footer`)]),_:3},16))}});export{S as default};
+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{textareaVariants as r}from"./variants.js";import{computed as i,createBlock as a,createSlots as o,defineComponent as s,guardReactiveProps as c,mergeProps as l,normalizeProps as u,openBlock as d,renderList as f,renderSlot as p,unref as m,useSlots as h,withCtx as g}from"vue";import{useOmitProps as _}from"@soybeanjs/headless/composables";import{keysOf as v}from"@soybeanjs/utils";import{TextareaCompact as y,provideTextareaUi as b}from"@soybeanjs/headless/textarea";const x=s({name:`STextarea`,__name:`textarea`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},resize:{},textareaRef:{type:Function},clearable:{type:Boolean},showCounter:{type:Boolean},controlProps:{},clearProps:{},counterProps:{},defaultValue:{},modelValue:{},autosize:{type:[Boolean,Object]},id:{},autofocus:{type:Boolean},disabled:{type:Boolean},maxlength:{},minlength:{},placeholder:{},readonly:{type:Boolean},name:{},required:{type:Boolean}},emits:[`update:modelValue`,`clear`],setup(s,{emit:x}){let S=s,C=x,w=_(S,[`class`,`size`,`ui`,`resize`]),T=h(),E=i(()=>v(T));return b(i(()=>{let i=t[S.size??`md`];return e(Object.assign(r({size:S.size,resize:S.autosize?!1:S.resize}),{$base:{clear:n({size:i,shape:`circle`})}}),S.ui,{root:S.class})})),(e,t)=>(d(),a(m(y),l(m(w),{"onUpdate:modelValue":t[0]||=e=>C(`update:modelValue`,e)}),o({_:2},[f(E.value,t=>({name:t,fn:g(n=>[p(e.$slots,t,u(c(n)))])}))]),1040))}});export{x as default};

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

@@ -1,19 +1,13 @@
-import { TextareaProps } from "./types.js";
+import { TextareaProps, TextareaSlots } from "./types.js";
 import * as _$vue from "vue";
 
 //#region src/components/textarea/textarea.vue.d.ts
-declare var __VLS_28: {
-    count: number;
-    maxlength: number | undefined;
-  }, __VLS_30: {};
-type __VLS_Slots = {} & {
-  counter?: (props: typeof __VLS_28) => any;
-} & {
-  footer?: (props: typeof __VLS_30) => any;
-};
+type __VLS_Slots = TextareaSlots;
 declare const __VLS_base: _$vue.DefineComponent<TextareaProps, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+  clear: (event: PointerEvent) => any;
   "update:modelValue": (value: string) => any;
 }, string, _$vue.PublicProps, Readonly<TextareaProps> & Readonly<{
+  onClear?: ((event: PointerEvent) => any) | undefined;
   "onUpdate:modelValue"?: ((value: string) => any) | undefined;
 }>, {}, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

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

@@ -1,18 +1,13 @@
 import { ThemeSize } from "../../theme/types.js";
 import { TextareaResize } from "./variants.js";
-import { TextareaControlProps, TextareaCounterProps, TextareaRootEmits, TextareaRootProps, TextareaUi } from "@soybeanjs/headless/textarea";
+import { TextareaCompactEmits, TextareaCompactProps, TextareaCompactSlots, TextareaUi } from "@soybeanjs/headless/textarea";
 import { ClassValue } from "@soybeanjs/headless/types";
 
 //#region src/components/textarea/types.d.ts
-/**
- * Additional UI slots for the textarea component.
- */
-type TextareaExtraUiSlot = 'clearable';
-type TextareaExtendedUi = TextareaUi & Record<TextareaExtraUiSlot, ClassValue>;
 /**
  * Properties for the Textarea component.
  */
-interface TextareaProps extends TextareaRootProps {
+interface TextareaProps extends TextareaCompactProps {
   /**
    * Additional class names applied to the root element.
    */
@@ -24,35 +19,21 @@ interface TextareaProps extends TextareaRootProps {
   /**
    * Per-slot class overrides for the component.
    */
-  ui?: Partial<TextareaExtendedUi>;
+  ui?: Partial<TextareaUi>;
   /**
    * The resize of the textarea
    *
    * if autosize is true, the resize will be ignored
    */
   resize?: TextareaResize;
-  /** Whether to show the clear icon */
-  clearable?: boolean;
-  /** Whether to show the counter */
-  showCounter?: boolean;
-  /**
-   * The function to set the textarea element.
-   *
-   * @param el - The textarea element.
-   */
-  textareaRef?: (el: HTMLTextAreaElement) => void;
-  /**
-   * The props of the textarea extra props.
-   */
-  controlProps?: TextareaControlProps;
-  /**
-   * Properties forwarded to the counter element.
-   */
-  counterProps?: TextareaCounterProps;
 }
 /**
  * Events for the Textarea component.
  */
-type TextareaEmits = TextareaRootEmits;
+type TextareaEmits = TextareaCompactEmits;
+/**
+ * Slots for the Textarea component.
+ */
+type TextareaSlots = TextareaCompactSlots;
 //#endregion
-export { TextareaEmits, TextareaExtraUiSlot, TextareaProps };
+export { TextareaEmits, TextareaProps, TextareaSlots };

package/dist/components/textarea/variants.d.ts

@@ -8,37 +8,37 @@ declare const textareaVariants: _$tailwind_variants0.TVReturnType<{
       root: string;
       control: string;
       counter: string;
-      clearable: string;
+      clear: string;
     };
     sm: {
       root: string;
       control: string;
       counter: string;
-      clearable: string;
+      clear: string;
     };
     md: {
       root: string;
       control: string;
       counter: string;
-      clearable: string;
+      clear: string;
     };
     lg: {
       root: string;
       control: string;
       counter: string;
-      clearable: string;
+      clear: string;
     };
     xl: {
       root: string;
       control: string;
       counter: string;
-      clearable: string;
+      clear: string;
     };
     '2xl': {
       root: string;
       control: string;
       counter: string;
-      clearable: string;
+      clear: string;
     };
   };
   resize: {
@@ -59,44 +59,44 @@ declare const textareaVariants: _$tailwind_variants0.TVReturnType<{
   root: string[];
   control: string[];
   counter: string;
-  clearable: string;
+  clear: string;
 }, undefined, {
   size: {
     xs: {
       root: string;
       control: string;
       counter: string;
-      clearable: string;
+      clear: string;
     };
     sm: {
       root: string;
       control: string;
       counter: string;
-      clearable: string;
+      clear: string;
     };
     md: {
       root: string;
       control: string;
       counter: string;
-      clearable: string;
+      clear: string;
     };
     lg: {
       root: string;
       control: string;
       counter: string;
-      clearable: string;
+      clear: string;
     };
     xl: {
       root: string;
       control: string;
       counter: string;
-      clearable: string;
+      clear: string;
     };
     '2xl': {
       root: string;
       control: string;
       counter: string;
-      clearable: string;
+      clear: string;
     };
   };
   resize: {
@@ -117,44 +117,44 @@ declare const textareaVariants: _$tailwind_variants0.TVReturnType<{
   root: string[];
   control: string[];
   counter: string;
-  clearable: string;
+  clear: string;
 }, _$tailwind_variants0.TVReturnType<{
   size: {
     xs: {
       root: string;
       control: string;
       counter: string;
-      clearable: string;
+      clear: string;
     };
     sm: {
       root: string;
       control: string;
       counter: string;
-      clearable: string;
+      clear: string;
     };
     md: {
       root: string;
       control: string;
       counter: string;
-      clearable: string;
+      clear: string;
     };
     lg: {
       root: string;
       control: string;
       counter: string;
-      clearable: string;
+      clear: string;
     };
     xl: {
       root: string;
       control: string;
       counter: string;
-      clearable: string;
+      clear: string;
     };
     '2xl': {
       root: string;
       control: string;
       counter: string;
-      clearable: string;
+      clear: string;
     };
   };
   resize: {
@@ -175,7 +175,7 @@ declare const textareaVariants: _$tailwind_variants0.TVReturnType<{
   root: string[];
   control: string[];
   counter: string;
-  clearable: string;
+  clear: string;
 }, undefined, unknown, unknown, undefined>>;
 type TextareaVariants = VariantProps<typeof textareaVariants>;
 type TextareaResize = NonNullable<TextareaVariants['resize']>;

package/dist/components/textarea/variants.js

@@ -1 +1 @@
-import{tv as e}from"tailwind-variants";const t=e({slots:{root:[`group relative flex flex-col`,`rounded-md border border-solid border-input bg-background transition-all-150`,`outline-none focus-within:ring-3  focus-within:ring-offset-background focus-within:ring-primary/30`],control:[`w-full bg-transparent outline-none`,`placeholder:text-muted-foreground`,`disabled:cursor-not-allowed disabled:opacity-50`],counter:`absolute z-2 leading-none text-muted-foreground`,clearable:`absolute hidden group-hover:block size-1em cursor-pointer opacity-50 hover:opacity-100`},variants:{size:{xs:{root:`text-2xs`,control:`min-h-6 px-1.5 py-1`,counter:`text-2xs right-1.75 bottom-1.5`,clearable:`right-1.5 top-1.5`},sm:{root:`text-xs`,control:`min-h-7 px-1.75 py-1`,counter:`text-xs right-2 bottom-1.75`,clearable:`right-1.75 top-1.75`},md:{root:`text-sm`,control:`min-h-8 px-2 py-1`,counter:`text-sm right-2.5 bottom-2`,clearable:`right-2 top-2`},lg:{root:`text-base`,control:`min-h-9 px-2.5 py-1`,counter:`text-base right-3 bottom-2.5`,clearable:`right-2.5 top-2.5`},xl:{root:`text-lg`,control:`min-h-10 px-3 py-1`,counter:`text-lg right-3.5 bottom-3`,clearable:`right-3 top-3`},"2xl":{root:`text-xl`,control:`min-h-12 px-4 py-2`,counter:`text-xl right-4 bottom-3.5`,clearable:`right-3.5 top-3.5`}},resize:{true:{control:`resize`},false:{control:`resize-none`},vertical:{control:`resize-y`},horizontal:{control:`resize-x`}}},defaultVariants:{size:`md`,resize:`vertical`}});export{t as textareaVariants};
+import{tv as e}from"tailwind-variants";const t=e({slots:{root:[`group relative flex flex-col`,`rounded-md border border-solid border-input bg-background transition-all-150`,`outline-none focus-within:ring-3  focus-within:ring-offset-background focus-within:ring-primary/30`],control:[`w-full bg-transparent outline-none`,`placeholder:text-muted-foreground`,`disabled:cursor-not-allowed disabled:opacity-50`],counter:`absolute z-2 leading-none text-muted-foreground`,clear:`absolute hidden opacity-50 group-hover:inline-flex group-focus-within:inline-flex hover:opacity-100`},variants:{size:{xs:{root:`text-2xs`,control:`min-h-6 px-1.5 py-1`,counter:`text-2xs end-1.75 bottom-1.5`,clear:`end-1.5 top-1.5`},sm:{root:`text-xs`,control:`min-h-7 px-1.75 py-1`,counter:`text-xs end-2 bottom-1.75`,clear:`end-1.75 top-1.75`},md:{root:`text-sm`,control:`min-h-8 px-2 py-1`,counter:`text-sm end-2.5 bottom-2`,clear:`end-2 top-2`},lg:{root:`text-base`,control:`min-h-9 px-2.5 py-1`,counter:`text-base end-3 bottom-2.5`,clear:`end-2.5 top-2.5`},xl:{root:`text-lg`,control:`min-h-10 px-3 py-1`,counter:`text-lg end-3.5 bottom-3`,clear:`end-3 top-3`},"2xl":{root:`text-xl`,control:`min-h-12 px-4 py-2`,counter:`text-xl end-4 bottom-3.5`,clear:`end-3.5 top-3.5`}},resize:{true:{control:`resize`},false:{control:`resize-none`},vertical:{control:`resize-y`},horizontal:{control:`resize-x`}}},defaultVariants:{size:`md`,resize:`vertical`}});export{t as textareaVariants};

package/dist/components/time-field/index.d.ts

@@ -1,3 +1,3 @@
-import { TimeFieldEmits, TimeFieldProps, TimeFieldSlotProps, TimeFieldSlots } from "./types.js";
+import { TimeFieldEmits, TimeFieldProps } from "./types.js";
 import { _default } from "./time-field.vue.js";
 export * from "@soybeanjs/headless/time-field";

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

@@ -1 +1 @@
-import{mergeSlotVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{timeFieldVariants as t}from"./variants.js";import{Fragment as n,computed as r,createBlock as i,createElementBlock as a,createTextVNode as o,defineComponent as s,mergeProps as c,normalizeProps as l,openBlock as u,renderList as d,renderSlot as f,toDisplayString as p,toHandlers as m,unref as h,withCtx as g}from"vue";import{useForwardListeners as _,useOmitProps as v}from"@soybeanjs/headless/composables";import{TimeFieldInput as y,TimeFieldRoot as b,provideTimeFieldUi as x}from"@soybeanjs/headless/time-field";const S=s({name:`STimeField`,__name:`time-field`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},inputProps:{}},emits:[`update:modelValue`,`update:placeholder`],setup(s,{emit:S}){let C=s,w=_(S),T=v(C,[`class`,`size`,`ui`,`inputProps`]);return x(r(()=>e(t({size:C.size}),C.ui,{root:C.class}))),(e,t)=>(u(),i(h(b),c(h(T),m(h(w))),{default:g(t=>[e.$slots.default?f(e.$slots,`default`,l(c({key:0},t))):(u(!0),a(n,{key:1},d(t.segments,(e,t)=>(u(),i(h(y),c({key:`${e.part}-${t}`,part:e.part},{ref_for:!0},s.inputProps),{default:g(()=>[o(p(e.value),1)]),_:2},1040,[`part`]))),128))]),_:3},16))}});export{S as default};
+import{mergeVariants as e}from"../../theme/shared.js";import"../../theme/index.js";import{dateFieldVariants as t}from"../date-field/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{TimeFieldCompact as d,provideTimeFieldUi as f}from"@soybeanjs/headless/time-field";const p=i({name:`STimeField`,__name:`time-field`,props:{class:{type:[Boolean,null,String,Object,Array]},size:{},ui:{},inputProps:{},defaultValue:{},modelValue:{},defaultPlaceholder:{},placeholder:{},granularity:{},maxValue:{},minValue:{},isTimeUnavailable:{type:Function},id:{},hourCycle:{},step:{},hideTimeZone:{type:Boolean},name:{},required:{type:Boolean},dir:{},locale:{},disabled:{type:Boolean},readonly:{type:Boolean},asChild:{type:Boolean},as:{}},emits:[`update:modelValue`,`update:placeholder`],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};

package/dist/components/time-field/time-field.vue.d.ts

@@ -1,22 +1,15 @@
-import { TimeFieldProps, TimeFieldSlots } from "./types.js";
+import { TimeFieldProps } from "./types.js";
 import * as _$vue from "vue";
 import * as _$_soybeanjs_headless_date0 from "@soybeanjs/headless/date";
 
 //#region src/components/time-field/time-field.vue.d.ts
-type __VLS_Slots = TimeFieldSlots;
-declare const __VLS_base: _$vue.DefineComponent<TimeFieldProps, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+declare const __VLS_export: _$vue.DefineComponent<TimeFieldProps, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
   "update:modelValue": (time: _$_soybeanjs_headless_date0.TimeValue | undefined) => any;
   "update:placeholder": (time: _$_soybeanjs_headless_date0.TimeValue) => any;
 }, string, _$vue.PublicProps, Readonly<TimeFieldProps> & Readonly<{
   "onUpdate:modelValue"?: ((time: _$_soybeanjs_headless_date0.TimeValue | undefined) => any) | undefined;
   "onUpdate:placeholder"?: ((time: _$_soybeanjs_headless_date0.TimeValue) => any) | undefined;
 }>, {}, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
-declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
-type __VLS_WithSlots<T, S> = T & {
-  new (): {
-    $slots: S;
-  };
-};
 //#endregion
 export { _default };