@lukeashford/aurelius 2.8.0 → 2.10.0

package/dist/styles/theme.css

@@ -5,6 +5,9 @@
 
 @theme {
   /* ===== COLORS ===== */
+  /* Clears all default colors */
+  --color-*: initial;
+
   /* Black spectrum */
   --color-void: #000000;
   --color-obsidian: #0a0a0a;
@@ -249,7 +252,7 @@
 /* ===== BASE STYLES (applied via @layer base) ===== */
 @layer base {
   html {
-    font-family: var(--font-body);
+    @apply font-body;
     background-color: var(--color-obsidian);
     color: var(--color-white);
     -webkit-font-smoothing: antialiased;
@@ -312,7 +315,7 @@
   h4,
   h5,
   h6 {
-    font-family: var(--font-heading);
+    @apply font-heading;
     font-weight: 600;
     letter-spacing: -0.025em;
     color: var(--color-white);
@@ -434,6 +437,21 @@
   box-shadow: var(--shadow-glow-lg);
 }
 
+/* Flex utility for collapsing to zero size (0 0 0%) - use with flex-1 for expand/collapse animations */
+@utility flex-zero {
+  flex: 0 0 0%;
+}
+
+@utility font-heading {
+  font-family: var(--font-heading);
+  font-size-adjust: 0.5;
+}
+
+@utility font-body {
+  font-family: var(--font-body);
+  font-size-adjust: 0.521;
+}
+
 @utility scroll-smooth {
   scroll-behavior: smooth;
   -webkit-overflow-scrolling: touch;

package/llms.md

@@ -1,3 +1,8 @@
+<!-- 
+  DO NOT EDIT THIS FILE DIRECTLY.
+  This file is auto-generated by scripts/generate-manifest.js.
+-->
+
 # Aurelius Design System — AI Manifest
 
 ## Setup (Tailwind v4)
@@ -5,11 +10,30 @@
 ### 1. Install
 
 ```bash
+# For Vite projects (Recommended)
 npm install @lukeashford/aurelius
-npm install -D tailwindcss postcss @tailwindcss/postcss eslint @typescript-eslint/parser eslint-plugin-better-tailwindcss @poupe/eslint-plugin-tailwindcss @eslint/css tailwind-csstree
+npm install -D tailwindcss @tailwindcss/vite eslint @typescript-eslint/parser eslint-plugin-better-tailwindcss @poupe/eslint-plugin-tailwindcss @eslint/css tailwind-csstree
+
+# For other projects (font bundling might not work)
+npm install -D tailwindcss @tailwindcss/postcss postcss ...
+```
+
+### 2. Configure (Vite)
+
+If using Vite, add the Tailwind CSS plugin to your `vite.config.ts`:
+
+```typescript
+import { defineConfig } from 'vite'
+import tailwindcss from '@tailwindcss/vite'
+
+export default defineConfig({
+  plugins: [
+    tailwindcss(),
+  ],
+})
 ```
 
-### 2. Import the design system
+### 3. Import the design system
 
 Create or update your `index.css`:
 
@@ -28,7 +52,7 @@ Then import it in your entry file:
 import './index.css'
 ```
 
-### 3. Configure ESLint
+### 4. Configure ESLint
 
 Aurelius ships with a default ESLint config you can re-export in one line. It enforces design system
 constraints — if ESLint complains, you're leaving the rails.
@@ -38,7 +62,7 @@ constraints — if ESLint complains, you're leaving the rails.
 export { default } from '@lukeashford/aurelius/eslint';
 ```
 
-### 4. Add lint script and run it
+### 5. Add lint script and run it
 
 Add a lint script and wire it into your workflow:
 
@@ -76,13 +100,13 @@ Import from `@lukeashford/aurelius`:
 |-----------|-------|
 | Accordion | defaultValue, value |
 | Alert | variant (info, success, warning, error), title |
+| AttachmentPreview | attachments, removable, maxVisible |
 | Avatar | src, alt, name, size (xs, sm, md, lg, xl, 2xl), status (online, offline, busy) |
 | Badge | variant (default, gold, success, error, warning, info) |
 | BrandIcon | size (sm, md, lg), variant (solid, outline) |
 | Breadcrumb | separator |
 | Button | variant (primary, important, elevated, outlined, featured, ghost, danger), size (sm, md, lg, xl), loading |
 | Card | variant (default, elevated, outlined, ghost, featured), interactive, selected, noPadding |
-| ChatHistory | messages |
 | Checkbox | label |
 | Col | span (auto, full), offset, order (first, last, none) |
 | ColorSwatch | color, label |
@@ -90,15 +114,16 @@ Import from `@lukeashford/aurelius`:
 | Dialog | description, confirmText, cancelText, isLoading |
 | Divider | orientation (horizontal, vertical), variant (solid, dashed, dotted), label |
 | Drawer | isOpen, position (left, right, top, bottom), title, children, className |
+| FileChip | name, size, type, status (pending, uploading, complete, error), previewUrl, removable, error |
 | HelperText | error |
 | ImageCard | src, alt, title, subtitle, aspectRatio (${number}/${number}), overlay, mediaClassName, contentClassName |
 | Input | error, leadingIcon, trailingIcon |
 | InputGroup | children |
 | Label | required |
 | List | ordered |
-| MarkdownContent | content, sanitizeConfig |
+| MarkdownContent | content, sanitizeConfig, isStreaming, cursorClassName |
 | Menu | children, open |
-| Message | variant (user, assistant), content, isStreaming |
+| Message | variant (user, assistant), content, isStreaming, branchInfo, actions, hideActions |
 | Modal | isOpen, title, children, className |
 | Navbar | fixed, bordered |
 | Pagination | page, totalPages, siblingCount, showEdges |
@@ -130,8 +155,30 @@ Import from `@lukeashford/aurelius`:
 - **value**: Controlled expanded item(s)
 - **onValueChange**: Callback when expanded items change
 
-**ChatHistory**
-- **messages**: Array of chat messages. Each item requires: content (string), variant ('user' | 'assistant'). Optional: id, isStreaming.
+**AttachmentPreview**
+- **attachments**: * Array of attachments to display
+- **onRemove**: * Called when an attachment should be removed
+- **removable**: * Whether attachments are removable
+- **maxVisible**: * Maximum number of attachments to show before collapsing Set to 0 or undefined to show all
+
+**FileChip**
+- **name**: * File name to display
+- **size**: * File size in bytes (optional, will be formatted)
+- **type**: * MIME type for icon selection
+- **status**: * Upload/processing status
+- **previewUrl**: * Preview image URL (for images)
+- **onRemove**: * Called when the remove button is clicked
+- **removable**: * Whether the chip is removable
+- **error**: * Error message to display (when status is 'error')
+
+**MarkdownContent**
+- **isStreaming**: * When true, injects a streaming cursor at the end of the content
+- **cursorClassName**: * Additional classes for the streaming cursor
+
+**Message**
+- **branchInfo**: * Branch navigation info (shows branch indicator if provided and total > 1)
+- **actions**: * Actions configuration (shows action bar if provided)
+- **hideActions**: * Whether to hide actions (e.g., during streaming)
 
 **Popover**
 - **trigger**: The trigger element
@@ -193,7 +240,7 @@ Standard Tailwind classes for size (`text-sm`, `text-lg`, etc.), weight (`font-m
 **Columns (Tailwind built-in):** `col-span-{1-12}`, `col-span-full`, `col-auto`, `sm:col-span-*`, `md:col-span-*`, `lg:col-span-*`, `xl:col-span-*`
 
 ### Custom Utilities
-text-gradient-gold, glow, glow-sm, glow-md, glow-lg, scroll-smooth, scrollbar-hide, backdrop-glass, focus-ring, line-clamp-2, line-clamp-3, center-absolute, aspect-wide, container, container-sm, container-md, container-lg, container-xl, container-fluid, row
+text-gradient-gold, glow, glow-sm, glow-md, glow-lg, flex-zero, font-heading, font-body, scroll-smooth, scrollbar-hide, backdrop-glass, focus-ring, line-clamp-2, line-clamp-3, center-absolute, aspect-wide, container, container-sm, container-md, container-lg, container-xl, container-fluid, row
 
 ### Opacity modifiers
 Append `/10`, `/20`, `/30`, etc. to colors: `bg-gold/20`, `border-ash/50`

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lukeashford/aurelius",
-  "version": "2.8.0",
+  "version": "2.10.0",
   "description": "Design system for Aurelius applications — A cohesive visual language for creative technologists",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -28,10 +28,12 @@
     "node": ">=22.14.0"
   },
   "scripts": {
-    "build": "npm run typecheck && npm run lint && tsup && node scripts/generate-manifest.js",
+    "build": "npm run typecheck && npm run lint:core && tsup && node scripts/generate-manifest.js",
     "dev": "tsup --watch",
     "typecheck": "tsc --noEmit",
-    "lint": "eslint src --max-warnings 0",
+    "lint": "npm run lint:core && npm run lint:demo",
+    "lint:core": "eslint src --max-warnings 0",
+    "lint:demo": "npm --prefix demo run lint",
     "prepublishOnly": "npm run build",
     "dev:demo": "npm --prefix demo run dev",
     "dev:all": "concurrently -k \"npm run dev\" \"npm run dev:demo\"",

package/scripts/eslint.mjs

@@ -82,10 +82,19 @@ export function createAureliusESLintConfig(options = {}) {
         ],
 
         // Block arbitrary value utilities like bg-[...], text-[...], shadow-[...]
+        // Also block intermediate rounded corners (sm/md/lg/xl/2xl/3xl) - Aurelius prefers square corners.
+        // Allows: rounded-none (explicit no rounding), rounded-full (circles/pills for avatars, buttons, etc.)
         'better-tailwindcss/no-restricted-classes': [
           'error',
           {
-            restrict: ['\\[.*\\]'],
+            restrict: [
+              '\\[.*\\]',
+              // Block rounded-sm, rounded-md, rounded-lg, rounded-xl, rounded-2xl, rounded-3xl (base and directional variants)
+              '^rounded-(sm|md|lg|xl|2xl|3xl)$',
+              '^rounded$',
+              '^rounded-(t|r|b|l|tl|tr|br|bl)$',
+              '^rounded-(t|r|b|l|tl|tr|br|bl)-(sm|md|lg|xl|2xl|3xl)$',
+            ],
             // Also check variables that store class mappings (e.g., variantClasses objects)
             variables: [
               ['^.*[Cc]lass(?:es|Name)?$', [{match: 'strings'}]],