@ankhorage/zora 1.5.0 → 2.0.0

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":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AACrD,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;AACpE,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAEhD,OAAO,EACL,+BAA+B,EAC/B,gBAAgB,EAChB,iBAAiB,EACjB,oBAAoB,EACpB,mBAAmB,GACpB,MAAM,cAAc,CAAC;AAEtB,SAAS,aAAa,CAAC,KAAoB;IACzC,IAAI,KAAK,KAAK,IAAI;QAAE,OAAO,IAAI,CAAC;IAChC,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC;QAAE,OAAO,IAAI,CAAC;IACzC,OAAO,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC;AACzC,CAAC;AAED,SAAS,kBAAkB,CAAC,KAAc;IACxC,IAAI,KAAK,YAAY,KAAK,IAAI,KAAK,CAAC,OAAO;QAAE,OAAO,KAAK,CAAC,OAAO,CAAC;IAClE,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC;QAAE,OAAO,KAAK,CAAC;IACvE,OAAO,uBAAuB,CAAC;AACjC,CAAC;AAED,SAAS,qBAAqB,CAAC,EAC7B,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,MAAM,EACN,KAAK,EACL,QAAQ,EACR,KAAK,EACL,WAAW,EACX,UAAU,EACV,SAAS,EACT,QAAQ,EACR,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,MAAM,EACN,YAAY,EACZ,cAAc,EACd,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,WAAW,GAAG,CAAC,EACf,YAAY,GAAG,eAAe,EAC9B,kBAAkB,GACI;IACtB,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAqB,SAAS,CAAC,CAAC;IACxF,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IACxD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IACtD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAgB,IAAI,CAAC,CAAC;IACpE,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5D,MAAM,YAAY,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAExC,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,OAAO,GAAG,KAAK,CAAC;QAC/B,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,aAAa,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC;IAClD,MAAM,YAAY,GAAG,aAAa,KAAK,IAAI,CAAC;IAC5C,MAAM,eAAe,GAAG,QAAQ,IAAI,QAAQ,CAAC;IAE7C,MAAM,cAAc,GAAG,SAAS,IAAI,aAAa,CAAC;IAClD,MAAM,OAAO,GAAG,OAAO,CAAC,cAAc,CAAC,CAAC;IAExC,MAAM,UAAU,GAAG,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAC5C,MAAM,WAAW,GAAG,iBAAiB,CAAC,YAAY,CAAC,CAAC;IAEpD,MAAM,eAAe,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,IAAmB,EAAE,EAAE;QAChE,IAAI,CAAC,YAAY,CAAC,OAAO;YAAE,OAAO;QAClC,WAAW,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC,CAAC;IACnC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,mBAAmB,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACjD,IAAI,CAAC,YAAY,CAAC,OAAO;YAAE,OAAO;QAClC,YAAY,CAAC,KAAK,CAAC,CAAC;QACpB,WAAW,CAAC,KAAK,CAAC,CAAC;QACnB,WAAW,CAAC,IAAI,CAAC,CAAC;IACpB,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,aAAa,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,IAAI,EAAE;QACjD,IAAI,eAAe,IAAI,SAAS,IAAI,QAAQ;YAAE,OAAO;QAErD,gBAAgB,CAAC,SAAS,CAAC,CAAC;QAC5B,IAAI,MAAM,CAAC;QACX,IAAI,CAAC;YACH,MAAM,GAAG,MAAM,MAAM,EAAE,CAAC;QAC1B,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,IAAI,CAAC,YAAY,CAAC,OAAO;gBAAE,OAAO;YAClC,gBAAgB,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC,CAAC;YAC5C,OAAO;QACT,CAAC;QACD,IAAI,CAAC,MAAM;YAAE,OAAO;QAEpB,MAAM,eAAe,GAAG,mBAAmB,CAAC;YAC1C,MAAM;YACN,MAAM;YACN,YAAY;YACZ,cAAc;SACf,CAAC,CAAC;QAEH,IAAI,eAAe,EAAE,CAAC;YACpB,gBAAgB,CAAC,eAAe,CAAC,CAAC;YAClC,OAAO;QACT,CAAC;QAED,IAAI,CAAC,QAAQ,EAAE,CAAC;YACd,QAAQ,CAAC,+BAA+B,CAAC,MAAM,CAAC,CAAC,CAAC;YAClD,OAAO;QACT,CAAC;QAED,MAAM,eAAe,GAAG,+BAA+B,CAAC,MAAM,CAAC,CAAC;QAChE,QAAQ,CAAC,eAAe,CAAC,CAAC;QAC1B,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,eAAe,CAAC,CAAC,CAAC,CAAC;QAEnB,IAAI,CAAC;YACH,MAAM,QAAQ,GAAG,MAAM,QAAQ,CAAC,MAAM,EAAE,EAAE,WAAW,EAAE,eAAe,EAAE,CAAC,CAAC;YAC1E,IAAI,CAAC,YAAY,CAAC,OAAO;gBAAE,OAAO;YAClC,QAAQ,CAAC,QAAQ,CAAC,CAAC;YACnB,gBAAgB,CAAC,SAAS,CAAC,CAAC;YAC5B,mBAAmB,EAAE,CAAC;QACxB,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,IAAI,CAAC,YAAY,CAAC,OAAO;gBAAE,OAAO;YAClC,gBAAgB,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC,CAAC;YAC5C,YAAY,CAAC,KAAK,CAAC,CAAC;YACpB,WAAW,CAAC,IAAI,CAAC,CAAC;QACpB,CAAC;IACH,CAAC,EAAE;QACD,MAAM;QACN,eAAe;QACf,mBAAmB;QACnB,YAAY;QACZ,QAAQ;QACR,MAAM;QACN,QAAQ;QACR,QAAQ;QACR,eAAe;QACf,SAAS;QACT,cAAc;KACf,CAAC,CAAC;IAEH,MAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,IAAI,EAAE;QAChD,IAAI,eAAe,IAAI,SAAS,IAAI,QAAQ;YAAE,OAAO;QACrD,IAAI,CAAC,KAAK,EAAE,CAAC;YACX,QAAQ,CAAC,IAAI,CAAC,CAAC;YACf,OAAO;QACT,CAAC;QAED,gBAAgB,CAAC,SAAS,CAAC,CAAC;QAE5B,IAAI,CAAC,QAAQ,EAAE,CAAC;YACd,QAAQ,CAAC,IAAI,CAAC,CAAC;YACf,OAAO;QACT,CAAC;QAED,WAAW,CAAC,IAAI,CAAC,CAAC;QAClB,IAAI,CAAC;YACH,MAAM,QAAQ,CAAC,KAAK,CAAC,CAAC;YACtB,IAAI,CAAC,YAAY,CAAC,OAAO;gBAAE,OAAO;YAClC,QAAQ,CAAC,IAAI,CAAC,CAAC;YACf,WAAW,CAAC,KAAK,CAAC,CAAC;QACrB,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,IAAI,CAAC,YAAY,CAAC,OAAO;gBAAE,OAAO;YAClC,gBAAgB,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC,CAAC;YAC5C,WAAW,CAAC,KAAK,CAAC,CAAC;QACrB,CAAC;IACH,CAAC,EAAE,CAAC,eAAe,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC;IAEtE,MAAM,aAAa,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAC3C,IAAI,CAAC,YAAY;YAAE,OAAO;QAC1B,cAAc,CAAC,IAAI,CAAC,CAAC;IACvB,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnB,MAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC;IAExE,OAAO,CACL,EACE;MAAA,CAAC,SAAS,CACR,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,SAAS,CAAC,CAAC,cAAc,CAAC,CAC1B,UAAU,CAAC,CAAC,UAAU,CAAC,CACvB,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,MAAM,CAAC,CAAC,MAAM,CAAC,CAEf;QAAA,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CACZ;UAAA,CAAC,YAAY,CACX,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,gBAAgB,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,SAAS,CAAC,EAGxE;;UAAA,CAAC,UAAU,IAAI,WAAW,CAAC,CAAC,CAAC,CAC3B,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CACb;cAAA,CAAC,UAAU,CAAC,CAAC,CAAC,CACZ,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CACtC;kBAAA,CAAC,UAAU,CACb;gBAAA,EAAE,IAAI,CAAC,CACR,CAAC,CAAC,CAAC,IAAI,CACR;cAAA,CAAC,WAAW,CAAC,CAAC,CAAC,CACb,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CACtC;kBAAA,CAAC,WAAW,CACd;gBAAA,EAAE,IAAI,CAAC,CACR,CAAC,CAAC,CAAC,IAAI,CACV;YAAA,EAAE,KAAK,CAAC,CACT,CAAC,CAAC,CAAC,IAAI,CAER;;UAAA,CAAC,SAAS,CAAC,CAAC,CAAC,CACX,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CACb;cAAA,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CACtC;;cACF,EAAE,IAAI,CACN;cAAA,CAAC,QAAQ,KAAK,IAAI,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,EAAG,CAAC,CAAC,CAAC,IAAI,CACnE;YAAA,EAAE,KAAK,CAAC,CACT,CAAC,CAAC,CAAC,IAAI,CAER;;UAAA,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,CACtD;YAAA,CAAC,MAAM,CACL,QAAQ,CAAC,CAAC,eAAe,IAAI,SAAS,IAAI,QAAQ,CAAC,CACnD,OAAO,CAAC,CAAC,GAAG,EAAE;YACZ,KAAK,aAAa,EAAE,CAAC;QACvB,CAAC,CAAC,CAEF;cAAA,CAAC,KAAK,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,cAAc,CAC3C;YAAA,EAAE,MAAM,CAER;;YAAA,CAAC,KAAK,CAAC,CAAC,CAAC,CACP,CAAC,MAAM,CACL,QAAQ,CAAC,CAAC,eAAe,IAAI,SAAS,IAAI,QAAQ,CAAC,CACnD,OAAO,CAAC,SAAS,CACjB,OAAO,CAAC,CAAC,QAAQ,CAAC,CAClB,KAAK,CAAC,QAAQ,CACd,OAAO,CAAC,CAAC,GAAG,EAAE;gBACZ,KAAK,YAAY,EAAE,CAAC;YACtB,CAAC,CAAC,CAEF;;cACF,EAAE,MAAM,CAAC,CACV,CAAC,CAAC,CAAC,IAAI,CAER;;YAAA,CAAC,YAAY,CAAC,CAAC,CAAC,CACd,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,aAAa,CAAC,CAC7E;;cACF,EAAE,MAAM,CAAC,CACV,CAAC,CAAC,CAAC,IAAI,CACV;UAAA,EAAE,KAAK,CAEP;;UAAA,CAAC,CAAC,YAAY,IAAI,KAAK,EAAE,IAAI,KAAK,SAAS,IAAI,KAAK,CAAC,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,CAC7E,CAAC,GAAG,CACF;cAAA,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CACtC;;cACF,EAAE,IAAI,CACR;YAAA,EAAE,GAAG,CAAC,CACP,CAAC,CAAC,CAAC,IAAI,CACV;QAAA,EAAE,KAAK,CACT;MAAA,EAAE,SAAS,CAEX;;MAAA,CAAC,YAAY,CAAC,CAAC,CAAC,CACd,CAAC,KAAK,CACJ,eAAe,CACf,WAAW,CAAC,CAAC,kBAAkB,CAAC,CAChC,KAAK,CAAC,CAAC,YAAY,CAAC,CACpB,OAAO,CAAC,CAAC,WAAW,CAAC,CACrB,SAAS,CAAC,CAAC,YAAY,CAAC,CAExB;UAAA,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CACZ;YAAA,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,WAAW,CAAC,CAAC,WAAW,CAAC,EACrD;YAAA,CAAC,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,CACvC;cAAA,CAAC,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,YAAY,CAAC,CAC3D;;cACF,EAAE,MAAM,CACV;YAAA,EAAE,KAAK,CACT;UAAA,EAAE,KAAK,CACT;QAAA,EAAE,KAAK,CAAC,CACT,CAAC,CAAC,CAAC,IAAI,CACV;IAAA,GAAG,CACJ,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,gBAAgB,GAAG,kBAAkB,CAAC,qBAAqB,CAAC,CAAC","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/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"]}

