@ankhorage/zora 1.5.1 → 2.1.0

package/dist/patterns/hero/types.d.ts

@@ -1,5 +1,5 @@
 import type React from 'react';
-import type { ZoraEmphasis, ZoraTone } from '../../internal/recipes';
+import type { ZoraButtonVariant, ZoraColor } from '../../internal/recipes';
 import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
 export type HeroAlign = 'start' | 'center';
 export type HeroLayout = 'stack' | 'split' | 'mediaFirst';
@@ -7,8 +7,8 @@ export type HeroTone = 'default' | 'subtle' | 'outline';
 export interface HeroAction {
     label: React.ReactNode;
     onPress: () => void;
-    tone?: ZoraTone;
-    emphasis?: ZoraEmphasis;
+    color?: ZoraColor;
+    variant?: ZoraButtonVariant;
     disabled?: boolean;
 }
 export interface HeroProps extends ZoraBaseProps {

package/dist/patterns/hero/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/patterns/hero/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AACrE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,QAAQ,CAAC;AAC3C,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,OAAO,GAAG,YAAY,CAAC;AAC1D,MAAM,MAAM,QAAQ,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;AAExD,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,SAAU,SAAQ,aAAa;IAC9C,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,aAAa,CAAC,EAAE,UAAU,CAAC;IAC3B,eAAe,CAAC,EAAE,UAAU,CAAC;IAC7B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/patterns/hero/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAC3E,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,QAAQ,CAAC;AAC3C,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,OAAO,GAAG,YAAY,CAAC;AAC1D,MAAM,MAAM,QAAQ,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;AAExD,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,SAAU,SAAQ,aAAa;IAC9C,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,aAAa,CAAC,EAAE,UAAU,CAAC;IAC3B,eAAe,CAAC,EAAE,UAAU,CAAC;IAC7B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB"}

package/dist/patterns/hero/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/patterns/hero/types.ts"],"names":[],"mappings":"","sourcesContent":["import type React from 'react';\n\nimport type { ZoraEmphasis, ZoraTone } from '../../internal/recipes';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport type HeroAlign = 'start' | 'center';\nexport type HeroLayout = 'stack' | 'split' | 'mediaFirst';\nexport type HeroTone = 'default' | 'subtle' | 'outline';\n\nexport interface HeroAction {\n  label: React.ReactNode;\n  onPress: () => void;\n  tone?: ZoraTone;\n  emphasis?: ZoraEmphasis;\n  disabled?: boolean;\n}\n\nexport interface HeroProps extends ZoraBaseProps {\n  title: React.ReactNode;\n  description?: React.ReactNode;\n  eyebrow?: React.ReactNode;\n  primaryAction?: HeroAction;\n  secondaryAction?: HeroAction;\n  media?: React.ReactNode;\n  footer?: React.ReactNode;\n  align?: HeroAlign;\n  layout?: HeroLayout;\n  tone?: HeroTone;\n  compact?: boolean;\n}\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/patterns/hero/types.ts"],"names":[],"mappings":"","sourcesContent":["import type React from 'react';\n\nimport type { ZoraButtonVariant, ZoraColor } from '../../internal/recipes';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport type HeroAlign = 'start' | 'center';\nexport type HeroLayout = 'stack' | 'split' | 'mediaFirst';\nexport type HeroTone = 'default' | 'subtle' | 'outline';\n\nexport interface HeroAction {\n  label: React.ReactNode;\n  onPress: () => void;\n  color?: ZoraColor;\n  variant?: ZoraButtonVariant;\n  disabled?: boolean;\n}\n\nexport interface HeroProps extends ZoraBaseProps {\n  title: React.ReactNode;\n  description?: React.ReactNode;\n  eyebrow?: React.ReactNode;\n  primaryAction?: HeroAction;\n  secondaryAction?: HeroAction;\n  media?: React.ReactNode;\n  footer?: React.ReactNode;\n  align?: HeroAlign;\n  layout?: HeroLayout;\n  tone?: HeroTone;\n  compact?: boolean;\n}\n"]}

package/dist/patterns/image-preview/ImagePreview.js

@@ -30,7 +30,7 @@ function ImagePreviewInner({ themeId: _themeId, mode: _mode, testID, asset, aspe
             <Text variant="label" weight="semiBold">
               {emptyTitle}
             </Text>
-            <Text tone="muted" variant="bodySmall">
+            <Text emphasis="muted" variant="bodySmall">
               {emptyDescription}
             </Text>
           </Stack>

package/dist/patterns/image-preview/ImagePreview.js.map

@@ -1 +1 @@
-{"version":3,"file":"ImagePreview.js","sourceRoot":"","sources":["../../../src/patterns/image-preview/ImagePreview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,oBAAoB,CAAC,KAAwC;IACpE,IAAI,CAAC,KAAK;QAAE,OAAO,IAAI,CAAC;IAExB,IAAI,KAAK,CAAC,IAAI,KAAK,KAAK,EAAE,CAAC;QACzB,OAAO,KAAK,CAAC,GAAG,CAAC;IACnB,CAAC;IAED,OAAO,KAAK,CAAC,SAAS,IAAI,IAAI,CAAC;AACjC,CAAC;AAED,SAAS,sBAAsB,CAAC,KAAyB;IACvD,IAAI,CAAC,KAAK,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,KAAK,IAAI,CAAC,EAAE,CAAC;QACpD,OAAO,CAAC,CAAC;IACX,CAAC;IAED,OAAO,KAAK,CAAC;AACf,CAAC;AAED,SAAS,iBAAiB,CAAC,EACzB,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,MAAM,EACN,KAAK,EACL,WAAW,EACX,GAAG,GAAG,OAAO,EACb,UAAU,GAAG,UAAU,EACvB,gBAAgB,GAAG,qCAAqC,GACtC;IAClB,MAAM,EAAE,KAAK,EAAE,GAAG,YAAY,EAAE,CAAC;IACjC,MAAM,aAAa,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC;IAClD,MAAM,mBAAmB,GAAG,sBAAsB,CAAC,WAAW,CAAC,CAAC;IAEhE,OAAO,CACL,CAAC,GAAG,CACF,EAAE,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,OAAO,CAAC,CACpC,WAAW,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,OAAO,CAAC,CAC7C,WAAW,CAAC,CAAC,CAAC,CAAC,CACf,MAAM,CAAC,GAAG,CACV,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,KAAK,CAAC,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAE9B;MAAA,CAAC,aAAa,CAAC,CAAC,CAAC,CACf,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,EAAE,WAAW,EAAE,mBAAmB,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,CAC9D;UAAA,CAAC,KAAK,CACJ,GAAG,CAAC,CAAC,KAAK,EAAE,GAAG,CAAC,CAChB,GAAG,CAAC,CAAC,GAAG,CAAC,CACT,MAAM,CAAC,CAAC,aAAa,CAAC,CACtB,KAAK,CAAC,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,EAE7C;QAAA,EAAE,GAAG,CAAC,CACP,CAAC,CAAC,CAAC,CACF,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CACR;UAAA,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CACb;YAAA,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,UAAU,CACrC;cAAA,CAAC,UAAU,CACb;YAAA,EAAE,IAAI,CACN;YAAA,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,WAAW,CACpC;cAAA,CAAC,gBAAgB,CACnB;YAAA,EAAE,IAAI,CACR;UAAA,EAAE,KAAK,CACT;QAAA,EAAE,GAAG,CAAC,CACP,CACH;IAAA,EAAE,GAAG,CAAC,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,YAAY,GAAG,kBAAkB,CAAC,iBAAiB,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Image } from '../../components/image';\nimport { Text } from '../../components/text';\nimport { Box, Stack } from '../../foundation';\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { ImagePreviewProps, ZoraImageAsset } from './types';\n\nfunction resolveRenderableUrl(asset: ZoraImageAsset | null | undefined): string | null {\n  if (!asset) return null;\n\n  if (asset.kind === 'url') {\n    return asset.url;\n  }\n\n  return asset.publicUrl ?? null;\n}\n\nfunction resolveSafeAspectRatio(value: number | undefined): number {\n  if (!value || !Number.isFinite(value) || value <= 0) {\n    return 1;\n  }\n\n  return value;\n}\n\nfunction ImagePreviewInner({\n  themeId: _themeId,\n  mode: _mode,\n  testID,\n  asset,\n  aspectRatio,\n  fit = 'cover',\n  emptyTitle = 'No image',\n  emptyDescription = 'Select an image to preview it here.',\n}: ImagePreviewProps) {\n  const { theme } = useZoraTheme();\n  const renderableUrl = resolveRenderableUrl(asset);\n  const resolvedAspectRatio = resolveSafeAspectRatio(aspectRatio);\n\n  return (\n    <Box\n      bg={theme.semantics.neutral.surface}\n      borderColor={theme.semantics.neutral.divider}\n      borderWidth={1}\n      radius=\"l\"\n      testID={testID}\n      style={{ overflow: 'hidden' }}\n    >\n      {renderableUrl ? (\n        <Box style={{ aspectRatio: resolvedAspectRatio, width: '100%' }}>\n          <Image\n            alt={asset?.alt}\n            fit={fit}\n            source={renderableUrl}\n            style={{ height: '100%', width: '100%' }}\n          />\n        </Box>\n      ) : (\n        <Box p=\"l\">\n          <Stack gap=\"xs\">\n            <Text variant=\"label\" weight=\"semiBold\">\n              {emptyTitle}\n            </Text>\n            <Text tone=\"muted\" variant=\"bodySmall\">\n              {emptyDescription}\n            </Text>\n          </Stack>\n        </Box>\n      )}\n    </Box>\n  );\n}\n\nexport const ImagePreview = withZoraThemeScope(ImagePreviewInner);\n"]}
+{"version":3,"file":"ImagePreview.js","sourceRoot":"","sources":["../../../src/patterns/image-preview/ImagePreview.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { Image } from '../../components/image';\nimport { Text } from '../../components/text';\nimport { Box, Stack } from '../../foundation';\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { ImagePreviewProps, ZoraImageAsset } from './types';\n\nfunction resolveRenderableUrl(asset: ZoraImageAsset | null | undefined): string | null {\n  if (!asset) return null;\n\n  if (asset.kind === 'url') {\n    return asset.url;\n  }\n\n  return asset.publicUrl ?? null;\n}\n\nfunction resolveSafeAspectRatio(value: number | undefined): number {\n  if (!value || !Number.isFinite(value) || value <= 0) {\n    return 1;\n  }\n\n  return value;\n}\n\nfunction ImagePreviewInner({\n  themeId: _themeId,\n  mode: _mode,\n  testID,\n  asset,\n  aspectRatio,\n  fit = 'cover',\n  emptyTitle = 'No image',\n  emptyDescription = 'Select an image to preview it here.',\n}: ImagePreviewProps) {\n  const { theme } = useZoraTheme();\n  const renderableUrl = resolveRenderableUrl(asset);\n  const resolvedAspectRatio = resolveSafeAspectRatio(aspectRatio);\n\n  return (\n    <Box\n      bg={theme.semantics.neutral.surface}\n      borderColor={theme.semantics.neutral.divider}\n      borderWidth={1}\n      radius=\"l\"\n      testID={testID}\n      style={{ overflow: 'hidden' }}\n    >\n      {renderableUrl ? (\n        <Box style={{ aspectRatio: resolvedAspectRatio, width: '100%' }}>\n          <Image\n            alt={asset?.alt}\n            fit={fit}\n            source={renderableUrl}\n            style={{ height: '100%', width: '100%' }}\n          />\n        </Box>\n      ) : (\n        <Box p=\"l\">\n          <Stack gap=\"xs\">\n            <Text variant=\"label\" weight=\"semiBold\">\n              {emptyTitle}\n            </Text>\n            <Text emphasis=\"muted\" variant=\"bodySmall\">\n              {emptyDescription}\n            </Text>\n          </Stack>\n        </Box>\n      )}\n    </Box>\n  );\n}\n\nexport const ImagePreview = withZoraThemeScope(ImagePreviewInner);\n"]}

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

@@ -154,16 +154,16 @@ function ImageUploadFieldInner({ themeId: _themeId, mode: _mode, testID, value,
           <ImagePreview aspectRatio={aspectRatio} asset={value} emptyDescription={actionsDisabled ? 'No image available.' : undefined}/>
 
           {acceptHint || maxSizeHint ? (<Stack gap="xs">
-              {acceptHint ? (<Text tone="muted" variant="caption">
+              {acceptHint ? (<Text emphasis="muted" variant="caption">
                   {acceptHint}
                 </Text>) : null}
-              {maxSizeHint ? (<Text tone="muted" variant="caption">
+              {maxSizeHint ? (<Text emphasis="muted" variant="caption">
                   {maxSizeHint}
                 </Text>) : null}
             </Stack>) : null}
 
           {uploading ? (<Stack gap="xs">
-              <Text tone="muted" variant="caption">
+              <Text emphasis="muted" variant="caption">
                 Uploading…
               </Text>
               {progress !== null ? <Progress max={1} value={progress}/> : null}
@@ -176,19 +176,19 @@ function ImageUploadFieldInner({ themeId: _themeId, mode: _mode, testID, value,
               {value ? 'Replace image' : 'Select image'}
             </Button>
 
-            {value ? (<Button disabled={actionsDisabled || uploading || removing} emphasis="outline" loading={removing} tone="danger" onPress={() => {
+            {value ? (<Button disabled={actionsDisabled || uploading || removing} variant="outline" loading={removing} color="danger" onPress={() => {
                 void handleRemove();
             }}>
                 Remove
               </Button>) : null}
 
-            {isRenderable ? (<Button disabled={false} emphasis="soft" tone="neutral" onPress={handlePreview}>
+            {isRenderable ? (<Button disabled={false} variant="soft" color="neutral" onPress={handlePreview}>
                 Preview
               </Button>) : null}
           </Stack>
 
           {!isRenderable && value?.kind === 'storage' && value.publicUrl === undefined ? (<Box>
-              <Text tone="muted" variant="caption">
+              <Text emphasis="muted" variant="caption">
                 This image is stored, but no preview URL is available yet.
               </Text>
             </Box>) : null}
@@ -199,7 +199,7 @@ function ImageUploadFieldInner({ themeId: _themeId, mode: _mode, testID, value,
           <Stack gap="m">
             <ImagePreview asset={value} aspectRatio={aspectRatio}/>
             <Stack direction="row" justify="flex-end">
-              <Button emphasis="soft" tone="neutral" onPress={closePreview}>
+              <Button variant="soft" color="neutral" onPress={closePreview}>
                 Close
               </Button>
             </Stack>

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

@@ -1 +1 @@
-{"version":3,"file":"ImageUploadField.js","sourceRoot":"","sources":["../../../src/patterns/image-upload-field/ImageUploadField.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { Button } from '../../components/button';\nimport { Modal } from '../../components/modal';\nimport { Progress } from '../../components/progress';\nimport { Text } from '../../components/text';\nimport { Box, Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { FormField } from '../form-field';\nimport { ImagePreview } from '../image-preview';\nimport type { ImageUploadFieldProps } from './types';\nimport {\n  createOptimisticAssetFromPicked,\n  formatAcceptHint,\n  formatMaxSizeHint,\n  resolveRenderableUrl,\n  validatePickedImage,\n} from './uploadFlow';\n\nfunction clampProgress(value: number | null): number | null {\n  if (value === null) return null;\n  if (!Number.isFinite(value)) return null;\n  return Math.max(0, Math.min(1, value));\n}\n\nfunction formatUnknownError(error: unknown): string {\n  if (error instanceof Error && error.message) return error.message;\n  if (typeof error === 'string' && error.trim().length > 0) return error;\n  return 'Something went wrong.';\n}\n\nfunction ImageUploadFieldInner({\n  themeId: _themeId,\n  mode: _mode,\n  testID,\n  value,\n  onChange,\n  label,\n  description,\n  helperText,\n  errorText,\n  required,\n  disabled = false,\n  readOnly = false,\n  accept,\n  maxSizeBytes,\n  validatePicked,\n  onPick,\n  onUpload,\n  onRemove,\n  aspectRatio = 1,\n  previewTitle = 'Image preview',\n  previewDescription,\n}: ImageUploadFieldProps) {\n  const [internalError, setInternalError] = React.useState<string | undefined>(undefined);\n  const [uploading, setUploading] = React.useState(false);\n  const [removing, setRemoving] = React.useState(false);\n  const [progress, setProgress] = React.useState<number | null>(null);\n  const [previewOpen, setPreviewOpen] = React.useState(false);\n  const isMountedRef = React.useRef(true);\n\n  React.useEffect(() => {\n    return () => {\n      isMountedRef.current = false;\n    };\n  }, []);\n\n  const renderableUrl = resolveRenderableUrl(value);\n  const isRenderable = renderableUrl !== null;\n  const actionsDisabled = disabled || readOnly;\n\n  const effectiveError = errorText ?? internalError;\n  const invalid = Boolean(effectiveError);\n\n  const acceptHint = formatAcceptHint(accept);\n  const maxSizeHint = formatMaxSizeHint(maxSizeBytes);\n\n  const setProgressSafe = React.useCallback((next: number | null) => {\n    if (!isMountedRef.current) return;\n    setProgress(clampProgress(next));\n  }, []);\n\n  const clearTransientState = React.useCallback(() => {\n    if (!isMountedRef.current) return;\n    setUploading(false);\n    setRemoving(false);\n    setProgress(null);\n  }, []);\n\n  const handleReplace = React.useCallback(async () => {\n    if (actionsDisabled || uploading || removing) return;\n\n    setInternalError(undefined);\n    let picked;\n    try {\n      picked = await onPick();\n    } catch (error) {\n      if (!isMountedRef.current) return;\n      setInternalError(formatUnknownError(error));\n      return;\n    }\n    if (!picked) return;\n\n    const validationError = validatePickedImage({\n      picked,\n      accept,\n      maxSizeBytes,\n      validatePicked,\n    });\n\n    if (validationError) {\n      setInternalError(validationError);\n      return;\n    }\n\n    if (!onUpload) {\n      onChange(createOptimisticAssetFromPicked(picked));\n      return;\n    }\n\n    const optimisticAsset = createOptimisticAssetFromPicked(picked);\n    onChange(optimisticAsset);\n    setUploading(true);\n    setProgressSafe(0);\n\n    try {\n      const uploaded = await onUpload(picked, { setProgress: setProgressSafe });\n      if (!isMountedRef.current) return;\n      onChange(uploaded);\n      setInternalError(undefined);\n      clearTransientState();\n    } catch (error) {\n      if (!isMountedRef.current) return;\n      setInternalError(formatUnknownError(error));\n      setUploading(false);\n      setProgress(null);\n    }\n  }, [\n    accept,\n    actionsDisabled,\n    clearTransientState,\n    maxSizeBytes,\n    onChange,\n    onPick,\n    onUpload,\n    removing,\n    setProgressSafe,\n    uploading,\n    validatePicked,\n  ]);\n\n  const handleRemove = React.useCallback(async () => {\n    if (actionsDisabled || uploading || removing) return;\n    if (!value) {\n      onChange(null);\n      return;\n    }\n\n    setInternalError(undefined);\n\n    if (!onRemove) {\n      onChange(null);\n      return;\n    }\n\n    setRemoving(true);\n    try {\n      await onRemove(value);\n      if (!isMountedRef.current) return;\n      onChange(null);\n      setRemoving(false);\n    } catch (error) {\n      if (!isMountedRef.current) return;\n      setInternalError(formatUnknownError(error));\n      setRemoving(false);\n    }\n  }, [actionsDisabled, onChange, onRemove, removing, uploading, value]);\n\n  const handlePreview = React.useCallback(() => {\n    if (!isRenderable) return;\n    setPreviewOpen(true);\n  }, [isRenderable]);\n\n  const closePreview = React.useCallback(() => setPreviewOpen(false), []);\n\n  return (\n    <>\n      <FormField\n        description={description}\n        disabled={disabled}\n        errorText={effectiveError}\n        helperText={helperText}\n        invalid={invalid}\n        label={label}\n        readOnly={readOnly}\n        required={required}\n        testID={testID}\n      >\n        <Stack gap=\"m\">\n          <ImagePreview\n            aspectRatio={aspectRatio}\n            asset={value}\n            emptyDescription={actionsDisabled ? 'No image available.' : undefined}\n          />\n\n          {acceptHint || maxSizeHint ? (\n            <Stack gap=\"xs\">\n              {acceptHint ? (\n                <Text tone=\"muted\" variant=\"caption\">\n                  {acceptHint}\n                </Text>\n              ) : null}\n              {maxSizeHint ? (\n                <Text tone=\"muted\" variant=\"caption\">\n                  {maxSizeHint}\n                </Text>\n              ) : null}\n            </Stack>\n          ) : null}\n\n          {uploading ? (\n            <Stack gap=\"xs\">\n              <Text tone=\"muted\" variant=\"caption\">\n                Uploading…\n              </Text>\n              {progress !== null ? <Progress max={1} value={progress} /> : null}\n            </Stack>\n          ) : null}\n\n          <Stack direction={{ base: 'column', md: 'row' }} gap=\"s\">\n            <Button\n              disabled={actionsDisabled || uploading || removing}\n              onPress={() => {\n                void handleReplace();\n              }}\n            >\n              {value ? 'Replace image' : 'Select image'}\n            </Button>\n\n            {value ? (\n              <Button\n                disabled={actionsDisabled || uploading || removing}\n                emphasis=\"outline\"\n                loading={removing}\n                tone=\"danger\"\n                onPress={() => {\n                  void handleRemove();\n                }}\n              >\n                Remove\n              </Button>\n            ) : null}\n\n            {isRenderable ? (\n              <Button disabled={false} emphasis=\"soft\" tone=\"neutral\" onPress={handlePreview}>\n                Preview\n              </Button>\n            ) : null}\n          </Stack>\n\n          {!isRenderable && value?.kind === 'storage' && value.publicUrl === undefined ? (\n            <Box>\n              <Text tone=\"muted\" variant=\"caption\">\n                This image is stored, but no preview URL is available yet.\n              </Text>\n            </Box>\n          ) : null}\n        </Stack>\n      </FormField>\n\n      {isRenderable ? (\n        <Modal\n          closeOnBackdrop\n          description={previewDescription}\n          title={previewTitle}\n          visible={previewOpen}\n          onDismiss={closePreview}\n        >\n          <Stack gap=\"m\">\n            <ImagePreview asset={value} aspectRatio={aspectRatio} />\n            <Stack direction=\"row\" justify=\"flex-end\">\n              <Button emphasis=\"soft\" tone=\"neutral\" onPress={closePreview}>\n                Close\n              </Button>\n            </Stack>\n          </Stack>\n        </Modal>\n      ) : null}\n    </>\n  );\n}\n\nexport const ImageUploadField = withZoraThemeScope(ImageUploadFieldInner);\n"]}
+{"version":3,"file":"ImageUploadField.js","sourceRoot":"","sources":["../../../src/patterns/image-upload-field/ImageUploadField.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { Button } from '../../components/button';\nimport { Modal } from '../../components/modal';\nimport { Progress } from '../../components/progress';\nimport { Text } from '../../components/text';\nimport { Box, Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { FormField } from '../form-field';\nimport { ImagePreview } from '../image-preview';\nimport type { ImageUploadFieldProps } from './types';\nimport {\n  createOptimisticAssetFromPicked,\n  formatAcceptHint,\n  formatMaxSizeHint,\n  resolveRenderableUrl,\n  validatePickedImage,\n} from './uploadFlow';\n\nfunction clampProgress(value: number | null): number | null {\n  if (value === null) return null;\n  if (!Number.isFinite(value)) return null;\n  return Math.max(0, Math.min(1, value));\n}\n\nfunction formatUnknownError(error: unknown): string {\n  if (error instanceof Error && error.message) return error.message;\n  if (typeof error === 'string' && error.trim().length > 0) return error;\n  return 'Something went wrong.';\n}\n\nfunction ImageUploadFieldInner({\n  themeId: _themeId,\n  mode: _mode,\n  testID,\n  value,\n  onChange,\n  label,\n  description,\n  helperText,\n  errorText,\n  required,\n  disabled = false,\n  readOnly = false,\n  accept,\n  maxSizeBytes,\n  validatePicked,\n  onPick,\n  onUpload,\n  onRemove,\n  aspectRatio = 1,\n  previewTitle = 'Image preview',\n  previewDescription,\n}: ImageUploadFieldProps) {\n  const [internalError, setInternalError] = React.useState<string | undefined>(undefined);\n  const [uploading, setUploading] = React.useState(false);\n  const [removing, setRemoving] = React.useState(false);\n  const [progress, setProgress] = React.useState<number | null>(null);\n  const [previewOpen, setPreviewOpen] = React.useState(false);\n  const isMountedRef = React.useRef(true);\n\n  React.useEffect(() => {\n    return () => {\n      isMountedRef.current = false;\n    };\n  }, []);\n\n  const renderableUrl = resolveRenderableUrl(value);\n  const isRenderable = renderableUrl !== null;\n  const actionsDisabled = disabled || readOnly;\n\n  const effectiveError = errorText ?? internalError;\n  const invalid = Boolean(effectiveError);\n\n  const acceptHint = formatAcceptHint(accept);\n  const maxSizeHint = formatMaxSizeHint(maxSizeBytes);\n\n  const setProgressSafe = React.useCallback((next: number | null) => {\n    if (!isMountedRef.current) return;\n    setProgress(clampProgress(next));\n  }, []);\n\n  const clearTransientState = React.useCallback(() => {\n    if (!isMountedRef.current) return;\n    setUploading(false);\n    setRemoving(false);\n    setProgress(null);\n  }, []);\n\n  const handleReplace = React.useCallback(async () => {\n    if (actionsDisabled || uploading || removing) return;\n\n    setInternalError(undefined);\n    let picked;\n    try {\n      picked = await onPick();\n    } catch (error) {\n      if (!isMountedRef.current) return;\n      setInternalError(formatUnknownError(error));\n      return;\n    }\n    if (!picked) return;\n\n    const validationError = validatePickedImage({\n      picked,\n      accept,\n      maxSizeBytes,\n      validatePicked,\n    });\n\n    if (validationError) {\n      setInternalError(validationError);\n      return;\n    }\n\n    if (!onUpload) {\n      onChange(createOptimisticAssetFromPicked(picked));\n      return;\n    }\n\n    const optimisticAsset = createOptimisticAssetFromPicked(picked);\n    onChange(optimisticAsset);\n    setUploading(true);\n    setProgressSafe(0);\n\n    try {\n      const uploaded = await onUpload(picked, { setProgress: setProgressSafe });\n      if (!isMountedRef.current) return;\n      onChange(uploaded);\n      setInternalError(undefined);\n      clearTransientState();\n    } catch (error) {\n      if (!isMountedRef.current) return;\n      setInternalError(formatUnknownError(error));\n      setUploading(false);\n      setProgress(null);\n    }\n  }, [\n    accept,\n    actionsDisabled,\n    clearTransientState,\n    maxSizeBytes,\n    onChange,\n    onPick,\n    onUpload,\n    removing,\n    setProgressSafe,\n    uploading,\n    validatePicked,\n  ]);\n\n  const handleRemove = React.useCallback(async () => {\n    if (actionsDisabled || uploading || removing) return;\n    if (!value) {\n      onChange(null);\n      return;\n    }\n\n    setInternalError(undefined);\n\n    if (!onRemove) {\n      onChange(null);\n      return;\n    }\n\n    setRemoving(true);\n    try {\n      await onRemove(value);\n      if (!isMountedRef.current) return;\n      onChange(null);\n      setRemoving(false);\n    } catch (error) {\n      if (!isMountedRef.current) return;\n      setInternalError(formatUnknownError(error));\n      setRemoving(false);\n    }\n  }, [actionsDisabled, onChange, onRemove, removing, uploading, value]);\n\n  const handlePreview = React.useCallback(() => {\n    if (!isRenderable) return;\n    setPreviewOpen(true);\n  }, [isRenderable]);\n\n  const closePreview = React.useCallback(() => setPreviewOpen(false), []);\n\n  return (\n    <>\n      <FormField\n        description={description}\n        disabled={disabled}\n        errorText={effectiveError}\n        helperText={helperText}\n        invalid={invalid}\n        label={label}\n        readOnly={readOnly}\n        required={required}\n        testID={testID}\n      >\n        <Stack gap=\"m\">\n          <ImagePreview\n            aspectRatio={aspectRatio}\n            asset={value}\n            emptyDescription={actionsDisabled ? 'No image available.' : undefined}\n          />\n\n          {acceptHint || maxSizeHint ? (\n            <Stack gap=\"xs\">\n              {acceptHint ? (\n                <Text emphasis=\"muted\" variant=\"caption\">\n                  {acceptHint}\n                </Text>\n              ) : null}\n              {maxSizeHint ? (\n                <Text emphasis=\"muted\" variant=\"caption\">\n                  {maxSizeHint}\n                </Text>\n              ) : null}\n            </Stack>\n          ) : null}\n\n          {uploading ? (\n            <Stack gap=\"xs\">\n              <Text emphasis=\"muted\" variant=\"caption\">\n                Uploading…\n              </Text>\n              {progress !== null ? <Progress max={1} value={progress} /> : null}\n            </Stack>\n          ) : null}\n\n          <Stack direction={{ base: 'column', md: 'row' }} gap=\"s\">\n            <Button\n              disabled={actionsDisabled || uploading || removing}\n              onPress={() => {\n                void handleReplace();\n              }}\n            >\n              {value ? 'Replace image' : 'Select image'}\n            </Button>\n\n            {value ? (\n              <Button\n                disabled={actionsDisabled || uploading || removing}\n                variant=\"outline\"\n                loading={removing}\n                color=\"danger\"\n                onPress={() => {\n                  void handleRemove();\n                }}\n              >\n                Remove\n              </Button>\n            ) : null}\n\n            {isRenderable ? (\n              <Button disabled={false} variant=\"soft\" color=\"neutral\" onPress={handlePreview}>\n                Preview\n              </Button>\n            ) : null}\n          </Stack>\n\n          {!isRenderable && value?.kind === 'storage' && value.publicUrl === undefined ? (\n            <Box>\n              <Text emphasis=\"muted\" variant=\"caption\">\n                This image is stored, but no preview URL is available yet.\n              </Text>\n            </Box>\n          ) : null}\n        </Stack>\n      </FormField>\n\n      {isRenderable ? (\n        <Modal\n          closeOnBackdrop\n          description={previewDescription}\n          title={previewTitle}\n          visible={previewOpen}\n          onDismiss={closePreview}\n        >\n          <Stack gap=\"m\">\n            <ImagePreview asset={value} aspectRatio={aspectRatio} />\n            <Stack direction=\"row\" justify=\"flex-end\">\n              <Button variant=\"soft\" color=\"neutral\" onPress={closePreview}>\n                Close\n              </Button>\n            </Stack>\n          </Stack>\n        </Modal>\n      ) : null}\n    </>\n  );\n}\n\nexport const ImageUploadField = withZoraThemeScope(ImageUploadFieldInner);\n"]}

package/dist/patterns/list/ListRow.js

@@ -54,10 +54,10 @@ function ListRowInner({ themeId: _themeId, mode: _mode, testID, title, descripti
           <Text variant="body" weight={selected ? 'semiBold' : 'medium'}>
             {title}
           </Text>
-          {description ? (<Text tone="muted" variant="bodySmall">
+          {description ? (<Text emphasis="muted" variant="bodySmall">
               {description}
             </Text>) : null}
-          {meta ? (<Text tone="subtle" variant="caption">
+          {meta ? (<Text emphasis="subtle" variant="caption">
               {meta}
             </Text>) : null}
         </Stack>

package/dist/patterns/list/ListRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListRow.js","sourceRoot":"","sources":["../../../src/patterns/list/ListRow.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ButtonBase } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { Text } from '../../components/text';\nimport { Box, Inline, Spacer, Stack } from '../../foundation';\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { ListRowProps, ListRowVariant } from './types';\n\nfunction resolvePadding(compact: boolean) {\n  return compact ? { px: 'm' as const, py: 's' as const } : { px: 'm' as const, py: 'm' as const };\n}\n\nfunction resolveContainerStyles({\n  variant,\n  theme,\n  selected,\n  pressed,\n  hovered,\n  disabled,\n}: {\n  variant: ListRowVariant;\n  theme: ReturnType<typeof useZoraTheme>['theme'];\n  selected: boolean;\n  pressed: boolean;\n  hovered: boolean;\n  disabled: boolean;\n}) {\n  const borderColor = selected ? theme.semantics.border.focus : theme.semantics.border.default;\n  const dividerBorderColor = selected ? theme.semantics.border.focus : 'transparent';\n\n  if (variant === 'card') {\n    return {\n      bg: pressed\n        ? theme.semantics.neutral.surfaceActive\n        : hovered\n          ? theme.semantics.neutral.surfaceHover\n          : theme.semantics.surface.raised,\n      borderColor,\n      borderWidth: 1,\n      radius: 'l' as const,\n      opacity: disabled ? 0.72 : 1,\n    };\n  }\n\n  return {\n    bg: pressed\n      ? theme.semantics.neutral.surfaceActive\n      : hovered\n        ? theme.semantics.neutral.surfaceHover\n        : selected\n          ? theme.semantics.neutral.surface\n          : 'transparent',\n    borderColor: dividerBorderColor,\n    borderWidth: selected ? 1 : 0,\n    radius: 'm' as const,\n    opacity: disabled ? 0.72 : 1,\n  };\n}\n\nfunction ListRowInner({\n  themeId: _themeId,\n  mode: _mode,\n  testID,\n  title,\n  description,\n  meta,\n  leading,\n  trailing,\n  action,\n  onPress,\n  selected = false,\n  disabled = false,\n  compact = false,\n  variant = 'divider',\n}: ListRowProps) {\n  const { theme } = useZoraTheme();\n  const padding = resolvePadding(compact);\n  const isInteractive = Boolean(onPress) && !action;\n\n  const content = (\n    <Stack\n      align=\"center\"\n      direction=\"row\"\n      style={{\n        flex: 1,\n      }}\n    >\n      {leading ? (\n        <>\n          <Box>{leading}</Box>\n          <Spacer axis=\"horizontal\" size=\"m\" />\n        </>\n      ) : null}\n\n      <Box flex={1}>\n        <Stack gap=\"xxs\">\n          <Text variant=\"body\" weight={selected ? 'semiBold' : 'medium'}>\n            {title}\n          </Text>\n          {description ? (\n            <Text tone=\"muted\" variant=\"bodySmall\">\n              {description}\n            </Text>\n          ) : null}\n          {meta ? (\n            <Text tone=\"subtle\" variant=\"caption\">\n              {meta}\n            </Text>\n          ) : null}\n        </Stack>\n      </Box>\n\n      {trailing || action ? (\n        <>\n          <Spacer axis=\"horizontal\" size=\"m\" />\n          <Inline align=\"center\" gap=\"s\" wrap=\"nowrap\">\n            {trailing}\n            {action}\n          </Inline>\n        </>\n      ) : null}\n    </Stack>\n  );\n\n  if (!isInteractive) {\n    const styles = resolveContainerStyles({\n      variant,\n      theme,\n      selected,\n      pressed: false,\n      hovered: false,\n      disabled,\n    });\n\n    return (\n      <Box\n        bg={styles.bg}\n        borderColor={styles.borderColor}\n        borderWidth={styles.borderWidth}\n        px={padding.px}\n        py={padding.py}\n        radius={styles.radius}\n        testID={testID}\n        style={{\n          opacity: styles.opacity,\n        }}\n      >\n        {content}\n      </Box>\n    );\n  }\n\n  return (\n    <ButtonBase\n      accessibilityRole=\"button\"\n      accessibilityState={{ disabled, selected }}\n      disabled={disabled}\n      onPress={onPress}\n      radius={variant === 'card' ? 'l' : 'm'}\n      testID={testID}\n    >\n      {(state) => {\n        const styles = resolveContainerStyles({\n          variant,\n          theme,\n          selected,\n          pressed: state.pressed,\n          hovered: state.hovered,\n          disabled: state.disabled,\n        });\n\n        return (\n          <Box\n            bg={styles.bg}\n            borderColor={styles.borderColor}\n            borderWidth={styles.borderWidth}\n            px={padding.px}\n            py={padding.py}\n            radius={styles.radius}\n            style={{\n              opacity: styles.opacity,\n            }}\n          >\n            {content}\n          </Box>\n        );\n      }}\n    </ButtonBase>\n  );\n}\n\nexport const ListRow = withZoraThemeScope(ListRowInner);\n"]}
+{"version":3,"file":"ListRow.js","sourceRoot":"","sources":["../../../src/patterns/list/ListRow.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ButtonBase } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { Text } from '../../components/text';\nimport { Box, Inline, Spacer, Stack } from '../../foundation';\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { ListRowProps, ListRowVariant } from './types';\n\nfunction resolvePadding(compact: boolean) {\n  return compact ? { px: 'm' as const, py: 's' as const } : { px: 'm' as const, py: 'm' as const };\n}\n\nfunction resolveContainerStyles({\n  variant,\n  theme,\n  selected,\n  pressed,\n  hovered,\n  disabled,\n}: {\n  variant: ListRowVariant;\n  theme: ReturnType<typeof useZoraTheme>['theme'];\n  selected: boolean;\n  pressed: boolean;\n  hovered: boolean;\n  disabled: boolean;\n}) {\n  const borderColor = selected ? theme.semantics.border.focus : theme.semantics.border.default;\n  const dividerBorderColor = selected ? theme.semantics.border.focus : 'transparent';\n\n  if (variant === 'card') {\n    return {\n      bg: pressed\n        ? theme.semantics.neutral.surfaceActive\n        : hovered\n          ? theme.semantics.neutral.surfaceHover\n          : theme.semantics.surface.raised,\n      borderColor,\n      borderWidth: 1,\n      radius: 'l' as const,\n      opacity: disabled ? 0.72 : 1,\n    };\n  }\n\n  return {\n    bg: pressed\n      ? theme.semantics.neutral.surfaceActive\n      : hovered\n        ? theme.semantics.neutral.surfaceHover\n        : selected\n          ? theme.semantics.neutral.surface\n          : 'transparent',\n    borderColor: dividerBorderColor,\n    borderWidth: selected ? 1 : 0,\n    radius: 'm' as const,\n    opacity: disabled ? 0.72 : 1,\n  };\n}\n\nfunction ListRowInner({\n  themeId: _themeId,\n  mode: _mode,\n  testID,\n  title,\n  description,\n  meta,\n  leading,\n  trailing,\n  action,\n  onPress,\n  selected = false,\n  disabled = false,\n  compact = false,\n  variant = 'divider',\n}: ListRowProps) {\n  const { theme } = useZoraTheme();\n  const padding = resolvePadding(compact);\n  const isInteractive = Boolean(onPress) && !action;\n\n  const content = (\n    <Stack\n      align=\"center\"\n      direction=\"row\"\n      style={{\n        flex: 1,\n      }}\n    >\n      {leading ? (\n        <>\n          <Box>{leading}</Box>\n          <Spacer axis=\"horizontal\" size=\"m\" />\n        </>\n      ) : null}\n\n      <Box flex={1}>\n        <Stack gap=\"xxs\">\n          <Text variant=\"body\" weight={selected ? 'semiBold' : 'medium'}>\n            {title}\n          </Text>\n          {description ? (\n            <Text emphasis=\"muted\" variant=\"bodySmall\">\n              {description}\n            </Text>\n          ) : null}\n          {meta ? (\n            <Text emphasis=\"subtle\" variant=\"caption\">\n              {meta}\n            </Text>\n          ) : null}\n        </Stack>\n      </Box>\n\n      {trailing || action ? (\n        <>\n          <Spacer axis=\"horizontal\" size=\"m\" />\n          <Inline align=\"center\" gap=\"s\" wrap=\"nowrap\">\n            {trailing}\n            {action}\n          </Inline>\n        </>\n      ) : null}\n    </Stack>\n  );\n\n  if (!isInteractive) {\n    const styles = resolveContainerStyles({\n      variant,\n      theme,\n      selected,\n      pressed: false,\n      hovered: false,\n      disabled,\n    });\n\n    return (\n      <Box\n        bg={styles.bg}\n        borderColor={styles.borderColor}\n        borderWidth={styles.borderWidth}\n        px={padding.px}\n        py={padding.py}\n        radius={styles.radius}\n        testID={testID}\n        style={{\n          opacity: styles.opacity,\n        }}\n      >\n        {content}\n      </Box>\n    );\n  }\n\n  return (\n    <ButtonBase\n      accessibilityRole=\"button\"\n      accessibilityState={{ disabled, selected }}\n      disabled={disabled}\n      onPress={onPress}\n      radius={variant === 'card' ? 'l' : 'm'}\n      testID={testID}\n    >\n      {(state) => {\n        const styles = resolveContainerStyles({\n          variant,\n          theme,\n          selected,\n          pressed: state.pressed,\n          hovered: state.hovered,\n          disabled: state.disabled,\n        });\n\n        return (\n          <Box\n            bg={styles.bg}\n            borderColor={styles.borderColor}\n            borderWidth={styles.borderWidth}\n            px={padding.px}\n            py={padding.py}\n            radius={styles.radius}\n            style={{\n              opacity: styles.opacity,\n            }}\n          >\n            {content}\n          </Box>\n        );\n      }}\n    </ButtonBase>\n  );\n}\n\nexport const ListRow = withZoraThemeScope(ListRowInner);\n"]}

package/dist/patterns/list/meta.d.ts

@@ -12,6 +12,22 @@ export declare const listRowMeta: {
     readonly directManifestNode: false;
     readonly allowedChildren: readonly [];
     readonly note: "List pattern component; not represented as a manifest node in v1.";
+    readonly events: {
+        readonly itemPress: {
+            readonly label: "Item press";
+            readonly eventType: "collection.itemPress";
+            readonly description: "Emitted when a collection item row is selected.";
+            readonly payloadFields: readonly [{
+                readonly path: "payload.itemId";
+                readonly type: "string";
+                readonly label: "Item ID";
+            }, {
+                readonly path: "payload.item";
+                readonly type: "record";
+                readonly label: "Item";
+            }];
+        };
+    };
     readonly props: {};
 };
 export declare const listSectionMeta: {

package/dist/patterns/list/meta.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"meta.d.ts","sourceRoot":"","sources":["../../../src/patterns/list/meta.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,QAAQ;;;;;;;CAOiB,CAAC;AAEvC,eAAO,MAAM,WAAW;;;;;;;CAOc,CAAC;AAEvC,eAAO,MAAM,eAAe;;;;;;;CAOU,CAAC"}
+{"version":3,"file":"meta.d.ts","sourceRoot":"","sources":["../../../src/patterns/list/meta.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,QAAQ;;;;;;;CAOiB,CAAC;AAEvC,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;CA0Bc,CAAC;AAEvC,eAAO,MAAM,eAAe;;;;;;;CAOU,CAAC"}

package/dist/patterns/list/meta.js

@@ -13,6 +13,25 @@ export const listRowMeta = {
     directManifestNode: false,
     allowedChildren: [],
     note: LIST_NOTE,
+    events: {
+        itemPress: {
+            label: 'Item press',
+            eventType: 'collection.itemPress',
+            description: 'Emitted when a collection item row is selected.',
+            payloadFields: [
+                {
+                    path: 'payload.itemId',
+                    type: 'string',
+                    label: 'Item ID',
+                },
+                {
+                    path: 'payload.item',
+                    type: 'record',
+                    label: 'Item',
+                },
+            ],
+        },
+    },
     props: {},
 };
 export const listSectionMeta = {

package/dist/patterns/list/meta.js.map

@@ -1 +1 @@
-{"version":3,"file":"meta.js","sourceRoot":"","sources":["../../../src/patterns/list/meta.ts"],"names":[],"mappings":"AAEA,MAAM,SAAS,GAAG,mEAAmE,CAAC;AAEtF,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB,IAAI,EAAE,MAAM;IACZ,QAAQ,EAAE,SAAS;IACnB,kBAAkB,EAAE,KAAK;IACzB,eAAe,EAAE,EAAE;IACnB,IAAI,EAAE,SAAS;IACf,KAAK,EAAE,EAAE;CAC2B,CAAC;AAEvC,MAAM,CAAC,MAAM,WAAW,GAAG;IACzB,IAAI,EAAE,SAAS;IACf,QAAQ,EAAE,SAAS;IACnB,kBAAkB,EAAE,KAAK;IACzB,eAAe,EAAE,EAAE;IACnB,IAAI,EAAE,SAAS;IACf,KAAK,EAAE,EAAE;CAC2B,CAAC;AAEvC,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,IAAI,EAAE,aAAa;IACnB,QAAQ,EAAE,SAAS;IACnB,kBAAkB,EAAE,KAAK;IACzB,eAAe,EAAE,EAAE;IACnB,IAAI,EAAE,SAAS;IACf,KAAK,EAAE,EAAE;CAC2B,CAAC","sourcesContent":["import type { ZoraComponentMeta } from '../../metadata';\n\nconst LIST_NOTE = 'List pattern component; not represented as a manifest node in v1.';\n\nexport const listMeta = {\n  name: 'List',\n  category: 'pattern',\n  directManifestNode: false,\n  allowedChildren: [],\n  note: LIST_NOTE,\n  props: {},\n} as const satisfies ZoraComponentMeta;\n\nexport const listRowMeta = {\n  name: 'ListRow',\n  category: 'pattern',\n  directManifestNode: false,\n  allowedChildren: [],\n  note: LIST_NOTE,\n  props: {},\n} as const satisfies ZoraComponentMeta;\n\nexport const listSectionMeta = {\n  name: 'ListSection',\n  category: 'pattern',\n  directManifestNode: false,\n  allowedChildren: [],\n  note: LIST_NOTE,\n  props: {},\n} as const satisfies ZoraComponentMeta;\n"]}
+{"version":3,"file":"meta.js","sourceRoot":"","sources":["../../../src/patterns/list/meta.ts"],"names":[],"mappings":"AAEA,MAAM,SAAS,GAAG,mEAAmE,CAAC;AAEtF,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB,IAAI,EAAE,MAAM;IACZ,QAAQ,EAAE,SAAS;IACnB,kBAAkB,EAAE,KAAK;IACzB,eAAe,EAAE,EAAE;IACnB,IAAI,EAAE,SAAS;IACf,KAAK,EAAE,EAAE;CAC2B,CAAC;AAEvC,MAAM,CAAC,MAAM,WAAW,GAAG;IACzB,IAAI,EAAE,SAAS;IACf,QAAQ,EAAE,SAAS;IACnB,kBAAkB,EAAE,KAAK;IACzB,eAAe,EAAE,EAAE;IACnB,IAAI,EAAE,SAAS;IACf,MAAM,EAAE;QACN,SAAS,EAAE;YACT,KAAK,EAAE,YAAY;YACnB,SAAS,EAAE,sBAAsB;YACjC,WAAW,EAAE,iDAAiD;YAC9D,aAAa,EAAE;gBACb;oBACE,IAAI,EAAE,gBAAgB;oBACtB,IAAI,EAAE,QAAQ;oBACd,KAAK,EAAE,SAAS;iBACjB;gBACD;oBACE,IAAI,EAAE,cAAc;oBACpB,IAAI,EAAE,QAAQ;oBACd,KAAK,EAAE,MAAM;iBACd;aACF;SACF;KACF;IACD,KAAK,EAAE,EAAE;CAC2B,CAAC;AAEvC,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,IAAI,EAAE,aAAa;IACnB,QAAQ,EAAE,SAAS;IACnB,kBAAkB,EAAE,KAAK;IACzB,eAAe,EAAE,EAAE;IACnB,IAAI,EAAE,SAAS;IACf,KAAK,EAAE,EAAE;CAC2B,CAAC","sourcesContent":["import type { ZoraComponentMeta } from '../../metadata';\n\nconst LIST_NOTE = 'List pattern component; not represented as a manifest node in v1.';\n\nexport const listMeta = {\n  name: 'List',\n  category: 'pattern',\n  directManifestNode: false,\n  allowedChildren: [],\n  note: LIST_NOTE,\n  props: {},\n} as const satisfies ZoraComponentMeta;\n\nexport const listRowMeta = {\n  name: 'ListRow',\n  category: 'pattern',\n  directManifestNode: false,\n  allowedChildren: [],\n  note: LIST_NOTE,\n  events: {\n    itemPress: {\n      label: 'Item press',\n      eventType: 'collection.itemPress',\n      description: 'Emitted when a collection item row is selected.',\n      payloadFields: [\n        {\n          path: 'payload.itemId',\n          type: 'string',\n          label: 'Item ID',\n        },\n        {\n          path: 'payload.item',\n          type: 'record',\n          label: 'Item',\n        },\n      ],\n    },\n  },\n  props: {},\n} as const satisfies ZoraComponentMeta;\n\nexport const listSectionMeta = {\n  name: 'ListSection',\n  category: 'pattern',\n  directManifestNode: false,\n  allowedChildren: [],\n  note: LIST_NOTE,\n  props: {},\n} as const satisfies ZoraComponentMeta;\n"]}

package/dist/patterns/message-bubble/MessageBubble.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MessageBubble.d.ts","sourceRoot":"","sources":["../../../src/patterns/message-bubble/MessageBubble.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,KAAK,EAGV,kBAAkB,EAEnB,MAAM,SAAS,CAAC;AAuPjB,eAAO,MAAM,aAAa,0DAAyC,CAAC"}
+{"version":3,"file":"MessageBubble.d.ts","sourceRoot":"","sources":["../../../src/patterns/message-bubble/MessageBubble.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,KAAK,EAGV,kBAAkB,EAEnB,MAAM,SAAS,CAAC;AA2PjB,eAAO,MAAM,aAAa,0DAAyC,CAAC"}

package/dist/patterns/message-bubble/MessageBubble.js

@@ -66,7 +66,7 @@ function resolveBubbleStyles({ direction, disabled, hovered, pressed, selected,
 }
 function MessageAvatar({ avatar, authorName, compact, }) {
     const avatarName = resolveAvatarName({ avatar, authorName });
-    return (<Avatar initials={avatar.initials} label={avatar.label ?? avatarName} name={avatarName} shape={avatar.shape} size={avatar.size ?? (compact ? 'xs' : 's')} source={avatar.source} tone={avatar.tone}/>);
+    return (<Avatar initials={avatar.initials} label={avatar.label ?? avatarName} name={avatarName} shape={avatar.shape} size={avatar.size ?? (compact ? 'xs' : 's')} source={avatar.source} color={avatar.color}/>);
 }
 function MessageBubbleInner({ themeId: _themeId, mode: _mode, testID, direction = 'incoming', text, children, author, timestamp, meta, status, leading, trailing, footer, selected = false, disabled = false, compact = false, accessibilityLabel, onPress, }) {
     const { theme } = useZoraTheme();
@@ -84,21 +84,21 @@ function MessageBubbleInner({ themeId: _themeId, mode: _mode, testID, direction
         const styles = resolveBubbleStyles({ direction, disabled, hovered, pressed, selected, theme });
         return (<Box bg={styles.bg} borderColor={styles.borderColor} borderWidth={styles.borderWidth} px={padding.px} py={padding.py} radius={isSystem ? 'm' : 'l'} style={{ maxWidth: compact ? 420 : 560, opacity: styles.opacity }}>
         <Stack align={isSystem ? 'center' : 'flex-start'} gap={compact ? 'xxs' : 'xs'}>
-          {hasAuthorName ? (<Text tone="muted" variant="caption" weight="semiBold">
+          {hasAuthorName ? (<Text emphasis="muted" variant="caption" weight="semiBold">
               {authorName}
             </Text>) : null}
-          {text != null ? (<Text align={isSystem ? 'center' : undefined} tone={disabled ? 'muted' : 'default'}>
+          {text != null ? (<Text align={isSystem ? 'center' : undefined} emphasis={disabled ? 'muted' : 'default'}>
               {text}
             </Text>) : null}
           {children != null ? <Box width="100%">{children}</Box> : null}
           {hasMetaRow ? (<Inline align="center" gap="xs" justify={isOutgoing ? 'flex-end' : isSystem ? 'center' : 'flex-start'} wrap="wrap">
-              {timestamp != null ? (<Text tone="subtle" variant="caption">
+              {timestamp != null ? (<Text emphasis="subtle" variant="caption">
                   {timestamp}
                 </Text>) : null}
-              {meta != null ? (<Text tone="subtle" variant="caption">
+              {meta != null ? (<Text emphasis="subtle" variant="caption">
                   {meta}
                 </Text>) : null}
-              {renderedStatus != null ? (<Text tone={status === 'failed' ? 'danger' : 'subtle'} variant="caption">
+              {renderedStatus != null ? (<Text color={status === 'failed' ? 'danger' : undefined} emphasis={status === 'failed' ? 'default' : 'subtle'} variant="caption">
                   {renderedStatus}
                 </Text>) : null}
             </Inline>) : null}

package/dist/patterns/message-bubble/MessageBubble.js.map

@@ -1 +1 @@
-{"version":3,"file":"MessageBubble.js","sourceRoot":"","sources":["../../../src/patterns/message-bubble/MessageBubble.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ButtonBase } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { Avatar } from '../../components/avatar';\nimport { Text } from '../../components/text';\nimport { Box, Inline, Stack } from '../../foundation';\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type {\n  MessageBubbleAvatar,\n  MessageBubbleDirection,\n  MessageBubbleProps,\n  MessageBubbleStatus,\n} from './types';\n\nfunction resolveAvatarName({\n  avatar,\n  authorName,\n}: {\n  avatar: MessageBubbleAvatar | undefined;\n  authorName: React.ReactNode | undefined;\n}): string | undefined {\n  if (avatar?.name) return avatar.name;\n  return typeof authorName === 'string' ? authorName : undefined;\n}\n\nfunction resolvePadding(compact: boolean) {\n  return compact ? { px: 'm' as const, py: 's' as const } : { px: 'm' as const, py: 'm' as const };\n}\n\nfunction resolveStatusLabel(status: MessageBubbleStatus): string {\n  switch (status) {\n    case 'sending':\n      return 'Sending';\n    case 'sent':\n      return 'Sent';\n    case 'delivered':\n      return 'Delivered';\n    case 'read':\n      return 'Read';\n    case 'failed':\n      return 'Failed';\n    default:\n      return status;\n  }\n}\n\nfunction isMessageBubbleStatus(\n  status: MessageBubbleProps['status'],\n): status is MessageBubbleStatus {\n  return (\n    status === 'sending' ||\n    status === 'sent' ||\n    status === 'delivered' ||\n    status === 'read' ||\n    status === 'failed'\n  );\n}\n\nfunction resolveStatus(status: MessageBubbleProps['status']) {\n  if (status == null) return null;\n  return isMessageBubbleStatus(status) ? resolveStatusLabel(status) : status;\n}\n\nfunction resolveBubbleStyles({\n  direction,\n  disabled,\n  hovered,\n  pressed,\n  selected,\n  theme,\n}: {\n  direction: MessageBubbleDirection;\n  disabled: boolean;\n  hovered: boolean;\n  pressed: boolean;\n  selected: boolean;\n  theme: ReturnType<typeof useZoraTheme>['theme'];\n}) {\n  const borderColor = selected ? theme.semantics.border.focus : theme.semantics.border.default;\n\n  if (direction === 'system') {\n    return {\n      bg: selected ? theme.semantics.neutral.surface : 'transparent',\n      borderColor,\n      borderWidth: selected ? 1 : 0,\n      opacity: disabled ? 0.72 : 1,\n    };\n  }\n\n  const interactiveBg = pressed\n    ? theme.semantics.neutral.surfaceActive\n    : hovered\n      ? theme.semantics.neutral.surfaceHover\n      : undefined;\n\n  return {\n    bg:\n      interactiveBg ??\n      (direction === 'outgoing' ? theme.semantics.neutral.surface : theme.semantics.surface.raised),\n    borderColor,\n    borderWidth: selected ? 1 : 0,\n    opacity: disabled ? 0.72 : 1,\n  };\n}\n\nfunction MessageAvatar({\n  avatar,\n  authorName,\n  compact,\n}: {\n  avatar: MessageBubbleAvatar;\n  authorName: React.ReactNode | undefined;\n  compact: boolean;\n}) {\n  const avatarName = resolveAvatarName({ avatar, authorName });\n\n  return (\n    <Avatar\n      initials={avatar.initials}\n      label={avatar.label ?? avatarName}\n      name={avatarName}\n      shape={avatar.shape}\n      size={avatar.size ?? (compact ? 'xs' : 's')}\n      source={avatar.source}\n      tone={avatar.tone}\n    />\n  );\n}\n\nfunction MessageBubbleInner({\n  themeId: _themeId,\n  mode: _mode,\n  testID,\n  direction = 'incoming',\n  text,\n  children,\n  author,\n  timestamp,\n  meta,\n  status,\n  leading,\n  trailing,\n  footer,\n  selected = false,\n  disabled = false,\n  compact = false,\n  accessibilityLabel,\n  onPress,\n}: MessageBubbleProps) {\n  const { theme } = useZoraTheme();\n  const padding = resolvePadding(compact);\n  const isInteractive = Boolean(onPress);\n  const isOutgoing = direction === 'outgoing';\n  const isSystem = direction === 'system';\n  const renderedStatus = resolveStatus(status);\n  const authorName = author?.name;\n  const authorAvatar = author?.avatar;\n  const hasAuthorName = authorName != null && !isOutgoing && !isSystem;\n  const hasAvatar = authorAvatar != null && !isOutgoing && !isSystem;\n  const hasMetaRow = timestamp != null || meta != null || renderedStatus != null;\n\n  const renderBubble = ({ pressed, hovered }: { pressed: boolean; hovered: boolean }) => {\n    const styles = resolveBubbleStyles({ direction, disabled, hovered, pressed, selected, theme });\n\n    return (\n      <Box\n        bg={styles.bg}\n        borderColor={styles.borderColor}\n        borderWidth={styles.borderWidth}\n        px={padding.px}\n        py={padding.py}\n        radius={isSystem ? 'm' : 'l'}\n        style={{ maxWidth: compact ? 420 : 560, opacity: styles.opacity }}\n      >\n        <Stack align={isSystem ? 'center' : 'flex-start'} gap={compact ? 'xxs' : 'xs'}>\n          {hasAuthorName ? (\n            <Text tone=\"muted\" variant=\"caption\" weight=\"semiBold\">\n              {authorName}\n            </Text>\n          ) : null}\n          {text != null ? (\n            <Text align={isSystem ? 'center' : undefined} tone={disabled ? 'muted' : 'default'}>\n              {text}\n            </Text>\n          ) : null}\n          {children != null ? <Box width=\"100%\">{children}</Box> : null}\n          {hasMetaRow ? (\n            <Inline\n              align=\"center\"\n              gap=\"xs\"\n              justify={isOutgoing ? 'flex-end' : isSystem ? 'center' : 'flex-start'}\n              wrap=\"wrap\"\n            >\n              {timestamp != null ? (\n                <Text tone=\"subtle\" variant=\"caption\">\n                  {timestamp}\n                </Text>\n              ) : null}\n              {meta != null ? (\n                <Text tone=\"subtle\" variant=\"caption\">\n                  {meta}\n                </Text>\n              ) : null}\n              {renderedStatus != null ? (\n                <Text tone={status === 'failed' ? 'danger' : 'subtle'} variant=\"caption\">\n                  {renderedStatus}\n                </Text>\n              ) : null}\n            </Inline>\n          ) : null}\n        </Stack>\n      </Box>\n    );\n  };\n\n  const bubbleContent = isInteractive ? (\n    <ButtonBase\n      accessibilityLabel={accessibilityLabel}\n      accessibilityRole=\"button\"\n      accessibilityState={{ disabled, selected }}\n      disabled={disabled}\n      onPress={onPress}\n      radius={isSystem ? 'm' : 'l'}\n      testID={testID}\n    >\n      {(state) => renderBubble({ pressed: state.pressed, hovered: state.hovered })}\n    </ButtonBase>\n  ) : (\n    <Box testID={testID}>{renderBubble({ pressed: false, hovered: false })}</Box>\n  );\n\n  return (\n    <Stack gap=\"xs\" style={{ width: '100%' }}>\n      <Inline\n        align=\"flex-end\"\n        gap=\"s\"\n        justify={isSystem ? 'center' : isOutgoing ? 'flex-end' : 'flex-start'}\n        wrap=\"nowrap\"\n      >\n        {!isOutgoing && !isSystem ? (\n          <Box>\n            {leading ??\n              (hasAvatar ? (\n                <MessageAvatar avatar={authorAvatar} authorName={authorName} compact={compact} />\n              ) : null)}\n          </Box>\n        ) : null}\n        {isOutgoing && trailing ? <Box>{trailing}</Box> : null}\n        {bubbleContent}\n        {isOutgoing && leading ? <Box>{leading}</Box> : null}\n        {!isOutgoing && !isSystem && trailing ? <Box>{trailing}</Box> : null}\n      </Inline>\n      {footer != null ? (\n        <Box alignSelf={isOutgoing ? 'flex-end' : isSystem ? 'center' : 'flex-start'}>{footer}</Box>\n      ) : null}\n    </Stack>\n  );\n}\n\nexport const MessageBubble = withZoraThemeScope(MessageBubbleInner);\n"]}
+{"version":3,"file":"MessageBubble.js","sourceRoot":"","sources":["../../../src/patterns/message-bubble/MessageBubble.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ButtonBase } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { Avatar } from '../../components/avatar';\nimport { Text } from '../../components/text';\nimport { Box, Inline, Stack } from '../../foundation';\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type {\n  MessageBubbleAvatar,\n  MessageBubbleDirection,\n  MessageBubbleProps,\n  MessageBubbleStatus,\n} from './types';\n\nfunction resolveAvatarName({\n  avatar,\n  authorName,\n}: {\n  avatar: MessageBubbleAvatar | undefined;\n  authorName: React.ReactNode | undefined;\n}): string | undefined {\n  if (avatar?.name) return avatar.name;\n  return typeof authorName === 'string' ? authorName : undefined;\n}\n\nfunction resolvePadding(compact: boolean) {\n  return compact ? { px: 'm' as const, py: 's' as const } : { px: 'm' as const, py: 'm' as const };\n}\n\nfunction resolveStatusLabel(status: MessageBubbleStatus): string {\n  switch (status) {\n    case 'sending':\n      return 'Sending';\n    case 'sent':\n      return 'Sent';\n    case 'delivered':\n      return 'Delivered';\n    case 'read':\n      return 'Read';\n    case 'failed':\n      return 'Failed';\n    default:\n      return status;\n  }\n}\n\nfunction isMessageBubbleStatus(\n  status: MessageBubbleProps['status'],\n): status is MessageBubbleStatus {\n  return (\n    status === 'sending' ||\n    status === 'sent' ||\n    status === 'delivered' ||\n    status === 'read' ||\n    status === 'failed'\n  );\n}\n\nfunction resolveStatus(status: MessageBubbleProps['status']) {\n  if (status == null) return null;\n  return isMessageBubbleStatus(status) ? resolveStatusLabel(status) : status;\n}\n\nfunction resolveBubbleStyles({\n  direction,\n  disabled,\n  hovered,\n  pressed,\n  selected,\n  theme,\n}: {\n  direction: MessageBubbleDirection;\n  disabled: boolean;\n  hovered: boolean;\n  pressed: boolean;\n  selected: boolean;\n  theme: ReturnType<typeof useZoraTheme>['theme'];\n}) {\n  const borderColor = selected ? theme.semantics.border.focus : theme.semantics.border.default;\n\n  if (direction === 'system') {\n    return {\n      bg: selected ? theme.semantics.neutral.surface : 'transparent',\n      borderColor,\n      borderWidth: selected ? 1 : 0,\n      opacity: disabled ? 0.72 : 1,\n    };\n  }\n\n  const interactiveBg = pressed\n    ? theme.semantics.neutral.surfaceActive\n    : hovered\n      ? theme.semantics.neutral.surfaceHover\n      : undefined;\n\n  return {\n    bg:\n      interactiveBg ??\n      (direction === 'outgoing' ? theme.semantics.neutral.surface : theme.semantics.surface.raised),\n    borderColor,\n    borderWidth: selected ? 1 : 0,\n    opacity: disabled ? 0.72 : 1,\n  };\n}\n\nfunction MessageAvatar({\n  avatar,\n  authorName,\n  compact,\n}: {\n  avatar: MessageBubbleAvatar;\n  authorName: React.ReactNode | undefined;\n  compact: boolean;\n}) {\n  const avatarName = resolveAvatarName({ avatar, authorName });\n\n  return (\n    <Avatar\n      initials={avatar.initials}\n      label={avatar.label ?? avatarName}\n      name={avatarName}\n      shape={avatar.shape}\n      size={avatar.size ?? (compact ? 'xs' : 's')}\n      source={avatar.source}\n      color={avatar.color}\n    />\n  );\n}\n\nfunction MessageBubbleInner({\n  themeId: _themeId,\n  mode: _mode,\n  testID,\n  direction = 'incoming',\n  text,\n  children,\n  author,\n  timestamp,\n  meta,\n  status,\n  leading,\n  trailing,\n  footer,\n  selected = false,\n  disabled = false,\n  compact = false,\n  accessibilityLabel,\n  onPress,\n}: MessageBubbleProps) {\n  const { theme } = useZoraTheme();\n  const padding = resolvePadding(compact);\n  const isInteractive = Boolean(onPress);\n  const isOutgoing = direction === 'outgoing';\n  const isSystem = direction === 'system';\n  const renderedStatus = resolveStatus(status);\n  const authorName = author?.name;\n  const authorAvatar = author?.avatar;\n  const hasAuthorName = authorName != null && !isOutgoing && !isSystem;\n  const hasAvatar = authorAvatar != null && !isOutgoing && !isSystem;\n  const hasMetaRow = timestamp != null || meta != null || renderedStatus != null;\n\n  const renderBubble = ({ pressed, hovered }: { pressed: boolean; hovered: boolean }) => {\n    const styles = resolveBubbleStyles({ direction, disabled, hovered, pressed, selected, theme });\n\n    return (\n      <Box\n        bg={styles.bg}\n        borderColor={styles.borderColor}\n        borderWidth={styles.borderWidth}\n        px={padding.px}\n        py={padding.py}\n        radius={isSystem ? 'm' : 'l'}\n        style={{ maxWidth: compact ? 420 : 560, opacity: styles.opacity }}\n      >\n        <Stack align={isSystem ? 'center' : 'flex-start'} gap={compact ? 'xxs' : 'xs'}>\n          {hasAuthorName ? (\n            <Text emphasis=\"muted\" variant=\"caption\" weight=\"semiBold\">\n              {authorName}\n            </Text>\n          ) : null}\n          {text != null ? (\n            <Text align={isSystem ? 'center' : undefined} emphasis={disabled ? 'muted' : 'default'}>\n              {text}\n            </Text>\n          ) : null}\n          {children != null ? <Box width=\"100%\">{children}</Box> : null}\n          {hasMetaRow ? (\n            <Inline\n              align=\"center\"\n              gap=\"xs\"\n              justify={isOutgoing ? 'flex-end' : isSystem ? 'center' : 'flex-start'}\n              wrap=\"wrap\"\n            >\n              {timestamp != null ? (\n                <Text emphasis=\"subtle\" variant=\"caption\">\n                  {timestamp}\n                </Text>\n              ) : null}\n              {meta != null ? (\n                <Text emphasis=\"subtle\" variant=\"caption\">\n                  {meta}\n                </Text>\n              ) : null}\n              {renderedStatus != null ? (\n                <Text\n                  color={status === 'failed' ? 'danger' : undefined}\n                  emphasis={status === 'failed' ? 'default' : 'subtle'}\n                  variant=\"caption\"\n                >\n                  {renderedStatus}\n                </Text>\n              ) : null}\n            </Inline>\n          ) : null}\n        </Stack>\n      </Box>\n    );\n  };\n\n  const bubbleContent = isInteractive ? (\n    <ButtonBase\n      accessibilityLabel={accessibilityLabel}\n      accessibilityRole=\"button\"\n      accessibilityState={{ disabled, selected }}\n      disabled={disabled}\n      onPress={onPress}\n      radius={isSystem ? 'm' : 'l'}\n      testID={testID}\n    >\n      {(state) => renderBubble({ pressed: state.pressed, hovered: state.hovered })}\n    </ButtonBase>\n  ) : (\n    <Box testID={testID}>{renderBubble({ pressed: false, hovered: false })}</Box>\n  );\n\n  return (\n    <Stack gap=\"xs\" style={{ width: '100%' }}>\n      <Inline\n        align=\"flex-end\"\n        gap=\"s\"\n        justify={isSystem ? 'center' : isOutgoing ? 'flex-end' : 'flex-start'}\n        wrap=\"nowrap\"\n      >\n        {!isOutgoing && !isSystem ? (\n          <Box>\n            {leading ??\n              (hasAvatar ? (\n                <MessageAvatar avatar={authorAvatar} authorName={authorName} compact={compact} />\n              ) : null)}\n          </Box>\n        ) : null}\n        {isOutgoing && trailing ? <Box>{trailing}</Box> : null}\n        {bubbleContent}\n        {isOutgoing && leading ? <Box>{leading}</Box> : null}\n        {!isOutgoing && !isSystem && trailing ? <Box>{trailing}</Box> : null}\n      </Inline>\n      {footer != null ? (\n        <Box alignSelf={isOutgoing ? 'flex-end' : isSystem ? 'center' : 'flex-start'}>{footer}</Box>\n      ) : null}\n    </Stack>\n  );\n}\n\nexport const MessageBubble = withZoraThemeScope(MessageBubbleInner);\n"]}

package/dist/patterns/message-bubble/types.d.ts

@@ -1,7 +1,7 @@
 import type React from 'react';
 import type { ImageSourcePropType } from 'react-native';
 import type { AvatarShape, AvatarSize } from '../../components/avatar';
-import type { ZoraTone } from '../../internal/recipes';
+import type { ZoraColor } from '../../internal/recipes';
 import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
 export type MessageBubbleDirection = 'incoming' | 'outgoing' | 'system';
 export type MessageBubbleStatus = 'sending' | 'sent' | 'delivered' | 'read' | 'failed';
@@ -13,7 +13,7 @@ export interface MessageBubbleAvatar {
     label?: string;
     size?: AvatarSize;
     shape?: AvatarShape;
-    tone?: ZoraTone;
+    color?: ZoraColor;
 }
 export interface MessageBubbleAuthor {
     name?: React.ReactNode;

package/dist/patterns/message-bubble/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/patterns/message-bubble/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAExD,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACvE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AACvD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,MAAM,sBAAsB,GAAG,UAAU,GAAG,UAAU,GAAG,QAAQ,CAAC;AACxE,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG,MAAM,GAAG,WAAW,GAAG,MAAM,GAAG,QAAQ,CAAC;AACvF,KAAK,0BAA0B,GAAG,mBAAmB,GAAG,OAAO,CAAC,KAAK,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;AAEzF,MAAM,WAAW,mBAAmB;IAClC,MAAM,CAAC,EAAE,mBAAmB,CAAC;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,CAAC;CACjB;AAED,MAAM,WAAW,mBAAmB;IAClC,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,MAAM,CAAC,EAAE,mBAAmB,CAAC;CAC9B;AAED,MAAM,WAAW,kBAAmB,SAAQ,aAAa;IACvD,SAAS,CAAC,EAAE,sBAAsB,CAAC;IACnC,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,MAAM,CAAC,EAAE,mBAAmB,CAAC;IAC7B,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,MAAM,CAAC,EAAE,0BAA0B,CAAC;IACpC,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/patterns/message-bubble/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAExD,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACvE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,MAAM,sBAAsB,GAAG,UAAU,GAAG,UAAU,GAAG,QAAQ,CAAC;AACxE,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG,MAAM,GAAG,WAAW,GAAG,MAAM,GAAG,QAAQ,CAAC;AACvF,KAAK,0BAA0B,GAAG,mBAAmB,GAAG,OAAO,CAAC,KAAK,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;AAEzF,MAAM,WAAW,mBAAmB;IAClC,MAAM,CAAC,EAAE,mBAAmB,CAAC;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED,MAAM,WAAW,mBAAmB;IAClC,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,MAAM,CAAC,EAAE,mBAAmB,CAAC;CAC9B;AAED,MAAM,WAAW,kBAAmB,SAAQ,aAAa;IACvD,SAAS,CAAC,EAAE,sBAAsB,CAAC;IACnC,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,MAAM,CAAC,EAAE,mBAAmB,CAAC;IAC7B,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,MAAM,CAAC,EAAE,0BAA0B,CAAC;IACpC,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB"}

package/dist/patterns/message-bubble/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/patterns/message-bubble/types.ts"],"names":[],"mappings":"","sourcesContent":["import type React from 'react';\nimport type { ImageSourcePropType } from 'react-native';\n\nimport type { AvatarShape, AvatarSize } from '../../components/avatar';\nimport type { ZoraTone } from '../../internal/recipes';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport type MessageBubbleDirection = 'incoming' | 'outgoing' | 'system';\nexport type MessageBubbleStatus = 'sending' | 'sent' | 'delivered' | 'read' | 'failed';\ntype MessageBubbleStatusContent = MessageBubbleStatus | Exclude<React.ReactNode, string>;\n\nexport interface MessageBubbleAvatar {\n  source?: ImageSourcePropType;\n  name?: string;\n  initials?: string;\n  label?: string;\n  size?: AvatarSize;\n  shape?: AvatarShape;\n  tone?: ZoraTone;\n}\n\nexport interface MessageBubbleAuthor {\n  name?: React.ReactNode;\n  avatar?: MessageBubbleAvatar;\n}\n\nexport interface MessageBubbleProps extends ZoraBaseProps {\n  direction?: MessageBubbleDirection;\n  text?: React.ReactNode;\n  children?: React.ReactNode;\n  author?: MessageBubbleAuthor;\n  timestamp?: React.ReactNode;\n  meta?: React.ReactNode;\n  status?: MessageBubbleStatusContent;\n  leading?: React.ReactNode;\n  trailing?: React.ReactNode;\n  footer?: React.ReactNode;\n  selected?: boolean;\n  disabled?: boolean;\n  compact?: boolean;\n  accessibilityLabel?: string;\n  onPress?: () => void;\n}\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/patterns/message-bubble/types.ts"],"names":[],"mappings":"","sourcesContent":["import type React from 'react';\nimport type { ImageSourcePropType } from 'react-native';\n\nimport type { AvatarShape, AvatarSize } from '../../components/avatar';\nimport type { ZoraColor } from '../../internal/recipes';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport type MessageBubbleDirection = 'incoming' | 'outgoing' | 'system';\nexport type MessageBubbleStatus = 'sending' | 'sent' | 'delivered' | 'read' | 'failed';\ntype MessageBubbleStatusContent = MessageBubbleStatus | Exclude<React.ReactNode, string>;\n\nexport interface MessageBubbleAvatar {\n  source?: ImageSourcePropType;\n  name?: string;\n  initials?: string;\n  label?: string;\n  size?: AvatarSize;\n  shape?: AvatarShape;\n  color?: ZoraColor;\n}\n\nexport interface MessageBubbleAuthor {\n  name?: React.ReactNode;\n  avatar?: MessageBubbleAvatar;\n}\n\nexport interface MessageBubbleProps extends ZoraBaseProps {\n  direction?: MessageBubbleDirection;\n  text?: React.ReactNode;\n  children?: React.ReactNode;\n  author?: MessageBubbleAuthor;\n  timestamp?: React.ReactNode;\n  meta?: React.ReactNode;\n  status?: MessageBubbleStatusContent;\n  leading?: React.ReactNode;\n  trailing?: React.ReactNode;\n  footer?: React.ReactNode;\n  selected?: boolean;\n  disabled?: boolean;\n  compact?: boolean;\n  accessibilityLabel?: string;\n  onPress?: () => void;\n}\n"]}

package/dist/patterns/notice/Notice.js

@@ -3,8 +3,8 @@ import { Badge } from '../../components/badge';
 import { Card } from '../../components/card';
 import { Box, Stack } from '../../foundation';
 import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
-function NoticeInner({ themeId: _themeId, mode: _mode, title, description, children, actions, tone = 'primary', testID, }) {
-    return (<Card description={description} eyebrow={<Badge tone={tone}>{String(tone).toUpperCase()}</Badge>} testID={testID} title={title} tone="subtle">
+function NoticeInner({ themeId: _themeId, mode: _mode, title, description, children, actions, color = 'primary', testID, }) {
+    return (<Card description={description} eyebrow={<Badge color={color}>{String(color).toUpperCase()}</Badge>} testID={testID} title={title} tone="subtle">
       <Stack gap="m">
         {children ? <Box>{children}</Box> : null}
         {actions ? <Box>{actions}</Box> : null}

package/dist/patterns/notice/Notice.js.map

@@ -1 +1 @@
-{"version":3,"file":"Notice.js","sourceRoot":"","sources":["../../../src/patterns/notice/Notice.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,WAAW,CAAC,EACnB,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,KAAK,EACL,WAAW,EACX,QAAQ,EACR,OAAO,EACP,IAAI,GAAG,SAAS,EAChB,MAAM,GACM;IACZ,OAAO,CACL,CAAC,IAAI,CACH,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,EAAE,CAAC,EAAE,KAAK,CAAC,CAAC,CACjE,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,IAAI,CAAC,QAAQ,CAEb;MAAA,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CACZ;QAAA,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,QAAQ,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CACxC;QAAA,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CACxC;MAAA,EAAE,KAAK,CACT;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,MAAM,GAAG,kBAAkB,CAAC,WAAW,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Badge } from '../../components/badge';\nimport { Card } from '../../components/card';\nimport { Box, Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { NoticeProps } from './types';\n\nfunction NoticeInner({\n  themeId: _themeId,\n  mode: _mode,\n  title,\n  description,\n  children,\n  actions,\n  tone = 'primary',\n  testID,\n}: NoticeProps) {\n  return (\n    <Card\n      description={description}\n      eyebrow={<Badge tone={tone}>{String(tone).toUpperCase()}</Badge>}\n      testID={testID}\n      title={title}\n      tone=\"subtle\"\n    >\n      <Stack gap=\"m\">\n        {children ? <Box>{children}</Box> : null}\n        {actions ? <Box>{actions}</Box> : null}\n      </Stack>\n    </Card>\n  );\n}\n\nexport const Notice = withZoraThemeScope(NoticeInner);\n"]}
+{"version":3,"file":"Notice.js","sourceRoot":"","sources":["../../../src/patterns/notice/Notice.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,WAAW,CAAC,EACnB,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,KAAK,EACL,WAAW,EACX,QAAQ,EACR,OAAO,EACP,KAAK,GAAG,SAAS,EACjB,MAAM,GACM;IACZ,OAAO,CACL,CAAC,IAAI,CACH,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,WAAW,EAAE,CAAC,EAAE,KAAK,CAAC,CAAC,CACpE,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,IAAI,CAAC,QAAQ,CAEb;MAAA,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CACZ;QAAA,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,QAAQ,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CACxC;QAAA,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CACxC;MAAA,EAAE,KAAK,CACT;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,MAAM,GAAG,kBAAkB,CAAC,WAAW,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Badge } from '../../components/badge';\nimport { Card } from '../../components/card';\nimport { Box, Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { NoticeProps } from './types';\n\nfunction NoticeInner({\n  themeId: _themeId,\n  mode: _mode,\n  title,\n  description,\n  children,\n  actions,\n  color = 'primary',\n  testID,\n}: NoticeProps) {\n  return (\n    <Card\n      description={description}\n      eyebrow={<Badge color={color}>{String(color).toUpperCase()}</Badge>}\n      testID={testID}\n      title={title}\n      tone=\"subtle\"\n    >\n      <Stack gap=\"m\">\n        {children ? <Box>{children}</Box> : null}\n        {actions ? <Box>{actions}</Box> : null}\n      </Stack>\n    </Card>\n  );\n}\n\nexport const Notice = withZoraThemeScope(NoticeInner);\n"]}

package/dist/patterns/notice/types.d.ts

@@ -1,11 +1,11 @@
 import type React from 'react';
-import type { ZoraTone } from '../../internal/recipes';
+import type { ZoraColor } from '../../internal/recipes';
 import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
 export interface NoticeProps extends ZoraBaseProps {
     title: React.ReactNode;
     description?: React.ReactNode;
     children?: React.ReactNode;
     actions?: React.ReactNode;
-    tone?: ZoraTone;
+    color?: ZoraColor;
 }
 //# sourceMappingURL=types.d.ts.map

package/dist/patterns/notice/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/patterns/notice/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AACvD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,WAAW,WAAY,SAAQ,aAAa;IAChD,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,IAAI,CAAC,EAAE,QAAQ,CAAC;CACjB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/patterns/notice/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,WAAW,WAAY,SAAQ,aAAa;IAChD,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB"}

package/dist/patterns/notice/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/patterns/notice/types.ts"],"names":[],"mappings":"","sourcesContent":["import type React from 'react';\n\nimport type { ZoraTone } from '../../internal/recipes';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport interface NoticeProps extends ZoraBaseProps {\n  title: React.ReactNode;\n  description?: React.ReactNode;\n  children?: React.ReactNode;\n  actions?: React.ReactNode;\n  tone?: ZoraTone;\n}\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/patterns/notice/types.ts"],"names":[],"mappings":"","sourcesContent":["import type React from 'react';\n\nimport type { ZoraColor } from '../../internal/recipes';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport interface NoticeProps extends ZoraBaseProps {\n  title: React.ReactNode;\n  description?: React.ReactNode;\n  children?: React.ReactNode;\n  actions?: React.ReactNode;\n  color?: ZoraColor;\n}\n"]}