@ankhorage/zora 6.0.0 → 8.0.0

package/src/patterns/image-upload-field/uploadFlow.test.ts

@@ -1,117 +0,0 @@
-import { describe, expect, test } from 'bun:test';
-
-import type { ZoraPickedImage } from './types';
-import {
-  createOptimisticAssetFromPicked,
-  formatAcceptHint,
-  formatMaxSizeHint,
-  isAccepted,
-  resolveRenderableUrl,
-  validatePickedImage,
-} from './uploadFlow';
-
-describe('uploadFlow', () => {
-  test('formatAcceptHint returns null for empty input', () => {
-    expect(formatAcceptHint(undefined)).toBeNull();
-    expect(formatAcceptHint('')).toBeNull();
-    expect(formatAcceptHint('   ')).toBeNull();
-  });
-
-  test('formatMaxSizeHint returns null for invalid sizes', () => {
-    expect(formatMaxSizeHint(undefined)).toBeNull();
-    expect(formatMaxSizeHint(0)).toBeNull();
-    expect(formatMaxSizeHint(-5)).toBeNull();
-  });
-
-  test('isAccepted supports wildcard image/* matching', () => {
-    expect(isAccepted({ accept: 'image/*', contentType: 'image/png', fileName: undefined })).toBe(
-      true,
-    );
-    expect(
-      isAccepted({ accept: 'image/*', contentType: 'application/json', fileName: undefined }),
-    ).toBe(false);
-  });
-
-  test('isAccepted supports exact MIME matching', () => {
-    expect(isAccepted({ accept: 'image/png', contentType: 'image/png', fileName: undefined })).toBe(
-      true,
-    );
-    expect(
-      isAccepted({ accept: 'image/png', contentType: 'image/jpeg', fileName: undefined }),
-    ).toBe(false);
-  });
-
-  test('isAccepted supports extension matching', () => {
-    expect(isAccepted({ accept: '.png', contentType: undefined, fileName: 'photo.png' })).toBe(
-      true,
-    );
-    expect(isAccepted({ accept: '.png', contentType: undefined, fileName: 'photo.jpg' })).toBe(
-      false,
-    );
-  });
-
-  test('isAccepted does not block when it cannot validate', () => {
-    expect(isAccepted({ accept: 'image/*', contentType: undefined, fileName: undefined })).toBe(
-      true,
-    );
-  });
-
-  test('validatePickedImage rejects by accept when metadata allows checking', () => {
-    const picked: ZoraPickedImage = { uri: 'file://a', contentType: 'application/json' };
-    expect(
-      validatePickedImage({
-        picked,
-        accept: 'image/*',
-        maxSizeBytes: undefined,
-        validatePicked: undefined,
-      }),
-    ).toContain('File type not accepted');
-  });
-
-  test('validatePickedImage rejects oversize files when sizeBytes is present', () => {
-    const picked: ZoraPickedImage = { uri: 'file://a', sizeBytes: 2_000, contentType: 'image/png' };
-    const error = validatePickedImage({
-      picked,
-      accept: 'image/*',
-      maxSizeBytes: 1_000,
-      validatePicked: undefined,
-    });
-    expect(error).toContain('File is too large');
-  });
-
-  test('validatePickedImage allows oversize when sizeBytes is missing', () => {
-    const picked: ZoraPickedImage = { uri: 'file://a', contentType: 'image/png' };
-    expect(
-      validatePickedImage({
-        picked,
-        accept: 'image/*',
-        maxSizeBytes: 1_000,
-        validatePicked: undefined,
-      }),
-    ).toBeUndefined();
-  });
-
-  test('createOptimisticAssetFromPicked maps uri and metadata correctly', () => {
-    const picked: ZoraPickedImage = {
-      uri: 'file://picked',
-      fileName: 'picked.png',
-      sizeBytes: 123,
-      contentType: 'image/png',
-    };
-    const asset = createOptimisticAssetFromPicked(picked);
-    expect(asset.kind).toBe('url');
-    expect(asset.url).toBe('file://picked');
-    expect(asset.contentType).toBe('image/png');
-    expect(asset.metadata?.fileName).toBe('picked.png');
-    expect(asset.metadata?.sizeBytes).toBe(123);
-  });
-
-  test('resolveRenderableUrl renders url assets directly and storage only with publicUrl', () => {
-    expect(resolveRenderableUrl(null)).toBeNull();
-    expect(resolveRenderableUrl({ kind: 'url', url: 'https://x' })).toBe('https://x');
-    expect(resolveRenderableUrl({ kind: 'storage', bucket: 'b', path: 'p' })).toBeNull();
-    expect(
-      resolveRenderableUrl({ kind: 'storage', bucket: 'b', path: 'p', publicUrl: 'https://y' }),
-    ).toBe('https://y');
-  });
-});

