@nild/components 0.0.47 → 0.0.48

package/dist/input/Input.js

@@ -1 +1 @@
-import{jsx as m,jsxs as y}from"react/jsx-runtime";import{useControllableState as E}from"@nild/hooks";import{cnMerge as N}from"@nild/shared";import{forwardRef as k,isValidElement as I}from"react";import M from"../_shared/utils/register-slots/index.js";import{useCompositeContext as j,InputProvider as P}from"./contexts/index.js";import{isPrefixElement as S}from"./Prefix.js";import p from"./style/index.js";import{isSuffixElement as V}from"./Suffix.js";const w=e=>I(e)&&e.type===r,J=M({prefix:{isMatched:S},suffix:{isMatched:V}}),r=k((e,d)=>{const a=j(),{className:f,children:u,variant:l=a.variant,size:t=a.size,block:c=a.block,disabled:s=a.disabled,type:v="text",value:x,defaultValue:b="",onChange:o,...h}=e,{slots:n}=J(u),[g,z]=E(x,b),C=i=>{z(i.target.value),o?.(i.target.value,i)};return m(P,{value:{size:t,disabled:s,variant:l},children:y("span",{className:N(p.inputWrapper({variant:l,size:t,block:c,disabled:s}),f),"data-disabled":s||void 0,children:[n.prefix.el,m("input",{ref:d,type:v,value:g,onChange:C,disabled:s,className:p.input({size:t}),...h}),n.suffix.el]})})});r.displayName="Input";export{r as default,w as isInputElement};
+import{jsx as m,jsxs as y}from"react/jsx-runtime";import{useControllableState as E}from"@nild/hooks";import{cnMerge as N}from"@nild/shared";import{forwardRef as k,isValidElement as I}from"react";import M from"../_shared/utils/register-slots/index.js";import{useCompositeContext as j,InputProvider as P}from"./contexts/index.js";import{isPrefixElement as S}from"./Prefix.js";import p from"./style/index.js";import{isSuffixElement as V}from"./Suffix.js";const w=e=>I(e)&&e.type===l,J=M({prefix:{isMatched:S},suffix:{isMatched:V}}),l=k((e,d)=>{const a=j(),{className:f,children:u,variant:t=a.variant,size:i=a.size,block:c=a.block,disabled:s=a.disabled,type:v="text",value:x,defaultValue:b="",onChange:o,...h}=e,{slots:n}=J(u),[g,z]=E(x,b),C=r=>{z(r.target.value),o?.(r.target.value,r)};return m(P,{value:{size:i,disabled:s,variant:t},children:y("span",{className:N(p.inputWrapper({variant:t,size:i,block:c,disabled:s}),f),"data-disabled":s||void 0,children:[n.prefix.el,m("input",{ref:d,type:v,value:g,onChange:C,disabled:s,className:p.input({size:i,variant:t}),...h}),n.suffix.el]})})});l.displayName="Input";export{l as default,w as isInputElement};

package/dist/input/Prefix.js

@@ -1 +1 @@
-import{jsx as o}from"react/jsx-runtime";import{cnMerge as f}from"@nild/shared";import{forwardRef as n,isValidElement as p}from"react";import{useInputContext as l}from"./contexts/index.js";import c from"./style/index.js";const d=e=>p(e)&&e.type===s,s=n((e,r)=>{const{size:a}=l(),{className:i,children:t,...m}=e;return o("span",{...m,className:f(c.prefix({size:a}),i),ref:r,children:t})});s.displayName="Input.Prefix";export{s as default,d as isPrefixElement};
+import{jsx as n}from"react/jsx-runtime";import{cnMerge as f}from"@nild/shared";import{forwardRef as p,isValidElement as l}from"react";import{useInputContext as c}from"./contexts/index.js";import x from"./style/index.js";const d=e=>l(e)&&e.type===r,r=p((e,a)=>{const{size:s,variant:i}=c(),{className:t,children:m,...o}=e;return n("span",{...o,className:f(x.prefix({size:s,variant:i}),t),ref:a,children:m})});r.displayName="Input.Prefix";export{r as default,d as isPrefixElement};

package/dist/input/Suffix.js

