@ankhorage/zora 1.0.9 → 1.1.0

package/dist/patterns/image-upload-field/uploadFlow.js

@@ -0,0 +1,106 @@
+function parseAccept(accept) {
+    if (!accept)
+        return [];
+    return accept
+        .split(',')
+        .map((entry) => entry.trim())
+        .filter((entry) => entry.length > 0);
+}
+function matchesAcceptToken({ token, contentType, fileName, }) {
+    const normalizedToken = token.toLowerCase();
+    const normalizedContentType = contentType?.toLowerCase();
+    const normalizedFileName = fileName?.toLowerCase();
+    if (normalizedToken.startsWith('.')) {
+        if (!normalizedFileName)
+            return null;
+        return normalizedFileName.endsWith(normalizedToken);
+    }
+    if (normalizedToken.endsWith('/*')) {
+        if (!normalizedContentType)
+            return null;
+        const prefix = normalizedToken.slice(0, Math.max(0, normalizedToken.length - 1));
+        return normalizedContentType.startsWith(prefix);
+    }
+    if (!normalizedContentType)
+        return null;
+    return normalizedContentType === normalizedToken;
+}
+export function isAccepted({ accept, contentType, fileName, }) {
+    const tokens = parseAccept(accept);
+    if (tokens.length === 0)
+        return true;
+    let hadSignal = false;
+    for (const token of tokens) {
+        const matches = matchesAcceptToken({ token, contentType, fileName });
+        if (matches === null) {
+            continue;
+        }
+        hadSignal = true;
+        if (matches)
+            return true;
+    }
+    // If we cannot validate due to missing metadata, do not block.
+    return !hadSignal;
+}
+function formatBytes(value) {
+    if (!Number.isFinite(value) || value <= 0)
+        return '0 B';
+    const units = ['B', 'KB', 'MB', 'GB'];
+    let size = value;
+    let unitIndex = 0;
+    while (size >= 1024 && unitIndex < units.length - 1) {
+        size /= 1024;
+        unitIndex += 1;
+    }
+    const unit = units[unitIndex] ?? 'B';
+    const rounded = unitIndex === 0 ? Math.round(size) : Math.round(size * 10) / 10;
+    return `${rounded} ${unit}`;
+}
+export function formatAcceptHint(accept) {
+    const tokens = parseAccept(accept);
+    if (tokens.length === 0)
+        return null;
+    return `Accepted: ${tokens.join(', ')}`;
+}
+export function formatMaxSizeHint(maxSizeBytes) {
+    if (maxSizeBytes === undefined)
+        return null;
+    if (!Number.isFinite(maxSizeBytes) || maxSizeBytes <= 0)
+        return null;
+    return `Max size: ${formatBytes(maxSizeBytes)}`;
+}
+export function createOptimisticAssetFromPicked(picked) {
+    return {
+        kind: 'url',
+        url: picked.uri,
+        width: picked.width,
+        height: picked.height,
+        contentType: picked.contentType,
+        metadata: {
+            fileName: picked.fileName,
+            sizeBytes: picked.sizeBytes,
+        },
+    };
+}
+export function resolveRenderableUrl(asset) {
+    if (!asset)
+        return null;
+    if (asset.kind === 'url')
+        return asset.url;
+    return asset.publicUrl ?? null;
+}
+export function validatePickedImage({ picked, accept, maxSizeBytes, validatePicked, }) {
+    if (!isAccepted({ accept, contentType: picked.contentType, fileName: picked.fileName })) {
+        return accept ? `File type not accepted. Expected ${accept}.` : 'File type not accepted.';
+    }
+    if (maxSizeBytes !== undefined &&
+        Number.isFinite(maxSizeBytes) &&
+        maxSizeBytes > 0 &&
+        picked.sizeBytes !== undefined &&
+        Number.isFinite(picked.sizeBytes) &&
+        picked.sizeBytes > maxSizeBytes) {
+        return `File is too large (${formatBytes(picked.sizeBytes)}). Max ${formatBytes(maxSizeBytes)}.`;
+    }
+    return validatePicked?.(picked);
+}
+//# sourceMappingURL=uploadFlow.js.map