package/src/patterns/image-upload-field/uploadFlow.ts

@@ -1,145 +0,0 @@
-import type { ZoraImageAsset } from '../image-preview';
-import type { ZoraPickedImage } from './types';
-
-function parseAccept(accept: string | undefined): readonly string[] {
-  if (!accept) return [];
-
-  return accept
-    .split(',')
-    .map((entry) => entry.trim())
-    .filter((entry) => entry.length > 0);
-}
-
-function matchesAcceptToken({
-  token,
-  contentType,
-  fileName,
-}: {
-  token: string;
-  contentType: string | undefined;
-  fileName: string | undefined;
-}): boolean | null {
-  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,
-}: {
-  accept: string | undefined;
-  contentType: string | undefined;
-  fileName: string | undefined;
-}): boolean {
-  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: number): string {
-  if (!Number.isFinite(value) || value <= 0) return '0 B';
-
-  const units = ['B', 'KB', 'MB', 'GB'] as const;
-  let size = value;
-  let unitIndex = 0;
-
-  while (size >= 1024 && unitIndex < units.length - 1) {
-    size /= 1024;
-    unitIndex += 1;
-  }
-
-  const unit = units.at(unitIndex) ?? 'B';
-  const rounded = unitIndex === 0 ? Math.round(size) : Math.round(size * 10) / 10;
-  return `${rounded} ${unit}`;
-}
-
-export function formatAcceptHint(accept: string | undefined): string | null {
-  const tokens = parseAccept(accept);
-  if (tokens.length === 0) return null;
-  return `Accepted: ${tokens.join(', ')}`;
-}
-
-export function formatMaxSizeHint(maxSizeBytes: number | undefined): string | null {
-  if (maxSizeBytes === undefined) return null;
-  if (!Number.isFinite(maxSizeBytes) || maxSizeBytes <= 0) return null;
-  return `Max size: ${formatBytes(maxSizeBytes)}`;
-}
-
-export function createOptimisticAssetFromPicked(picked: ZoraPickedImage): ZoraImageAsset {
-  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: ZoraImageAsset | null): string | null {
-  if (!asset) return null;
-  if (asset.kind === 'url') return asset.url;
-  return asset.publicUrl ?? null;
-}
-
-export function validatePickedImage({
-  picked,
-  accept,
-  maxSizeBytes,
-  validatePicked,
-}: {
-  picked: ZoraPickedImage;
-  accept: string | undefined;
-  maxSizeBytes: number | undefined;
-  validatePicked: ((picked: ZoraPickedImage) => string | undefined) | undefined;
-}): string | undefined {
-  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);
-}

package/src/patterns/post-card/PostCard.test.tsx

@@ -1,11 +0,0 @@
-import { describe, expect, test } from 'bun:test';
-
-import { ZORA_COMPONENT_META } from '../../metadata';
-
-describe('PostCard', () => {
-  test('is registered as a public ZORA pattern', () => {
-    expect(ZORA_COMPONENT_META.PostCard?.name).toBe('PostCard');
-    expect(ZORA_COMPONENT_META.PostCard?.category).toBe('pattern');
-    expect(ZORA_COMPONENT_META.PostCard?.directManifestNode).toBe(true);
-  });
-});

package/src/patterns/post-card/PostCard.tsx

