blunt-ui 0.2.0 → 0.2.2

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 CHANGED
@@ -1,6 +1,6 @@
1
1
  # blunt-ui
2
2
 
3
- React + TypeScript + styled-components. Thick borders, offset shadows, no fluff. 8 components, 2 hooks.
3
+ React + TypeScript + styled-components. Thick borders, offset shadows, no fluff. 9 components, 2 hooks.
4
4
 
5
5
  **Live demo:** https://blunt-ui.vercel.app/
6
6
 
@@ -66,6 +66,30 @@ Sizes: `sm`, `md`, `lg`, `fullscreen`.
66
66
  </Modal>
67
67
  ```
68
68
 
69
+ ## CollapsibleCard
70
+
71
+ A card with a clickable header that shows/hides its content. Supports controlled and uncontrolled modes, an optional subtitle, a slot for header actions, and an `accentColor` prop to tint the border and chevron.
72
+
73
+ ```tsx
74
+ <CollapsibleCard title="blunt-ui" subtitle="Subtitle" defaultOpen>
75
+ React component library in neo-brutalism style.
76
+ </CollapsibleCard>
77
+ ```
78
+
79
+ Pass `open` + `onToggle` for controlled mode:
80
+
81
+ ```tsx
82
+ <CollapsibleCard
83
+ title="Project"
84
+ open={isOpen}
85
+ onToggle={setIsOpen}
86
+ accentColor="#f97316"
87
+ headerActions={<Badge variant="primary">npm</Badge>}
88
+ >
89
+ {children}
90
+ </CollapsibleCard>
91
+ ```
92
+
69
93
  ## Toast
70
94
 
71
95
  Pops up in a portal, auto-dismisses after 4 seconds. Set `duration={0}` to keep it until the user closes it.
@@ -0,0 +1,5 @@
1
+ import { CollapsibleCardProps } from './CollapsibleCard.types';
2
+ export declare function CollapsibleCard({ title, children, defaultOpen, open: controlledOpen, onToggle, subtitle, headerActions, accentColor, }: CollapsibleCardProps): import("react/jsx-runtime").JSX.Element;
3
+ export declare namespace CollapsibleCard {
4
+ var displayName: string;
5
+ }
@@ -0,0 +1,15 @@
1
+ import { Meta, StoryObj } from '@storybook/react';
2
+ import { ComponentProps } from 'react';
3
+ import { CollapsibleCard } from './CollapsibleCard';
4
+ type StoryArgs = ComponentProps<typeof CollapsibleCard> & {
5
+ text: string;
6
+ };
7
+ declare const meta: Meta<StoryArgs>;
8
+ export default meta;
9
+ type Story = StoryObj<StoryArgs>;
10
+ export declare const Default: Story;
11
+ export declare const WithSubtitle: Story;
12
+ export declare const WithHeaderActions: Story;
13
+ export declare const Controlled: Story;
14
+ export declare const ClosedByDefault: Story;
15
+ export declare const AccentColor: Story;
@@ -0,0 +1,11 @@
1
+ import { ReactNode } from 'react';
2
+ export interface CollapsibleCardProps {
3
+ title: string;
4
+ children: ReactNode;
5
+ defaultOpen?: boolean;
6
+ open?: boolean;
7
+ onToggle?: (open: boolean) => void;
8
+ subtitle?: string;
9
+ headerActions?: ReactNode;
10
+ accentColor?: string;
11
+ }
@@ -0,0 +1,2 @@
1
+ export { CollapsibleCard } from './CollapsibleCard';
2
+ export type { CollapsibleCardProps } from './CollapsibleCard.types';
package/dist/index.cjs CHANGED
@@ -1,15 +1,19 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),r=require("styled-components"),t=require("react"),A=require("react-dom"),I=(o,s,n)=>r.css`
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),r=require("styled-components"),a=require("react"),A=require("react-dom"),I=(o,s,n)=>r.css`
2
2
  background: ${s};
3
3
  color: ${n};
4
4
  border: ${o.brutalism.borderWidth} solid ${o.colors.neutral[900]};
5
5
  box-shadow: 2px 2px 0 ${o.colors.neutral[900]};
6
- `,Q=r.span`
6
+ `,no=r.span`
7
7
  display: inline-flex;
8
8
  align-items: center;
9
9
  font-weight: 700;
10
10
  letter-spacing: 0.04em;
11
11
  cursor: default;
12
12
  border-radius: ${({theme:o})=>o.radius.md};
13
+ white-space: nowrap;
14
+ overflow: hidden;
15
+ text-overflow: ellipsis;
16
+ max-width: 20ch;
13
17
 
14
18
  ${({$size:o,theme:s})=>({sm:r.css`
15
19
  padding: 2px 8px;
@@ -38,7 +42,7 @@
38
42
  background: ${s.colors.info[50]};
39
43
  color: ${s.colors.info[500]};
40
44
  `}[o]}
41
- `;function P({variant:o="primary",size:s="md",children:n,...e}){return a.jsx(Q,{$variant:o,$size:s,...e,children:n})}P.displayName="Badge";const F=(o,s,n)=>r.css`
45
+ `;function D({variant:o="primary",size:s="md",children:n,...e}){return t.jsx(no,{$variant:o,$size:s,...e,children:n})}D.displayName="Badge";const E=(o,s,n)=>r.css`
42
46
  background-color: ${s};
43
47
  color: ${n};
44
48
  border: ${o.brutalism.borderWidth} solid ${o.colors.neutral[900]};
@@ -51,7 +55,7 @@
51
55
  transform: translate(2px, 2px);
52
56
  box-shadow: 2px 2px 0 ${o.colors.neutral[900]};
53
57
  }
54
- `,oo=r.button`
58
+ `,to=r.button`
55
59
  display: inline-flex;
56
60
  align-items: center;
57
61
  justify-content: center;
@@ -70,7 +74,7 @@
70
74
  cursor: not-allowed;
71
75
  }
72
76
 
73
- ${({$variant:o,theme:s})=>s.brutalism?{primary:F(s,s.colors.primary[500],s.colors.primary.contrast),secondary:F(s,s.colors.neutral[100],s.colors.neutral[900]),outline:F(s,s.colors.neutral[0],s.colors.neutral[900])}[o]:{primary:r.css`
77
+ ${({$variant:o,theme:s})=>s.brutalism?{primary:E(s,s.colors.primary[500],s.colors.primary.contrast),secondary:E(s,s.colors.neutral[100],s.colors.neutral[900]),outline:E(s,s.colors.neutral[0],s.colors.neutral[900])}[o]:{primary:r.css`
74
78
  background-color: ${s.colors.primary[500]};
75
79
  color: ${s.colors.neutral[0]};
76
80
  border: none;
@@ -103,18 +107,18 @@
103
107
  padding: ${s.spacing[3]} ${s.spacing[6]};
104
108
  font-size: ${s.fontSizes.lg};
105
109
  `})[o]}
