@ankhorage/zora 2.9.1 → 2.9.3

package/src/metadata/themeRecipeMeta.test.ts

@@ -0,0 +1,70 @@
+import { describe, expect, test } from 'bun:test';
+
+import { ZORA_COMPONENT_META, ZORA_THEME_RECIPE_META, ZORA_THEME_TOKEN_FAMILIES } from './index';
+
+const tokenFamilies = new Set<string>(ZORA_THEME_TOKEN_FAMILIES);
+const expectedKinds = new Map<string, 'component' | 'pattern'>([
+  ['Button', 'component'],
+  ['Card', 'component'],
+  ['Text', 'component'],
+  ['Panel', 'pattern'],
+]);
+
+describe('ZORA_THEME_RECIPE_META', () => {
+  test('exports representative component and pattern recipes', () => {
+    expect(Object.keys(ZORA_THEME_RECIPE_META)).toEqual(['Button', 'Card', 'Text', 'Panel']);
+    expect(ZORA_THEME_RECIPE_META.Button?.kind).toBe('component');
+    expect(ZORA_THEME_RECIPE_META.Panel?.kind).toBe('pattern');
+  });
+
+  test('keeps registry names unique and aligned with component metadata', () => {
+    const names = Object.values(ZORA_THEME_RECIPE_META).map((meta) => meta.name);
+    expect(new Set(names).size).toBe(names.length);
+
+    for (const [key, meta] of Object.entries(ZORA_THEME_RECIPE_META)) {
+      expect(meta.name).toBe(key);
+      expect(meta.kind).toBe(expectedKinds.get(key));
+    }
+
+    expect(ZORA_COMPONENT_META.Button.category).toBe('component');
+    expect(ZORA_COMPONENT_META.Card.category).toBe('component');
+    expect(ZORA_COMPONENT_META.Text.category).toBe('component');
+    expect(ZORA_COMPONENT_META.Panel.category).toBe('pattern');
+  });
+
+  test('references only canonical token families and valid choice defaults', () => {
+    for (const meta of Object.values(ZORA_THEME_RECIPE_META)) {
+      for (const field of Object.values(meta.fields)) {
+        if (field.type === 'token') {
+          expect(tokenFamilies.has(field.tokenFamily), `${meta.name}.${field.label}`).toBe(true);
+        }
+        if (field.type === 'choice') {
+          expect(field.options).toContain(field.default);
+        }
+      }
+    }
+  });
+
+  test('describes component-specific semantic scales instead of universal geometry', () => {
+    expect(ZORA_THEME_RECIPE_META.Button?.fields.size).toMatchObject({
+      type: 'choice',
+      options: ['s', 'm', 'l'],
+      default: 'm',
+    });
+    expect(ZORA_THEME_RECIPE_META.Card?.fields.padding).toMatchObject({
+      type: 'token',
+      tokenFamily: 'spacing',
+      default: 'l',
+    });
+  });
+
+  test('stays distinct from component metadata', () => {
+    expect(ZORA_THEME_RECIPE_META).not.toBe(ZORA_COMPONENT_META);
+    expect(ZORA_COMPONENT_META.Button.props.size?.type).toBe('enum');
+    expect(ZORA_THEME_RECIPE_META.Button?.fields.size?.type).toBe('choice');
+  });
+
+  test('is serializable for downstream authoring consumers', () => {
+    expect(() => JSON.stringify(ZORA_THEME_RECIPE_META)).not.toThrow();
+  });
+});

package/src/metadata/themeRecipeMeta.ts

@@ -0,0 +1,12 @@
+import { buttonThemeRecipeMeta } from '../components/button/themeRecipeMeta';
+import { cardThemeRecipeMeta } from '../components/card/themeRecipeMeta';
+import { textThemeRecipeMeta } from '../components/text/themeRecipeMeta';
+import { panelThemeRecipeMeta } from '../patterns/panel/themeRecipeMeta';
+import type { ZoraThemeRecipeMetaRegistry } from './themeRecipeTypes';
+
+export const ZORA_THEME_RECIPE_META: ZoraThemeRecipeMetaRegistry = {
+  Button: buttonThemeRecipeMeta,
+  Card: cardThemeRecipeMeta,
+  Text: textThemeRecipeMeta,
+  Panel: panelThemeRecipeMeta,
+};

package/src/metadata/themeRecipeTypes.ts

