@lukeashford/aurelius 1.0.1 → 1.1.0

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/dist/llms.md DELETED
@@ -1,325 +0,0 @@
1
- # Aurelius Design System Philosophy
2
-
3
- ## Core Principles
4
- Aurelius is a design system for creative technologists, blending technical sophistication with an artistic, cinematic aesthetic. The visual language relies on deep blacks, rich golds, and refined typography to convey stability, trust, and quiet luxury.
5
-
6
- ## Implementation Strategy
7
- **Hierarchy:** React Components > Component Classes > Utility Classes > Design Tokens.
8
-
9
- 1. **React Components:** Use exported components (e.g., `<Button />`) whenever possible.
10
- 2. **Component Classes:** Fallback to semantic CSS classes (e.g., `.btn`) if no React component fits.
11
- 3. **Utility Classes:** Build custom elements using Tailwind utilities with semantic tokens (e.g., `bg-obsidian`).
12
- 4. **Design Tokens:** Use raw tokens only as a last resort.
13
-
14
- ## Visual Guidelines
15
- * **Theme:** Strictly dark mode. Avoid white backgrounds for containers; use `obsidian` (#0a0a0a) or `charcoal` (#141414).
16
- * **Typography:** Use the system font stack via our utility classes. Do not introduce external fonts unless specified.
17
- * **Borders:** Prefer subtle 1px borders (`border-ash`) over heavy drop shadows.
18
- * **Primary Color:** Gold (#c9a227) is reserved for primary actions and key highlights.
19
-
20
- **Instruction for AI Agents:**
21
- Before generating code, verify if an existing component in this package meets the requirement. Hallucinating new styles for standard elements is strictly prohibited. Check the Manifest below for available tools.
22
-
23
-
24
- ## React Components API
25
-
26
- ### <Alert />
27
- **Props:**
28
- - `variant?: AlertVariant`
29
- - `title?: string`
30
-
31
- ### <Avatar />
32
- **Props:**
33
- - `src?: string`
34
- - `alt?: string`
35
- - `name?: string`
36
- - `size?: AvatarSize`
37
- - `status?: 'online' | 'offline' | 'busy'`
38
-
39
- ### <Badge />
40
- **Props:**
41
- - `variant?: BadgeVariant`
42
-
43
- ### <Button />
44
- **Props:**
45
- - `variant?: ButtonVariant`
46
- - `size?: ButtonSize`
47
- - `loading?: boolean`
48
-
49
- ### <Card />
50
- **Props:**
51
- - `variant?: CardVariant`
52
- - `interactive?: boolean`
53
-
54
- ### <Checkbox />
55
- **Props:**
56
- - `label?: string`
57
-
58
- ### <HelperText />
59
- **Props:**
60
- - `error?: boolean`
61
-
62
- ### <Input />
63
- **Props:**
64
- - `error?: boolean`
65
- - `leadingIcon?: React.ReactNode`
66
- - `trailingIcon?: React.ReactNode`
67
-
68
- ### <Label />
69
- **Props:**
70
- - `required?: boolean`
71
-
72
- ### <Modal />
73
- **Props:**
74
- - `isOpen: boolean`
75
- - `onClose: () => void`
76
- - `title?: string`
77
- - `children: React.ReactNode`
78
- - `className?: string`
79
-
80
- ### <Radio />
81
- **Props:**
82
- - `label?: string`
83
-
84
- ### <Select />
85
- **Props:**
86
- - `error?: boolean`
87
- - `options?: SelectOption[]`
88
-
89
- ### <Skeleton />
90
-
91
- ### <Spinner />
92
- **Props:**
93
- - `size?: 'sm' | 'md' | 'lg'`
94
-
95
- ### <Switch />
96
- **Props:**
97
- - `checked?: boolean`
98
- - `defaultChecked?: boolean`
99
- - `onCheckedChange?: (checked: boolean) => void`
100
- - `label?: string`
101
-
102
- ### <Textarea />
103
- **Props:**
104
- - `error?: boolean`
105
-
106
- ### <Tooltip />
107
- **Props:**
108
- - `content: React.ReactNode`
109
- - `children: React.ReactElement`
110
- - `open?: boolean`
111
- - `side?: 'top' | 'right' | 'bottom' | 'left'`
112
-
113
- ## CSS Classes & Tailwind Utilities
114
-
115
- ### Component Classes
116
-
117
- | Class | Description |
118
- |---|---|
119
- | `.alert` | |
120
- | `.alert-error` | |
121
- | `.alert-info` | |
122
- | `.alert-success` | |
123
- | `.alert-warning` | |
124
- | `.avatar` | |
125
- | `.avatar-2xl` | |
126
- | `.avatar-lg` | |
127
- | `.avatar-md` | |
128
- | `.avatar-sm` | |
129
- | `.avatar-xl` | |
130
- | `.avatar-xs` | |
131
- | `.badge` | |
132
- | `.badge-default` | |
133
- | `.badge-error` | |
134
- | `.badge-gold` | |
135
- | `.badge-info` | |
136
- | `.badge-success` | |
137
- | `.badge-warning` | |
138
- | `.btn` | |
139
- | `.btn-danger` | |
140
- | `.btn-elevated` | |
141
- | `.btn-featured` | |
142
- | `.btn-ghost` | |
143
- | `.btn-important` | |
144
- | `.btn-lg` | |
145
- | `.btn-md` | |
146
- | `.btn-outlined` | |
147
- | `.btn-primary` | |
148
- | `.btn-sm` | |
149
- | `.btn-xl` | |
150
- | `.card` | |
151
- | `.card-elevated` | |
152
- | `.card-featured` | |
153
- | `.card-interactive` | |
154
- | `.card-outlined` | |
155
- | `.checkbox` | |
156
- | `.divider` | |
157
- | `.divider-vertical` | |
158
- | `.input` | |
159
- | `.input-error` | |
160
- | `.label` | |
161
- | `.label-required` | |
162
- | `.modal-backdrop` | |
163
- | `.modal-content` | |
164
- | `.radio` | |
165
- | `.select` | |
166
- | `.switch` | |
167
- | `.switch-thumb` | |
168
- | `.textarea` | |
169
- | `.textarea-error` | |
170
- | `.tooltip` | |
171
-
172
- ### Utility Classes
173
-
174
- | Class | Description |
175
- |---|---|
176
- | `.backdrop-glass` | |
177
- | `.center-absolute` | |
178
- | `.focus-ring` | |
179
- | `.glow` | |
180
- | `.glow-lg` | |
181
- | `.glow-sm` | |
182
- | `.line-clamp-2` | |
183
- | `.line-clamp-3` | |
184
- | `.scroll-smooth` | |
185
- | `.scrollbar-hide` | |
186
- | `.text-gradient-gold` | |
187
- | `.truncate` | |
188
-
189
- ## Design Tokens
190
-
191
- ### Colors
192
-
193
- | Token | Value |
194
- |---|---|
195
- | `colors.void` | #000000 |
196
- | `colors.obsidian` | #0a0a0a |
197
- | `colors.charcoal` | #141414 |
198
- | `colors.graphite` | #1f1f1f |
199
- | `colors.slate` | #2a2a2a |
200
- | `colors.ash` | #3d3d3d |
201
- | `colors.gold` | #c9a227 |
202
- | `colors.goldLight` | #d4b84a |
203
- | `colors.goldBright` | #e5c84d |
204
- | `colors.goldMuted` | #8b7355 |
205
- | `colors.goldPale` | #d4c4a8 |
206
- | `colors.goldGlow` | rgba(201, 162, 39, 0.15) |
207
- | `colors.white` | #ffffff |
208
- | `colors.silver` | #a3a3a3 |
209
- | `colors.zinc` | #71717a |
210
- | `colors.dim` | #52525b |
211
- | `colors.success` | #22c55e |
212
- | `colors.successMuted` | #166534 |
213
- | `colors.error` | #dc2626 |
214
- | `colors.errorMuted` | #991b1b |
215
- | `colors.warning` | #d97706 |
216
- | `colors.warningMuted` | #92400e |
217
- | `colors.info` | #0ea5e9 |
218
- | `colors.infoMuted` | #0369a1 |
219
-
220
- ### Duration
221
-
222
- | Token | Value |
223
- |---|---|
224
- | `duration.instant` | 75ms |
225
- | `duration.fast` | 150ms |
226
- | `duration.normal` | 200ms |
227
- | `duration.slow` | 300ms |
228
- | `duration.slower` | 500ms |
229
-
230
- ### Easing
231
-
232
- | Token | Value |
233
- |---|---|
234
- | `easing.smooth` | cubic-bezier(0.16, 1, 0.3, 1) |
235
- | `easing.snap` | cubic-bezier(0.5, 0, 0.1, 1) |
236
-
237
- ### Radii
238
-
239
- | Token | Value |
240
- |---|---|
241
- | `radii.sm` | 0.125rem |
242
- | `radii.md` | 0.25rem |
243
- | `radii.lg` | 0.375rem |
244
- | `radii.xl` | 0.5rem |
245
- | `radii.2xl` | 0.75rem |
246
- | `radii.3xl` | 1rem |
247
- | `radii.full` | 9999px |
248
-
249
- ### Shadows
250
-
251
- | Token | Value |
252
- |---|---|
253
- | `shadows.sm` | 0 1px 2px 0 rgba(0, 0, 0, 0.4) |
254
- | `shadows.md` | 0 4px 6px -1px rgba(0, 0, 0, 0.4), 0 2px 4px -2px rgba(0, 0, 0, 0.3) |
255
- | `shadows.lg` | 0 10px 15px -3px rgba(0, 0, 0, 0.4), 0 4px 6px -4px rgba(0, 0, 0, 0.3) |
256
- | `shadows.xl` | 0 20px 25px -5px rgba(0, 0, 0, 0.4), 0 8px 10px -6px rgba(0, 0, 0, 0.3) |
257
- | `shadows.2xl` | 0 25px 50px -12px rgba(0, 0, 0, 0.5) |
258
- | `shadows.glow` | 0 0 20px rgba(201, 162, 39, 0.3) |
259
- | `shadows.glow-sm` | 0 0 10px rgba(201, 162, 39, 0.2) |
260
- | `shadows.glow-lg` | 0 0 40px rgba(201, 162, 39, 0.4) |
261
- | `shadows.inner` | inset 0 2px 4px 0 rgba(0, 0, 0, 0.3) |
262
-
263
- ### Spacing
264
-
265
- | Token | Value |
266
- |---|---|
267
- | `spacing.0` | 0 |
268
- | `spacing.1` | 0.25rem |
269
- | `spacing.2` | 0.5rem |
270
- | `spacing.3` | 0.75rem |
271
- | `spacing.4` | 1rem |
272
- | `spacing.5` | 1.25rem |
273
- | `spacing.6` | 1.5rem |
274
- | `spacing.7` | 1.75rem |
275
- | `spacing.8` | 2rem |
276
- | `spacing.9` | 2.25rem |
277
- | `spacing.10` | 2.5rem |
278
- | `spacing.11` | 2.75rem |
279
- | `spacing.12` | 3rem |
280
- | `spacing.14` | 3.5rem |
281
- | `spacing.16` | 4rem |
282
- | `spacing.20` | 5rem |
283
- | `spacing.24` | 6rem |
284
- | `spacing.28` | 7rem |
285
- | `spacing.32` | 8rem |
286
- | `spacing.px` | 1px |
287
- | `spacing.0.5` | 0.125rem |
288
- | `spacing.1.5` | 0.375rem |
289
- | `spacing.2.5` | 0.625rem |
290
- | `spacing.3.5` | 0.875rem |
291
-
292
- ### Typography
293
-
294
- | Token | Value |
295
- |---|---|
296
- | `typography.fontHeading` | [Marcellus, serif] |
297
- | `typography.fontBody` | [Raleway, system-ui, sans-serif] |
298
- | `typography.fontMono` | [JetBrains Mono, Fira Code, SF Mono, monospace] |
299
- | `typography.fontSize.xs` | [0.75rem, {"lineHeight":"1rem"}] |
300
- | `typography.fontSize.sm` | [0.875rem, {"lineHeight":"1.25rem"}] |
301
- | `typography.fontSize.base` | [1rem, {"lineHeight":"1.5rem"}] |
302
- | `typography.fontSize.lg` | [1.125rem, {"lineHeight":"1.75rem"}] |
303
- | `typography.fontSize.xl` | [1.25rem, {"lineHeight":"1.75rem"}] |
304
- | `typography.fontSize.2xl` | [1.5rem, {"lineHeight":"2rem"}] |
305
- | `typography.fontSize.3xl` | [1.875rem, {"lineHeight":"2.25rem"}] |
306
- | `typography.fontSize.4xl` | [2.25rem, {"lineHeight":"2.5rem"}] |
307
- | `typography.fontSize.5xl` | [3rem, {"lineHeight":"1"}] |
308
- | `typography.fontSize.6xl` | [3.75rem, {"lineHeight":"1"}] |
309
- | `typography.fontWeight.normal` | 400 |
310
- | `typography.fontWeight.medium` | 500 |
311
- | `typography.fontWeight.semibold` | 600 |
312
- | `typography.fontWeight.bold` | 700 |
313
- | `typography.lineHeight.none` | 1 |
314
- | `typography.lineHeight.tight` | 1.25 |
315
- | `typography.lineHeight.snug` | 1.375 |
316
- | `typography.lineHeight.normal` | 1.5 |
317
- | `typography.lineHeight.relaxed` | 1.625 |
318
- | `typography.lineHeight.loose` | 2 |
319
- | `typography.letterSpacing.tighter` | -0.05em |
320
- | `typography.letterSpacing.tight` | -0.025em |
321
- | `typography.letterSpacing.normal` | 0 |
322
- | `typography.letterSpacing.wide` | 0.025em |
323
- | `typography.letterSpacing.wider` | 0.05em |
324
- | `typography.letterSpacing.widest` | 0.1em |
325
-