106
- `;function D({ref:o,as:s,href:n,variant:e="primary",size:c="md",isLoading:l,disabled:i,children:d,...g}){const f=s??(n?"a":"button");return a.jsx(oo,{ref:o,as:f,href:n,$variant:e,$size:c,disabled:l||i,...g,children:l?"Loading...":d})}D.displayName="Button";const so=r.div`
110
+ `;function Y({ref:o,as:s,href:n,variant:e="primary",size:c="md",isLoading:l,disabled:i,children:d,...p}){const u=s??(n?"a":"button");return t.jsx(to,{ref:o,as:u,href:n,$variant:e,$size:c,disabled:l||i,...p,children:l?"Loading...":d})}Y.displayName="Button";const eo=r.div`
107
111
  display: flex;
108
112
  flex-direction: column;
109
113
  gap: ${({theme:o})=>o.spacing[1]};
110
114
  width: ${({$fullWidth:o})=>o?"100%":"auto"};
111
- `,ro=r.label`
115
+ `,ao=r.label`
112
116
  font-size: ${({theme:o})=>o.fontSizes.sm};
113
117
  font-weight: ${({theme:o})=>o.brutalism?"700":"500"};
114
- `,no=r.span`
118
+ `,io=r.span`
115
119
  font-size: ${({theme:o})=>o.fontSizes.xs};
116
120
  color: ${({$error:o,theme:s})=>o?s.colors.error[500]:s.colors.neutral[500]};
117
- `,to=r.div`
121
+ `,lo=r.div`
118
122
  display: flex;
119
123
  align-items: center;
120
124
  border-radius: ${({theme:o})=>o.radius.md};
@@ -159,7 +163,7 @@
159
163
  &:focus-within {
160
164
  box-shadow: ${({theme:o})=>o.shadows.focusRing};
161
165
  }
162
- `,eo=r.input`
166
+ `,co=r.input`
163
167
  flex: 1;
164
168
  border: none;
165
169
  outline: none;
@@ -170,11 +174,11 @@
170
174
  cursor: not-allowed;
171
175
  opacity: 0.6;
172
176
  }
173
- `,R=r.div`
177
+ `,N=r.div`
174
178
  display: inline-flex;
175
179
  align-items: center;
176
180
  margin: 0 ${({theme:o})=>o.spacing[1]};
177
- `,ao=r.button`
181
+ `,uo=r.button`
178
182
  display: inline-flex;
179
183
  align-items: center;
180
184
  margin: 0 ${({theme:o})=>o.spacing[1]};
@@ -187,19 +191,19 @@
187
191
  &:hover {
188
192
  opacity: 0.8;
189
193
  }
190
- `;function Y({ref:o,type:s="text",size:n="md",variant:e="default",label:c,helperText:l,error:i,leftElement:d,rightElement:g,clearable:f,onClear:x,fullWidth:k,id:v,value:b,defaultValue:h,onChange:S,...w}){const m=t.useId(),C=v??m,z=`${C}-hint`,[j,u]=t.useState(h??""),p=b!==void 0,$=p?b:j,y=typeof i=="string"?i:void 0,T=!!(l||i),E=O=>{p||u(O.target.value),S?.(O)},J=()=>{p||u(""),x?.()};return a.jsxs(so,{$fullWidth:k,children:[c&&a.jsx(ro,{htmlFor:C,children:c}),a.jsxs(to,{$size:n,$variant:e,$error:!!i,children:[d&&a.jsx(R,{children:d}),a.jsx(eo,{id:C,ref:o,type:s,value:$,onChange:E,...w,"aria-invalid":!!i,"aria-describedby":T?z:void 0}),f&&$&&a.jsx(ao,{type:"button",onClick:J,"aria-label":"Clear input",children:"✕"}),g&&a.jsx(R,{children:g})]}),T&&a.jsx(no,{id:z,$error:!!i,children:y??l})]})}Y.displayName="Input";const io=r.keyframes`
194
+ `;function H({ref:o,type:s="text",size:n="md",variant:e="default",label:c,helperText:l,error:i,leftElement:d,rightElement:p,clearable:u,onClear:x,fullWidth:v,id:b,value:$,defaultValue:m,onChange:C,...h}){const k=a.useId(),j=b??k,S=`${j}-hint`,[z,f]=a.useState(m??""),g=$!==void 0,y=g?$:z,w=typeof i=="string"?i:void 0,T=!!(l||i),O=R=>{g||f(R.target.value),C?.(R)},ro=()=>{g||f(""),x?.()};return t.jsxs(eo,{$fullWidth:v,children:[c&&t.jsx(ao,{htmlFor:j,children:c}),t.jsxs(lo,{$size:n,$variant:e,$error:!!i,children:[d&&t.jsx(N,{children:d}),t.jsx(co,{id:j,ref:o,type:s,value:y,onChange:O,...h,"aria-invalid":!!i,"aria-describedby":T?S:void 0}),u&&y&&t.jsx(uo,{type:"button",onClick:ro,"aria-label":"Clear input",children:"✕"}),p&&t.jsx(N,{children:p})]}),T&&t.jsx(io,{id:S,$error:!!i,children:w??l})]})}H.displayName="Input";const fo=r.keyframes`
191
195
  from { opacity: 0; }
192
196
  to { opacity: 1; }
193
- `,lo=r.keyframes`
197
+ `,po=r.keyframes`
194
198
  from { opacity: 1; }
195
199
  to { opacity: 0; }
196
- `,co=r.keyframes`
200
+ `,go=r.keyframes`
197
201
  from { opacity: 0; transform: scale(0.95) translateY(-8px); }
198
202
  to { opacity: 1; transform: scale(1) translateY(0); }
199
- `,uo=r.keyframes`
203
+ `,bo=r.keyframes`
200
204
  from { opacity: 1; transform: scale(1) translateY(0); }
201
205
  to { opacity: 0; transform: scale(0.95) translateY(-8px); }
202
- `,fo=r.div`
206
+ `,$o=r.div`
203
207
  position: fixed;
204
208
  inset: 0;
205
209
  background-color: rgba(0, 0, 0, 0.5);
@@ -207,9 +211,9 @@
207
211
  align-items: center;
208
212
  justify-content: center;
209
213
  z-index: ${({theme:o})=>o.zIndex.modal};
