@ankhorage/zora 9.0.1 → 11.0.0

package/dist/{components/form/types.d.ts → types/form.d.ts}

@@ -1,7 +1,7 @@
 import type { FieldProps as SurfaceFieldProps } from '@ankhorage/surface';
 import type React from 'react';
-import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
-import type { TextInputProps } from '../../types/text-input';
+import type { ZoraBaseProps } from '../theme/ZoraBaseProps';
+import type { TextInputProps } from './text-input';
 export type ValidationRule = {
     kind: 'required';
     message?: string;
@@ -41,20 +41,19 @@ export interface FormFieldConfig<TName extends string = string> {
     disabled?: boolean;
     testID?: string;
 }
-interface FormFieldWrapperProps extends ZoraBaseProps, Pick<Omit<SurfaceFieldProps, 'mode' | 'themeId'>, 'children' | 'disabled' | 'errorText' | 'invalid' | 'readOnly' | 'required'> {
+export interface FormProps extends ZoraBaseProps {
+    children?: React.ReactNode;
+    onSubmit?: () => void | Promise<void>;
+    loading?: boolean;
+    disabled?: boolean;
+    submitLabel?: React.ReactNode;
+    actions?: React.ReactNode;
+}
+export interface FormFieldProps extends ZoraBaseProps, Pick<Omit<SurfaceFieldProps, 'mode' | 'themeId'>, 'children' | 'disabled' | 'errorText' | 'invalid' | 'readOnly' | 'required'> {
     label: React.ReactNode;
     description?: React.ReactNode;
     helperText?: React.ReactNode;
 }
-export interface FormFieldControlProps<TName extends string = string> extends ZoraBaseProps {
-    field: FormFieldConfig<TName>;
-    value: FormFieldValue;
-    onChange: (name: TName, value: FormFieldValue) => void;
-    error?: React.ReactNode;
-    disabled?: boolean;
-    loading?: boolean;
-}
-export type FormFieldProps<TName extends string = string> = FormFieldControlProps<TName> | FormFieldWrapperProps;
 export interface FormActionsProps extends ZoraBaseProps {
     submitLabel?: React.ReactNode;
     loading?: boolean;
@@ -65,20 +64,6 @@ export interface FormActionsProps extends ZoraBaseProps {
 export interface FormErrorProps extends ZoraBaseProps {
     error?: React.ReactNode;
 }
-export interface FormProps<TName extends string = string> extends ZoraBaseProps {
-    fields: readonly FormFieldConfig<TName>[];
-    values: FormValues<TName>;
-    onChange: (values: FormValues<TName>) => void;
-    onSubmit: (values: FormValues<TName>) => void | Promise<void>;
-    errors?: FormErrors<TName>;
-    error?: React.ReactNode;
-    loading?: boolean;
-    disabled?: boolean;
-    submitLabel?: React.ReactNode;
-    actions?: React.ReactNode;
-    footer?: React.ReactNode;
-    validateOnChange?: boolean;
-}
 export interface FormValidationResult<TName extends string = string> {
     errors: FormValidationErrors<TName>;
     valid: boolean;
@@ -101,5 +86,4 @@ export interface UseFormControllerResult<TName extends string = string> {
     handleSubmit: () => Promise<void>;
     reset: () => void;
 }
-export {};
-//# sourceMappingURL=types.d.ts.map
+//# sourceMappingURL=form.d.ts.map

package/dist/types/form.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../../src/types/form.ts"],"names":[],"mappings":"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"}

package/dist/types/form.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=form.js.map

package/dist/types/form.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"form.js","sourceRoot":"","sources":["../../src/types/form.ts"],"names":[],"mappings":"","sourcesContent":["import type { FieldProps as SurfaceFieldProps } from '@ankhorage/surface';\nimport type React from 'react';\n\nimport type { ZoraBaseProps } from '../theme/ZoraBaseProps';\nimport type { TextInputProps } from './text-input';\n\nexport type ValidationRule =\n  | { kind: 'required'; message?: string }\n  | { kind: 'email'; message?: string }\n  | { kind: 'minLength'; value: number; message?: string }\n  | { kind: 'pattern'; value: string; message?: string };\nexport type FormFieldValue = string;\nexport type FormValues<TName extends string = string> = Record<TName, FormFieldValue>;\nexport type FormErrors<TName extends string = string> = Partial<Record<TName, React.ReactNode>>;\nexport type FormValidationErrors<TName extends string = string> = Partial<Record<TName, string>>;\nexport type FormFieldInputType = 'email' | 'number' | 'otp' | 'password' | 'tel' | 'text' | 'url';\n\nexport interface FormFieldConfig<TName extends string = string> {\n  name: TName;\n  label: React.ReactNode;\n  description?: React.ReactNode;\n  helperText?: React.ReactNode;\n  type?: FormFieldInputType;\n  placeholder?: string;\n  rules?: readonly ValidationRule[];\n  autoCapitalize?: TextInputProps['autoCapitalize'];\n  autoComplete?: TextInputProps['autoComplete'];\n  keyboardType?: TextInputProps['keyboardType'];\n  maxLength?: TextInputProps['maxLength'];\n  readOnly?: boolean;\n  required?: boolean;\n  secureTextEntry?: boolean;\n  textContentType?: TextInputProps['textContentType'];\n  disabled?: boolean;\n  testID?: string;\n}\n\nexport interface FormProps extends ZoraBaseProps {\n  children?: React.ReactNode;\n  onSubmit?: () => void | Promise<void>;\n  loading?: boolean;\n  disabled?: boolean;\n  submitLabel?: React.ReactNode;\n  actions?: React.ReactNode;\n}\n\nexport interface FormFieldProps\n  extends\n    ZoraBaseProps,\n    Pick<\n      Omit<SurfaceFieldProps, 'mode' | 'themeId'>,\n      'children' | 'disabled' | 'errorText' | 'invalid' | 'readOnly' | 'required'\n    > {\n  label: React.ReactNode;\n  description?: React.ReactNode;\n  helperText?: React.ReactNode;\n}\n\nexport interface FormActionsProps extends ZoraBaseProps {\n  submitLabel?: React.ReactNode;\n  loading?: boolean;\n  disabled?: boolean;\n  onSubmit?: () => void;\n  children?: React.ReactNode;\n}\nexport interface FormErrorProps extends ZoraBaseProps {\n  error?: React.ReactNode;\n}\nexport interface FormValidationResult<TName extends string = string> {\n  errors: FormValidationErrors<TName>;\n  valid: boolean;\n}\nexport interface UseFormControllerOptions<TName extends string = string> {\n  fields: readonly FormFieldConfig<TName>[];\n  initialValues?: Partial<FormValues<TName>>;\n  values?: FormValues<TName>;\n  errors?: FormErrors<TName>;\n  onChange?: (values: FormValues<TName>) => void;\n  onSubmit?: (values: FormValues<TName>) => void | Promise<void>;\n  validateOnChange?: boolean;\n}\nexport interface UseFormControllerResult<TName extends string = string> {\n  values: FormValues<TName>;\n  errors: FormErrors<TName>;\n  setValues: (values: FormValues<TName>) => void;\n  setFieldValue: (name: TName, value: FormFieldValue) => void;\n  validate: () => FormValidationResult<TName>;\n  handleSubmit: () => Promise<void>;\n  reset: () => void;\n}\n"]}

package/dist/types/keyboard-avoiding-view.d.ts

@@ -0,0 +1,6 @@
+import type { KeyboardAvoidingViewProps as SurfaceKeyboardAvoidingViewProps } from '@ankhorage/surface';
+import type { ZoraBaseProps } from '../theme/ZoraBaseProps';
+export type KeyboardAvoidingViewBehavior = NonNullable<SurfaceKeyboardAvoidingViewProps['behavior']>;
+export interface KeyboardAvoidingViewProps extends ZoraBaseProps, Omit<SurfaceKeyboardAvoidingViewProps, keyof ZoraBaseProps> {
+}
+//# sourceMappingURL=keyboard-avoiding-view.d.ts.map

package/dist/types/keyboard-avoiding-view.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"keyboard-avoiding-view.d.ts","sourceRoot":"","sources":["../../src/types/keyboard-avoiding-view.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,yBAAyB,IAAI,gCAAgC,EAAE,MAAM,oBAAoB,CAAC;AAExG,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAE5D,MAAM,MAAM,4BAA4B,GAAG,WAAW,CACpD,gCAAgC,CAAC,UAAU,CAAC,CAC7C,CAAC;AAEF,MAAM,WAAW,yBACf,SAAQ,aAAa,EAAE,IAAI,CAAC,gCAAgC,EAAE,MAAM,aAAa,CAAC;CAAG"}

package/dist/types/keyboard-avoiding-view.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=keyboard-avoiding-view.js.map

package/dist/types/keyboard-avoiding-view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"keyboard-avoiding-view.js","sourceRoot":"","sources":["../../src/types/keyboard-avoiding-view.ts"],"names":[],"mappings":"","sourcesContent":["import type { KeyboardAvoidingViewProps as SurfaceKeyboardAvoidingViewProps } from '@ankhorage/surface';\n\nimport type { ZoraBaseProps } from '../theme/ZoraBaseProps';\n\nexport type KeyboardAvoidingViewBehavior = NonNullable<\n  SurfaceKeyboardAvoidingViewProps['behavior']\n>;\n\nexport interface KeyboardAvoidingViewProps\n  extends ZoraBaseProps, Omit<SurfaceKeyboardAvoidingViewProps, keyof ZoraBaseProps> {}\n"]}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ankhorage/zora",
   "type": "module",
-  "version": "9.0.1",
+  "version": "11.0.0",
   "description": "Opinionated React Native and React Native Web UI kit built on @ankhorage/surface.",
   "homepage": "https://github.com/ankhorage/zora#readme",
   "bugs": {
@@ -42,7 +42,8 @@
   "dependencies": {
     "@ankhorage/color-theory": "^0.3.0",
     "@ankhorage/contracts": "^12.0.1",
-    "@ankhorage/surface": "^4.1.0",
+    "@ankhorage/surface": "^4.2.0",
+    "@ankhorage/utility": "^0.8.0",
     "expo-document-picker": "~57.0.1",
     "expo-image-picker": "~57.0.16"
   },

package/src/audit.test.ts

@@ -141,17 +141,15 @@ describe('Plan 5 audit — product-facing src imports ZORA foundation, not Surfa
     join(SRC_ROOT, 'components', 'modal', 'Modal.tsx'),
     join(SRC_ROOT, 'features', 'form', 'text-input', 'adapters', 'inbound', 'TextInput.tsx'),
     join(SRC_ROOT, 'features', 'typography', 'adapters', 'inbound', 'Text.tsx'),
-    join(SRC_ROOT, 'components', 'form', 'FormField.tsx'),
-    join(SRC_ROOT, 'patterns', 'form-field', 'FormField.tsx'),
+    join(SRC_ROOT, 'features', 'form', 'adapters', 'inbound', 'FormField.tsx'),
     // Type-only imports that intentionally expose Surface-compatible prop specs.
     join(SRC_ROOT, 'components', 'checkbox', 'types.ts'),
-    join(SRC_ROOT, 'components', 'form', 'types.ts'),
+    join(SRC_ROOT, 'types', 'form.ts'),
     join(SRC_ROOT, 'types', 'icon-button.ts'),
     join(SRC_ROOT, 'components', 'tabs', 'types.ts'),
     join(SRC_ROOT, 'types', 'text.ts'),
     join(SRC_ROOT, 'components', 'textarea', 'types.ts'),
     join(SRC_ROOT, 'components', 'toolbar', 'types.ts'),
-    join(SRC_ROOT, 'patterns', 'form-field', 'types.ts'),
     join(SRC_ROOT, 'patterns', 'tile-grid', 'types.ts'),
   ]);
 

package/src/constants.ts

@@ -11,12 +11,13 @@ export const FEATURE_MANIFEST_ELEMENTS = {
   card: ['Card', 'MediaCard', 'MetricCard', 'PostCard', 'ProductCard'],
   chip: ['Chip', 'ChipGroup'],
   'data-table': ['DataTable'],
+  form: ['Form', 'FormError', 'FormField'],
   button: ['Button', 'IconButton', 'ButtonGroup'],
   icon: ['Icon'],
   image: ['Image'],
+  'keyboard-avoiding-view': ['KeyboardAvoidingView'],
   layout: ['Box', 'Container', 'ContentRail', 'Divider', 'Grid', 'Stack'],
   list: ['FlatList', 'SectionList'],
-  'splash-screen': ['SplashScreen'],
   typography: ['Heading', 'Text'],
   uploader: ['Uploader'],
   'bottom-sheet': ['BottomSheet'],

package/src/featureManifest.test.ts

@@ -1,3 +1,5 @@
+import { existsSync } from 'node:fs';
+
 import { expect, test } from 'bun:test';
 
 import { FEATURE_MANIFEST_ELEMENTS } from './constants';
@@ -17,6 +19,11 @@ test('every selected feature element is directly authorable through its canonica
   }
 });
 
+test('form composition has one canonical feature owner', () => {
+  expect(existsSync('src/components/form')).toBe(false);
+  expect(existsSync('src/patterns/form-field')).toBe(false);
+});
+
 test('interactive authoring retains state and event payload bindings after plugin composition', () => {
   const meta = ZORA_CORE_PLUGIN_METADATA.componentMeta;
   expect(meta.DataTable?.bindings?.props?.sort?.value.type).toBe('object');

package/src/features/form/adapters/inbound/Form.tsx

@@ -0,0 +1,39 @@
+import React from 'react';
+
+import { withZoraThemeScope } from '../../../../theme/withZoraThemeScope';
+import type { FormProps } from '../../../../types/form';
+import { Stack } from '../../../layout/public';
+import { FormActions } from './FormActions';
+
+function FormInner({
+  themeId: _themeId,
+  mode: _mode,
+  children,
+  onSubmit,
+  loading = false,
+  disabled = false,
+  submitLabel = 'Submit',
+  actions,
+  testID,
+  interactionPolicy,
+}: FormProps) {
+  return (
+    <Stack gap="m" testID={testID}>
+      {children}
+      <FormActions
+        disabled={disabled}
+        interactionPolicy={interactionPolicy}
+        loading={loading}
+        onSubmit={() => {
+          if (interactionPolicy !== 'passive') void onSubmit?.();
+        }}
+        submitLabel={submitLabel}
+      >
+        {actions}
+      </FormActions>
+    </Stack>
+  );
+}
+
+/*** Composes explicit form fields, form errors, and submit actions. */
+export const Form = withZoraThemeScope(FormInner);

package/src/{components/form → features/form/adapters/inbound}/FormActions.tsx

@@ -1,9 +1,9 @@
 import React from 'react';
 
-import { Button } from '../../features/button/public';
-import { Box, Stack } from '../../features/layout/public';
-import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
-import type { FormActionsProps } from './types';
+import { withZoraThemeScope } from '../../../../theme/withZoraThemeScope';
+import type { FormActionsProps } from '../../../../types/form';
+import { Button } from '../../../button/public';
+import { Box, Stack } from '../../../layout/public';
 
 function FormActionsInner({
   themeId: _themeId,

package/src/features/form/adapters/inbound/FormError.tsx

@@ -0,0 +1,22 @@
+import React from 'react';
+
+import { useZoraTheme } from '../../../../theme/useZoraTheme';
+import { withZoraThemeScope } from '../../../../theme/withZoraThemeScope';
+import type { FormErrorProps } from '../../../../types/form';
+import { Box } from '../../../layout/public';
+import { Text } from '../../../typography/public';
+
+function FormErrorInner({ themeId: _themeId, mode: _mode, error, testID }: FormErrorProps) {
+  const { theme } = useZoraTheme();
+  if (!error) return null;
+  return (
+    <Box borderColor={theme.colors.error} borderWidth={1} p="s" radius="m" testID={testID}>
+      <Text color="error" variant="bodySmall">
+        {error}
+      </Text>
+    </Box>
+  );
+}
+
+/*** Displays a form-level validation or submission error. */
+export const FormError = withZoraThemeScope(FormErrorInner);

package/src/{patterns/form-field → features/form/adapters/inbound}/FormField.tsx

@@ -1,10 +1,10 @@
 import { Field } from '@ankhorage/surface';
 import React from 'react';
 
-import { Stack } from '../../features/layout/public';
-import { Text } from '../../features/typography/public';
-import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
-import type { FormFieldProps } from './types';
+import { withZoraThemeScope } from '../../../../theme/withZoraThemeScope';
+import type { FormFieldProps } from '../../../../types/form';
+import { Stack } from '../../../layout/public';
+import { Text } from '../../../typography/public';
 
 function FormFieldInner({
   themeId: _themeId,
@@ -13,6 +13,7 @@ function FormFieldInner({
   description,
   helperText,
   children,
+  interactionPolicy: _interactionPolicy,
   ...props
 }: FormFieldProps) {
   return (
@@ -37,4 +38,5 @@ function FormFieldInner({
   );
 }
 
+/*** Groups one form control with its label, description, helper text, and field error. */
 export const FormField = withZoraThemeScope(FormFieldInner);

package/src/features/form/formActionsMeta.ts

@@ -0,0 +1,9 @@
+import type { ZoraComponentMeta } from '../../metadata';
+export const formActionsMeta = {
+  name: 'FormActions',
+  category: 'component',
+  directManifestNode: false,
+  allowedChildren: [],
+  note: 'Internal form action helper.',
+  props: {},
+} as const satisfies ZoraComponentMeta;

package/src/features/form/formErrorMeta.ts

@@ -0,0 +1,19 @@
+import type { ZoraComponentMeta } from '../../metadata';
+export const formErrorMeta = {
+  name: 'FormError',
+  category: 'component',
+  directManifestNode: true,
+  allowedChildren: [],
+  blueprint: { label: 'Form error', defaultProps: { error: 'Unable to submit the form.' } },
+  bindings: {
+    props: {
+      error: {
+        label: 'Error',
+        description: 'Global form or submission error.',
+        value: { type: 'unknown' },
+        acceptsFallback: true,
+      },
+    },
+  },
+  props: { error: { type: 'string', category: 'Content', label: 'Error' } },
+} as const satisfies ZoraComponentMeta;

package/src/features/form/formFieldMeta.ts

@@ -0,0 +1,35 @@
+import type { ZoraComponentMeta } from '../../metadata';
+export const formFieldMeta = {
+  name: 'FormField',
+  category: 'component',
+  directManifestNode: true,
+  allowedChildren: ['Checkbox', 'CheckboxGroup', 'RadioGroup', 'TextInput'],
+  blueprint: { label: 'Form field', defaultProps: { label: 'Label' } },
+  bindings: {
+    props: {
+      errorText: {
+        label: 'Error text',
+        description: 'Field-level validation error.',
+        value: { type: 'unknown' },
+        acceptsFallback: true,
+      },
+      disabled: {
+        label: 'Disabled',
+        description: 'Whether the field is disabled.',
+        value: { type: 'boolean' },
+        acceptsFallback: true,
+        acceptsTransforms: true,
+      },
+    },
+  },
+  props: {
+    label: { type: 'string', category: 'Content', label: 'Label', default: 'Label' },
+    description: { type: 'string', category: 'Content', label: 'Description' },
+    helperText: { type: 'string', category: 'Content', label: 'Helper text' },
+    errorText: { type: 'string', category: 'Validation', label: 'Error text' },
+    required: { type: 'boolean', category: 'Validation', label: 'Required', default: false },
+    invalid: { type: 'boolean', category: 'Validation', label: 'Invalid', default: false },
+    disabled: { type: 'boolean', category: 'State', label: 'Disabled', default: false },
+    readOnly: { type: 'boolean', category: 'State', label: 'Read-only', default: false },
+  },
+} as const satisfies ZoraComponentMeta;

package/src/features/form/formMeta.ts

@@ -0,0 +1,34 @@
+import type { ZoraComponentMeta } from '../../metadata';
+export const formMeta = {
+  name: 'Form',
+  category: 'component',
+  directManifestNode: true,
+  allowedChildren: ['FormError', 'FormField'],
+  blueprint: {
+    label: 'Form',
+    defaultProps: { submitLabel: 'Submit', loading: false, disabled: false },
+  },
+  bindings: {
+    events: {
+      submit: {
+        label: 'Submit',
+        description: 'Runs when the form is submitted.',
+        payload: { eventType: 'form.submit', fields: [] },
+      },
+    },
+  },
+  events: {
+    submit: {
+      label: 'Submit',
+      eventType: 'form.submit',
+      description: 'Emitted when the form is submitted.',
+      payloadFields: [],
+    },
+  },
+  slots: { actions: { label: 'Actions', allowedChildren: ['Button', 'ButtonGroup'] } },
+  props: {
+    submitLabel: { type: 'string', category: 'Content', label: 'Submit label', default: 'Submit' },
+    loading: { type: 'boolean', category: 'State', label: 'Loading', default: false },
+    disabled: { type: 'boolean', category: 'State', label: 'Disabled', default: false },
+  },
+} as const satisfies ZoraComponentMeta;

package/src/{components/form/index.ts → features/form/public.ts}

@@ -1,13 +1,8 @@
-export { Form } from './Form';
-export { FormActions } from './FormActions';
-export { FormError } from './FormError';
-export { FormField } from './FormField';
 export type {
   FormActionsProps,
   FormErrorProps,
   FormErrors,
   FormFieldConfig,
-  FormFieldControlProps,
   FormFieldInputType,
   FormFieldProps,
   FormProps,
@@ -17,6 +12,10 @@ export type {
   UseFormControllerOptions,
   UseFormControllerResult,
   ValidationRule,
-} from './types';
+} from '../../types/form';
+export { Form } from './adapters/inbound/Form';
+export { FormActions } from './adapters/inbound/FormActions';
+export { FormError } from './adapters/inbound/FormError';
+export { FormField } from './adapters/inbound/FormField';
 export { useFormController } from './useFormController';
-export { hasRequiredRule, validateField, validateFields, validateValue } from './validation';
+export { hasRequiredRule, validateField, validateFields, validateValue } from './utils/validation';

package/src/{components → features}/form/useFormController.ts

@@ -6,8 +6,8 @@ import type {
   FormValues,
   UseFormControllerOptions,
   UseFormControllerResult,
-} from './types';
-import { validateFields } from './validation';
+} from '../../types/form';
+import { validateFields } from './utils/validation';
 
 function createInitialValues<TName extends string>(
   fields: readonly { name: TName }[],

package/src/{components/form → features/form/utils}/validation.test.ts

@@ -1,6 +1,6 @@
 import { describe, expect, test } from 'bun:test';
 
-import type { FormFieldConfig, FormValues } from './types';
+import type { FormFieldConfig, FormValues } from '../../../types/form';
 import { validateFields, validateValue } from './validation';
 
 describe('form validation', () => {
@@ -12,6 +12,9 @@ describe('form validation', () => {
 
   test('validates email fields', () => {
     expect(validateValue('not-email', [{ kind: 'email' }])).toBe('Enter a valid email address.');
+    expect(validateValue('person@exam_ple.com', [{ kind: 'email' }])).toBe(
+      'Enter a valid email address.',
+    );
     expect(validateValue('person@example.com', [{ kind: 'email' }])).toBeUndefined();
   });
 

package/src/{components/form → features/form/utils}/validation.ts

@@ -1,12 +1,12 @@
+import { isEmail } from '@ankhorage/utility/regex';
+
 import type {
   FormFieldConfig,
   FormValidationErrors,
   FormValidationResult,
   FormValues,
   ValidationRule,
-} from './types';
-
-const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+} from '../../../types/form';
 
 export function hasRequiredRule(rules: readonly ValidationRule[] | undefined): boolean {
   return rules?.some((rule) => rule.kind === 'required') ?? false;
@@ -27,11 +27,7 @@ export function validateValue(
       return rule.message ?? 'This field is required.';
     }
 
-    if (
-      rule.kind === 'email' &&
-      normalizedValue.length > 0 &&
-      !emailPattern.test(normalizedValue)
-    ) {
+    if (rule.kind === 'email' && normalizedValue.length > 0 && !isEmail(normalizedValue)) {
       return rule.message ?? 'Enter a valid email address.';
     }
 

package/src/features/keyboard-avoiding-view/adapters/inbound/KeyboardAvoidingView.tsx

@@ -0,0 +1,18 @@
+import { KeyboardAvoidingView as SurfaceKeyboardAvoidingView } from '@ankhorage/surface';
+import React from 'react';
+
+import { withZoraThemeScope } from '../../../../theme/withZoraThemeScope';
+import type { KeyboardAvoidingViewProps } from '../../../../types/keyboard-avoiding-view';
+
+/*** Native keyboard-aware container exposed through the canonical ZORA feature boundary. */
+export const KeyboardAvoidingView = withZoraThemeScope(KeyboardAvoidingViewInner);
+
+/*** Forwards React Native keyboard avoidance and view props without adding platform behavior. */
+function KeyboardAvoidingViewInner({
+  themeId: _themeId,
+  mode: _mode,
+  interactionPolicy: _interactionPolicy,
+  ...props
+}: KeyboardAvoidingViewProps) {
+  return <SurfaceKeyboardAvoidingView {...props} />;
+}

package/src/features/keyboard-avoiding-view/keyboardAvoidingViewMeta.ts

@@ -0,0 +1,38 @@
+import { CONTAINER_ALLOWED_CHILDREN } from '../../metadata/allowedChildren';
+import type { ZoraComponentMeta } from '../../metadata/types';
+
+export const keyboardAvoidingViewMeta = {
+  name: 'KeyboardAvoidingView',
+  category: 'layout',
+  directManifestNode: true,
+  allowedChildren: [...CONTAINER_ALLOWED_CHILDREN],
+  blueprint: {
+    label: 'Keyboard avoiding view',
+    defaultProps: {
+      behavior: 'padding',
+      enabled: true,
+      keyboardVerticalOffset: 0,
+    },
+  },
+  props: {
+    behavior: {
+      type: 'enum',
+      category: 'Behavior',
+      label: 'Behavior',
+      enum: ['height', 'position', 'padding'],
+      default: 'padding',
+    },
+    enabled: {
+      type: 'boolean',
+      category: 'Behavior',
+      label: 'Enabled',
+      default: true,
+    },
+    keyboardVerticalOffset: {
+      type: 'number',
+      category: 'Layout',
+      label: 'Keyboard vertical offset',
+      default: 0,
+    },
+  },
+} as const satisfies ZoraComponentMeta;

package/src/features/keyboard-avoiding-view/public.ts

@@ -0,0 +1,5 @@
+export {
+  type KeyboardAvoidingViewBehavior,
+  type KeyboardAvoidingViewProps,
+} from '../../types/keyboard-avoiding-view';
+export { KeyboardAvoidingView } from './adapters/inbound/KeyboardAvoidingView';

package/src/features/uploader/adapters/inbound/Uploader.tsx

@@ -1,10 +1,10 @@
 import React from 'react';
 
 import { Modal } from '../../../../components/modal';
-import { FormField } from '../../../../patterns/form-field';
 import { withZoraThemeScope } from '../../../../theme/withZoraThemeScope';
 import type { UploadAsset, UploaderProps, UploadType } from '../../../../types/upload';
 import { Button } from '../../../button/public';
+import { FormField } from '../../../form/public';
 import { Icon } from '../../../icon/public';
 import { Image } from '../../../image/public';
 import { Box, Stack } from '../../../layout/public';

package/src/index.ts

@@ -4,33 +4,6 @@ export type { BreadcrumbItem, BreadcrumbsProps } from './components/breadcrumbs'
 export { Breadcrumbs } from './components/breadcrumbs';
 export type { DatePickerProps, DatePickerValue } from './components/date-picker';
 export { DatePicker } from './components/date-picker';
-export type {
-  FormActionsProps,
-  FormErrorProps,
-  FormErrors,
-  FormFieldConfig,
-  FormFieldControlProps,
-  FormFieldInputType,
-  FormFieldProps,
-  FormProps,
-  FormValidationErrors,
-  FormValidationResult,
-  FormValues,
-  UseFormControllerOptions,
-  UseFormControllerResult,
-  ValidationRule,
-} from './components/form';
-export {
-  Form,
-  FormActions,
-  FormError,
-  FormField,
-  hasRequiredRule,
-  useFormController,
-  validateField,
-  validateFields,
-  validateValue,
-} from './components/form';
 export type {
   GradientColor,
   GradientColors,
@@ -139,6 +112,32 @@ export {
   type CheckboxGroupProps,
   type CheckboxProps,
 } from './features/form/checkbox/public';
+export type {
+  FormActionsProps,
+  FormErrorProps,
+  FormErrors,
+  FormFieldConfig,
+  FormFieldInputType,
+  FormFieldProps,
+  FormProps,
+  FormValidationErrors,
+  FormValidationResult,
+  FormValues,
+  UseFormControllerOptions,
+  UseFormControllerResult,
+  ValidationRule,
+} from './features/form/public';
+export {
+  Form,
+  FormActions,
+  FormError,
+  FormField,
+  hasRequiredRule,
+  useFormController,
+  validateField,
+  validateFields,
+  validateValue,
+} from './features/form/public';
 export {
   Radio,
   RadioGroup,
@@ -155,6 +154,11 @@ export type { IconProps } from './features/icon/public';
 export { Icon } from './features/icon/public';
 export type { ImageFit, ImageProps, SurfaceImageSource } from './features/image/public';
 export { Image } from './features/image/public';
+export {
+  KeyboardAvoidingView,
+  type KeyboardAvoidingViewBehavior,
+  type KeyboardAvoidingViewProps,
+} from './features/keyboard-avoiding-view/public';
 export type {
   BoxProps,
   ContainerProps,
@@ -185,8 +189,6 @@ export {
   ProgressRing,
   type ProgressRingProps,
 } from './features/progress/public';
-export type { SplashScreenLogoShape, SplashScreenProps } from './features/splash-screen/public';
-export { SplashScreen } from './features/splash-screen/public';
 export type { SurfaceProps, SurfaceVariant } from './features/surface/public';
 export { Surface } from './features/surface/public';
 export type {