@@ -1 +1 @@
-import{jsx as m}from"react/jsx-runtime";import{cnMerge as o}from"@nild/shared";import{forwardRef as n,isValidElement as p}from"react";import{useInputContext as l}from"./contexts/index.js";import u from"./style/index.js";const c=s=>p(s)&&s.type===e,e=n((s,a)=>{const{size:r}=l(),{className:t,children:i,...f}=s;return m("span",{...f,className:o(u.suffix({size:r}),t),ref:a,children:i})});e.displayName="Input.Suffix";export{e as default,c as isSuffixElement};
+import{jsx as o}from"react/jsx-runtime";import{cnMerge as n}from"@nild/shared";import{forwardRef as p,isValidElement as l}from"react";import{useInputContext as u}from"./contexts/index.js";import c from"./style/index.js";const d=s=>l(s)&&s.type===a,a=p((s,e)=>{const{size:r,variant:t}=u(),{className:i,children:f,...m}=s;return o("span",{...m,className:n(c.suffix({size:r,variant:t}),i),ref:e,children:f})});a.displayName="Input.Suffix";export{a as default,d as isSuffixElement};

package/dist/input/style/index.d.ts

@@ -6,9 +6,9 @@ declare const _default: {
         appended?: boolean;
     }) | undefined) => string;
     inputWrapper: (props?: InputProps | undefined) => string;
-    input: (props?: InputProps | undefined) => string;
-    prefix: (props?: InputProps | undefined) => string;
-    suffix: (props?: InputProps | undefined) => string;
+    input: (props?: Pick<InputProps, "variant" | "size"> | undefined) => string;
+    prefix: (props?: Pick<InputProps, "variant" | "size"> | undefined) => string;
+    suffix: (props?: Pick<InputProps, "variant" | "size"> | undefined) => string;
     prepend: (props?: (Pick<InputProps, "variant" | "size"> & {
         type: "string" | "element";
     }) | undefined) => string;

package/dist/input/style/index.js