package/dist/patterns/image-upload-field/uploadFlow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"uploadFlow.js","sourceRoot":"","sources":["../../../src/patterns/image-upload-field/uploadFlow.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ZoraImageAsset } from '../image-preview';\nimport type { ZoraPickedImage } from './types';\n\nfunction parseAccept(accept: string | undefined): readonly string[] {\n  if (!accept) return [];\n\n  return accept\n    .split(',')\n    .map((entry) => entry.trim())\n    .filter((entry) => entry.length > 0);\n}\n\nfunction matchesAcceptToken({\n  token,\n  contentType,\n  fileName,\n}: {\n  token: string;\n  contentType: string | undefined;\n  fileName: string | undefined;\n}): boolean | null {\n  const normalizedToken = token.toLowerCase();\n  const normalizedContentType = contentType?.toLowerCase();\n  const normalizedFileName = fileName?.toLowerCase();\n\n  if (normalizedToken.startsWith('.')) {\n    if (!normalizedFileName) return null;\n    return normalizedFileName.endsWith(normalizedToken);\n  }\n\n  if (normalizedToken.endsWith('/*')) {\n    if (!normalizedContentType) return null;\n    const prefix = normalizedToken.slice(0, Math.max(0, normalizedToken.length - 1));\n    return normalizedContentType.startsWith(prefix);\n  }\n\n  if (!normalizedContentType) return null;\n  return normalizedContentType === normalizedToken;\n}\n\nexport function isAccepted({\n  accept,\n  contentType,\n  fileName,\n}: {\n  accept: string | undefined;\n  contentType: string | undefined;\n  fileName: string | undefined;\n}): boolean {\n  const tokens = parseAccept(accept);\n  if (tokens.length === 0) return true;\n\n  let hadSignal = false;\n\n  for (const token of tokens) {\n    const matches = matchesAcceptToken({ token, contentType, fileName });\n    if (matches === null) {\n      continue;\n    }\n\n    hadSignal = true;\n    if (matches) return true;\n  }\n\n  // If we cannot validate due to missing metadata, do not block.\n  return !hadSignal;\n}\n\nfunction formatBytes(value: number): string {\n  if (!Number.isFinite(value) || value <= 0) return '0 B';\n\n  const units = ['B', 'KB', 'MB', 'GB'] as const;\n  let size = value;\n  let unitIndex = 0;\n\n  while (size >= 1024 && unitIndex < units.length - 1) {\n    size /= 1024;\n    unitIndex += 1;\n  }\n\n  const unit = units[unitIndex] ?? 'B';\n  const rounded = unitIndex === 0 ? Math.round(size) : Math.round(size * 10) / 10;\n  return `${rounded} ${unit}`;\n}\n\nexport function formatAcceptHint(accept: string | undefined): string | null {\n  const tokens = parseAccept(accept);\n  if (tokens.length === 0) return null;\n  return `Accepted: ${tokens.join(', ')}`;\n}\n\nexport function formatMaxSizeHint(maxSizeBytes: number | undefined): string | null {\n  if (maxSizeBytes === undefined) return null;\n  if (!Number.isFinite(maxSizeBytes) || maxSizeBytes <= 0) return null;\n  return `Max size: ${formatBytes(maxSizeBytes)}`;\n}\n\nexport function createOptimisticAssetFromPicked(picked: ZoraPickedImage): ZoraImageAsset {\n  return {\n    kind: 'url',\n    url: picked.uri,\n    width: picked.width,\n    height: picked.height,\n    contentType: picked.contentType,\n    metadata: {\n      fileName: picked.fileName,\n      sizeBytes: picked.sizeBytes,\n    },\n  };\n}\n\nexport function resolveRenderableUrl(asset: ZoraImageAsset | null): string | null {\n  if (!asset) return null;\n  if (asset.kind === 'url') return asset.url;\n  return asset.publicUrl ?? null;\n}\n\nexport function validatePickedImage({\n  picked,\n  accept,\n  maxSizeBytes,\n  validatePicked,\n}: {\n  picked: ZoraPickedImage;\n  accept: string | undefined;\n  maxSizeBytes: number | undefined;\n  validatePicked: ((picked: ZoraPickedImage) => string | undefined) | undefined;\n}): string | undefined {\n  if (!isAccepted({ accept, contentType: picked.contentType, fileName: picked.fileName })) {\n    return accept ? `File type not accepted. Expected ${accept}.` : 'File type not accepted.';\n  }\n\n  if (\n    maxSizeBytes !== undefined &&\n    Number.isFinite(maxSizeBytes) &&\n    maxSizeBytes > 0 &&\n    picked.sizeBytes !== undefined &&\n    Number.isFinite(picked.sizeBytes) &&\n    picked.sizeBytes > maxSizeBytes\n  ) {\n    return `File is too large (${formatBytes(picked.sizeBytes)}). Max ${formatBytes(maxSizeBytes)}.`;\n  }\n\n  return validatePicked?.(picked);\n}\n"]}

package/dist/patterns/zora-drawer-content/ZoraDrawerContent.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { ZoraDrawerContentProps } from './types';
+export declare const ZoraDrawerContent: (props: ZoraDrawerContentProps) => React.ReactElement | null;
+//# sourceMappingURL=ZoraDrawerContent.d.ts.map