@@ -0,0 +1,47 @@
+export const ZORA_THEME_TOKEN_FAMILIES = [
+  'colors',
+  'spacing',
+  'radii',
+  'typography',
+  'shadows',
+] as const;
+
+export type ZoraThemeTokenFamily = (typeof ZORA_THEME_TOKEN_FAMILIES)[number];
+
+export type ZoraThemeRecipeKind = 'component' | 'pattern';
+
+interface ZoraThemeRecipeFieldBase {
+  readonly label: string;
+  readonly description?: string;
+}
+
+export interface ZoraThemeRecipeTokenFieldMeta extends ZoraThemeRecipeFieldBase {
+  readonly type: 'token';
+  readonly tokenFamily: ZoraThemeTokenFamily;
+  readonly default: string;
+}
+
+export interface ZoraThemeRecipeChoiceFieldMeta extends ZoraThemeRecipeFieldBase {
+  readonly type: 'choice';
+  readonly options: readonly string[];
+  readonly default: string;
+}
+
+export interface ZoraThemeRecipeBooleanFieldMeta extends ZoraThemeRecipeFieldBase {
+  readonly type: 'boolean';
+  readonly default: boolean;
+}
+
+export type ZoraThemeRecipeFieldMeta =
+  | ZoraThemeRecipeTokenFieldMeta
+  | ZoraThemeRecipeChoiceFieldMeta
+  | ZoraThemeRecipeBooleanFieldMeta;
+
+export interface ZoraThemeRecipeMeta {
+  readonly name: string;
+  readonly kind: ZoraThemeRecipeKind;
+  readonly description?: string;
+  readonly fields: Readonly<Record<string, ZoraThemeRecipeFieldMeta>>;
+}
+
+export type ZoraThemeRecipeMetaRegistry = Readonly<Record<string, ZoraThemeRecipeMeta>>;

package/src/metadata/types.ts

@@ -25,6 +25,13 @@ export type ZoraComponentPropValue =
   | readonly ZoraComponentPropValue[]
   | { readonly [key: string]: ZoraComponentPropValue };
 
+export type ZoraComponentPropAuthoring =
+  | { readonly authority: 'instance' }
+  | {
+      readonly authority: 'theme';
+      readonly scope: 'global' | 'component' | 'pattern';
+    };
+
 export interface ZoraComponentPropArrayItemSchema {
   key: string;
   schema: ZoraComponentPropSchema;
@@ -37,6 +44,7 @@ export interface ZoraComponentPropSchema {
   enum?: readonly (string | number)[];
   default?: ZoraComponentPropValue;
   itemSchema?: readonly ZoraComponentPropArrayItemSchema[];
+  authoring?: ZoraComponentPropAuthoring;
 }
 
 export interface ZoraComponentBlueprint {

package/src/patterns/panel/meta.ts

@@ -18,16 +18,19 @@ export const panelMeta = {
       type: 'string',
       category: 'Content',
       label: 'Title',
+      authoring: { authority: 'instance' },
     },
     description: {
       type: 'string',
       category: 'Content',
       label: 'Description',
+      authoring: { authority: 'instance' },
     },
     eyebrow: {
       type: 'string',
       category: 'Content',
       label: 'Eyebrow',
+      authoring: { authority: 'instance' },
     },
     tone: {
       type: 'enum',
@@ -35,12 +38,14 @@ export const panelMeta = {
       label: 'Tone',
       enum: ['default', 'subtle', 'outline'],
       default: 'default',
+      authoring: { authority: 'theme', scope: 'pattern' },
     },
     compact: {
       type: 'boolean',
       category: 'Layout',
       label: 'Compact',
       default: false,
+      authoring: { authority: 'theme', scope: 'pattern' },
     },
   },
 } as const satisfies ZoraComponentMeta;

package/src/patterns/panel/themeRecipeMeta.ts

@@ -0,0 +1,32 @@
+import type { ZoraThemeRecipeMeta } from '../../metadata/themeRecipeTypes';
+
+export const panelThemeRecipeMeta = {
+  name: 'Panel',
+  kind: 'pattern',
+  description: 'Maps global rhythm and surface tokens into Panel presentation.',
+  fields: {
+    tone: {
+      type: 'choice',
+      label: 'Tone',
+      options: ['default', 'subtle', 'outline'],
+      default: 'default',
+    },
+    padding: {
+      type: 'token',
+      tokenFamily: 'spacing',
+      label: 'Padding',
+      default: 'l',
+    },
+    radius: {
+      type: 'token',
+      tokenFamily: 'radii',
+      label: 'Corner radius',
+      default: 'l',
+    },
+    compact: {
+      type: 'boolean',
+      label: 'Compact',
+      default: false,
+    },
+  },
+} as const satisfies ZoraThemeRecipeMeta;