@cocso-ui/react 0.0.1-beta.12 → 0.0.1-beta.14

package/lib/components/Body/Body.d.ts

@@ -9,9 +9,7 @@ export type BodyProps<T extends Element = Default> = {
     color?: string;
     weight?: FontWeightToken;
 } & React.ComponentPropsWithoutRef<T>;
-export declare const Body: (<T extends Element = "p">(props: BodyProps<T> & {
-    ref?: React.ForwardedRef<React.ComponentRef<T>>;
-}) => React.ReactElement) & {
+export declare const Body: React.ForwardRefExoticComponent<BodyProps<"p" | "a" | "span" | "div" | "label" | "li" | "td" | "th" | "figcaption" | "blockquote" | "cite"> & React.RefAttributes<HTMLElement>> & {
     displayName: string;
 };
 export {};

package/lib/components/Checkbox/Checkbox.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 export type CheckboxStatus = 'on' | 'off' | 'intermediate';
 export type CheckboxProps = {
     id: string;
-    size?: 'md' | 'lg';
+    size?: 'lg' | 'md' | 'sm';
     status: CheckboxStatus;
     onChange: (next: CheckboxStatus) => void;
     label?: string;
@@ -10,7 +10,7 @@ export type CheckboxProps = {
 } & Omit<React.ComponentPropsWithoutRef<'div'>, 'id'>;
 export declare const Checkbox: React.ForwardRefExoticComponent<{
     id: string;
-    size?: "md" | "lg";
+    size?: "lg" | "md" | "sm";
     status: CheckboxStatus;
     onChange: (next: CheckboxStatus) => void;
     label?: string;

package/lib/components/Label/Label.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import { type FontWeightToken } from '../../utils/token';
+declare const tags: readonly ["label", "p", "a", "span", "div", "li", "td", "th", "figcaption", "blockquote", "cite"];
+type Element = (typeof tags)[number];
+type Default = (typeof tags)[0];
+export type LabelProps<T extends Element = Default> = {
+    as?: T;
+    size?: 'lg' | 'md' | 'sm' | 'xs';
+    color?: string;
+    weight?: FontWeightToken;
+} & React.ComponentPropsWithoutRef<T>;
+export declare const Label: React.ForwardRefExoticComponent<LabelProps<"p" | "a" | "span" | "div" | "label" | "li" | "td" | "th" | "figcaption" | "blockquote" | "cite"> & React.RefAttributes<HTMLElement>> & {
+    displayName: string;
+};
+export {};

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

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

package/lib/index.cjs

@@ -1 +1 @@
-"use strict";var I=Object.create;var k=Object.defineProperty;var V=Object.getOwnPropertyDescriptor;var A=Object.getOwnPropertyNames;var G=Object.getPrototypeOf,q=Object.prototype.hasOwnProperty;var J=(e,o)=>{for(var t in o)k(e,t,{get:o[t],enumerable:!0})},N=(e,o,t,a)=>{if(o&&typeof o=="object"||typeof o=="function")for(let n of A(o))!q.call(e,n)&&n!==t&&k(e,n,{get:()=>o[n],enumerable:!(a=V(o,n))||a.enumerable});return e};var x=(e,o,t)=>(t=e!=null?I(G(e)):{},N(o||!e||!e.__esModule?k(t,"default",{value:e,enumerable:!0}):t,e)),Q=e=>N(k({},"__esModule",{value:!0}),e);var ge={};J(ge,{Body:()=>Z,Button:()=>re,Checkbox:()=>fe,Display:()=>ie,Heading:()=>me,Spinner:()=>E});module.exports=Q(ge);var D=x(require("react"),1);function d(e){if(e)return e.includes(".")?`var(--color-${e.replace(/\./g,"-")})`:e}var P={thin:"100",extralight:"200",light:"300",normal:"400",medium:"500",semibold:"600",bold:"700",extrabold:"800",black:"900"};function u(e){if(e)return e in P?P[e]:e}var U=(...e)=>e.filter(Boolean).join(" ").trim(),p=(e,o,t=[],...a)=>{let n=Object.entries(o).filter(([,s])=>s!==!1&&s!==null&&s!==void 0).map(([s,c])=>`${e}--${s}_${c}`).join(" "),r=t.filter(s=>Object.entries(s).every(([c,i])=>o[c]===i)).map(s=>{let c=Object.entries(s).map(([i,f])=>`${i}_${f}`).join("-");return`${e}--${c}`}).join(" ");return U(e,n,r,...a)};var W=require("react/jsx-runtime"),X=["p","a","span","div","label","li","td","th","figcaption","blockquote","cite"],Y=D.forwardRef(({as:e=X[0],size:o="md",color:t,weight:a="normal",className:n,style:r,...s},c)=>{let i=e,l=p("cocso-body",{size:o},[],n);return(0,W.jsx)(i,{ref:c,className:l,style:{"--cocso-body-color":d(t),"--cocso-body-weight":u(a),...r},...s})}),Z=Object.assign(Y,{displayName:"Body"});var C=x(require("react"),1);var S=x(require("react"),1);var R=require("react/jsx-runtime"),ee=["div"],te=S.forwardRef(({as:e=ee[0],size:o="md",color:t="palette.primary-500",bg:a="palette.gray-200",className:n,style:r,...s},c)=>{let i=e,l=p("cocso-spinner",{size:o},[],n);return(0,R.jsx)(i,{ref:c,className:l,style:{"--cocso-spinner-bg":d(a),"--cocso-spinner-color":d(t),...r},...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"})]})})}),E=Object.assign(te,{displayName:"Spinner"});var w=require("react/jsx-runtime"),oe=["button"],ne=e=>({"2xs":"xs",xs:"xs",sm:"xs",md:"sm",lg:"md",xl:"md"})[e],se=C.forwardRef(({as:e=oe[0],variant:o="primary",size:t="md",disabled:a=!1,loading:n=!1,color:r,weight:s="normal",className:c,style:i,children:f,onClick:l,onKeyDown:T,...b},v)=>{let y=e,h=a||n,H=C.useCallback(g=>{if(h){g.preventDefault();return}l?.(g)},[h,l]),j=C.useCallback(g=>{(g.key==="Enter"||g.key===" ")&&(g.preventDefault(),h||g.currentTarget.click()),T?.(g)},[h,T]),$={variant:o,size:t,loading:n,disabled:h},K=[...a?[{variant:o,disabled:a}]:[],...n?[{variant:o,loading:n}]:[]],_=p("cocso-button",$,K,c),L={"--cocso-button-color":d(r),"--cocso-button-weight":u(s),...i};return(0,w.jsx)(y,{ref:v,className:_,onClick:H,onKeyDown:j,role:"button",disabled:h,"aria-disabled":h,"aria-busy":n,style:L,...b,children:n?(0,w.jsx)(E,{className:"cocso-button-spinner",size:ne(t),color:"currentColor"}):f})}),re=Object.assign(se,{displayName:"Button"});var B=x(require("react"),1);var F=require("react/jsx-runtime"),ae=["h1","h2","h3","h4","h5","h6"],ce=B.forwardRef(({as:e=ae[0],size:o="md",color:t,weight:a="bold",className:n,style:r,...s},c)=>{let i=e,l=p("cocso-display",{size:o},[],n);return(0,F.jsx)(i,{ref:c,className:l,style:{"--cocso-display-color":d(t),"--cocso-display-weight":u(a),...r},...s})}),ie=Object.assign(ce,{displayName:"Display"});var O=x(require("react"),1);var z=require("react/jsx-runtime"),le=["h1","h2","h3","h4","h5","h6"],pe=O.forwardRef(({as:e=le[1],size:o="md",color:t,weight:a="bold",className:n,style:r,...s},c)=>{let i=e,l=p("cocso-heading",{size:o},[],n);return(0,z.jsx)(i,{ref:c,className:l,style:{"--cocso-heading-color":d(t),"--cocso-heading-weight":u(a),...r},...s})}),me=Object.assign(pe,{displayName:"Heading"});var M=x(require("react"),1);var m=require("react/jsx-runtime"),de=M.forwardRef(({id:e,size:o="md",status:t,onChange:a,label:n,disabled:r=!1,className:s,...c},i)=>{let f={size:o,disabled:r,status:t},l=[...r?[{status:t,disabled:r}]:[]],T=p("cocso-checkbox-inner",f,l,s),b=()=>{r||a(t==="on"?"off":"on")};return(0,m.jsxs)("div",{ref:i,className:"cocso-checkbox",tabIndex:r?-1:0,role:"checkbox","aria-checked":t==="on"?"true":t==="intermediate"?"mixed":"false","aria-disabled":r,onKeyDown:y=>{(y.key==="Enter"||y.key===" ")&&(y.preventDefault(),b())},...c,children:[(0,m.jsxs)("div",{className:T,onClick:b,children:[(0,m.jsx)("div",{className:"cocso-checkbox-icon",style:{opacity:t==="on"?1:0},children:(0,m.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round",className:"lucide lucide-check-icon lucide-check",children:(0,m.jsx)("path",{d:"M20 6 9 17l-5-5"})})}),(0,m.jsx)("div",{className:"cocso-checkbox-icon",style:{opacity:t==="intermediate"?1:0},children:(0,m.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"3","stroke-linecap":"round","stroke-linejoin":"round",className:"lucide lucide-minus-icon lucide-minus",children:(0,m.jsx)("path",{d:"M5 12h14"})})}),(0,m.jsx)("input",{type:"checkbox",id:e,checked:t==="on",onChange:b,disabled:r})]}),n&&(0,m.jsx)("label",{htmlFor:e,children:n})]})}),fe=Object.assign(de,{displayName:"Checkbox"});
+"use strict";var A=Object.create;var k=Object.defineProperty;var G=Object.getOwnPropertyDescriptor;var J=Object.getOwnPropertyNames;var Q=Object.getPrototypeOf,U=Object.prototype.hasOwnProperty;var X=(e,t)=>{for(var o in t)k(e,o,{get:t[o],enumerable:!0})},P=(e,t,o,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of J(t))!U.call(e,n)&&n!==o&&k(e,n,{get:()=>t[n],enumerable:!(a=G(t,n))||a.enumerable});return e};var u=(e,t,o)=>(o=e!=null?A(Q(e)):{},P(t||!e||!e.__esModule?k(o,"default",{value:e,enumerable:!0}):o,e)),Y=e=>P(k({},"__esModule",{value:!0}),e);var be={};X(be,{Body:()=>oe,Button:()=>ie,Checkbox:()=>xe,Display:()=>me,Heading:()=>ge,Label:()=>v,Spinner:()=>E});module.exports=Y(be);var D=u(require("react"),1);function m(e){if(e)return e.includes(".")?`var(--color-${e.replace(/\./g,"-")})`:e}var W={thin:"100",extralight:"200",light:"300",normal:"400",medium:"500",semibold:"600",bold:"700",extrabold:"800",black:"900"};function g(e){if(e)return e in W?W[e]:e}var Z=(...e)=>e.filter(Boolean).join(" ").trim(),l=(e,t,o=[],...a)=>{let n=Object.entries(t).filter(([,s])=>s!==!1&&s!==null&&s!==void 0).map(([s,c])=>`${e}--${s}_${c}`).join(" "),r=o.filter(s=>Object.entries(s).every(([c,i])=>t[c]===i)).map(s=>{let c=Object.entries(s).map(([i,d])=>`${i}_${d}`).join("-");return`${e}--${c}`}).join(" ");return Z(e,n,r,...a)};var S=require("react/jsx-runtime"),ee=["p","a","span","div","label","li","td","th","figcaption","blockquote","cite"],te=D.forwardRef(({as:e=ee[0],size:t="md",color:o,weight:a="normal",className:n,style:r,...s},c)=>{let i=e,p=l("cocso-body",{size:t},[],n);return(0,S.jsx)(i,{ref:c,className:p,style:{"--cocso-body-color":m(o),"--cocso-body-weight":g(a),...r},...s})}),oe=Object.assign(te,{displayName:"Body"});var T=u(require("react"),1);var F=u(require("react"),1);var b=require("react/jsx-runtime"),ne=["div"],se=F.forwardRef(({as:e=ne[0],size:t="md",color:o="palette.primary-500",bg:a="palette.gray-200",className:n,style:r,...s},c)=>{let i=e,p=l("cocso-spinner",{size:t},[],n);return(0,b.jsx)(i,{ref:c,className:p,style:{"--cocso-spinner-bg":m(a),"--cocso-spinner-color":m(o),...r},...s,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"})]})})}),E=Object.assign(se,{displayName:"Spinner"});var w=require("react/jsx-runtime"),re=["button"],ae=e=>({"2xs":"xs",xs:"xs",sm:"xs",md:"sm",lg:"md",xl:"md"})[e],ce=T.forwardRef(({as:e=re[0],variant:t="primary",size:o="md",disabled:a=!1,loading:n=!1,color:r,weight:s="normal",className:c,style:i,children:d,onClick:p,onKeyDown:R,...C},N)=>{let x=e,y=a||n,$=T.useCallback(h=>{if(y){h.preventDefault();return}p?.(h)},[y,p]),K=T.useCallback(h=>{(h.key==="Enter"||h.key===" ")&&(h.preventDefault(),y||h.currentTarget.click()),R?.(h)},[y,R]),_={variant:t,size:o,loading:n,disabled:y},I=[...a?[{variant:t,disabled:a}]:[],...n?[{variant:t,loading:n}]:[]],V=l("cocso-button",_,I,c),q={"--cocso-button-color":m(r),"--cocso-button-weight":g(s),...i};return(0,w.jsx)(x,{ref:N,className:V,onClick:$,onKeyDown:K,role:"button",disabled:y,"aria-disabled":y,"aria-busy":n,style:q,...C,children:n?(0,w.jsx)(E,{className:"cocso-button-spinner",size:ae(o),color:"currentColor"}):d})}),ie=Object.assign(ce,{displayName:"Button"});var B=u(require("react"),1);var O=require("react/jsx-runtime"),le=["h1","h2","h3","h4","h5","h6"],pe=B.forwardRef(({as:e=le[0],size:t="md",color:o,weight:a="bold",className:n,style:r,...s},c)=>{let i=e,p=l("cocso-display",{size:t},[],n);return(0,O.jsx)(i,{ref:c,className:p,style:{"--cocso-display-color":m(o),"--cocso-display-weight":g(a),...r},...s})}),me=Object.assign(pe,{displayName:"Display"});var L=u(require("react"),1);var z=require("react/jsx-runtime"),fe=["h1","h2","h3","h4","h5","h6"],de=L.forwardRef(({as:e=fe[1],size:t="md",color:o,weight:a="bold",className:n,style:r,...s},c)=>{let i=e,p=l("cocso-heading",{size:t},[],n);return(0,z.jsx)(i,{ref:c,className:p,style:{"--cocso-heading-color":m(o),"--cocso-heading-weight":g(a),...r},...s})}),ge=Object.assign(de,{displayName:"Heading"});var M=u(require("react"),1);var H=require("react/jsx-runtime"),he=["label","p","a","span","div","li","td","th","figcaption","blockquote","cite"],ye=M.forwardRef(({as:e=he[0],size:t="md",color:o,weight:a="normal",className:n,style:r,...s},c)=>{let i=e,p=l("cocso-label",{size:t},[],n);return(0,H.jsx)(i,{ref:c,className:p,style:{"--cocso-label-color":m(o),"--cocso-label-weight":g(a),...r},...s})}),v=Object.assign(ye,{displayName:"Label"});var j=u(require("react"),1);var f=require("react/jsx-runtime"),ue=j.forwardRef(({id:e,size:t="md",status:o,onChange:a,label:n,disabled:r=!1,className:s,...c},i)=>{let d={size:t,disabled:r,status:o},p=[...r?[{status:o,disabled:r}]:[]],R=l("cocso-checkbox-inner",d,p,s),C=()=>{r||a(o==="on"?"off":"on")};return(0,f.jsxs)("div",{ref:i,className:"cocso-checkbox",tabIndex:r?-1:0,role:"checkbox","aria-checked":o==="on"?"true":o==="intermediate"?"mixed":"false","aria-disabled":r,onKeyDown:x=>{(x.key==="Enter"||x.key===" ")&&(x.preventDefault(),C())},...c,children:[(0,f.jsxs)("div",{className:R,onClick:C,children:[(0,f.jsx)("div",{className:"cocso-checkbox-icon",style:{opacity:o==="on"?1:0},children:(0,f.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,f.jsx)("path",{d:"M20 6 9 17l-5-5"})})}),(0,f.jsx)("div",{className:"cocso-checkbox-icon",style:{opacity:o==="intermediate"?1:0},children:(0,f.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,f.jsx)("path",{d:"M5 12h14"})})}),(0,f.jsx)("input",{type:"checkbox",id:e,checked:o==="on",onChange:C,disabled:r})]}),n&&(0,f.jsx)(v,{className:l("cocso-checkbox-label",d),htmlFor:e,size:t,children:n})]})}),xe=Object.assign(ue,{displayName:"Checkbox"});

package/lib/index.d.ts

@@ -2,5 +2,6 @@ export * from './components/Body';
 export * from './components/Button';
 export * from './components/Display';
 export * from './components/Heading';
+export * from './components/Label';
 export * from './components/Checkbox';
 export * from './components/Spinner';

package/lib/index.js

@@ -1 +1 @@
-import*as E from"react";function m(e){if(e)return e.includes(".")?`var(--color-${e.replace(/\./g,"-")})`:e}var k={thin:"100",extralight:"200",light:"300",normal:"400",medium:"500",semibold:"600",bold:"700",extrabold:"800",black:"900"};function g(e){if(e)return e in k?k[e]:e}var j=(...e)=>e.filter(Boolean).join(" ").trim(),p=(e,r,t=[],...c)=>{let n=Object.entries(r).filter(([,o])=>o!==!1&&o!==null&&o!==void 0).map(([o,a])=>`${e}--${o}_${a}`).join(" "),s=t.filter(o=>Object.entries(o).every(([a,i])=>r[a]===i)).map(o=>{let a=Object.entries(o).map(([i,d])=>`${i}_${d}`).join("-");return`${e}--${a}`}).join(" ");return j(e,n,s,...c)};import{jsx as _}from"react/jsx-runtime";var $=["p","a","span","div","label","li","td","th","figcaption","blockquote","cite"],K=E.forwardRef(({as:e=$[0],size:r="md",color:t,weight:c="normal",className:n,style:s,...o},a)=>{let i=e,l=p("cocso-body",{size:r},[],n);return _(i,{ref:a,className:l,style:{"--cocso-body-color":m(t),"--cocso-body-weight":g(c),...s},...o})}),ae=Object.assign(K,{displayName:"Body"});import*as R from"react";import*as w from"react";import{jsx as C,jsxs as V}from"react/jsx-runtime";var L=["div"],I=w.forwardRef(({as:e=L[0],size:r="md",color:t="palette.primary-500",bg:c="palette.gray-200",className:n,style:s,...o},a)=>{let i=e,l=p("cocso-spinner",{size:r},[],n);return C(i,{ref:a,className:l,style:{"--cocso-spinner-bg":m(c),"--cocso-spinner-color":m(t),...s},...o,children:V("svg",{viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[C("circle",{className:"opacity-25",cx:"12",cy:"12",r:"9",stroke:"var(--cocso-spinner-bg, currentColor)",strokeWidth:"3"}),C("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"})]})})}),v=Object.assign(I,{displayName:"Spinner"});import{jsx as N}from"react/jsx-runtime";var A=["button"],G=e=>({"2xs":"xs",xs:"xs",sm:"xs",md:"sm",lg:"md",xl:"md"})[e],q=R.forwardRef(({as:e=A[0],variant:r="primary",size:t="md",disabled:c=!1,loading:n=!1,color:s,weight:o="normal",className:a,style:i,children:d,onClick:l,onKeyDown:b,...x},T)=>{let y=e,h=c||n,B=R.useCallback(f=>{if(h){f.preventDefault();return}l?.(f)},[h,l]),F=R.useCallback(f=>{(f.key==="Enter"||f.key===" ")&&(f.preventDefault(),h||f.currentTarget.click()),b?.(f)},[h,b]),O={variant:r,size:t,loading:n,disabled:h},z=[...c?[{variant:r,disabled:c}]:[],...n?[{variant:r,loading:n}]:[]],M=p("cocso-button",O,z,a),H={"--cocso-button-color":m(s),"--cocso-button-weight":g(o),...i};return N(y,{ref:T,className:M,onClick:B,onKeyDown:F,role:"button",disabled:h,"aria-disabled":h,"aria-busy":n,style:H,...x,children:n?N(v,{className:"cocso-button-spinner",size:G(t),color:"currentColor"}):d})}),be=Object.assign(q,{displayName:"Button"});import*as P from"react";import{jsx as U}from"react/jsx-runtime";var J=["h1","h2","h3","h4","h5","h6"],Q=P.forwardRef(({as:e=J[0],size:r="md",color:t,weight:c="bold",className:n,style:s,...o},a)=>{let i=e,l=p("cocso-display",{size:r},[],n);return U(i,{ref:a,className:l,style:{"--cocso-display-color":m(t),"--cocso-display-weight":g(c),...s},...o})}),Ne=Object.assign(Q,{displayName:"Display"});import*as D from"react";import{jsx as Z}from"react/jsx-runtime";var X=["h1","h2","h3","h4","h5","h6"],Y=D.forwardRef(({as:e=X[1],size:r="md",color:t,weight:c="bold",className:n,style:s,...o},a)=>{let i=e,l=p("cocso-heading",{size:r},[],n);return Z(i,{ref:a,className:l,style:{"--cocso-heading-color":m(t),"--cocso-heading-weight":g(c),...s},...o})}),Oe=Object.assign(Y,{displayName:"Heading"});import*as S from"react";import{jsx as u,jsxs as W}from"react/jsx-runtime";var ee=S.forwardRef(({id:e,size:r="md",status:t,onChange:c,label:n,disabled:s=!1,className:o,...a},i)=>{let d={size:r,disabled:s,status:t},l=[...s?[{status:t,disabled:s}]:[]],b=p("cocso-checkbox-inner",d,l,o),x=()=>{s||c(t==="on"?"off":"on")};return W("div",{ref:i,className:"cocso-checkbox",tabIndex:s?-1:0,role:"checkbox","aria-checked":t==="on"?"true":t==="intermediate"?"mixed":"false","aria-disabled":s,onKeyDown:y=>{(y.key==="Enter"||y.key===" ")&&(y.preventDefault(),x())},...a,children:[W("div",{className:b,onClick:x,children:[u("div",{className:"cocso-checkbox-icon",style:{opacity:t==="on"?1:0},children:u("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round",className:"lucide lucide-check-icon lucide-check",children:u("path",{d:"M20 6 9 17l-5-5"})})}),u("div",{className:"cocso-checkbox-icon",style:{opacity:t==="intermediate"?1:0},children:u("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"3","stroke-linecap":"round","stroke-linejoin":"round",className:"lucide lucide-minus-icon lucide-minus",children:u("path",{d:"M5 12h14"})})}),u("input",{type:"checkbox",id:e,checked:t==="on",onChange:x,disabled:s})]}),n&&u("label",{htmlFor:e,children:n})]})}),Ke=Object.assign(ee,{displayName:"Checkbox"});export{ae as Body,be as Button,Ke as Checkbox,Ne as Display,Oe as Heading,v as Spinner};
+import*as E from"react";function m(e){if(e)return e.includes(".")?`var(--color-${e.replace(/\./g,"-")})`:e}var k={thin:"100",extralight:"200",light:"300",normal:"400",medium:"500",semibold:"600",bold:"700",extrabold:"800",black:"900"};function d(e){if(e)return e in k?k[e]:e}var $=(...e)=>e.filter(Boolean).join(" ").trim(),l=(e,r,t=[],...c)=>{let n=Object.entries(r).filter(([,o])=>o!==!1&&o!==null&&o!==void 0).map(([o,a])=>`${e}--${o}_${a}`).join(" "),s=t.filter(o=>Object.entries(o).every(([a,i])=>r[a]===i)).map(o=>{let a=Object.entries(o).map(([i,f])=>`${i}_${f}`).join("-");return`${e}--${a}`}).join(" ");return $(e,n,s,...c)};import{jsx as I}from"react/jsx-runtime";var K=["p","a","span","div","label","li","td","th","figcaption","blockquote","cite"],_=E.forwardRef(({as:e=K[0],size:r="md",color:t,weight:c="normal",className:n,style:s,...o},a)=>{let i=e,p=l("cocso-body",{size:r},[],n);return I(i,{ref:a,className:p,style:{"--cocso-body-color":m(t),"--cocso-body-weight":d(c),...s},...o})}),me=Object.assign(_,{displayName:"Body"});import*as b from"react";import*as w from"react";import{jsx as T,jsxs as A}from"react/jsx-runtime";var V=["div"],q=w.forwardRef(({as:e=V[0],size:r="md",color:t="palette.primary-500",bg:c="palette.gray-200",className:n,style:s,...o},a)=>{let i=e,p=l("cocso-spinner",{size:r},[],n);return T(i,{ref:a,className:p,style:{"--cocso-spinner-bg":m(c),"--cocso-spinner-color":m(t),...s},...o,children:A("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"})]})})}),v=Object.assign(q,{displayName:"Spinner"});import{jsx as N}from"react/jsx-runtime";var G=["button"],J=e=>({"2xs":"xs",xs:"xs",sm:"xs",md:"sm",lg:"md",xl:"md"})[e],Q=b.forwardRef(({as:e=G[0],variant:r="primary",size:t="md",disabled:c=!1,loading:n=!1,color:s,weight:o="normal",className:a,style:i,children:f,onClick:p,onKeyDown:C,...x},R)=>{let u=e,y=c||n,O=b.useCallback(g=>{if(y){g.preventDefault();return}p?.(g)},[y,p]),L=b.useCallback(g=>{(g.key==="Enter"||g.key===" ")&&(g.preventDefault(),y||g.currentTarget.click()),C?.(g)},[y,C]),z={variant:r,size:t,loading:n,disabled:y},M=[...c?[{variant:r,disabled:c}]:[],...n?[{variant:r,loading:n}]:[]],H=l("cocso-button",z,M,a),j={"--cocso-button-color":m(s),"--cocso-button-weight":d(o),...i};return N(u,{ref:R,className:H,onClick:O,onKeyDown:L,role:"button",disabled:y,"aria-disabled":y,"aria-busy":n,style:j,...x,children:n?N(v,{className:"cocso-button-spinner",size:J(t),color:"currentColor"}):f})}),we=Object.assign(Q,{displayName:"Button"});import*as P from"react";import{jsx as Y}from"react/jsx-runtime";var U=["h1","h2","h3","h4","h5","h6"],X=P.forwardRef(({as:e=U[0],size:r="md",color:t,weight:c="bold",className:n,style:s,...o},a)=>{let i=e,p=l("cocso-display",{size:r},[],n);return Y(i,{ref:a,className:p,style:{"--cocso-display-color":m(t),"--cocso-display-weight":d(c),...s},...o})}),Fe=Object.assign(X,{displayName:"Display"});import*as W from"react";import{jsx as te}from"react/jsx-runtime";var Z=["h1","h2","h3","h4","h5","h6"],ee=W.forwardRef(({as:e=Z[1],size:r="md",color:t,weight:c="bold",className:n,style:s,...o},a)=>{let i=e,p=l("cocso-heading",{size:r},[],n);return te(i,{ref:a,className:p,style:{"--cocso-heading-color":m(t),"--cocso-heading-weight":d(c),...s},...o})}),je=Object.assign(ee,{displayName:"Heading"});import*as D from"react";import{jsx as se}from"react/jsx-runtime";var oe=["label","p","a","span","div","li","td","th","figcaption","blockquote","cite"],ne=D.forwardRef(({as:e=oe[0],size:r="md",color:t,weight:c="normal",className:n,style:s,...o},a)=>{let i=e,p=l("cocso-label",{size:r},[],n);return se(i,{ref:a,className:p,style:{"--cocso-label-color":m(t),"--cocso-label-weight":d(c),...s},...o})}),S=Object.assign(ne,{displayName:"Label"});import*as B from"react";import{jsx as h,jsxs as F}from"react/jsx-runtime";var re=B.forwardRef(({id:e,size:r="md",status:t,onChange:c,label:n,disabled:s=!1,className:o,...a},i)=>{let f={size:r,disabled:s,status:t},p=[...s?[{status:t,disabled:s}]:[]],C=l("cocso-checkbox-inner",f,p,o),x=()=>{s||c(t==="on"?"off":"on")};return F("div",{ref:i,className:"cocso-checkbox",tabIndex:s?-1:0,role:"checkbox","aria-checked":t==="on"?"true":t==="intermediate"?"mixed":"false","aria-disabled":s,onKeyDown:u=>{(u.key==="Enter"||u.key===" ")&&(u.preventDefault(),x())},...a,children:[F("div",{className:C,onClick:x,children:[h("div",{className:"cocso-checkbox-icon",style:{opacity:t==="on"?1:0},children:h("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:h("path",{d:"M20 6 9 17l-5-5"})})}),h("div",{className:"cocso-checkbox-icon",style:{opacity:t==="intermediate"?1:0},children:h("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:h("path",{d:"M5 12h14"})})}),h("input",{type:"checkbox",id:e,checked:t==="on",onChange:x,disabled:s})]}),n&&h(S,{className:l("cocso-checkbox-label",f),htmlFor:e,size:r,children:n})]})}),Ye=Object.assign(re,{displayName:"Checkbox"});export{me as Body,we as Button,Ye as Checkbox,Fe as Display,je as Heading,S as Label,v as Spinner};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cocso-ui/react",
-  "version": "0.0.1-beta.12",
+  "version": "0.0.1-beta.14",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/cocso/cocso-ui.git",

package/lib/utils/polymorphic.d.ts

@@ -1,9 +0,0 @@
-import * as React from 'react';
-type AsProp<T extends React.ElementType> = {
-    as?: T;
-};
-export type PolymorphicRef<T extends React.ElementType> = React.ComponentPropsWithRef<T>['ref'];
-export type PolymorphicComponentProps<T extends React.ElementType, Props = {}> = AsProp<T> & React.ComponentPropsWithoutRef<T> & Props & {
-    ref?: PolymorphicRef<T>;
-};
-export {};