@cocso-ui/react 0.0.1-beta.21 → 0.0.1-beta.24

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,16 @@
1
+ import * as React from 'react';
2
+ import { type FontWeightToken } from '../../utils/token';
3
+ export type LinkProps = {
4
+ asChild?: boolean;
5
+ size?: 'lg' | 'md' | 'sm' | 'xs';
6
+ weight?: FontWeightToken;
7
+ indicator?: boolean;
8
+ } & React.ComponentPropsWithoutRef<'a'>;
9
+ export declare const Link: React.ForwardRefExoticComponent<{
10
+ asChild?: boolean;
11
+ size?: "lg" | "md" | "sm" | "xs";
12
+ weight?: FontWeightToken;
13
+ indicator?: boolean;
14
+ } & Omit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & React.RefAttributes<HTMLAnchorElement>> & {
15
+ displayName: string;
16
+ };
@@ -0,0 +1 @@
1
+ export * from './Link';
@@ -0,0 +1,7 @@
1
+ import * as ModalPrimitive from '@radix-ui/react-dialog';
2
+ export declare const Modal: import("react").FC<ModalPrimitive.DialogProps> & {
3
+ Trigger: import("react").ForwardRefExoticComponent<ModalPrimitive.DialogTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
4
+ Content: import("react").ForwardRefExoticComponent<Omit<ModalPrimitive.DialogContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<never>>;
5
+ Title: import("react").ForwardRefExoticComponent<Omit<ModalPrimitive.DialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>, "ref"> & import("react").RefAttributes<never>>;
6
+ Description: import("react").ForwardRefExoticComponent<Omit<ModalPrimitive.DialogDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>, "ref"> & import("react").RefAttributes<never>>;
7
+ };
@@ -0,0 +1 @@
1
+ export * from './Modal';
package/lib/index.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";var oe=Object.create;var k=Object.defineProperty;var te=Object.getOwnPropertyDescriptor;var re=Object.getOwnPropertyNames;var ne=Object.getPrototypeOf,se=Object.prototype.hasOwnProperty;var ie=(e,o)=>{for(var t in o)k(e,t,{get:o[t],enumerable:!0})},E=(e,o,t,n)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of re(o))!se.call(e,r)&&r!==t&&k(e,r,{get:()=>o[r],enumerable:!(n=te(o,r))||n.enumerable});return e};var u=(e,o,t)=>(t=e!=null?oe(ne(e)):{},E(o||!e||!e.__esModule?k(t,"default",{value:e,enumerable:!0}):t,e)),ce=e=>E(k({},"__esModule",{value:!0}),e);var Te={};ie(Te,{Accordion:()=>de,Body:()=>ge,Button:()=>be,Checkbox:()=>we,Display:()=>Re,Heading:()=>Pe,Label:()=>L,Spinner:()=>S});module.exports=ce(Te);var h=u(require("@radix-ui/react-accordion"),1),N=require("react");var ae=(...e)=>e.filter(Boolean).join(" ").trim(),a=(e,o,t=[],...n)=>{let r=Object.entries(o).filter(([,s])=>s!==!1&&s!==null&&s!==void 0).map(([s,c])=>`${e}--${s}_${c}`).join(" "),i=t.filter(s=>Object.entries(s).every(([c,p])=>o[c]===p)).map(s=>{let c=Object.entries(s).map(([p,m])=>`${p}_${m}`).join("-");return`${e}--${c}`}).join(" ");return ae(e,r,i,...n)};var F=require("@radix-ui/react-slot"),x=require("react/jsx-runtime"),me=(0,N.forwardRef)(({className:e,...o},t)=>{let n=a("cocso-accordion-item",{},[],e);return(0,x.jsx)(h.Item,{ref:t,className:n,...o})}),pe=(0,N.forwardRef)(({className:e,children:o,chevron:t=!0,...n},r)=>{let i=a("cocso-accordion-trigger",{},[],e);return(0,x.jsx)(h.Trigger,{ref:r,className:i,...n,children:(0,x.jsxs)(F.Slottable,{children:[o,t&&(0,x.jsx)("div",{className:"cocso-accordion-chevron",children:(0,x.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,x.jsx)("path",{d:"m6 9 6 6 6-6"})})})]})})}),le=(0,N.forwardRef)(({className:e,...o},t)=>{let n=a("cocso-accordion-content",{},[],e);return(0,x.jsx)(h.Content,{ref:t,className:n,...o})}),de=Object.assign(h.Root,{Item:me,Header:h.Header,Trigger:pe,Content:le});var H=u(require("react"),1),O=require("@radix-ui/react-slot");function l(e){if(e)return e.includes(".")?`var(--color-${e.replace(/\./g,"-")})`:e}var A={thin:"100",extralight:"200",light:"300",normal:"400",medium:"500",semibold:"600",bold:"700",extrabold:"800",black:"900"};function C(e){if(e)return e in A?A[e]:e}var M=require("react/jsx-runtime"),fe=H.forwardRef(({asChild:e=!1,size:o="md",color:t,weight:n="normal",className:r,style:i,...s},c)=>{let m=a("cocso-body",{size:o},[],r);return(0,M.jsx)(e?O.Slot:"p",{ref:c,className:m,style:{"--cocso-body-color":l(t),"--cocso-body-weight":C(n),...i},...s})}),ge=Object.assign(fe,{displayName:"Body"});var v=u(require("react"),1),D=require("@radix-ui/react-slot");var z=u(require("react"),1);var R=require("react/jsx-runtime"),he=["div"],Ce=z.forwardRef(({as:e=he[0],size:o="md",color:t="palette.primary-500",bg:n="palette.gray-200",className:r,style:i,...s},c)=>{let p=e,f=a("cocso-spinner",{size:o},[],r);return(0,R.jsx)(p,{ref:c,className:f,style:{"--cocso-spinner-bg":l(n),"--cocso-spinner-color":l(t),...i},...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"})]})})}),S=Object.assign(Ce,{displayName:"Spinner"});var W=require("react/jsx-runtime"),ue=e=>({"2xs":"xs",xs:"xs",sm:"xs",md:"sm",lg:"md",xl:"md"})[e],xe=v.forwardRef(({asChild:e=!1,variant:o="primary",size:t="md",disabled:n=!1,loading:r=!1,color:i,weight:s="normal",className:c,style:p,children:m,onClick:f,onKeyDown:P,...T},B)=>{let g=n||r,y=v.useCallback(b=>{if(g){b.preventDefault();return}f?.(b)},[g,f]),U=v.useCallback(b=>{(b.key==="Enter"||b.key===" ")&&(b.preventDefault(),g||b.currentTarget.click()),P?.(b)},[g,P]),X={variant:o,size:t,loading:r,disabled:g},Y=[...n?[{variant:o,disabled:n}]:[],...r?[{variant:o,loading:r}]:[]],Z=a("cocso-button",X,Y,c),ee={"--cocso-button-color":l(i),"--cocso-button-weight":C(s),...p};return(0,W.jsx)(e?D.Slot:"button",{ref:B,className:Z,onClick:y,onKeyDown:U,role:"button",disabled:g,"aria-disabled":g,"aria-busy":r,style:ee,...T,children:r?(0,W.jsx)(S,{className:"cocso-button-spinner",size:ue(t),color:"currentColor"}):m})}),be=Object.assign(xe,{displayName:"Button"});var j=u(require("react"),1),I=require("@radix-ui/react-slot");var $=require("react/jsx-runtime"),ye=j.forwardRef(({asChild:e=!1,size:o="md",color:t,weight:n="bold",className:r,style:i,...s},c)=>{let m=a("cocso-display",{size:o},[],r);return(0,$.jsx)(e?I.Slot:"h1",{ref:c,className:m,style:{"--cocso-display-color":l(t),"--cocso-display-weight":C(n),...i},...s})}),Re=Object.assign(ye,{displayName:"Display"});var _=u(require("react"),1),V=require("@radix-ui/react-slot");var G=require("react/jsx-runtime"),ve=_.forwardRef(({asChild:e=!1,size:o="md",color:t,weight:n="bold",className:r,style:i,...s},c)=>{let m=a("cocso-heading",{size:o},[],r);return(0,G.jsx)(e?V.Slot:"h2",{ref:c,className:m,style:{"--cocso-heading-color":l(t),"--cocso-heading-weight":C(n),...i},...s})}),Pe=Object.assign(ve,{displayName:"Heading"});var K=u(require("react"),1),q=require("@radix-ui/react-slot");var J=require("react/jsx-runtime"),ke=K.forwardRef(({asChild:e=!1,size:o="md",color:t,weight:n="normal",className:r,style:i,...s},c)=>{let m=a("cocso-label",{size:o},[],r);return(0,J.jsx)(e?q.Slot:"label",{ref:c,className:m,style:{"--cocso-label-color":l(t),"--cocso-label-weight":C(n),...i},...s})}),L=Object.assign(ke,{displayName:"Label"});var Q=u(require("react"),1),w=u(require("@radix-ui/react-checkbox"),1);var d=require("react/jsx-runtime"),Ne=Q.forwardRef(({id:e,size:o="md",status:t,onChange:n,label:r,disabled:i=!1,className:s,...c},p)=>{let m={size:o,disabled:i,status:t},f=[...i?[{status:t,disabled:i}]:[]],P=a("cocso-checkbox",m,f,s),T=g=>{if(!i){let y;g===!0?y="on":g==="indeterminate"?y="intermediate":y="off",n(y)}};return(0,d.jsxs)("div",{className:"cocso-checkbox-wrapper",children:[(0,d.jsxs)(w.Root,{ref:p,id:e,className:P,checked:(()=>{switch(t){case"on":return!0;case"intermediate":return"indeterminate";case"off":default:return!1}})(),onCheckedChange:T,disabled:i,...c,children:[(0,d.jsx)(w.Indicator,{className:"cocso-checkbox-indicator",style:{opacity:t==="on"?1:0},children:(0,d.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,d.jsx)("path",{d:"M20 6 9 17l-5-5"})})}),(0,d.jsx)("div",{className:"cocso-checkbox-indicator",style:{opacity:t==="intermediate"?1:0},children:(0,d.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,d.jsx)("path",{d:"M5 12h14"})})})]}),r&&(0,d.jsx)(L,{className:a("cocso-checkbox-label",m),size:o,htmlFor:e,children:r})]})}),we=Object.assign(Ne,{displayName:"Checkbox"});
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 x=C(require("@radix-ui/react-accordion"),1),T=require("react"),D=require("@radix-ui/react-slot"),P=require("react/jsx-runtime"),uo=(0,T.forwardRef)(({className:o,...e},t)=>(0,P.jsx)(x.Item,{ref:t,className:"cocso-accordion-item",...e})),yo=(0,T.forwardRef)(({className:o,children:e,chevron:t=!0,...i},r)=>(0,P.jsx)(x.Trigger,{ref:r,className:"cocso-accordion-trigger",...i,children:(0,P.jsxs)(D.Slottable,{children:[e,t&&(0,P.jsx)("div",{className:"cocso-accordion-chevron",children:(0,P.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,P.jsx)("path",{d:"m6 9 6 6 6-6"})})})]})})),xo=(0,T.forwardRef)(({className:o,...e},t)=>(0,P.jsx)(x.Content,{ref:t,className:"cocso-accordion-content",...e})),Po=Object.assign(x.Root,{Item:uo,Header:x.Header,Trigger:yo,Content:xo});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 bo=(...o)=>o.filter(Boolean).join(" ").trim(),c=(o,e,t=[],...i)=>{let r=Object.entries(e).filter(([,n])=>n!==!1&&n!==null&&n!==void 0).map(([n,a])=>`${o}--${n}_${a}`).join(" "),s=t.filter(n=>Object.entries(n).every(([a,p])=>e[a]===p)).map(n=>{let a=Object.entries(n).map(([p,m])=>`${p}_${m}`).join("-");return`${o}--${a}`}).join(" ");return bo(o,r,s,...i)};var $=require("react/jsx-runtime"),vo=j.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:i="normal",className:r,style:s,...n},a)=>{let m=c("cocso-body",{size:e},[],r);return(0,$.jsx)(o?I.Slot:"p",{ref:a,className:m,style:{"--cocso-body-color":f(t),"--cocso-body-weight":g(i),...s},...n})}),L=Object.assign(vo,{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:s,...n},a)=>{let p=o,h=c("cocso-spinner",{size:e},[],r);return(0,R.jsx)(p,{ref:a,className:h,style:{"--cocso-spinner-bg":f(i),"--cocso-spinner-color":f(t),...s},...n,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:s,weight:n="normal",className:a,style:p,children:m,onClick:h,onKeyDown:N,...S},A)=>{let y=i||r,v=k.useCallback(b=>{if(y){b.preventDefault();return}h?.(b)},[y,h]),io=k.useCallback(b=>{(b.key==="Enter"||b.key===" ")&&(b.preventDefault(),y||b.currentTarget.click()),N?.(b)},[y,N]),no={variant:e,size:t,loading:r,disabled:y},so=[...i?[{variant:e,disabled:i}]:[],...r?[{variant:e,loading:r}]:[]],ao=c("cocso-button",no,so,a),co={"--cocso-button-color":f(s),"--cocso-button-weight":g(n),...p};return(0,F.jsx)(o?V.Slot:"button",{ref:A,className:ao,onClick:v,onKeyDown:io,role:"button",disabled:y,"aria-disabled":y,"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:s,...n},a)=>{let m=c("cocso-display",{size:e},[],r);return(0,q.jsx)(o?K.Slot:"h1",{ref:a,className:m,style:{"--cocso-display-color":f(t),"--cocso-display-weight":g(i),...s},...n})}),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:s,...n},a)=>{let m=c("cocso-heading",{size:e},[],r);return(0,U.jsx)(o?Q.Slot:"h2",{ref:a,className:m,style:{"--cocso-heading-color":f(t),"--cocso-heading-weight":g(i),...s},...n})}),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:s,...n},a)=>{let m=c("cocso-label",{size:e},[],r);return(0,Z.jsx)(o?Y.Slot:"label",{ref:a,className:m,style:{"--cocso-label-color":f(t),"--cocso-label-weight":g(i),...s},...n})}),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:s,...n},a)=>{let m=c("cocso-link",{size:e,indicator:i},[],r);return(0,to.jsx)(o?eo.Slot:"a",{ref:a,className:m,style:{"--cocso-link-weight":g(t),...s},...n})}),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)=>(0,d.jsxs)(l.Portal,{children:[(0,d.jsx)(l.Overlay,{className:"cocso-modal-overlay"}),(0,d.jsxs)(l.Content,{ref:i,className:"cocso-modal-content",...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)=>(0,d.jsx)(l.Title,{ref:i,className:"cocso-modal-title",asChild:!0,...t,children:(0,d.jsx)(E,{color:"text.basic",children:e})})),Ao=(0,W.forwardRef)(({className:o,children:e,...t},i)=>(0,d.jsx)(l.Description,{ref:i,className:"cocso-modal-description",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:s=!1,className:n,...a},p)=>{let m={size:e,disabled:s,status:t},h=[...s?[{status:t,disabled:s}]:[]],N=c("cocso-checkbox",m,h,n),S=y=>{if(!s){let v;y===!0?v="on":y==="indeterminate"?v="intermediate":v="off",i(v)}};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:s,...a,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:c("cocso-checkbox-label",{disabled:s}),size:e,htmlFor:o,children:r})]})}),zo=Object.assign(Do,{displayName:"Checkbox"});
package/lib/index.d.ts CHANGED
@@ -4,5 +4,7 @@ export * from './components/Button';
4
4
  export * from './components/Display';
5
5
  export * from './components/Heading';
6
6
  export * from './components/Label';
7
+ export * from './components/Link';
8
+ export * from './components/Modal';
7
9
  export * from './components/Checkbox';
8
10
  export * from './components/Spinner';
package/lib/index.js CHANGED
@@ -1 +1 @@
1
- import*as g from"@radix-ui/react-accordion";import{forwardRef as k}from"react";var _=(...e)=>e.filter(Boolean).join(" ").trim(),a=(e,o,t=[],...r)=>{let n=Object.entries(o).filter(([,s])=>s!==!1&&s!==null&&s!==void 0).map(([s,c])=>`${e}--${s}_${c}`).join(" "),i=t.filter(s=>Object.entries(s).every(([c,p])=>o[c]===p)).map(s=>{let c=Object.entries(s).map(([p,m])=>`${p}_${m}`).join("-");return`${e}--${c}`}).join(" ");return _(e,n,i,...r)};import{Slottable as V}from"@radix-ui/react-slot";import{jsx as b,jsxs as J}from"react/jsx-runtime";var G=k(({className:e,...o},t)=>{let r=a("cocso-accordion-item",{},[],e);return b(g.Item,{ref:t,className:r,...o})}),K=k(({className:e,children:o,chevron:t=!0,...r},n)=>{let i=a("cocso-accordion-trigger",{},[],e);return b(g.Trigger,{ref:n,className:i,...r,children:J(V,{children:[o,t&&b("div",{className:"cocso-accordion-chevron",children:b("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:b("path",{d:"m6 9 6 6 6-6"})})})]})})}),q=k(({className:e,...o},t)=>{let r=a("cocso-accordion-content",{},[],e);return b(g.Content,{ref:t,className:r,...o})}),ve=Object.assign(g.Root,{Item:G,Header:g.Header,Trigger:K,Content:q});import*as S from"react";import{Slot as Q}from"@radix-ui/react-slot";function l(e){if(e)return e.includes(".")?`var(--color-${e.replace(/\./g,"-")})`:e}var T={thin:"100",extralight:"200",light:"300",normal:"400",medium:"500",semibold:"600",bold:"700",extrabold:"800",black:"900"};function h(e){if(e)return e in T?T[e]:e}import{jsx as X}from"react/jsx-runtime";var U=S.forwardRef(({asChild:e=!1,size:o="md",color:t,weight:r="normal",className:n,style:i,...s},c)=>{let m=a("cocso-body",{size:o},[],n);return X(e?Q:"p",{ref:c,className:m,style:{"--cocso-body-color":l(t),"--cocso-body-weight":h(r),...i},...s})}),Be=Object.assign(U,{displayName:"Body"});import*as y from"react";import{Slot as oe}from"@radix-ui/react-slot";import*as W from"react";import{jsx as N,jsxs as ee}from"react/jsx-runtime";var Y=["div"],Z=W.forwardRef(({as:e=Y[0],size:o="md",color:t="palette.primary-500",bg:r="palette.gray-200",className:n,style:i,...s},c)=>{let p=e,d=a("cocso-spinner",{size:o},[],n);return N(p,{ref:c,className:d,style:{"--cocso-spinner-bg":l(r),"--cocso-spinner-color":l(t),...i},...s,children:ee("svg",{viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[N("circle",{className:"opacity-25",cx:"12",cy:"12",r:"9",stroke:"var(--cocso-spinner-bg, currentColor)",strokeWidth:"3"}),N("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(Z,{displayName:"Spinner"});import{jsx as B}from"react/jsx-runtime";var te=e=>({"2xs":"xs",xs:"xs",sm:"xs",md:"sm",lg:"md",xl:"md"})[e],re=y.forwardRef(({asChild:e=!1,variant:o="primary",size:t="md",disabled:r=!1,loading:n=!1,color:i,weight:s="normal",className:c,style:p,children:m,onClick:d,onKeyDown:R,...P},w)=>{let f=r||n,x=y.useCallback(C=>{if(f){C.preventDefault();return}d?.(C)},[f,d]),z=y.useCallback(C=>{(C.key==="Enter"||C.key===" ")&&(C.preventDefault(),f||C.currentTarget.click()),R?.(C)},[f,R]),D={variant:o,size:t,loading:n,disabled:f},j=[...r?[{variant:o,disabled:r}]:[],...n?[{variant:o,loading:n}]:[]],I=a("cocso-button",D,j,c),$={"--cocso-button-color":l(i),"--cocso-button-weight":h(s),...p};return B(e?oe:"button",{ref:w,className:I,onClick:x,onKeyDown:z,role:"button",disabled:f,"aria-disabled":f,"aria-busy":n,style:$,...P,children:n?B(L,{className:"cocso-button-spinner",size:te(t),color:"currentColor"}):m})}),Ke=Object.assign(re,{displayName:"Button"});import*as E from"react";import{Slot as ne}from"@radix-ui/react-slot";import{jsx as ie}from"react/jsx-runtime";var se=E.forwardRef(({asChild:e=!1,size:o="md",color:t,weight:r="bold",className:n,style:i,...s},c)=>{let m=a("cocso-display",{size:o},[],n);return ie(e?ne:"h1",{ref:c,className:m,style:{"--cocso-display-color":l(t),"--cocso-display-weight":h(r),...i},...s})}),eo=Object.assign(se,{displayName:"Display"});import*as F from"react";import{Slot as ce}from"@radix-ui/react-slot";import{jsx as me}from"react/jsx-runtime";var ae=F.forwardRef(({asChild:e=!1,size:o="md",color:t,weight:r="bold",className:n,style:i,...s},c)=>{let m=a("cocso-heading",{size:o},[],n);return me(e?ce:"h2",{ref:c,className:m,style:{"--cocso-heading-color":l(t),"--cocso-heading-weight":h(r),...i},...s})}),ao=Object.assign(ae,{displayName:"Heading"});import*as A from"react";import{Slot as pe}from"@radix-ui/react-slot";import{jsx as de}from"react/jsx-runtime";var le=A.forwardRef(({asChild:e=!1,size:o="md",color:t,weight:r="normal",className:n,style:i,...s},c)=>{let m=a("cocso-label",{size:o},[],n);return de(e?pe:"label",{ref:c,className:m,style:{"--cocso-label-color":l(t),"--cocso-label-weight":h(r),...i},...s})}),H=Object.assign(le,{displayName:"Label"});import*as M from"react";import*as v from"@radix-ui/react-checkbox";import{jsx as u,jsxs as O}from"react/jsx-runtime";var fe=M.forwardRef(({id:e,size:o="md",status:t,onChange:r,label:n,disabled:i=!1,className:s,...c},p)=>{let m={size:o,disabled:i,status:t},d=[...i?[{status:t,disabled:i}]:[]],R=a("cocso-checkbox",m,d,s),P=f=>{if(!i){let x;f===!0?x="on":f==="indeterminate"?x="intermediate":x="off",r(x)}};return O("div",{className:"cocso-checkbox-wrapper",children:[O(v.Root,{ref:p,id:e,className:R,checked:(()=>{switch(t){case"on":return!0;case"intermediate":return"indeterminate";case"off":default:return!1}})(),onCheckedChange:P,disabled:i,...c,children:[u(v.Indicator,{className:"cocso-checkbox-indicator",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",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:u("path",{d:"M20 6 9 17l-5-5"})})}),u("div",{className:"cocso-checkbox-indicator",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",strokeWidth:"3",strokeLinecap:"round",strokeLinejoin:"round",children:u("path",{d:"M5 12h14"})})})]}),n&&u(H,{className:a("cocso-checkbox-label",m),size:o,htmlFor:e,children:n})]})}),Po=Object.assign(fe,{displayName:"Checkbox"});export{ve as Accordion,Be as Body,Ke as Button,Po as Checkbox,eo as Display,ao as Heading,H as Label,L as Spinner};
1
+ import*as C from"@radix-ui/react-accordion";import{forwardRef as w}from"react";import{Slottable as U}from"@radix-ui/react-slot";import{jsx as b,jsxs as oo}from"react/jsx-runtime";var X=w(({className:o,...e},t)=>b(C.Item,{ref:t,className:"cocso-accordion-item",...e})),Y=w(({className:o,children:e,chevron:t=!0,...r},i)=>b(C.Trigger,{ref:i,className:"cocso-accordion-trigger",...r,children:oo(U,{children:[e,t&&b("div",{className:"cocso-accordion-chevron",children:b("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:b("path",{d:"m6 9 6 6 6-6"})})})]})})),Z=w(({className:o,...e},t)=>b(C.Content,{ref:t,className:"cocso-accordion-content",...e})),Eo=Object.assign(C.Root,{Item:X,Header:C.Header,Trigger:Y,Content:Z});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}var eo=(...o)=>o.filter(Boolean).join(" ").trim(),c=(o,e,t=[],...r)=>{let i=Object.entries(e).filter(([,n])=>n!==!1&&n!==null&&n!==void 0).map(([n,a])=>`${o}--${n}_${a}`).join(" "),s=t.filter(n=>Object.entries(n).every(([a,p])=>e[a]===p)).map(n=>{let a=Object.entries(n).map(([p,m])=>`${p}_${m}`).join("-");return`${o}--${a}`}).join(" ");return eo(o,i,s,...r)};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:s,...n},a)=>{let m=c("cocso-body",{size:e},[],i);return io(o?to:"p",{ref:a,className:m,style:{"--cocso-body-color":d(t),"--cocso-body-weight":f(r),...s},...n})}),F=Object.assign(ro,{displayName:"Body"});import*as v 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 no=["div"],so=E.forwardRef(({as:o=no[0],size:e="md",color:t="palette.primary-500",bg:r="palette.gray-200",className:i,style:s,...n},a)=>{let p=o,g=c("cocso-spinner",{size:e},[],i);return T(p,{ref:a,className:g,style:{"--cocso-spinner-bg":d(r),"--cocso-spinner-color":d(t),...s},...n,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(so,{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=v.forwardRef(({asChild:o=!1,variant:e="primary",size:t="md",disabled:r=!1,loading:i=!1,color:s,weight:n="normal",className:a,style:p,children:m,onClick:g,onKeyDown:R,...N},S)=>{let h=r||i,P=v.useCallback(y=>{if(h){y.preventDefault();return}g?.(y)},[h,g]),G=v.useCallback(y=>{(y.key==="Enter"||y.key===" ")&&(y.preventDefault(),h||y.currentTarget.click()),R?.(y)},[h,R]),K={variant:e,size:t,loading:i,disabled:h},q=[...r?[{variant:e,disabled:r}]:[],...i?[{variant:e,loading:i}]:[]],J=c("cocso-button",K,q,a),Q={"--cocso-button-color":d(s),"--cocso-button-weight":f(n),...p};return A(o?co:"button",{ref:S,className:J,onClick:P,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})}),ie=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:s,...n},a)=>{let m=c("cocso-display",{size:e},[],i);return go(o?po:"h1",{ref:a,className:m,style:{"--cocso-display-color":d(t),"--cocso-display-weight":f(r),...s},...n})}),de=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:s,...n},a)=>{let m=c("cocso-heading",{size:e},[],i);return uo(o?ho:"h2",{ref:a,className:m,style:{"--cocso-heading-color":d(t),"--cocso-heading-weight":f(r),...s},...n})}),z=Object.assign(Co,{displayName:"Heading"});import*as j from"react";import{Slot as yo}from"@radix-ui/react-slot";import{jsx as Po}from"react/jsx-runtime";var xo=j.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:r="normal",className:i,style:s,...n},a)=>{let m=c("cocso-label",{size:e},[],i);return Po(o?yo:"label",{ref:a,className:m,style:{"--cocso-label-color":d(t),"--cocso-label-weight":f(r),...s},...n})}),I=Object.assign(xo,{displayName:"Label"});import*as $ from"react";import{Slot as bo}from"@radix-ui/react-slot";import{jsx as Ro}from"react/jsx-runtime";var vo=$.forwardRef(({asChild:o=!1,size:e="md",weight:t="normal",indicator:r=!0,className:i,style:s,...n},a)=>{let m=c("cocso-link",{size:e,indicator:r},[],i);return Ro(o?bo:"a",{ref:a,className:m,style:{"--cocso-link-weight":f(t),...s},...n})}),Ee=Object.assign(vo,{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)=>W(l.Portal,{children:[u(l.Overlay,{className:"cocso-modal-overlay"}),W(l.Content,{ref:r,className:"cocso-modal-content",...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)=>u(l.Title,{ref:r,className:"cocso-modal-title",asChild:!0,...t,children:u(z,{color:"text.basic",children:e})})),wo=M(({className:o,children:e,...t},r)=>u(l.Description,{ref:r,className:"cocso-modal-description",asChild:!0,...t,children:u(F,{size:"sm",color:"text.subtle",children:e})})),Ve=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 x,jsxs as _}from"react/jsx-runtime";var To=V.forwardRef(({id:o,size:e="md",status:t,onChange:r,label:i,disabled:s=!1,className:n,...a},p)=>{let m={size:e,disabled:s,status:t},g=[...s?[{status:t,disabled:s}]:[]],R=c("cocso-checkbox",m,g,n),N=h=>{if(!s){let P;h===!0?P="on":h==="indeterminate"?P="intermediate":P="off",r(P)}};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:s,...a,children:[x(k.Indicator,{className:"cocso-checkbox-indicator",style:{opacity:t==="on"?1:0},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:"M20 6 9 17l-5-5"})})}),x("div",{className:"cocso-checkbox-indicator",style:{opacity:t==="intermediate"?1:0},children:x("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:x("path",{d:"M5 12h14"})})})]}),i&&x(I,{className:c("cocso-checkbox-label",{disabled:s}),size:e,htmlFor:o,children:i})]})}),Xe=Object.assign(To,{displayName:"Checkbox"});export{Eo as Accordion,F as Body,ie as Button,Xe as Checkbox,de as Display,z as Heading,I as Label,Ee as Link,Ve as Modal,H as Spinner};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cocso-ui/react",
3
- "version": "0.0.1-beta.21",
3
+ "version": "0.0.1-beta.24",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+https://github.com/cocso/cocso-ui.git",
@@ -27,6 +27,7 @@
27
27
  "dependencies": {
28
28
  "@radix-ui/react-accordion": "^1.2.11",
29
29
  "@radix-ui/react-checkbox": "^1.3.2",
30
+ "@radix-ui/react-dialog": "^1.1.14",
30
31
  "@radix-ui/react-slot": "^1.2.3"
31
32
  },
32
33
  "peerDependencies": {