210
- animation: ${({$closing:o})=>o?lo:io} 0.15s ease
214
+ animation: ${({$closing:o})=>o?po:fo} 0.15s ease
211
215
  forwards;
212
- `,po=r.div`
216
+ `,xo=r.div`
213
217
  position: relative;
214
218
  background: ${({theme:o})=>o.colors.neutral[0]};
215
219
  border-radius: ${({theme:o})=>o.radius.md};
@@ -218,7 +222,7 @@
218
222
  display: flex;
219
223
  flex-direction: column;
220
224
  max-height: 90vh;
221
- animation: ${({$closing:o})=>o?uo:co} 0.15s ease
225
+ animation: ${({$closing:o})=>o?bo:go} 0.15s ease
222
226
  forwards;
223
227
 
224
228
  ${({$size:o})=>o==="sm"&&r.css`
@@ -236,19 +240,19 @@
236
240
  max-height: 100vh;
237
241
  border-radius: 0;
238
242
  `}
239
- `,go=r.div`
243
+ `,yo=r.div`
240
244
  display: flex;
241
245
  align-items: center;
242
246
  gap: ${({theme:o})=>o.spacing[2]};
243
247
  padding: ${({theme:o})=>o.spacing[4]};
244
248
  border-bottom: 1px solid ${({theme:o})=>o.colors.neutral[200]};
245
249
  flex-shrink: 0;
246
- `,$o=r.h2`
250
+ `,mo=r.h2`
247
251
  flex: 1;
248
252
  font-size: ${({theme:o})=>o.fontSizes.lg};
249
253
  font-weight: 600;
250
254
  margin: 0;
251
- `,bo=r.button`
255
+ `,wo=r.button`
252
256
  display: inline-flex;
253
257
  align-items: center;
254
258
  justify-content: center;
@@ -273,11 +277,11 @@
273
277
  outline: 2px solid ${({theme:o})=>o.colors.primary[500]};
274
278
  outline-offset: 2px;
275
279
  }
276
- `,xo=r.div`
280
+ `,vo=r.div`
277
281
  padding: ${({theme:o})=>o.spacing[4]};
278
282
  overflow-y: auto;
279
283
  flex: 1;
280
- `,yo=r.div`
284
+ `,ko=r.div`
281
285
  display: flex;
282
286
  align-items: center;
283
287
  justify-content: flex-end;
@@ -285,16 +289,16 @@
285
289
  padding: ${({theme:o})=>o.spacing[4]};
286
290
  border-top: 1px solid ${({theme:o})=>o.colors.neutral[200]};
287
291
  flex-shrink: 0;
288
- `,mo=["button:not([disabled])","input:not([disabled])","select:not([disabled])","textarea:not([disabled])","a[href]",'[tabindex]:not([tabindex="-1"])'].join(", ");function N(o){return Array.from(o.querySelectorAll(mo))}function q({open:o,onClose:s,title:n,children:e,footer:c,size:l="md",closeOnBackdrop:i=!0,closeOnEscape:d=!0,ariaLabelledBy:g,ariaDescribedBy:f}){const x=t.useRef(null),k=t.useId(),v=g??(n?k:void 0),[b,h]=t.useState(o),[S,w]=t.useState(!1);return t.useEffect(()=>{if(o)h(!0),w(!1);else if(b){w(!0);const m=setTimeout(()=>{h(!1),w(!1)},150);return()=>clearTimeout(m)}},[o,b]),t.useEffect(()=>{if(!o)return;const m=document.body.style.overflow;return document.body.style.overflow="hidden",()=>{document.body.style.overflow=m}},[o]),t.useEffect(()=>{if(!o||!x.current)return;const m=x.current,C=document.activeElement;(N(m)[0]??m).focus();const j=u=>{if(u.key==="Escape"&&d){s();return}if(u.key!=="Tab")return;const p=N(m);if(p.length===0){u.preventDefault();return}const $=p[0],y=p[p.length-1];u.shiftKey?document.activeElement===$&&(u.preventDefault(),y.focus()):document.activeElement===y&&(u.preventDefault(),$.focus())};return document.addEventListener("keydown",j),()=>{document.removeEventListener("keydown",j),C?.focus()}},[o,d,s,b]),b?A.createPortal(a.jsx(fo,{$closing:S,onClick:i?s:void 0,children:a.jsxs(po,{ref:x,role:"dialog","aria-modal":"true","aria-labelledby":v,"aria-describedby":f,$size:l,$closing:S,tabIndex:-1,onClick:m=>m.stopPropagation(),children:[a.jsxs(go,{children:[n&&a.jsx($o,{id:k,children:n}),a.jsx(bo,{onClick:s,"aria-label":"Close modal",children:"×"})]}),a.jsx(xo,{children:e}),c&&a.jsx(yo,{children:c})]})}),document.body):null}q.displayName="Modal";const vo=r.keyframes`
292
+ `,ho=["button:not([disabled])","input:not([disabled])","select:not([disabled])","textarea:not([disabled])","a[href]",'[tabindex]:not([tabindex="-1"])'].join(", ");function V(o){return Array.from(o.querySelectorAll(ho))}function q({open:o,onClose:s,title:n,children:e,footer:c,size:l="md",closeOnBackdrop:i=!0,closeOnEscape:d=!0,ariaLabelledBy:p,ariaDescribedBy:u}){const x=a.useRef(null),v=a.useId(),b=p??(n?v:void 0),[$,m]=a.useState(o),[C,h]=a.useState(!1);return a.useEffect(()=>{if(o)m(!0),h(!1);else if($){h(!0);const k=setTimeout(()=>{m(!1),h(!1)},150);return()=>clearTimeout(k)}},[o,$]),a.useEffect(()=>{if(!o)return;const k=document.body.style.overflow;return document.body.style.overflow="hidden",()=>{document.body.style.overflow=k}},[o]),a.useEffect(()=>{if(!o||!x.current)return;const k=x.current,j=document.activeElement;(V(k)[0]??k).focus();const z=f=>{if(f.key==="Escape"&&d){s();return}if(f.key!=="Tab")return;const g=V(k);if(g.length===0){f.preventDefault();return}const y=g[0],w=g[g.length-1];f.shiftKey?document.activeElement===y&&(f.preventDefault(),w.focus()):document.activeElement===w&&(f.preventDefault(),y.focus())};return document.addEventListener("keydown",z),()=>{document.removeEventListener("keydown",z),j?.focus()}},[o,d,s,$]),$?A.createPortal(t.jsx($o,{$closing:C,onClick:i?s:void 0,children:t.jsxs(xo,{ref:x,role:"dialog","aria-modal":"true","aria-labelledby":b,"aria-describedby":u,$size:l,$closing:C,tabIndex:-1,onClick:k=>k.stopPropagation(),children:[t.jsxs(yo,{children:[n&&t.jsx(mo,{id:v,children:n}),t.jsx(wo,{onClick:s,"aria-label":"Close modal",children:"×"})]}),t.jsx(vo,{children:e}),c&&t.jsx(ko,{children:c})]})}),document.body):null}q.displayName="Modal";const _=(...o)=>o.filter((s,n,e)=>!!s&&s.trim()!==""&&e.indexOf(s)===n).join(" ").trim();const Co=o=>o.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase();const jo=o=>o.replace(/^([A-Z])|[\s-_]+(\w)/g,(s,n,e)=>e?e.toUpperCase():n.toLowerCase());const M=o=>{const s=jo(o);return s.charAt(0).toUpperCase()+s.slice(1)};var F={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 So=o=>{for(const s in o)if(s.startsWith("aria-")||s==="role"||s==="title")return!0;return!1},zo=a.createContext({}),Io=()=>a.useContext(zo),To=a.forwardRef(({color:o,size:s,strokeWidth:n,absoluteStrokeWidth:e,className:c="",children:l,iconNode:i,...d},p)=>{const{size:u=24,strokeWidth:x=2,absoluteStrokeWidth:v=!1,color:b="currentColor",className:$=""}=Io()??{},m=e??v?Number(n??x)*24/Number(s??u):n??x;return a.createElement("svg",{ref:p,...F,width:s??u??F.width,height:s??u??F.height,stroke:o??b,strokeWidth:m,className:_("lucide",$,c),...!l&&!So(d)&&{"aria-hidden":"true"},...d},[...i.map(([C,h])=>a.createElement(C,h)),...Array.isArray(l)?l:[l]])});const K=(o,s)=>{const n=a.forwardRef(({className:e,...c},l)=>a.createElement(To,{ref:l,iconNode:s,className:_(`lucide-${Co(M(o))}`,`lucide-${o}`,e),...c}));return n.displayName=M(o),n};const Wo=[["path",{d:"m6 9 6 6 6-6",key:"qrunsl"}]],U=K("chevron-down",Wo);const Bo=[["path",{d:"M18 6 6 18",key:"1bl5f8"}],["path",{d:"m6 6 12 12",key:"d8bk6v"}]],Z=K("x",Bo),Oo=r.keyframes`
289
293
  from { opacity: 0; transform: translateY(12px); }