@@ -1,241 +0,0 @@
-import React from 'react';
-import { Image as ReactNativeImage } from 'react-native';
-
-import { Avatar } from '../../components/avatar';
-import { Button } from '../../components/button';
-import { Card } from '../../components/card';
-import { Text } from '../../components/text';
-import { Box, Divider, Inline, Stack } from '../../foundation';
-import { useZoraTheme } from '../../theme/useZoraTheme';
-import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
-import type {
-  PostAction,
-  PostAuthor,
-  PostCardMedia,
-  PostCardProps,
-  PostCommentPreview,
-} from './types';
-
-function resolveAuthorName(author: PostAuthor): string | undefined {
-  return typeof author.name === 'string' ? author.name : author.avatar?.name;
-}
-
-function resolveMediaAspectRatio(aspectRatio: number | undefined): number {
-  if (aspectRatio === undefined || !Number.isFinite(aspectRatio) || aspectRatio <= 0) {
-    return 16 / 9;
-  }
-
-  return aspectRatio;
-}
-
-function isPostCardMediaList(
-  media: NonNullable<PostCardProps['media']>,
-): media is readonly PostCardMedia[] {
-  return Array.isArray(media);
-}
-
-function normalizeMedia(media: PostCardProps['media']): readonly PostCardMedia[] {
-  if (!media) {
-    return [];
-  }
-
-  if (isPostCardMediaList(media)) {
-    return media;
-  }
-
-  return [media];
-}
-
-function PostCardAuthor({ author, compact = false }: { author: PostAuthor; compact?: boolean }) {
-  const avatarName = resolveAuthorName(author);
-  const { avatar } = author;
-
-  return (
-    <Inline align="center" gap="s" wrap="nowrap">
-      <Avatar
-        initials={avatar?.initials}
-        label={avatar?.label ?? avatarName}
-        name={avatarName}
-        shape={avatar?.shape}
-        size={avatar?.size ?? (compact ? 's' : 'm')}
-        source={avatar?.source}
-        color={avatar?.color}
-      />
-      <Box flex={1}>
-        <Stack gap="xxs">
-          <Text variant="bodySmall" weight="semiBold">
-            {author.name}
-          </Text>
-          {author.subtitle ? (
-            <Text emphasis="muted" variant="caption">
-              {author.subtitle}
-            </Text>
-          ) : null}
-        </Stack>
-      </Box>
-    </Inline>
-  );
-}
-
-function PostCardMediaItem({ media }: { media: PostCardMedia }) {
-  const { theme } = useZoraTheme();
-  const aspectRatio = resolveMediaAspectRatio(media.aspectRatio);
-
-  if (!('source' in media)) {
-    return (
-      <Box radius="m" style={{ overflow: 'hidden' }}>
-        {media.children}
-      </Box>
-    );
-  }
-
-  return (
-    <Box bg={theme.semantics.neutral.surface} radius="m" style={{ overflow: 'hidden' }}>
-      <Box style={{ aspectRatio, width: '100%' }}>
-        <ReactNativeImage
-          accessibilityLabel={media.label}
-          source={media.source}
-          style={{ height: '100%', width: '100%' }}
-        />
-      </Box>
-    </Box>
-  );
-}
-
-function PostActionLabel({ action }: { action: PostAction }) {
-  if (!action.count) {
-    return <>{action.label}</>;
-  }
-
-  return (
-    <>
-      {action.label} {action.count}
-    </>
-  );
-}
-
-function PostCardActions({ actions }: { actions: readonly PostAction[] }) {
-  if (actions.length === 0) {
-    return null;
-  }
-
-  return (
-    <Inline align="center" gap="s" wrap="wrap">
-      {actions.map((action) => (
-        <Button
-          key={action.id}
-          disabled={action.disabled}
-          variant={action.selected ? 'soft' : 'ghost'}
-          leadingIcon={action.icon}
-          onPress={action.onPress}
-          size="s"
-          color={action.selected ? 'primary' : 'neutral'}
-        >
-          <PostActionLabel action={action} />
-        </Button>
-      ))}
-    </Inline>
-  );
-}
-
-function PostCommentPreviewItem({ comment }: { comment: PostCommentPreview }) {
-  return (
-    <Inline align="flex-start" gap="s" wrap="nowrap">
-      {comment.author ? <PostCardAuthor author={comment.author} compact /> : null}
-      <Box flex={1}>
-        <Stack gap="xxs">
-          <Text variant="bodySmall">{comment.text}</Text>
-          {comment.meta ? (
-            <Text emphasis="subtle" variant="caption">
-              {comment.meta}
-            </Text>
-          ) : null}
-          {comment.action ? <Box>{comment.action}</Box> : null}
-        </Stack>
-      </Box>
-    </Inline>
-  );
-}
-
-function PostCardComments({ comments }: { comments: readonly PostCommentPreview[] }) {
-  if (comments.length === 0) {
-    return null;
-  }
-
-  return (
-    <Stack gap="s">
-      {comments.map((comment) => (
-        <PostCommentPreviewItem key={comment.id} comment={comment} />
-      ))}
-    </Stack>
-  );
-}
-
-function PostCardInner({
-  themeId: _themeId,
-  mode: _mode,
-  interactionPolicy,
-  testID,
-  author,
-  text,
-  children,
-  media,
-  actions = [],
-  comments = [],
-  headerAction,
-  footer,
-  tone = 'default',
-  compact = false,
-  onPress,
-}: PostCardProps) {
-  const mediaItems = normalizeMedia(media);
-  const gap = compact ? 's' : 'm';
-  const isInteractive = Boolean(onPress) && !headerAction;
-  const hasBody = text != null || children != null || mediaItems.length > 0;
-  const hasEngagement = actions.length > 0 || comments.length > 0;
-
-  return (
-    <Card
-      compact={compact}
-      interactionPolicy={interactionPolicy}
-      onPress={isInteractive ? onPress : undefined}
-      testID={testID}
-      tone={tone}
-    >
-      <Stack gap={gap}>
-        <Inline align="center" gap="m" justify="space-between" wrap="nowrap">
-          <Box flex={1}>
-            <PostCardAuthor author={author} compact={compact} />
-          </Box>
-          {headerAction ? <Box>{headerAction}</Box> : null}
-        </Inline>
-
-        {hasBody ? (
-          <Stack gap={gap}>
-            {text ? <Text variant="body">{text}</Text> : null}
-            {children ? <Box>{children}</Box> : null}
-            {mediaItems.length > 0 ? (
-              <Stack gap="s">
-                {mediaItems.map((item, index) => (
-                  <PostCardMediaItem key={`${index}`} media={item} />
-                ))}
-              </Stack>
-            ) : null}
-          </Stack>
-        ) : null}
-
-        {hasEngagement ? <Divider /> : null}
-        <PostCardActions actions={actions} />
-        <PostCardComments comments={comments} />
-        {footer ? <Box pt="xs">{footer}</Box> : null}
-      </Stack>
-    </Card>
-  );
-}
-
-/***
- * Social-style post card pattern with author, content, media, and actions.
- *
- 
- */
-export const PostCard = withZoraThemeScope(PostCardInner);

