@ankhorage/zora 0.8.1 → 0.10.0

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # Changelog
 
+## 0.10.0
+
+### Minor Changes
+
+- 8ad107f: Adds nested ZORA theme scopes with shared `themeId` and `mode` base props so components can override theme context for themselves and their subtrees.
+
+## 0.9.0
+
+### Minor Changes
+
+- 3745d82: Introduces the ZORA theme seed model with `ZoraTheme`, `ZoraComputedTheme`, and
+  `zoraDefaultTheme`, replacing public override/config terminology with app-facing
+  theme terminology.
+
 ## 0.8.1
 
 ### Patch Changes

package/README.md

@@ -68,6 +68,31 @@ export function App() {
 }
 ```
 
+## Scoped themes
+
+ZORA supports nested theme scopes. A component may set `mode` and, later,
+`themeId`; everything inside inherits the nearest scope.
+
+```tsx
+import React from 'react';
+import { Button, Heading, Panel, Text, ZoraProvider, type ZoraTheme } from '@ankhorage/zora';
+
+export function App({ appTheme }: { appTheme: ZoraTheme }) {
+  return (
+    <ZoraProvider theme={appTheme} initialMode="light">
+      <Panel mode="dark">
+        <Heading>Studio panel</Heading>
+        <Text>Text inherits dark mode.</Text>
+        <Button>Also scoped.</Button>
+      </Panel>
+    </ZoraProvider>
+  );
+}
+```
+
+In Plan 2, `mode` is a declarative render-scope override. Calling `setMode` from
+`useZoraTheme()` still targets the root theme provider.
+
 ## Foundation primitives
 
 ZORA re-exports selected Surface foundation primitives for app-facing layout
@@ -122,21 +147,21 @@ responsive for mobile and web layouts.
 
 ZORA props:
 
-| Prop            | Type                                     | Default     | Notes                                        |
-| --------------- | ---------------------------------------- | ----------- | -------------------------------------------- |
-| `children`      | `React.ReactNode`                        | -           | Primary content.                             |
-| `text`          | `string`                                 | -           | Manifest-friendly content prop.              |
-| `i18nKey`       | `string`                                 | -           | Runtime-resolved fallback key when no content prop is provided.                    |
-| `level`         | `HeadingLevel`                           | `2`         | Semantic heading level from `1` through `6`. |
-| `size`          | `Responsive<HeadingSize>`                | level size  | Visual scale: `display`, `h1` through `h6`.  |
-| `tone`          | `Responsive<HeadingTone>`                | `'default'` | Semantic text color.                         |
-| `align`         | `Responsive<HeadingAlign>`               | -           | Text alignment.                              |
-| `weight`        | `Responsive<HeadingWeight>`              | recipe      | Optional structured weight override.         |
-| `italic`        | `boolean`                                | `false`     | Italic style.                                |
-| `numberOfLines` | `number`                                 | -           | Native/web truncation line count.            |
-| `ellipsizeMode` | `'head' \| 'middle' \| 'tail' \| 'clip'` | -           | Truncation behavior.                         |
-| `selectable`    | `boolean`                                | -           | Allows text selection where supported.       |
-| `testID`        | `string`                                 | -           | Test id.                                     |
+| Prop            | Type                                     | Default     | Notes                                                           |
+| --------------- | ---------------------------------------- | ----------- | --------------------------------------------------------------- |
+| `children`      | `React.ReactNode`                        | -           | Primary content.                                                |
+| `text`          | `string`                                 | -           | Manifest-friendly content prop.                                 |
+| `i18nKey`       | `string`                                 | -           | Runtime-resolved fallback key when no content prop is provided. |
+| `level`         | `HeadingLevel`                           | `2`         | Semantic heading level from `1` through `6`.                    |
+| `size`          | `Responsive<HeadingSize>`                | level size  | Visual scale: `display`, `h1` through `h6`.                     |
+| `tone`          | `Responsive<HeadingTone>`                | `'default'` | Semantic text color.                                            |
+| `align`         | `Responsive<HeadingAlign>`               | -           | Text alignment.                                                 |
+| `weight`        | `Responsive<HeadingWeight>`              | recipe      | Optional structured weight override.                            |
+| `italic`        | `boolean`                                | `false`     | Italic style.                                                   |
+| `numberOfLines` | `number`                                 | -           | Native/web truncation line count.                               |
+| `ellipsizeMode` | `'head' \| 'middle' \| 'tail' \| 'clip'` | -           | Truncation behavior.                                            |
+| `selectable`    | `boolean`                                | -           | Allows text selection where supported.                          |
+| `testID`        | `string`                                 | -           | Test id.                                                        |
 
 No inherited props. `HeadingProps` is declared directly by ZORA to keep heading
 usage structured and template-safe.
@@ -163,20 +188,20 @@ responsive props.
 
 ZORA props:
 
-| Prop            | Type                                     | Default     | Notes                                  |
-| --------------- | ---------------------------------------- | ----------- | -------------------------------------- |
-| `children`      | `React.ReactNode`                        | -           | Primary content.                       |
-| `text`          | `string`                                 | -           | Manifest-friendly content prop.        |
-| `i18nKey`       | `string`                                 | -           | Runtime-resolved fallback key when no content prop is provided.              |
-| `variant`       | `Responsive<TextVariant>`                | `'body'`    | Typography recipe.                     |
-| `tone`          | `Responsive<TextTone>`                   | `'default'` | Semantic text color.                   |
-| `align`         | `Responsive<TextAlign>`                  | -           | Text alignment.                        |
-| `weight`        | `Responsive<TextWeight>`                 | recipe      | Optional structured weight override.   |
-| `italic`        | `boolean`                                | `false`     | Italic style.                          |
-| `numberOfLines` | `number`                                 | -           | Native/web truncation line count.      |
-| `ellipsizeMode` | `'head' \| 'middle' \| 'tail' \| 'clip'` | -           | Truncation behavior.                   |
-| `selectable`    | `boolean`                                | -           | Allows text selection where supported. |
-| `testID`        | `string`                                 | -           | Test id.                               |
+| Prop            | Type                                     | Default     | Notes                                                           |
+| --------------- | ---------------------------------------- | ----------- | --------------------------------------------------------------- |
+| `children`      | `React.ReactNode`                        | -           | Primary content.                                                |
+| `text`          | `string`                                 | -           | Manifest-friendly content prop.                                 |
+| `i18nKey`       | `string`                                 | -           | Runtime-resolved fallback key when no content prop is provided. |
+| `variant`       | `Responsive<TextVariant>`                | `'body'`    | Typography recipe.                                              |
+| `tone`          | `Responsive<TextTone>`                   | `'default'` | Semantic text color.                                            |
+| `align`         | `Responsive<TextAlign>`                  | -           | Text alignment.                                                 |
+| `weight`        | `Responsive<TextWeight>`                 | recipe      | Optional structured weight override.                            |
+| `italic`        | `boolean`                                | `false`     | Italic style.                                                   |
+| `numberOfLines` | `number`                                 | -           | Native/web truncation line count.                               |
+| `ellipsizeMode` | `'head' \| 'middle' \| 'tail' \| 'clip'` | -           | Truncation behavior.                                            |
+| `selectable`    | `boolean`                                | -           | Allows text selection where supported.                          |
+| `testID`        | `string`                                 | -           | Test id.                                                        |
 
 No inherited props. `TextProps` is declared directly by ZORA to keep text
 structured and template-safe.
@@ -1310,16 +1335,33 @@ Theme provider that creates the ZORA theme and passes it to Surface
 </ZoraProvider>
 ```
 