290
294
  to { opacity: 1; transform: translateY(0); }
291
- `,wo=r.keyframes`
295
+ `,Eo=r.keyframes`
292
296
  from { opacity: 0; transform: translateY(-12px); }
293
297
  to { opacity: 1; transform: translateY(0); }
294
- `,ko=r.keyframes`
298
+ `,Fo=r.keyframes`
295
299
  from { opacity: 1; }
296
300
  to { opacity: 0; }
297
- `,ho=r.div`
301
+ `,Lo=r.div`
298
302
  position: fixed;
299
303
  z-index: ${({theme:o})=>o.zIndex.toast};
300
304
  display: flex;
@@ -304,14 +308,12 @@
304
308
  max-width: 400px;
305
309
  padding: ${({theme:o})=>`${o.spacing[3]} ${o.spacing[4]}`};
306
310
  border-radius: ${({theme:o})=>o.radius.md};
307
- border-left: 4px solid transparent;
308
- box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
309
311
  animation: ${({$closing:o,$position:s})=>o?r.css`
310
- ${ko} 0.2s ease forwards
312
+ ${Fo} 0.2s ease forwards
311
313
  `:s.startsWith("top")?r.css`
312
- ${wo} 0.2s ease forwards
314
+ ${Eo} 0.2s ease forwards
313
315
  `:r.css`
314
- ${vo} 0.2s ease forwards
316
+ ${Oo} 0.2s ease forwards
315
317
  `};
316
318
 
317
319
  ${({$position:o,theme:s})=>({"bottom-right":r.css`
@@ -327,27 +329,37 @@
327
329
  top: ${s.spacing[6]};
328
330
  left: ${s.spacing[6]};
329
331
  `})[o]}