@@ -1 +1 @@
-import{cva as e}from"@nild/shared";import t from"../../_shared/style/index.js";const n=e(["nd-input-composite","inline-flex","items-stretch",t.disabled()],{variants:{block:{true:["flex","w-full"],false:""}}}),r=e(["flex-auto"],{variants:{prepended:{true:["rounded-l-none"],false:""},appended:{true:["rounded-r-none"],false:""}},compoundVariants:[{variant:"outlined",appended:!0,className:["mr-[-1px]","hover:z-1"]}]}),a=e(["nd-input-wrapper","group",["inline-flex","items-center","box-border","font-nd","transition-colors","overflow-hidden"],["border","enabled:focus-within:border-brand","enabled:focus-within:z-1"],"enabled:focus-visible-within:ring-focused",t.disabled()],{variants:{variant:{outlined:["bg-transparent","border-main","enabled:hover:border-brand-hover"],filled:["bg-muted","border-subtle","enabled:[&:hover:not(:focus-within)]:bg-muted-hover","enabled:[&:hover:not(:focus-within)]:border-muted"]},size:{small:["h-6","text-sm","rounded-sm"],medium:["h-8","text-md","rounded-md"],large:["h-10","text-lg","rounded-md"]},block:{true:["flex","w-full"],false:""}}}),i=e(["nd-input","flex-auto","h-full","bg-transparent","border-none","outline-none","p-0","m-0","text-main","placeholder:text-subtle","disabled:cursor-not-allowed","[&::-ms-reveal]:hidden","[&::-ms-clear]:hidden","[&::-webkit-inner-spin-button]:appearance-none","[&::-webkit-outer-spin-button]:appearance-none","[&::-webkit-inner-spin-button]:m-0","[&::-webkit-outer-spin-button]:m-0","[-moz-appearance:textfield]"],{variants:{size:{small:["px-2","text-sm"],medium:["px-3","text-md"],large:["px-4","text-lg"]}}}),s=e(["nd-input-prefix","shrink-0","h-full","inline-flex","items-center","text-muted"],{variants:{size:{small:["pl-2","text-sm"],medium:["pl-3","text-md"],large:["pl-4","text-lg"]}}}),l=e(["nd-input-suffix","shrink-0","h-full","inline-flex","items-center","text-muted"],{variants:{size:{small:["pr-2","text-sm"],medium:["pr-3","text-md"],large:["pr-4","text-lg"]}}}),d=e(["shrink-0"],{variants:{variant:{outlined:["mr-[-1px]","hover:z-1","focus:z-1","focus-within:z-1"],filled:[]},type:{string:["inline-flex","items-center","border"],element:["rounded-r-none"]},size:{small:["h-6","text-sm","rounded-l-sm"],medium:["h-8","text-md","rounded-l-md"],large:["h-10","text-lg","rounded-l-md"]}},compoundVariants:[{type:"string",variant:"outlined",className:["bg-muted","border-main","text-muted"]},{type:"string",variant:"filled",className:["bg-brand","border-transparent","text-brand-contrast"]},{type:"string",size:"small",className:["px-2"]},{type:"string",size:"medium",className:["px-3"]},{type:"string",size:"large",className:["px-4"]}]}),o=e(["shrink-0"],{variants:{type:{string:["inline-flex","items-center","border"],element:["rounded-l-none","h-auto"]},size:{small:["h-6","text-sm","rounded-r-sm"],medium:["h-8","text-md","rounded-r-md"],large:["h-10","text-lg","rounded-r-md"]}},compoundVariants:[{type:"string",variant:"outlined",className:["bg-muted","border-main","text-muted"]},{type:"string",variant:"filled",className:["bg-brand","border-transparent","text-brand-contrast"]},{type:"string",size:"small",className:["px-2"]},{type:"string",size:"medium",className:["px-3"]},{type:"string",size:"large",className:["px-4"]}]}),m=e(["group-focus-within:text-brand"]),p=e(["gap-2","items-center"],{variants:{block:{true:["flex","w-full"],false:["inline-flex"]}}}),u=e(["flex-auto","min-w-0","text-center"],{compoundVariants:[{size:"small",block:!1,className:["w-6"]},{size:"medium",block:!1,className:["w-8"]},{size:"large",block:!1,className:["w-10"]}]}),x={composite:n,compositedInputWrapper:r,inputWrapper:a,input:i,prefix:s,suffix:l,prepend:d,append:o,searchIcon:m,otpWrapper:p,otpInputWrapper:u};export{x as default};
+import{cva as e}from"@nild/shared";import t from"../../_shared/style/index.js";const a=e(["nd-input-composite","inline-flex","items-stretch",t.disabled()],{variants:{block:{true:["flex","w-full"],false:""}}}),n=e(["flex-auto"],{variants:{prepended:{true:["rounded-l-none"],false:""},appended:{true:["rounded-r-none"],false:""}},compoundVariants:[{variant:"outlined",appended:!0,className:["mr-[-1px]","hover:z-1"]}]}),i=e(["nd-input-wrapper","group",["inline-flex","items-center","box-border","font-nd","transition-colors","overflow-hidden"],["border","enabled:focus-within:z-1"],t.disabled()],{variants:{variant:{outlined:["bg-transparent","border-main","enabled:hover:border-brand-hover","enabled:focus-within:border-brand","enabled:focus-visible-within:ring-focused"],filled:["bg-muted","border-subtle","enabled:[&:hover:not(:focus-within)]:bg-muted-hover","enabled:[&:hover:not(:focus-within)]:border-muted","enabled:focus-within:border-brand","enabled:focus-visible-within:ring-focused"],underlined:["bg-transparent","border-transparent","border-b-main","enabled:[&:hover:not(:focus-within)]:border-b-brand-hover","enabled:focus-within:border-b-brand"]},size:{small:["h-6","text-sm"],medium:["h-8","text-md"],large:["h-10","text-lg"]},block:{true:["flex","w-full"],false:""}},compoundVariants:[{variant:["outlined","filled"],size:"small",className:["rounded-sm"]},{variant:["outlined","filled"],size:["medium","large"],className:["rounded-md"]}]}),l=e(["nd-input","flex-auto","h-full","bg-transparent","border-none","outline-none","p-0","m-0","text-main","placeholder:text-subtle","disabled:cursor-not-allowed","[&::-ms-reveal]:hidden","[&::-ms-clear]:hidden","[&::-webkit-inner-spin-button]:appearance-none","[&::-webkit-outer-spin-button]:appearance-none","[&::-webkit-inner-spin-button]:m-0","[&::-webkit-outer-spin-button]:m-0","[-moz-appearance:textfield]"],{variants:{size:{small:["text-sm"],medium:["text-md"],large:["text-lg"]}},compoundVariants:[{variant:["outlined","filled"],size:"small",className:["px-2"]},{variant:["outlined","filled"],size:"medium",className:["px-3"]},{variant:["outlined","filled"],size:"large",className:["px-4"]}]}),r=e(["nd-input-prefix","shrink-0","h-full","inline-flex","items-center","text-muted"],{variants:{size:{small:["text-sm"],medium:["text-md"],large:["text-lg"]}},compoundVariants:[{variant:["outlined","filled"],size:"small",className:["pl-2"]},{variant:["outlined","filled"],size:"medium",className:["pl-3"]},{variant:["outlined","filled"],size:"large",className:["pl-4"]}]}),s=e(["nd-input-suffix","shrink-0","h-full","inline-flex","items-center","text-muted"],{variants:{size:{small:["text-sm"],medium:["text-md"],large:["text-lg"]}},compoundVariants:[{variant:["outlined","filled"],size:"small",className:["pr-2"]},{variant:["outlined","filled"],size:"medium",className:["pr-3"]},{variant:["outlined","filled"],size:"large",className:["pr-4"]}]}),d=e(["shrink-0"],{variants:{variant:{outlined:["mr-[-1px]","hover:z-1","focus:z-1","focus-within:z-1"],filled:[],underlined:[]},type:{string:["inline-flex","items-center","border"],element:[]},size:{small:["h-6","text-sm"],medium:["h-8","text-md"],large:["h-10","text-lg"]}},compoundVariants:[{type:"element",variant:["outlined","filled"],className:["rounded-r-none"]},{type:["string","element"],variant:["outlined","filled"],size:"small",className:["rounded-l-sm"]},{type:["string","element"],variant:["outlined","filled"],size:["medium","large"],className:["rounded-l-md"]},{type:"string",variant:"outlined",className:["bg-muted","border-main","text-muted"]},{type:"string",variant:"filled",className:["bg-brand","border-transparent","text-brand-contrast"]},{type:"string",variant:"underlined",className:["bg-transparent","border-transparent","border-b-main","text-muted"]},{type:"string",variant:["outlined","filled"],size:"small",className:["px-2"]},{type:"string",variant:["outlined","filled"],size:"medium",className:["px-3"]},{type:"string",variant:["outlined","filled"],size:"large",className:["px-4"]}]}),o=e(["shrink-0"],{variants:{variant:{outlined:[],filled:[],underlined:[]},type:{string:["inline-flex","items-center","border"],element:["h-auto"]},size:{small:["h-6","text-sm"],medium:["h-8","text-md"],large:["h-10","text-lg"]}},compoundVariants:[{type:"element",variant:["outlined","filled"],className:["rounded-l-none"]},{type:["string","element"],variant:["outlined","filled"],size:"small",className:["rounded-r-sm"]},{type:["string","element"],variant:["outlined","filled"],size:["medium","large"],className:["rounded-r-md"]},{type:"string",variant:"outlined",className:["bg-muted","border-main","text-muted"]},{type:"string",variant:"filled",className:["bg-brand","border-transparent","text-brand-contrast"]},{type:"string",variant:"underlined",className:["bg-transparent","border-transparent","border-b-main","text-muted"]},{type:"string",variant:["outlined","filled"],size:"small",className:["px-2"]},{type:"string",variant:["outlined","filled"],size:"medium",className:["px-3"]},{type:"string",variant:["outlined","filled"],size:"large",className:["px-4"]}]}),m=e(["group-focus-within:text-brand"]),u=e(["gap-2","items-center"],{variants:{block:{true:["flex","w-full"],false:["inline-flex"]}}}),p=e(["flex-auto","min-w-0","text-center"],{compoundVariants:[{size:"small",block:!1,className:["w-6"]},{size:"medium",block:!1,className:["w-8"]},{size:"large",block:!1,className:["w-10"]}]}),c={composite:a,compositedInputWrapper:n,inputWrapper:i,input:l,prefix:r,suffix:s,prepend:d,append:o,searchIcon:m,otpWrapper:u,otpInputWrapper:p};export{c as default};

