@ankhorage/zora 0.10.0 → 0.11.0

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## 0.11.0
+
+### Minor Changes
+
+- a600848: Expands scoped theme support across public ZORA components, layouts, patterns, and foundation primitives through shared `themeId` and `mode` base props.
+
 ## 0.10.0
 
 ### Minor Changes

package/README.md

@@ -90,8 +90,29 @@ export function App({ appTheme }: { appTheme: ZoraTheme }) {
 }
 ```
 
-In Plan 2, `mode` is a declarative render-scope override. Calling `setMode` from
-`useZoraTheme()` still targets the root theme provider.
+`mode` and `themeId` are available on public ZORA components through `ZoraBaseProps`.
+Use component props for local component/subtree overrides.
+
+Use `ZoraThemeScope` when the scope is conceptual and does not belong to one specific component:
+
+```tsx
+import React from 'react';
+import { SidebarLayout, Text, ZoraProvider, ZoraThemeScope, type ZoraTheme } from '@ankhorage/zora';
+
+export function App({ appTheme }: { appTheme: ZoraTheme }) {
+  return (
+    <ZoraProvider theme={appTheme} initialMode="light">
+      <ZoraThemeScope mode="dark">
+        <SidebarLayout sidebar={<Text>Sidebar</Text>}>
+          <Text>Everything inside uses dark mode.</Text>
+        </SidebarLayout>
+      </ZoraThemeScope>
+    </ZoraProvider>
+  );
+}
+```
+
+`themeId` currently accepts the inherited theme id. Full theme registries arrive in a later phase.
 
 ## Foundation primitives
 

package/dist/components/badge/Badge.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import type { BadgeProps } from './types';
-export declare function Badge({ children, tone, emphasis, size, ...props }: BadgeProps): React.JSX.Element;
+export declare const Badge: (props: BadgeProps) => React.ReactElement | null;
 //# sourceMappingURL=Badge.d.ts.map

package/dist/components/badge/Badge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../src/components/badge/Badge.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C,wBAAgB,KAAK,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,UAAU,qBAY7E"}
+{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../src/components/badge/Badge.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAwB1C,eAAO,MAAM,KAAK,kDAAiC,CAAC"}

package/dist/components/badge/Badge.js

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

package/dist/components/badge/Badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../../../src/components/badge/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAC3D,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAG5D,MAAM,UAAU,KAAK,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,GAAG,KAAK,EAAc;IAC5E,MAAM,MAAM,GAAG,kBAAkB,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;IAE5D,OAAO,CACL,CAAC,YAAY,CACX,IAAI,KAAK,CAAC,CACV,OAAO,CAAC,CAAC,QAAQ,CAAC,CAClB,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 { Badge as SurfaceBadge } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { resolveBadgeRecipe } from '../../internal/recipes';\nimport type { BadgeProps } from './types';\n\nexport function Badge({ children, tone, emphasis, size, ...props }: BadgeProps) {\n  const recipe = resolveBadgeRecipe({ tone, emphasis, size });\n\n  return (\n    <SurfaceBadge\n      {...props}\n      content={children}\n      size={recipe.size}\n      tone={recipe.tone}\n      variant={recipe.variant}\n    />\n  );\n}\n"]}
+{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../../../src/components/badge/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAC3D,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,UAAU,CAAC,EAClB,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,IAAI,EACJ,GAAG,KAAK,EACG;IACX,MAAM,MAAM,GAAG,kBAAkB,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;IAE5D,OAAO,CACL,CAAC,YAAY,CACX,IAAI,KAAK,CAAC,CACV,OAAO,CAAC,CAAC,QAAQ,CAAC,CAClB,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,KAAK,GAAG,kBAAkB,CAAC,UAAU,CAAC,CAAC","sourcesContent":["import { Badge as SurfaceBadge } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { resolveBadgeRecipe } from '../../internal/recipes';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { BadgeProps } from './types';\n\nfunction BadgeInner({\n  themeId: _themeId,\n  mode: _mode,\n  children,\n  tone,\n  emphasis,\n  size,\n  ...props\n}: BadgeProps) {\n  const recipe = resolveBadgeRecipe({ tone, emphasis, size });\n\n  return (\n    <SurfaceBadge\n      {...props}\n      content={children}\n      size={recipe.size}\n      tone={recipe.tone}\n      variant={recipe.variant}\n    />\n  );\n}\n\nexport const Badge = withZoraThemeScope(BadgeInner);\n"]}

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/badge/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,IAAI,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAC1E,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAE3F,MAAM,WAAW,UAAW,SAAQ,IAAI,CACtC,iBAAiB,EACjB,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,CACxC;IACC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,IAAI,CAAC,EAAE,eAAe,CAAC;CACxB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/badge/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,IAAI,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAC1E,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAC3F,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,WAAW,UACf,SACE,aAAa,EACb,IAAI,CAAC,iBAAiB,EAAE,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,CAAC;IACvF,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,IAAI,CAAC,EAAE,eAAe,CAAC;CACxB"}

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

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

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

@@ -1,4 +1,4 @@
 import React from 'react';
 import type { ButtonProps } from './types';
-export declare const Button: React.FC<ButtonProps>;
+export declare const Button: (props: ButtonProps) => React.ReactElement | null;
 //# 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;AAI1B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAiB3C,eAAO,MAAM,MAAM,uBAAkC,CAAC"}
+{"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,mDAAkC,CAAC"}

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

@@ -1,4 +1,4 @@
 import React from 'react';
 import type { CardProps } from './types';
-export declare const Card: React.FC<CardProps>;
+export declare const Card: (props: CardProps) => React.ReactElement | null;
 //# 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;AAM1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAgEzC,eAAO,MAAM,IAAI,qBAAgC,CAAC"}
+{"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,iDAAgC,CAAC"}

package/dist/components/checkbox/Checkbox.d.ts

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

package/dist/components/checkbox/Checkbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/checkbox/Checkbox.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAM7C,eAAO,MAAM,QAAQ,qDAAoC,CAAC"}

package/dist/components/checkbox/Checkbox.js

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

package/dist/components/checkbox/Checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../src/components/checkbox/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,IAAI,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,aAAa,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK,EAAiB;IAChF,OAAO,CAAC,eAAe,CAAC,IAAI,KAAK,CAAC,EAAG,CAAC;AACxC,CAAC;AAED,MAAM,CAAC,MAAM,QAAQ,GAAG,kBAAkB,CAAC,aAAa,CAAC,CAAC","sourcesContent":["import { Checkbox as SurfaceCheckbox } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { CheckboxProps } from './types';\n\nfunction CheckboxInner({ themeId: _themeId, mode: _mode, ...props }: CheckboxProps) {\n  return <SurfaceCheckbox {...props} />;\n}\n\nexport const Checkbox = withZoraThemeScope(CheckboxInner);\n"]}

package/dist/components/checkbox/CheckboxGroup.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import type { CheckboxGroupProps } from './types';
-export declare function CheckboxGroup<TValue extends string>({ value, onValueChange, options, orientation, gap, tone, size, invalid, readOnly, disabled, testID, }: CheckboxGroupProps<TValue>): React.JSX.Element;
+export declare const CheckboxGroup: <TValue extends string>(props: CheckboxGroupProps<TValue>) => React.ReactElement | null;
 //# sourceMappingURL=CheckboxGroup.d.ts.map

package/dist/components/checkbox/CheckboxGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxGroup.d.ts","sourceRoot":"","sources":["../../../src/components/checkbox/CheckboxGroup.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAuB,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAEvE,wBAAgB,aAAa,CAAC,MAAM,SAAS,MAAM,EAAE,EACnD,KAAK,EACL,aAAa,EACb,OAAO,EACP,WAAwB,EACxB,GAAS,EACT,IAAgB,EAChB,IAAU,EACV,OAAe,EACf,QAAgB,EAChB,QAAgB,EAChB,MAAM,GACP,EAAE,kBAAkB,CAAC,MAAM,CAAC,qBAkC5B"}
+{"version":3,"file":"CheckboxGroup.d.ts","sourceRoot":"","sources":["../../../src/components/checkbox/CheckboxGroup.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAuB,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAoDvE,eAAO,MAAM,aAAa,GAlDE,MAAM,SAAS,MAAM,iEAkDkB,CAAC"}

package/dist/components/checkbox/CheckboxGroup.js

@@ -1,8 +1,9 @@
 import { Checkbox, Stack } from '@ankhorage/surface';
 import React from 'react';
 import { View } from 'react-native';
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
 import { Text } from '../text';
-export function CheckboxGroup({ value, onValueChange, options, orientation = 'vertical', gap = 's', tone = 'primary', size = 'm', invalid = false, readOnly = false, disabled = false, testID, }) {
+function CheckboxGroupInner({ themeId: _themeId, mode: _mode, value, onValueChange, options, orientation = 'vertical', gap = 's', tone = 'primary', size = 'm', invalid = false, readOnly = false, disabled = false, testID, }) {
     const selectedValues = new Set(value);
     const isHorizontal = orientation === 'horizontal';
     return (<View testID={testID} style={{
@@ -14,6 +15,7 @@ export function CheckboxGroup({ value, onValueChange, options, orientation = 've
       </Stack>
     </View>);
 }
+export const CheckboxGroup = withZoraThemeScope(CheckboxGroupInner);
 function CheckboxGroupItem({ option, checked, disabled, invalid, readOnly, size, tone, value, onValueChange, }) {
     return (<Checkbox checked={checked} disabled={disabled} invalid={invalid} readOnly={readOnly} size={size} tone={tone} testID={option.testID} onCheckedChange={(nextChecked) => {
             const nextValue = nextChecked

package/dist/components/checkbox/CheckboxGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxGroup.js","sourceRoot":"","sources":["../../../src/components/checkbox/CheckboxGroup.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Checkbox, Stack } from '@ankhorage/surface';\nimport React from 'react';\nimport { View } from 'react-native';\n\nimport { Text } from '../text';\nimport type { CheckboxGroupOption, CheckboxGroupProps } from './types';\n\nexport function CheckboxGroup<TValue extends string>({\n  value,\n  onValueChange,\n  options,\n  orientation = 'vertical',\n  gap = 's',\n  tone = 'primary',\n  size = 'm',\n  invalid = false,\n  readOnly = false,\n  disabled = false,\n  testID,\n}: CheckboxGroupProps<TValue>) {\n  const selectedValues = new Set(value);\n  const isHorizontal = orientation === 'horizontal';\n\n  return (\n    <View\n      testID={testID}\n      style={{\n        flexDirection: isHorizontal ? 'row' : 'column',\n        flexWrap: isHorizontal ? 'wrap' : 'nowrap',\n      }}\n    >\n      <Stack\n        direction={isHorizontal ? 'row' : 'column'}\n        gap={gap}\n        wrap={isHorizontal ? 'wrap' : 'nowrap'}\n      >\n        {options.map((option) => (\n          <CheckboxGroupItem\n            key={option.value}\n            option={option}\n            checked={selectedValues.has(option.value)}\n            disabled={disabled || option.disabled === true}\n            invalid={invalid}\n            readOnly={readOnly}\n            size={size}\n            tone={tone}\n            value={value}\n            onValueChange={onValueChange}\n          />\n        ))}\n      </Stack>\n    </View>\n  );\n}\n\nfunction CheckboxGroupItem<TValue extends string>({\n  option,\n  checked,\n  disabled,\n  invalid,\n  readOnly,\n  size,\n  tone,\n  value,\n  onValueChange,\n}: {\n  option: CheckboxGroupOption<TValue>;\n  checked: boolean;\n  disabled: boolean;\n  invalid: boolean;\n  readOnly: boolean;\n  size: NonNullable<CheckboxGroupProps<TValue>['size']>;\n  tone: NonNullable<CheckboxGroupProps<TValue>['tone']>;\n  value: readonly TValue[];\n  onValueChange: (value: TValue[]) => void;\n}) {\n  return (\n    <Checkbox\n      checked={checked}\n      disabled={disabled}\n      invalid={invalid}\n      readOnly={readOnly}\n      size={size}\n      tone={tone}\n      testID={option.testID}\n      onCheckedChange={(nextChecked) => {\n        const nextValue = nextChecked\n          ? [...value, option.value]\n          : value.filter((currentValue) => currentValue !== option.value);\n\n        onValueChange(nextValue);\n      }}\n    >\n      <Stack gap=\"xs\">\n        <Text>{option.label}</Text>\n        {option.description ? (\n          <Text variant=\"caption\" tone=\"muted\">\n            {option.description}\n          </Text>\n        ) : null}\n      </Stack>\n    </Checkbox>\n  );\n}\n"]}
+{"version":3,"file":"CheckboxGroup.js","sourceRoot":"","sources":["../../../src/components/checkbox/CheckboxGroup.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Checkbox, Stack } from '@ankhorage/surface';\nimport React from 'react';\nimport { View } from 'react-native';\n\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { Text } from '../text';\nimport type { CheckboxGroupOption, CheckboxGroupProps } from './types';\n\nfunction CheckboxGroupInner<TValue extends string>({\n  themeId: _themeId,\n  mode: _mode,\n  value,\n  onValueChange,\n  options,\n  orientation = 'vertical',\n  gap = 's',\n  tone = 'primary',\n  size = 'm',\n  invalid = false,\n  readOnly = false,\n  disabled = false,\n  testID,\n}: CheckboxGroupProps<TValue>) {\n  const selectedValues = new Set(value);\n  const isHorizontal = orientation === 'horizontal';\n\n  return (\n    <View\n      testID={testID}\n      style={{\n        flexDirection: isHorizontal ? 'row' : 'column',\n        flexWrap: isHorizontal ? 'wrap' : 'nowrap',\n      }}\n    >\n      <Stack\n        direction={isHorizontal ? 'row' : 'column'}\n        gap={gap}\n        wrap={isHorizontal ? 'wrap' : 'nowrap'}\n      >\n        {options.map((option) => (\n          <CheckboxGroupItem\n            key={option.value}\n            option={option}\n            checked={selectedValues.has(option.value)}\n            disabled={disabled || option.disabled === true}\n            invalid={invalid}\n            readOnly={readOnly}\n            size={size}\n            tone={tone}\n            value={value}\n            onValueChange={onValueChange}\n          />\n        ))}\n      </Stack>\n    </View>\n  );\n}\n\nexport const CheckboxGroup = withZoraThemeScope(CheckboxGroupInner);\n\nfunction CheckboxGroupItem<TValue extends string>({\n  option,\n  checked,\n  disabled,\n  invalid,\n  readOnly,\n  size,\n  tone,\n  value,\n  onValueChange,\n}: {\n  option: CheckboxGroupOption<TValue>;\n  checked: boolean;\n  disabled: boolean;\n  invalid: boolean;\n  readOnly: boolean;\n  size: NonNullable<CheckboxGroupProps<TValue>['size']>;\n  tone: NonNullable<CheckboxGroupProps<TValue>['tone']>;\n  value: readonly TValue[];\n  onValueChange: (value: TValue[]) => void;\n}) {\n  return (\n    <Checkbox\n      checked={checked}\n      disabled={disabled}\n      invalid={invalid}\n      readOnly={readOnly}\n      size={size}\n      tone={tone}\n      testID={option.testID}\n      onCheckedChange={(nextChecked) => {\n        const nextValue = nextChecked\n          ? [...value, option.value]\n          : value.filter((currentValue) => currentValue !== option.value);\n\n        onValueChange(nextValue);\n      }}\n    >\n      <Stack gap=\"xs\">\n        <Text>{option.label}</Text>\n        {option.description ? (\n          <Text variant=\"caption\" tone=\"muted\">\n            {option.description}\n          </Text>\n        ) : null}\n      </Stack>\n    </Checkbox>\n  );\n}\n"]}

package/dist/components/checkbox/index.d.ts

@@ -1,5 +1,4 @@
+export { Checkbox } from './Checkbox';
 export { CheckboxGroup } from './CheckboxGroup';
-export type { CheckboxGroupOption, CheckboxGroupProps } from './types';
-export type { CheckboxProps } from '@ankhorage/surface';
-export { Checkbox } from '@ankhorage/surface';
+export type { CheckboxGroupOption, CheckboxGroupProps, CheckboxProps } from './types';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/checkbox/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/checkbox/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,YAAY,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AACvE,YAAY,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACxD,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/checkbox/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,YAAY,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC"}

package/dist/components/checkbox/index.js

@@ -1,3 +1,3 @@
+export { Checkbox } from './Checkbox';
 export { CheckboxGroup } from './CheckboxGroup';
-export { Checkbox } from '@ankhorage/surface';
 //# sourceMappingURL=index.js.map

package/dist/components/checkbox/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/checkbox/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAGhD,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC","sourcesContent":["export { CheckboxGroup } from './CheckboxGroup';\nexport type { CheckboxGroupOption, CheckboxGroupProps } from './types';\nexport type { CheckboxProps } from '@ankhorage/surface';\nexport { Checkbox } from '@ankhorage/surface';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/checkbox/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC","sourcesContent":["export { Checkbox } from './Checkbox';\nexport { CheckboxGroup } from './CheckboxGroup';\nexport type { CheckboxGroupOption, CheckboxGroupProps, CheckboxProps } from './types';\n"]}

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

@@ -1,5 +1,8 @@
-import type { CheckboxProps } from '@ankhorage/surface';
+import type { CheckboxProps as SurfaceCheckboxProps } from '@ankhorage/surface';
 import type React from 'react';
+import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
+export interface CheckboxProps extends ZoraBaseProps, Omit<SurfaceCheckboxProps, 'mode' | 'themeId'> {
+}
 export interface CheckboxGroupOption<TValue extends string> {
     value: TValue;
     label: React.ReactNode;
@@ -7,7 +10,7 @@ export interface CheckboxGroupOption<TValue extends string> {
     disabled?: boolean;
     testID?: string;
 }
-export interface CheckboxGroupProps<TValue extends string> extends Pick<CheckboxProps, 'tone' | 'size' | 'invalid' | 'readOnly' | 'disabled' | 'testID'> {
+export interface CheckboxGroupProps<TValue extends string> extends ZoraBaseProps, Pick<Omit<SurfaceCheckboxProps, 'mode' | 'themeId'>, 'tone' | 'size' | 'invalid' | 'readOnly' | 'disabled'> {
     value: readonly TValue[];
     onValueChange: (value: TValue[]) => void;
     options: readonly CheckboxGroupOption<TValue>[];

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/checkbox/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACxD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,WAAW,mBAAmB,CAAC,MAAM,SAAS,MAAM;IACxD,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,kBAAkB,CAAC,MAAM,SAAS,MAAM,CAAE,SAAQ,IAAI,CACrE,aAAa,EACb,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,UAAU,GAAG,QAAQ,CACjE;IACC,KAAK,EAAE,SAAS,MAAM,EAAE,CAAC;IACzB,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACzC,OAAO,EAAE,SAAS,mBAAmB,CAAC,MAAM,CAAC,EAAE,CAAC;IAChD,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,GAAG,CAAC,EAAE,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;CAC9B"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/checkbox/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,IAAI,oBAAoB,EAAE,MAAM,oBAAoB,CAAC;AAChF,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,WAAW,aACf,SAAQ,aAAa,EAAE,IAAI,CAAC,oBAAoB,EAAE,MAAM,GAAG,SAAS,CAAC;CAAG;AAE1E,MAAM,WAAW,mBAAmB,CAAC,MAAM,SAAS,MAAM;IACxD,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,kBAAkB,CAAC,MAAM,SAAS,MAAM,CACvD,SACE,aAAa,EACb,IAAI,CACF,IAAI,CAAC,oBAAoB,EAAE,MAAM,GAAG,SAAS,CAAC,EAC9C,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,UAAU,CACtD;IACH,KAAK,EAAE,SAAS,MAAM,EAAE,CAAC;IACzB,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACzC,OAAO,EAAE,SAAS,mBAAmB,CAAC,MAAM,CAAC,EAAE,CAAC;IAChD,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,GAAG,CAAC,EAAE,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;CAC9B"}

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

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/checkbox/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { CheckboxProps } from '@ankhorage/surface';\nimport type React from 'react';\n\nexport interface CheckboxGroupOption<TValue extends string> {\n  value: TValue;\n  label: React.ReactNode;\n  description?: React.ReactNode;\n  disabled?: boolean;\n  testID?: string;\n}\n\nexport interface CheckboxGroupProps<TValue extends string> extends Pick<\n  CheckboxProps,\n  'tone' | 'size' | 'invalid' | 'readOnly' | 'disabled' | 'testID'\n> {\n  value: readonly TValue[];\n  onValueChange: (value: TValue[]) => void;\n  options: readonly CheckboxGroupOption<TValue>[];\n  orientation?: 'horizontal' | 'vertical';\n  gap?: 'xs' | 's' | 'm' | 'l';\n}\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/checkbox/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { CheckboxProps as SurfaceCheckboxProps } from '@ankhorage/surface';\nimport type React from 'react';\n\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport interface CheckboxProps\n  extends ZoraBaseProps, Omit<SurfaceCheckboxProps, 'mode' | 'themeId'> {}\n\nexport interface CheckboxGroupOption<TValue extends string> {\n  value: TValue;\n  label: React.ReactNode;\n  description?: React.ReactNode;\n  disabled?: boolean;\n  testID?: string;\n}\n\nexport interface CheckboxGroupProps<TValue extends string>\n  extends\n    ZoraBaseProps,\n    Pick<\n      Omit<SurfaceCheckboxProps, 'mode' | 'themeId'>,\n      'tone' | 'size' | 'invalid' | 'readOnly' | 'disabled'\n    > {\n  value: readonly TValue[];\n  onValueChange: (value: TValue[]) => void;\n  options: readonly CheckboxGroupOption<TValue>[];\n  orientation?: 'horizontal' | 'vertical';\n  gap?: 'xs' | 's' | 'm' | 'l';\n}\n"]}

package/dist/components/drawer/Drawer.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import type { DrawerProps } from './types';
-export declare function Drawer({ children, title, description, footer, onDismiss, ...props }: DrawerProps): React.JSX.Element;
+export declare const Drawer: (props: DrawerProps) => React.ReactElement | null;
 //# sourceMappingURL=Drawer.d.ts.map

package/dist/components/drawer/Drawer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../../src/components/drawer/Drawer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAI9D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAc3C,wBAAgB,MAAM,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,qBAsBhG"}
+{"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../../src/components/drawer/Drawer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAK9D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AA+C3C,eAAO,MAAM,MAAM,mDAAkC,CAAC"}

package/dist/components/drawer/Drawer.js

@@ -1,5 +1,6 @@
 import { Box, Drawer as SurfaceDrawer, Stack } from '@ankhorage/surface';
 import React, { useCallback, useEffect, useRef } from 'react';
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
 import { Heading } from '../heading';
 import { Text } from '../text';
 function useStableCallback(callback) {
@@ -11,7 +12,7 @@ function useStableCallback(callback) {
         callbackRef.current?.();
     }, []);
 }
-export function Drawer({ children, title, description, footer, onDismiss, ...props }) {
+function DrawerInner({ themeId: _themeId, mode: _mode, children, title, description, footer, onDismiss, ...props }) {
     const hasHeader = title != null || description != null;
     const stableOnDismiss = useStableCallback(onDismiss);
     return (<SurfaceDrawer {...props} onDismiss={stableOnDismiss}>
@@ -27,4 +28,5 @@ export function Drawer({ children, title, description, footer, onDismiss, ...pro
       </Stack>
     </SurfaceDrawer>);
 }
+export const Drawer = withZoraThemeScope(DrawerInner);
 //# sourceMappingURL=Drawer.js.map

package/dist/components/drawer/Drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/components/drawer/Drawer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,IAAI,aAAa,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AACzE,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE9D,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAG/B,SAAS,iBAAiB,CAAC,QAAkC;IAC3D,MAAM,WAAW,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC;IAErC,SAAS,CAAC,GAAG,EAAE;QACb,WAAW,CAAC,OAAO,GAAG,QAAQ,CAAC;IACjC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,OAAO,WAAW,CAAC,GAAG,EAAE;QACtB,WAAW,CAAC,OAAO,EAAE,EAAE,CAAC;IAC1B,CAAC,EAAE,EAAE,CAAC,CAAC;AACT,CAAC;AAED,MAAM,UAAU,MAAM,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,EAAe;IAC/F,MAAM,SAAS,GAAG,KAAK,IAAI,IAAI,IAAI,WAAW,IAAI,IAAI,CAAC;IACvD,MAAM,eAAe,GAAG,iBAAiB,CAAC,SAAS,CAAC,CAAC;IAErD,OAAO,CACL,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,CAAC,SAAS,CAAC,CAAC,eAAe,CAAC,CACnD;MAAA,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CACZ;QAAA,CAAC,SAAS,CAAC,CAAC,CAAC,CACX,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CACb;YAAA,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI,CACpD;YAAA,CAAC,WAAW,CAAC,CAAC,CAAC,CACb,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,WAAW,CACpC;gBAAA,CAAC,WAAW,CACd;cAAA,EAAE,IAAI,CAAC,CACR,CAAC,CAAC,CAAC,IAAI,CACV;UAAA,EAAE,KAAK,CAAC,CACT,CAAC,CAAC,CAAC,IAAI,CACR;QAAA,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CACjD;QAAA,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAC9C;MAAA,EAAE,KAAK,CACT;IAAA,EAAE,aAAa,CAAC,CACjB,CAAC;AACJ,CAAC","sourcesContent":["import { Box, Drawer as SurfaceDrawer, Stack } from '@ankhorage/surface';\nimport React, { useCallback, useEffect, useRef } from 'react';\n\nimport { Heading } from '../heading';\nimport { Text } from '../text';\nimport type { DrawerProps } from './types';\n\nfunction useStableCallback(callback: (() => void) | undefined): (() => void) | undefined {\n  const callbackRef = useRef(callback);\n\n  useEffect(() => {\n    callbackRef.current = callback;\n  }, [callback]);\n\n  return useCallback(() => {\n    callbackRef.current?.();\n  }, []);\n}\n\nexport function Drawer({ children, title, description, footer, onDismiss, ...props }: DrawerProps) {\n  const hasHeader = title != null || description != null;\n  const stableOnDismiss = useStableCallback(onDismiss);\n\n  return (\n    <SurfaceDrawer {...props} onDismiss={stableOnDismiss}>\n      <Stack gap=\"m\">\n        {hasHeader ? (\n          <Stack gap=\"xs\">\n            {title ? <Heading level={3}>{title}</Heading> : null}\n            {description ? (\n              <Text tone=\"muted\" variant=\"bodySmall\">\n                {description}\n              </Text>\n            ) : null}\n          </Stack>\n        ) : null}\n        {children ? <Box flex={1}>{children}</Box> : null}\n        {footer ? <Box pt=\"xs\">{footer}</Box> : null}\n      </Stack>\n    </SurfaceDrawer>\n  );\n}\n"]}
+{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/components/drawer/Drawer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,IAAI,aAAa,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AACzE,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE9D,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACpE,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAG/B,SAAS,iBAAiB,CAAC,QAAkC;IAC3D,MAAM,WAAW,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC;IAErC,SAAS,CAAC,GAAG,EAAE;QACb,WAAW,CAAC,OAAO,GAAG,QAAQ,CAAC;IACjC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,OAAO,WAAW,CAAC,GAAG,EAAE;QACtB,WAAW,CAAC,OAAO,EAAE,EAAE,CAAC;IAC1B,CAAC,EAAE,EAAE,CAAC,CAAC;AACT,CAAC;AAED,SAAS,WAAW,CAAC,EACnB,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,QAAQ,EACR,KAAK,EACL,WAAW,EACX,MAAM,EACN,SAAS,EACT,GAAG,KAAK,EACI;IACZ,MAAM,SAAS,GAAG,KAAK,IAAI,IAAI,IAAI,WAAW,IAAI,IAAI,CAAC;IACvD,MAAM,eAAe,GAAG,iBAAiB,CAAC,SAAS,CAAC,CAAC;IAErD,OAAO,CACL,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,CAAC,SAAS,CAAC,CAAC,eAAe,CAAC,CACnD;MAAA,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CACZ;QAAA,CAAC,SAAS,CAAC,CAAC,CAAC,CACX,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CACb;YAAA,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI,CACpD;YAAA,CAAC,WAAW,CAAC,CAAC,CAAC,CACb,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,WAAW,CACpC;gBAAA,CAAC,WAAW,CACd;cAAA,EAAE,IAAI,CAAC,CACR,CAAC,CAAC,CAAC,IAAI,CACV;UAAA,EAAE,KAAK,CAAC,CACT,CAAC,CAAC,CAAC,IAAI,CACR;QAAA,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CACjD;QAAA,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAC9C;MAAA,EAAE,KAAK,CACT;IAAA,EAAE,aAAa,CAAC,CACjB,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,MAAM,GAAG,kBAAkB,CAAC,WAAW,CAAC,CAAC","sourcesContent":["import { Box, Drawer as SurfaceDrawer, Stack } from '@ankhorage/surface';\nimport React, { useCallback, useEffect, useRef } from 'react';\n\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { Heading } from '../heading';\nimport { Text } from '../text';\nimport type { DrawerProps } from './types';\n\nfunction useStableCallback(callback: (() => void) | undefined): (() => void) | undefined {\n  const callbackRef = useRef(callback);\n\n  useEffect(() => {\n    callbackRef.current = callback;\n  }, [callback]);\n\n  return useCallback(() => {\n    callbackRef.current?.();\n  }, []);\n}\n\nfunction DrawerInner({\n  themeId: _themeId,\n  mode: _mode,\n  children,\n  title,\n  description,\n  footer,\n  onDismiss,\n  ...props\n}: DrawerProps) {\n  const hasHeader = title != null || description != null;\n  const stableOnDismiss = useStableCallback(onDismiss);\n\n  return (\n    <SurfaceDrawer {...props} onDismiss={stableOnDismiss}>\n      <Stack gap=\"m\">\n        {hasHeader ? (\n          <Stack gap=\"xs\">\n            {title ? <Heading level={3}>{title}</Heading> : null}\n            {description ? (\n              <Text tone=\"muted\" variant=\"bodySmall\">\n                {description}\n              </Text>\n            ) : null}\n          </Stack>\n        ) : null}\n        {children ? <Box flex={1}>{children}</Box> : null}\n        {footer ? <Box pt=\"xs\">{footer}</Box> : null}\n      </Stack>\n    </SurfaceDrawer>\n  );\n}\n\nexport const Drawer = withZoraThemeScope(DrawerInner);\n"]}

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

@@ -1,6 +1,7 @@
 import type { DrawerProps as SurfaceDrawerProps } from '@ankhorage/surface';
 import type React from 'react';
-export interface DrawerProps extends Pick<SurfaceDrawerProps, 'closeOnBackdrop' | 'onDismiss' | 'position' | 'testID' | 'visible'> {
+import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
+export interface DrawerProps extends ZoraBaseProps, Pick<Omit<SurfaceDrawerProps, 'mode' | 'themeId'>, 'closeOnBackdrop' | 'onDismiss' | 'position' | 'visible'> {
     children?: React.ReactNode;
     title?: React.ReactNode;
     description?: React.ReactNode;

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/drawer/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,IAAI,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAC5E,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,WAAW,WAAY,SAAQ,IAAI,CACvC,kBAAkB,EAClB,iBAAiB,GAAG,WAAW,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,CACpE;IACC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/drawer/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,IAAI,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAC5E,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,WAAW,WACf,SACE,aAAa,EACb,IAAI,CACF,IAAI,CAAC,kBAAkB,EAAE,MAAM,GAAG,SAAS,CAAC,EAC5C,iBAAiB,GAAG,WAAW,GAAG,UAAU,GAAG,SAAS,CACzD;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B"}

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

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/drawer/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { DrawerProps as SurfaceDrawerProps } from '@ankhorage/surface';\nimport type React from 'react';\n\nexport interface DrawerProps extends Pick<\n  SurfaceDrawerProps,\n  'closeOnBackdrop' | 'onDismiss' | 'position' | 'testID' | 'visible'\n> {\n  children?: React.ReactNode;\n  title?: React.ReactNode;\n  description?: React.ReactNode;\n  footer?: React.ReactNode;\n}\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/drawer/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { DrawerProps as SurfaceDrawerProps } from '@ankhorage/surface';\nimport type React from 'react';\n\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport interface DrawerProps\n  extends\n    ZoraBaseProps,\n    Pick<\n      Omit<SurfaceDrawerProps, 'mode' | 'themeId'>,\n      'closeOnBackdrop' | 'onDismiss' | 'position' | 'visible'\n    > {\n  children?: React.ReactNode;\n  title?: React.ReactNode;\n  description?: React.ReactNode;\n  footer?: React.ReactNode;\n}\n"]}

package/dist/components/form/Form.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import type { FormProps } from './types';
-export declare function Form<TName extends string = string>({ fields, values, onChange, onSubmit, errors, error, loading, disabled, submitLabel, actions, footer, validateOnChange, testID, }: FormProps<TName>): React.JSX.Element;
+export declare const Form: <TName extends string = string>(props: FormProps<TName>) => React.ReactElement | null;
 //# sourceMappingURL=Form.d.ts.map

package/dist/components/form/Form.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Form.d.ts","sourceRoot":"","sources":["../../../src/components/form/Form.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAGzC,wBAAgB,IAAI,CAAC,KAAK,SAAS,MAAM,GAAG,MAAM,EAAE,EAClD,MAAM,EACN,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,MAAM,EACN,KAAK,EACL,OAAe,EACf,QAAgB,EAChB,WAAsB,EACtB,OAAO,EACP,MAAM,EACN,gBAAwB,EACxB,MAAM,GACP,EAAE,SAAS,CAAC,KAAK,CAAC,qBAqClB"}
+{"version":3,"file":"Form.d.ts","sourceRoot":"","sources":["../../../src/components/form/Form.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AA0DzC,eAAO,MAAM,IAAI,GAvDE,KAAK,SAAS,MAAM,gEAuDU,CAAC"}

package/dist/components/form/Form.js

@@ -1,10 +1,11 @@
 import { Box, Stack } from '@ankhorage/surface';
 import React from 'react';
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
 import { FormActions } from './FormActions';
 import { FormError } from './FormError';
 import { FormField } from './FormField';
 import { useFormController } from './useFormController';
-export function Form({ fields, values, onChange, onSubmit, errors, error, loading = false, disabled = false, submitLabel = 'Submit', actions, footer, validateOnChange = false, testID, }) {
+function FormInner({ themeId: _themeId, mode: _mode, fields, values, onChange, onSubmit, errors, error, loading = false, disabled = false, submitLabel = 'Submit', actions, footer, validateOnChange = false, testID, }) {
     const controller = useFormController({
         fields,
         values,
@@ -24,4 +25,5 @@ export function Form({ fields, values, onChange, onSubmit, errors, error, loadin
       {footer ? <Box>{footer}</Box> : null}
     </Stack>);
 }
+export const Form = withZoraThemeScope(FormInner);
 //# sourceMappingURL=Form.js.map

package/dist/components/form/Form.js.map

@@ -1 +1 @@
-{"version":3,"file":"Form.js","sourceRoot":"","sources":["../../../src/components/form/Form.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAChD,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAExD,MAAM,UAAU,IAAI,CAAgC,EAClD,MAAM,EACN,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,MAAM,EACN,KAAK,EACL,OAAO,GAAG,KAAK,EACf,QAAQ,GAAG,KAAK,EAChB,WAAW,GAAG,QAAQ,EACtB,OAAO,EACP,MAAM,EACN,gBAAgB,GAAG,KAAK,EACxB,MAAM,GACW;IACjB,MAAM,UAAU,GAAG,iBAAiB,CAAC;QACnC,MAAM;QACN,MAAM;QACN,MAAM;QACN,QAAQ;QACR,QAAQ;QACR,gBAAgB;KACjB,CAAC,CAAC;IAEH,OAAO,CACL,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAC5B;MAAA,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,EACxB;MAAA,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CACrB,CAAC,SAAS,CACR,GAAG,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAChB,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,KAAK,CAAC,CAAC,UAAU,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CACrC,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,QAAQ,CAAC,CAAC,UAAU,CAAC,aAAa,CAAC,CACnC,KAAK,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,EAC1B,CACH,CAAC,CACF;MAAA,CAAC,WAAW,CACV,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,QAAQ,CAAC,CAAC,GAAG,EAAE;YACb,KAAK,UAAU,CAAC,YAAY,EAAE,CAAC;QACjC,CAAC,CAAC,CACF,WAAW,CAAC,CAAC,WAAW,CAAC,CAEzB;QAAA,CAAC,OAAO,CACV;MAAA,EAAE,WAAW,CACb;MAAA,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CACtC;IAAA,EAAE,KAAK,CAAC,CACT,CAAC;AACJ,CAAC","sourcesContent":["import { Box, Stack } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { FormActions } from './FormActions';\nimport { FormError } from './FormError';\nimport { FormField } from './FormField';\nimport type { FormProps } from './types';\nimport { useFormController } from './useFormController';\n\nexport function Form<TName extends string = string>({\n  fields,\n  values,\n  onChange,\n  onSubmit,\n  errors,\n  error,\n  loading = false,\n  disabled = false,\n  submitLabel = 'Submit',\n  actions,\n  footer,\n  validateOnChange = false,\n  testID,\n}: FormProps<TName>) {\n  const controller = useFormController({\n    fields,\n    values,\n    errors,\n    onChange,\n    onSubmit,\n    validateOnChange,\n  });\n\n  return (\n    <Stack gap=\"m\" testID={testID}>\n      <FormError error={error} />\n      {fields.map((field) => (\n        <FormField\n          key={field.name}\n          disabled={disabled}\n          error={controller.errors[field.name]}\n          field={field}\n          loading={loading}\n          onChange={controller.setFieldValue}\n          value={values[field.name]}\n        />\n      ))}\n      <FormActions\n        disabled={disabled}\n        loading={loading}\n        onSubmit={() => {\n          void controller.handleSubmit();\n        }}\n        submitLabel={submitLabel}\n      >\n        {actions}\n      </FormActions>\n      {footer ? <Box>{footer}</Box> : null}\n    </Stack>\n  );\n}\n"]}
+{"version":3,"file":"Form.js","sourceRoot":"","sources":["../../../src/components/form/Form.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAChD,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACpE,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAExD,SAAS,SAAS,CAAgC,EAChD,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,MAAM,EACN,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,MAAM,EACN,KAAK,EACL,OAAO,GAAG,KAAK,EACf,QAAQ,GAAG,KAAK,EAChB,WAAW,GAAG,QAAQ,EACtB,OAAO,EACP,MAAM,EACN,gBAAgB,GAAG,KAAK,EACxB,MAAM,GACW;IACjB,MAAM,UAAU,GAAG,iBAAiB,CAAC;QACnC,MAAM;QACN,MAAM;QACN,MAAM;QACN,QAAQ;QACR,QAAQ;QACR,gBAAgB;KACjB,CAAC,CAAC;IAEH,OAAO,CACL,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAC5B;MAAA,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,EACxB;MAAA,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CACrB,CAAC,SAAS,CACR,GAAG,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAChB,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,KAAK,CAAC,CAAC,UAAU,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CACrC,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,QAAQ,CAAC,CAAC,UAAU,CAAC,aAAa,CAAC,CACnC,KAAK,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,EAC1B,CACH,CAAC,CACF;MAAA,CAAC,WAAW,CACV,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,QAAQ,CAAC,CAAC,GAAG,EAAE;YACb,KAAK,UAAU,CAAC,YAAY,EAAE,CAAC;QACjC,CAAC,CAAC,CACF,WAAW,CAAC,CAAC,WAAW,CAAC,CAEzB;QAAA,CAAC,OAAO,CACV;MAAA,EAAE,WAAW,CACb;MAAA,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CACtC;IAAA,EAAE,KAAK,CAAC,CACT,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,IAAI,GAAG,kBAAkB,CAAC,SAAS,CAAC,CAAC","sourcesContent":["import { Box, Stack } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { FormActions } from './FormActions';\nimport { FormError } from './FormError';\nimport { FormField } from './FormField';\nimport type { FormProps } from './types';\nimport { useFormController } from './useFormController';\n\nfunction FormInner<TName extends string = string>({\n  themeId: _themeId,\n  mode: _mode,\n  fields,\n  values,\n  onChange,\n  onSubmit,\n  errors,\n  error,\n  loading = false,\n  disabled = false,\n  submitLabel = 'Submit',\n  actions,\n  footer,\n  validateOnChange = false,\n  testID,\n}: FormProps<TName>) {\n  const controller = useFormController({\n    fields,\n    values,\n    errors,\n    onChange,\n    onSubmit,\n    validateOnChange,\n  });\n\n  return (\n    <Stack gap=\"m\" testID={testID}>\n      <FormError error={error} />\n      {fields.map((field) => (\n        <FormField\n          key={field.name}\n          disabled={disabled}\n          error={controller.errors[field.name]}\n          field={field}\n          loading={loading}\n          onChange={controller.setFieldValue}\n          value={values[field.name]}\n        />\n      ))}\n      <FormActions\n        disabled={disabled}\n        loading={loading}\n        onSubmit={() => {\n          void controller.handleSubmit();\n        }}\n        submitLabel={submitLabel}\n      >\n        {actions}\n      </FormActions>\n      {footer ? <Box>{footer}</Box> : null}\n    </Stack>\n  );\n}\n\nexport const Form = withZoraThemeScope(FormInner);\n"]}

package/dist/components/form/FormActions.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import type { FormActionsProps } from './types';
-export declare function FormActions({ submitLabel, loading, disabled, onSubmit, children, testID, }: FormActionsProps): React.JSX.Element;
+export declare const FormActions: (props: FormActionsProps) => React.ReactElement | null;
 //# sourceMappingURL=FormActions.d.ts.map

package/dist/components/form/FormActions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormActions.d.ts","sourceRoot":"","sources":["../../../src/components/form/FormActions.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAEhD,wBAAgB,WAAW,CAAC,EAC1B,WAAsB,EACtB,OAAe,EACf,QAAgB,EAChB,QAAQ,EACR,QAAQ,EACR,MAAM,GACP,EAAE,gBAAgB,qBASlB"}
+{"version":3,"file":"FormActions.d.ts","sourceRoot":"","sources":["../../../src/components/form/FormActions.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAsBhD,eAAO,MAAM,WAAW,wDAAuC,CAAC"}

package/dist/components/form/FormActions.js

@@ -1,7 +1,8 @@
 import { Box, Stack } from '@ankhorage/surface';
 import React from 'react';
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
 import { Button } from '../button';
-export function FormActions({ submitLabel = 'Submit', loading = false, disabled = false, onSubmit, children, testID, }) {
+function FormActionsInner({ themeId: _themeId, mode: _mode, submitLabel = 'Submit', loading = false, disabled = false, onSubmit, children, testID, }) {
     return (<Stack gap="s" testID={testID}>
       <Button disabled={disabled} fullWidth loading={loading} onPress={onSubmit}>
         {submitLabel}
@@ -9,4 +10,5 @@ export function FormActions({ submitLabel = 'Submit', loading = false, disabled
       {children ? <Box>{children}</Box> : null}
     </Stack>);
 }
+export const FormActions = withZoraThemeScope(FormActionsInner);
 //# sourceMappingURL=FormActions.js.map

package/dist/components/form/FormActions.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormActions.js","sourceRoot":"","sources":["../../../src/components/form/FormActions.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAChD,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAGnC,MAAM,UAAU,WAAW,CAAC,EAC1B,WAAW,GAAG,QAAQ,EACtB,OAAO,GAAG,KAAK,EACf,QAAQ,GAAG,KAAK,EAChB,QAAQ,EACR,QAAQ,EACR,MAAM,GACW;IACjB,OAAO,CACL,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAC5B;MAAA,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC,CACxE;QAAA,CAAC,WAAW,CACd;MAAA,EAAE,MAAM,CACR;MAAA,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,QAAQ,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAC1C;IAAA,EAAE,KAAK,CAAC,CACT,CAAC;AACJ,CAAC","sourcesContent":["import { Box, Stack } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { Button } from '../button';\nimport type { FormActionsProps } from './types';\n\nexport function FormActions({\n  submitLabel = 'Submit',\n  loading = false,\n  disabled = false,\n  onSubmit,\n  children,\n  testID,\n}: FormActionsProps) {\n  return (\n    <Stack gap=\"s\" testID={testID}>\n      <Button disabled={disabled} fullWidth loading={loading} onPress={onSubmit}>\n        {submitLabel}\n      </Button>\n      {children ? <Box>{children}</Box> : null}\n    </Stack>\n  );\n}\n"]}
+{"version":3,"file":"FormActions.js","sourceRoot":"","sources":["../../../src/components/form/FormActions.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAChD,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACpE,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAGnC,SAAS,gBAAgB,CAAC,EACxB,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,WAAW,GAAG,QAAQ,EACtB,OAAO,GAAG,KAAK,EACf,QAAQ,GAAG,KAAK,EAChB,QAAQ,EACR,QAAQ,EACR,MAAM,GACW;IACjB,OAAO,CACL,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAC5B;MAAA,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC,CACxE;QAAA,CAAC,WAAW,CACd;MAAA,EAAE,MAAM,CACR;MAAA,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,QAAQ,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAC1C;IAAA,EAAE,KAAK,CAAC,CACT,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,WAAW,GAAG,kBAAkB,CAAC,gBAAgB,CAAC,CAAC","sourcesContent":["import { Box, Stack } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { Button } from '../button';\nimport type { FormActionsProps } from './types';\n\nfunction FormActionsInner({\n  themeId: _themeId,\n  mode: _mode,\n  submitLabel = 'Submit',\n  loading = false,\n  disabled = false,\n  onSubmit,\n  children,\n  testID,\n}: FormActionsProps) {\n  return (\n    <Stack gap=\"s\" testID={testID}>\n      <Button disabled={disabled} fullWidth loading={loading} onPress={onSubmit}>\n        {submitLabel}\n      </Button>\n      {children ? <Box>{children}</Box> : null}\n    </Stack>\n  );\n}\n\nexport const FormActions = withZoraThemeScope(FormActionsInner);\n"]}

package/dist/components/form/FormError.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import type { FormErrorProps } from './types';
-export declare function FormError({ error, testID }: FormErrorProps): React.JSX.Element | null;
+export declare const FormError: (props: FormErrorProps) => React.ReactElement | null;
 //# sourceMappingURL=FormError.d.ts.map

package/dist/components/form/FormError.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormError.d.ts","sourceRoot":"","sources":["../../../src/components/form/FormError.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,cAAc,4BAc1D"}
+{"version":3,"file":"FormError.d.ts","sourceRoot":"","sources":["../../../src/components/form/FormError.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAkB9C,eAAO,MAAM,SAAS,sDAAqC,CAAC"}

package/dist/components/form/FormError.js

@@ -1,8 +1,10 @@
-import { Box, useTheme } from '@ankhorage/surface';
+import { Box } from '@ankhorage/surface';
 import React from 'react';
+import { useZoraTheme } from '../../theme/useZoraTheme';
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
 import { Text } from '../text';
-export function FormError({ error, testID }) {
-    const { theme } = useTheme();
+function FormErrorInner({ themeId: _themeId, mode: _mode, error, testID }) {
+    const { theme } = useZoraTheme();
     if (!error) {
         return null;
     }
@@ -12,4 +14,5 @@ export function FormError({ error, testID }) {
       </Text>
     </Box>);
 }
+export const FormError = withZoraThemeScope(FormErrorInner);
 //# sourceMappingURL=FormError.js.map

package/dist/components/form/FormError.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormError.js","sourceRoot":"","sources":["../../../src/components/form/FormError.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAG/B,MAAM,UAAU,SAAS,CAAC,EAAE,KAAK,EAAE,MAAM,EAAkB;IACzD,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,EAAE,CAAC;IAE7B,IAAI,CAAC,KAAK,EAAE,CAAC;QACX,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CACL,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,MAAM,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CACpF;MAAA,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,WAAW,CACrC;QAAA,CAAC,KAAK,CACR;MAAA,EAAE,IAAI,CACR;IAAA,EAAE,GAAG,CAAC,CACP,CAAC;AACJ,CAAC","sourcesContent":["import { Box, useTheme } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { Text } from '../text';\nimport type { FormErrorProps } from './types';\n\nexport function FormError({ error, testID }: FormErrorProps) {\n  const { theme } = useTheme();\n\n  if (!error) {\n    return null;\n  }\n\n  return (\n    <Box borderColor={theme.colors.error} borderWidth={1} p=\"s\" radius=\"m\" testID={testID}>\n      <Text tone=\"danger\" variant=\"bodySmall\">\n        {error}\n      </Text>\n    </Box>\n  );\n}\n"]}
+{"version":3,"file":"FormError.js","sourceRoot":"","sources":["../../../src/components/form/FormError.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAC;AACzC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACpE,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAG/B,SAAS,cAAc,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAkB;IACvF,MAAM,EAAE,KAAK,EAAE,GAAG,YAAY,EAAE,CAAC;IAEjC,IAAI,CAAC,KAAK,EAAE,CAAC;QACX,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CACL,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,MAAM,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CACpF;MAAA,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,WAAW,CACrC;QAAA,CAAC,KAAK,CACR;MAAA,EAAE,IAAI,CACR;IAAA,EAAE,GAAG,CAAC,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,kBAAkB,CAAC,cAAc,CAAC,CAAC","sourcesContent":["import { Box } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { Text } from '../text';\nimport type { FormErrorProps } from './types';\n\nfunction FormErrorInner({ themeId: _themeId, mode: _mode, error, testID }: FormErrorProps) {\n  const { theme } = useZoraTheme();\n\n  if (!error) {\n    return null;\n  }\n\n  return (\n    <Box borderColor={theme.colors.error} borderWidth={1} p=\"s\" radius=\"m\" testID={testID}>\n      <Text tone=\"danger\" variant=\"bodySmall\">\n        {error}\n      </Text>\n    </Box>\n  );\n}\n\nexport const FormError = withZoraThemeScope(FormErrorInner);\n"]}

package/dist/components/form/FormField.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import type { FormFieldProps } from './types';
-export declare function FormField<TName extends string = string>(props: FormFieldProps<TName>): React.JSX.Element;
+export declare const FormField: <TName extends string = string>(props: FormFieldProps<TName>) => React.ReactElement | null;
 //# sourceMappingURL=FormField.d.ts.map

package/dist/components/form/FormField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormField.d.ts","sourceRoot":"","sources":["../../../src/components/form/FormField.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAA0C,cAAc,EAAE,MAAM,SAAS,CAAC;AAgFtF,wBAAgB,SAAS,CAAC,KAAK,SAAS,MAAM,GAAG,MAAM,EAAE,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,qBA2CpF"}
+{"version":3,"file":"FormField.d.ts","sourceRoot":"","sources":["../../../src/components/form/FormField.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAA0C,cAAc,EAAE,MAAM,SAAS,CAAC;AA+ItF,eAAO,MAAM,SAAS,GA/DE,KAAK,SAAS,MAAM,qEA+De,CAAC"}

package/dist/components/form/FormField.js

@@ -1,5 +1,6 @@
 import { Field, Stack } from '@ankhorage/surface';
 import React from 'react';
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
 import { Input } from '../input';
 import { Text } from '../text';
 import { hasRequiredRule } from './validation';
@@ -58,18 +59,19 @@ function renderLabel(label, description) {
         </Text>) : null}
     </Stack>);
 }
-export function FormField(props) {
+function FormFieldInner(props) {
     if (!isControlFieldProps(props)) {
-        const { label, description, helperText, children, ...fieldProps } = props;
+        const { themeId: _themeId, mode: _mode, label, description, helperText, children, ...fieldProps } = props;
         return (<Field {...fieldProps} helperText={helperText} label={renderLabel(label, description)}>
         {children}
       </Field>);
     }
-    const { field, value, error, disabled = false, loading = false, onChange, testID } = props;
+    const { themeId: _themeId, mode: _mode, field, value, error, disabled = false, loading = false, onChange, testID, } = props;
     const fieldDisabled = disabled || loading || field.disabled;
     const required = field.required ?? hasRequiredRule(field.rules);
     return (<Field disabled={fieldDisabled} errorText={error} helperText={field.helperText} invalid={Boolean(error)} label={renderLabel(field.label, field.description)} readOnly={field.readOnly} required={required} testID={testID ?? field.testID}>
       <Input accessibilityLabel={typeof field.label === 'string' ? field.label : undefined} autoCapitalize={resolveAutoCapitalize(field)} autoComplete={field.autoComplete} disabled={fieldDisabled} invalid={Boolean(error)} keyboardType={resolveKeyboardType(field)} maxLength={field.maxLength} onChangeText={(nextValue) => onChange(field.name, nextValue)} placeholder={field.placeholder} readOnly={field.readOnly} secureTextEntry={field.secureTextEntry ?? field.type === 'password'} textContentType={resolveTextContentType(field)} value={value}/>
     </Field>);
 }
+export const FormField = withZoraThemeScope(FormFieldInner);
 //# sourceMappingURL=FormField.js.map