330
- `,So=r(ho)`
331
- ${({$variant:o,theme:s})=>({success:r.css`
332
+ `,W=(o,s,n)=>r.css`
333
+ background: ${s};
334
+ border: ${o.brutalism.borderWidth} solid ${n};
335
+ box-shadow: ${o.brutalism.shadowOffset} ${o.brutalism.shadowOffset}
336
+ 0 ${n};
337
+ `,Ro=r(Lo)`
338
+ ${({$variant:o,theme:s})=>s.brutalism?{success:W(s,s.colors.success[50],s.colors.success[500]),error:W(s,s.colors.error[50],s.colors.error[500]),warning:W(s,s.colors.warning[50],s.colors.warning[500]),info:W(s,s.colors.info[50],s.colors.info[500])}[o]:{success:r.css`
332
339
  background: ${s.colors.success[50]};
333
- border-left-color: ${s.colors.success[500]};
340
+ border-left: 4px solid ${s.colors.success[500]};
341
+ box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
334
342
  `,error:r.css`
335
343
  background: ${s.colors.error[50]};
336
- border-left-color: ${s.colors.error[500]};
344
+ border-left: 4px solid ${s.colors.error[500]};
345
+ box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
337
346
  `,warning:r.css`
338
347
  background: ${s.colors.warning[50]};
339
- border-left-color: ${s.colors.warning[500]};
348
+ border-left: 4px solid ${s.colors.warning[500]};
349
+ box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
340
350
  `,info:r.css`
341
351
  background: ${s.colors.info[50]};
342
- border-left-color: ${s.colors.info[500]};
343
- `})[o]}
344
- `,Co=r.p`
352
+ border-left: 4px solid ${s.colors.info[500]};
353
+ box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
354
+ `}[o]}
355
+ `,No=r.p`
345
356
  flex: 1;
346
357
  margin: 0;
347
358
  font-size: ${({theme:o})=>o.fontSizes.sm};
359
+ font-weight: ${({theme:o})=>o.brutalism?600:400};
348
360
  line-height: 1.5;
349
361
  color: ${({theme:o})=>o.colors.neutral[900]};
350
- `,zo=r.button`
362
+ `,Vo=r.button`
351
363
  flex-shrink: 0;
352
364
  display: inline-flex;
353
365
  align-items: center;
@@ -358,8 +370,6 @@
358
370
  background: none;
359
371
  cursor: pointer;
360
372
  border-radius: ${({theme:o})=>o.radius.md};
361
- font-size: 18px;
362
- line-height: 1;
363
373
  color: ${({theme:o})=>o.colors.neutral[500]};
364
374
 
365
375
  &:hover {
@@ -371,38 +381,38 @@
371
381
  outline: 2px solid ${({theme:o})=>o.colors.primary[500]};
372
382
  outline-offset: 2px;
373
383
  }
374
- `;function L({open:o,onClose:s,message:n,variant:e="info",duration:c=4e3,position:l="bottom-right"}){const[i,d]=t.useState(o),[g,f]=t.useState(!1);return t.useEffect(()=>{if(o)d(!0),f(!1);else if(i){f(!0);const x=setTimeout(()=>{d(!1),f(!1)},200);return()=>clearTimeout(x)}},[o,i]),t.useEffect(()=>{if(!o||c===0)return;const x=setTimeout(s,c);return()=>clearTimeout(x)},[o,c,s]),i?A.createPortal(a.jsxs(So,{$position:l,$variant:e,$closing:g,role:"alert","aria-live":"polite",children:[a.jsx(Co,{children:n}),a.jsx(zo,{onClick:s,"aria-label":"Close notification",children:"×"})]}),document.body):null}L.displayName="Toast";const jo=r.form`
384
+ `;function L({open:o,onClose:s,message:n,variant:e="info",duration:c=4e3,position:l="bottom-right"}){const[i,d]=a.useState(o),[p,u]=a.useState(!1);return a.useEffect(()=>{if(o)d(!0),u(!1);else if(i){u(!0);const x=setTimeout(()=>{d(!1),u(!1)},200);return()=>clearTimeout(x)}},[o,i]),a.useEffect(()=>{if(!o||c===0)return;const x=setTimeout(s,c);return()=>clearTimeout(x)},[o,c,s]),i?A.createPortal(t.jsxs(Ro,{$position:l,$variant:e,$closing:p,role:"alert","aria-live":"polite",children:[t.jsx(No,{children:n}),t.jsx(Vo,{onClick:s,"aria-label":"Close notification",children:t.jsx(Z,{size:14,strokeWidth:2.5})})]}),document.body):null}L.displayName="Toast";const Mo=r.form`
375
385
  display: flex;
376
386
  flex-direction: column;
377
387
  gap: ${({theme:o})=>o.spacing[4]};
378
- `,Io=r.div`
388
+ `,Po=r.div`
379
389
  display: flex;
380
390
  flex-direction: column;
381
391
  gap: ${({theme:o})=>o.spacing[1]};
382
- `,To=r.label`
392
+ `,Ao=r.label`
383
393
  font-size: ${({theme:o})=>o.fontSizes.sm};
384
394
  font-weight: 500;
385
395
  color: ${({theme:o})=>o.colors.neutral[900]};
386
- `,Bo=r.span`
396
+ `,Do=r.span`
387
397
  color: ${({theme:o})=>o.colors.error[500]};
388
398
  margin-left: 2px;
389
399
  aria-hidden: true;
390
- `,Eo=r.span`
400
+ `,Yo=r.span`
391
401
  font-size: ${({theme:o})=>o.fontSizes.xs};
392
402
  color: ${({$error:o,theme:s})=>o?s.colors.error[500]:s.colors.neutral[500]};
393
- `;function _({onSubmit:o,children:s,...n}){return a.jsx(jo,{onSubmit:e=>{e.preventDefault(),o?.(e)},noValidate:!0,...n,children:s})}_.displayName="Form";function H({label:o,error:s,helperText:n,required:e,children:c}){const l=t.useId(),i=`${l}-hint`,d=!!(s||n),g=typeof s=="string"?s:void 0,f=t.isValidElement(c)?t.cloneElement(c,{id:l,...d&&{"aria-describedby":i},...s&&{"aria-invalid":!0}}):c;return a.jsxs(Io,{children:[o&&a.jsxs(To,{htmlFor:l,children:[o,e&&a.jsx(Bo,{"aria-hidden":"true",children:" *"})]}),f,d&&a.jsx(Eo,{id:i,$error:!!s,children:g??n})]})}H.displayName="FormField";const K=(...o)=>o.filter((s,n,e)=>!!s&&s.trim()!==""&&e.indexOf(s)===n).join(" ").trim();const Fo=o=>o.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase();const Wo=o=>o.replace(/^([A-Z])|[\s-_]+(\w)/g,(s,n,e)=>e?e.toUpperCase():n.toLowerCase());const V=o=>{const s=Wo(o);return s.charAt(0).toUpperCase()+s.slice(1)};var W={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 Lo=o=>{for(const s in o)if(s.startsWith("aria-")||s==="role"||s==="title")return!0;return!1},Oo=t.createContext({}),Ro=()=>t.useContext(Oo),No=t.forwardRef(({color:o,size:s,strokeWidth:n,absoluteStrokeWidth:e,className:c="",children:l,iconNode:i,...d},g)=>{const{size:f=24,strokeWidth:x=2,absoluteStrokeWidth:k=!1,color:v="currentColor",className:b=""}=Ro()??{},h=e??k?Number(n??x)*24/Number(s??f):n??x;return t.createElement("svg",{ref:g,...W,width:s??f??W.width,height:s??f??W.height,stroke:o??v,strokeWidth:h,className:K("lucide",b,c),...!l&&!Lo(d)&&{"aria-hidden":"true"},...d},[...i.map(([S,w])=>t.createElement(S,w)),...Array.isArray(l)?l:[l]])});const U=(o,s)=>{const n=t.forwardRef(({className:e,...c},l)=>t.createElement(No,{ref:l,iconNode:s,className:K(`lucide-${Fo(V(o))}`,`lucide-${o}`,e),...c}));return n.displayName=V(o),n};const Vo=[["path",{d:"m6 9 6 6 6-6",key:"qrunsl"}]],Mo=U("chevron-down",Vo);const Ao=[["path",{d:"M18 6 6 18",key:"1bl5f8"}],["path",{d:"m6 6 12 12",key:"d8bk6v"}]],Po=U("x",Ao),Do=r.div`
403
+ `;function X({onSubmit:o,children:s,...n}){return t.jsx(Mo,{onSubmit:e=>{e.preventDefault(),o?.(e)},noValidate:!0,...n,children:s})}X.displayName="Form";function G({label:o,error:s,helperText:n,required:e,children:c}){const l=a.useId(),i=`${l}-hint`,d=!!(s||n),p=typeof s=="string"?s:void 0,u=a.isValidElement(c)?a.cloneElement(c,{id:l,...d&&{"aria-describedby":i},...s&&{"aria-invalid":!0}}):c;return t.jsxs(Po,{children:[o&&t.jsxs(Ao,{htmlFor:l,children:[o,e&&t.jsx(Do,{"aria-hidden":"true",children:" *"})]}),u,d&&t.jsx(Yo,{id:i,$error:!!s,children:p??n})]})}G.displayName="FormField";const Ho=r.div`
394
404
  display: inline-flex;
395
405
  flex-direction: column;
396
406
  gap: ${({theme:o})=>o.spacing[1]};
397
407
  width: ${({$fullWidth:o})=>o?"100%":"auto"};
398
- `,Yo=r.div`
408
+ `,qo=r.div`
399
409
  position: relative;
400
410
  display: flex;
401
411
  width: 100%;
402
- `,qo=r.span`
412
+ `,_o=r.span`
403
413
  font-size: ${({theme:o})=>o.fontSizes.xs};
404
414
  color: ${({$error:o,theme:s})=>o?s.colors.error[500]:s.colors.neutral[500]};
405
- `,_o=r.select`
415
+ `,Ko=r.select`
406
416
  appearance: none;
407
417
  width: 100%;
408
418
  border-radius: ${({theme:o})=>o.radius.md};
@@ -455,7 +465,7 @@
455
465
  cursor: not-allowed;
456
466
  opacity: 0.6;
457
467
  }