package/dist/select/Select.js

@@ -1 +1 @@
-import{jsxs as J,jsx as m}from"react/jsx-runtime";import{useControllableState as de,useIsomorphicLayoutEffect as pe}from"@nild/hooks";import{Icon as ue}from"@nild/icons";import me from"@nild/icons/Down";import{forwardRefWithGenerics as be,mergeRefs as Q,cnMerge as fe}from"@nild/shared";import{useId as he,useRef as K,useState as ge,useMemo as ve,cloneElement as ye}from"react";import D from"../_shared/utils/merge-handlers/index.js";import xe from"../_shared/utils/register-slots/index.js";import L from"../popup/index.js";import{useSelectNavigation as Ie}from"./hooks/useSelectNavigation.js";import{isOptionElement as Oe}from"./Option.js";import N from"./style/index.js";const je=xe({option:{isMatched:t=>Oe(t),multiple:!0}}),g=t=>Array.isArray(t)?t:[],we=(t,l,s)=>{if(!t)return Object.is(l,s);const n=g(l),i=g(s);return n.length===i.length&&n.every((r,c)=>Object.is(r,i[c]))},ke=(t,l)=>t.some(s=>Object.is(s,l))?t.filter(s=>!Object.is(s,l)):t.concat(l),De=(t,l,s)=>{const{slots:n}=je(t),i=n.option.el,r=[],c=[],v=[],y=l?g(s):[];let x="",d=!0,b=-1;return i.forEach((p,f)=>{var I;const o=p.props,O=l?y.some(j=>Object.is(j,o.value)):Object.is(o.value,s);r.push({key:((I=p.key)==null?void 0:I.toString())??`${n.option.seq[f]}`,selected:O,element:p,props:o}),o.disabled||c.push(f),O&&(d=!1,!o.disabled&&b<0&&(b=f),l?v.push(o.label):x=o.label)}),{options:r,enabledIndices:c,selectedIndex:b,selectionValues:y,selectionText:l?v.join(", "):x,selectionEmpty:d}},U=be((t,l)=>{var s;const{className:n,children:i,"aria-label":r,"aria-labelledby":c,onKeyDown:v,placeholder:y,variant:x="outlined",size:d="medium",block:b=!1,disabled:p=!1,placement:f="bottom-start",offset:I=8,multiple:o=!1,value:O,defaultValue:j,onChange:w,...X}=t,Y=he(),E=K(null),A=K(null),V=K([]),[S,C]=ge(!1),[M,Z]=de(O,o?g(j):j),{options:R,enabledIndices:W,selectedIndex:_,selectionValues:ee,selectionText:oe,selectionEmpty:$}=ve(()=>De(i,o,M),[i,o,M]),h=!p&&W.length>0,u=h&&S,B=()=>h&&C(!0),z=()=>C(!1),q=e=>{we(o,M,e)||(o?w?.(g(e)):w?.(e),Z(()=>e))},G=e=>{const a=R[e];if(!(!a||a.props.disabled)){if(o)return q(ke(ee,a.props.value));q(a.props.value),z(),ie()}},{activeIndex:k,setActiveIndex:te,focusListbox:le,handleTriggerKeyDown:se,handleListboxKeyDown:ae,handleListboxBlur:ne,focusTrigger:ie}=Ie({open:u,selectedIndex:_,enabledIndices:W,triggerRef:E,listboxRef:A,optionRefs:V,onOpen:B,onClose:z,onSelect:G});pe(()=>{!h&&S&&C(!1)},[h,S]);const P=(e,a)=>e.props.id??`${Y}-option-${a}`,F=k>=0?R[k]:void 0,re=u&&F?P(F,k):void 0,ce=(e,a)=>{const H=e.element;return ye(H,{key:e.key,id:P(e,a),size:d,active:k===a,className:e.props.className,onClick:D(e.props.onClick,()=>G(a)),onMouseDown:D(e.props.onMouseDown,T=>T.preventDefault()),onMouseEnter:D(e.props.onMouseEnter,()=>{e.props.disabled||te(a)}),ref:Q(H.ref,T=>{V.current[a]=T}),selected:e.selected})};return J(L,{action:"click",arrowed:!1,disabled:!h,offset:I,open:u,placement:f,onClose:z,onOpen:B,children:[m(L.Trigger,{children:J("button",{...X,"aria-expanded":u,"aria-haspopup":"listbox","aria-label":r,"aria-labelledby":c,className:fe(N.trigger({variant:x,size:d,block:b,disabled:p,open:u}),n),disabled:p,onKeyDown:D(v,se),ref:Q(l,E),type:"button",children:[m("span",{className:N.triggerContent({size:d,placeholder:$}),children:$?y??"":oe}),m("span",{"aria-hidden":"true",className:N.triggerIcon({size:d,open:u}),children:m(ue,{component:me})})]})}),m(L.Portal,{children:m("div",{"aria-activedescendant":re,"aria-label":r,"aria-labelledby":c,"aria-multiselectable":o||void 0,className:N.listbox(),onBlur:ne,onKeyDown:ae,ref:e=>{A.current=e,e&&u&&le()},role:"listbox",style:{minWidth:(s=E.current)==null?void 0:s.offsetWidth},tabIndex:-1,children:R.map(ce)})})]})});U.displayName="Select";export{U as default};
+import{jsxs as J,jsx as b}from"react/jsx-runtime";import{useControllableState as de,useIsomorphicLayoutEffect as pe}from"@nild/hooks";import{Icon as me}from"@nild/icons";import ue from"@nild/icons/Down";import{forwardRefWithGenerics as be,mergeRefs as Q,cnMerge as fe}from"@nild/shared";import{useId as he,useRef as K,useState as ve,useMemo as ye,cloneElement as ge}from"react";import D from"../_shared/utils/merge-handlers/index.js";import xe from"../_shared/utils/register-slots/index.js";import L from"../popup/index.js";import{useSelectNavigation as Ie}from"./hooks/useSelectNavigation.js";import{isOptionElement as je}from"./Option.js";import N from"./style/index.js";const we=xe({option:{isMatched:t=>je(t),multiple:!0}}),y=t=>Array.isArray(t)?t:[],Oe=(t,l,s)=>{if(!t)return Object.is(l,s);const n=y(l),i=y(s);return n.length===i.length&&n.every((r,c)=>Object.is(r,i[c]))},ke=(t,l)=>t.some(s=>Object.is(s,l))?t.filter(s=>!Object.is(s,l)):t.concat(l),De=(t,l,s)=>{const{slots:n}=we(t),i=n.option.el,r=[],c=[],g=[],x=l?y(s):[];let u="",d=!0,f=-1;return i.forEach((p,h)=>{var I;const o=p.props,j=l?x.some(w=>Object.is(w,o.value)):Object.is(o.value,s);r.push({key:((I=p.key)==null?void 0:I.toString())??`${n.option.seq[h]}`,selected:j,element:p,props:o}),o.disabled||c.push(h),j&&(d=!1,!o.disabled&&f<0&&(f=h),l?g.push(o.label):u=o.label)}),{options:r,enabledIndices:c,selectedIndex:f,selectionValues:x,selectionText:l?g.join(", "):u,selectionEmpty:d}},U=be((t,l)=>{var s;const{className:n,children:i,"aria-label":r,"aria-labelledby":c,onKeyDown:g,placeholder:x,variant:u="outlined",size:d="medium",block:f=!1,disabled:p=!1,placement:h="bottom-start",offset:I=8,multiple:o=!1,value:j,defaultValue:w,onChange:O,...X}=t,Y=he(),E=K(null),A=K(null),V=K([]),[S,C]=ve(!1),[M,Z]=de(j,o?y(w):w),{options:R,enabledIndices:W,selectedIndex:_,selectionValues:ee,selectionText:oe,selectionEmpty:$}=ye(()=>De(i,o,M),[i,o,M]),v=!p&&W.length>0,m=v&&S,B=()=>v&&C(!0),z=()=>C(!1),q=e=>{Oe(o,M,e)||(o?O?.(y(e)):O?.(e),Z(()=>e))},G=e=>{const a=R[e];if(!(!a||a.props.disabled)){if(o)return q(ke(ee,a.props.value));q(a.props.value),z(),ie()}},{activeIndex:k,setActiveIndex:te,focusListbox:le,handleTriggerKeyDown:se,handleListboxKeyDown:ae,handleListboxBlur:ne,focusTrigger:ie}=Ie({open:m,selectedIndex:_,enabledIndices:W,triggerRef:E,listboxRef:A,optionRefs:V,onOpen:B,onClose:z,onSelect:G});pe(()=>{!v&&S&&C(!1)},[v,S]);const P=(e,a)=>e.props.id??`${Y}-option-${a}`,F=k>=0?R[k]:void 0,re=m&&F?P(F,k):void 0,ce=(e,a)=>{const H=e.element;return ge(H,{key:e.key,id:P(e,a),size:d,active:k===a,className:e.props.className,onClick:D(e.props.onClick,()=>G(a)),onMouseDown:D(e.props.onMouseDown,T=>T.preventDefault()),onMouseEnter:D(e.props.onMouseEnter,()=>{e.props.disabled||te(a)}),ref:Q(H.ref,T=>{V.current[a]=T}),selected:e.selected})};return J(L,{action:"click",arrowed:!1,disabled:!v,offset:I,open:m,placement:h,onClose:z,onOpen:B,children:[b(L.Trigger,{children:J("button",{...X,"aria-expanded":m,"aria-haspopup":"listbox","aria-label":r,"aria-labelledby":c,className:fe(N.trigger({variant:u,size:d,block:f,disabled:p,open:m}),n),disabled:p,onKeyDown:D(g,se),ref:Q(l,E),type:"button",children:[b("span",{className:N.triggerContent({variant:u,size:d,placeholder:$}),children:$?x??"":oe}),b("span",{"aria-hidden":"true",className:N.triggerIcon({variant:u,size:d,open:m}),children:b(me,{component:ue})})]})}),b(L.Portal,{children:b("div",{"aria-activedescendant":re,"aria-label":r,"aria-labelledby":c,"aria-multiselectable":o||void 0,className:N.listbox(),onBlur:ne,onKeyDown:ae,ref:e=>{A.current=e,e&&m&&le()},role:"listbox",style:{minWidth:(s=E.current)==null?void 0:s.offsetWidth},tabIndex:-1,children:R.map(ce)})})]})});U.displayName="Select";export{U as default};