package/dist/patterns/zora-drawer-content/ZoraDrawerContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ZoraDrawerContent.d.ts","sourceRoot":"","sources":["../../../src/patterns/zora-drawer-content/ZoraDrawerContent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAC;AA4CtD,eAAO,MAAM,iBAAiB,8DAA6C,CAAC"}

package/dist/patterns/zora-drawer-content/ZoraDrawerContent.js

@@ -0,0 +1,26 @@
+import { DrawerNavigation as SurfaceDrawerNavigation } from '@ankhorage/surface';
+import React from 'react';
+import { createDrawerItemPressHandler, resolveNavigationItems, } from '../../internal/resolveZoraNavigationItems';
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
+function ZoraDrawerContentInner({ themeId: _themeId, mode: _mode, state, navigation, descriptors, routeMap, compact = false, header, footer, testID, }) {
+    const resolved = resolveNavigationItems({
+        state,
+        descriptors,
+        routeMap,
+        kind: 'drawer',
+    });
+    const items = resolved.map((item) => ({
+        id: item.route.key,
+        label: item.label,
+        icon: item.metadata?.icon,
+        badge: item.metadata?.badge,
+        active: item.active,
+        disabled: item.disabled,
+        onPress: createDrawerItemPressHandler({ item, navigation }),
+        accessibilityLabel: item.metadata?.accessibilityLabel,
+        testID: item.metadata?.testID,
+    }));
+    return (<SurfaceDrawerNavigation compact={compact} footer={footer} header={header} items={items} testID={testID}/>);
+}
+export const ZoraDrawerContent = withZoraThemeScope(ZoraDrawerContentInner);
+//# sourceMappingURL=ZoraDrawerContent.js.map

package/dist/patterns/zora-drawer-content/ZoraDrawerContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ZoraDrawerContent.js","sourceRoot":"","sources":["../../../src/patterns/zora-drawer-content/ZoraDrawerContent.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,IAAI,uBAAuB,EAAE,MAAM,oBAAoB,CAAC;AACjF,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EACL,4BAA4B,EAC5B,sBAAsB,GACvB,MAAM,2CAA2C,CAAC;AACnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,sBAAsB,CAAC,EAC9B,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,KAAK,EACL,UAAU,EACV,WAAW,EACX,QAAQ,EACR,OAAO,GAAG,KAAK,EACf,MAAM,EACN,MAAM,EACN,MAAM,GACiB;IACvB,MAAM,QAAQ,GAAG,sBAAsB,CAAC;QACtC,KAAK;QACL,WAAW;QACX,QAAQ;QACR,IAAI,EAAE,QAAQ;KACf,CAAC,CAAC;IAEH,MAAM,KAAK,GAAG,QAAQ,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QACpC,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG;QAClB,KAAK,EAAE,IAAI,CAAC,KAAK;QACjB,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI;QACzB,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK;QAC3B,MAAM,EAAE,IAAI,CAAC,MAAM;QACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ;QACvB,OAAO,EAAE,4BAA4B,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC;QAC3D,kBAAkB,EAAE,IAAI,CAAC,QAAQ,EAAE,kBAAkB;QACrD,MAAM,EAAE,IAAI,CAAC,QAAQ,EAAE,MAAM;KAC9B,CAAC,CAAC,CAAC;IAEJ,OAAO,CACL,CAAC,uBAAuB,CACtB,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,MAAM,CAAC,CAAC,MAAM,CAAC,EACf,CACH,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,iBAAiB,GAAG,kBAAkB,CAAC,sBAAsB,CAAC,CAAC","sourcesContent":["import { DrawerNavigation as SurfaceDrawerNavigation } from '@ankhorage/surface';\nimport React from 'react';\n\nimport {\n  createDrawerItemPressHandler,\n  resolveNavigationItems,\n} from '../../internal/resolveZoraNavigationItems';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { ZoraDrawerContentProps } from './types';\n\nfunction ZoraDrawerContentInner({\n  themeId: _themeId,\n  mode: _mode,\n  state,\n  navigation,\n  descriptors,\n  routeMap,\n  compact = false,\n  header,\n  footer,\n  testID,\n}: ZoraDrawerContentProps) {\n  const resolved = resolveNavigationItems({\n    state,\n    descriptors,\n    routeMap,\n    kind: 'drawer',\n  });\n\n  const items = resolved.map((item) => ({\n    id: item.route.key,\n    label: item.label,\n    icon: item.metadata?.icon,\n    badge: item.metadata?.badge,\n    active: item.active,\n    disabled: item.disabled,\n    onPress: createDrawerItemPressHandler({ item, navigation }),\n    accessibilityLabel: item.metadata?.accessibilityLabel,\n    testID: item.metadata?.testID,\n  }));\n\n  return (\n    <SurfaceDrawerNavigation\n      compact={compact}\n      footer={footer}\n      header={header}\n      items={items}\n      testID={testID}\n    />\n  );\n}\n\nexport const ZoraDrawerContent = withZoraThemeScope(ZoraDrawerContentInner);\n"]}