package/dist/patterns/post-card/PostCard.js

@@ -32,13 +32,13 @@ function PostCardAuthor({ author, compact = false }) {
     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} tone={avatar?.tone}/>
+      <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 tone="muted" variant="caption">
+          {author.subtitle ? (<Text emphasis="muted" variant="caption">
               {author.subtitle}
             </Text>) : null}
         </Stack>
@@ -72,7 +72,7 @@ function PostCardActions({ actions }) {
         return null;
     }
     return (<Inline align="center" gap="s" wrap="wrap">
-      {actions.map((action) => (<Button key={action.id} disabled={action.disabled} emphasis={action.selected ? 'soft' : 'ghost'} leadingIcon={action.icon} onPress={action.onPress} size="s" tone={action.selected ? 'primary' : 'neutral'}>
+      {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>);
@@ -83,7 +83,7 @@ function PostCommentPreviewItem({ comment }) {
       <Box flex={1}>
         <Stack gap="xxs">
           <Text variant="bodySmall">{comment.text}</Text>
-          {comment.meta ? (<Text tone="subtle" variant="caption">
+          {comment.meta ? (<Text emphasis="subtle" variant="caption">
               {comment.meta}
             </Text>) : null}
           {comment.action ? <Box>{comment.action}</Box> : null}

package/dist/patterns/post-card/PostCard.js.map

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

package/dist/patterns/post-card/types.d.ts

@@ -2,7 +2,7 @@ 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, ZoraTone } from '../../internal/recipes';
+import type { ZoraCardTone, ZoraColor } from '../../internal/recipes';
 import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
 export interface PostAuthorAvatar {
     source?: ImageSourcePropType;
@@ -11,7 +11,7 @@ export interface PostAuthorAvatar {
     label?: string;
     size?: AvatarSize;
     shape?: AvatarShape;
-    tone?: ZoraTone;
+    color?: ZoraColor;
 }
 export interface PostAuthor {
     name: React.ReactNode;

package/dist/patterns/post-card/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/patterns/post-card/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACzD,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,YAAY,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AACrE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,WAAW,gBAAgB;IAC/B,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,UAAU;IACzB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,MAAM,CAAC,EAAE,gBAAgB,CAAC;CAC3B;AAED,UAAU,mBAAmB;IAC3B,MAAM,EAAE,mBAAmB,CAAC;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC;CAClB;AAED,UAAU,mBAAmB;IAC3B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,KAAK,CAAC;CAChB;AAED,MAAM,MAAM,aAAa,GAAG,mBAAmB,GAAG,mBAAmB,CAAC;AAEtE,MAAM,WAAW,UAAU;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,MAAM,WAAW,kBAAkB;IACjC,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B;AAED,MAAM,WAAW,aAAc,SAAQ,aAAa;IAClD,MAAM,EAAE,UAAU,CAAC;IACnB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,KAAK,CAAC,EAAE,aAAa,GAAG,SAAS,aAAa,EAAE,CAAC;IACjD,OAAO,CAAC,EAAE,SAAS,UAAU,EAAE,CAAC;IAChC,QAAQ,CAAC,EAAE,SAAS,kBAAkB,EAAE,CAAC;IACzC,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/patterns/post-card/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACzD,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,YAAY,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,WAAW,gBAAgB;IAC/B,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,UAAU;IACzB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,MAAM,CAAC,EAAE,gBAAgB,CAAC;CAC3B;AAED,UAAU,mBAAmB;IAC3B,MAAM,EAAE,mBAAmB,CAAC;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC;CAClB;AAED,UAAU,mBAAmB;IAC3B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,KAAK,CAAC;CAChB;AAED,MAAM,MAAM,aAAa,GAAG,mBAAmB,GAAG,mBAAmB,CAAC;AAEtE,MAAM,WAAW,UAAU;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,MAAM,WAAW,kBAAkB;IACjC,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B;AAED,MAAM,WAAW,aAAc,SAAQ,aAAa;IAClD,MAAM,EAAE,UAAU,CAAC;IACnB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,KAAK,CAAC,EAAE,aAAa,GAAG,SAAS,aAAa,EAAE,CAAC;IACjD,OAAO,CAAC,EAAE,SAAS,UAAU,EAAE,CAAC;IAChC,QAAQ,CAAC,EAAE,SAAS,kBAAkB,EAAE,CAAC;IACzC,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB"}

package/dist/patterns/post-card/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/patterns/post-card/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonIconSpec } from '@ankhorage/surface';\nimport type React from 'react';\nimport type { ImageSourcePropType } from 'react-native';\n\nimport type { AvatarShape, AvatarSize } from '../../components/avatar';\nimport type { ZoraCardTone, ZoraTone } from '../../internal/recipes';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport interface PostAuthorAvatar {\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 PostAuthor {\n  name: React.ReactNode;\n  subtitle?: React.ReactNode;\n  avatar?: PostAuthorAvatar;\n}\n\ninterface PostCardSourceMedia {\n  source: ImageSourcePropType;\n  label: string;\n  aspectRatio?: number;\n  children?: never;\n}\n\ninterface PostCardCustomMedia {\n  children: React.ReactNode;\n  label?: string;\n  aspectRatio?: number;\n  source?: never;\n}\n\nexport type PostCardMedia = PostCardSourceMedia | PostCardCustomMedia;\n\nexport interface PostAction {\n  id: string;\n  label: string;\n  icon?: ButtonIconSpec;\n  count?: React.ReactNode;\n  selected?: boolean;\n  disabled?: boolean;\n  onPress?: () => void;\n}\n\nexport interface PostCommentPreview {\n  id: string;\n  author?: PostAuthor;\n  text: React.ReactNode;\n  meta?: React.ReactNode;\n  action?: React.ReactNode;\n}\n\nexport interface PostCardProps extends ZoraBaseProps {\n  author: PostAuthor;\n  text?: React.ReactNode;\n  children?: React.ReactNode;\n  media?: PostCardMedia | readonly PostCardMedia[];\n  actions?: readonly PostAction[];\n  comments?: readonly PostCommentPreview[];\n  headerAction?: React.ReactNode;\n  footer?: React.ReactNode;\n  tone?: ZoraCardTone;\n  compact?: boolean;\n  onPress?: () => void;\n}\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/patterns/post-card/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonIconSpec } from '@ankhorage/surface';\nimport type React from 'react';\nimport type { ImageSourcePropType } from 'react-native';\n\nimport type { AvatarShape, AvatarSize } from '../../components/avatar';\nimport type { ZoraCardTone, ZoraColor } from '../../internal/recipes';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport interface PostAuthorAvatar {\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 PostAuthor {\n  name: React.ReactNode;\n  subtitle?: React.ReactNode;\n  avatar?: PostAuthorAvatar;\n}\n\ninterface PostCardSourceMedia {\n  source: ImageSourcePropType;\n  label: string;\n  aspectRatio?: number;\n  children?: never;\n}\n\ninterface PostCardCustomMedia {\n  children: React.ReactNode;\n  label?: string;\n  aspectRatio?: number;\n  source?: never;\n}\n\nexport type PostCardMedia = PostCardSourceMedia | PostCardCustomMedia;\n\nexport interface PostAction {\n  id: string;\n  label: string;\n  icon?: ButtonIconSpec;\n  count?: React.ReactNode;\n  selected?: boolean;\n  disabled?: boolean;\n  onPress?: () => void;\n}\n\nexport interface PostCommentPreview {\n  id: string;\n  author?: PostAuthor;\n  text: React.ReactNode;\n  meta?: React.ReactNode;\n  action?: React.ReactNode;\n}\n\nexport interface PostCardProps extends ZoraBaseProps {\n  author: PostAuthor;\n  text?: React.ReactNode;\n  children?: React.ReactNode;\n  media?: PostCardMedia | readonly PostCardMedia[];\n  actions?: readonly PostAction[];\n  comments?: readonly PostCommentPreview[];\n  headerAction?: React.ReactNode;\n  footer?: React.ReactNode;\n  tone?: ZoraCardTone;\n  compact?: boolean;\n  onPress?: () => void;\n}\n"]}

package/dist/patterns/section-header/SectionHeader.js

@@ -7,11 +7,11 @@ function SectionHeaderInner({ themeId: _themeId, mode: _mode, title, description
     return (<Stack align={{ base: 'flex-start', md: 'center' }} direction={{ base: 'column', md: 'row' }} gap="m" justify="space-between" testID={testID}>
       <Box flex={{ md: 1 }} width={{ base: '100%', md: 'auto' }}>
         <Stack gap="xs">
-          {eyebrow ? (<Text tone="muted" variant="caption" weight="semiBold">
+          {eyebrow ? (<Text emphasis="muted" variant="caption" weight="semiBold">
               {eyebrow}
             </Text>) : null}
           <Heading level={3}>{title}</Heading>
-          {description ? (<Text tone="muted" variant="bodySmall">
+          {description ? (<Text emphasis="muted" variant="bodySmall">
               {description}
             </Text>) : null}
         </Stack>

package/dist/patterns/section-header/SectionHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"SectionHeader.js","sourceRoot":"","sources":["../../../src/patterns/section-header/SectionHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAC;AACnD,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,kBAAkB,CAAC,EAC1B,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,KAAK,EACL,WAAW,EACX,OAAO,EACP,OAAO,EACP,MAAM,GACa;IACnB,OAAO,CACL,CAAC,KAAK,CACJ,KAAK,CAAC,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,EAAE,EAAE,QAAQ,EAAE,CAAC,CAC5C,SAAS,CAAC,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,CACzC,GAAG,CAAC,GAAG,CACP,OAAO,CAAC,eAAe,CACvB,MAAM,CAAC,CAAC,MAAM,CAAC,CAEf;MAAA,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,CAAC,CACxD;QAAA,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CACb;UAAA,CAAC,OAAO,CAAC,CAAC,CAAC,CACT,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,UAAU,CACpD;cAAA,CAAC,OAAO,CACV;YAAA,EAAE,IAAI,CAAC,CACR,CAAC,CAAC,CAAC,IAAI,CACR;UAAA,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE,OAAO,CACnC;UAAA,CAAC,WAAW,CAAC,CAAC,CAAC,CACb,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,WAAW,CACpC;cAAA,CAAC,WAAW,CACd;YAAA,EAAE,IAAI,CAAC,CACR,CAAC,CAAC,CAAC,IAAI,CACV;QAAA,EAAE,KAAK,CACT;MAAA,EAAE,GAAG,CACL;MAAA,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CACxC;IAAA,EAAE,KAAK,CAAC,CACT,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,aAAa,GAAG,kBAAkB,CAAC,kBAAkB,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Heading } from '../../components/heading';\nimport { Text } from '../../components/text';\nimport { Box, Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { SectionHeaderProps } from './types';\n\nfunction SectionHeaderInner({\n  themeId: _themeId,\n  mode: _mode,\n  title,\n  description,\n  eyebrow,\n  actions,\n  testID,\n}: SectionHeaderProps) {\n  return (\n    <Stack\n      align={{ base: 'flex-start', md: 'center' }}\n      direction={{ base: 'column', md: 'row' }}\n      gap=\"m\"\n      justify=\"space-between\"\n      testID={testID}\n    >\n      <Box flex={{ md: 1 }} width={{ base: '100%', md: 'auto' }}>\n        <Stack gap=\"xs\">\n          {eyebrow ? (\n            <Text tone=\"muted\" variant=\"caption\" weight=\"semiBold\">\n              {eyebrow}\n            </Text>\n          ) : null}\n          <Heading level={3}>{title}</Heading>\n          {description ? (\n            <Text tone=\"muted\" variant=\"bodySmall\">\n              {description}\n            </Text>\n          ) : null}\n        </Stack>\n      </Box>\n      {actions ? <Box>{actions}</Box> : null}\n    </Stack>\n  );\n}\n\nexport const SectionHeader = withZoraThemeScope(SectionHeaderInner);\n"]}
+{"version":3,"file":"SectionHeader.js","sourceRoot":"","sources":["../../../src/patterns/section-header/SectionHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAC;AACnD,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,kBAAkB,CAAC,EAC1B,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,KAAK,EACL,WAAW,EACX,OAAO,EACP,OAAO,EACP,MAAM,GACa;IACnB,OAAO,CACL,CAAC,KAAK,CACJ,KAAK,CAAC,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,EAAE,EAAE,QAAQ,EAAE,CAAC,CAC5C,SAAS,CAAC,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,CACzC,GAAG,CAAC,GAAG,CACP,OAAO,CAAC,eAAe,CACvB,MAAM,CAAC,CAAC,MAAM,CAAC,CAEf;MAAA,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,CAAC,CACxD;QAAA,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CACb;UAAA,CAAC,OAAO,CAAC,CAAC,CAAC,CACT,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,UAAU,CACxD;cAAA,CAAC,OAAO,CACV;YAAA,EAAE,IAAI,CAAC,CACR,CAAC,CAAC,CAAC,IAAI,CACR;UAAA,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE,OAAO,CACnC;UAAA,CAAC,WAAW,CAAC,CAAC,CAAC,CACb,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,WAAW,CACxC;cAAA,CAAC,WAAW,CACd;YAAA,EAAE,IAAI,CAAC,CACR,CAAC,CAAC,CAAC,IAAI,CACV;QAAA,EAAE,KAAK,CACT;MAAA,EAAE,GAAG,CACL;MAAA,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CACxC;IAAA,EAAE,KAAK,CAAC,CACT,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,aAAa,GAAG,kBAAkB,CAAC,kBAAkB,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Heading } from '../../components/heading';\nimport { Text } from '../../components/text';\nimport { Box, Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { SectionHeaderProps } from './types';\n\nfunction SectionHeaderInner({\n  themeId: _themeId,\n  mode: _mode,\n  title,\n  description,\n  eyebrow,\n  actions,\n  testID,\n}: SectionHeaderProps) {\n  return (\n    <Stack\n      align={{ base: 'flex-start', md: 'center' }}\n      direction={{ base: 'column', md: 'row' }}\n      gap=\"m\"\n      justify=\"space-between\"\n      testID={testID}\n    >\n      <Box flex={{ md: 1 }} width={{ base: '100%', md: 'auto' }}>\n        <Stack gap=\"xs\">\n          {eyebrow ? (\n            <Text emphasis=\"muted\" variant=\"caption\" weight=\"semiBold\">\n              {eyebrow}\n            </Text>\n          ) : null}\n          <Heading level={3}>{title}</Heading>\n          {description ? (\n            <Text emphasis=\"muted\" variant=\"bodySmall\">\n              {description}\n            </Text>\n          ) : null}\n        </Stack>\n      </Box>\n      {actions ? <Box>{actions}</Box> : null}\n    </Stack>\n  );\n}\n\nexport const SectionHeader = withZoraThemeScope(SectionHeaderInner);\n"]}

package/dist/patterns/settings-row/SettingsRow.js

@@ -9,7 +9,7 @@ function SettingsRowInner({ themeId: _themeId, mode: _mode, title, description,
     const isInteractive = Boolean(onPress) && !control;
     return (<Card compact actions={control} description={description} disabled={disabled} onPress={isInteractive ? onPress : undefined} testID={testID} title={title} tone="subtle">
       {meta ? (<Box pt="xs">
-          <Text tone="muted" variant="caption">
+          <Text emphasis="muted" variant="caption">
             {meta}
           </Text>
         </Box>) : null}

package/dist/patterns/settings-row/SettingsRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"SettingsRow.js","sourceRoot":"","sources":["../../../src/patterns/settings-row/SettingsRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AACvC,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,gBAAgB,CAAC,EACxB,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,KAAK,EACL,WAAW,EACX,IAAI,EACJ,OAAO,EACP,OAAO,EACP,QAAQ,GAAG,KAAK,EAChB,MAAM,GACW;IACjB,uCAAuC;IACvC,0FAA0F;IAC1F,MAAM,aAAa,GAAG,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC;IAEnD,OAAO,CACL,CAAC,IAAI,CACH,OAAO,CACP,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,OAAO,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAC7C,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,IAAI,CAAC,QAAQ,CAEb;MAAA,CAAC,IAAI,CAAC,CAAC,CAAC,CACN,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CACV;UAAA,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAClC;YAAA,CAAC,IAAI,CACP;UAAA,EAAE,IAAI,CACR;QAAA,EAAE,GAAG,CAAC,CACP,CAAC,CAAC,CAAC,IAAI,CACV;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,WAAW,GAAG,kBAAkB,CAAC,gBAAgB,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Card } from '../../components/card';\nimport { Text } from '../../components/text';\nimport { Box } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { SettingsRowProps } from './types';\n\nfunction SettingsRowInner({\n  themeId: _themeId,\n  mode: _mode,\n  title,\n  description,\n  meta,\n  control,\n  onPress,\n  disabled = false,\n  testID,\n}: SettingsRowProps) {\n  // Prevent nested interactive elements:\n  // If a control is present (likely contains buttons), the row itself must not be clickable\n  const isInteractive = Boolean(onPress) && !control;\n\n  return (\n    <Card\n      compact\n      actions={control}\n      description={description}\n      disabled={disabled}\n      onPress={isInteractive ? onPress : undefined}\n      testID={testID}\n      title={title}\n      tone=\"subtle\"\n    >\n      {meta ? (\n        <Box pt=\"xs\">\n          <Text tone=\"muted\" variant=\"caption\">\n            {meta}\n          </Text>\n        </Box>\n      ) : null}\n    </Card>\n  );\n}\n\nexport const SettingsRow = withZoraThemeScope(SettingsRowInner);\n"]}
+{"version":3,"file":"SettingsRow.js","sourceRoot":"","sources":["../../../src/patterns/settings-row/SettingsRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AACvC,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,gBAAgB,CAAC,EACxB,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,KAAK,EACL,WAAW,EACX,IAAI,EACJ,OAAO,EACP,OAAO,EACP,QAAQ,GAAG,KAAK,EAChB,MAAM,GACW;IACjB,uCAAuC;IACvC,0FAA0F;IAC1F,MAAM,aAAa,GAAG,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC;IAEnD,OAAO,CACL,CAAC,IAAI,CACH,OAAO,CACP,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,OAAO,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAC7C,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,IAAI,CAAC,QAAQ,CAEb;MAAA,CAAC,IAAI,CAAC,CAAC,CAAC,CACN,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CACV;UAAA,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CACtC;YAAA,CAAC,IAAI,CACP;UAAA,EAAE,IAAI,CACR;QAAA,EAAE,GAAG,CAAC,CACP,CAAC,CAAC,CAAC,IAAI,CACV;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,WAAW,GAAG,kBAAkB,CAAC,gBAAgB,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Card } from '../../components/card';\nimport { Text } from '../../components/text';\nimport { Box } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { SettingsRowProps } from './types';\n\nfunction SettingsRowInner({\n  themeId: _themeId,\n  mode: _mode,\n  title,\n  description,\n  meta,\n  control,\n  onPress,\n  disabled = false,\n  testID,\n}: SettingsRowProps) {\n  // Prevent nested interactive elements:\n  // If a control is present (likely contains buttons), the row itself must not be clickable\n  const isInteractive = Boolean(onPress) && !control;\n\n  return (\n    <Card\n      compact\n      actions={control}\n      description={description}\n      disabled={disabled}\n      onPress={isInteractive ? onPress : undefined}\n      testID={testID}\n      title={title}\n      tone=\"subtle\"\n    >\n      {meta ? (\n        <Box pt=\"xs\">\n          <Text emphasis=\"muted\" variant=\"caption\">\n            {meta}\n          </Text>\n        </Box>\n      ) : null}\n    </Card>\n  );\n}\n\nexport const SettingsRow = withZoraThemeScope(SettingsRowInner);\n"]}