458
- `,Ho=r.button`
468
+ `,Uo=r.button`
459
469
  position: absolute;
460
470
  right: ${({theme:o})=>o.spacing[3]};
461
471
  top: 50%;
@@ -477,7 +487,7 @@
477
487
  outline-offset: 2px;
478
488
  border-radius: 2px;
479
489
  }
480
- `,Ko=r.span`
490
+ `,Zo=r.span`
481
491
  position: absolute;
482
492
  right: ${({theme:o})=>o.spacing[3]};
483
493
  top: 50%;
@@ -486,7 +496,7 @@
486
496
  display: flex;
487
497
  align-items: center;
488
498
  color: ${({theme:o})=>o.colors.neutral[500]};
489
- `;function Z({options:o,placeholder:s,size:n="md",variant:e="default",error:c,fullWidth:l,clearable:i,onClear:d,id:g,value:f,defaultValue:x,onChange:k,...v}){const b=t.useId(),h=g??b,S=`${h}-hint`,w=typeof c=="string"?c:void 0,[m,C]=t.useState(x??""),z=f!==void 0,j=z?f:m,u=y=>{z||C(y.target.value),k?.(y)},p=()=>{z||C(""),d?.()},$=i&&!!j;return a.jsxs(Do,{$fullWidth:l,children:[a.jsxs(Yo,{children:[a.jsxs(_o,{id:h,$size:n,$variant:e,$error:!!c,"aria-invalid":!!c,"aria-describedby":w?S:void 0,value:j,onChange:u,...v,children:[s&&a.jsx("option",{value:"",disabled:!0,children:s}),o.map(y=>a.jsx("option",{value:y.value,disabled:y.disabled,children:y.label},y.value))]}),$?a.jsx(Ho,{type:"button",onClick:p,"aria-label":"Clear selection",children:a.jsx(Po,{size:14})}):a.jsx(Ko,{"aria-hidden":"true",children:a.jsx(Mo,{size:14})})]}),w&&a.jsx(qo,{id:S,$error:!0,children:w})]})}Z.displayName="Select";const Uo=r.a`
499
+ `;function J({options:o,placeholder:s,size:n="md",variant:e="default",error:c,fullWidth:l,clearable:i,onClear:d,id:p,value:u,defaultValue:x,onChange:v,...b}){const $=a.useId(),m=p??$,C=`${m}-hint`,h=typeof c=="string"?c:void 0,[k,j]=a.useState(x??""),S=u!==void 0,z=S?u:k,f=w=>{S||j(w.target.value),v?.(w)},g=()=>{S||j(""),d?.()},y=i&&!!z;return t.jsxs(Ho,{$fullWidth:l,children:[t.jsxs(qo,{children:[t.jsxs(Ko,{id:m,$size:n,$variant:e,$error:!!c,"aria-invalid":!!c,"aria-describedby":h?C:void 0,value:z,onChange:f,...b,children:[s&&t.jsx("option",{value:"",disabled:!0,children:s}),o.map(w=>t.jsx("option",{value:w.value,disabled:w.disabled,children:w.label},w.value))]}),y?t.jsx(Uo,{type:"button",onClick:g,"aria-label":"Clear selection",children:t.jsx(Z,{size:14})}):t.jsx(Zo,{"aria-hidden":"true",children:t.jsx(U,{size:14})})]}),h&&t.jsx(_o,{id:C,$error:!0,children:h})]})}J.displayName="Select";const Xo=r.a`
490
500
  text-decoration: underline;
491
501
  text-underline-offset: 2px;
492
502
  transition: color 0.15s;
@@ -508,4 +518,84 @@
508
518
  color: ${s.colors.neutral[900]};
509
519
  }