package/dist/patterns/zora-drawer-content/index.d.ts

@@ -0,0 +1,3 @@
+export type { ZoraDrawerContentProps } from './types';
+export { ZoraDrawerContent } from './ZoraDrawerContent';
+//# sourceMappingURL=index.d.ts.map

package/dist/patterns/zora-drawer-content/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/patterns/zora-drawer-content/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAC;AACtD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC"}

package/dist/patterns/zora-drawer-content/index.js

@@ -0,0 +1,2 @@
+export { ZoraDrawerContent } from './ZoraDrawerContent';
+//# sourceMappingURL=index.js.map

package/dist/patterns/zora-drawer-content/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/patterns/zora-drawer-content/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC","sourcesContent":["export type { ZoraDrawerContentProps } from './types';\nexport { ZoraDrawerContent } from './ZoraDrawerContent';\n"]}

package/dist/patterns/zora-drawer-content/types.d.ts

@@ -0,0 +1,15 @@
+import type React from 'react';
+import type { ZoraNavigationRouteMap } from '../../components/navigation-list';
+import type { ZoraDrawerNavigation, ZoraNavigationDescriptors, ZoraNavigationState } from '../../internal/resolveZoraNavigationItems';
+import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
+export interface ZoraDrawerContentProps extends ZoraBaseProps {
+    state: ZoraNavigationState;
+    navigation: ZoraDrawerNavigation;
+    descriptors?: ZoraNavigationDescriptors | undefined;
+    routeMap?: ZoraNavigationRouteMap | undefined;
+    compact?: boolean;
+    header?: React.ReactNode;
+    footer?: React.ReactNode;
+    testID?: string;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/patterns/zora-drawer-content/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/patterns/zora-drawer-content/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,kCAAkC,CAAC;AAC/E,OAAO,KAAK,EACV,oBAAoB,EACpB,yBAAyB,EACzB,mBAAmB,EACpB,MAAM,2CAA2C,CAAC;AACnD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,WAAW,sBAAuB,SAAQ,aAAa;IAC3D,KAAK,EAAE,mBAAmB,CAAC;IAC3B,UAAU,EAAE,oBAAoB,CAAC;IACjC,WAAW,CAAC,EAAE,yBAAyB,GAAG,SAAS,CAAC;IACpD,QAAQ,CAAC,EAAE,sBAAsB,GAAG,SAAS,CAAC;IAC9C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}

package/dist/patterns/zora-drawer-content/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/patterns/zora-drawer-content/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/patterns/zora-drawer-content/types.ts"],"names":[],"mappings":"","sourcesContent":["import type React from 'react';\n\nimport type { ZoraNavigationRouteMap } from '../../components/navigation-list';\nimport type {\n  ZoraDrawerNavigation,\n  ZoraNavigationDescriptors,\n  ZoraNavigationState,\n} from '../../internal/resolveZoraNavigationItems';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport interface ZoraDrawerContentProps extends ZoraBaseProps {\n  state: ZoraNavigationState;\n  navigation: ZoraDrawerNavigation;\n  descriptors?: ZoraNavigationDescriptors | undefined;\n  routeMap?: ZoraNavigationRouteMap | undefined;\n  compact?: boolean;\n  header?: React.ReactNode;\n  footer?: React.ReactNode;\n  testID?: string;\n}\n"]}

package/dist/patterns/zora-tab-bar/ZoraTabBar.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { ZoraTabBarProps } from './types';
+export declare const ZoraTabBar: (props: ZoraTabBarProps) => React.ReactElement | null;
+//# sourceMappingURL=ZoraTabBar.d.ts.map

package/dist/patterns/zora-tab-bar/ZoraTabBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ZoraTabBar.d.ts","sourceRoot":"","sources":["../../../src/patterns/zora-tab-bar/ZoraTabBar.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AA6C/C,eAAO,MAAM,UAAU,uDAAsC,CAAC"}

package/dist/patterns/zora-tab-bar/ZoraTabBar.js

