@ankhorage/zora 18.0.0 → 19.0.0

package/src/patterns/panel/meta.ts

@@ -1,51 +0,0 @@
-import type { ZoraComponentMeta } from '../../metadata';
-import { CONTAINER_ALLOWED_CHILDREN } from '../../metadata/allowedChildren';
-
-const themeAuthoring = {
-  authority: 'theme',
-  scope: 'pattern',
-  allowInstanceOverride: true,
-} as const;
-
-export const panelMeta = {
-  name: 'Panel',
-  category: 'pattern',
-  directManifestNode: true,
-  allowedChildren: [...CONTAINER_ALLOWED_CHILDREN],
-  blueprint: { label: 'Panel', defaultProps: { title: 'Panel' } },
-  props: {
-    title: {
-      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',
-      category: 'Style',
-      label: 'Tone',
-      enum: ['default', 'subtle', 'outline'],
-      authoring: themeAuthoring,
-    },
-    compact: { type: 'boolean', category: 'Layout', label: 'Compact', authoring: themeAuthoring },
-    padding: { type: 'spacing', category: 'Layout', label: 'Padding', authoring: themeAuthoring },
-    radius: {
-      type: 'radius',
-      category: 'Style',
-      label: 'Corner radius',
-      authoring: themeAuthoring,
-    },
-  },
-} as const satisfies ZoraComponentMeta;

package/src/patterns/panel/themeRecipeMeta.ts

@@ -1,32 +0,0 @@
-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',
-      description: 'When unset, Panel keeps Card compact-aware spacing.',
-    },
-    radius: {
-      type: 'token',
-      tokenFamily: 'radii',
-      label: 'Corner radius',
-      default: 'l',
-    },
-    compact: {
-      type: 'boolean',
-      label: 'Compact',
-      default: false,
-    },
-  },
-} as const satisfies ZoraThemeRecipeMeta;

package/src/patterns/panel/types.ts

@@ -1,17 +0,0 @@
-import type React from 'react';
-
-import type { ZoraCardTone } from '../../internal/recipes';
-import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
-
-export interface PanelProps extends ZoraBaseProps {
-  title?: React.ReactNode;
-  description?: React.ReactNode;
-  eyebrow?: React.ReactNode;
-  actions?: React.ReactNode;
-  footer?: React.ReactNode;
-  children?: React.ReactNode;
-  tone?: ZoraCardTone;
-  compact?: boolean;
-  padding?: string;
-  radius?: string;
-}

package/src/patterns/scanner/index.ts

@@ -1,10 +0,0 @@
-export { BarcodeScannerView } from './BarcodeScannerView';
-export { CameraPermissionView } from './CameraPermissionView';
-export { ScanOverlay } from './ScanOverlay';
-export type {
-  BarcodeScannerViewProps,
-  BarcodeScanResult,
-  CameraPermissionStatus,
-  CameraPermissionViewProps,
-  ScanOverlayProps,
-} from './types';

package/src/patterns/section-header/index.ts

@@ -1,2 +0,0 @@
-export { SectionHeader } from './SectionHeader';
-export type { SectionHeaderProps } from './types';

package/src/patterns/section-header/types.ts

@@ -1,10 +0,0 @@
-import type React from 'react';
-
-import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
-
-export interface SectionHeaderProps extends ZoraBaseProps {
-  title: React.ReactNode;
-  description?: React.ReactNode;
-  eyebrow?: React.ReactNode;
-  actions?: React.ReactNode;
-}

package/src/patterns/selection/index.ts

@@ -1,10 +0,0 @@
-export { SelectableItem } from './SelectableItem';
-export { SelectionProvider, useSelection } from './SelectionProvider';
-export type {
-  SelectableItemProps,
-  SelectableItemState,
-  SelectionMode,
-  SelectionProviderProps,
-  SelectionTrigger,
-  UseSelectionResult,
-} from './types';

package/src/patterns/switch-field/SwitchField.tsx

@@ -1,42 +0,0 @@
-import { Switch } from '@ankhorage/surface';
-import React from 'react';
-
-import { ListItem } from '../../features/list/public';
-import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
-import type { SwitchFieldProps } from './types';
-
-function SwitchFieldInner({
-  themeId: _themeId,
-  mode: _mode,
-  label,
-  description,
-  value,
-  onValueChange,
-  disabled,
-  testID,
-  interactionPolicy,
-}: SwitchFieldProps) {
-  return (
-    <ListItem
-      action={
-        <Switch
-          checked={value}
-          disabled={disabled}
-          interactionPolicy={interactionPolicy}
-          onCheckedChange={onValueChange}
-        />
-      }
-      description={description}
-      disabled={disabled}
-      testID={testID}
-      title={label}
-      variant="card"
-    />
-  );
-}
-
-/***
- * Labeled switch field pattern built on the card-style `ListItem` presentation.
- *
- */
-export const SwitchField = withZoraThemeScope(SwitchFieldInner);

