@ankhorage/zora 8.0.0 → 9.0.1

package/dist/types/text-input.d.ts

@@ -0,0 +1,22 @@
+import type * as Surface from '@ankhorage/surface';
+import type { ZoraControlSize } from '../internal/recipes';
+import type { ZoraBaseProps } from '../theme/ZoraBaseProps';
+export interface TextInputTrailingAction {
+    icon: Surface.ButtonIconSpec;
+    label: string;
+    onPress: () => void;
+}
+type TextInputTrailingProps = {
+    trailingIcon?: Surface.ButtonIconSpec;
+    trailingAction?: never;
+} | {
+    trailingIcon?: never;
+    trailingAction?: TextInputTrailingAction;
+};
+interface TextInputBaseProps extends ZoraBaseProps, Omit<Surface.TextInputProps, 'leadingAccessory' | 'size' | 'trailingAccessory' | 'mode' | 'themeId'> {
+    size?: ZoraControlSize;
+    leadingIcon?: Surface.ButtonIconSpec;
+}
+export type TextInputProps = TextInputBaseProps & TextInputTrailingProps;
+export {};
+//# sourceMappingURL=text-input.d.ts.map

package/dist/types/text-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-input.d.ts","sourceRoot":"","sources":["../../src/types/text-input.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,OAAO,MAAM,oBAAoB,CAAC;AAEnD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAC3D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAE5D,MAAM,WAAW,uBAAuB;IACtC,IAAI,EAAE,OAAO,CAAC,cAAc,CAAC;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,KAAK,sBAAsB,GACvB;IACE,YAAY,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC;IACtC,cAAc,CAAC,EAAE,KAAK,CAAC;CACxB,GACD;IACE,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,cAAc,CAAC,EAAE,uBAAuB,CAAC;CAC1C,CAAC;AAEN,UAAU,kBACR,SACE,aAAa,EACb,IAAI,CACF,OAAO,CAAC,cAAc,EACtB,kBAAkB,GAAG,MAAM,GAAG,mBAAmB,GAAG,MAAM,GAAG,SAAS,CACvE;IACH,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC;CACtC;AAED,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAAG,sBAAsB,CAAC"}

package/dist/types/text-input.js

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

package/dist/types/text-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-input.js","sourceRoot":"","sources":["../../src/types/text-input.ts"],"names":[],"mappings":"","sourcesContent":["import type * as Surface from '@ankhorage/surface';\n\nimport type { ZoraControlSize } from '../internal/recipes';\nimport type { ZoraBaseProps } from '../theme/ZoraBaseProps';\n\nexport interface TextInputTrailingAction {\n  icon: Surface.ButtonIconSpec;\n  label: string;\n  onPress: () => void;\n}\n\ntype TextInputTrailingProps =\n  | {\n      trailingIcon?: Surface.ButtonIconSpec;\n      trailingAction?: never;\n    }\n  | {\n      trailingIcon?: never;\n      trailingAction?: TextInputTrailingAction;\n    };\n\ninterface TextInputBaseProps\n  extends\n    ZoraBaseProps,\n    Omit<\n      Surface.TextInputProps,\n      'leadingAccessory' | 'size' | 'trailingAccessory' | 'mode' | 'themeId'\n    > {\n  size?: ZoraControlSize;\n  leadingIcon?: Surface.ButtonIconSpec;\n}\n\nexport type TextInputProps = TextInputBaseProps & TextInputTrailingProps;\n"]}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ankhorage/zora",
   "type": "module",
