@cocso-ui/react 0.0.1-beta.27 → 0.0.1-beta.28

package/lib/components/OneTimePasswordField/OneTimePasswordField.d.ts

@@ -0,0 +1,4 @@
+import * as OneTimePasswordFieldPrimitive from '@radix-ui/react-one-time-password-field';
+export declare const OneTimePasswordField: import("react").ForwardRefExoticComponent<Omit<Omit<OneTimePasswordFieldPrimitive.OneTimePasswordFieldProps, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<never>> & {
+    Input: import("react").ForwardRefExoticComponent<Omit<Omit<OneTimePasswordFieldPrimitive.OneTimePasswordFieldInputProps, "ref"> & import("react").RefAttributes<HTMLInputElement>, "ref"> & import("react").RefAttributes<never>>;
+};

package/lib/components/OneTimePasswordField/index.d.ts

@@ -0,0 +1 @@
+export * from './OneTimePasswordField';

package/lib/index.cjs

@@ -1 +1 @@
-"use strict";var mo=Object.create;var w=Object.defineProperty;var lo=Object.getOwnPropertyDescriptor;var po=Object.getOwnPropertyNames;var fo=Object.getPrototypeOf,go=Object.prototype.hasOwnProperty;var ho=(o,e)=>{for(var t in e)w(o,t,{get:e[t],enumerable:!0})},O=(o,e,t,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of po(e))!go.call(o,r)&&r!==t&&w(o,r,{get:()=>e[r],enumerable:!(i=lo(e,r))||i.enumerable});return o};var C=(o,e,t)=>(t=o!=null?mo(fo(o)):{},O(e||!o||!o.__esModule?w(t,"default",{value:o,enumerable:!0}):t,o)),Co=o=>O(w({},"__esModule",{value:!0}),o);var jo={};ho(jo,{Accordion:()=>Po,Body:()=>L,Button:()=>To,Checkbox:()=>zo,Display:()=>Mo,Heading:()=>E,Label:()=>H,Link:()=>Fo,Modal:()=>Oo,Spinner:()=>B});module.exports=Co(jo);var y=C(require("@radix-ui/react-accordion"),1),T=require("react");var uo=(...o)=>o.filter(Boolean).join(" ").trim(),n=(o,e,t=[],...i)=>{let r=Object.entries(e).filter(([,s])=>s!==!1&&s!==null&&s!==void 0).map(([s,c])=>`${o}--${s}_${c}`).join(" "),a=t.filter(s=>Object.entries(s).every(([c,p])=>e[c]===p)).map(s=>{let c=Object.entries(s).map(([p,m])=>`${p}_${m}`).join("-");return`${o}--${c}`}).join(" ");return uo(o,r,a,...i)};var D=require("@radix-ui/react-slot"),v=require("react/jsx-runtime"),xo=(0,T.forwardRef)(({className:o,...e},t)=>{let i=n("cocso-accordion-item",{},[],o);return(0,v.jsx)(y.Item,{ref:t,className:i,...e})}),yo=(0,T.forwardRef)(({className:o,children:e,chevron:t=!0,...i},r)=>{let a=n("cocso-accordion-trigger",{},[],o);return(0,v.jsx)(y.Trigger,{ref:r,className:a,...i,children:(0,v.jsxs)(D.Slottable,{children:[e,t&&(0,v.jsx)("div",{className:"cocso-accordion-chevron",children:(0,v.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:(0,v.jsx)("path",{d:"m6 9 6 6 6-6"})})})]})})}),vo=(0,T.forwardRef)(({className:o,...e},t)=>{let i=n("cocso-accordion-content",{},[],o);return(0,v.jsx)(y.Content,{ref:t,className:i,...e})}),Po=Object.assign(y.Root,{Item:xo,Header:y.Header,Trigger:yo,Content:vo});var j=C(require("react"),1),I=require("@radix-ui/react-slot");function f(o){if(o)return o.includes(".")?`var(--color-${o.replace(/\./g,"-")})`:o}var z={thin:"100",extralight:"200",light:"300",normal:"400",medium:"500",semibold:"600",bold:"700",extrabold:"800",black:"900"};function g(o){if(o)return o in z?z[o]:o}var $=require("react/jsx-runtime"),bo=j.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:i="normal",className:r,style:a,...s},c)=>{let m=n("cocso-body",{size:e},[],r);return(0,$.jsx)(o?I.Slot:"p",{ref:c,className:m,style:{"--cocso-body-color":f(t),"--cocso-body-weight":g(i),...a},...s})}),L=Object.assign(bo,{displayName:"Body"});var k=C(require("react"),1),V=require("@radix-ui/react-slot");var _=C(require("react"),1);var R=require("react/jsx-runtime"),Ro=["div"],ko=_.forwardRef(({as:o=Ro[0],size:e="md",color:t="palette.primary-500",bg:i="palette.gray-200",className:r,style:a,...s},c)=>{let p=o,h=n("cocso-spinner",{size:e},[],r);return(0,R.jsx)(p,{ref:c,className:h,style:{"--cocso-spinner-bg":f(i),"--cocso-spinner-color":f(t),...a},...s,children:(0,R.jsxs)("svg",{viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[(0,R.jsx)("circle",{className:"opacity-25",cx:"12",cy:"12",r:"9",stroke:"var(--cocso-spinner-bg, currentColor)",strokeWidth:"3"}),(0,R.jsx)("path",{className:"opacity-75",fill:"var(--cocso-spinner-color, currentColor)",d:"M12 2a10 10 0 0110 10 10 10 0 01-5 8.66l-1-1.73a8 8 0 004-6.93 8 8 0 00-8-8V2z"})]})})}),B=Object.assign(ko,{displayName:"Spinner"});var F=require("react/jsx-runtime"),No=o=>({"2xs":"xs",xs:"xs",sm:"xs",md:"sm",lg:"md",xl:"md"})[o],wo=k.forwardRef(({asChild:o=!1,variant:e="primary",size:t="md",disabled:i=!1,loading:r=!1,color:a,weight:s="normal",className:c,style:p,children:m,onClick:h,onKeyDown:N,...S},A)=>{let x=i||r,b=k.useCallback(P=>{if(x){P.preventDefault();return}h?.(P)},[x,h]),io=k.useCallback(P=>{(P.key==="Enter"||P.key===" ")&&(P.preventDefault(),x||P.currentTarget.click()),N?.(P)},[x,N]),so={variant:e,size:t,loading:r,disabled:x},no=[...i?[{variant:e,disabled:i}]:[],...r?[{variant:e,loading:r}]:[]],ao=n("cocso-button",so,no,c),co={"--cocso-button-color":f(a),"--cocso-button-weight":g(s),...p};return(0,F.jsx)(o?V.Slot:"button",{ref:A,className:ao,onClick:b,onKeyDown:io,role:"button",disabled:x,"aria-disabled":x,"aria-busy":r,style:co,...S,children:r?(0,F.jsx)(B,{className:"cocso-button-spinner",size:No(t),color:"currentColor"}):m})}),To=Object.assign(wo,{displayName:"Button"});var G=C(require("react"),1),K=require("@radix-ui/react-slot");var q=require("react/jsx-runtime"),Wo=G.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:i="bold",className:r,style:a,...s},c)=>{let m=n("cocso-display",{size:e},[],r);return(0,q.jsx)(o?K.Slot:"h1",{ref:c,className:m,style:{"--cocso-display-color":f(t),"--cocso-display-weight":g(i),...a},...s})}),Mo=Object.assign(Wo,{displayName:"Display"});var J=C(require("react"),1),Q=require("@radix-ui/react-slot");var U=require("react/jsx-runtime"),So=J.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:i="bold",className:r,style:a,...s},c)=>{let m=n("cocso-heading",{size:e},[],r);return(0,U.jsx)(o?Q.Slot:"h2",{ref:c,className:m,style:{"--cocso-heading-color":f(t),"--cocso-heading-weight":g(i),...a},...s})}),E=Object.assign(So,{displayName:"Heading"});var X=C(require("react"),1),Y=require("@radix-ui/react-slot");var Z=require("react/jsx-runtime"),Lo=X.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:i="normal",className:r,style:a,...s},c)=>{let m=n("cocso-label",{size:e},[],r);return(0,Z.jsx)(o?Y.Slot:"label",{ref:c,className:m,style:{"--cocso-label-color":f(t),"--cocso-label-weight":g(i),...a},...s})}),H=Object.assign(Lo,{displayName:"Label"});var oo=C(require("react"),1),eo=require("@radix-ui/react-slot");var to=require("react/jsx-runtime"),Bo=oo.forwardRef(({asChild:o=!1,size:e="md",weight:t="normal",indicator:i=!0,className:r,style:a,...s},c)=>{let m=n("cocso-link",{size:e,indicator:i},[],r);return(0,to.jsx)(o?eo.Slot:"a",{ref:c,className:m,style:{"--cocso-link-weight":g(t),...a},...s})}),Fo=Object.assign(Bo,{displayName:"Link"});var l=C(require("@radix-ui/react-dialog"),1),W=require("react");var d=require("react/jsx-runtime"),Eo=(0,W.forwardRef)(({className:o,children:e,...t},i)=>{let r=n("cocso-modal-content",{},[],o);return(0,d.jsxs)(l.Portal,{children:[(0,d.jsx)(l.Overlay,{className:"cocso-modal-overlay"}),(0,d.jsxs)(l.Content,{ref:i,className:r,...t,children:[(0,d.jsx)("div",{className:"cocso-modal-close-wrapper",children:(0,d.jsx)(l.Close,{className:"cocso-modal-close",children:(0,d.jsxs)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[(0,d.jsx)("path",{d:"M18 6 6 18"}),(0,d.jsx)("path",{d:"m6 6 12 12"})]})})}),e]})]})}),Ho=(0,W.forwardRef)(({className:o,children:e,...t},i)=>{let r=n("cocso-modal-title",{},[],o);return(0,d.jsx)(l.Title,{ref:i,className:r,asChild:!0,...t,children:(0,d.jsx)(E,{color:"text.basic",children:e})})}),Ao=(0,W.forwardRef)(({className:o,children:e,...t},i)=>{let r=n("cocso-modal-description",{},[],o);return(0,d.jsx)(l.Description,{ref:i,className:r,asChild:!0,...t,children:(0,d.jsx)(L,{size:"sm",color:"text.subtle",children:e})})}),Oo=Object.assign(l.Root,{Trigger:l.Trigger,Content:Eo,Title:Ho,Description:Ao});var ro=C(require("react"),1),M=C(require("@radix-ui/react-checkbox"),1);var u=require("react/jsx-runtime"),Do=ro.forwardRef(({id:o,size:e="md",status:t,onChange:i,label:r,disabled:a=!1,className:s,...c},p)=>{let m={size:e,disabled:a,status:t},h=[...a?[{status:t,disabled:a}]:[]],N=n("cocso-checkbox",m,h,s),S=x=>{if(!a){let b;x===!0?b="on":x==="indeterminate"?b="intermediate":b="off",i(b)}};return(0,u.jsxs)("div",{className:"cocso-checkbox-wrapper",children:[(0,u.jsxs)(M.Root,{ref:p,id:o,className:N,checked:(()=>{switch(t){case"on":return!0;case"intermediate":return"indeterminate";case"off":default:return!1}})(),onCheckedChange:S,disabled:a,...c,children:[(0,u.jsx)(M.Indicator,{className:"cocso-checkbox-indicator",style:{opacity:t==="on"?1:0},children:(0,u.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:(0,u.jsx)("path",{d:"M20 6 9 17l-5-5"})})}),(0,u.jsx)("div",{className:"cocso-checkbox-indicator",style:{opacity:t==="intermediate"?1:0},children:(0,u.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round",strokeLinejoin:"round",children:(0,u.jsx)("path",{d:"M5 12h14"})})})]}),r&&(0,u.jsx)(H,{className:n("cocso-checkbox-label",{disabled:a}),size:e,htmlFor:o,children:r})]})}),zo=Object.assign(Do,{displayName:"Checkbox"});
+"use strict";var fo=Object.create;var N=Object.defineProperty;var go=Object.getOwnPropertyDescriptor;var ho=Object.getOwnPropertyNames;var Co=Object.getPrototypeOf,uo=Object.prototype.hasOwnProperty;var Po=(o,e)=>{for(var t in e)N(o,t,{get:e[t],enumerable:!0})},I=(o,e,t,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of ho(e))!uo.call(o,i)&&i!==t&&N(o,i,{get:()=>e[i],enumerable:!(r=go(e,i))||r.enumerable});return o};var g=(o,e,t)=>(t=o!=null?fo(Co(o)):{},I(e||!o||!o.__esModule?N(t,"default",{value:o,enumerable:!0}):t,o)),yo=o=>I(N({},"__esModule",{value:!0}),o);var Ko={};Po(Ko,{Accordion:()=>ko,Body:()=>O,Button:()=>So,Checkbox:()=>Go,Display:()=>Oo,Heading:()=>E,Label:()=>H,Link:()=>Ho,Modal:()=>Io,OneTimePasswordField:()=>_o,Spinner:()=>L});module.exports=yo(Ko);var y=g(require("@radix-ui/react-accordion"),1),T=require("react");var vo=(...o)=>o.filter(Boolean).join(" ").trim(),s=(o,e,t=[],...r)=>{let i=Object.entries(e).filter(([,n])=>n!==!1&&n!==null&&n!==void 0).map(([n,c])=>`${o}--${n}_${c}`).join(" "),a=t.filter(n=>Object.entries(n).every(([c,p])=>e[c]===p)).map(n=>{let c=Object.entries(n).map(([p,m])=>`${p}_${m}`).join("-");return`${o}--${c}`}).join(" ");return vo(o,i,a,...r)};var j=require("@radix-ui/react-slot"),v=require("react/jsx-runtime"),xo=(0,T.forwardRef)(({className:o,...e},t)=>{let r=s("cocso-accordion-item",{},[],o);return(0,v.jsx)(y.Item,{ref:t,className:r,...e})}),Ro=(0,T.forwardRef)(({className:o,children:e,chevron:t=!0,...r},i)=>{let a=s("cocso-accordion-trigger",{},[],o);return(0,v.jsx)(y.Trigger,{ref:i,className:a,...r,children:(0,v.jsxs)(j.Slottable,{children:[e,t&&(0,v.jsx)("div",{className:"cocso-accordion-chevron",children:(0,v.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:(0,v.jsx)("path",{d:"m6 9 6 6 6-6"})})})]})})}),bo=(0,T.forwardRef)(({className:o,...e},t)=>{let r=s("cocso-accordion-content",{},[],o);return(0,v.jsx)(y.Content,{ref:t,className:r,...e})}),ko=Object.assign(y.Root,{Item:xo,Header:y.Header,Trigger:Ro,Content:bo});var _=g(require("react"),1),V=require("@radix-ui/react-slot");function f(o){if(o)return o.includes(".")?`var(--color-${o.replace(/\./g,"-")})`:o}var $={thin:"100",extralight:"200",light:"300",normal:"400",medium:"500",semibold:"600",bold:"700",extrabold:"800",black:"900"};function h(o){if(o)return o in $?$[o]:o}var G=require("react/jsx-runtime"),wo=_.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:r="normal",className:i,style:a,...n},c)=>{let m=s("cocso-body",{size:e},[],i);return(0,G.jsx)(o?V.Slot:"p",{ref:c,className:m,style:{"--cocso-body-color":f(t),"--cocso-body-weight":h(r),...a},...n})}),O=Object.assign(wo,{displayName:"Body"});var k=g(require("react"),1),q=require("@radix-ui/react-slot");var K=g(require("react"),1);var b=require("react/jsx-runtime"),No=["div"],To=K.forwardRef(({as:o=No[0],size:e="md",color:t="palette.primary-500",bg:r="palette.gray-200",className:i,style:a,...n},c)=>{let p=o,C=s("cocso-spinner",{size:e},[],i);return(0,b.jsx)(p,{ref:c,className:C,style:{"--cocso-spinner-bg":f(r),"--cocso-spinner-color":f(t),...a},...n,children:(0,b.jsxs)("svg",{viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[(0,b.jsx)("circle",{className:"opacity-25",cx:"12",cy:"12",r:"9",stroke:"var(--cocso-spinner-bg, currentColor)",strokeWidth:"3"}),(0,b.jsx)("path",{className:"opacity-75",fill:"var(--cocso-spinner-color, currentColor)",d:"M12 2a10 10 0 0110 10 10 10 0 01-5 8.66l-1-1.73a8 8 0 004-6.93 8 8 0 00-8-8V2z"})]})})}),L=Object.assign(To,{displayName:"Spinner"});var B=require("react/jsx-runtime"),Wo=o=>({"2xs":"xs",xs:"xs",sm:"xs",md:"sm",lg:"md",xl:"md"})[o],Mo=k.forwardRef(({asChild:o=!1,variant:e="primary",size:t="md",disabled:r=!1,loading:i=!1,color:a,weight:n="normal",className:c,style:p,children:m,onClick:C,onKeyDown:w,...F},z)=>{let P=r||i,R=k.useCallback(x=>{if(P){x.preventDefault();return}C?.(x)},[P,C]),ao=k.useCallback(x=>{(x.key==="Enter"||x.key===" ")&&(x.preventDefault(),P||x.currentTarget.click()),w?.(x)},[P,w]),co={variant:e,size:t,loading:i,disabled:P},mo=[...r?[{variant:e,disabled:r}]:[],...i?[{variant:e,loading:i}]:[]],lo=s("cocso-button",co,mo,c),po={"--cocso-button-color":f(a),"--cocso-button-weight":h(n),...p};return(0,B.jsx)(o?q.Slot:"button",{ref:z,className:lo,onClick:R,onKeyDown:ao,role:"button",disabled:P,"aria-disabled":P,"aria-busy":i,style:po,...F,children:i?(0,B.jsx)(L,{className:"cocso-button-spinner",size:Wo(t),color:"currentColor"}):m})}),So=Object.assign(Mo,{displayName:"Button"});var J=g(require("react"),1),Q=require("@radix-ui/react-slot");var U=require("react/jsx-runtime"),Fo=J.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:r="bold",className:i,style:a,...n},c)=>{let m=s("cocso-display",{size:e},[],i);return(0,U.jsx)(o?Q.Slot:"h1",{ref:c,className:m,style:{"--cocso-display-color":f(t),"--cocso-display-weight":h(r),...a},...n})}),Oo=Object.assign(Fo,{displayName:"Display"});var X=g(require("react"),1),Y=require("@radix-ui/react-slot");var Z=require("react/jsx-runtime"),Lo=X.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:r="bold",className:i,style:a,...n},c)=>{let m=s("cocso-heading",{size:e},[],i);return(0,Z.jsx)(o?Y.Slot:"h2",{ref:c,className:m,style:{"--cocso-heading-color":f(t),"--cocso-heading-weight":h(r),...a},...n})}),E=Object.assign(Lo,{displayName:"Heading"});var oo=g(require("react"),1),eo=require("@radix-ui/react-slot");var to=require("react/jsx-runtime"),Bo=oo.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:r="normal",className:i,style:a,...n},c)=>{let m=s("cocso-label",{size:e},[],i);return(0,to.jsx)(o?eo.Slot:"label",{ref:c,className:m,style:{"--cocso-label-color":f(t),"--cocso-label-weight":h(r),...a},...n})}),H=Object.assign(Bo,{displayName:"Label"});var ro=g(require("react"),1),io=require("@radix-ui/react-slot");var so=require("react/jsx-runtime"),Eo=ro.forwardRef(({asChild:o=!1,size:e="md",weight:t="normal",indicator:r=!0,className:i,style:a,...n},c)=>{let m=s("cocso-link",{size:e,indicator:r},[],i);return(0,so.jsx)(o?io.Slot:"a",{ref:c,className:m,style:{"--cocso-link-weight":h(t),...a},...n})}),Ho=Object.assign(Eo,{displayName:"Link"});var l=g(require("@radix-ui/react-dialog"),1),W=require("react");var d=require("react/jsx-runtime"),Ao=(0,W.forwardRef)(({className:o,children:e,...t},r)=>{let i=s("cocso-modal-content",{},[],o);return(0,d.jsxs)(l.Portal,{children:[(0,d.jsx)(l.Overlay,{className:"cocso-modal-overlay"}),(0,d.jsxs)(l.Content,{ref:r,className:i,...t,children:[(0,d.jsx)("div",{className:"cocso-modal-close-wrapper",children:(0,d.jsx)(l.Close,{className:"cocso-modal-close",children:(0,d.jsxs)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[(0,d.jsx)("path",{d:"M18 6 6 18"}),(0,d.jsx)("path",{d:"m6 6 12 12"})]})})}),e]})]})}),Do=(0,W.forwardRef)(({className:o,children:e,...t},r)=>{let i=s("cocso-modal-title",{},[],o);return(0,d.jsx)(l.Title,{ref:r,className:i,asChild:!0,...t,children:(0,d.jsx)(E,{color:"text.basic",children:e})})}),zo=(0,W.forwardRef)(({className:o,children:e,...t},r)=>{let i=s("cocso-modal-description",{},[],o);return(0,d.jsx)(l.Description,{ref:r,className:i,asChild:!0,...t,children:(0,d.jsx)(O,{size:"sm",color:"text.subtle",children:e})})}),Io=Object.assign(l.Root,{Trigger:l.Trigger,Content:Ao,Title:Do,Description:zo});var M=g(require("@radix-ui/react-one-time-password-field"),1),A=require("react");var D=require("react/jsx-runtime"),jo=(0,A.forwardRef)(({className:o,...e},t)=>{let r=s("cocso-otp",{},[],o);return(0,D.jsx)(M.Root,{ref:t,className:r,...e})}),$o=(0,A.forwardRef)(({className:o,...e},t)=>{let r=s("cocso-otp-input",{},[],o);return(0,D.jsx)(M.Input,{ref:t,className:r,...e})}),_o=Object.assign(jo,{Input:$o});var no=g(require("react"),1),S=g(require("@radix-ui/react-checkbox"),1);var u=require("react/jsx-runtime"),Vo=no.forwardRef(({id:o,size:e="md",status:t,onChange:r,label:i,disabled:a=!1,className:n,...c},p)=>{let m={size:e,disabled:a,status:t},C=[...a?[{status:t,disabled:a}]:[]],w=s("cocso-checkbox",m,C,n),F=P=>{if(!a){let R;P===!0?R="on":P==="indeterminate"?R="intermediate":R="off",r(R)}};return(0,u.jsxs)("div",{className:"cocso-checkbox-wrapper",children:[(0,u.jsxs)(S.Root,{ref:p,id:o,className:w,checked:(()=>{switch(t){case"on":return!0;case"intermediate":return"indeterminate";case"off":default:return!1}})(),onCheckedChange:F,disabled:a,...c,children:[(0,u.jsx)(S.Indicator,{className:"cocso-checkbox-indicator",style:{opacity:t==="on"?1:0},children:(0,u.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:(0,u.jsx)("path",{d:"M20 6 9 17l-5-5"})})}),(0,u.jsx)("div",{className:"cocso-checkbox-indicator",style:{opacity:t==="intermediate"?1:0},children:(0,u.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round",strokeLinejoin:"round",children:(0,u.jsx)("path",{d:"M5 12h14"})})})]}),i&&(0,u.jsx)(H,{className:s("cocso-checkbox-label",{disabled:a}),size:e,htmlFor:o,children:i})]})}),Go=Object.assign(Vo,{displayName:"Checkbox"});

package/lib/index.d.ts

@@ -6,5 +6,6 @@ export * from './components/Heading';
 export * from './components/Label';
 export * from './components/Link';
 export * from './components/Modal';
+export * from './components/OneTimePasswordField';
 export * from './components/Checkbox';
 export * from './components/Spinner';

package/lib/index.js

@@ -1 +1 @@
-import*as C from"@radix-ui/react-accordion";import{forwardRef as w}from"react";var U=(...o)=>o.filter(Boolean).join(" ").trim(),n=(o,e,t=[],...r)=>{let i=Object.entries(e).filter(([,s])=>s!==!1&&s!==null&&s!==void 0).map(([s,c])=>`${o}--${s}_${c}`).join(" "),a=t.filter(s=>Object.entries(s).every(([c,p])=>e[c]===p)).map(s=>{let c=Object.entries(s).map(([p,m])=>`${p}_${m}`).join("-");return`${o}--${c}`}).join(" ");return U(o,i,a,...r)};import{Slottable as X}from"@radix-ui/react-slot";import{jsx as P,jsxs as eo}from"react/jsx-runtime";var Y=w(({className:o,...e},t)=>{let r=n("cocso-accordion-item",{},[],o);return P(C.Item,{ref:t,className:r,...e})}),Z=w(({className:o,children:e,chevron:t=!0,...r},i)=>{let a=n("cocso-accordion-trigger",{},[],o);return P(C.Trigger,{ref:i,className:a,...r,children:eo(X,{children:[e,t&&P("div",{className:"cocso-accordion-chevron",children:P("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:P("path",{d:"m6 9 6 6 6-6"})})})]})})}),oo=w(({className:o,...e},t)=>{let r=n("cocso-accordion-content",{},[],o);return P(C.Content,{ref:t,className:r,...e})}),Ao=Object.assign(C.Root,{Item:Y,Header:C.Header,Trigger:Z,Content:oo});import*as B from"react";import{Slot as to}from"@radix-ui/react-slot";function d(o){if(o)return o.includes(".")?`var(--color-${o.replace(/\./g,"-")})`:o}var L={thin:"100",extralight:"200",light:"300",normal:"400",medium:"500",semibold:"600",bold:"700",extrabold:"800",black:"900"};function f(o){if(o)return o in L?L[o]:o}import{jsx as io}from"react/jsx-runtime";var ro=B.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:r="normal",className:i,style:a,...s},c)=>{let m=n("cocso-body",{size:e},[],i);return io(o?to:"p",{ref:c,className:m,style:{"--cocso-body-color":d(t),"--cocso-body-weight":f(r),...a},...s})}),F=Object.assign(ro,{displayName:"Body"});import*as b from"react";import{Slot as co}from"@radix-ui/react-slot";import*as E from"react";import{jsx as T,jsxs as ao}from"react/jsx-runtime";var so=["div"],no=E.forwardRef(({as:o=so[0],size:e="md",color:t="palette.primary-500",bg:r="palette.gray-200",className:i,style:a,...s},c)=>{let p=o,g=n("cocso-spinner",{size:e},[],i);return T(p,{ref:c,className:g,style:{"--cocso-spinner-bg":d(r),"--cocso-spinner-color":d(t),...a},...s,children:ao("svg",{viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[T("circle",{className:"opacity-25",cx:"12",cy:"12",r:"9",stroke:"var(--cocso-spinner-bg, currentColor)",strokeWidth:"3"}),T("path",{className:"opacity-75",fill:"var(--cocso-spinner-color, currentColor)",d:"M12 2a10 10 0 0110 10 10 10 0 01-5 8.66l-1-1.73a8 8 0 004-6.93 8 8 0 00-8-8V2z"})]})})}),H=Object.assign(no,{displayName:"Spinner"});import{jsx as A}from"react/jsx-runtime";var mo=o=>({"2xs":"xs",xs:"xs",sm:"xs",md:"sm",lg:"md",xl:"md"})[o],lo=b.forwardRef(({asChild:o=!1,variant:e="primary",size:t="md",disabled:r=!1,loading:i=!1,color:a,weight:s="normal",className:c,style:p,children:m,onClick:g,onKeyDown:R,...N},S)=>{let h=r||i,v=b.useCallback(x=>{if(h){x.preventDefault();return}g?.(x)},[h,g]),G=b.useCallback(x=>{(x.key==="Enter"||x.key===" ")&&(x.preventDefault(),h||x.currentTarget.click()),R?.(x)},[h,R]),K={variant:e,size:t,loading:i,disabled:h},q=[...r?[{variant:e,disabled:r}]:[],...i?[{variant:e,loading:i}]:[]],J=n("cocso-button",K,q,c),Q={"--cocso-button-color":d(a),"--cocso-button-weight":f(s),...p};return A(o?co:"button",{ref:S,className:J,onClick:v,onKeyDown:G,role:"button",disabled:h,"aria-disabled":h,"aria-busy":i,style:Q,...N,children:i?A(H,{className:"cocso-button-spinner",size:mo(t),color:"currentColor"}):m})}),se=Object.assign(lo,{displayName:"Button"});import*as O from"react";import{Slot as po}from"@radix-ui/react-slot";import{jsx as go}from"react/jsx-runtime";var fo=O.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:r="bold",className:i,style:a,...s},c)=>{let m=n("cocso-display",{size:e},[],i);return go(o?po:"h1",{ref:c,className:m,style:{"--cocso-display-color":d(t),"--cocso-display-weight":f(r),...a},...s})}),fe=Object.assign(fo,{displayName:"Display"});import*as D from"react";import{Slot as ho}from"@radix-ui/react-slot";import{jsx as uo}from"react/jsx-runtime";var Co=D.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:r="bold",className:i,style:a,...s},c)=>{let m=n("cocso-heading",{size:e},[],i);return uo(o?ho:"h2",{ref:c,className:m,style:{"--cocso-heading-color":d(t),"--cocso-heading-weight":f(r),...a},...s})}),z=Object.assign(Co,{displayName:"Heading"});import*as j from"react";import{Slot as xo}from"@radix-ui/react-slot";import{jsx as vo}from"react/jsx-runtime";var yo=j.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:r="normal",className:i,style:a,...s},c)=>{let m=n("cocso-label",{size:e},[],i);return vo(o?xo:"label",{ref:c,className:m,style:{"--cocso-label-color":d(t),"--cocso-label-weight":f(r),...a},...s})}),I=Object.assign(yo,{displayName:"Label"});import*as $ from"react";import{Slot as Po}from"@radix-ui/react-slot";import{jsx as Ro}from"react/jsx-runtime";var bo=$.forwardRef(({asChild:o=!1,size:e="md",weight:t="normal",indicator:r=!0,className:i,style:a,...s},c)=>{let m=n("cocso-link",{size:e,indicator:r},[],i);return Ro(o?Po:"a",{ref:c,className:m,style:{"--cocso-link-weight":f(t),...a},...s})}),He=Object.assign(bo,{displayName:"Link"});import*as l from"@radix-ui/react-dialog";import{forwardRef as M}from"react";import{jsx as u,jsxs as W}from"react/jsx-runtime";var ko=M(({className:o,children:e,...t},r)=>{let i=n("cocso-modal-content",{},[],o);return W(l.Portal,{children:[u(l.Overlay,{className:"cocso-modal-overlay"}),W(l.Content,{ref:r,className:i,...t,children:[u("div",{className:"cocso-modal-close-wrapper",children:u(l.Close,{className:"cocso-modal-close",children:W("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[u("path",{d:"M18 6 6 18"}),u("path",{d:"m6 6 12 12"})]})})}),e]})]})}),No=M(({className:o,children:e,...t},r)=>{let i=n("cocso-modal-title",{},[],o);return u(l.Title,{ref:r,className:i,asChild:!0,...t,children:u(z,{color:"text.basic",children:e})})}),wo=M(({className:o,children:e,...t},r)=>{let i=n("cocso-modal-description",{},[],o);return u(l.Description,{ref:r,className:i,asChild:!0,...t,children:u(F,{size:"sm",color:"text.subtle",children:e})})}),Ke=Object.assign(l.Root,{Trigger:l.Trigger,Content:ko,Title:No,Description:wo});import*as V from"react";import*as k from"@radix-ui/react-checkbox";import{jsx as y,jsxs as _}from"react/jsx-runtime";var To=V.forwardRef(({id:o,size:e="md",status:t,onChange:r,label:i,disabled:a=!1,className:s,...c},p)=>{let m={size:e,disabled:a,status:t},g=[...a?[{status:t,disabled:a}]:[]],R=n("cocso-checkbox",m,g,s),N=h=>{if(!a){let v;h===!0?v="on":h==="indeterminate"?v="intermediate":v="off",r(v)}};return _("div",{className:"cocso-checkbox-wrapper",children:[_(k.Root,{ref:p,id:o,className:R,checked:(()=>{switch(t){case"on":return!0;case"intermediate":return"indeterminate";case"off":default:return!1}})(),onCheckedChange:N,disabled:a,...c,children:[y(k.Indicator,{className:"cocso-checkbox-indicator",style:{opacity:t==="on"?1:0},children:y("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:y("path",{d:"M20 6 9 17l-5-5"})})}),y("div",{className:"cocso-checkbox-indicator",style:{opacity:t==="intermediate"?1:0},children:y("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round",strokeLinejoin:"round",children:y("path",{d:"M5 12h14"})})})]}),i&&y(I,{className:n("cocso-checkbox-label",{disabled:a}),size:e,htmlFor:o,children:i})]})}),Ze=Object.assign(To,{displayName:"Checkbox"});export{Ao as Accordion,F as Body,se as Button,Ze as Checkbox,fe as Display,z as Heading,I as Label,He as Link,Ke as Modal,H as Spinner};
+import*as C from"@radix-ui/react-accordion";import{forwardRef as T}from"react";var Z=(...o)=>o.filter(Boolean).join(" ").trim(),s=(o,e,t=[],...r)=>{let i=Object.entries(e).filter(([,n])=>n!==!1&&n!==null&&n!==void 0).map(([n,c])=>`${o}--${n}_${c}`).join(" "),a=t.filter(n=>Object.entries(n).every(([c,p])=>e[c]===p)).map(n=>{let c=Object.entries(n).map(([p,m])=>`${p}_${m}`).join("-");return`${o}--${c}`}).join(" ");return Z(o,i,a,...r)};import{Slottable as oo}from"@radix-ui/react-slot";import{jsx as x,jsxs as io}from"react/jsx-runtime";var eo=T(({className:o,...e},t)=>{let r=s("cocso-accordion-item",{},[],o);return x(C.Item,{ref:t,className:r,...e})}),to=T(({className:o,children:e,chevron:t=!0,...r},i)=>{let a=s("cocso-accordion-trigger",{},[],o);return x(C.Trigger,{ref:i,className:a,...r,children:io(oo,{children:[e,t&&x("div",{className:"cocso-accordion-chevron",children:x("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:x("path",{d:"m6 9 6 6 6-6"})})})]})})}),ro=T(({className:o,...e},t)=>{let r=s("cocso-accordion-content",{},[],o);return x(C.Content,{ref:t,className:r,...e})}),jo=Object.assign(C.Root,{Item:eo,Header:C.Header,Trigger:to,Content:ro});import*as L from"react";import{Slot as so}from"@radix-ui/react-slot";function d(o){if(o)return o.includes(".")?`var(--color-${o.replace(/\./g,"-")})`:o}var O={thin:"100",extralight:"200",light:"300",normal:"400",medium:"500",semibold:"600",bold:"700",extrabold:"800",black:"900"};function f(o){if(o)return o in O?O[o]:o}import{jsx as ao}from"react/jsx-runtime";var no=L.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:r="normal",className:i,style:a,...n},c)=>{let m=s("cocso-body",{size:e},[],i);return ao(o?so:"p",{ref:c,className:m,style:{"--cocso-body-color":d(t),"--cocso-body-weight":f(r),...a},...n})}),B=Object.assign(no,{displayName:"Body"});import*as R from"react";import{Slot as po}from"@radix-ui/react-slot";import*as E from"react";import{jsx as W,jsxs as lo}from"react/jsx-runtime";var co=["div"],mo=E.forwardRef(({as:o=co[0],size:e="md",color:t="palette.primary-500",bg:r="palette.gray-200",className:i,style:a,...n},c)=>{let p=o,g=s("cocso-spinner",{size:e},[],i);return W(p,{ref:c,className:g,style:{"--cocso-spinner-bg":d(r),"--cocso-spinner-color":d(t),...a},...n,children:lo("svg",{viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[W("circle",{className:"opacity-25",cx:"12",cy:"12",r:"9",stroke:"var(--cocso-spinner-bg, currentColor)",strokeWidth:"3"}),W("path",{className:"opacity-75",fill:"var(--cocso-spinner-color, currentColor)",d:"M12 2a10 10 0 0110 10 10 10 0 01-5 8.66l-1-1.73a8 8 0 004-6.93 8 8 0 00-8-8V2z"})]})})}),H=Object.assign(mo,{displayName:"Spinner"});import{jsx as A}from"react/jsx-runtime";var fo=o=>({"2xs":"xs",xs:"xs",sm:"xs",md:"sm",lg:"md",xl:"md"})[o],go=R.forwardRef(({asChild:o=!1,variant:e="primary",size:t="md",disabled:r=!1,loading:i=!1,color:a,weight:n="normal",className:c,style:p,children:m,onClick:g,onKeyDown:b,...N},F)=>{let h=r||i,v=R.useCallback(P=>{if(h){P.preventDefault();return}g?.(P)},[h,g]),J=R.useCallback(P=>{(P.key==="Enter"||P.key===" ")&&(P.preventDefault(),h||P.currentTarget.click()),b?.(P)},[h,b]),Q={variant:e,size:t,loading:i,disabled:h},U=[...r?[{variant:e,disabled:r}]:[],...i?[{variant:e,loading:i}]:[]],X=s("cocso-button",Q,U,c),Y={"--cocso-button-color":d(a),"--cocso-button-weight":f(n),...p};return A(o?po:"button",{ref:F,className:X,onClick:v,onKeyDown:J,role:"button",disabled:h,"aria-disabled":h,"aria-busy":i,style:Y,...N,children:i?A(H,{className:"cocso-button-spinner",size:fo(t),color:"currentColor"}):m})}),le=Object.assign(go,{displayName:"Button"});import*as D from"react";import{Slot as ho}from"@radix-ui/react-slot";import{jsx as uo}from"react/jsx-runtime";var Co=D.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:r="bold",className:i,style:a,...n},c)=>{let m=s("cocso-display",{size:e},[],i);return uo(o?ho:"h1",{ref:c,className:m,style:{"--cocso-display-color":d(t),"--cocso-display-weight":f(r),...a},...n})}),Pe=Object.assign(Co,{displayName:"Display"});import*as z from"react";import{Slot as Po}from"@radix-ui/react-slot";import{jsx as vo}from"react/jsx-runtime";var yo=z.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:r="bold",className:i,style:a,...n},c)=>{let m=s("cocso-heading",{size:e},[],i);return vo(o?Po:"h2",{ref:c,className:m,style:{"--cocso-heading-color":d(t),"--cocso-heading-weight":f(r),...a},...n})}),I=Object.assign(yo,{displayName:"Heading"});import*as j from"react";import{Slot as xo}from"@radix-ui/react-slot";import{jsx as bo}from"react/jsx-runtime";var Ro=j.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:r="normal",className:i,style:a,...n},c)=>{let m=s("cocso-label",{size:e},[],i);return bo(o?xo:"label",{ref:c,className:m,style:{"--cocso-label-color":d(t),"--cocso-label-weight":f(r),...a},...n})}),$=Object.assign(Ro,{displayName:"Label"});import*as _ from"react";import{Slot as ko}from"@radix-ui/react-slot";import{jsx as No}from"react/jsx-runtime";var wo=_.forwardRef(({asChild:o=!1,size:e="md",weight:t="normal",indicator:r=!0,className:i,style:a,...n},c)=>{let m=s("cocso-link",{size:e,indicator:r},[],i);return No(o?ko:"a",{ref:c,className:m,style:{"--cocso-link-weight":f(t),...a},...n})}),Ie=Object.assign(wo,{displayName:"Link"});import*as l from"@radix-ui/react-dialog";import{forwardRef as S}from"react";import{jsx as u,jsxs as M}from"react/jsx-runtime";var To=S(({className:o,children:e,...t},r)=>{let i=s("cocso-modal-content",{},[],o);return M(l.Portal,{children:[u(l.Overlay,{className:"cocso-modal-overlay"}),M(l.Content,{ref:r,className:i,...t,children:[u("div",{className:"cocso-modal-close-wrapper",children:u(l.Close,{className:"cocso-modal-close",children:M("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[u("path",{d:"M18 6 6 18"}),u("path",{d:"m6 6 12 12"})]})})}),e]})]})}),Wo=S(({className:o,children:e,...t},r)=>{let i=s("cocso-modal-title",{},[],o);return u(l.Title,{ref:r,className:i,asChild:!0,...t,children:u(I,{color:"text.basic",children:e})})}),Mo=S(({className:o,children:e,...t},r)=>{let i=s("cocso-modal-description",{},[],o);return u(l.Description,{ref:r,className:i,asChild:!0,...t,children:u(B,{size:"sm",color:"text.subtle",children:e})})}),Xe=Object.assign(l.Root,{Trigger:l.Trigger,Content:To,Title:Wo,Description:Mo});import*as k from"@radix-ui/react-one-time-password-field";import{forwardRef as V}from"react";import{jsx as G}from"react/jsx-runtime";var So=V(({className:o,...e},t)=>{let r=s("cocso-otp",{},[],o);return G(k.Root,{ref:t,className:r,...e})}),Fo=V(({className:o,...e},t)=>{let r=s("cocso-otp-input",{},[],o);return G(k.Input,{ref:t,className:r,...e})}),nt=Object.assign(So,{Input:Fo});import*as q from"react";import*as w from"@radix-ui/react-checkbox";import{jsx as y,jsxs as K}from"react/jsx-runtime";var Oo=q.forwardRef(({id:o,size:e="md",status:t,onChange:r,label:i,disabled:a=!1,className:n,...c},p)=>{let m={size:e,disabled:a,status:t},g=[...a?[{status:t,disabled:a}]:[]],b=s("cocso-checkbox",m,g,n),N=h=>{if(!a){let v;h===!0?v="on":h==="indeterminate"?v="intermediate":v="off",r(v)}};return K("div",{className:"cocso-checkbox-wrapper",children:[K(w.Root,{ref:p,id:o,className:b,checked:(()=>{switch(t){case"on":return!0;case"intermediate":return"indeterminate";case"off":default:return!1}})(),onCheckedChange:N,disabled:a,...c,children:[y(w.Indicator,{className:"cocso-checkbox-indicator",style:{opacity:t==="on"?1:0},children:y("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:y("path",{d:"M20 6 9 17l-5-5"})})}),y("div",{className:"cocso-checkbox-indicator",style:{opacity:t==="intermediate"?1:0},children:y("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round",strokeLinejoin:"round",children:y("path",{d:"M5 12h14"})})})]}),i&&y($,{className:s("cocso-checkbox-label",{disabled:a}),size:e,htmlFor:o,children:i})]})}),ft=Object.assign(Oo,{displayName:"Checkbox"});export{jo as Accordion,B as Body,le as Button,ft as Checkbox,Pe as Display,I as Heading,$ as Label,Ie as Link,Xe as Modal,nt as OneTimePasswordField,H as Spinner};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cocso-ui/react",
-  "version": "0.0.1-beta.27",
+  "version": "0.0.1-beta.28",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/cocso/cocso-ui.git",
@@ -28,6 +28,7 @@
     "@radix-ui/react-accordion": "^1.2.11",
     "@radix-ui/react-checkbox": "^1.3.2",
     "@radix-ui/react-dialog": "^1.1.14",
+    "@radix-ui/react-one-time-password-field": "^0.1.7",
     "@radix-ui/react-slot": "^1.2.3"
   },
   "peerDependencies": {