package/dist/select/style/index.d.ts

@@ -8,10 +8,12 @@ declare const _default: {
         open?: boolean;
     } | undefined) => string;
     triggerContent: (props?: {
+        variant?: SelectVariant;
         size?: SelectSize;
         placeholder?: boolean;
     } | undefined) => string;
     triggerIcon: (props?: {
+        variant?: SelectVariant;
         size?: SelectSize;
         open?: boolean;
     } | undefined) => string;

package/dist/select/style/index.js

@@ -1 +1 @@
-import{cva as e}from"@nild/shared";import t from"../../_shared/style/index.js";const n=e(["nd-select-trigger","group",["inline-flex","items-center"],"box-border","font-nd","overflow-hidden","text-left","appearance-none","border","transition-colors","outline-none",t.disabled()],{variants:{variant:{outlined:["bg-transparent","border-main","enabled:hover:border-brand-hover"],filled:["bg-muted","border-subtle"]},size:{small:["h-6","text-sm","rounded-sm"],medium:["h-8","text-md","rounded-md"],large:["h-10","text-lg","rounded-md"]},block:{true:["flex","w-full"],false:""},disabled:{true:"",false:"cursor-pointer"},open:{true:["border-brand","z-1","ring-focused"],false:""}},compoundVariants:[{variant:"filled",disabled:!1,open:!1,className:["enabled:hover:bg-muted-hover","enabled:hover:border-muted"]},{variant:"filled",open:!0,className:["bg-muted-hover"]}]}),r=e(["nd-select-trigger-content","min-w-0","flex-auto","truncate"],{variants:{size:{small:["pl-2","text-sm"],medium:["pl-3","text-md"],large:["pl-4","text-lg"]},placeholder:{true:["text-subtle"],false:["text-main"]}}}),l=e(["nd-select-trigger-icon","shrink-0","inline-flex","items-center","text-muted","transition-transform"],{variants:{size:{small:["px-2","text-sm"],medium:["px-3","text-md"],large:["px-4","text-lg"]},open:{true:["rotate-180"],false:""}}}),o=e(["nd-select-listbox","max-h-60","overflow-auto","overscroll-contain","px-1","py-1","outline-none"]),i=e(["nd-select-option","w-full","flex","items-center","gap-2","rounded-sm","text-left","text-main","select-none","transition-colors",t.disabled()],{variants:{size:{small:["min-h-8","px-2","text-sm"],medium:["min-h-9","px-3","text-md"],large:["min-h-10","px-4","text-lg"]},disabled:{true:["text-subtle"],false:["cursor-pointer"]},active:{true:["bg-surface-muted"],false:""}}}),a=e(["nd-select-option-content","min-w-0","flex-auto"]),s=e(["nd-select-option-label","block","truncate"]),d=e(["nd-select-option-indicator","shrink-0","inline-flex","items-center","justify-center"],{variants:{size:{small:["size-3.5","text-sm"],medium:["size-4","text-md"],large:["size-4.5","text-lg"]}}}),m={trigger:n,triggerContent:r,triggerIcon:l,listbox:o,option:i,optionContent:a,optionLabel:s,optionIndicator:d};export{m as default};
+import{cva as e}from"@nild/shared";import t from"../../_shared/style/index.js";const l=e(["nd-select-trigger","group",["inline-flex","items-center"],"box-border","font-nd","overflow-hidden","text-left","appearance-none","border","transition-colors","outline-none",t.disabled()],{variants:{variant:{outlined:["bg-transparent","border-main","enabled:hover:border-brand-hover"],filled:["bg-muted","border-subtle"],underlined:["bg-transparent","border-transparent","border-b-main","enabled:hover:border-b-brand-hover","enabled:focus-visible:border-b-brand"]},size:{small:["h-6","text-sm"],medium:["h-8","text-md"],large:["h-10","text-lg"]},block:{true:["flex","w-full"],false:""},disabled:{true:"",false:"cursor-pointer"},open:{true:["z-1"],false:""}},compoundVariants:[{variant:["outlined","filled"],size:"small",className:["rounded-sm"]},{variant:["outlined","filled"],size:["medium","large"],className:["rounded-md"]},{variant:["outlined","filled"],open:!0,className:["border-brand","ring-focused"]},{variant:"underlined",open:!0,className:["border-b-brand"]},{variant:"filled",disabled:!1,open:!1,className:["enabled:hover:bg-muted-hover","enabled:hover:border-muted"]},{variant:"filled",open:!0,className:["bg-muted-hover"]}]}),n=e(["nd-select-trigger-content","min-w-0","flex-auto","truncate"],{variants:{size:{small:["text-sm"],medium:["text-md"],large:["text-lg"]},placeholder:{true:["text-subtle"],false:["text-main"]}},compoundVariants:[{variant:["outlined","filled"],size:"small",className:["pl-2"]},{variant:["outlined","filled"],size:"medium",className:["pl-3"]},{variant:["outlined","filled"],size:"large",className:["pl-4"]}]}),a=e(["nd-select-trigger-icon","shrink-0","inline-flex","items-center","text-muted","transition-transform"],{variants:{size:{small:["text-sm"],medium:["text-md"],large:["text-lg"]},open:{true:["rotate-180"],false:""}},compoundVariants:[{variant:["outlined","filled"],size:"small",className:["px-2"]},{variant:["outlined","filled"],size:"medium",className:["px-3"]},{variant:["outlined","filled"],size:"large",className:["px-4"]}]}),r=e(["nd-select-listbox","max-h-60","overflow-auto","overscroll-contain","px-1","py-1","outline-none"]),i=e(["nd-select-option","w-full","flex","items-center","gap-2","rounded-sm","text-left","text-main","select-none","transition-colors",t.disabled()],{variants:{size:{small:["min-h-8","px-2","text-sm"],medium:["min-h-9","px-3","text-md"],large:["min-h-10","px-4","text-lg"]},disabled:{true:["text-subtle"],false:["cursor-pointer"]},active:{true:["bg-surface-muted"],false:""}}}),s=e(["nd-select-option-content","min-w-0","flex-auto"]),o=e(["nd-select-option-label","block","truncate"]),d=e(["nd-select-option-indicator","shrink-0","inline-flex","items-center","justify-center"],{variants:{size:{small:["size-3.5","text-sm"],medium:["size-4","text-md"],large:["size-4.5","text-lg"]}}}),m={trigger:l,triggerContent:n,triggerIcon:a,listbox:r,option:i,optionContent:s,optionLabel:o,optionIndicator:d};export{m as default};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@nild/components",
   "private": false,
-  "version": "0.0.47",
+  "version": "0.0.48",
   "type": "module",
   "module": "./dist/index.js",
   "exports": {
@@ -31,9 +31,9 @@
   "peerDependencies": {
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "@nild/hooks": "^0.0.21",
+    "@nild/icons": "^0.0.21",
     "@nild/shared": "^0.0.18",
-    "@nild/icons": "^0.0.21"
+    "@nild/hooks": "^0.0.21"
   },
   "scripts": {
     "build": "vite build --mode PROD",