lucent-ui 0.16.0 → 0.17.0

package/dist-server/src/manifest/examples/button.manifest.js

@@ -8,24 +8,38 @@ export const ButtonManifest = {
     designIntent: 'Buttons communicate available actions. Variant conveys hierarchy: use "primary" for the ' +
         'single most important action in a view, "secondary" for supporting actions, "ghost" for ' +
         'low-emphasis actions in dense UIs, "outline" for bordered buttons with no fill, and "danger" exclusively for destructive or irreversible ' +
-        'operations. Size should match surrounding content density — prefer "md" as the default, ' +
-        '"sm" for toolbars or tables, and "xs" for compact UIs like customizer panels.',
+        'operations. Use "danger-ghost" for low-emphasis destructive actions (red text, no fill) and ' +
+        '"danger-outline" for bordered destructive buttons. Size should match surrounding content density — prefer "md" as the default, ' +
+        '"sm" for toolbars or tables, "xs" for compact UIs like customizer panels, and "2xs" for ' +
+        'ultra-dense inline controls (~22px height) such as table-inline actions or toolbar icon triggers.',
     props: [
         {
             name: 'variant',
             type: 'enum',
             required: false,
             default: 'primary',
-            description: 'Visual style conveying action hierarchy.',
-            enumValues: ['primary', 'secondary', 'outline', 'ghost', 'danger'],
+            description: 'Visual style conveying action hierarchy. ' +
+                '"primary" — filled accent for the single most important action. ' +
+                '"secondary" — subtle accent-tinted fill for supporting actions. ' +
+                '"outline" — bordered with no fill, for neutral secondary actions. ' +
+                '"ghost" — transparent with no border, for low-emphasis or inline actions. ' +
+                '"danger" — filled red for irreversible destructive actions (e.g. "Delete account"). ' +
+                '"danger-outline" — red border + red text for destructive actions that need visual weight without a filled background. ' +
+                '"danger-ghost" — red text only, for low-emphasis destructive actions (e.g. "Remove" in a list row).',
+            enumValues: ['primary', 'secondary', 'outline', 'ghost', 'danger', 'danger-outline', 'danger-ghost'],
         },
         {
             name: 'size',
             type: 'enum',
             required: false,
             default: 'md',
-            description: 'Controls height and padding.',
-            enumValues: ['xs', 'sm', 'md', 'lg'],
+            description: 'Controls height and padding. ' +
+                '"lg" (48px) — hero sections, onboarding flows. ' +
+                '"md" (42px) — default for most forms and dialogs. ' +
+                '"sm" (34px) — toolbars, table headers, card actions. ' +
+                '"xs" (26px) — compact UIs like customizer panels, inline controls. ' +
+                '"2xs" (22px) — ultra-dense inline icon triggers, table-row actions, dashboard toolbar buttons.',
+            enumValues: ['2xs', 'xs', 'sm', 'md', 'lg'],
         },
         {
             name: 'children',
@@ -135,6 +149,18 @@ export const ButtonManifest = {
             title: 'Dropdown trigger',
             code: `<Button variant="outline" chevron>Options</Button>`,
         },
+        {
+            title: 'Bordered destructive action',
+            code: `<Button variant="danger-outline" onClick={handleRevoke}>Revoke access</Button>`,
+        },
+        {
+            title: 'Low-emphasis destructive action',
+            code: `<Button variant="danger-ghost" onClick={handleRemove}>Remove</Button>`,
+        },
+        {
+            title: 'Dense inline action',
+            code: `<Button variant="ghost" size="2xs" leftIcon={<RefreshIcon />}>Retry</Button>`,
+        },
     ],
     compositionGraph: [],
     accessibility: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lucent-ui",
-  "version": "0.16.0",
+  "version": "0.17.0",
   "description": "An AI-first React component library with machine-readable manifests.",
   "type": "module",
   "main": "./dist/index.cjs",
@@ -25,18 +25,6 @@
     "dist-server",
     "dist-cli"
   ],
-  "scripts": {
-    "dev": "vite --config vite.dev.config.ts",
-    "build": "vite build",
-    "build:server": "tsc -p server/tsconfig.json",
-    "build:cli": "tsc -p cli/tsconfig.json && cp cli/template.manifest.json dist-cli/cli/template.manifest.json",
-    "test": "vitest run",
-    "test:watch": "vitest",
-    "prepublishOnly": "tsc --noEmit && pnpm build && pnpm build:server && pnpm build:cli",
-    "changeset": "changeset",
-    "version-packages": "changeset version",
-    "release": "pnpm prepublishOnly && changeset publish"
-  },
   "keywords": [
     "react",
     "component-library",
@@ -47,11 +35,10 @@
   "homepage": "https://lucentui.dev",
   "repository": {
     "type": "git",
-    "url": "https://github.com/rozinashopify/lucent-ui"
+    "url": "https://github.com/rozina-hudson/lucent-ui"
   },
   "author": "Rozina Szogyenyi",
   "license": "MIT",
-  "packageManager": "pnpm@10.30.3",
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0"
@@ -73,5 +60,16 @@
   "dependencies": {
     "@modelcontextprotocol/sdk": "^1.27.1",
     "zod": "^4.3.6"
+  },
+  "scripts": {
+    "dev": "vite --config vite.dev.config.ts",
+    "build": "vite build",
+    "build:server": "tsc -p server/tsconfig.json",
+    "build:cli": "tsc -p cli/tsconfig.json && cp cli/template.manifest.json dist-cli/cli/template.manifest.json",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "changeset": "changeset",
+    "version-packages": "changeset version",
+    "release": "pnpm prepublishOnly && changeset publish"
   }
-}
+}

package/dist-server/src/manifest/validate.test.js

@@ -1,28 +0,0 @@
-import { describe, test, expect } from 'vitest';
-import { validateManifest } from './validate.js';
-// Auto-discover all component manifests
-const manifestModules = import.meta.glob('../components/**/*.manifest.ts', { eager: true });
-const manifests = Object.entries(manifestModules).map(([path, mod]) => {
-    const m = mod;
-    const manifest = m['COMPONENT_MANIFEST'];
-    return { path, manifest };
-});
-describe('Component manifests', () => {
-    test('at least one manifest was discovered', () => {
-        expect(manifests.length).toBeGreaterThan(0);
-    });
-    for (const { path, manifest } of manifests) {
-        const label = path.replace('../components/', '').replace('.manifest.ts', '');
-        test(`${label} — exports COMPONENT_MANIFEST`, () => {
-            expect(manifest).toBeDefined();
-        });
-        test(`${label} — passes schema validation`, () => {
-            const result = validateManifest(manifest);
-            if (!result.valid) {
-                const messages = result.errors.map(e => `  ${e.field}: ${e.message}`).join('\n');
-                throw new Error(`Invalid manifest:\n${messages}`);
-            }
-            expect(result.valid).toBe(true);
-        });
-    }
-});