blunt-ui 0.3.3 → 0.3.5
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/README.md +249 -125
- package/dist/index.cjs +32 -29
- package/dist/index.js +368 -360
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),s=require("styled-components"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),s=require("styled-components"),a=require("react"),bo=require("react-dom"),B=(o,r,n)=>s.css`
|
|
2
2
|
background: ${r};
|
|
3
3
|
color: ${n};
|
|
4
4
|
border: ${o.brutalism.borderWidth} solid ${o.colors.neutral[900]};
|
|
@@ -107,7 +107,7 @@
|
|
|
107
107
|
padding: ${r.spacing[3]} ${r.spacing[6]};
|
|
108
108
|
font-size: ${r.fontSizes.lg};
|
|
109
109
|
`})[o]}
|
|
110
|
-
`;function H({ref:o,as:r,href:n,variant:e="primary",size:
|
|
110
|
+
`;function H({ref:o,as:r,href:n,variant:e="primary",size:l="md",isLoading:i,disabled:c,children:d,...p}){const b=r??(n?"a":"button");return t.jsx(No,{ref:o,as:b,href:n,$variant:e,$size:l,disabled:i||c,...p,children:i?"Loading...":d})}H.displayName="Button";const Fo=s.div`
|
|
111
111
|
display: flex;
|
|
112
112
|
flex-direction: column;
|
|
113
113
|
gap: ${({theme:o})=>o.spacing[1]};
|
|
@@ -175,7 +175,7 @@
|
|
|
175
175
|
display: inline-flex;
|
|
176
176
|
align-items: center;
|
|
177
177
|
margin: 0 ${({theme:o})=>o.spacing[1]};
|
|
178
|
-
`,
|
|
178
|
+
`,Ro=s.button`
|
|
179
179
|
display: inline-flex;
|
|
180
180
|
align-items: center;
|
|
181
181
|
margin: 0 ${({theme:o})=>o.spacing[1]};
|
|
@@ -188,7 +188,7 @@
|
|
|
188
188
|
&:hover {
|
|
189
189
|
opacity: 0.8;
|
|
190
190
|
}
|
|
191
|
-
`;function xo({ref:o,type:r="text",size:n="md",variant:e="default",label:
|
|
191
|
+
`;function xo({ref:o,type:r="text",size:n="md",variant:e="default",label:l,helperText:i,error:c,leftElement:d,rightElement:p,clearable:b,onClear:g,fullWidth:h,id:y,value:f,defaultValue:x,onChange:v,...k}){const T=a.useId(),$=y??T,C=`${$}-hint`,[S,j]=a.useState(x??""),w=f!==void 0,z=w?f:S,I=typeof c=="string"?c:void 0,M=!!(i||c),D=E=>{w||j(E.target.value),v?.(E)},V=()=>{w||j(""),g?.()};return t.jsxs(Fo,{$fullWidth:h,children:[l&&t.jsx(Lo,{htmlFor:$,children:l}),t.jsxs(Vo,{$size:n,$variant:e,$error:!!c,children:[d&&t.jsx(to,{children:d}),t.jsx(_o,{id:$,ref:o,type:r,value:z,onChange:D,...k,"aria-invalid":!!c,"aria-describedby":M?C:void 0}),b&&z&&t.jsx(Ro,{type:"button",onClick:V,"aria-label":"Clear input",children:"✕"}),p&&t.jsx(to,{children:p})]}),M&&t.jsx(Bo,{id:C,$error:!!c,children:I??i})]})}xo.displayName="Input";const Ao=s.div`
|
|
192
192
|
display: flex;
|
|
193
193
|
flex-direction: column;
|
|
194
194
|
gap: ${({theme:o})=>o.spacing[1]};
|
|
@@ -253,7 +253,7 @@
|
|
|
253
253
|
cursor: not-allowed;
|
|
254
254
|
opacity: 0.6;
|
|
255
255
|
}
|
|
256
|
-
`;function yo({ref:o,size:r="md",variant:n="default",label:e,helperText:
|
|
256
|
+
`;function yo({ref:o,size:r="md",variant:n="default",label:e,helperText:l,error:i,fullWidth:c,id:d,value:p,defaultValue:b,onChange:g,...h}){const y=a.useId(),f=d??y,x=`${f}-hint`,[v,k]=a.useState(b??""),T=p!==void 0,$=T?p:v,C=typeof i=="string"?i:void 0,S=!!(l||i),j=w=>{T||k(w.target.value),g?.(w)};return t.jsxs(Ao,{$fullWidth:c,children:[e&&t.jsx(Yo,{htmlFor:f,children:e}),t.jsx(qo,{$size:r,$variant:n,$error:!!i,children:t.jsx(Uo,{id:f,ref:o,value:$,onChange:j,...h,"aria-invalid":!!i,"aria-describedby":S?x:void 0})}),S&&t.jsx(Ho,{id:x,$error:!!i,children:C??l})]})}yo.displayName="Textarea";const ho=(...o)=>o.filter((r,n,e)=>!!r&&r.trim()!==""&&e.indexOf(r)===n).join(" ").trim();const Ko=o=>o.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase();const Go=o=>o.replace(/^([A-Z])|[\s-_]+(\w)/g,(r,n,e)=>e?e.toUpperCase():n.toLowerCase());const eo=o=>{const r=Go(o);return r.charAt(0).toUpperCase()+r.slice(1)};var X={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"};const Jo=o=>{for(const r in o)if(r.startsWith("aria-")||r==="role"||r==="title")return!0;return!1},Xo=a.createContext({}),Zo=()=>a.useContext(Xo),Qo=a.forwardRef(({color:o,size:r,strokeWidth:n,absoluteStrokeWidth:e,className:l="",children:i,iconNode:c,...d},p)=>{const{size:b=24,strokeWidth:g=2,absoluteStrokeWidth:h=!1,color:y="currentColor",className:f=""}=Zo()??{},x=e??h?Number(n??g)*24/Number(r??b):n??g;return a.createElement("svg",{ref:p,...X,width:r??b??X.width,height:r??b??X.height,stroke:o??y,strokeWidth:x,className:ho("lucide",f,l),...!i&&!Jo(d)&&{"aria-hidden":"true"},...d},[...c.map(([v,k])=>a.createElement(v,k)),...Array.isArray(i)?i:[i]])});const N=(o,r)=>{const n=a.forwardRef(({className:e,...l},i)=>a.createElement(Qo,{ref:i,iconNode:r,className:ho(`lucide-${Ko(eo(o))}`,`lucide-${o}`,e),...l}));return n.displayName=eo(o),n};const or=[["path",{d:"M12 5v14",key:"s699le"}],["path",{d:"m19 12-7 7-7-7",key:"1idqje"}]],rr=N("arrow-down",or);const sr=[["path",{d:"m21 16-4 4-4-4",key:"f6ql7i"}],["path",{d:"M17 20V4",key:"1ejh1v"}],["path",{d:"m3 8 4-4 4 4",key:"11wl7u"}],["path",{d:"M7 4v16",key:"1glfcx"}]],nr=N("arrow-up-down",sr);const tr=[["path",{d:"m5 12 7-7 7 7",key:"hav0vg"}],["path",{d:"M12 19V5",key:"x0mq9r"}]],er=N("arrow-up",tr);const ir=[["path",{d:"M8 2v4",key:"1cmpym"}],["path",{d:"M16 2v4",key:"4m81vk"}],["rect",{width:"18",height:"18",x:"3",y:"4",rx:"2",key:"1hopcy"}],["path",{d:"M3 10h18",key:"8toen8"}]],ar=N("calendar",ir);const lr=[["path",{d:"m6 9 6 6 6-6",key:"qrunsl"}]],wo=N("chevron-down",lr);const cr=[["path",{d:"m15 18-6-6 6-6",key:"1wnfg3"}]],dr=N("chevron-left",cr);const ur=[["path",{d:"m9 18 6-6-6-6",key:"mthhwq"}]],pr=N("chevron-right",ur);const fr=[["path",{d:"M18 6 6 18",key:"1bl5f8"}],["path",{d:"m6 6 12 12",key:"d8bk6v"}]],Q=N("x",fr),$r=s.div`
|
|
257
257
|
display: inline-flex;
|
|
258
258
|
flex-direction: column;
|
|
259
259
|
gap: ${({theme:o})=>o.spacing[1]};
|
|
@@ -346,9 +346,9 @@
|
|
|
346
346
|
display: flex;
|
|
347
347
|
align-items: center;
|
|
348
348
|
color: ${({theme:o})=>o.colors.neutral[500]};
|
|
349
|
-
`;function
|
|
349
|
+
`;function mo({options:o,placeholder:r,size:n="md",variant:e="default",error:l,fullWidth:i,clearable:c,onClear:d,id:p,value:b,defaultValue:g,onChange:h,...y}){const f=a.useId(),x=p??f,v=`${x}-hint`,k=typeof l=="string"?l:void 0,[T,$]=a.useState(g??""),C=b!==void 0,S=C?b:T,j=I=>{C||$(I.target.value),h?.(I)},w=()=>{C||$(""),d?.()},z=c&&!!S;return t.jsxs($r,{$fullWidth:i,children:[t.jsxs(br,{children:[t.jsxs(xr,{id:x,$size:n,$variant:e,$error:!!l,"aria-invalid":!!l,"aria-describedby":k?v:void 0,value:S,onChange:j,...y,children:[r&&t.jsx("option",{value:"",disabled:!0,children:r}),o.map(I=>t.jsx("option",{value:I.value,disabled:I.disabled,children:I.label},I.value))]}),z?t.jsx(yr,{type:"button",onClick:w,"aria-label":"Clear selection",children:t.jsx(Q,{size:14})}):t.jsx(hr,{"aria-hidden":"true",children:t.jsx(wo,{size:14})})]}),k&&t.jsx(gr,{id:v,$error:!0,children:k})]})}mo.displayName="Select";const io=s.span`
|
|
350
350
|
display: inline-block;
|
|
351
|
-
`,
|
|
351
|
+
`,wr=s.span`
|
|
352
352
|
display: inline-block;
|
|
353
353
|
min-width: 60px;
|
|
354
354
|
padding: ${({theme:o})=>`${o.spacing[1]} ${o.spacing[2]}`};
|
|
@@ -365,6 +365,9 @@
|
|
|
365
365
|
opacity: 0.5;
|
|
366
366
|
`:s.css`
|
|
367
367
|
cursor: text;
|
|
368
|
+
transition:
|
|
369
|
+
border-color 0.15s ease,
|
|
370
|
+
box-shadow 0.15s ease;
|
|
368
371
|
|
|
369
372
|
&:hover {
|
|
370
373
|
${r.brutalism?s.css`
|
|
@@ -383,7 +386,7 @@
|
|
|
383
386
|
box-shadow: ${r.shadows.focusRing};
|
|
384
387
|
}
|
|
385
388
|
`}
|
|
386
|
-
`,
|
|
389
|
+
`,mr=s.input`
|
|
387
390
|
display: inline-block;
|
|
388
391
|
min-width: 60px;
|
|
389
392
|
padding: ${({theme:o})=>`${o.spacing[1]} ${o.spacing[2]}`};
|
|
@@ -402,7 +405,7 @@
|
|
|
402
405
|
border: 1px solid ${o.colors.primary[500]};
|
|
403
406
|
box-shadow: ${o.shadows.focusRing};
|
|
404
407
|
`}
|
|
405
|
-
`;function vo({value:o,defaultValue:r="",onChange:n,onSubmit:e,onCancel:
|
|
408
|
+
`;function vo({value:o,defaultValue:r="",onChange:n,onSubmit:e,onCancel:l,placeholder:i="Click to edit",disabled:c=!1}){const d=o!==void 0,[p,b]=a.useState(r),g=d?o:p,[h,y]=a.useState(!1),[f,x]=a.useState(""),v=a.useRef(null),k=()=>{c||(x(g),y(!0),setTimeout(()=>{v.current?.focus(),v.current?.select()},0))},T=()=>{d||b(f),n?.(f),e?.(f),y(!1)},$=()=>{l?.(g),y(!1)},C=S=>{S.key==="Enter"?T():S.key==="Escape"&&$()};return h?t.jsx(io,{children:t.jsx(mr,{ref:v,value:f,size:Math.max(f.length,i.length,10),onChange:S=>x(S.target.value),onBlur:T,onKeyDown:C,"aria-label":"Edit value"})}):t.jsx(io,{children:t.jsx(wr,{role:c?void 0:"button",tabIndex:c?void 0:0,$disabled:c,$empty:!g,onClick:k,onKeyDown:S=>S.key==="Enter"&&k(),children:g||i})})}vo.displayName="Editable";const vr=s.a`
|
|
406
409
|
text-decoration: underline;
|
|
407
410
|
text-underline-offset: 2px;
|
|
408
411
|
transition: color 0.15s;
|
|
@@ -533,7 +536,7 @@
|
|
|
533
536
|
padding: ${({theme:o})=>o.spacing[4]};
|
|
534
537
|
border-top: 1px solid ${({theme:o})=>o.colors.neutral[200]};
|
|
535
538
|
flex-shrink: 0;
|
|
536
|
-
`,Fr=["button:not([disabled])","input:not([disabled])","select:not([disabled])","textarea:not([disabled])","a[href]",'[tabindex]:not([tabindex="-1"])'].join(", ");function ao(o){return Array.from(o.querySelectorAll(Fr))}function ro({open:o,onClose:r,title:n,children:e,footer:
|
|
539
|
+
`,Fr=["button:not([disabled])","input:not([disabled])","select:not([disabled])","textarea:not([disabled])","a[href]",'[tabindex]:not([tabindex="-1"])'].join(", ");function ao(o){return Array.from(o.querySelectorAll(Fr))}function ro({open:o,onClose:r,title:n,children:e,footer:l,size:i="md",closeOnBackdrop:c=!0,closeOnEscape:d=!0,ariaLabelledBy:p,ariaDescribedBy:b}){const g=a.useRef(null),h=a.useRef(null),y=a.useId(),f=p??(n?y:void 0),[x,v]=a.useState(o),[k,T]=a.useState(!1);return a.useEffect(()=>{if(o)v(!0),T(!1);else if(x){T(!0);const $=setTimeout(()=>{v(!1),T(!1)},150);return()=>clearTimeout($)}},[o,x]),a.useEffect(()=>{if(!o)return;const $=document.body.style.overflow;return document.body.style.overflow="hidden",()=>{document.body.style.overflow=$}},[o]),a.useEffect(()=>{if(!o||!g.current)return;const $=g.current,C=document.activeElement;(ao($)[0]??$).focus();const j=w=>{if(w.key==="Escape"&&d){r();return}if(w.key!=="Tab")return;const z=ao($);if(z.length===0){w.preventDefault();return}const I=z[0],M=z[z.length-1];w.shiftKey?document.activeElement===I&&(w.preventDefault(),M.focus()):document.activeElement===M&&(w.preventDefault(),I.focus())};return document.addEventListener("keydown",j),()=>{document.removeEventListener("keydown",j),C?.focus()}},[o,d,r,x]),x?bo.createPortal(t.jsx(Mr,{$closing:k,onMouseDown:$=>{h.current=$.target},onClick:$=>{c&&h.current===$.currentTarget&&r()},children:t.jsxs(Dr,{ref:g,role:"dialog","aria-modal":"true","aria-labelledby":f,"aria-describedby":b,$size:i,$closing:k,tabIndex:-1,onClick:$=>$.stopPropagation(),children:[t.jsxs(Er,{children:[n&&t.jsx(Pr,{id:y,children:n}),t.jsx(Wr,{onClick:r,"aria-label":"Close modal",children:"×"})]}),t.jsx(Or,{children:e}),l&&t.jsx(Nr,{children:l})]})}),document.body):null}ro.displayName="Modal";const Lr=s.keyframes`
|
|
537
540
|
from { opacity: 0; transform: translateY(12px); }
|
|
538
541
|
to { opacity: 1; transform: translateY(0); }
|
|
539
542
|
`,Br=s.keyframes`
|
|
@@ -573,13 +576,13 @@
|
|
|
573
576
|
top: ${r.spacing[6]};
|
|
574
577
|
left: ${r.spacing[6]};
|
|
575
578
|
`})[o]}
|
|
576
|
-
`,
|
|
579
|
+
`,A=(o,r,n)=>s.css`
|
|
577
580
|
background: ${r};
|
|
578
581
|
border: ${o.brutalism.borderWidth} solid ${n};
|
|
579
582
|
box-shadow: ${o.brutalism.shadowOffset} ${o.brutalism.shadowOffset}
|
|
580
583
|
0 ${n};
|
|
581
|
-
`,
|
|
582
|
-
${({$variant:o,theme:r})=>r.brutalism?{success:
|
|
584
|
+
`,Rr=s(_r)`
|
|
585
|
+
${({$variant:o,theme:r})=>r.brutalism?{success:A(r,r.colors.success[50],r.colors.success[500]),error:A(r,r.colors.error[50],r.colors.error[500]),warning:A(r,r.colors.warning[50],r.colors.warning[500]),info:A(r,r.colors.info[50],r.colors.info[500])}[o]:{success:s.css`
|
|
583
586
|
background: ${r.colors.success[50]};
|
|
584
587
|
border-left: 4px solid ${r.colors.success[500]};
|
|
585
588
|
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
|
|
@@ -596,7 +599,7 @@
|
|
|
596
599
|
border-left: 4px solid ${r.colors.info[500]};
|
|
597
600
|
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
|
|
598
601
|
`}[o]}
|
|
599
|
-
`,
|
|
602
|
+
`,Ar=s.p`
|
|
600
603
|
flex: 1;
|
|
601
604
|
margin: 0;
|
|
602
605
|
font-size: ${({theme:o})=>o.fontSizes.sm};
|
|
@@ -625,7 +628,7 @@
|
|
|
625
628
|
outline: 2px solid ${({theme:o})=>o.colors.primary[500]};
|
|
626
629
|
outline-offset: 2px;
|
|
627
630
|
}
|
|
628
|
-
`;function so({open:o,onClose:r,message:n,variant:e="info",duration:
|
|
631
|
+
`;function so({open:o,onClose:r,message:n,variant:e="info",duration:l=4e3,position:i="bottom-right"}){const[c,d]=a.useState(o),[p,b]=a.useState(!1);return a.useEffect(()=>{if(o)d(!0),b(!1);else if(c){b(!0);const g=setTimeout(()=>{d(!1),b(!1)},200);return()=>{clearTimeout(g)}}},[o,c]),a.useEffect(()=>{if(!o||l===0)return;const g=setTimeout(r,l);return()=>{clearTimeout(g)}},[o,l,r]),c?bo.createPortal(t.jsxs(Rr,{$position:i,$variant:e,$closing:p,role:"alert","aria-live":"polite",children:[t.jsx(Ar,{children:n}),t.jsx(Yr,{onClick:r,"aria-label":"Close notification",children:t.jsx(Q,{size:14,strokeWidth:2.5})})]}),document.body):null}so.displayName="Toast";const So=a.createContext(null);function Hr({children:o}){const[r,n]=a.useState(null),e=a.useCallback(i=>{n({...i,id:Date.now()})},[]),l=a.useMemo(()=>Object.assign(i=>e(i),{success:(i,c)=>e({...c,message:i,variant:"success"}),error:(i,c)=>e({...c,message:i,variant:"error"}),warning:(i,c)=>e({...c,message:i,variant:"warning"}),info:(i,c)=>e({...c,message:i,variant:"info"})}),[e]);return t.jsxs(So.Provider,{value:{toast:l},children:[o,r&&t.jsx(so,{open:!0,onClose:()=>n(null),message:r.message,variant:r.variant,duration:r.duration,position:r.position},r.id)]})}function qr(){const o=a.useContext(So);if(!o)throw new Error("useToast must be used within a ToastProvider");return o}const Ur=s.form`
|
|
629
632
|
display: flex;
|
|
630
633
|
flex-direction: column;
|
|
631
634
|
gap: ${({theme:o})=>o.spacing[4]};
|
|
@@ -643,7 +646,7 @@
|
|
|
643
646
|
`,Xr=s.span`
|
|
644
647
|
font-size: ${({theme:o})=>o.fontSizes.xs};
|
|
645
648
|
color: ${({$error:o,theme:r})=>o?r.colors.error[500]:r.colors.neutral[500]};
|
|
646
|
-
`;function jo({onSubmit:o,children:r,...n}){return t.jsx(Ur,{onSubmit:e=>{e.preventDefault(),o?.(e)},noValidate:!0,...n,children:r})}jo.displayName="Form";function Co({label:o,error:r,helperText:n,required:e,children:
|
|
649
|
+
`;function jo({onSubmit:o,children:r,...n}){return t.jsx(Ur,{onSubmit:e=>{e.preventDefault(),o?.(e)},noValidate:!0,...n,children:r})}jo.displayName="Form";function Co({label:o,error:r,helperText:n,required:e,children:l}){const i=a.useId(),c=`${i}-hint`,d=!!(r||n),p=typeof r=="string"?r:void 0,b=a.isValidElement(l)?a.cloneElement(l,{id:i,...d&&{"aria-describedby":c},...r&&{"aria-invalid":!0}}):l;return t.jsxs(Kr,{children:[o&&t.jsxs(Gr,{htmlFor:i,children:[o,e&&t.jsx(Jr,{"aria-hidden":"true",children:" *"})]}),b,d&&t.jsx(Xr,{id:c,$error:!!r,children:p??n})]})}Co.displayName="FormField";function Zr({initialValues:o,validate:r,onSubmit:n,onError:e}){const[l,i]=a.useState(o),[c,d]=a.useState({}),[p,b]=a.useState({}),[g,h]=a.useState(!1),y=a.useRef(l);y.current=l;const f=a.useCallback(j=>{if(!r)return{};const w=r(j);return Object.fromEntries(Object.entries(w).filter(([,z])=>z!==void 0))},[r]),x=a.useRef(p);x.current=p;const v=a.useCallback(j=>{const{name:w,value:z}=j.target;process.env.NODE_ENV!=="production"&&!w&&console.warn("[useForm] handleChange: field is missing a `name` attribute — value will not be tracked.");const I={...y.current,[w]:z};i(I),x.current[w]&&d(f(I))},[f]),k=a.useCallback(j=>{const{name:w}=j.target;process.env.NODE_ENV!=="production"&&!w&&console.warn("[useForm] handleBlur: field is missing a `name` attribute — touched state will not be tracked."),b(z=>({...z,[w]:!0})),d(f(y.current))},[f]),T=a.useCallback(j=>{j?.preventDefault();const w=Object.keys(y.current).reduce((M,D)=>({...M,[D]:!0}),{});b(w);const z=f(y.current);if(d(z),Object.keys(z).length>0){e?.(z);return}(async()=>{h(!0);try{await n?.(y.current)}finally{h(!1)}})()},[f,n,e]),$=a.useCallback((j,w)=>{i(z=>({...z,[j]:w}))},[]),C=a.useCallback(j=>{i(j??o),d({}),b({}),h(!1)},[o]),S=Object.fromEntries(Object.entries(c).filter(([j])=>p[j]));return{values:l,errors:S,touched:p,handleChange:v,handleBlur:k,handleSubmit:T,setFieldValue:$,reset:C,isSubmitting:g}}const Qr=s.div`
|
|
647
650
|
border-radius: ${({theme:o})=>o.radius.md};
|
|
648
651
|
background: ${({theme:o})=>o.colors.neutral[0]};
|
|
649
652
|
overflow: hidden;
|
|
@@ -723,20 +726,20 @@
|
|
|
723
726
|
`,cs=s.div`
|
|
724
727
|
padding: ${({theme:o})=>o.spacing[4]};
|
|
725
728
|
border-top: 1px solid ${({theme:o})=>o.colors.neutral[200]};
|
|
726
|
-
`;function zo({title:o,children:r,defaultOpen:n=!1,open:e,onToggle:
|
|
729
|
+
`;function zo({title:o,children:r,defaultOpen:n=!1,open:e,onToggle:l,subtitle:i,headerActions:c,accentColor:d}){const[p,b]=a.useState(n),g=a.useId(),h=e!==void 0,y=h?e:p,f=()=>{const x=!y;h||b(x),l?.(x)};return t.jsxs(Qr,{$accentColor:d,children:[t.jsxs(os,{type:"button",$open:y,$accentColor:d,"aria-expanded":y,"aria-controls":g,onClick:f,children:[t.jsxs(rs,{children:[t.jsx(ss,{children:o}),(i||c)&&t.jsxs(ts,{children:[i&&t.jsx(ns,{children:i}),c&&t.jsx(es,{onClick:x=>x.stopPropagation(),children:c})]})]}),t.jsx(is,{$open:y,$accentColor:d,"aria-hidden":"true",children:t.jsx(wo,{size:18,strokeWidth:2.5})})]}),t.jsx(as,{$open:y,children:t.jsx(ls,{id:g,role:"region","aria-label":o,children:t.jsx(cs,{children:r})})})]})}zo.displayName="CollapsibleCard";const ds=s.keyframes`
|
|
727
730
|
to { transform: rotate(360deg); }
|
|
728
731
|
`,us={sm:"16px",md:"24px",lg:"40px"},ps={thin:"2px",normal:"3px",bold:"5px"},fs=s.span`
|
|
729
732
|
display: inline-block;
|
|
730
733
|
border-radius: 50%;
|
|
731
734
|
animation: ${ds} 0.7s linear infinite;
|
|
732
735
|
|
|
733
|
-
${({$size:o="md",$weight:r="normal",$color:n,theme:e})=>{const
|
|
734
|
-
width: ${
|
|
735
|
-
height: ${
|
|
736
|
+
${({$size:o="md",$weight:r="normal",$color:n,theme:e})=>{const l=us[o],i=ps[r],c=e.colors.neutral[200],d=n??e.colors.primary[500];return s.css`
|
|
737
|
+
width: ${l};
|
|
738
|
+
height: ${l};
|
|
736
739
|
border: ${i} solid ${c};
|
|
737
740
|
border-top-color: ${d};
|
|
738
741
|
`}}
|
|
739
|
-
`;function To({size:o="md",weight:r="normal",color:n,label:e="Loading..."}){return t.jsx(fs,{$size:o,$weight:r,$color:n,role:"status","aria-label":e})}To.displayName="Spinner";function $s(o,r){return o?.key!==r?{key:r,direction:"asc"}:o.direction==="asc"?{key:r,direction:"desc"}:null}function bs({data:o,sort:r,defaultSort:n,onSortChange:e}){const
|
|
742
|
+
`;function To({size:o="md",weight:r="normal",color:n,label:e="Loading..."}){return t.jsx(fs,{$size:o,$weight:r,$color:n,role:"status","aria-label":e})}To.displayName="Spinner";function $s(o,r){return o?.key!==r?{key:r,direction:"asc"}:o.direction==="asc"?{key:r,direction:"desc"}:null}function bs({data:o,sort:r,defaultSort:n,onSortChange:e}){const l=r!==void 0,[i,c]=a.useState(n??null),d=l?r??null:i,p=g=>{const h=$s(d,g);return l||c(h),e?.(h),h},b=a.useMemo(()=>l||!d?o:[...o].sort((g,h)=>{const y=g[d.key],f=h[d.key],x=y<f?-1:y>f?1:0;return d.direction==="asc"?x:-x}),[o,d,l]);return{activeSort:d,sortedData:b,handleSort:p}}const gs=7,lo=3,co=1;function xs(o,r){if(r<=gs)return Array.from({length:r},(e,l)=>l+1);const n=[1];o>lo&&n.push("...");for(let e=Math.max(2,o-co);e<=Math.min(r-1,o+co);e++)n.push(e);return o<r-lo+1&&n.push("..."),n.push(r),n}function ys({data:o,pageSize:r,page:n,defaultPage:e,totalRows:l,onPageChange:i}){const c=n!==void 0,[d,p]=a.useState(e??1),b=c?n:d,g=v=>{c||p(v),i?.(v)},h=c||l!==void 0,y=l??o.length,f=r?Math.max(1,Math.ceil(y/r)):1,x=a.useMemo(()=>{if(!r||h)return o;const v=(b-1)*r;return o.slice(v,v+r)},[o,r,b,h]);return{activePage:b,totalPages:f,displayData:x,handlePageChange:g}}const Io=(o,r)=>o==="sm"?`${r.spacing[1]} ${r.spacing[2]}`:o==="lg"?`${r.spacing[3]} ${r.spacing[4]}`:`${r.spacing[2]} ${r.spacing[3]}`,hs=s.div`
|
|
740
743
|
width: 100%;
|
|
741
744
|
|
|
742
745
|
${({theme:o,$borderColor:r})=>o.brutalism?s.css`
|
|
@@ -755,7 +758,7 @@
|
|
|
755
758
|
${({$stickyHeader:o})=>o&&s.css`
|
|
756
759
|
overflow-y: auto;
|
|
757
760
|
`}
|
|
758
|
-
`,
|
|
761
|
+
`,ws=s.table`
|
|
759
762
|
width: 100%;
|
|
760
763
|
border-collapse: collapse;
|
|
761
764
|
font-size: ${({$size:o,theme:r})=>({sm:r.fontSizes.sm,md:r.fontSizes.md,lg:r.fontSizes.lg})[o]};
|
|
@@ -763,7 +766,7 @@
|
|
|
763
766
|
caption {
|
|
764
767
|
padding: 8px 0;
|
|
765
768
|
}
|
|
766
|
-
`,
|
|
769
|
+
`,ms=s.thead`
|
|
767
770
|
${({$stickyHeader:o})=>o&&s.css`
|
|
768
771
|
position: sticky;
|
|
769
772
|
top: 0;
|
|
@@ -956,7 +959,7 @@
|
|
|
956
959
|
outline: 2px solid ${({theme:o})=>o.colors.primary[500]};
|
|
957
960
|
outline-offset: 2px;
|
|
958
961
|
}
|
|
959
|
-
`,Es=4;function Ps(o,r){return o?.key!==r?t.jsx(nr,{size:14}):o.direction==="asc"?t.jsx(er,{size:14}):t.jsx(rr,{size:14})}function Do({columns:o,data:r,rowKey:n,size:e="md",striped:
|
|
962
|
+
`,Es=4;function Ps(o,r){return o?.key!==r?t.jsx(nr,{size:14}):o.direction==="asc"?t.jsx(er,{size:14}):t.jsx(rr,{size:14})}function Do({columns:o,data:r,rowKey:n,size:e="md",striped:l,bordered:i,stickyHeader:c,caption:d,emptyMessage:p="No data",loading:b,sort:g,defaultSort:h,onSortChange:y,pageSize:f,page:x,defaultPage:v,totalRows:k,onPageChange:T,onChange:$,onRowClick:C,borderColor:S,headerColor:j,rowColor:w,stripeColor:z,className:I,style:M}){const{activeSort:D,sortedData:V,handleSort:E}=bs({data:r,sort:g,defaultSort:h,onSortChange:y}),{activePage:P,totalPages:_,displayData:u,handlePageChange:O}=ys({data:V,pageSize:f,page:x,defaultPage:v,totalRows:k,onPageChange:T}),F=m=>{const W=E(m);$?.({sort:W,page:P})},L=m=>{O(m),$?.({sort:D,page:m})},U=(m,W)=>String(n?m[n]:W),K=!b&&u.length===0,Wo=f??Es;return t.jsxs(hs,{$borderColor:S,$stickyHeader:c,className:I,style:M,children:[t.jsxs(ws,{$size:e,children:[d&&t.jsx("caption",{children:d}),t.jsx(ms,{$headerColor:j,$borderColor:S,$stickyHeader:c,children:t.jsx(Y,{children:o.map(m=>t.jsx(Ss,{$size:e,$bordered:i,scope:"col",style:m.width?{width:m.width}:void 0,children:m.sortable?t.jsxs(js,{type:"button",onClick:()=>F(m.key),"aria-label":`Sort by ${m.header}${D?.key===m.key?`, ${D.direction}ending`:""}`,children:[m.header,t.jsx(Cs,{"aria-hidden":"true",children:Ps(D,m.key)})]}):m.header},m.key))})}),t.jsx(vs,{$striped:l,$rowColor:w,$stripeColor:z,children:b?Array.from({length:Wo}).map((m,W)=>t.jsx(Y,{children:o.map(G=>t.jsx(Is,{$size:e,$bordered:i,$borderColor:S,children:t.jsx(Ms,{})},G.key))},W)):K?t.jsx("tr",{children:t.jsx(zs,{colSpan:o.length,children:p})}):u.map((m,W)=>{const G=C?ks:Y;return t.jsx(G,{onClick:C?()=>C(m):void 0,$accentColor:C?S:void 0,children:o.map(R=>t.jsx(Mo,{$size:e,$bordered:i,$borderColor:S,children:R.render?R.render(m[R.key],m,W):String(m[R.key]??"")||" "},R.key))},U(m,W))})})]}),f&&_>1&&t.jsxs(Ds,{children:[t.jsx(Z,{type:"button",onClick:()=>L(P-1),disabled:P<=1,"aria-label":"Previous page",children:"←"}),xs(P,_).map((m,W)=>m==="..."?t.jsx("span",{"aria-hidden":"true",style:{padding:"0 4px"},children:"…"},`e${W}`):t.jsx(Z,{type:"button",$active:m===P,onClick:()=>L(m),"aria-label":`Page ${m}`,"aria-current":m===P?"page":void 0,children:m},m)),t.jsx(Z,{type:"button",onClick:()=>L(P+1),disabled:P>=_,"aria-label":"Next page",children:"→"})]})]})}Do.displayName="Table";function Ws({defaultSort:o,defaultPage:r=1}={}){const[n,e]=a.useState(o??null),[l,i]=a.useState(r);return{sort:n,page:l,onSortChange:p=>{e(p),i(1)},onPageChange:p=>{i(p)}}}const Os=s.p`
|
|
960
963
|
margin: 0;
|
|
961
964
|
font-size: ${({theme:o})=>o.fontSizes.md};
|
|
962
965
|
color: ${({theme:o})=>o.colors.neutral[600]};
|
|
@@ -1001,7 +1004,7 @@
|
|
|
1001
1004
|
box-shadow: 2px 2px 0 ${o.colors.neutral[900]};
|
|
1002
1005
|
}
|
|
1003
1006
|
`}
|
|
1004
|
-
`;function no({open:o,title:r="Are you sure?",message:n,confirmLabel:e="Confirm",cancelLabel:
|
|
1007
|
+
`;function no({open:o,title:r="Are you sure?",message:n,confirmLabel:e="Confirm",cancelLabel:l="Cancel",variant:i="default",size:c="sm",onConfirm:d,onCancel:p}){return t.jsx(ro,{open:o,onClose:p,title:r,size:c,closeOnBackdrop:!1,footer:t.jsxs(t.Fragment,{children:[t.jsx(H,{variant:"outline",onClick:p,children:l}),i==="danger"?t.jsx(Ns,{type:"button",onClick:d,children:e}):t.jsx(H,{variant:"primary",onClick:d,children:e})]}),children:t.jsx(Os,{children:n})})}no.displayName="ConfirmDialog";const Eo=a.createContext(null);function Fs({children:o}){const[r,n]=a.useState(null),e=a.useCallback(c=>new Promise(d=>{n({...c,resolve:d})}),[]),l=()=>{r?.resolve(!0),n(null)},i=()=>{r?.resolve(!1),n(null)};return t.jsxs(Eo.Provider,{value:{confirm:e},children:[o,r&&t.jsx(no,{open:!0,title:r.title,message:r.message,confirmLabel:r.confirmLabel,cancelLabel:r.cancelLabel,variant:r.variant,size:r.size,onConfirm:l,onCancel:i})]})}function Ls(){const o=a.useContext(Eo);if(!o)throw new Error("useConfirm must be used within a ConfirmProvider");return o.confirm}const Bs=s.div`
|
|
1005
1008
|
position: relative;
|
|
1006
1009
|
display: inline-flex;
|
|
1007
1010
|
flex-direction: column;
|
|
@@ -1057,13 +1060,13 @@
|
|
|
1057
1060
|
white-space: nowrap;
|
|
1058
1061
|
overflow: hidden;
|
|
1059
1062
|
text-overflow: ellipsis;
|
|
1060
|
-
`,
|
|
1063
|
+
`,Rs=s.span`
|
|
1061
1064
|
display: inline-flex;
|
|
1062
1065
|
align-items: center;
|
|
1063
1066
|
margin-left: ${({theme:o})=>o.spacing[2]};
|
|
1064
1067
|
color: ${({theme:o})=>o.colors.neutral[500]};
|
|
1065
1068
|
flex-shrink: 0;
|
|
1066
|
-
`,
|
|
1069
|
+
`,As=s.button`
|
|
1067
1070
|
display: inline-flex;
|
|
1068
1071
|
align-items: center;
|
|
1069
1072
|
margin-left: ${({theme:o})=>o.spacing[2]};
|
|
@@ -1195,7 +1198,7 @@
|
|
|
1195
1198
|
box-shadow: 2px 2px 0 ${n.colors.neutral[900]};
|
|
1196
1199
|
`}
|
|
1197
1200
|
`}
|
|
1198
|
-
`,Js=["January","February","March","April","May","June","July","August","September","October","November","December"],Xs=["Su","Mo","Tu","We","Th","Fr","Sa"];function fo(o,r){return new Date(o,r+1,0).getDate()}function Zs(o,r){return new Date(o,r,1).getDay()}function $o(o,r){return o.getFullYear()===r.getFullYear()&&o.getMonth()===r.getMonth()&&o.getDate()===r.getDate()}function Qs(o,r,n){if(r){const e=new Date(r.getFullYear(),r.getMonth(),r.getDate());if(o<e)return!0}if(n){const e=new Date(n.getFullYear(),n.getMonth(),n.getDate());if(o>e)return!0}return!1}function on(o){return o.toLocaleDateString("en-US",{month:"short",day:"numeric",year:"numeric"})}function rn(o){return o.toLocaleDateString("en-US",{weekday:"long",month:"long",day:"numeric",year:"numeric"})}function Po({value:o=null,onChange:r,placeholder:n="Select date...",size:e="md",disabled:
|
|
1201
|
+
`,Js=["January","February","March","April","May","June","July","August","September","October","November","December"],Xs=["Su","Mo","Tu","We","Th","Fr","Sa"];function fo(o,r){return new Date(o,r+1,0).getDate()}function Zs(o,r){return new Date(o,r,1).getDay()}function $o(o,r){return o.getFullYear()===r.getFullYear()&&o.getMonth()===r.getMonth()&&o.getDate()===r.getDate()}function Qs(o,r,n){if(r){const e=new Date(r.getFullYear(),r.getMonth(),r.getDate());if(o<e)return!0}if(n){const e=new Date(n.getFullYear(),n.getMonth(),n.getDate());if(o>e)return!0}return!1}function on(o){return o.toLocaleDateString("en-US",{month:"short",day:"numeric",year:"numeric"})}function rn(o){return o.toLocaleDateString("en-US",{weekday:"long",month:"long",day:"numeric",year:"numeric"})}function Po({value:o=null,onChange:r,placeholder:n="Select date...",size:e="md",disabled:l=!1,clearable:i=!1,minDate:c,maxDate:d,formatDate:p,id:b,error:g}){const h=a.useId(),y=b??h,f=new Date,[x,v]=a.useState(!1),[k,T]=a.useState(()=>(o??f).getFullYear()),[$,C]=a.useState(()=>(o??f).getMonth()),S=a.useRef(null);a.useEffect(()=>{if(!x)return;const u=O=>{S.current&&!S.current.contains(O.target)&&v(!1)};return document.addEventListener("mousedown",u),()=>document.removeEventListener("mousedown",u)},[x]),a.useEffect(()=>{o&&(T(o.getFullYear()),C(o.getMonth()))},[o]);const j=o?p?p(o):on(o):"",w=u=>{r?.(new Date(k,$,u)),v(!1)},z=u=>{u.stopPropagation(),r?.(null)},I=()=>{$===0?(C(11),T(u=>u-1)):C(u=>u-1)},M=()=>{$===11?(C(0),T(u=>u+1)):C(u=>u+1)},D=fo(k,$),V=Zs(k,$),E=[],P=fo($===0?k-1:k,$===0?11:$-1);for(let u=V-1;u>=0;u--)E.push({day:P-u,currentMonth:!1});for(let u=1;u<=D;u++)E.push({day:u,currentMonth:!0});const _=42-E.length;for(let u=1;u<=_;u++)E.push({day:u,currentMonth:!1});return t.jsxs(Bs,{ref:S,children:[t.jsxs(Vs,{id:y,$size:e,$error:!!g,$disabled:l,role:"combobox","aria-haspopup":"true","aria-expanded":x,tabIndex:l?-1:0,onClick:()=>{l||v(u=>!u)},onKeyDown:u=>{(u.key==="Enter"||u.key===" ")&&!l&&(u.preventDefault(),v(O=>!O)),u.key==="Escape"&&v(!1)},children:[t.jsx(_s,{$hasValue:!!o,children:j||n}),i&&o?t.jsx(As,{type:"button",onClick:z,"aria-label":"Clear date",children:t.jsx(Q,{size:14})}):t.jsx(Rs,{"aria-hidden":"true",children:t.jsx(ar,{size:14})})]}),typeof g=="string"&&t.jsx(Ys,{$error:!0,children:g}),x&&t.jsxs(Hs,{role:"dialog","aria-label":"Calendar",children:[t.jsxs(qs,{children:[t.jsx(uo,{type:"button",onClick:I,"aria-label":"Previous month",children:t.jsx(dr,{size:16})}),t.jsxs(Us,{children:[Js[$]," ",k]}),t.jsx(uo,{type:"button",onClick:M,"aria-label":"Next month",children:t.jsx(pr,{size:16})})]}),t.jsxs(Ks,{children:[Xs.map(u=>t.jsx(Gs,{children:u},u)),E.map((u,O)=>{if(!u.currentMonth)return t.jsx(po,{type:"button",$currentMonth:!1,$selected:!1,$today:!1,disabled:!0,tabIndex:-1,children:u.day},O);const F=new Date(k,$,u.day),L=o?$o(F,o):!1,U=$o(F,f),K=Qs(F,c,d);return t.jsx(po,{type:"button",$currentMonth:!0,$selected:L,$today:U,disabled:K,"aria-label":rn(F),"aria-pressed":L,onClick:()=>w(u.day),children:u.day},O)})]})]})]})}Po.displayName="DatePicker";function sn(o){const r=parseInt(o.slice(1,3),16)/255,n=parseInt(o.slice(3,5),16)/255,e=parseInt(o.slice(5,7),16)/255,l=c=>c<=.03928?c/12.92:((c+.055)/1.055)**2.4;return .2126*l(r)+.7152*l(n)+.0722*l(e)>.179?"#111111":"#ffffff"}const q={colors:{primary:{50:"#fffde6",500:"#ffd000",700:"#ffd000",contrast:"#111111"},neutral:{0:"#ffffff",100:"#f5f0e8",200:"#e8e3db",300:"#ccc8c0",400:"#a8a49c",500:"#706c64",600:"#3c3830",900:"#111111"},error:{50:"#fff0f0",500:"#ff3333"},success:{50:"#f0fff4",500:"#00cc44"},warning:{50:"#fffbe6",500:"#ff9900"},info:{50:"#f0f0ff",500:"#3333ff"}},spacing:{1:"4px",2:"8px",3:"12px",4:"16px",5:"20px",6:"24px"},radius:{md:"2px"},zIndex:{modal:1e3,toast:1100},fontSizes:{xs:"12px",sm:"14px",md:"16px",lg:"18px"},shadows:{focusRing:"3px 3px 0 #111111"},brutalism:{borderWidth:"2px",shadowOffset:"4px"}};function nn(o){return{...q,colors:{...q.colors,primary:{50:"#fffff0",500:o,700:o,contrast:sn(o)}}}}function tn({theme:o=q,children:r}){return t.jsx(s.ThemeProvider,{theme:o,children:r})}const en=s.createGlobalStyle`
|
|
1199
1202
|
*, *::before, *::after {
|
|
1200
1203
|
box-sizing: border-box;
|
|
1201
1204
|
margin: 0;
|
|
@@ -1212,4 +1215,4 @@
|
|
|
1212
1215
|
button, input, select, textarea {
|
|
1213
1216
|
font-family: inherit;
|
|
1214
1217
|
}
|
|
1215
|
-
`;exports.Badge=go;exports.Button=H;exports.CollapsibleCard=zo;exports.ConfirmDialog=no;exports.ConfirmProvider=Fs;exports.DatePicker=Po;exports.Editable=vo;exports.Field=ko;exports.Form=jo;exports.FormField=Co;exports.GlobalStyles=en;exports.Input=xo;exports.Link=oo;exports.Modal=ro;exports.Select=
|
|
1218
|
+
`;exports.Badge=go;exports.Button=H;exports.CollapsibleCard=zo;exports.ConfirmDialog=no;exports.ConfirmProvider=Fs;exports.DatePicker=Po;exports.Editable=vo;exports.Field=ko;exports.Form=jo;exports.FormField=Co;exports.GlobalStyles=en;exports.Input=xo;exports.Link=oo;exports.Modal=ro;exports.Select=mo;exports.Spinner=To;exports.Table=Do;exports.Textarea=yo;exports.ThemeProvider=tn;exports.Toast=so;exports.ToastProvider=Hr;exports.createNeoBrutalTheme=nn;exports.neoBrutalTheme=q;exports.useConfirm=Ls;exports.useForm=Zr;exports.useTable=Ws;exports.useToast=qr;
|