@cocso-ui/react 0.0.1-beta.21 → 0.0.1-beta.22
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.
- package/lib/components/Link/Link.d.ts +16 -0
- package/lib/components/Link/index.d.ts +1 -0
- package/lib/index.cjs +1 -1
- package/lib/index.d.ts +1 -0
- package/lib/index.js +1 -1
- package/package.json +1 -1
|
@@ -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';
|
package/lib/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var no=Object.create;var v=Object.defineProperty;var so=Object.getOwnPropertyDescriptor;var io=Object.getOwnPropertyNames;var ao=Object.getPrototypeOf,co=Object.prototype.hasOwnProperty;var mo=(o,e)=>{for(var t in e)v(o,t,{get:e[t],enumerable:!0})},E=(o,e,t,n)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of io(e))!co.call(o,r)&&r!==t&&v(o,r,{get:()=>e[r],enumerable:!(n=so(e,r))||n.enumerable});return o};var C=(o,e,t)=>(t=o!=null?no(ao(o)):{},E(e||!o||!o.__esModule?v(t,"default",{value:o,enumerable:!0}):t,o)),po=o=>E(v({},"__esModule",{value:!0}),o);var Bo={};mo(Bo,{Accordion:()=>Co,Body:()=>xo,Button:()=>Po,Checkbox:()=>Eo,Display:()=>No,Heading:()=>To,Label:()=>L,Link:()=>Lo,Spinner:()=>S});module.exports=po(Bo);var u=C(require("@radix-ui/react-accordion"),1),N=require("react");var lo=(...o)=>o.filter(Boolean).join(" ").trim(),c=(o,e,t=[],...n)=>{let r=Object.entries(e).filter(([,s])=>s!==!1&&s!==null&&s!==void 0).map(([s,a])=>`${o}--${s}_${a}`).join(" "),i=t.filter(s=>Object.entries(s).every(([a,p])=>e[a]===p)).map(s=>{let a=Object.entries(s).map(([p,m])=>`${p}_${m}`).join("-");return`${o}--${a}`}).join(" ");return lo(o,r,i,...n)};var B=require("@radix-ui/react-slot"),x=require("react/jsx-runtime"),fo=(0,N.forwardRef)(({className:o,...e},t)=>{let n=c("cocso-accordion-item",{},[],o);return(0,x.jsx)(u.Item,{ref:t,className:n,...e})}),go=(0,N.forwardRef)(({className:o,children:e,chevron:t=!0,...n},r)=>{let i=c("cocso-accordion-trigger",{},[],o);return(0,x.jsx)(u.Trigger,{ref:r,className:i,...n,children:(0,x.jsxs)(B.Slottable,{children:[e,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"})})})]})})}),ho=(0,N.forwardRef)(({className:o,...e},t)=>{let n=c("cocso-accordion-content",{},[],o);return(0,x.jsx)(u.Content,{ref:t,className:n,...e})}),Co=Object.assign(u.Root,{Item:fo,Header:u.Header,Trigger:go,Content:ho});var H=C(require("react"),1),O=require("@radix-ui/react-slot");function l(o){if(o)return o.includes(".")?`var(--color-${o.replace(/\./g,"-")})`:o}var A={thin:"100",extralight:"200",light:"300",normal:"400",medium:"500",semibold:"600",bold:"700",extrabold:"800",black:"900"};function d(o){if(o)return o in A?A[o]:o}var M=require("react/jsx-runtime"),uo=H.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:n="normal",className:r,style:i,...s},a)=>{let m=c("cocso-body",{size:e},[],r);return(0,M.jsx)(o?O.Slot:"p",{ref:a,className:m,style:{"--cocso-body-color":l(t),"--cocso-body-weight":d(n),...i},...s})}),xo=Object.assign(uo,{displayName:"Body"});var k=C(require("react"),1),D=require("@radix-ui/react-slot");var z=C(require("react"),1);var R=require("react/jsx-runtime"),bo=["div"],yo=z.forwardRef(({as:o=bo[0],size:e="md",color:t="palette.primary-500",bg:n="palette.gray-200",className:r,style:i,...s},a)=>{let p=o,f=c("cocso-spinner",{size:e},[],r);return(0,R.jsx)(p,{ref:a,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(yo,{displayName:"Spinner"});var W=require("react/jsx-runtime"),Ro=o=>({"2xs":"xs",xs:"xs",sm:"xs",md:"sm",lg:"md",xl:"md"})[o],ko=k.forwardRef(({asChild:o=!1,variant:e="primary",size:t="md",disabled:n=!1,loading:r=!1,color:i,weight:s="normal",className:a,style:p,children:m,onClick:f,onKeyDown:P,...T},F)=>{let h=n||r,y=k.useCallback(b=>{if(h){b.preventDefault();return}f?.(b)},[h,f]),Z=k.useCallback(b=>{(b.key==="Enter"||b.key===" ")&&(b.preventDefault(),h||b.currentTarget.click()),P?.(b)},[h,P]),oo={variant:e,size:t,loading:r,disabled:h},eo=[...n?[{variant:e,disabled:n}]:[],...r?[{variant:e,loading:r}]:[]],to=c("cocso-button",oo,eo,a),ro={"--cocso-button-color":l(i),"--cocso-button-weight":d(s),...p};return(0,W.jsx)(o?D.Slot:"button",{ref:F,className:to,onClick:y,onKeyDown:Z,role:"button",disabled:h,"aria-disabled":h,"aria-busy":r,style:ro,...T,children:r?(0,W.jsx)(S,{className:"cocso-button-spinner",size:Ro(t),color:"currentColor"}):m})}),Po=Object.assign(ko,{displayName:"Button"});var j=C(require("react"),1),I=require("@radix-ui/react-slot");var $=require("react/jsx-runtime"),vo=j.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:n="bold",className:r,style:i,...s},a)=>{let m=c("cocso-display",{size:e},[],r);return(0,$.jsx)(o?I.Slot:"h1",{ref:a,className:m,style:{"--cocso-display-color":l(t),"--cocso-display-weight":d(n),...i},...s})}),No=Object.assign(vo,{displayName:"Display"});var _=C(require("react"),1),V=require("@radix-ui/react-slot");var G=require("react/jsx-runtime"),wo=_.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:n="bold",className:r,style:i,...s},a)=>{let m=c("cocso-heading",{size:e},[],r);return(0,G.jsx)(o?V.Slot:"h2",{ref:a,className:m,style:{"--cocso-heading-color":l(t),"--cocso-heading-weight":d(n),...i},...s})}),To=Object.assign(wo,{displayName:"Heading"});var K=C(require("react"),1),q=require("@radix-ui/react-slot");var J=require("react/jsx-runtime"),So=K.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:n="normal",className:r,style:i,...s},a)=>{let m=c("cocso-label",{size:e},[],r);return(0,J.jsx)(o?q.Slot:"label",{ref:a,className:m,style:{"--cocso-label-color":l(t),"--cocso-label-weight":d(n),...i},...s})}),L=Object.assign(So,{displayName:"Label"});var Q=C(require("react"),1),U=require("@radix-ui/react-slot");var X=require("react/jsx-runtime"),Wo=Q.forwardRef(({asChild:o=!1,size:e="md",weight:t="normal",indicator:n=!0,className:r,style:i,...s},a)=>{let m=c("cocso-link",{size:e,indicator:n},[],r);return(0,X.jsx)(o?U.Slot:"a",{ref:a,className:m,style:{"--cocso-link-weight":d(t),...i},...s})}),Lo=Object.assign(Wo,{displayName:"Link"});var Y=C(require("react"),1),w=C(require("@radix-ui/react-checkbox"),1);var g=require("react/jsx-runtime"),Fo=Y.forwardRef(({id:o,size:e="md",status:t,onChange:n,label:r,disabled:i=!1,className:s,...a},p)=>{let m={size:e,disabled:i,status:t},f=[...i?[{status:t,disabled:i}]:[]],P=c("cocso-checkbox",m,f,s),T=h=>{if(!i){let y;h===!0?y="on":h==="indeterminate"?y="intermediate":y="off",n(y)}};return(0,g.jsxs)("div",{className:"cocso-checkbox-wrapper",children:[(0,g.jsxs)(w.Root,{ref:p,id:o,className:P,checked:(()=>{switch(t){case"on":return!0;case"intermediate":return"indeterminate";case"off":default:return!1}})(),onCheckedChange:T,disabled:i,...a,children:[(0,g.jsx)(w.Indicator,{className:"cocso-checkbox-indicator",style:{opacity:t==="on"?1:0},children:(0,g.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,g.jsx)("path",{d:"M20 6 9 17l-5-5"})})}),(0,g.jsx)("div",{className:"cocso-checkbox-indicator",style:{opacity:t==="intermediate"?1:0},children:(0,g.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,g.jsx)("path",{d:"M5 12h14"})})})]}),r&&(0,g.jsx)(L,{className:c("cocso-checkbox-label",m),size:e,htmlFor:o,children:r})]})}),Eo=Object.assign(Fo,{displayName:"Checkbox"});
|
package/lib/index.d.ts
CHANGED
|
@@ -4,5 +4,6 @@ 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';
|
|
7
8
|
export * from './components/Checkbox';
|
|
8
9
|
export * from './components/Spinner';
|
package/lib/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import*as
|
|
1
|
+
import*as h from"@radix-ui/react-accordion";import{forwardRef as v}from"react";var V=(...o)=>o.filter(Boolean).join(" ").trim(),c=(o,e,t=[],...r)=>{let n=Object.entries(e).filter(([,s])=>s!==!1&&s!==null&&s!==void 0).map(([s,a])=>`${o}--${s}_${a}`).join(" "),i=t.filter(s=>Object.entries(s).every(([a,p])=>e[a]===p)).map(s=>{let a=Object.entries(s).map(([p,m])=>`${p}_${m}`).join("-");return`${o}--${a}`}).join(" ");return V(o,n,i,...r)};import{Slottable as G}from"@radix-ui/react-slot";import{jsx as b,jsxs as Q}from"react/jsx-runtime";var K=v(({className:o,...e},t)=>{let r=c("cocso-accordion-item",{},[],o);return b(h.Item,{ref:t,className:r,...e})}),q=v(({className:o,children:e,chevron:t=!0,...r},n)=>{let i=c("cocso-accordion-trigger",{},[],o);return b(h.Trigger,{ref:n,className:i,...r,children:Q(G,{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"})})})]})})}),J=v(({className:o,...e},t)=>{let r=c("cocso-accordion-content",{},[],o);return b(h.Content,{ref:t,className:r,...e})}),To=Object.assign(h.Root,{Item:K,Header:h.Header,Trigger:q,Content:J});import*as S from"react";import{Slot as U}from"@radix-ui/react-slot";function l(o){if(o)return o.includes(".")?`var(--color-${o.replace(/\./g,"-")})`:o}var T={thin:"100",extralight:"200",light:"300",normal:"400",medium:"500",semibold:"600",bold:"700",extrabold:"800",black:"900"};function d(o){if(o)return o in T?T[o]:o}import{jsx as Y}from"react/jsx-runtime";var X=S.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:r="normal",className:n,style:i,...s},a)=>{let m=c("cocso-body",{size:e},[],n);return Y(o?U:"p",{ref:a,className:m,style:{"--cocso-body-color":l(t),"--cocso-body-weight":d(r),...i},...s})}),Oo=Object.assign(X,{displayName:"Body"});import*as y from"react";import{Slot as to}from"@radix-ui/react-slot";import*as W from"react";import{jsx as N,jsxs as eo}from"react/jsx-runtime";var Z=["div"],oo=W.forwardRef(({as:o=Z[0],size:e="md",color:t="palette.primary-500",bg:r="palette.gray-200",className:n,style:i,...s},a)=>{let p=o,f=c("cocso-spinner",{size:e},[],n);return N(p,{ref:a,className:f,style:{"--cocso-spinner-bg":l(r),"--cocso-spinner-color":l(t),...i},...s,children:eo("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(oo,{displayName:"Spinner"});import{jsx as F}from"react/jsx-runtime";var ro=o=>({"2xs":"xs",xs:"xs",sm:"xs",md:"sm",lg:"md",xl:"md"})[o],no=y.forwardRef(({asChild:o=!1,variant:e="primary",size:t="md",disabled:r=!1,loading:n=!1,color:i,weight:s="normal",className:a,style:p,children:m,onClick:f,onKeyDown:R,...P},w)=>{let g=r||n,x=y.useCallback(C=>{if(g){C.preventDefault();return}f?.(C)},[g,f]),D=y.useCallback(C=>{(C.key==="Enter"||C.key===" ")&&(C.preventDefault(),g||C.currentTarget.click()),R?.(C)},[g,R]),j={variant:e,size:t,loading:n,disabled:g},I=[...r?[{variant:e,disabled:r}]:[],...n?[{variant:e,loading:n}]:[]],$=c("cocso-button",j,I,a),_={"--cocso-button-color":l(i),"--cocso-button-weight":d(s),...p};return F(o?to:"button",{ref:w,className:$,onClick:x,onKeyDown:D,role:"button",disabled:g,"aria-disabled":g,"aria-busy":n,style:_,...P,children:n?F(L,{className:"cocso-button-spinner",size:ro(t),color:"currentColor"}):m})}),Xo=Object.assign(no,{displayName:"Button"});import*as E from"react";import{Slot as so}from"@radix-ui/react-slot";import{jsx as ao}from"react/jsx-runtime";var io=E.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:r="bold",className:n,style:i,...s},a)=>{let m=c("cocso-display",{size:e},[],n);return ao(o?so:"h1",{ref:a,className:m,style:{"--cocso-display-color":l(t),"--cocso-display-weight":d(r),...i},...s})}),se=Object.assign(io,{displayName:"Display"});import*as B from"react";import{Slot as co}from"@radix-ui/react-slot";import{jsx as po}from"react/jsx-runtime";var mo=B.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:r="bold",className:n,style:i,...s},a)=>{let m=c("cocso-heading",{size:e},[],n);return po(o?co:"h2",{ref:a,className:m,style:{"--cocso-heading-color":l(t),"--cocso-heading-weight":d(r),...i},...s})}),fe=Object.assign(mo,{displayName:"Heading"});import*as A from"react";import{Slot as lo}from"@radix-ui/react-slot";import{jsx as go}from"react/jsx-runtime";var fo=A.forwardRef(({asChild:o=!1,size:e="md",color:t,weight:r="normal",className:n,style:i,...s},a)=>{let m=c("cocso-label",{size:e},[],n);return go(o?lo:"label",{ref:a,className:m,style:{"--cocso-label-color":l(t),"--cocso-label-weight":d(r),...i},...s})}),H=Object.assign(fo,{displayName:"Label"});import*as O from"react";import{Slot as ho}from"@radix-ui/react-slot";import{jsx as uo}from"react/jsx-runtime";var Co=O.forwardRef(({asChild:o=!1,size:e="md",weight:t="normal",indicator:r=!0,className:n,style:i,...s},a)=>{let m=c("cocso-link",{size:e,indicator:r},[],n);return uo(o?ho:"a",{ref:a,className:m,style:{"--cocso-link-weight":d(t),...i},...s})}),Se=Object.assign(Co,{displayName:"Link"});import*as z from"react";import*as k from"@radix-ui/react-checkbox";import{jsx as u,jsxs as M}from"react/jsx-runtime";var xo=z.forwardRef(({id:o,size:e="md",status:t,onChange:r,label:n,disabled:i=!1,className:s,...a},p)=>{let m={size:e,disabled:i,status:t},f=[...i?[{status:t,disabled:i}]:[]],R=c("cocso-checkbox",m,f,s),P=g=>{if(!i){let x;g===!0?x="on":g==="indeterminate"?x="intermediate":x="off",r(x)}};return M("div",{className:"cocso-checkbox-wrapper",children:[M(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:P,disabled:i,...a,children:[u(k.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:c("cocso-checkbox-label",m),size:e,htmlFor:o,children:n})]})}),He=Object.assign(xo,{displayName:"Checkbox"});export{To as Accordion,Oo as Body,Xo as Button,He as Checkbox,se as Display,fe as Heading,H as Label,Se as Link,L as Spinner};
|