+Pass a theme seed to define your app theme:
+
+```tsx
+<ZoraProvider
+  initialMode="dark"
+  theme={{
+    id: 'studio',
+    name: 'Studio',
+    primaryColor: '#0f766e',
+    harmony: 'analogous',
+    tone: 'jewel',
+  }}
+>
+  <App />
+</ZoraProvider>
+```
+
 <details>
 <summary>Props</summary>
 
 ZORA props:
 
-| Prop            | Type                | Default   | Notes                                                           |
-| --------------- | ------------------- | --------- | --------------------------------------------------------------- |
-| `children`      | `React.ReactNode`   | -         | Required app content.                                           |
-| `initialConfig` | `ZoraThemeOverride` | -         | Partial Surface `ThemeConfig` override merged into `zoraTheme`. |
-| `initialMode`   | `'light' \| 'dark'` | `'light'` | Initial theme mode passed to Surface.                           |
+| Prop          | Type                | Default            | Notes                                 |
+| ------------- | ------------------- | ------------------ | ------------------------------------- |
+| `children`    | `React.ReactNode`   | -                  | Required app content.                 |
+| `theme`       | `ZoraTheme`         | `zoraDefaultTheme` | App-facing theme seed for ZORA.       |
+| `initialMode` | `'light' \| 'dark'` | `'light'`          | Initial theme mode passed to Surface. |
 
 Inherited props:
 
@@ -1327,15 +1369,17 @@ No inherited props. `ZoraProviderProps` is declared directly by ZORA.
 
 </details>
 
-### `createZoraTheme`
+### `createZoraThemeConfig`
 
-Creates a Surface `ThemeConfig` by deep-merging overrides into `zoraTheme`.
+Creates a Surface-compatible `ThemeConfig` from a ZORA theme seed.
 
 ```tsx
-const theme = createZoraTheme({
-  light: {
-    primaryColor: '#1d4ed8',
-  },
+const themeConfig = createZoraThemeConfig({
+  id: 'studio',
+  name: 'Studio',
+  primaryColor: '#0f766e',
+  harmony: 'analogous',
+  tone: 'jewel',
 });
 ```
 