@@ -0,0 +1,33 @@
+import { TabBar as SurfaceTabBar } from '@ankhorage/surface';
+import React from 'react';
+import { Surface } from '../../foundation';
+import { createTabBarItemPressHandler, resolveNavigationItems, } from '../../internal/resolveZoraNavigationItems';
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
+function ZoraTabBarInner({ themeId: _themeId, mode: _mode, state, navigation, descriptors, routeMap, compact = false, chrome = 'raised', testID, }) {
+    const resolved = resolveNavigationItems({
+        state,
+        descriptors,
+        routeMap,
+        kind: 'tab',
+    });
+    const items = resolved.map((item) => ({
+        id: item.route.key,
+        label: item.label,
+        icon: item.metadata?.icon,
+        badge: item.metadata?.badge,
+        active: item.active,
+        disabled: item.disabled,
+        onPress: createTabBarItemPressHandler({ item, navigation }),
+        accessibilityLabel: item.metadata?.accessibilityLabel,
+        testID: item.metadata?.testID,
+    }));
+    const content = <SurfaceTabBar compact={compact} items={items} testID={testID}/>;
+    if (chrome === 'none') {
+        return content;
+    }
+    return (<Surface variant="raised" testID={testID ? `${testID}-chrome` : undefined}>
+      {content}
+    </Surface>);
+}
+export const ZoraTabBar = withZoraThemeScope(ZoraTabBarInner);
+//# sourceMappingURL=ZoraTabBar.js.map

package/dist/patterns/zora-tab-bar/ZoraTabBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ZoraTabBar.js","sourceRoot":"","sources":["../../../src/patterns/zora-tab-bar/ZoraTabBar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAC7D,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAC3C,OAAO,EACL,4BAA4B,EAC5B,sBAAsB,GACvB,MAAM,2CAA2C,CAAC;AACnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,eAAe,CAAC,EACvB,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,KAAK,EACL,UAAU,EACV,WAAW,EACX,QAAQ,EACR,OAAO,GAAG,KAAK,EACf,MAAM,GAAG,QAAQ,EACjB,MAAM,GACU;IAChB,MAAM,QAAQ,GAAG,sBAAsB,CAAC;QACtC,KAAK;QACL,WAAW;QACX,QAAQ;QACR,IAAI,EAAE,KAAK;KACZ,CAAC,CAAC;IAEH,MAAM,KAAK,GAAG,QAAQ,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QACpC,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG;QAClB,KAAK,EAAE,IAAI,CAAC,KAAK;QACjB,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI;QACzB,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK;QAC3B,MAAM,EAAE,IAAI,CAAC,MAAM;QACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ;QACvB,OAAO,EAAE,4BAA4B,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC;QAC3D,kBAAkB,EAAE,IAAI,CAAC,QAAQ,EAAE,kBAAkB;QACrD,MAAM,EAAE,IAAI,CAAC,QAAQ,EAAE,MAAM;KAC9B,CAAC,CAAC,CAAC;IAEJ,MAAM,OAAO,GAAG,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,EAAG,CAAC;IAElF,IAAI,MAAM,KAAK,MAAM,EAAE,CAAC;QACtB,OAAO,OAAO,CAAC;IACjB,CAAC;IAED,OAAO,CACL,CAAC,OAAO,CAAC,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,MAAM,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CACxE;MAAA,CAAC,OAAO,CACV;IAAA,EAAE,OAAO,CAAC,CACX,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,kBAAkB,CAAC,eAAe,CAAC,CAAC","sourcesContent":["import { TabBar as SurfaceTabBar } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { Surface } from '../../foundation';\nimport {\n  createTabBarItemPressHandler,\n  resolveNavigationItems,\n} from '../../internal/resolveZoraNavigationItems';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { ZoraTabBarProps } from './types';\n\nfunction ZoraTabBarInner({\n  themeId: _themeId,\n  mode: _mode,\n  state,\n  navigation,\n  descriptors,\n  routeMap,\n  compact = false,\n  chrome = 'raised',\n  testID,\n}: ZoraTabBarProps) {\n  const resolved = resolveNavigationItems({\n    state,\n    descriptors,\n    routeMap,\n    kind: 'tab',\n  });\n\n  const items = resolved.map((item) => ({\n    id: item.route.key,\n    label: item.label,\n    icon: item.metadata?.icon,\n    badge: item.metadata?.badge,\n    active: item.active,\n    disabled: item.disabled,\n    onPress: createTabBarItemPressHandler({ item, navigation }),\n    accessibilityLabel: item.metadata?.accessibilityLabel,\n    testID: item.metadata?.testID,\n  }));\n\n  const content = <SurfaceTabBar compact={compact} items={items} testID={testID} />;\n\n  if (chrome === 'none') {\n    return content;\n  }\n\n  return (\n    <Surface variant=\"raised\" testID={testID ? `${testID}-chrome` : undefined}>\n      {content}\n    </Surface>\n  );\n}\n\nexport const ZoraTabBar = withZoraThemeScope(ZoraTabBarInner);\n"]}

package/dist/patterns/zora-tab-bar/index.d.ts

