liquidify-react
Version:
🚀 Production-ready React component library inspired by Apple's new design language post-WWDC 2025. Built with Panda CSS and React, using Bun as runtime (npm compatible). Helps developers maintain design consistency for Apple platform apps. 47+ components
3 lines (2 loc) • 990 B
JavaScript
;const t=require("react/jsx-runtime"),e=require("@ark-ui/react"),R=require("react"),r=require("./create-recipe-D4OItzir.cjs"),s=r.createRecipe("pin-input",{size:"md"},[]),c={size:["sm","md","lg"]},o=Object.keys(c),u=Object.assign(r.memo(s.recipeFn),{__recipe__:!0,__name__:"pinInput",__getCompoundVariantCss__:s.__getCompoundVariantCss__,raw:n=>n,variantKeys:o,variantMap:c,merge(n){return r.mergeRecipes(this,n)},splitVariantProps(n){return r.splitProps(n,o)},getVariantProps:s.getVariantProps}),_=R.forwardRef(({label:n,length:p=4,size:m,children:P,className:I,...d},l)=>{const[V,g]=u.splitVariantProps({size:m}),j=Array.from({length:p},(a,i)=>`input-${i}-of-${p}`);return t.jsxs(e.PinInput.Root,{ref:l,className:I,...g,...d,children:[n&&t.jsx(e.PinInput.Label,{children:n}),t.jsx(e.PinInput.Control,{children:j.map((a,i)=>t.jsx(e.PinInput.Input,{index:i,className:u(V)},a))}),P]})});_.displayName="PinInput";exports.PinInput=_;
//# sourceMappingURL=pinInput-C5b2rCVA.cjs.map