@@ -1343,37 +1387,25 @@ const theme = createZoraTheme({
 <summary>API</summary>
 
 ```ts
-type ZoraThemeOverride = Partial<ThemeConfig>;
-
-function createZoraTheme(overrides?: ZoraThemeOverride): ThemeConfig;
+function createZoraThemeConfig(theme?: ZoraTheme): ThemeConfig;
 ```
 
-The returned theme keeps `id: 'zora'` unless explicitly changed by the merge
-input.
-
 </details>
 
-### `zoraTheme`
+### `zoraDefaultTheme`
 
-Default ZORA Surface theme preset.
+Default ZORA theme seed.
 
 <details>
 <summary>Value</summary>
 
 ```ts
-const zoraTheme: ThemeConfig = {
+const zoraDefaultTheme: ZoraTheme = {
   id: 'zora',
   name: 'ZORA',
-  light: {
-    primaryColor: '#0f766e',
-    harmony: 'analogous',
-    systemTone: 'jewel',
-  },
-  dark: {
-    primaryColor: '#2dd4bf',
-    harmony: 'analogous',
-    systemTone: 'jewel',
-  },
+  primaryColor: '#0f766e',
+  harmony: 'analogous',
+  tone: 'jewel',
 };
 ```
 

package/dist/components/button/Button.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import type { ButtonProps } from './types';
-export declare function Button({ tone, emphasis, size, ...props }: ButtonProps): React.JSX.Element;
+export declare const Button: React.FC<ButtonProps>;
 //# sourceMappingURL=Button.d.ts.map

package/dist/components/button/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C,wBAAgB,MAAM,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,qBAMrE"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAiB3C,eAAO,MAAM,MAAM,uBAAkC,CAAC"}

package/dist/components/button/Button.js

@@ -1,8 +1,10 @@
 import { Button as SurfaceButton } from '@ankhorage/surface';
 import React from 'react';
 import { resolveButtonRecipe } from '../../internal/recipes';
-export function Button({ tone, emphasis, size, ...props }) {
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
+function ButtonInner({ themeId: _themeId, mode: _mode, tone, emphasis, size, ...props }) {
     const recipe = resolveButtonRecipe({ tone, emphasis, size });
     return (<SurfaceButton {...props} size={recipe.size} tone={recipe.tone} variant={recipe.variant}/>);
 }
+export const Button = withZoraThemeScope(ButtonInner);
 //# sourceMappingURL=Button.js.map

package/dist/components/button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAC7D,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAG7D,MAAM,UAAU,MAAM,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,GAAG,KAAK,EAAe;IACpE,MAAM,MAAM,GAAG,mBAAmB,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;IAE7D,OAAO,CACL,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,EAAG,CAC5F,CAAC;AACJ,CAAC","sourcesContent":["import { Button as SurfaceButton } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { resolveButtonRecipe } from '../../internal/recipes';\nimport type { ButtonProps } from './types';\n\nexport function Button({ tone, emphasis, size, ...props }: ButtonProps) {\n  const recipe = resolveButtonRecipe({ tone, emphasis, size });\n\n  return (\n    <SurfaceButton {...props} size={recipe.size} tone={recipe.tone} variant={recipe.variant} />\n  );\n}\n"]}
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAC7D,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAC7D,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,WAAW,CAAC,EACnB,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,IAAI,EACJ,QAAQ,EACR,IAAI,EACJ,GAAG,KAAK,EACI;IACZ,MAAM,MAAM,GAAG,mBAAmB,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;IAE7D,OAAO,CACL,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,EAAG,CAC5F,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,MAAM,GAAG,kBAAkB,CAAC,WAAW,CAAC,CAAC","sourcesContent":["import { Button as SurfaceButton } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { resolveButtonRecipe } from '../../internal/recipes';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { ButtonProps } from './types';\n\nfunction ButtonInner({\n  themeId: _themeId,\n  mode: _mode,\n  tone,\n  emphasis,\n  size,\n  ...props\n}: ButtonProps) {\n  const recipe = resolveButtonRecipe({ tone, emphasis, size });\n\n  return (\n    <SurfaceButton {...props} size={recipe.size} tone={recipe.tone} variant={recipe.variant} />\n  );\n}\n\nexport const Button = withZoraThemeScope(ButtonInner);\n"]}

package/dist/components/button/types.d.ts

@@ -1,7 +1,8 @@
 import type { ButtonIconSpec, ButtonProps as SurfaceButtonProps } from '@ankhorage/surface';
 import type React from 'react';
 import type { ZoraControlSize, ZoraEmphasis, ZoraTone } from '../../internal/recipes';
-export interface ButtonProps extends Omit<SurfaceButtonProps, 'children' | 'size' | 'tone' | 'variant'> {
+import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
+export interface ButtonProps extends ZoraBaseProps, Omit<SurfaceButtonProps, 'children' | 'size' | 'tone' | 'variant'> {
     children?: React.ReactNode;
     tone?: ZoraTone;
     emphasis?: ZoraEmphasis;

package/dist/components/button/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/button/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,WAAW,IAAI,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAC5F,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,eAAe,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAEtF,MAAM,WAAW,WAAY,SAAQ,IAAI,CACvC,kBAAkB,EAClB,UAAU,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,CACzC;IACC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,WAAW,CAAC,EAAE,cAAc,CAAC;IAC7B,YAAY,CAAC,EAAE,cAAc,CAAC;CAC/B"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/button/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,WAAW,IAAI,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAC5F,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,eAAe,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AACtF,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,WAAW,WACf,SAAQ,aAAa,EAAE,IAAI,CAAC,kBAAkB,EAAE,UAAU,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IACzF,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,WAAW,CAAC,EAAE,cAAc,CAAC;IAC7B,YAAY,CAAC,EAAE,cAAc,CAAC;CAC/B"}

package/dist/components/button/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/button/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonIconSpec, ButtonProps as SurfaceButtonProps } from '@ankhorage/surface';\nimport type React from 'react';\n\nimport type { ZoraControlSize, ZoraEmphasis, ZoraTone } from '../../internal/recipes';\n\nexport interface ButtonProps extends Omit<\n  SurfaceButtonProps,\n  'children' | 'size' | 'tone' | 'variant'\n> {\n  children?: React.ReactNode;\n  tone?: ZoraTone;\n  emphasis?: ZoraEmphasis;\n  size?: ZoraControlSize;\n  leadingIcon?: ButtonIconSpec;\n  trailingIcon?: ButtonIconSpec;\n}\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/button/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonIconSpec, ButtonProps as SurfaceButtonProps } from '@ankhorage/surface';\nimport type React from 'react';\n\nimport type { ZoraControlSize, ZoraEmphasis, ZoraTone } from '../../internal/recipes';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport interface ButtonProps\n  extends ZoraBaseProps, Omit<SurfaceButtonProps, 'children' | 'size' | 'tone' | 'variant'> {\n  children?: React.ReactNode;\n  tone?: ZoraTone;\n  emphasis?: ZoraEmphasis;\n  size?: ZoraControlSize;\n  leadingIcon?: ButtonIconSpec;\n  trailingIcon?: ButtonIconSpec;\n}\n"]}

package/dist/components/card/Card.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import type { CardProps } from './types';
-export declare function Card({ children, title, description, eyebrow, actions, footer, tone, compact, onPress, ...props }: CardProps): React.JSX.Element;
+export declare const Card: React.FC<CardProps>;
 //# sourceMappingURL=Card.d.ts.map

package/dist/components/card/Card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../src/components/card/Card.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEzC,wBAAgB,IAAI,CAAC,EACnB,QAAQ,EACR,KAAK,EACL,WAAW,EACX,OAAO,EACP,OAAO,EACP,MAAM,EACN,IAAgB,EAChB,OAAe,EACf,OAAO,EACP,GAAG,KAAK,EACT,EAAE,SAAS,qBA+CX"}
+{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../src/components/card/Card.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAgEzC,eAAO,MAAM,IAAI,qBAAgC,CAAC"}

package/dist/components/card/Card.js

@@ -1,9 +1,10 @@
 import { Box, Card as SurfaceCard, Stack } from '@ankhorage/surface';
 import React from 'react';
 import { resolveCardVariant } from '../../internal/recipes';
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
 import { Heading } from '../heading';
 import { Text } from '../text';
-export function Card({ children, title, description, eyebrow, actions, footer, tone = 'default', compact = false, onPress, ...props }) {
+function CardInner({ themeId: _themeId, mode: _mode, children, title, description, eyebrow, actions, footer, tone = 'default', compact = false, onPress, ...props }) {
     const hasHeader = [eyebrow, title, description, actions].some((item) => item != null);
     const hasFooter = footer !== undefined;
     const gap = compact ? 's' : 'm';
@@ -31,4 +32,5 @@ export function Card({ children, title, description, eyebrow, actions, footer, t
       </Stack>
     </SurfaceCard>);
 }
+export const Card = withZoraThemeScope(CardInner);
 //# sourceMappingURL=Card.js.map

package/dist/components/card/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../../src/components/card/Card.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Box, Card as SurfaceCard, Stack } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { resolveCardVariant } from '../../internal/recipes';\nimport { Heading } from '../heading';\nimport { Text } from '../text';\nimport type { CardProps } from './types';\n\nexport function Card({\n  children,\n  title,\n  description,\n  eyebrow,\n  actions,\n  footer,\n  tone = 'default',\n  compact = false,\n  onPress,\n  ...props\n}: CardProps) {\n  const hasHeader = [eyebrow, title, description, actions].some((item) => item != null);\n  const hasFooter = footer !== undefined;\n  const gap = compact ? 's' : 'm';\n  const isInteractive = Boolean(onPress) && !actions;\n\n  return (\n    <SurfaceCard\n      {...props}\n      onPress={isInteractive ? onPress : undefined}\n      p={compact ? 'm' : 'l'}\n      radius=\"l\"\n      variant={resolveCardVariant(tone)}\n    >\n      <Stack gap={gap}>\n        {hasHeader ? (\n          <Stack\n            align={{ base: 'flex-start', md: 'center' }}\n            direction={{ base: 'column', md: 'row' }}\n            gap=\"m\"\n            justify=\"space-between\"\n          >\n            <Box flex={1}>\n              <Stack gap=\"xs\">\n                {eyebrow ? (\n                  <Text tone=\"muted\" variant=\"caption\" weight=\"semiBold\">\n                    {eyebrow}\n                  </Text>\n                ) : null}\n                {title ? <Heading level={compact ? 4 : 3}>{title}</Heading> : null}\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        ) : null}\n\n        {children ? <Box>{children}</Box> : null}\n\n        {hasFooter ? <Box pt=\"xs\">{footer}</Box> : null}\n      </Stack>\n    </SurfaceCard>\n  );\n}\n"]}
+{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../../src/components/card/Card.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Box, Card as SurfaceCard, Stack } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { resolveCardVariant } from '../../internal/recipes';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { Heading } from '../heading';\nimport { Text } from '../text';\nimport type { CardProps } from './types';\n\nfunction CardInner({\n  themeId: _themeId,\n  mode: _mode,\n  children,\n  title,\n  description,\n  eyebrow,\n  actions,\n  footer,\n  tone = 'default',\n  compact = false,\n  onPress,\n  ...props\n}: CardProps) {\n  const hasHeader = [eyebrow, title, description, actions].some((item) => item != null);\n  const hasFooter = footer !== undefined;\n  const gap = compact ? 's' : 'm';\n  const isInteractive = Boolean(onPress) && !actions;\n\n  return (\n    <SurfaceCard\n      {...props}\n      onPress={isInteractive ? onPress : undefined}\n      p={compact ? 'm' : 'l'}\n      radius=\"l\"\n      variant={resolveCardVariant(tone)}\n    >\n      <Stack gap={gap}>\n        {hasHeader ? (\n          <Stack\n            align={{ base: 'flex-start', md: 'center' }}\n            direction={{ base: 'column', md: 'row' }}\n            gap=\"m\"\n            justify=\"space-between\"\n          >\n            <Box flex={1}>\n              <Stack gap=\"xs\">\n                {eyebrow ? (\n                  <Text tone=\"muted\" variant=\"caption\" weight=\"semiBold\">\n                    {eyebrow}\n                  </Text>\n                ) : null}\n                {title ? <Heading level={compact ? 4 : 3}>{title}</Heading> : null}\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        ) : null}\n\n        {children ? <Box>{children}</Box> : null}\n\n        {hasFooter ? <Box pt=\"xs\">{footer}</Box> : null}\n      </Stack>\n    </SurfaceCard>\n  );\n}\n\nexport const Card = withZoraThemeScope(CardInner);\n"]}

package/dist/components/card/types.d.ts

@@ -1,7 +1,8 @@
 import type { CardProps as SurfaceCardProps } from '@ankhorage/surface';
 import type React from 'react';
 import type { ZoraCardTone } from '../../internal/recipes';
-export interface CardProps extends Omit<SurfaceCardProps, 'children' | 'p' | 'radius' | 'variant'> {
+import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
+export interface CardProps extends ZoraBaseProps, Omit<SurfaceCardProps, 'children' | 'p' | 'radius' | 'variant'> {
     children?: React.ReactNode;
     title?: React.ReactNode;
     description?: React.ReactNode;

package/dist/components/card/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/card/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACxE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAE3D,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,gBAAgB,EAAE,UAAU,GAAG,GAAG,GAAG,QAAQ,GAAG,SAAS,CAAC;IAChG,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/card/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACxE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,WAAW,SACf,SAAQ,aAAa,EAAE,IAAI,CAAC,gBAAgB,EAAE,UAAU,GAAG,GAAG,GAAG,QAAQ,GAAG,SAAS,CAAC;IACtF,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB"}

package/dist/components/card/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/card/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { CardProps as SurfaceCardProps } from '@ankhorage/surface';\nimport type React from 'react';\n\nimport type { ZoraCardTone } from '../../internal/recipes';\n\nexport interface CardProps extends Omit<SurfaceCardProps, 'children' | 'p' | 'radius' | 'variant'> {\n  children?: React.ReactNode;\n  title?: React.ReactNode;\n  description?: React.ReactNode;\n  eyebrow?: React.ReactNode;\n  actions?: React.ReactNode;\n  footer?: React.ReactNode;\n  tone?: ZoraCardTone;\n  compact?: boolean;\n}\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/card/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { CardProps as SurfaceCardProps } from '@ankhorage/surface';\nimport type React from 'react';\n\nimport type { ZoraCardTone } from '../../internal/recipes';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport interface CardProps\n  extends ZoraBaseProps, Omit<SurfaceCardProps, 'children' | 'p' | 'radius' | 'variant'> {\n  children?: React.ReactNode;\n  title?: React.ReactNode;\n  description?: React.ReactNode;\n  eyebrow?: React.ReactNode;\n  actions?: React.ReactNode;\n  footer?: React.ReactNode;\n  tone?: ZoraCardTone;\n  compact?: boolean;\n}\n"]}

package/dist/components/heading/Heading.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import type { HeadingProps } from './types';
-export declare function Heading({ children, text, i18nKey, level, size, tone, align, weight, italic, numberOfLines, ellipsizeMode, selectable, accessibilityLabel, accessibilityHint, accessibilityRole, nativeID, testID, }: HeadingProps): React.JSX.Element | null;
+export declare const Heading: React.FC<HeadingProps>;
 //# sourceMappingURL=Heading.d.ts.map

package/dist/components/heading/Heading.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Heading.d.ts","sourceRoot":"","sources":["../../../src/components/heading/Heading.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AA0B5C,wBAAgB,OAAO,CAAC,EACtB,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,KAAS,EACT,IAAI,EACJ,IAAgB,EAChB,KAAK,EACL,MAAM,EACN,MAAc,EACd,aAAa,EACb,aAAa,EACb,UAAU,EACV,kBAAkB,EAClB,iBAAiB,EACjB,iBAA4B,EAC5B,QAAQ,EACR,MAAM,GACP,EAAE,YAAY,4BAmCd"}
+{"version":3,"file":"Heading.d.ts","sourceRoot":"","sources":["../../../src/components/heading/Heading.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAmF5C,eAAO,MAAM,OAAO,wBAAmC,CAAC"}

package/dist/components/heading/Heading.js

@@ -2,6 +2,7 @@ import { resolveResponsive, useResponsiveRuntime } from '@ankhorage/surface';
 import React from 'react';
 import { Text as ReactNativeText } from 'react-native';
 import { useZoraTheme } from '../../theme/useZoraTheme';
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
 import { resolveHeadingRecipe, resolveHeadingSizeFromLevel } from './resolveHeadingRecipe';
 function resolveHeadingContent({ children, text, i18nKey, }) {
     if (children !== undefined) {
@@ -15,7 +16,7 @@ function resolveHeadingContent({ children, text, i18nKey, }) {
     }
     return i18nKey;
 }
-export function Heading({ children, text, i18nKey, level = 2, size, tone = 'default', align, weight, italic = false, numberOfLines, ellipsizeMode, selectable, accessibilityLabel, accessibilityHint, accessibilityRole = 'header', nativeID, testID, }) {
+function HeadingInner({ themeId: _themeId, mode: _mode, children, text, i18nKey, level = 2, size, tone = 'default', align, weight, italic = false, numberOfLines, ellipsizeMode, selectable, accessibilityLabel, accessibilityHint, accessibilityRole = 'header', nativeID, testID, }) {
     const { theme } = useZoraTheme();
     const { breakpoint } = useResponsiveRuntime();
     const content = resolveHeadingContent({ children, text, i18nKey });
@@ -37,4 +38,5 @@ export function Heading({ children, text, i18nKey, level = 2, size, tone = 'defa
       {content}
     </ReactNativeText>);
 }
+export const Heading = withZoraThemeScope(HeadingInner);
 //# sourceMappingURL=Heading.js.map

package/dist/components/heading/Heading.js.map

@@ -1 +1 @@
-{"version":3,"file":"Heading.js","sourceRoot":"","sources":["../../../src/components/heading/Heading.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,oBAAoB,CAAC;AAC7E,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,IAAI,eAAe,EAAE,MAAM,cAAc,CAAC;AAEvD,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,oBAAoB,EAAE,2BAA2B,EAAE,MAAM,wBAAwB,CAAC;AAG3F,SAAS,qBAAqB,CAAC,EAC7B,QAAQ,EACR,IAAI,EACJ,OAAO,GAKR;IACC,IAAI,QAAQ,KAAK,SAAS,EAAE,CAAC;QAC3B,OAAO,QAAQ,CAAC;IAClB,CAAC;IAED,IAAI,IAAI,KAAK,SAAS,EAAE,CAAC;QACvB,OAAO,IAAI,CAAC;IACd,CAAC;IAED,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,OAAO,CAAC;AACjB,CAAC;AAED,MAAM,UAAU,OAAO,CAAC,EACtB,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,KAAK,GAAG,CAAC,EACT,IAAI,EACJ,IAAI,GAAG,SAAS,EAChB,KAAK,EACL,MAAM,EACN,MAAM,GAAG,KAAK,EACd,aAAa,EACb,aAAa,EACb,UAAU,EACV,kBAAkB,EAClB,iBAAiB,EACjB,iBAAiB,GAAG,QAAQ,EAC5B,QAAQ,EACR,MAAM,GACO;IACb,MAAM,EAAE,KAAK,EAAE,GAAG,YAAY,EAAE,CAAC;IACjC,MAAM,EAAE,UAAU,EAAE,GAAG,oBAAoB,EAAE,CAAC;IAC9C,MAAM,OAAO,GAAG,qBAAqB,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,CAAC;IACnE,MAAM,YAAY,GAAG,iBAAiB,CAAC,IAAI,EAAE,UAAU,CAAC,IAAI,2BAA2B,CAAC,KAAK,CAAC,CAAC;IAC/F,MAAM,YAAY,GAAG,iBAAiB,CAAC,IAAI,EAAE,UAAU,CAAC,IAAI,SAAS,CAAC;IACtE,MAAM,aAAa,GAAG,iBAAiB,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC;IAC3D,MAAM,cAAc,GAAG,iBAAiB,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;IAE7D,IAAI,OAAO,KAAK,IAAI,IAAI,OAAO,KAAK,SAAS,EAAE,CAAC;QAC9C,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CACL,CAAC,eAAe,CACd,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,CACrC,kBAAkB,CAAC,CAAC,kBAAkB,CAAC,CACvC,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,CACrC,aAAa,CAAC,CAAC,aAAa,CAAC,CAC7B,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,aAAa,CAAC,CAAC,aAAa,CAAC,CAC7B,UAAU,CAAC,CAAC,UAAU,CAAC,CACvB,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,KAAK,CAAC,CAAC,oBAAoB,CAAC,KAAK,EAAE;YACjC,KAAK,EAAE,aAAa;YACpB,MAAM;YACN,KAAK;YACL,IAAI,EAAE,YAAY;YAClB,IAAI,EAAE,YAAY;YAClB,MAAM,EAAE,cAAc;SACvB,CAAC,CAAC,CAEH;MAAA,CAAC,OAAO,CACV;IAAA,EAAE,eAAe,CAAC,CACnB,CAAC;AACJ,CAAC","sourcesContent":["import { resolveResponsive, useResponsiveRuntime } from '@ankhorage/surface';\nimport React from 'react';\nimport { Text as ReactNativeText } from 'react-native';\n\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { resolveHeadingRecipe, resolveHeadingSizeFromLevel } from './resolveHeadingRecipe';\nimport type { HeadingProps } from './types';\n\nfunction resolveHeadingContent({\n  children,\n  text,\n  i18nKey,\n}: {\n  children: HeadingProps['children'];\n  text: HeadingProps['text'];\n  i18nKey: HeadingProps['i18nKey'];\n}): React.ReactNode {\n  if (children !== undefined) {\n    return children;\n  }\n\n  if (text !== undefined) {\n    return text;\n  }\n\n  if (!i18nKey) {\n    return null;\n  }\n\n  return i18nKey;\n}\n\nexport function Heading({\n  children,\n  text,\n  i18nKey,\n  level = 2,\n  size,\n  tone = 'default',\n  align,\n  weight,\n  italic = false,\n  numberOfLines,\n  ellipsizeMode,\n  selectable,\n  accessibilityLabel,\n  accessibilityHint,\n  accessibilityRole = 'header',\n  nativeID,\n  testID,\n}: HeadingProps) {\n  const { theme } = useZoraTheme();\n  const { breakpoint } = useResponsiveRuntime();\n  const content = resolveHeadingContent({ children, text, i18nKey });\n  const resolvedSize = resolveResponsive(size, breakpoint) ?? resolveHeadingSizeFromLevel(level);\n  const resolvedTone = resolveResponsive(tone, breakpoint) ?? 'default';\n  const resolvedAlign = resolveResponsive(align, breakpoint);\n  const resolvedWeight = resolveResponsive(weight, breakpoint);\n\n  if (content === null || content === undefined) {\n    return null;\n  }\n\n  return (\n    <ReactNativeText\n      accessibilityHint={accessibilityHint}\n      accessibilityLabel={accessibilityLabel}\n      accessibilityRole={accessibilityRole}\n      ellipsizeMode={ellipsizeMode}\n      nativeID={nativeID}\n      numberOfLines={numberOfLines}\n      selectable={selectable}\n      testID={testID}\n      style={resolveHeadingRecipe(theme, {\n        align: resolvedAlign,\n        italic,\n        level,\n        size: resolvedSize,\n        tone: resolvedTone,\n        weight: resolvedWeight,\n      })}\n    >\n      {content}\n    </ReactNativeText>\n  );\n}\n"]}
+{"version":3,"file":"Heading.js","sourceRoot":"","sources":["../../../src/components/heading/Heading.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,oBAAoB,CAAC;AAC7E,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,IAAI,eAAe,EAAE,MAAM,cAAc,CAAC;AAEvD,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACpE,OAAO,EAAE,oBAAoB,EAAE,2BAA2B,EAAE,MAAM,wBAAwB,CAAC;AAG3F,SAAS,qBAAqB,CAAC,EAC7B,QAAQ,EACR,IAAI,EACJ,OAAO,GAKR;IACC,IAAI,QAAQ,KAAK,SAAS,EAAE,CAAC;QAC3B,OAAO,QAAQ,CAAC;IAClB,CAAC;IAED,IAAI,IAAI,KAAK,SAAS,EAAE,CAAC;QACvB,OAAO,IAAI,CAAC;IACd,CAAC;IAED,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,OAAO,CAAC;AACjB,CAAC;AAED,SAAS,YAAY,CAAC,EACpB,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,KAAK,GAAG,CAAC,EACT,IAAI,EACJ,IAAI,GAAG,SAAS,EAChB,KAAK,EACL,MAAM,EACN,MAAM,GAAG,KAAK,EACd,aAAa,EACb,aAAa,EACb,UAAU,EACV,kBAAkB,EAClB,iBAAiB,EACjB,iBAAiB,GAAG,QAAQ,EAC5B,QAAQ,EACR,MAAM,GACO;IACb,MAAM,EAAE,KAAK,EAAE,GAAG,YAAY,EAAE,CAAC;IACjC,MAAM,EAAE,UAAU,EAAE,GAAG,oBAAoB,EAAE,CAAC;IAC9C,MAAM,OAAO,GAAG,qBAAqB,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,CAAC;IACnE,MAAM,YAAY,GAAG,iBAAiB,CAAC,IAAI,EAAE,UAAU,CAAC,IAAI,2BAA2B,CAAC,KAAK,CAAC,CAAC;IAC/F,MAAM,YAAY,GAAG,iBAAiB,CAAC,IAAI,EAAE,UAAU,CAAC,IAAI,SAAS,CAAC;IACtE,MAAM,aAAa,GAAG,iBAAiB,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC;IAC3D,MAAM,cAAc,GAAG,iBAAiB,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;IAE7D,IAAI,OAAO,KAAK,IAAI,IAAI,OAAO,KAAK,SAAS,EAAE,CAAC;QAC9C,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CACL,CAAC,eAAe,CACd,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,CACrC,kBAAkB,CAAC,CAAC,kBAAkB,CAAC,CACvC,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,CACrC,aAAa,CAAC,CAAC,aAAa,CAAC,CAC7B,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,aAAa,CAAC,CAAC,aAAa,CAAC,CAC7B,UAAU,CAAC,CAAC,UAAU,CAAC,CACvB,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,KAAK,CAAC,CAAC,oBAAoB,CAAC,KAAK,EAAE;YACjC,KAAK,EAAE,aAAa;YACpB,MAAM;YACN,KAAK;YACL,IAAI,EAAE,YAAY;YAClB,IAAI,EAAE,YAAY;YAClB,MAAM,EAAE,cAAc;SACvB,CAAC,CAAC,CAEH;MAAA,CAAC,OAAO,CACV;IAAA,EAAE,eAAe,CAAC,CACnB,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,kBAAkB,CAAC,YAAY,CAAC,CAAC","sourcesContent":["import { resolveResponsive, useResponsiveRuntime } from '@ankhorage/surface';\nimport React from 'react';\nimport { Text as ReactNativeText } from 'react-native';\n\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { resolveHeadingRecipe, resolveHeadingSizeFromLevel } from './resolveHeadingRecipe';\nimport type { HeadingProps } from './types';\n\nfunction resolveHeadingContent({\n  children,\n  text,\n  i18nKey,\n}: {\n  children: HeadingProps['children'];\n  text: HeadingProps['text'];\n  i18nKey: HeadingProps['i18nKey'];\n}): React.ReactNode {\n  if (children !== undefined) {\n    return children;\n  }\n\n  if (text !== undefined) {\n    return text;\n  }\n\n  if (!i18nKey) {\n    return null;\n  }\n\n  return i18nKey;\n}\n\nfunction HeadingInner({\n  themeId: _themeId,\n  mode: _mode,\n  children,\n  text,\n  i18nKey,\n  level = 2,\n  size,\n  tone = 'default',\n  align,\n  weight,\n  italic = false,\n  numberOfLines,\n  ellipsizeMode,\n  selectable,\n  accessibilityLabel,\n  accessibilityHint,\n  accessibilityRole = 'header',\n  nativeID,\n  testID,\n}: HeadingProps) {\n  const { theme } = useZoraTheme();\n  const { breakpoint } = useResponsiveRuntime();\n  const content = resolveHeadingContent({ children, text, i18nKey });\n  const resolvedSize = resolveResponsive(size, breakpoint) ?? resolveHeadingSizeFromLevel(level);\n  const resolvedTone = resolveResponsive(tone, breakpoint) ?? 'default';\n  const resolvedAlign = resolveResponsive(align, breakpoint);\n  const resolvedWeight = resolveResponsive(weight, breakpoint);\n\n  if (content === null || content === undefined) {\n    return null;\n  }\n\n  return (\n    <ReactNativeText\n      accessibilityHint={accessibilityHint}\n      accessibilityLabel={accessibilityLabel}\n      accessibilityRole={accessibilityRole}\n      ellipsizeMode={ellipsizeMode}\n      nativeID={nativeID}\n      numberOfLines={numberOfLines}\n      selectable={selectable}\n      testID={testID}\n      style={resolveHeadingRecipe(theme, {\n        align: resolvedAlign,\n        italic,\n        level,\n        size: resolvedSize,\n        tone: resolvedTone,\n        weight: resolvedWeight,\n      })}\n    >\n      {content}\n    </ReactNativeText>\n  );\n}\n\nexport const Heading = withZoraThemeScope(HeadingInner);\n"]}

package/dist/components/heading/types.d.ts

@@ -1,12 +1,13 @@
 import type { Responsive } from '@ankhorage/surface';
 import type React from 'react';
 import type { AccessibilityRole, TextStyle } from 'react-native';
+import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
 export type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
 export type HeadingSize = 'display' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
 export type HeadingTone = 'default' | 'muted' | 'subtle' | 'inverse' | 'primary' | 'danger' | 'success' | 'warning';
 export type HeadingAlign = NonNullable<TextStyle['textAlign']>;
 export type HeadingWeight = 'regular' | 'medium' | 'semiBold' | 'bold';
-export interface HeadingProps {
+export interface HeadingProps extends ZoraBaseProps {
     children?: React.ReactNode;
     text?: string;
     i18nKey?: string;
@@ -23,6 +24,5 @@ export interface HeadingProps {
     accessibilityHint?: string;
     accessibilityRole?: AccessibilityRole;
     nativeID?: string;
-    testID?: string;
 }
 //# sourceMappingURL=types.d.ts.map

package/dist/components/heading/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/heading/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEjE,MAAM,MAAM,YAAY,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAEjD,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE9E,MAAM,MAAM,WAAW,GACnB,SAAS,GACT,OAAO,GACP,QAAQ,GACR,SAAS,GACT,SAAS,GACT,QAAQ,GACR,SAAS,GACT,SAAS,CAAC;AAEd,MAAM,MAAM,YAAY,GAAG,WAAW,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC,CAAC;AAE/D,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,QAAQ,GAAG,UAAU,GAAG,MAAM,CAAC;AAEvE,MAAM,WAAW,YAAY;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,IAAI,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,CAAC;IAC/B,IAAI,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,CAAC;IAC/B,KAAK,CAAC,EAAE,UAAU,CAAC,YAAY,CAAC,CAAC;IACjC,MAAM,CAAC,EAAE,UAAU,CAAC,aAAa,CAAC,CAAC;IACnC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC;IACpD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/heading/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEjE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,MAAM,YAAY,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAEjD,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE9E,MAAM,MAAM,WAAW,GACnB,SAAS,GACT,OAAO,GACP,QAAQ,GACR,SAAS,GACT,SAAS,GACT,QAAQ,GACR,SAAS,GACT,SAAS,CAAC;AAEd,MAAM,MAAM,YAAY,GAAG,WAAW,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC,CAAC;AAE/D,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,QAAQ,GAAG,UAAU,GAAG,MAAM,CAAC;AAEvE,MAAM,WAAW,YAAa,SAAQ,aAAa;IACjD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,IAAI,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,CAAC;IAC/B,IAAI,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,CAAC;IAC/B,KAAK,CAAC,EAAE,UAAU,CAAC,YAAY,CAAC,CAAC;IACjC,MAAM,CAAC,EAAE,UAAU,CAAC,aAAa,CAAC,CAAC;IACnC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC;IACpD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB"}

package/dist/components/heading/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/heading/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { Responsive } from '@ankhorage/surface';\nimport type React from 'react';\nimport type { AccessibilityRole, TextStyle } from 'react-native';\n\nexport type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;\n\nexport type HeadingSize = 'display' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n\nexport type HeadingTone =\n  | 'default'\n  | 'muted'\n  | 'subtle'\n  | 'inverse'\n  | 'primary'\n  | 'danger'\n  | 'success'\n  | 'warning';\n\nexport type HeadingAlign = NonNullable<TextStyle['textAlign']>;\n\nexport type HeadingWeight = 'regular' | 'medium' | 'semiBold' | 'bold';\n\nexport interface HeadingProps {\n  children?: React.ReactNode;\n  text?: string;\n  i18nKey?: string;\n  level?: HeadingLevel;\n  size?: Responsive<HeadingSize>;\n  tone?: Responsive<HeadingTone>;\n  align?: Responsive<HeadingAlign>;\n  weight?: Responsive<HeadingWeight>;\n  italic?: boolean;\n  numberOfLines?: number;\n  ellipsizeMode?: 'head' | 'middle' | 'tail' | 'clip';\n  selectable?: boolean;\n  accessibilityLabel?: string;\n  accessibilityHint?: string;\n  accessibilityRole?: AccessibilityRole;\n  nativeID?: string;\n  testID?: string;\n}\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/heading/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { Responsive } from '@ankhorage/surface';\nimport type React from 'react';\nimport type { AccessibilityRole, TextStyle } from 'react-native';\n\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;\n\nexport type HeadingSize = 'display' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n\nexport type HeadingTone =\n  | 'default'\n  | 'muted'\n  | 'subtle'\n  | 'inverse'\n  | 'primary'\n  | 'danger'\n  | 'success'\n  | 'warning';\n\nexport type HeadingAlign = NonNullable<TextStyle['textAlign']>;\n\nexport type HeadingWeight = 'regular' | 'medium' | 'semiBold' | 'bold';\n\nexport interface HeadingProps extends ZoraBaseProps {\n  children?: React.ReactNode;\n  text?: string;\n  i18nKey?: string;\n  level?: HeadingLevel;\n  size?: Responsive<HeadingSize>;\n  tone?: Responsive<HeadingTone>;\n  align?: Responsive<HeadingAlign>;\n  weight?: Responsive<HeadingWeight>;\n  italic?: boolean;\n  numberOfLines?: number;\n  ellipsizeMode?: 'head' | 'middle' | 'tail' | 'clip';\n  selectable?: boolean;\n  accessibilityLabel?: string;\n  accessibilityHint?: string;\n  accessibilityRole?: AccessibilityRole;\n  nativeID?: string;\n}\n"]}

package/dist/components/icon/Icon.d.ts

@@ -1,5 +1,7 @@
 import { type IconProps as SurfaceIconProps } from '@ankhorage/surface';
 import React from 'react';
-export type IconProps = SurfaceIconProps;
-export declare function Icon(props: IconProps): React.JSX.Element;
+import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
+export interface IconProps extends ZoraBaseProps, SurfaceIconProps {
+}
+export declare const Icon: React.FC<IconProps>;
 //# sourceMappingURL=Icon.d.ts.map

package/dist/components/icon/Icon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../src/components/icon/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,KAAK,SAAS,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAC7F,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,MAAM,SAAS,GAAG,gBAAgB,CAAC;AAEzC,wBAAgB,IAAI,CAAC,KAAK,EAAE,SAAS,qBAEpC"}
+{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../src/components/icon/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,KAAK,SAAS,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAC7F,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,WAAW,SAAU,SAAQ,aAAa,EAAE,gBAAgB;CAAG;AAMrE,eAAO,MAAM,IAAI,qBAAgC,CAAC"}

package/dist/components/icon/Icon.js

@@ -1,6 +1,8 @@
 import { Icon as SurfaceIcon } from '@ankhorage/surface';
 import React from 'react';
-export function Icon(props) {
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
+function IconInner({ themeId: _themeId, mode: _mode, ...props }) {
     return <SurfaceIcon {...props}/>;
 }
+export const Icon = withZoraThemeScope(IconInner);
 //# sourceMappingURL=Icon.js.map

package/dist/components/icon/Icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.js","sourceRoot":"","sources":["../../../src/components/icon/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,IAAI,WAAW,EAAsC,MAAM,oBAAoB,CAAC;AAC7F,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,MAAM,UAAU,IAAI,CAAC,KAAgB;IACnC,OAAO,CAAC,WAAW,CAAC,IAAI,KAAK,CAAC,EAAG,CAAC;AACpC,CAAC","sourcesContent":["import { Icon as SurfaceIcon, type IconProps as SurfaceIconProps } from '@ankhorage/surface';\nimport React from 'react';\n\nexport type IconProps = SurfaceIconProps;\n\nexport function Icon(props: IconProps) {\n  return <SurfaceIcon {...props} />;\n}\n"]}
+{"version":3,"file":"Icon.js","sourceRoot":"","sources":["../../../src/components/icon/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,IAAI,WAAW,EAAsC,MAAM,oBAAoB,CAAC;AAC7F,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAKpE,SAAS,SAAS,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK,EAAa;IACxE,OAAO,CAAC,WAAW,CAAC,IAAI,KAAK,CAAC,EAAG,CAAC;AACpC,CAAC;AAED,MAAM,CAAC,MAAM,IAAI,GAAG,kBAAkB,CAAC,SAAS,CAAC,CAAC","sourcesContent":["import { Icon as SurfaceIcon, type IconProps as SurfaceIconProps } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport interface IconProps extends ZoraBaseProps, SurfaceIconProps {}\n\nfunction IconInner({ themeId: _themeId, mode: _mode, ...props }: IconProps) {\n  return <SurfaceIcon {...props} />;\n}\n\nexport const Icon = withZoraThemeScope(IconInner);\n"]}

package/dist/components/icon-button/IconButton.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import type { IconButtonProps } from './types';
-export declare function IconButton({ icon, label, emphasis, tone, size, ...props }: IconButtonProps): React.JSX.Element;
+export declare const IconButton: React.FC<IconButtonProps>;
 //# sourceMappingURL=IconButton.d.ts.map

package/dist/components/icon-button/IconButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../src/components/icon-button/IconButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,KAAK,EACL,QAAkB,EAClB,IAAgB,EAChB,IAAU,EACV,GAAG,KAAK,EACT,EAAE,eAAe,qBAajB"}
+{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../src/components/icon-button/IconButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AA0B/C,eAAO,MAAM,UAAU,2BAAsC,CAAC"}

package/dist/components/icon-button/IconButton.js

@@ -1,8 +1,10 @@
 import { IconButton as SurfaceIconButton } from '@ankhorage/surface';
 import React from 'react';
 import { resolveButtonRecipe } from '../../internal/recipes';
-export function IconButton({ icon, label, emphasis = 'ghost', tone = 'neutral', size = 'm', ...props }) {
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
+function IconButtonInner({ themeId: _themeId, mode: _mode, icon, label, emphasis = 'ghost', tone = 'neutral', size = 'm', ...props }) {
     const recipe = resolveButtonRecipe({ emphasis, tone, size });
     return (<SurfaceIconButton {...props} icon={icon} accessibilityLabel={label} size={recipe.size} tone={recipe.tone} variant={recipe.variant}/>);
 }
+export const IconButton = withZoraThemeScope(IconButtonInner);
 //# sourceMappingURL=IconButton.js.map

package/dist/components/icon-button/IconButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.js","sourceRoot":"","sources":["../../../src/components/icon-button/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,IAAI,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AACrE,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAG7D,MAAM,UAAU,UAAU,CAAC,EACzB,IAAI,EACJ,KAAK,EACL,QAAQ,GAAG,OAAO,EAClB,IAAI,GAAG,SAAS,EAChB,IAAI,GAAG,GAAG,EACV,GAAG,KAAK,EACQ;IAChB,MAAM,MAAM,GAAG,mBAAmB,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;IAE7D,OAAO,CACL,CAAC,iBAAiB,CAChB,IAAI,KAAK,CAAC,CACV,IAAI,CAAC,CAAC,IAAI,CAAC,CACX,kBAAkB,CAAC,CAAC,KAAK,CAAC,CAC1B,IAAI,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAClB,IAAI,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAClB,OAAO,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,EACxB,CACH,CAAC;AACJ,CAAC","sourcesContent":["import { IconButton as SurfaceIconButton } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { resolveButtonRecipe } from '../../internal/recipes';\nimport type { IconButtonProps } from './types';\n\nexport function IconButton({\n  icon,\n  label,\n  emphasis = 'ghost',\n  tone = 'neutral',\n  size = 'm',\n  ...props\n}: IconButtonProps) {\n  const recipe = resolveButtonRecipe({ emphasis, tone, size });\n\n  return (\n    <SurfaceIconButton\n      {...props}\n      icon={icon}\n      accessibilityLabel={label}\n      size={recipe.size}\n      tone={recipe.tone}\n      variant={recipe.variant}\n    />\n  );\n}\n"]}
+{"version":3,"file":"IconButton.js","sourceRoot":"","sources":["../../../src/components/icon-button/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,IAAI,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AACrE,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAC7D,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,eAAe,CAAC,EACvB,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,IAAI,EACJ,KAAK,EACL,QAAQ,GAAG,OAAO,EAClB,IAAI,GAAG,SAAS,EAChB,IAAI,GAAG,GAAG,EACV,GAAG,KAAK,EACQ;IAChB,MAAM,MAAM,GAAG,mBAAmB,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;IAE7D,OAAO,CACL,CAAC,iBAAiB,CAChB,IAAI,KAAK,CAAC,CACV,IAAI,CAAC,CAAC,IAAI,CAAC,CACX,kBAAkB,CAAC,CAAC,KAAK,CAAC,CAC1B,IAAI,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAClB,IAAI,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAClB,OAAO,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,EACxB,CACH,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,kBAAkB,CAAC,eAAe,CAAC,CAAC","sourcesContent":["import { IconButton as SurfaceIconButton } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { resolveButtonRecipe } from '../../internal/recipes';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { IconButtonProps } from './types';\n\nfunction IconButtonInner({\n  themeId: _themeId,\n  mode: _mode,\n  icon,\n  label,\n  emphasis = 'ghost',\n  tone = 'neutral',\n  size = 'm',\n  ...props\n}: IconButtonProps) {\n  const recipe = resolveButtonRecipe({ emphasis, tone, size });\n\n  return (\n    <SurfaceIconButton\n      {...props}\n      icon={icon}\n      accessibilityLabel={label}\n      size={recipe.size}\n      tone={recipe.tone}\n      variant={recipe.variant}\n    />\n  );\n}\n\nexport const IconButton = withZoraThemeScope(IconButtonInner);\n"]}

package/dist/components/icon-button/types.d.ts

@@ -1,6 +1,7 @@
 import type { ButtonIconSpec } from '@ankhorage/surface';
 import type { ZoraControlSize, ZoraEmphasis, ZoraTone } from '../../internal/recipes';
-export interface IconButtonProps {
+import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
+export interface IconButtonProps extends ZoraBaseProps {
     icon: ButtonIconSpec;
     label: string;
     emphasis?: ZoraEmphasis;

package/dist/components/icon-button/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/icon-button/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAEzD,OAAO,KAAK,EAAE,eAAe,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAEtF,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,cAAc,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/icon-button/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAEzD,OAAO,KAAK,EAAE,eAAe,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AACtF,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,WAAW,eAAgB,SAAQ,aAAa;IACpD,IAAI,EAAE,cAAc,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}

package/dist/components/icon-button/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/icon-button/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonIconSpec } from '@ankhorage/surface';\n\nimport type { ZoraControlSize, ZoraEmphasis, ZoraTone } from '../../internal/recipes';\n\nexport interface IconButtonProps {\n  icon: ButtonIconSpec;\n  label: string;\n  emphasis?: ZoraEmphasis;\n  tone?: ZoraTone;\n  size?: ZoraControlSize;\n  disabled?: boolean;\n  loading?: boolean;\n  onPress?: () => void;\n  testID?: string;\n}\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/icon-button/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonIconSpec } from '@ankhorage/surface';\n\nimport type { ZoraControlSize, ZoraEmphasis, ZoraTone } from '../../internal/recipes';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport interface IconButtonProps extends ZoraBaseProps {\n  icon: ButtonIconSpec;\n  label: string;\n  emphasis?: ZoraEmphasis;\n  tone?: ZoraTone;\n  size?: ZoraControlSize;\n  disabled?: boolean;\n  loading?: boolean;\n  onPress?: () => void;\n  testID?: string;\n}\n"]}

package/dist/components/text/Text.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import type { TextProps } from './types';
-export declare function Text({ children, text, i18nKey, variant, tone, align, weight, italic, numberOfLines, ellipsizeMode, selectable, accessibilityLabel, accessibilityHint, accessibilityRole, nativeID, testID, }: TextProps): React.JSX.Element | null;
+export declare const Text: React.FC<TextProps>;
 //# sourceMappingURL=Text.d.ts.map