@@ -0,0 +1,3 @@
+export type { ZoraTabBarProps } from './types';
+export { ZoraTabBar } from './ZoraTabBar';
+//# sourceMappingURL=index.d.ts.map

package/dist/patterns/zora-tab-bar/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/patterns/zora-tab-bar/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAC/C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC"}

package/dist/patterns/zora-tab-bar/index.js

@@ -0,0 +1,2 @@
+export { ZoraTabBar } from './ZoraTabBar';
+//# sourceMappingURL=index.js.map

package/dist/patterns/zora-tab-bar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/patterns/zora-tab-bar/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC","sourcesContent":["export type { ZoraTabBarProps } from './types';\nexport { ZoraTabBar } from './ZoraTabBar';\n"]}

package/dist/patterns/zora-tab-bar/types.d.ts

@@ -0,0 +1,19 @@
+import type { ZoraNavigationRouteMap } from '../../components/navigation-list';
+import type { ZoraNavigationDescriptors, ZoraNavigationState, ZoraTabBarNavigation } from '../../internal/resolveZoraNavigationItems';
+import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
+export interface ZoraTabBarProps extends ZoraBaseProps {
+    state: ZoraNavigationState;
+    navigation: ZoraTabBarNavigation;
+    descriptors?: ZoraNavigationDescriptors | undefined;
+    insets?: {
+        top?: number;
+        bottom?: number;
+        left?: number;
+        right?: number;
+    } | undefined;
+    routeMap?: ZoraNavigationRouteMap | undefined;
+    compact?: boolean;
+    chrome?: 'none' | 'raised';
+    testID?: string;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/patterns/zora-tab-bar/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/patterns/zora-tab-bar/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,kCAAkC,CAAC;AAC/E,OAAO,KAAK,EACV,yBAAyB,EACzB,mBAAmB,EACnB,oBAAoB,EACrB,MAAM,2CAA2C,CAAC;AACnD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,WAAW,eAAgB,SAAQ,aAAa;IACpD,KAAK,EAAE,mBAAmB,CAAC;IAC3B,UAAU,EAAE,oBAAoB,CAAC;IACjC,WAAW,CAAC,EAAE,yBAAyB,GAAG,SAAS,CAAC;IACpD,MAAM,CAAC,EAAE;QAAE,GAAG,CAAC,EAAE,MAAM,CAAC;QAAC,MAAM,CAAC,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,SAAS,CAAC;IACtF,QAAQ,CAAC,EAAE,sBAAsB,GAAG,SAAS,CAAC;IAC9C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IAC3B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}

package/dist/patterns/zora-tab-bar/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/patterns/zora-tab-bar/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/patterns/zora-tab-bar/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ZoraNavigationRouteMap } from '../../components/navigation-list';\nimport type {\n  ZoraNavigationDescriptors,\n  ZoraNavigationState,\n  ZoraTabBarNavigation,\n} from '../../internal/resolveZoraNavigationItems';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport interface ZoraTabBarProps extends ZoraBaseProps {\n  state: ZoraNavigationState;\n  navigation: ZoraTabBarNavigation;\n  descriptors?: ZoraNavigationDescriptors | undefined;\n  insets?: { top?: number; bottom?: number; left?: number; right?: number } | undefined;\n  routeMap?: ZoraNavigationRouteMap | undefined;\n  compact?: boolean;\n  chrome?: 'none' | 'raised';\n  testID?: string;\n}\n"]}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ankhorage/zora",
   "type": "module",
-  "version": "1.0.9",
+  "version": "1.1.0",
   "description": "Opinionated React Native and React Native Web UI kit built on @ankhorage/surface.",
   "homepage": "https://github.com/ankhorage/zora#readme",
   "bugs": {
@@ -44,8 +44,8 @@
   },
   "dependencies": {
     "@ankhorage/color-theory": "^0.0.4",
-    "@ankhorage/contracts": "^1.1.1",
-    "@ankhorage/surface": "^1.0.3"
+    "@ankhorage/contracts": "^1.2.0",
+    "@ankhorage/surface": "^1.2.0"
   },
   "files": [
     "dist",

package/src/audit.test.ts

@@ -240,3 +240,32 @@ describe('Plan 5 audit — public exports carry no legacy types', () => {
     expect(indexSource).not.toContain('AnkhTheme');
   });
 });