510
520
  `})[o]}
511
- `;function X({variant:o="default",external:s,children:n,...e}){return a.jsx(Uo,{$variant:o,...s&&{target:"_blank",rel:"noreferrer"},...e,children:n})}X.displayName="Link";const G=t.createContext(null);function Zo({children:o}){const[s,n]=t.useState(null),e=t.useCallback(l=>{n({...l,id:Date.now()})},[]),c=t.useMemo(()=>{const l=i=>e(i);return l.success=(i,d)=>e({...d,message:i,variant:"success"}),l.error=(i,d)=>e({...d,message:i,variant:"error"}),l.warning=(i,d)=>e({...d,message:i,variant:"warning"}),l.info=(i,d)=>e({...d,message:i,variant:"info"}),l},[e]);return a.jsxs(G.Provider,{value:{toast:c},children:[o,s&&a.jsx(L,{open:!0,onClose:()=>n(null),message:s.message,variant:s.variant,duration:s.duration,position:s.position},s.id)]})}function Xo(){const o=t.useContext(G);if(!o)throw new Error("useToast must be used within a ToastProvider");return o}function Go({initialValues:o,validate:s,onSubmit:n,onError:e}){const[c,l]=t.useState(o),[i,d]=t.useState({}),[g,f]=t.useState({}),[x,k]=t.useState(!1),v=t.useRef(c);v.current=c;const b=t.useCallback(u=>{if(!s)return{};const p=s(u);return Object.fromEntries(Object.entries(p).filter(([,$])=>$!==void 0))},[s]),h=t.useRef(g);h.current=g;const S=t.useCallback(u=>{const{name:p,value:$}=u.target,y={...v.current,[p]:$};l(y),h.current[p]&&d(b(y))},[b]),w=t.useCallback(u=>{const{name:p}=u.target;f($=>({...$,[p]:!0})),d(b(v.current))},[b]),m=t.useCallback(u=>{u?.preventDefault();const p=Object.keys(v.current).reduce((T,E)=>({...T,[E]:!0}),{});f(p);const $=b(v.current);if(d($),Object.keys($).length>0){e?.($);return}(async()=>{k(!0);try{await n?.(v.current)}finally{k(!1)}})()},[b,n,e]),C=t.useCallback((u,p)=>{l($=>({...$,[u]:p}))},[]),z=t.useCallback(()=>{l(o),d({}),f({}),k(!1)},[o]),j=Object.fromEntries(Object.entries(i).filter(([u])=>g[u]));return{values:c,errors:j,touched:g,handleChange:S,handleBlur:w,handleSubmit:m,setFieldValue:C,reset:z,isSubmitting:x}}const M={primary:{50:"#f0f8ff",500:"#0070f3",700:"#005bb5"},neutral:{0:"#ffffff",100:"#f5f5f5",200:"#eaeaea",300:"#cacaca",400:"#cccccc",500:"#666666",600:"#333333",900:"#111111"},error:{50:"#fef2f2",500:"#d32f2f"},success:{50:"#f0fdf4",500:"#16a34a"},warning:{50:"#fffbeb",500:"#d97706"},info:{50:"#eff6ff",500:"#2563eb"}},Jo={1:"4px",2:"8px",3:"12px",4:"16px",5:"20px",6:"24px"},Qo={md:"6px"},os={modal:1e3,toast:1100},ss={xs:"12px",sm:"14px",md:"16px",lg:"18px"},rs={colors:{...M,primary:{...M.primary,contrast:"#ffffff"}},spacing:Jo,fontSizes:ss,radius:Qo,zIndex:os,shadows:{focusRing:"0 0 0 2px rgba(0, 112, 243, 0.25)"}};function ns(o){const s=parseInt(o.slice(1,3),16)/255,n=parseInt(o.slice(3,5),16)/255,e=parseInt(o.slice(5,7),16)/255,c=i=>i<=.03928?i/12.92:((i+.055)/1.055)**2.4;return .2126*c(s)+.7152*c(n)+.0722*c(e)>.179?"#111111":"#ffffff"}const B={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 ts(o){return{...B,colors:{...B.colors,primary:{50:"#fffff0",500:o,700:o,contrast:ns(o)}}}}function es({theme:o=B,children:s}){return a.jsx(r.ThemeProvider,{theme:o,children:s})}exports.Badge=P;exports.Button=D;exports.Form=_;exports.FormField=H;exports.Input=Y;exports.Link=X;exports.Modal=q;exports.Select=Z;exports.ThemeProvider=es;exports.Toast=L;exports.ToastProvider=Zo;exports.createNeoBrutalTheme=ts;exports.defaultTheme=rs;exports.neoBrutalTheme=B;exports.useForm=Go;exports.useToast=Xo;
521
+ `;function Q({variant:o="default",external:s,children:n,...e}){return t.jsx(Xo,{$variant:o,...s&&{target:"_blank",rel:"noreferrer"},...e,children:n})}Q.displayName="Link";const Go=r.div`
522
+ border-radius: ${({theme:o})=>o.radius.md};
523
+ background: ${({theme:o})=>o.colors.neutral[0]};
524
+ overflow: hidden;
525
+
526
+ ${({theme:o,$accentColor:s})=>o.brutalism?r.css`
527
+ border: ${o.brutalism.borderWidth} solid
528
+ ${s??o.colors.neutral[900]};
529
+ box-shadow: ${o.brutalism.shadowOffset}
530
+ ${o.brutalism.shadowOffset} 0
531
+ ${s??o.colors.neutral[900]};
532
+ `:r.css`
533
+ border: 1px solid ${s??o.colors.neutral[200]};
534
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
535
+ `}
536
+ `,Jo=r.button`
537
+ width: 100%;
538
+ display: flex;
539
+ align-items: flex-start;
540
+ gap: ${({theme:o})=>o.spacing[3]};
541
+ padding: ${({theme:o})=>o.spacing[4]};
542
+ background: ${({theme:o})=>o.brutalism?o.colors.neutral[100]:o.colors.neutral[0]};
543
+ border: none;
544
+ cursor: pointer;
545
+ text-align: left;
546
+
547
+ &:hover {
548
+ background: ${({theme:o})=>o.colors.neutral[100]};
549
+ }
550
+
551
+ &:focus-visible {
552
+ outline: 2px solid
553
+ ${({theme:o,$accentColor:s})=>s??o.colors.primary[500]};
554
+ outline-offset: -2px;
555
+ }
556
+ `,Qo=r.div`
557
+ flex: 1;
558
+ min-width: 0;
559
+ `,os=r.span`
560
+ display: block;
561
+ font-size: ${({theme:o})=>o.fontSizes.md};
562
+ font-weight: 600;
563
+ color: ${({theme:o})=>o.colors.neutral[900]};
564
+ `,ss=r.span`
565
+ display: block;
566
+ font-size: ${({theme:o})=>o.fontSizes.sm};
567
+ color: ${({theme:o})=>o.colors.neutral[500]};
568
+ `,rs=r.div`
569
+ display: flex;
570
+ flex-direction: row;
571
+ align-items: center;
572
+ justify-content: space-between;
573
+ margin-top: ${({theme:o})=>o.spacing[1]};
574
+
575
+ @media (max-width: 640px) {
576
+ flex-direction: column;
577
+ align-items: flex-start;
578
+ gap: ${({theme:o})=>o.spacing[2]};
579
+ }
580
+ `,ns=r.div`
581
+ display: flex;
582
+ align-items: center;
583
+ gap: ${({theme:o})=>o.spacing[2]};
584
+ `,ts=r.span`
585
+ display: inline-flex;
586
+ align-items: center;
587
+ justify-content: center;
588
+ flex-shrink: 0;
589
+ transition: transform 0.2s ease;
590
+ transform: ${({$open:o})=>o?"rotate(180deg)":"rotate(0deg)"};
591
+ color: ${({theme:o,$accentColor:s})=>s??o.colors.neutral[500]};
592
+ `,es=r.div`
593
+ display: grid;
594
+ grid-template-rows: ${({$open:o})=>o?"1fr":"0fr"};
595
+ transition: grid-template-rows 0.2s ease;
596
+ `,as=r.div`
597
+ overflow: hidden;
598
+ `,is=r.div`
599
+ padding: ${({theme:o})=>o.spacing[4]};
600
+ border-top: 1px solid ${({theme:o})=>o.colors.neutral[200]};
601
+ `;function oo({title:o,children:s,defaultOpen:n=!1,open:e,onToggle:c,subtitle:l,headerActions:i,accentColor:d}){const[p,u]=a.useState(n),x=a.useId(),v=e!==void 0,b=v?e:p,$=()=>{const m=!b;v||u(m),c?.(m)};return t.jsxs(Go,{$accentColor:d,children:[t.jsxs(Jo,{type:"button",$open:b,$accentColor:d,"aria-expanded":b,"aria-controls":x,onClick:$,children:[t.jsxs(Qo,{children:[t.jsx(os,{children:o}),(l||i)&&t.jsxs(rs,{children:[l&&t.jsx(ss,{children:l}),i&&t.jsx(ns,{onClick:m=>m.stopPropagation(),children:i})]})]}),t.jsx(ts,{$open:b,$accentColor:d,"aria-hidden":"true",children:t.jsx(U,{size:18,strokeWidth:2.5})})]}),t.jsx(es,{$open:b,children:t.jsx(as,{id:x,role:"region","aria-label":o,children:t.jsx(is,{children:s})})})]})}oo.displayName="CollapsibleCard";const so=a.createContext(null);function ls({children:o}){const[s,n]=a.useState(null),e=a.useCallback(l=>{n({...l,id:Date.now()})},[]),c=a.useMemo(()=>{const l=i=>e(i);return l.success=(i,d)=>e({...d,message:i,variant:"success"}),l.error=(i,d)=>e({...d,message:i,variant:"error"}),l.warning=(i,d)=>e({...d,message:i,variant:"warning"}),l.info=(i,d)=>e({...d,message:i,variant:"info"}),l},[e]);return t.jsxs(so.Provider,{value:{toast:c},children:[o,s&&t.jsx(L,{open:!0,onClose:()=>n(null),message:s.message,variant:s.variant,duration:s.duration,position:s.position},s.id)]})}function cs(){const o=a.useContext(so);if(!o)throw new Error("useToast must be used within a ToastProvider");return o}function ds({initialValues:o,validate:s,onSubmit:n,onError:e}){const[c,l]=a.useState(o),[i,d]=a.useState({}),[p,u]=a.useState({}),[x,v]=a.useState(!1),b=a.useRef(c);b.current=c;const $=a.useCallback(f=>{if(!s)return{};const g=s(f);return Object.fromEntries(Object.entries(g).filter(([,y])=>y!==void 0))},[s]),m=a.useRef(p);m.current=p;const C=a.useCallback(f=>{const{name:g,value:y}=f.target,w={...b.current,[g]:y};l(w),m.current[g]&&d($(w))},[$]),h=a.useCallback(f=>{const{name:g}=f.target;u(y=>({...y,[g]:!0})),d($(b.current))},[$]),k=a.useCallback(f=>{f?.preventDefault();const g=Object.keys(b.current).reduce((T,O)=>({...T,[O]:!0}),{});u(g);const y=$(b.current);if(d(y),Object.keys(y).length>0){e?.(y);return}(async()=>{v(!0);try{await n?.(b.current)}finally{v(!1)}})()},[$,n,e]),j=a.useCallback((f,g)=>{l(y=>({...y,[f]:g}))},[]),S=a.useCallback(()=>{l(o),d({}),u({}),v(!1)},[o]),z=Object.fromEntries(Object.entries(i).filter(([f])=>p[f]));return{values:c,errors:z,touched:p,handleChange:C,handleBlur:h,handleSubmit:k,setFieldValue:j,reset:S,isSubmitting:x}}const P={primary:{50:"#f0f8ff",500:"#0070f3",700:"#005bb5"},neutral:{0:"#ffffff",100:"#f5f5f5",200:"#eaeaea",300:"#cacaca",400:"#cccccc",500:"#666666",600:"#333333",900:"#111111"},error:{50:"#fef2f2",500:"#d32f2f"},success:{50:"#f0fdf4",500:"#16a34a"},warning:{50:"#fffbeb",500:"#d97706"},info:{50:"#eff6ff",500:"#2563eb"}},us={1:"4px",2:"8px",3:"12px",4:"16px",5:"20px",6:"24px"},fs={md:"6px"},ps={modal:1e3,toast:1100},gs={xs:"12px",sm:"14px",md:"16px",lg:"18px"},bs={colors:{...P,primary:{...P.primary,contrast:"#ffffff"}},spacing:us,fontSizes:gs,radius:fs,zIndex:ps,shadows:{focusRing:"0 0 0 2px rgba(0, 112, 243, 0.25)"}};function $s(o){const s=parseInt(o.slice(1,3),16)/255,n=parseInt(o.slice(3,5),16)/255,e=parseInt(o.slice(5,7),16)/255,c=i=>i<=.03928?i/12.92:((i+.055)/1.055)**2.4;return .2126*c(s)+.7152*c(n)+.0722*c(e)>.179?"#111111":"#ffffff"}const B={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 xs(o){return{...B,colors:{...B.colors,primary:{50:"#fffff0",500:o,700:o,contrast:$s(o)}}}}function ys({theme:o=B,children:s}){return t.jsx(r.ThemeProvider,{theme:o,children:s})}exports.Badge=D;exports.Button=Y;exports.CollapsibleCard=oo;exports.Form=X;exports.FormField=G;exports.Input=H;exports.Link=Q;exports.Modal=q;exports.Select=J;exports.ThemeProvider=ys;exports.Toast=L;exports.ToastProvider=ls;exports.createNeoBrutalTheme=xs;exports.defaultTheme=bs;exports.neoBrutalTheme=B;exports.useForm=ds;exports.useToast=cs;
package/dist/index.d.ts CHANGED
@@ -14,6 +14,8 @@ export { Select } from './components/Select';
14
14
  export type { SelectProps, SelectOption, SelectSizes, SelectVariants, } from './components/Select';
15
15
  export { Link } from './components/Link';
16
16
  export type { LinkProps, LinkVariants } from './components/Link';
17
+ export { CollapsibleCard } from './components/CollapsibleCard';
18
+ export type { CollapsibleCardProps } from './components/CollapsibleCard';
17
19
  export { useToast, ToastProvider } from './hooks';
18
20
  export type { ToastOptions, ToastFn, ToastContextValue } from './hooks';
19
21
  export { useForm } from './hooks';