-  "version": "8.0.0",
+  "version": "9.0.1",
   "description": "Opinionated React Native and React Native Web UI kit built on @ankhorage/surface.",
   "homepage": "https://github.com/ankhorage/zora#readme",
   "bugs": {

package/src/audit.test.ts

@@ -139,7 +139,7 @@ describe('Plan 5 audit — product-facing src imports ZORA foundation, not Surfa
     join(SRC_ROOT, 'features', 'icon', 'adapters', 'inbound', 'Icon.tsx'),
     join(SRC_ROOT, 'features', 'button', 'adapters', 'inbound', 'IconButton.tsx'),
     join(SRC_ROOT, 'components', 'modal', 'Modal.tsx'),
-    join(SRC_ROOT, 'components', 'textarea', 'Textarea.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'),

package/src/components/form/FormField.tsx

@@ -1,10 +1,10 @@
 import { Field } from '@ankhorage/surface';
 import React from 'react';
 
+import { TextInput } from '../../features/form/text-input/public';
 import { Stack } from '../../features/layout/public';
 import { Text } from '../../features/typography/public';
 import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
-import { Input } from '../input';
 import type { FormFieldConfig, FormFieldControlProps, FormFieldProps } from './types';
 import { hasRequiredRule } from './validation';
 
@@ -131,7 +131,7 @@ function FormFieldInner<TName extends string = string>(props: FormFieldProps<TNa
       required={required}
       testID={testID ?? field.testID}
     >
-      <Input
+      <TextInput
         accessibilityLabel={typeof field.label === 'string' ? field.label : undefined}
         autoCapitalize={resolveAutoCapitalize(field)}
         autoComplete={field.autoComplete}

package/src/components/form/meta.ts

@@ -46,7 +46,7 @@ export const formFieldMeta = {
   name: 'FormField',
   category: 'component',
   directManifestNode: true,
-  allowedChildren: ['Input', 'Textarea'],
+  allowedChildren: ['TextInput'],
   blueprint: {
     label: 'Form field',
     defaultProps: {

package/src/components/form/types.ts

@@ -2,7 +2,7 @@ import type { FieldProps as SurfaceFieldProps } from '@ankhorage/surface';
 import type React from 'react';
 
 import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
-import type { InputProps } from '../input';
+import type { TextInputProps } from '../../types/text-input';
 
 export type ValidationRule =
   | { kind: 'required'; message?: string }
@@ -25,14 +25,14 @@ export interface FormFieldConfig<TName extends string = string> {
   type?: FormFieldInputType;
   placeholder?: string;
   rules?: readonly ValidationRule[];
-  autoCapitalize?: InputProps['autoCapitalize'];
-  autoComplete?: InputProps['autoComplete'];
-  keyboardType?: InputProps['keyboardType'];
-  maxLength?: InputProps['maxLength'];
+  autoCapitalize?: TextInputProps['autoCapitalize'];
+  autoComplete?: TextInputProps['autoComplete'];
+  keyboardType?: TextInputProps['keyboardType'];
+  maxLength?: TextInputProps['maxLength'];
   readOnly?: boolean;
   required?: boolean;
   secureTextEntry?: boolean;
-  textContentType?: InputProps['textContentType'];
+  textContentType?: TextInputProps['textContentType'];
   disabled?: boolean;
   testID?: string;
 }

package/src/components/search-bar/SearchBar.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 
+import { TextInput, type TextInputTrailingAction } from '../../features/form/text-input/public';
 import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
-import { Input, type InputTrailingAction } from '../input';
 import type { SearchBarProps } from './types';
 
 function SearchBarInner({
@@ -21,7 +21,7 @@ function SearchBarInner({
 }: SearchBarProps) {
   const passive = interactionPolicy === 'passive';
 
-  const trailingAction: InputTrailingAction | undefined =
+  const trailingAction: TextInputTrailingAction | undefined =
     clearable && value.length > 0
       ? {
           icon: { name: 'close-circle' },
@@ -36,7 +36,7 @@ function SearchBarInner({
       : undefined;
 
   return (
-    <Input
+    <TextInput
       disabled={disabled}
       interactionPolicy={interactionPolicy}
       leadingIcon={{ name: 'search-outline' }}

package/src/features/activity-indicator/activityIndicatorMeta.ts

@@ -0,0 +1,14 @@
+import type { ZoraComponentMeta } from '../../metadata';
+
+export const activityIndicatorMeta = {
+  name: 'ActivityIndicator',
+  category: 'component',
+  directManifestNode: true,
+  allowedChildren: [],
+  blueprint: { label: 'Activity indicator', defaultProps: { size: 'small' } },
+  props: {
+    size: { type: 'enum', category: 'Style', label: 'Size', enum: ['small', 'large'] },
+    color: { type: 'color', category: 'Style', label: 'Color' },
+    animating: { type: 'boolean', category: 'State', label: 'Animating', default: true },
+  },
+} as const satisfies ZoraComponentMeta;

package/src/features/activity-indicator/adapters/inbound/ActivityIndicator.tsx

@@ -0,0 +1,21 @@
+import React from 'react';
+import { ActivityIndicator as ReactNativeActivityIndicator } from 'react-native';
+
+import { useZoraTheme } from '../../../../theme/useZoraTheme';
+import { withZoraThemeScope } from '../../../../theme/withZoraThemeScope';
+import type { ActivityIndicatorProps } from '../../../../types/activity-indicator';
+
+/*** Render native loading feedback with a semantic ZORA fallback color. */
+function ActivityIndicatorInner({
+  themeId: _themeId,
+  mode: _mode,
+  color,
+  ...props
+}: ActivityIndicatorProps) {
+  const { theme } = useZoraTheme();
+
+  return <ReactNativeActivityIndicator {...props} color={color ?? theme.semantics.content.muted} />;
+}
+
+/*** Native activity indicator exposed as a serializable ZORA feedback node. */
+export const ActivityIndicator = withZoraThemeScope(ActivityIndicatorInner);

package/src/features/activity-indicator/public.ts

@@ -0,0 +1,2 @@
+export type { ActivityIndicatorProps } from '../../types/activity-indicator';
+export { ActivityIndicator } from './adapters/inbound/ActivityIndicator';

package/src/features/data-table/adapters/inbound/DataTable.tsx

@@ -5,7 +5,6 @@ import { ScrollView, type ViewStyle } from 'react-native';
 import { DropdownMenu, type MenuAction } from '../../../../components/menu';
 import { SkeletonList } from '../../../../components/skeleton';
 import { Show } from '../../../../foundation';
-import { EmptyState } from '../../../../patterns/empty-state';
 import { withZoraThemeScope } from '../../../../theme/withZoraThemeScope';
 import type {
   DataTableCellContext,
@@ -19,6 +18,7 @@ import type {
 import { Button } from '../../../button/public';
 import { IconButton } from '../../../button/public';
 import { Card } from '../../../card/public';
+import { EmptyState } from '../../../empty-state/public';
 import { Box, Stack } from '../../../layout/public';
 import { Text, type TextAlign } from '../../../typography/public';
 import { resolveDataTableRowKey } from '../../utils/resolveDataTableRowKey';

package/src/{patterns/empty-state → features/empty-state/adapters/inbound}/EmptyState.tsx

@@ -1,10 +1,10 @@
 import React from 'react';
 
-import { Button } from '../../features/button/public';
-import { Card } from '../../features/card/public';
-import { Stack } from '../../features/layout/public';
-import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
-import type { EmptyStateProps } from './types';
+import { withZoraThemeScope } from '../../../../theme/withZoraThemeScope';
+import type { EmptyStateProps } from '../../../../types/empty-state';
+import { Button } from '../../../button/public';
+import { Card } from '../../../card/public';
+import { Stack } from '../../../layout/public';
 
 function EmptyStateInner({
   themeId: _themeId,

package/src/features/empty-state/public.ts

@@ -0,0 +1,2 @@
+export type { EmptyStateAction, EmptyStateProps } from '../../types/empty-state';
+export { EmptyState } from './adapters/inbound/EmptyState';

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

@@ -1,8 +1,8 @@
 import { Checkbox as SurfaceCheckbox } from '@ankhorage/surface';
 import React from 'react';
 
-import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
-import type { CheckboxProps } from './types';
+import { withZoraThemeScope } from '../../../../../theme/withZoraThemeScope';
+import type { CheckboxProps } from '../../../../../types/checkbox';
 
 function CheckboxInner({
   themeId: _themeId,

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

@@ -2,10 +2,10 @@ import { Checkbox } from '@ankhorage/surface';
 import React from 'react';
 import { View } from 'react-native';
 
-import { Stack } from '../../features/layout/public';
-import { Text } from '../../features/typography/public';
-import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
-import type { CheckboxGroupOption, CheckboxGroupProps } from './types';
+import { withZoraThemeScope } from '../../../../../theme/withZoraThemeScope';
+import type { CheckboxGroupOption, CheckboxGroupProps } from '../../../../../types/checkbox';
+import { Stack } from '../../../../layout/public';
+import { Text } from '../../../../typography/public';
 
 function CheckboxGroupInner<TValue extends string>({
   themeId: _themeId,

package/src/features/form/checkbox/checkboxMeta.ts

@@ -0,0 +1,30 @@
+import type { ZoraComponentMeta } from '../../../metadata';
+
+export const checkboxMeta = {
+  name: 'Checkbox',
+  category: 'component',
+  directManifestNode: true,
+  allowedChildren: [],
+  blueprint: { label: 'Checkbox', defaultProps: { label: 'Option', checked: false } },
+  props: {
+    label: { type: 'string', category: 'Content', label: 'Label' },
+    checked: { type: 'boolean', category: 'State', label: 'Checked', default: false },
+    disabled: { type: 'boolean', category: 'State', label: 'Disabled', default: false },
+  },
+} as const satisfies ZoraComponentMeta;
+
+export const checkboxGroupMeta = {
+  name: 'CheckboxGroup',
+  category: 'component',
+  directManifestNode: true,
+  allowedChildren: [],
+  blueprint: {
+    label: 'Checkbox group',
+    defaultProps: { value: [], options: [{ value: 'option-a', label: 'First option' }] },
+  },
+  props: {
+    value: { type: 'array', category: 'State', label: 'Value' },
+    options: { type: 'array', category: 'Content', label: 'Options' },
+    disabled: { type: 'boolean', category: 'State', label: 'Disabled', default: false },
+  },
+} as const satisfies ZoraComponentMeta;

package/src/features/form/checkbox/public.ts

@@ -0,0 +1,7 @@
+export type {
+  CheckboxGroupOption,
+  CheckboxGroupProps,
+  CheckboxProps,
+} from '../../../types/checkbox';
+export { Checkbox } from './adapters/inbound/Checkbox';
+export { CheckboxGroup } from './adapters/inbound/CheckboxGroup';

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

@@ -1,8 +1,8 @@
 import { Radio as SurfaceRadio } from '@ankhorage/surface';
 import React from 'react';
 
-import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
-import type { RadioProps } from './types';
+import { withZoraThemeScope } from '../../../../../theme/withZoraThemeScope';
+import type { RadioProps } from '../../../../../types/radio';
 
 function RadioInner({ themeId: _themeId, mode: _mode, interactionPolicy, ...props }: RadioProps) {
   return <SurfaceRadio {...props} interactionPolicy={interactionPolicy} />;

package/src/{components/radio → features/form/radio/adapters/inbound}/RadioGroup.test.ts

@@ -1,6 +1,7 @@
 import { expect, test } from 'bun:test';
 
-import { resolveRadioGroupThemeRecipe } from './resolveRadioGroupThemeRecipe';
+import { radioGroupMeta } from '../../radioMeta';
+import { resolveRadioGroupThemeRecipe } from '../../utils/resolveRadioGroupThemeRecipe';
 
 test('resolves RadioGroup theme defaults while preserving instance overrides', () => {
   expect(resolveRadioGroupThemeRecipe({ themeFields: {} })).toEqual({
@@ -19,8 +20,7 @@ test('resolves RadioGroup theme defaults while preserving instance overrides', (
   ).toEqual({ gap: 'l', color: 'danger', size: 's' });
 });
 
-test('icon radio options expose serializable authoring metadata', async () => {
-  const { radioGroupMeta } = await import('./meta');
+test('icon radio options expose serializable authoring metadata', () => {
   expect(radioGroupMeta.directManifestNode).toBe(true);
   expect(radioGroupMeta.blueprint.label).toBe('Radio button group');
   expect(radioGroupMeta.blueprint.defaultProps.options.map((option) => option.value)).toContain(

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

@@ -2,13 +2,13 @@ import { Radio } from '@ankhorage/surface';
 import React from 'react';
 import { StyleSheet, View } from 'react-native';
 
-import { Stack } from '../../features/layout/public';
-import { Text } from '../../features/typography/public';
-import { useZoraThemeRecipe } from '../../theme/useZoraThemeRecipe';
-import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
+import { useZoraThemeRecipe } from '../../../../../theme/useZoraThemeRecipe';
+import { withZoraThemeScope } from '../../../../../theme/withZoraThemeScope';
+import type { RadioGroupProps } from '../../../../../types/radio';
+import { Stack } from '../../../../layout/public';
+import { Text } from '../../../../typography/public';
+import { resolveRadioGroupThemeRecipe } from '../../utils/resolveRadioGroupThemeRecipe';
 import { RadioOptionControl } from './RadioOptionControl';
-import { resolveRadioGroupThemeRecipe } from './resolveRadioGroupThemeRecipe';
-import type { RadioGroupProps } from './types';
 
 /*** Present one controlled single-choice group as inline radios or icon radio options. */
 export const RadioGroup = withZoraThemeScope(RadioGroupInner);

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

@@ -2,14 +2,14 @@ import { useTheme } from '@ankhorage/surface';
 import React from 'react';
 import { Platform, Pressable, StyleSheet, View } from 'react-native';
 
-import { Icon } from '../../features/icon/public';
-import { Text } from '../../features/typography/public';
+import type { RadioGroupProps } from '../../../../../types/radio';
+import { Icon } from '../../../../icon/public';
+import { Text } from '../../../../typography/public';
 import {
   handleRadioOptionKeyDown,
   type RadioOptionKeyboardTarget,
-} from './handleRadioOptionKeyDown';
-import { resolveRadioOptionColors } from './resolveRadioOptionColors';
-import type { RadioGroupProps } from './types';
+} from '../../utils/handleRadioOptionKeyDown';
+import { resolveRadioOptionColors } from '../../utils/resolveRadioOptionColors';
 
 /*** Render a selectable icon radio option with one accessible radio target and a trailing check. */
 export function RadioOptionControl<TValue extends string>(props: RadioOptionControlProps<TValue>) {

package/src/features/form/radio/public.ts

@@ -0,0 +1,3 @@
+export type { RadioGroupOption, RadioGroupProps, RadioProps } from '../../../types/radio';
+export { Radio } from './adapters/inbound/Radio';
+export { RadioGroup } from './adapters/inbound/RadioGroup';

package/src/{components/radio/meta.ts → features/form/radio/radioMeta.ts}

@@ -1,5 +1,5 @@
-import { ZORA_COLORS } from '../../internal/colorModel';
-import type { ZoraComponentMeta } from '../../metadata';
+import { ZORA_COLORS } from '../../../internal/colorModel';
+import type { ZoraComponentMeta } from '../../../metadata';
 
 const themeAuthoring = {
   authority: 'theme',
@@ -10,10 +10,14 @@ const themeAuthoring = {
 export const radioMeta = {
   name: 'Radio',
   category: 'component',
-  directManifestNode: false,
+  directManifestNode: true,
   allowedChildren: [],
-  note: 'Composition-level radio control; author repeated single-choice UI through RadioGroup.',
-  props: {},
+  blueprint: { label: 'Radio', defaultProps: { label: 'Option', checked: false } },
+  props: {
+    label: { type: 'string', category: 'Content', label: 'Label' },
+    checked: { type: 'boolean', category: 'State', label: 'Checked', default: false },
+    disabled: { type: 'boolean', category: 'State', label: 'Disabled', default: false },
+  },
 } as const satisfies ZoraComponentMeta;
 
 export const radioGroupMeta = {

package/src/{components → features/form}/radio/themeRecipeMeta.ts

@@ -1,5 +1,5 @@
-import { ZORA_COLORS } from '../../internal/colorModel';
-import type { ZoraThemeRecipeMeta } from '../../metadata/themeRecipeTypes';
+import { ZORA_COLORS } from '../../../internal/colorModel';
+import type { ZoraThemeRecipeMeta } from '../../../metadata/themeRecipeTypes';
 
 export const radioGroupThemeRecipeMeta = {
   name: 'RadioGroup',

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

@@ -1,7 +1,7 @@
 import { expect, test } from 'bun:test';
 import type { KeyboardEvent } from 'react';
 
-import { DIRECTION_MODIFIERS } from '../../constants/keyboard';
+import { DIRECTION_MODIFIERS } from '../../../../constants/keyboard';
 import {
   handleRadioOptionKeyDown,
   type RadioOptionKeyboardTarget,

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

@@ -1,6 +1,6 @@
 import type { KeyboardEvent } from 'react';
 
-import { DIRECTION_MODIFIERS } from '../../constants/keyboard';
+import { DIRECTION_MODIFIERS } from '../../../../constants/keyboard';
 
 /*** Support Space and directional navigation for web radio options without affecting native presses. */
 export function handleRadioOptionKeyDown(

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

@@ -1,7 +1,7 @@
 import type { ThemeRecipeOverrideValue } from '@ankhorage/contracts';
 
-import type { ZoraColor } from '../../internal/colorModel';
-import type { RadioGroupProps } from './types';
+import type { ZoraColor } from '../../../../internal/colorModel';
+import type { RadioGroupProps } from '../../../../types/radio';
 
 type RadioGroupGap = NonNullable<RadioGroupProps<string>['gap']>;
 type RadioGroupSize = NonNullable<RadioGroupProps<string>['size']>;

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

@@ -1,6 +1,6 @@
 import type { RoleSemantics, SurfaceTheme } from '@ankhorage/surface';
 
-import type { RadioGroupProps } from './types';
+import type { RadioGroupProps } from '../../../../types/radio';
 
 /*** Resolve selection-card decoration from the requested semantic role and field state. */
 export function resolveRadioOptionColors(

package/src/{components/input/Input.tsx → features/form/text-input/adapters/inbound/TextInput.tsx}

@@ -1,13 +1,13 @@
 import * as Surface from '@ankhorage/surface';
 import React from 'react';
 
-import { IconButton } from '../../features/button/public';
-import { resolveIconSize } from '../../internal/recipes';
-import { useZoraTheme } from '../../theme/useZoraTheme';
-import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
-import type { InputProps } from './types';
+import { resolveIconSize } from '../../../../../internal/recipes';
+import { useZoraTheme } from '../../../../../theme/useZoraTheme';
+import { withZoraThemeScope } from '../../../../../theme/withZoraThemeScope';
+import type { TextInputProps } from '../../../../../types/text-input';
+import { IconButton } from '../../../../button/public';
 
-function InputInner({
+function TextInputInner({
   themeId: _themeId,
   mode: _mode,
   size = 'l',
@@ -18,7 +18,7 @@ function InputInner({
   readOnly,
   interactionPolicy,
   ...props
-}: InputProps) {
+}: TextInputProps) {
   const { theme } = useZoraTheme();
   const iconSize = resolveIconSize(size);
   const iconColor = theme.semantics.content.muted;
@@ -58,12 +58,11 @@ function InputInner({
 /***
  * Theme-aware text input with semantic sizing and optional leading/trailing icon slots.
  *
- * Use `Input` for single-line form controls that need ZORA styling, disabled/read-only
- * handling, and accessible trailing actions without dropping into Surface directly.
+ * Use `TextInput` for single-line, multiline, and password form controls with ZORA styling.
  *
  * @example Search input
  * ```tsx
- * <Input placeholder="Search" leadingIcon={{ name: 'search-outline' }} />
+ * <TextInput placeholder="Search" leadingIcon={{ name: 'search-outline' }} />
  * ```
  */
-export const Input = withZoraThemeScope(InputInner);
+export const TextInput = withZoraThemeScope(TextInputInner);

package/src/features/form/text-input/public.ts

@@ -0,0 +1,2 @@
+export type { TextInputProps, TextInputTrailingAction } from '../../../types/text-input';
+export { TextInput } from './adapters/inbound/TextInput';

package/src/{components/input/meta.ts → features/form/text-input/textInputMeta.ts}

@@ -1,12 +1,12 @@
-import type { ZoraComponentMeta } from '../../metadata';
+import type { ZoraComponentMeta } from '../../../metadata';
 
-export const inputMeta = {
-  name: 'Input',
+export const textInputMeta = {
+  name: 'TextInput',
   category: 'component',
   directManifestNode: true,
   allowedChildren: [],
   blueprint: {
-    label: 'Input',
+    label: 'Text input',
     defaultProps: {
       placeholder: 'Enter text…',
       value: '',
@@ -42,5 +42,17 @@ export const inputMeta = {
       label: 'Read-only',
       default: false,
     },
+    multiline: {
+      type: 'boolean',
+      category: 'Layout',
+      label: 'Multiline',
+      default: false,
+    },
+    secureTextEntry: {
+      type: 'boolean',
+      category: 'State',
+      label: 'Secure text entry',
+      default: false,
+    },
   },
 } as const satisfies ZoraComponentMeta;

package/src/{components/progress → features/progress/adapters/inbound}/Progress.tsx

@@ -1,10 +1,10 @@
 import React from 'react';
 
-import { Box } from '../../features/layout/public';
-import { useZoraTheme } from '../../theme/useZoraTheme';
-import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
-import { resolveProgressFraction } from './resolveProgressFraction';
-import { type ProgressProps, resolveProgressRole } from './types';
+import { useZoraTheme } from '../../../../theme/useZoraTheme';
+import { withZoraThemeScope } from '../../../../theme/withZoraThemeScope';
+import { type ProgressProps, resolveProgressRole } from '../../../../types/progress';
+import { Box } from '../../../layout/public';
+import { resolveProgressFraction } from '../../utils/resolveProgressFraction';
 
 function resolveProgressHeight(size: NonNullable<ProgressProps['size']>): number {
   switch (size) {

package/src/{components/progress → features/progress/adapters/inbound}/ProgressRing.test.ts

@@ -1,22 +1,25 @@
 import { describe, expect, test } from 'bun:test';
 
-import { progressRingMeta } from './meta';
+import { progressRingMeta } from '../../progressMeta';
 
 describe('ProgressRing public contract', () => {
   test('is exported from the component and package entrypoints', async () => {
     const [componentIndex, rootIndex] = await Promise.all([
-      Bun.file('src/components/progress/index.ts').text(),
+      Bun.file('src/features/progress/public.ts').text(),
       Bun.file('src/index.ts').text(),
     ]);
 
-    expect(componentIndex).toContain("export { ProgressRing } from './ProgressRing';");
+    expect(componentIndex).toContain(
+      "export { ProgressRing } from './adapters/inbound/ProgressRing';",
+    );
     expect(componentIndex).toContain('ProgressRingProps');
-    expect(rootIndex).toContain("export { Progress, ProgressRing } from './components/progress';");
-    expect(rootIndex).toContain('ProgressProps, ProgressRingProps');
+    expect(rootIndex).toContain("} from './features/progress/public';");
+    expect(rootIndex).toContain('type ProgressProps');
+    expect(rootIndex).toContain('type ProgressRingProps');
   });
 
   test('exposes native progress semantics and uses canonical normalization and colors', async () => {
-    const source = await Bun.file('src/components/progress/ProgressRing.tsx').text();
+    const source = await Bun.file('src/features/progress/adapters/inbound/ProgressRing.tsx').text();
 
     expect(source).toContain('accessibilityRole="progressbar"');
     expect(source).toContain('accessibilityValue={{');

package/src/{components/progress → features/progress/adapters/inbound}/ProgressRing.tsx

@@ -1,13 +1,13 @@
 import React from 'react';
 import { StyleSheet, View } from 'react-native';
 
-import { Stack } from '../../features/layout/public';
-import { Text } from '../../features/typography/public';
-import { useZoraTheme } from '../../theme/useZoraTheme';
-import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
-import { resolveProgressFraction } from './resolveProgressFraction';
-import { resolveProgressRingGeometry } from './resolveProgressRingGeometry';
-import { type ProgressRingProps, resolveProgressRole } from './types';
+import { useZoraTheme } from '../../../../theme/useZoraTheme';
+import { withZoraThemeScope } from '../../../../theme/withZoraThemeScope';
+import { type ProgressRingProps, resolveProgressRole } from '../../../../types/progress';
+import { Stack } from '../../../layout/public';
+import { Text } from '../../../typography/public';
+import { resolveProgressFraction } from '../../utils/resolveProgressFraction';
+import { resolveProgressRingGeometry } from '../../utils/resolveProgressRingGeometry';
 
 function ProgressRingInner({
   themeId: _themeId,

package/src/features/progress/public.ts

@@ -0,0 +1,3 @@
+export type { ProgressProps, ProgressRingProps } from '../../types/progress';
+export { Progress } from './adapters/inbound/Progress';
+export { ProgressRing } from './adapters/inbound/ProgressRing';