+
+describe('navigation chrome policy', () => {
+  const NAVIGATION_PATHS = [
+    join(SRC_ROOT, 'components', 'navigation-item'),
+    join(SRC_ROOT, 'components', 'navigation-list'),
+    join(SRC_ROOT, 'patterns', 'zora-tab-bar'),
+    join(SRC_ROOT, 'patterns', 'zora-drawer-content'),
+    join(SRC_ROOT, 'internal', 'resolveZoraNavigationItems.ts'),
+  ];
+
+  test('does not import expo-router, react-navigation, or Surface internals', () => {
+    const sources = NAVIGATION_PATHS.flatMap((path) => {
+      if (path.endsWith('.ts')) {
+        return [readFileSync(path, 'utf8')];
+      }
+
+      if (!path.includes(`${SRC_ROOT}/`)) {
+        return [];
+      }
+
+      return listFiles(path).map((filePath) => readFileSync(filePath, 'utf8'));
+    }).join('\n');
+
+    expect(sources).not.toMatch(/expo-router/);
+    expect(sources).not.toMatch(/@react-navigation\//);
+    expect(sources).not.toMatch(/@ankhorage\/surface\/src\//);
+    expect(sources).not.toMatch(/@ankhorage\/surface\/dist\//);
+  });
+});

package/src/components/image/Image.tsx

@@ -0,0 +1,11 @@
+import { Image as SurfaceImage } from '@ankhorage/surface';
+import React from 'react';
+
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
+import type { ImageProps } from './types';
+
+function ImageInner({ themeId: _themeId, mode: _mode, ...props }: ImageProps) {
+  return <SurfaceImage {...props} />;
+}
+
+export const Image = withZoraThemeScope(ImageInner);

package/src/components/image/index.ts

@@ -0,0 +1,2 @@
+export { Image } from './Image';
+export type { ImageFit, ImageProps, SurfaceImageSource } from './types';

package/src/components/image/types.ts

@@ -0,0 +1,7 @@
+import type { ImageProps as SurfaceImageProps } from '@ankhorage/surface';
+
+import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
+
+export type { ImageFit, SurfaceImageSource } from '@ankhorage/surface';
+
+export interface ImageProps extends ZoraBaseProps, Omit<SurfaceImageProps, 'mode' | 'themeId'> {}

package/src/components/navigation-item/NavigationItem.tsx

@@ -0,0 +1,36 @@
+import { NavigationItem as SurfaceNavigationItem } from '@ankhorage/surface';
+import React from 'react';
+
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
+import type { NavigationItemProps } from './types';
+
+function NavigationItemInner({
+  themeId: _themeId,
+  mode: _mode,
+  route,
+  metadata,
+  active = false,
+  compact = false,
+  onPress,
+  testID,
+}: NavigationItemProps) {
+  return (
+    <SurfaceNavigationItem
+      compact={compact}
+      item={{
+        id: route.key,
+        label: metadata?.label ?? route.name,
+        icon: metadata?.icon,
+        badge: metadata?.badge,
+        active,
+        disabled: metadata?.disabled,
+        onPress,
+        accessibilityLabel: metadata?.accessibilityLabel,
+        testID: metadata?.testID,
+      }}
+      testID={testID}
+    />
+  );
+}
+
+export const NavigationItem = withZoraThemeScope(NavigationItemInner);

package/src/components/navigation-item/index.ts

@@ -0,0 +1,6 @@
+export { NavigationItem } from './NavigationItem';
+export type {
+  NavigationItemProps,
+  ZoraNavigationRouteMetadata,
+  ZoraNavigationRouteState,
+} from './types';

package/src/components/navigation-item/types.ts

@@ -0,0 +1,26 @@
+import type { ButtonIconSpec } from '@ankhorage/surface';
+import type React from 'react';
+
+import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
+
+export interface ZoraNavigationRouteMetadata {
+  label?: React.ReactNode;
+  icon?: ButtonIconSpec;
+  badge?: React.ReactNode;
+  disabled?: boolean;
+  testID?: string;
+  accessibilityLabel?: string;
+}
+
+export interface ZoraNavigationRouteState {
+  key: string;
+  name: string;
+}
+
+export interface NavigationItemProps extends ZoraBaseProps {
+  route: ZoraNavigationRouteState;
+  metadata?: ZoraNavigationRouteMetadata;
+  active?: boolean;
+  compact?: boolean;
+  onPress?: () => void;
+}

package/src/components/navigation-list/NavigationList.tsx

@@ -0,0 +1,62 @@
+import {
+  DrawerNavigation as SurfaceDrawerNavigation,
+  NavigationList as SurfaceNavigationList,
+} from '@ankhorage/surface';
+import React from 'react';
+
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
+import type { NavigationListProps } from './types';
+
+function NavigationListInner({
+  themeId: _themeId,
+  mode: _mode,
+  routes,
+  routeMap,
+  activeRouteKey,
+  orientation = 'vertical',
+  compact = false,
+  onRoutePress,
+  header,
+  footer,
+  testID,
+}: NavigationListProps) {
+  const items = routes.map((route) => {
+    const metadata = routeMap?.[route.name];
+    const active = activeRouteKey ? route.key === activeRouteKey : false;
+
+    return {
+      id: route.key,
+      label: metadata?.label ?? route.name,
+      icon: metadata?.icon,
+      badge: metadata?.badge,
+      active,
+      disabled: metadata?.disabled,
+      onPress: metadata?.disabled ? undefined : () => onRoutePress?.(route),
+      accessibilityLabel: metadata?.accessibilityLabel,
+      testID: metadata?.testID,
+    };
+  });
+
+  if (header || footer) {
+    return (
+      <SurfaceDrawerNavigation
+        compact={compact}
+        footer={footer}
+        header={header}
+        items={items}
+        testID={testID}
+      />
+    );
+  }
+
+  return (
+    <SurfaceNavigationList
+      compact={compact}
+      items={items}
+      orientation={orientation}
+      testID={testID}
+    />
+  );
+}
+
+export const NavigationList = withZoraThemeScope(NavigationListInner);

package/src/components/navigation-list/index.ts

@@ -0,0 +1,2 @@
+export { NavigationList } from './NavigationList';
+export type { NavigationListProps, ZoraNavigationRouteMap } from './types';

package/src/components/navigation-list/types.ts

@@ -0,0 +1,17 @@
+import type React from 'react';
+
+import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
+import type { ZoraNavigationRouteMetadata, ZoraNavigationRouteState } from '../navigation-item';
+
+export type ZoraNavigationRouteMap = Partial<Record<string, ZoraNavigationRouteMetadata>>;
+
+export interface NavigationListProps extends ZoraBaseProps {
+  routes: readonly ZoraNavigationRouteState[];
+  routeMap?: ZoraNavigationRouteMap;
+  activeRouteKey?: string;
+  orientation?: 'vertical' | 'horizontal';
+  compact?: boolean;
+  onRoutePress?: (route: ZoraNavigationRouteState) => void;
+  header?: React.ReactNode;
+  footer?: React.ReactNode;
+}

package/src/index.ts

@@ -58,6 +58,8 @@ export type { IconProps } from './components/icon';
 export { Icon } from './components/icon';
 export type { IconButtonProps } from './components/icon-button';
 export { IconButton } from './components/icon-button';
+export type { ImageFit, ImageProps, SurfaceImageSource } from './components/image';
+export { Image } from './components/image';
 export type { InputProps, InputTrailingAction } from './components/input';
 export { Input } from './components/input';
 export type { MediaCardImageProps, MediaCardProps } from './components/media-card';
@@ -66,6 +68,14 @@ export type { MetricCardProps } from './components/metric-card';
 export { MetricCard } from './components/metric-card';
 export type { ModalProps } from './components/modal';
 export { Modal } from './components/modal';
+export type {
+  NavigationItemProps,
+  ZoraNavigationRouteMetadata,
+  ZoraNavigationRouteState,
+} from './components/navigation-item';
+export { NavigationItem } from './components/navigation-item';
+export type { NavigationListProps, ZoraNavigationRouteMap } from './components/navigation-list';
+export { NavigationList } from './components/navigation-list';
 export type { ProgressProps } from './components/progress';
 export { Progress } from './components/progress';
 export type { RadioGroupOption, RadioGroupProps, RadioProps } from './components/radio';
@@ -152,6 +162,18 @@ export type { EmptyStateAction, EmptyStateProps } from './patterns/empty-state';
 export { EmptyState } from './patterns/empty-state';
 export type { FilterBarProps } from './patterns/filter-bar';
 export { FilterBar } from './patterns/filter-bar';
+export type {
+  ImagePreviewProps,
+  ZoraImageAsset,
+  ZoraImageMetadata,
+} from './patterns/image-preview';
+export { ImagePreview } from './patterns/image-preview';
+export type {
+  ImageUploadFieldProps,
+  ImageUploadProgressContext,
+  ZoraPickedImage,
+} from './patterns/image-upload-field';
+export { ImageUploadField } from './patterns/image-upload-field';
 export type { InspectorFieldProps } from './patterns/inspector-field';
 export { InspectorField } from './patterns/inspector-field';
 export type {
@@ -183,4 +205,8 @@ export type { TimelineItem, TimelineProps } from './patterns/timeline';
 export { Timeline } from './patterns/timeline';
 export type { TreeItemNode, TreeItemRenderProps, TreeViewProps } from './patterns/tree-view';
 export { TreeItem, TreeView } from './patterns/tree-view';
+export type { ZoraDrawerContentProps } from './patterns/zora-drawer-content';
+export { ZoraDrawerContent } from './patterns/zora-drawer-content';
+export type { ZoraTabBarProps } from './patterns/zora-tab-bar';
+export { ZoraTabBar } from './patterns/zora-tab-bar';
 export * from './theme';