@ankhorage/zora 2.9.1 → 2.9.2

package/src/components/card/meta.ts

@@ -18,16 +18,19 @@ export const cardMeta = {
       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 cardMeta = {
       label: 'Tone',
       enum: ['default', 'subtle', 'outline'],
       default: 'default',
+      authoring: { authority: 'theme', scope: 'component' },
     },
     compact: {
       type: 'boolean',
       category: 'Layout',
       label: 'Compact',
       default: false,
+      authoring: { authority: 'theme', scope: 'component' },
     },
   },
 } as const satisfies ZoraComponentMeta;

package/src/components/card/themeRecipeMeta.ts

@@ -0,0 +1,32 @@
+import type { ZoraThemeRecipeMeta } from '../../metadata/themeRecipeTypes';
+
+export const cardThemeRecipeMeta = {
+  name: 'Card',
+  kind: 'component',
+  description: 'Maps global rhythm and surface tokens into Card 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;

package/src/components/text/meta.ts

@@ -23,11 +23,13 @@ export const textMeta = {
       category: 'Content',
       label: 'Text',
       default: 'Text',
+      authoring: { authority: 'instance' },
     },
     i18nKey: {
       type: 'string',
       category: 'Content',
       label: 'i18n key',
+      authoring: { authority: 'instance' },
     },
     variant: {
       type: 'enum',
@@ -35,12 +37,14 @@ export const textMeta = {
       label: 'Variant',
       enum: ['body', 'lead', 'bodySmall', 'caption', 'label', 'eyebrow', 'code'],
       default: 'body',
+      authoring: { authority: 'theme', scope: 'component' },
     },
     color: {
       type: 'enum',
       category: 'Style',
       label: 'Color',
       enum: ZORA_COLORS,
+      authoring: { authority: 'theme', scope: 'component' },
     },
     emphasis: {
       type: 'enum',
@@ -48,29 +52,34 @@ export const textMeta = {
       label: 'Emphasis',
       enum: ZORA_EMPHASES,
       default: 'default',
+      authoring: { authority: 'theme', scope: 'component' },
     },
     align: {
       type: 'enum',
       category: 'Layout',
       label: 'Align',
       enum: ['auto', 'left', 'right', 'center', 'justify'],
+      authoring: { authority: 'theme', scope: 'component' },
     },
     weight: {
       type: 'enum',
       category: 'Typography',
       label: 'Weight',
       enum: ['regular', 'medium', 'semiBold', 'bold'],
+      authoring: { authority: 'theme', scope: 'component' },
     },
     italic: {
       type: 'boolean',
       category: 'Typography',
       label: 'Italic',
       default: false,
+      authoring: { authority: 'theme', scope: 'component' },
     },
     numberOfLines: {
       type: 'number',
       category: 'Layout',
       label: 'Line clamp',
+      authoring: { authority: 'instance' },
     },
   },
 } as const satisfies ZoraComponentMeta;

package/src/components/text/themeRecipeMeta.ts

@@ -0,0 +1,33 @@
+import type { ZoraThemeRecipeMeta } from '../../metadata/themeRecipeTypes';
+
+export const textThemeRecipeMeta = {
+  name: 'Text',
+  kind: 'component',
+  description: 'Maps shared typography and color tokens into Text presentation.',
+  fields: {
+    variant: {
+      type: 'token',
+      tokenFamily: 'typography',
+      label: 'Typography variant',
+      default: 'body',
+    },
+    color: {
+      type: 'token',
+      tokenFamily: 'colors',
+      label: 'Color',
+      default: 'text',
+    },
+    emphasis: {
+      type: 'choice',
+      label: 'Emphasis',
+      options: ['default', 'muted', 'subtle', 'inverse'],
+      default: 'default',
+    },
+    weight: {
+      type: 'choice',
+      label: 'Weight',
+      options: ['regular', 'medium', 'semiBold', 'bold'],
+      default: 'regular',
+    },
+  },
+} as const satisfies ZoraThemeRecipeMeta;

package/src/index.ts

@@ -214,12 +214,26 @@ export type {
   ZoraComponentMeta,
   ZoraComponentMetaRegistry,
   ZoraComponentPropArrayItemSchema,
+  ZoraComponentPropAuthoring,
   ZoraComponentPropSchema,
   ZoraComponentPropType,
   ZoraComponentPropValue,
   ZoraComponentSlotMeta,
+  ZoraThemeRecipeBooleanFieldMeta,
+  ZoraThemeRecipeChoiceFieldMeta,
+  ZoraThemeRecipeFieldMeta,
+  ZoraThemeRecipeKind,
+  ZoraThemeRecipeMeta,
+  ZoraThemeRecipeMetaRegistry,
+  ZoraThemeRecipeTokenFieldMeta,
+  ZoraThemeTokenFamily,
+} from './metadata';
+export {
+  ZORA_BINDABLE_COMPONENT_META,
+  ZORA_COMPONENT_META,
+  ZORA_THEME_RECIPE_META,
+  ZORA_THEME_TOKEN_FAMILIES,
 } from './metadata';
-export { ZORA_BINDABLE_COMPONENT_META, ZORA_COMPONENT_META } from './metadata';
 export type {
   AuthFormBaseProps,
   AuthIdentifierKind,

package/src/metadata/authoringMeta.test.ts

@@ -0,0 +1,59 @@
+import { describe, expect, test } from 'bun:test';
+
+import { ZORA_COMPONENT_META, type ZoraComponentPropAuthoring } from './index';
+
+describe('ZORA component prop authoring authority', () => {
+  test('supports the canonical instance and theme scope combinations', () => {
+    const values: readonly ZoraComponentPropAuthoring[] = [
+      { authority: 'instance' },
+      { authority: 'theme', scope: 'global' },
+      { authority: 'theme', scope: 'component' },
+      { authority: 'theme', scope: 'pattern' },
+    ];
+
+    expect(values).toEqual([
+      { authority: 'instance' },
+      { authority: 'theme', scope: 'global' },
+      { authority: 'theme', scope: 'component' },
+      { authority: 'theme', scope: 'pattern' },
+    ]);
+  });
+
+  test('classifies representative instance content without exposing arbitrary styling', () => {
+    expect(ZORA_COMPONENT_META.Button.props.children?.authoring).toEqual({
+      authority: 'instance',
+    });
+    expect(ZORA_COMPONENT_META.Card.props.title?.authoring).toEqual({ authority: 'instance' });
+    expect(ZORA_COMPONENT_META.Text.props.text?.authoring).toEqual({ authority: 'instance' });
+    expect(ZORA_COMPONENT_META.Panel.props.description?.authoring).toEqual({
+      authority: 'instance',
+    });
+  });
+
+  test('classifies component and pattern styling as theme authority', () => {
+    expect(ZORA_COMPONENT_META.Button.props.size?.authoring).toEqual({
+      authority: 'theme',
+      scope: 'component',
+    });
+    expect(ZORA_COMPONENT_META.Card.props.tone?.authoring).toEqual({
+      authority: 'theme',
+      scope: 'component',
+    });
+    expect(ZORA_COMPONENT_META.Text.props.variant?.authoring).toEqual({
+      authority: 'theme',
+      scope: 'component',
+    });
+    expect(ZORA_COMPONENT_META.Panel.props.compact?.authoring).toEqual({
+      authority: 'theme',
+      scope: 'pattern',
+    });
+  });
+
+  test('treats absent authoring metadata as not authorable', () => {
+    expect(ZORA_COMPONENT_META.Progress.props.value?.authoring).toBeUndefined();
+  });
+
+  test('does not introduce a system authority', () => {
+    expect(JSON.stringify(ZORA_COMPONENT_META)).not.toContain('"authority":"system"');
+  });
+});

package/src/metadata/index.ts

@@ -1,6 +1,18 @@
 export type { ZoraBindableComponentType } from './bindableComponentMeta';
 export { ZORA_BINDABLE_COMPONENT_META } from './bindableComponentMeta';
 export { ZORA_COMPONENT_META } from './componentMeta';
+export { ZORA_THEME_RECIPE_META } from './themeRecipeMeta';
+export type {
+  ZoraThemeRecipeBooleanFieldMeta,
+  ZoraThemeRecipeChoiceFieldMeta,
+  ZoraThemeRecipeFieldMeta,
+  ZoraThemeRecipeKind,
+  ZoraThemeRecipeMeta,
+  ZoraThemeRecipeMetaRegistry,
+  ZoraThemeRecipeTokenFieldMeta,
+  ZoraThemeTokenFamily,
+} from './themeRecipeTypes';
+export { ZORA_THEME_TOKEN_FAMILIES } from './themeRecipeTypes';
 export type {
   ZoraComponentBlueprint,
   ZoraComponentCategory,
@@ -12,6 +24,7 @@ export type {
   ZoraComponentMeta,
   ZoraComponentMetaRegistry,
   ZoraComponentPropArrayItemSchema,
+  ZoraComponentPropAuthoring,
   ZoraComponentPropSchema,
   ZoraComponentPropType,
   ZoraComponentPropValue,

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;