package/src/patterns/switch-field/index.ts

@@ -1,2 +0,0 @@
-export * from './SwitchField';
-export * from './types';

package/src/patterns/switch-field/meta.ts

@@ -1,10 +0,0 @@
-import type { ZoraComponentMeta } from '../../metadata';
-
-export const switchFieldMeta = {
-  name: 'SwitchField',
-  category: 'pattern',
-  directManifestNode: false,
-  allowedChildren: [],
-  note: 'Form pattern; not represented as a manifest node in v1.',
-  props: {},
-} as const satisfies ZoraComponentMeta;

package/src/patterns/switch-field/types.ts

@@ -1,11 +0,0 @@
-import type { ReactNode } from 'react';
-
-import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
-
-export interface SwitchFieldProps extends ZoraBaseProps {
-  label: ReactNode;
-  description?: ReactNode;
-  value: boolean;
-  onValueChange: (value: boolean) => void;
-  disabled?: boolean;
-}

package/src/patterns/theme-composer/ThemeComposer.test.ts

@@ -1,212 +0,0 @@
-import { readFileSync } from 'node:fs';
-
-import { parseHexColorOrThrow } from '@ankhorage/color-theory';
-import { APP_CATEGORIES } from '@ankhorage/contracts';
-import { describe, expect, test } from 'bun:test';
-
-import { zoraDefaultTheme } from '../../theme/zoraDefaultTheme';
-import type { ThemeComposerProps } from './types';
-
-const themeComposerSource = readFileSync(new URL('./ThemeComposer.tsx', import.meta.url), 'utf8');
-
-// ---------------------------------------------------------------------------
-// ThemeComposerProps shape tests
-// ---------------------------------------------------------------------------
-
-describe('ThemeComposerProps', () => {
-  test('accepts a valid ZoraTheme as value', () => {
-    const props: ThemeComposerProps = {
-      value: zoraDefaultTheme,
-      onChange: () => undefined,
-    };
-    expect(props.value.primaryColor).toBe(zoraDefaultTheme.primaryColor);
-    expect(props.value.harmony).toBe('analogous');
-    expect(props.value.appCategory).toBe('developer_tools');
-    expect(props.value.name).toBe('ZORA');
-  });
-
-  test('accepts optional mode and onModeChange', () => {
-    const props: ThemeComposerProps = {
-      value: zoraDefaultTheme,
-      onChange: () => undefined,
-      mode: 'dark',
-      onModeChange: (_mode) => undefined,
-    };
-    expect(props.mode).toBe('dark');
-  });
-
-  test('accepts optional onSubmit', () => {
-    let submitted = false;
-    const props: ThemeComposerProps = {
-      value: zoraDefaultTheme,
-      onChange: () => undefined,
-      onSubmit: () => {
-        submitted = true;
-      },
-    };
-    props.onSubmit?.(zoraDefaultTheme);
-    expect(submitted).toBe(true);
-  });
-
-  test('accepts optional appCategories as option list override', () => {
-    const narrow = ['developer_tools', 'utilities_tools'] as const;
-    const props: ThemeComposerProps = {
-      value: zoraDefaultTheme,
-      onChange: () => undefined,
-      appCategories: narrow,
-    };
-    expect(props.appCategories).toEqual(narrow);
-  });
-});
-
-// ---------------------------------------------------------------------------
-// COLOR_HARMONIES ownership
-// ---------------------------------------------------------------------------
-
-describe('COLOR_HARMONIES ownership for ThemeComposer', () => {
-  test('derives Select options from the canonical Color Theory catalog', () => {
-    expect(themeComposerSource).toContain('COLOR_HARMONIES.map');
-  });
-});
-
-// ---------------------------------------------------------------------------
-// APP_CATEGORIES default behavior
-// ---------------------------------------------------------------------------
-
-describe('APP_CATEGORIES defaults', () => {
-  test('APP_CATEGORIES from contracts contains expected entries', () => {
-    expect(APP_CATEGORIES).toContain('developer_tools');
-    expect(APP_CATEGORIES).toContain('utilities_tools');
-    expect(APP_CATEGORIES).toContain('lifestyle');
-  });
-
-  test('ThemeComposer appCategories prop is optional — falls back to APP_CATEGORIES', () => {
-    const props: ThemeComposerProps = {
-      value: zoraDefaultTheme,
-      onChange: () => undefined,
-    };
-    // No appCategories provided — component uses APP_CATEGORIES internally.
-    expect(props.appCategories).toBeUndefined();
-  });
-
-  test('ThemeComposer appCategories narrows the available options when provided', () => {
-    const narrow = ['developer_tools', 'utilities_tools'] as const;
-    const props: ThemeComposerProps = {
-      value: zoraDefaultTheme,
-      onChange: () => undefined,
-      appCategories: narrow,
-    };
-    expect(props.appCategories).toHaveLength(2);
-    expect(props.appCategories).toContain('developer_tools');
-  });
-});
-
-// ---------------------------------------------------------------------------
-// onChange propagation contracts
-// ---------------------------------------------------------------------------
-
-describe('onChange propagation contract', () => {
-  test('onChange receives updated theme with new harmony', () => {
-    const received: (typeof zoraDefaultTheme)[] = [];
-    const props: ThemeComposerProps = {
-      value: zoraDefaultTheme,
-      onChange: (t) => received.push(t),
-    };
-    // Simulate what the component does internally
-    props.onChange({ ...zoraDefaultTheme, harmony: 'triadic' });
-    expect(received).toHaveLength(1);
-    expect(received[0]?.harmony).toBe('triadic');
-  });
-
-  test('onChange receives updated theme with new appCategory', () => {
-    const received: (typeof zoraDefaultTheme)[] = [];
-    const props: ThemeComposerProps = {
-      value: zoraDefaultTheme,
-      onChange: (t) => received.push(t),
-    };
-    props.onChange({ ...zoraDefaultTheme, appCategory: 'lifestyle' });
-    expect(received).toHaveLength(1);
-    expect(received[0]?.appCategory).toBe('lifestyle');
-  });
-
-  test('onChange receives updated theme with new valid name', () => {
-    const received: (typeof zoraDefaultTheme)[] = [];
-    const props: ThemeComposerProps = {
-      value: zoraDefaultTheme,
-      onChange: (t) => received.push(t),
-    };
-    props.onChange({ ...zoraDefaultTheme, name: 'My Custom Theme' });
-    expect(received).toHaveLength(1);
-    expect(received[0]?.name).toBe('My Custom Theme');
-  });
-
-  test('onChange is not called with an empty name', () => {
-    // Simulate the component's name validation logic
-    const received: (typeof zoraDefaultTheme)[] = [];
-    const onChange = (t: typeof zoraDefaultTheme) => received.push(t);
-
-    const newName = '';
-    if (newName.trim().length > 0) {
-      onChange({ ...zoraDefaultTheme, name: newName });
-    }
-    // Empty name should not propagate
-    expect(received).toHaveLength(0);
-  });
-
-  test('onChange is not called with invalid primary color', () => {
-    // Simulate the component's hex validation logic
-    const received: (typeof zoraDefaultTheme)[] = [];
-    const onChange = (t: typeof zoraDefaultTheme) => received.push(t);
-
-    const badColor = '#xyz';
-    try {
-      parseHexColorOrThrow(badColor);
-      // Should not reach here for an invalid color
-      onChange({ ...zoraDefaultTheme, primaryColor: badColor });
-    } catch {
-      // Expected: invalid color — do not call onChange
-    }
-    expect(received).toHaveLength(0);
-  });
-
-  test('onChange is called with a valid primary color', () => {
-    const received: (typeof zoraDefaultTheme)[] = [];
-    const onChange = (t: typeof zoraDefaultTheme) => received.push(t);
-
-    const goodColor = '#c084fc';
-    try {
-      parseHexColorOrThrow(goodColor);
-      onChange({ ...zoraDefaultTheme, primaryColor: goodColor });
-    } catch {
-      // Should not reach here for a valid color
-    }
-    expect(received).toHaveLength(1);
-    expect(received[0]?.primaryColor).toBe(goodColor);
-  });
-});
-
-// ---------------------------------------------------------------------------
-// Legacy API absence checks
-// ---------------------------------------------------------------------------
-
-describe('No legacy APIs', () => {
-  test('ThemeComposerProps value carries no colorTone field', () => {
-    const theme = zoraDefaultTheme;
-    expect('colorTone' in theme).toBe(false);
-  });
-
-  test('ThemeComposerProps value carries no appMood field', () => {
-    const theme = zoraDefaultTheme;
-    expect('appMood' in theme).toBe(false);
-  });
-
-  test('value.name is required — zoraDefaultTheme.name is a non-empty string', () => {
-    expect(typeof zoraDefaultTheme.name).toBe('string');
-    expect(zoraDefaultTheme.name.length).toBeGreaterThan(0);
-  });
-
-  test('value.appCategory is required — zoraDefaultTheme.appCategory is set', () => {
-    expect(typeof zoraDefaultTheme.appCategory).toBe('string');
-    expect(zoraDefaultTheme.appCategory.length).toBeGreaterThan(0);
-  });
-});