package/src/patterns/post-card/index.ts

@@ -1,8 +0,0 @@
-export { PostCard } from './PostCard';
-export type {
-  PostAction,
-  PostAuthor,
-  PostAuthorAvatar,
-  PostCardMedia,
-  PostCardProps,
-} from './types';

package/src/patterns/post-card/types.ts

@@ -1,71 +0,0 @@
-import type { ButtonIconSpec } from '@ankhorage/surface';
-import type React from 'react';
-import type { ImageSourcePropType } from 'react-native';
-
-import type { AvatarShape, AvatarSize } from '../../components/avatar';
-import type { ZoraCardTone, ZoraColor } from '../../internal/recipes';
-import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
-
-export interface PostAuthorAvatar {
-  source?: ImageSourcePropType;
-  name?: string;
-  initials?: string;
-  label?: string;
-  size?: AvatarSize;
-  shape?: AvatarShape;
-  color?: ZoraColor;
-}
-
-export interface PostAuthor {
-  name: React.ReactNode;
-  subtitle?: React.ReactNode;
-  avatar?: PostAuthorAvatar;
-}
-
-interface PostCardSourceMedia {
-  source: ImageSourcePropType;
-  label: string;
-  aspectRatio?: number;
-  children?: never;
-}
-
-interface PostCardCustomMedia {
-  children: React.ReactNode;
-  label?: string;
-  aspectRatio?: number;
-  source?: never;
-}
-
-export type PostCardMedia = PostCardSourceMedia | PostCardCustomMedia;
-
-export interface PostAction {
-  id: string;
-  label: string;
-  icon?: ButtonIconSpec;
-  count?: React.ReactNode;
-  selected?: boolean;
-  disabled?: boolean;
-  onPress?: () => void;
-}
-
-export interface PostCommentPreview {
-  id: string;
-  author?: PostAuthor;
-  text: React.ReactNode;
-  meta?: React.ReactNode;
-  action?: React.ReactNode;
-}
-
-export interface PostCardProps extends ZoraBaseProps {
-  author: PostAuthor;
-  text?: React.ReactNode;
-  children?: React.ReactNode;
-  media?: PostCardMedia | readonly PostCardMedia[];
-  actions?: readonly PostAction[];
-  comments?: readonly PostCommentPreview[];
-  headerAction?: React.ReactNode;
-  footer?: React.ReactNode;
-  tone?: ZoraCardTone;
-  compact?: boolean;
-  onPress?: () => void;
-}

package/src/patterns/product-card/ProductCard.test.tsx

@@ -1,19 +0,0 @@
-import { describe, expect, test } from 'bun:test';
-
-import { ZORA_COMPONENT_META } from '../../metadata';
-
-describe('ProductCard', () => {
-  test('is registered as a public ZORA pattern', () => {
-    expect(ZORA_COMPONENT_META.ProductCard?.name).toBe('ProductCard');
-    expect(ZORA_COMPONENT_META.ProductCard?.category).toBe('pattern');
-    expect(ZORA_COMPONENT_META.ProductCard?.directManifestNode).toBe(true);
-    expect(ZORA_COMPONENT_META.ProductCard?.allowedChildren).toEqual([]);
-    expect(ZORA_COMPONENT_META.ProductCard?.requirements).toBeUndefined();
-  });
-
-  test('has correct event metadata', () => {
-    expect(ZORA_COMPONENT_META.ProductCard?.events?.press).toBeDefined();
-    expect(ZORA_COMPONENT_META.ProductCard?.events?.primaryAction).toBeDefined();
-    expect(ZORA_COMPONENT_META.ProductCard?.events?.secondaryAction).toBeDefined();
-  });
-});