@ankhorage/surface 5.0.0 → 6.0.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @ankhorage/surface
 
+## 6.0.0
+
+### Major Changes
+
+- 574a34b: Replace legacy layout aliases with canonical React Native-named `View` and `ScrollView` primitives, remove redundant layout presets, and move AppBar and responsive Show to their owning boundaries.
+
+## 5.0.1
+
+### Patch Changes
+
+- 14c083f: Move Modal and the accessible Tabs system to canonical feature ownership without changing their public root API.
+
 ## 5.0.0
 
 ### Major Changes

package/README.md

@@ -3,7 +3,7 @@
 
 # @ankhorage/surface
 
-![license: MIT](././paradox/badges/license.svg) ![npm: v4.3.0](././paradox/badges/npm.svg) ![runtime: bun](././paradox/badges/runtime.svg) ![typescript: strict](././paradox/badges/typescript.svg) ![eslint: checked](././paradox/badges/eslint.svg) ![prettier: checked](././paradox/badges/prettier.svg) ![build: checked](././paradox/badges/build.svg) ![tests: checked](././paradox/badges/tests.svg) ![docs: paradox](././paradox/badges/docs.svg)
+![license: MIT](././paradox/badges/license.svg) ![npm: v5.0.1](././paradox/badges/npm.svg) ![runtime: bun](././paradox/badges/runtime.svg) ![typescript: strict](././paradox/badges/typescript.svg) ![eslint: checked](././paradox/badges/eslint.svg) ![prettier: checked](././paradox/badges/prettier.svg) ![build: checked](././paradox/badges/build.svg) ![tests: checked](././paradox/badges/tests.svg) ![docs: paradox](././paradox/badges/docs.svg)
 
 Cross-platform UI foundation for React Native and React Native Web. Provides theming, layout primitives, and core building blocks for modern apps.
 
@@ -27,14 +27,13 @@ Cross-platform UI foundation for React Native and React Native Web. Provides the
 - [IconButton sequence](././paradox/diagrams/sequences/icon-button.mmd)
 - [isDeepEqual sequence](././paradox/diagrams/sequences/is-deep-equal.mmd)
 - [ListItem sequence](././paradox/diagrams/sequences/list-item.mmd)
-- [Menu sequence](././paradox/diagrams/sequences/menu.mmd)
 - [Modal sequence](././paradox/diagrams/sequences/modal.mmd)
 - [Popover sequence](././paradox/diagrams/sequences/popover.mmd)
+- [PopoverMenu sequence](././paradox/diagrams/sequences/popover-menu.mmd)
 - [Radio sequence](././paradox/diagrams/sequences/radio.mmd)
 - [resolveResponsive sequence](././paradox/diagrams/sequences/resolve-responsive.mmd)
 - [ResponsiveProvider sequence](././paradox/diagrams/sequences/responsive-provider.mmd)
 - [Show sequence](././paradox/diagrams/sequences/show.mmd)
-- [Stack sequence](././paradox/diagrams/sequences/stack.mmd)
 - [Surface sequence](././paradox/diagrams/sequences/surface.mmd)
 - [Switch sequence](././paradox/diagrams/sequences/switch.mmd)
 - [TabList sequence](././paradox/diagrams/sequences/tab-list.mmd)

package/dist/components/field/Field.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
 import type { FieldProps } from './types';
+/*** Composes a label, control, and helper or error message into one field. */
 export declare function Field({ children, label, helperText, errorText, required, disabled, invalid, readOnly, testID, }: FieldProps): React.JSX.Element;
 //# sourceMappingURL=Field.d.ts.map

package/dist/components/field/Field.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Field.d.ts","sourceRoot":"","sources":["../../../src/components/field/Field.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C,wBAAgB,KAAK,CAAC,EACpB,QAAQ,EACR,KAAK,EACL,UAAU,EACV,SAAS,EACT,QAAgB,EAChB,QAAgB,EAChB,OAAe,EACf,QAAgB,EAChB,MAAM,GACP,EAAE,UAAU,qBAgCZ"}
+{"version":3,"file":"Field.d.ts","sourceRoot":"","sources":["../../../src/components/field/Field.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C,8EAA8E;AAC9E,wBAAgB,KAAK,CAAC,EACpB,QAAQ,EACR,KAAK,EACL,UAAU,EACV,SAAS,EACT,QAAgB,EAChB,QAAgB,EAChB,OAAe,EACf,QAAgB,EAChB,MAAM,GACP,EAAE,UAAU,qBAgCZ"}

package/dist/components/field/Field.js

@@ -1,8 +1,9 @@
 import React from 'react';
-import { Box, Stack } from '../../features/layout/public';
+import { View } from '../../features/layout/public';
 import { resolveFieldPresentation, resolveFieldState } from '../../internal/resolvers';
 import { HelperText } from '../helper-text';
 import { Label } from '../label';
+/*** Composes a label, control, and helper or error message into one field. */
 export function Field({ children, label, helperText, errorText, required = false, disabled = false, invalid = false, readOnly = false, testID, }) {
     const hasErrorText = Boolean(errorText);
     const fieldState = resolveFieldState({
@@ -11,16 +12,16 @@ export function Field({ children, label, helperText, errorText, required = false
         readOnly,
     });
     const presentation = resolveFieldPresentation(fieldState);
-    return (<Stack gap="xs" testID={testID}>
+    return (<View gap="xs" testID={testID}>
       {label ? (<Label color={presentation.labelColor} emphasis={presentation.labelEmphasis} required={required}>
           {label}
         </Label>) : null}
-      <Box>{children}</Box>
+      <View>{children}</View>
       {hasErrorText ? (<HelperText color={presentation.helperColor} emphasis={presentation.helperEmphasis}>
           {errorText}
         </HelperText>) : helperText ? (<HelperText color={presentation.helperColor} emphasis={presentation.helperEmphasis}>
           {helperText}
         </HelperText>) : null}
-    </Stack>);
+    </View>);
 }
 //# sourceMappingURL=Field.js.map

package/dist/components/field/Field.js.map

@@ -1 +1 @@
-{"version":3,"file":"Field.js","sourceRoot":"","sources":["../../../src/components/field/Field.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,8BAA8B,CAAC;AAC1D,OAAO,EAAE,wBAAwB,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AACvF,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAGjC,MAAM,UAAU,KAAK,CAAC,EACpB,QAAQ,EACR,KAAK,EACL,UAAU,EACV,SAAS,EACT,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,KAAK,EACf,QAAQ,GAAG,KAAK,EAChB,MAAM,GACK;IACX,MAAM,YAAY,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IACxC,MAAM,UAAU,GAAG,iBAAiB,CAAC;QACnC,QAAQ;QACR,OAAO,EAAE,OAAO,IAAI,YAAY;QAChC,QAAQ;KACT,CAAC,CAAC;IACH,MAAM,YAAY,GAAG,wBAAwB,CAAC,UAAU,CAAC,CAAC;IAE1D,OAAO,CACL,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAC7B;MAAA,CAAC,KAAK,CAAC,CAAC,CAAC,CACP,CAAC,KAAK,CACJ,KAAK,CAAC,CAAC,YAAY,CAAC,UAAU,CAAC,CAC/B,QAAQ,CAAC,CAAC,YAAY,CAAC,aAAa,CAAC,CACrC,QAAQ,CAAC,CAAC,QAAQ,CAAC,CAEnB;UAAA,CAAC,KAAK,CACR;QAAA,EAAE,KAAK,CAAC,CACT,CAAC,CAAC,CAAC,IAAI,CACR;MAAA,CAAC,GAAG,CAAC,CAAC,QAAQ,CAAC,EAAE,GAAG,CACpB;MAAA,CAAC,YAAY,CAAC,CAAC,CAAC,CACd,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,QAAQ,CAAC,CAAC,YAAY,CAAC,cAAc,CAAC,CACjF;UAAA,CAAC,SAAS,CACZ;QAAA,EAAE,UAAU,CAAC,CACd,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CACf,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,QAAQ,CAAC,CAAC,YAAY,CAAC,cAAc,CAAC,CACjF;UAAA,CAAC,UAAU,CACb;QAAA,EAAE,UAAU,CAAC,CACd,CAAC,CAAC,CAAC,IAAI,CACV;IAAA,EAAE,KAAK,CAAC,CACT,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\n\nimport { Box, Stack } from '../../features/layout/public';\nimport { resolveFieldPresentation, resolveFieldState } from '../../internal/resolvers';\nimport { HelperText } from '../helper-text';\nimport { Label } from '../label';\nimport type { FieldProps } from './types';\n\nexport function Field({\n  children,\n  label,\n  helperText,\n  errorText,\n  required = false,\n  disabled = false,\n  invalid = false,\n  readOnly = false,\n  testID,\n}: FieldProps) {\n  const hasErrorText = Boolean(errorText);\n  const fieldState = resolveFieldState({\n    disabled,\n    invalid: invalid || hasErrorText,\n    readOnly,\n  });\n  const presentation = resolveFieldPresentation(fieldState);\n\n  return (\n    <Stack gap=\"xs\" testID={testID}>\n      {label ? (\n        <Label\n          color={presentation.labelColor}\n          emphasis={presentation.labelEmphasis}\n          required={required}\n        >\n          {label}\n        </Label>\n      ) : null}\n      <Box>{children}</Box>\n      {hasErrorText ? (\n        <HelperText color={presentation.helperColor} emphasis={presentation.helperEmphasis}>\n          {errorText}\n        </HelperText>\n      ) : helperText ? (\n        <HelperText color={presentation.helperColor} emphasis={presentation.helperEmphasis}>\n          {helperText}\n        </HelperText>\n      ) : null}\n    </Stack>\n  );\n}\n"]}
+{"version":3,"file":"Field.js","sourceRoot":"","sources":["../../../src/components/field/Field.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,IAAI,EAAE,MAAM,8BAA8B,CAAC;AACpD,OAAO,EAAE,wBAAwB,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AACvF,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAGjC,8EAA8E;AAC9E,MAAM,UAAU,KAAK,CAAC,EACpB,QAAQ,EACR,KAAK,EACL,UAAU,EACV,SAAS,EACT,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,KAAK,EACf,QAAQ,GAAG,KAAK,EAChB,MAAM,GACK;IACX,MAAM,YAAY,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IACxC,MAAM,UAAU,GAAG,iBAAiB,CAAC;QACnC,QAAQ;QACR,OAAO,EAAE,OAAO,IAAI,YAAY;QAChC,QAAQ;KACT,CAAC,CAAC;IACH,MAAM,YAAY,GAAG,wBAAwB,CAAC,UAAU,CAAC,CAAC;IAE1D,OAAO,CACL,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAC5B;MAAA,CAAC,KAAK,CAAC,CAAC,CAAC,CACP,CAAC,KAAK,CACJ,KAAK,CAAC,CAAC,YAAY,CAAC,UAAU,CAAC,CAC/B,QAAQ,CAAC,CAAC,YAAY,CAAC,aAAa,CAAC,CACrC,QAAQ,CAAC,CAAC,QAAQ,CAAC,CAEnB;UAAA,CAAC,KAAK,CACR;QAAA,EAAE,KAAK,CAAC,CACT,CAAC,CAAC,CAAC,IAAI,CACR;MAAA,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,EAAE,IAAI,CACtB;MAAA,CAAC,YAAY,CAAC,CAAC,CAAC,CACd,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,QAAQ,CAAC,CAAC,YAAY,CAAC,cAAc,CAAC,CACjF;UAAA,CAAC,SAAS,CACZ;QAAA,EAAE,UAAU,CAAC,CACd,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CACf,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,QAAQ,CAAC,CAAC,YAAY,CAAC,cAAc,CAAC,CACjF;UAAA,CAAC,UAAU,CACb;QAAA,EAAE,UAAU,CAAC,CACd,CAAC,CAAC,CAAC,IAAI,CACV;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\n\nimport { View } from '../../features/layout/public';\nimport { resolveFieldPresentation, resolveFieldState } from '../../internal/resolvers';\nimport { HelperText } from '../helper-text';\nimport { Label } from '../label';\nimport type { FieldProps } from './types';\n\n/*** Composes a label, control, and helper or error message into one field. */\nexport function Field({\n  children,\n  label,\n  helperText,\n  errorText,\n  required = false,\n  disabled = false,\n  invalid = false,\n  readOnly = false,\n  testID,\n}: FieldProps) {\n  const hasErrorText = Boolean(errorText);\n  const fieldState = resolveFieldState({\n    disabled,\n    invalid: invalid || hasErrorText,\n    readOnly,\n  });\n  const presentation = resolveFieldPresentation(fieldState);\n\n  return (\n    <View gap=\"xs\" testID={testID}>\n      {label ? (\n        <Label\n          color={presentation.labelColor}\n          emphasis={presentation.labelEmphasis}\n          required={required}\n        >\n          {label}\n        </Label>\n      ) : null}\n      <View>{children}</View>\n      {hasErrorText ? (\n        <HelperText color={presentation.helperColor} emphasis={presentation.helperEmphasis}>\n          {errorText}\n        </HelperText>\n      ) : helperText ? (\n        <HelperText color={presentation.helperColor} emphasis={presentation.helperEmphasis}>\n          {helperText}\n        </HelperText>\n      ) : null}\n    </View>\n  );\n}\n"]}

package/dist/components/list-item/ListItem.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
 import type { ListItemProps } from './types';
+/*** Renders a static or pressable list item. */
 export declare function ListItem({ onPress, disabled, testID, ...content }: ListItemProps): React.JSX.Element;
 //# sourceMappingURL=ListItem.d.ts.map

package/dist/components/list-item/ListItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ListItem.d.ts","sourceRoot":"","sources":["../../../src/components/list-item/ListItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAuC7C,wBAAgB,QAAQ,CAAC,EAAE,OAAO,EAAE,QAAgB,EAAE,MAAM,EAAE,GAAG,OAAO,EAAE,EAAE,aAAa,qBAyBxF"}
+{"version":3,"file":"ListItem.d.ts","sourceRoot":"","sources":["../../../src/components/list-item/ListItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AA4C7C,gDAAgD;AAChD,wBAAgB,QAAQ,CAAC,EAAE,OAAO,EAAE,QAAgB,EAAE,MAAM,EAAE,GAAG,OAAO,EAAE,EAAE,aAAa,qBAuBxF"}

package/dist/components/list-item/ListItem.js

@@ -1,34 +1,35 @@
 import React from 'react';
-import { View } from 'react-native';
-import { Box } from '../../features/layout/public';
+import { View as ReactNativeView } from 'react-native';
+import { View } from '../../features/layout/public';
 import { Text } from '../../features/typography/public';
 import { ButtonBase } from '../../primitives/button-base';
 import { useTheme } from '../../theme/ThemeContext';
+/*** Renders the content row shared by static and interactive ListItem variants. */
 function ListItemContent({ title, description, leading, trailing, testID, }) {
     const { theme } = useTheme();
-    return (<Box px="m" py="m" testID={testID} style={{
+    return (<View px="m" py="m" testID={testID} style={{
             flexDirection: 'row',
             alignItems: 'center',
         }}>
-      {leading ? <View style={{ marginRight: theme.spacing.m }}>{leading}</View> : null}
-      <Box flex={1}>
+      {leading ? (<ReactNativeView style={{ marginRight: theme.spacing.m }}>{leading}</ReactNativeView>) : null}
+      <View flex={1}>
         {title ? (<Text numberOfLines={1} variant="body" weight="medium">
             {title}
           </Text>) : null}
         {description ? (<Text emphasis="muted" numberOfLines={2} variant="bodySmall">
             {description}
           </Text>) : null}
-      </Box>
-      {trailing ? <View style={{ marginLeft: theme.spacing.m }}>{trailing}</View> : null}
-    </Box>);
+      </View>
+      {trailing ? (<ReactNativeView style={{ marginLeft: theme.spacing.m }}>{trailing}</ReactNativeView>) : null}
+    </View>);
 }
+/*** Renders a static or pressable list item. */
 export function ListItem({ onPress, disabled = false, testID, ...content }) {
     const { theme } = useTheme();
-    if (!onPress) {
+    if (!onPress)
         return <ListItemContent {...content} testID={testID}/>;
-    }
     return (<ButtonBase accessibilityRole="button" disabled={disabled} onPress={onPress} testID={testID}>
-      {(state) => (<Box style={{
+      {(state) => (<View style={{
                 backgroundColor: state.pressed
                     ? theme.semantics.neutral.surfaceActive
                     : state.hovered
@@ -37,7 +38,7 @@ export function ListItem({ onPress, disabled = false, testID, ...content }) {
                 opacity: state.disabled ? 0.72 : 1,
             }}>
           <ListItemContent {...content}/>
-        </Box>)}
+        </View>)}
     </ButtonBase>);
 }
 //# sourceMappingURL=ListItem.js.map

package/dist/components/list-item/ListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItem.js","sourceRoot":"","sources":["../../../src/components/list-item/ListItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\n\nimport { Box } from '../../features/layout/public';\nimport { Text } from '../../features/typography/public';\nimport { ButtonBase } from '../../primitives/button-base';\nimport { useTheme } from '../../theme/ThemeContext';\nimport type { ListItemProps } from './types';\n\nfunction ListItemContent({\n  title,\n  description,\n  leading,\n  trailing,\n  testID,\n}: Omit<ListItemProps, 'disabled' | 'onPress'>) {\n  const { theme } = useTheme();\n\n  return (\n    <Box\n      px=\"m\"\n      py=\"m\"\n      testID={testID}\n      style={{\n        flexDirection: 'row',\n        alignItems: 'center',\n      }}\n    >\n      {leading ? <View style={{ marginRight: theme.spacing.m }}>{leading}</View> : null}\n      <Box flex={1}>\n        {title ? (\n          <Text numberOfLines={1} variant=\"body\" weight=\"medium\">\n            {title}\n          </Text>\n        ) : null}\n        {description ? (\n          <Text emphasis=\"muted\" numberOfLines={2} variant=\"bodySmall\">\n            {description}\n          </Text>\n        ) : null}\n      </Box>\n      {trailing ? <View style={{ marginLeft: theme.spacing.m }}>{trailing}</View> : null}\n    </Box>\n  );\n}\n\nexport function ListItem({ onPress, disabled = false, testID, ...content }: ListItemProps) {\n  const { theme } = useTheme();\n\n  if (!onPress) {\n    return <ListItemContent {...content} testID={testID} />;\n  }\n\n  return (\n    <ButtonBase accessibilityRole=\"button\" disabled={disabled} onPress={onPress} testID={testID}>\n      {(state) => (\n        <Box\n          style={{\n            backgroundColor: state.pressed\n              ? theme.semantics.neutral.surfaceActive\n              : state.hovered\n                ? theme.semantics.neutral.surfaceHover\n                : 'transparent',\n            opacity: state.disabled ? 0.72 : 1,\n          }}\n        >\n          <ListItemContent {...content} />\n        </Box>\n      )}\n    </ButtonBase>\n  );\n}\n"]}
+{"version":3,"file":"ListItem.js","sourceRoot":"","sources":["../../../src/components/list-item/ListItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { View as ReactNativeView } from 'react-native';\n\nimport { View } from '../../features/layout/public';\nimport { Text } from '../../features/typography/public';\nimport { ButtonBase } from '../../primitives/button-base';\nimport { useTheme } from '../../theme/ThemeContext';\nimport type { ListItemProps } from './types';\n\n/*** Renders the content row shared by static and interactive ListItem variants. */\nfunction ListItemContent({\n  title,\n  description,\n  leading,\n  trailing,\n  testID,\n}: Omit<ListItemProps, 'disabled' | 'onPress'>) {\n  const { theme } = useTheme();\n\n  return (\n    <View\n      px=\"m\"\n      py=\"m\"\n      testID={testID}\n      style={{\n        flexDirection: 'row',\n        alignItems: 'center',\n      }}\n    >\n      {leading ? (\n        <ReactNativeView style={{ marginRight: theme.spacing.m }}>{leading}</ReactNativeView>\n      ) : null}\n      <View flex={1}>\n        {title ? (\n          <Text numberOfLines={1} variant=\"body\" weight=\"medium\">\n            {title}\n          </Text>\n        ) : null}\n        {description ? (\n          <Text emphasis=\"muted\" numberOfLines={2} variant=\"bodySmall\">\n            {description}\n          </Text>\n        ) : null}\n      </View>\n      {trailing ? (\n        <ReactNativeView style={{ marginLeft: theme.spacing.m }}>{trailing}</ReactNativeView>\n      ) : null}\n    </View>\n  );\n}\n\n/*** Renders a static or pressable list item. */\nexport function ListItem({ onPress, disabled = false, testID, ...content }: ListItemProps) {\n  const { theme } = useTheme();\n\n  if (!onPress) return <ListItemContent {...content} testID={testID} />;\n\n  return (\n    <ButtonBase accessibilityRole=\"button\" disabled={disabled} onPress={onPress} testID={testID}>\n      {(state) => (\n        <View\n          style={{\n            backgroundColor: state.pressed\n              ? theme.semantics.neutral.surfaceActive\n              : state.hovered\n                ? theme.semantics.neutral.surfaceHover\n                : 'transparent',\n            opacity: state.disabled ? 0.72 : 1,\n          }}\n        >\n          <ListItemContent {...content} />\n        </View>\n      )}\n    </ButtonBase>\n  );\n}\n"]}

package/dist/components/switch/Switch.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
 import type { SwitchProps } from './types';
+/*** Renders a controlled or uncontrolled accessible switch. */
 export declare function Switch({ children, checked, defaultChecked, onCheckedChange, color, size, disabled, invalid, readOnly, accessibilityLabel, testID, ...props }: SwitchProps): React.JSX.Element;
 //# sourceMappingURL=Switch.d.ts.map

package/dist/components/switch/Switch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../../src/components/switch/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C,wBAAgB,MAAM,CAAC,EACrB,QAAQ,EACR,OAAO,EACP,cAAsB,EACtB,eAAe,EACf,KAAiB,EACjB,IAAU,EACV,QAAgB,EAChB,OAAe,EACf,QAAgB,EAChB,kBAAkB,EAClB,MAAM,EACN,GAAG,KAAK,EACT,EAAE,WAAW,qBAyFb"}
+{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../../src/components/switch/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C,+DAA+D;AAC/D,wBAAgB,MAAM,CAAC,EACrB,QAAQ,EACR,OAAO,EACP,cAAsB,EACtB,eAAe,EACf,KAAiB,EACjB,IAAU,EACV,QAAgB,EAChB,OAAe,EACf,QAAgB,EAChB,kBAAkB,EAClB,MAAM,EACN,GAAG,KAAK,EACT,EAAE,WAAW,qBAmFb"}

package/dist/components/switch/Switch.js

@@ -1,10 +1,11 @@
 import React from 'react';
-import { Box } from '../../features/layout/public';
+import { View } from '../../features/layout/public';
 import { Text } from '../../features/typography/public';
 import { resolveFieldState, resolveIndicatorSize, resolveSelectionControlColors, resolveSelectionControlNextChecked, } from '../../internal/resolvers';
 import { useControllableState } from '../../internal/useControllableState';
 import { ButtonBase } from '../../primitives/button-base';
 import { useTheme } from '../../theme/ThemeContext';
+/*** Renders a controlled or uncontrolled accessible switch. */
 export function Switch({ children, checked, defaultChecked = false, onCheckedChange, color = 'primary', size = 'm', disabled = false, invalid = false, readOnly = false, accessibilityLabel, testID, ...props }) {
     const { theme } = useTheme();
     const [isChecked, setChecked] = useControllableState({
@@ -19,11 +20,7 @@ export function Switch({ children, checked, defaultChecked = false, onCheckedCha
         kind: 'switch',
         readOnly,
     });
-    return (<ButtonBase {...props} accessibilityLabel={accessibilityLabel} accessibilityRole="switch" accessibilityState={{ checked: isChecked }} disabled={disabled} onPress={nextChecked === null
-            ? undefined
-            : () => {
-                setChecked(nextChecked);
-            }} testID={testID}>
+    return (<ButtonBase {...props} accessibilityLabel={accessibilityLabel} accessibilityRole="switch" accessibilityState={{ checked: isChecked }} disabled={disabled} onPress={nextChecked === null ? undefined : () => setChecked(nextChecked)} testID={testID}>
       {(interactionState) => {
             const fieldState = resolveFieldState({
                 disabled,
@@ -39,12 +36,12 @@ export function Switch({ children, checked, defaultChecked = false, onCheckedCha
                 color,
             });
             const labelEmphasis = colors.labelColor === theme.semantics.content.muted ? 'muted' : 'default';
-            return (<Box style={{
+            return (<View style={{
                     alignItems: 'center',
                     flexDirection: 'row',
                     opacity: colors.opacity,
                 }}>
-            <Box radius="full" style={{
+            <View radius="full" style={{
                     backgroundColor: colors.trackColor,
                     borderColor: colors.borderColor,
                     borderWidth: 1,
@@ -54,17 +51,17 @@ export function Switch({ children, checked, defaultChecked = false, onCheckedCha
                     width: indicatorSize.switchWidth,
                     height: indicatorSize.switchHeight,
                 }}>
-              <Box radius="full" style={{
+              <View radius="full" style={{
                     alignSelf: isChecked ? 'flex-end' : 'flex-start',
                     backgroundColor: colors.thumbColor,
                     height: indicatorSize.switchThumb,
                     width: indicatorSize.switchThumb,
                 }}/>
-            </Box>
-            {children ? (<Box ml="s">
+            </View>
+            {children ? (<View ml="s">
                 <Text emphasis={labelEmphasis}>{children}</Text>
-              </Box>) : null}
-          </Box>);
+              </View>) : null}
+          </View>);
         }}
     </ButtonBase>);
 }

package/dist/components/switch/Switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.js","sourceRoot":"","sources":["../../../src/components/switch/Switch.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { Box } from '../../features/layout/public';\nimport { Text } from '../../features/typography/public';\nimport {\n  resolveFieldState,\n  resolveIndicatorSize,\n  resolveSelectionControlColors,\n  resolveSelectionControlNextChecked,\n} from '../../internal/resolvers';\nimport { useControllableState } from '../../internal/useControllableState';\nimport { ButtonBase } from '../../primitives/button-base';\nimport { useTheme } from '../../theme/ThemeContext';\nimport type { SwitchProps } from './types';\n\nexport function Switch({\n  children,\n  checked,\n  defaultChecked = false,\n  onCheckedChange,\n  color = 'primary',\n  size = 'm',\n  disabled = false,\n  invalid = false,\n  readOnly = false,\n  accessibilityLabel,\n  testID,\n  ...props\n}: SwitchProps) {\n  const { theme } = useTheme();\n  const [isChecked, setChecked] = useControllableState<boolean>({\n    value: checked,\n    defaultValue: defaultChecked,\n    onChange: onCheckedChange,\n  });\n  const indicatorSize = resolveIndicatorSize(size);\n  const nextChecked = resolveSelectionControlNextChecked({\n    checked: isChecked,\n    disabled,\n    kind: 'switch',\n    readOnly,\n  });\n\n  return (\n    <ButtonBase\n      {...props}\n      accessibilityLabel={accessibilityLabel}\n      accessibilityRole=\"switch\"\n      accessibilityState={{ checked: isChecked }}\n      disabled={disabled}\n      onPress={\n        nextChecked === null\n          ? undefined\n          : () => {\n              setChecked(nextChecked);\n            }\n      }\n      testID={testID}\n    >\n      {(interactionState) => {\n        const fieldState = resolveFieldState({\n          disabled,\n          focused: interactionState.focused,\n          invalid,\n          readOnly,\n        });\n        const colors = resolveSelectionControlColors(theme, {\n          checked: isChecked,\n          fieldState,\n          hovered: interactionState.hovered,\n          pressed: interactionState.pressed,\n          color,\n        });\n        const labelEmphasis =\n          colors.labelColor === theme.semantics.content.muted ? 'muted' : 'default';\n\n        return (\n          <Box\n            style={{\n              alignItems: 'center',\n              flexDirection: 'row',\n              opacity: colors.opacity,\n            }}\n          >\n            <Box\n              radius=\"full\"\n              style={{\n                backgroundColor: colors.trackColor,\n                borderColor: colors.borderColor,\n                borderWidth: 1,\n                justifyContent: 'center',\n                minWidth: indicatorSize.switchWidth,\n                paddingHorizontal: 2,\n                width: indicatorSize.switchWidth,\n                height: indicatorSize.switchHeight,\n              }}\n            >\n              <Box\n                radius=\"full\"\n                style={{\n                  alignSelf: isChecked ? 'flex-end' : 'flex-start',\n                  backgroundColor: colors.thumbColor,\n                  height: indicatorSize.switchThumb,\n                  width: indicatorSize.switchThumb,\n                }}\n              />\n            </Box>\n            {children ? (\n              <Box ml=\"s\">\n                <Text emphasis={labelEmphasis}>{children}</Text>\n              </Box>\n            ) : null}\n          </Box>\n        );\n      }}\n    </ButtonBase>\n  );\n}\n"]}
+{"version":3,"file":"Switch.js","sourceRoot":"","sources":["../../../src/components/switch/Switch.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { View } from '../../features/layout/public';\nimport { Text } from '../../features/typography/public';\nimport {\n  resolveFieldState,\n  resolveIndicatorSize,\n  resolveSelectionControlColors,\n  resolveSelectionControlNextChecked,\n} from '../../internal/resolvers';\nimport { useControllableState } from '../../internal/useControllableState';\nimport { ButtonBase } from '../../primitives/button-base';\nimport { useTheme } from '../../theme/ThemeContext';\nimport type { SwitchProps } from './types';\n\n/*** Renders a controlled or uncontrolled accessible switch. */\nexport function Switch({\n  children,\n  checked,\n  defaultChecked = false,\n  onCheckedChange,\n  color = 'primary',\n  size = 'm',\n  disabled = false,\n  invalid = false,\n  readOnly = false,\n  accessibilityLabel,\n  testID,\n  ...props\n}: SwitchProps) {\n  const { theme } = useTheme();\n  const [isChecked, setChecked] = useControllableState<boolean>({\n    value: checked,\n    defaultValue: defaultChecked,\n    onChange: onCheckedChange,\n  });\n  const indicatorSize = resolveIndicatorSize(size);\n  const nextChecked = resolveSelectionControlNextChecked({\n    checked: isChecked,\n    disabled,\n    kind: 'switch',\n    readOnly,\n  });\n\n  return (\n    <ButtonBase\n      {...props}\n      accessibilityLabel={accessibilityLabel}\n      accessibilityRole=\"switch\"\n      accessibilityState={{ checked: isChecked }}\n      disabled={disabled}\n      onPress={nextChecked === null ? undefined : () => setChecked(nextChecked)}\n      testID={testID}\n    >\n      {(interactionState) => {\n        const fieldState = resolveFieldState({\n          disabled,\n          focused: interactionState.focused,\n          invalid,\n          readOnly,\n        });\n        const colors = resolveSelectionControlColors(theme, {\n          checked: isChecked,\n          fieldState,\n          hovered: interactionState.hovered,\n          pressed: interactionState.pressed,\n          color,\n        });\n        const labelEmphasis =\n          colors.labelColor === theme.semantics.content.muted ? 'muted' : 'default';\n\n        return (\n          <View\n            style={{\n              alignItems: 'center',\n              flexDirection: 'row',\n              opacity: colors.opacity,\n            }}\n          >\n            <View\n              radius=\"full\"\n              style={{\n                backgroundColor: colors.trackColor,\n                borderColor: colors.borderColor,\n                borderWidth: 1,\n                justifyContent: 'center',\n                minWidth: indicatorSize.switchWidth,\n                paddingHorizontal: 2,\n                width: indicatorSize.switchWidth,\n                height: indicatorSize.switchHeight,\n              }}\n            >\n              <View\n                radius=\"full\"\n                style={{\n                  alignSelf: isChecked ? 'flex-end' : 'flex-start',\n                  backgroundColor: colors.thumbColor,\n                  height: indicatorSize.switchThumb,\n                  width: indicatorSize.switchThumb,\n                }}\n              />\n            </View>\n            {children ? (\n              <View ml=\"s\">\n                <Text emphasis={labelEmphasis}>{children}</Text>\n              </View>\n            ) : null}\n          </View>\n        );\n      }}\n    </ButtonBase>\n  );\n}\n"]}

package/dist/{layout → core/responsive}/Show.d.ts

@@ -1,9 +1,10 @@
 import React from 'react';
-import { type Responsive } from '../core/responsive';
+import type { Responsive } from './types';
 export interface ShowProps {
     when: Responsive<boolean>;
     children: React.ReactNode;
     fallback?: React.ReactNode;
 }
+/*** Conditionally renders one responsive subtree or its fallback. */
 export declare function Show({ when, children, fallback }: ShowProps): React.JSX.Element;
 //# sourceMappingURL=Show.d.ts.map

package/dist/core/responsive/Show.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Show.d.ts","sourceRoot":"","sources":["../../../src/core/responsive/Show.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IAC1B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,qEAAqE;AACrE,wBAAgB,IAAI,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAe,EAAE,EAAE,SAAS,qBAIlE"}

package/dist/{layout → core/responsive}/Show.js

@@ -1,5 +1,7 @@
 import React from 'react';
-import { resolveResponsive, useResponsiveRuntime } from '../core/responsive';
+import { resolveResponsive } from './resolve';
+import { useResponsiveRuntime } from './ResponsiveProvider';
+/*** Conditionally renders one responsive subtree or its fallback. */
 export function Show({ when, children, fallback = null }) {
     const { breakpoint } = useResponsiveRuntime();
     const visible = resolveResponsive(when, breakpoint) ?? false;

package/dist/core/responsive/Show.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Show.js","sourceRoot":"","sources":["../../../src/core/responsive/Show.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAC;AAC9C,OAAO,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAS5D,qEAAqE;AACrE,MAAM,UAAU,IAAI,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,GAAG,IAAI,EAAa;IACjE,MAAM,EAAE,UAAU,EAAE,GAAG,oBAAoB,EAAE,CAAC;IAC9C,MAAM,OAAO,GAAG,iBAAiB,CAAC,IAAI,EAAE,UAAU,CAAC,IAAI,KAAK,CAAC;IAC7D,OAAO,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC;AAC9C,CAAC","sourcesContent":["import React from 'react';\n\nimport { resolveResponsive } from './resolve';\nimport { useResponsiveRuntime } from './ResponsiveProvider';\nimport type { Responsive } from './types';\n\nexport interface ShowProps {\n  when: Responsive<boolean>;\n  children: React.ReactNode;\n  fallback?: React.ReactNode;\n}\n\n/*** Conditionally renders one responsive subtree or its fallback. */\nexport function Show({ when, children, fallback = null }: ShowProps) {\n  const { breakpoint } = useResponsiveRuntime();\n  const visible = resolveResponsive(when, breakpoint) ?? false;\n  return <>{visible ? children : fallback}</>;\n}\n"]}

package/dist/core/responsive/index.d.ts

@@ -2,6 +2,7 @@ export { BREAKPOINT_ORDER, BREAKPOINTS } from './breakpoints';
 export { getBreakpointFromWidth } from './getBreakpointFromWidth';
 export { resolveResponsive } from './resolve';
 export { ResponsiveProvider, useResponsiveRuntime } from './ResponsiveProvider';
+export { Show, type ShowProps } from './Show';
 export type { Breakpoint, Responsive, ResponsiveRuntime } from './types';
 export { useBreakpoint } from './useBreakpoint';
 //# sourceMappingURL=index.d.ts.map

package/dist/core/responsive/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/core/responsive/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC9D,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAChF,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AACzE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/core/responsive/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC9D,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAChF,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAC;AAC9C,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AACzE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC"}

package/dist/core/responsive/index.js

@@ -2,5 +2,6 @@ export { BREAKPOINT_ORDER, BREAKPOINTS } from './breakpoints';
 export { getBreakpointFromWidth } from './getBreakpointFromWidth';
 export { resolveResponsive } from './resolve';
 export { ResponsiveProvider, useResponsiveRuntime } from './ResponsiveProvider';
+export { Show } from './Show';
 export { useBreakpoint } from './useBreakpoint';
 //# sourceMappingURL=index.js.map

package/dist/core/responsive/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/core/responsive/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC9D,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAEhF,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC","sourcesContent":["export { BREAKPOINT_ORDER, BREAKPOINTS } from './breakpoints';\nexport { getBreakpointFromWidth } from './getBreakpointFromWidth';\nexport { resolveResponsive } from './resolve';\nexport { ResponsiveProvider, useResponsiveRuntime } from './ResponsiveProvider';\nexport type { Breakpoint, Responsive, ResponsiveRuntime } from './types';\nexport { useBreakpoint } from './useBreakpoint';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/core/responsive/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC9D,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAChF,OAAO,EAAE,IAAI,EAAkB,MAAM,QAAQ,CAAC;AAE9C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC","sourcesContent":["export { BREAKPOINT_ORDER, BREAKPOINTS } from './breakpoints';\nexport { getBreakpointFromWidth } from './getBreakpointFromWidth';\nexport { resolveResponsive } from './resolve';\nexport { ResponsiveProvider, useResponsiveRuntime } from './ResponsiveProvider';\nexport { Show, type ShowProps } from './Show';\nexport type { Breakpoint, Responsive, ResponsiveRuntime } from './types';\nexport { useBreakpoint } from './useBreakpoint';\n"]}

package/dist/features/app-bar/adapters/inbound/AppBar.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { AppBarProps } from '../../../../types/app-bar';
+/*** Renders application chrome with optional safe-area padding and leading/trailing slots. */
+export declare function AppBar({ leading, trailing, children, safeAreaTop, divider, contentStyle, bg, style, ...props }: AppBarProps): React.JSX.Element;
+//# sourceMappingURL=AppBar.d.ts.map

package/dist/features/app-bar/adapters/inbound/AppBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppBar.d.ts","sourceRoot":"","sources":["../../../../../src/features/app-bar/adapters/inbound/AppBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAG7D,8FAA8F;AAC9F,wBAAgB,MAAM,CAAC,EACrB,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,WAAkB,EAClB,OAAe,EACf,YAAY,EACZ,EAAE,EACF,KAAK,EACL,GAAG,KAAK,EACT,EAAE,WAAW,qBAiCb"}

package/dist/features/app-bar/adapters/inbound/AppBar.js

@@ -0,0 +1,40 @@
+import React from 'react';
+import { StyleSheet, View as ReactNativeView } from 'react-native';
+import { SafeAreaInsetsContext } from 'react-native-safe-area-context';
+import { useTheme } from '../../../../theme/ThemeContext';
+import { Divider, View } from '../../../layout/public';
+/*** Renders application chrome with optional safe-area padding and leading/trailing slots. */
+export function AppBar({ leading, trailing, children, safeAreaTop = true, divider = false, contentStyle, bg, style, ...props }) {
+    const { theme } = useTheme();
+    const insets = React.use(SafeAreaInsetsContext);
+    const topInset = safeAreaTop ? (insets?.top ?? 0) : 0;
+    const safeAreaStyle = topInset === 0 ? undefined : { paddingTop: topInset };
+    return (<View {...props} bg={bg ?? theme.semantics.surface.default} style={style}>
+      <ReactNativeView style={safeAreaStyle}>
+        <ReactNativeView style={[styles.content, resolveHorizontalPadding(theme.spacing.m), contentStyle]}>
+          {leading ? (<ReactNativeView style={[styles.accessory, resolveAccessoryMargin(theme.spacing.s, 'leading')]}>
+              {leading}
+            </ReactNativeView>) : null}
+          <ReactNativeView style={styles.center}>{children}</ReactNativeView>
+          {trailing ? (<ReactNativeView style={[styles.accessory, resolveAccessoryMargin(theme.spacing.s, 'trailing')]}>
+              {trailing}
+            </ReactNativeView>) : null}
+        </ReactNativeView>
+        {divider ? <Divider color={theme.semantics.neutral.divider} thickness={1}/> : null}
+      </ReactNativeView>
+    </View>);
+}
+/*** Resolves dynamic horizontal padding for the AppBar content row. */
+function resolveHorizontalPadding(paddingHorizontal) {
+    return { paddingHorizontal };
+}
+/*** Resolves directional spacing for one AppBar accessory. */
+function resolveAccessoryMargin(spacing, position) {
+    return position === 'leading' ? { marginRight: spacing } : { marginLeft: spacing };
+}
+const styles = StyleSheet.create({
+    accessory: { flexShrink: 0 },
+    center: { flex: 1, minWidth: 0 },
+    content: { alignItems: 'center', flexDirection: 'row', minHeight: 56 },
+});
+//# sourceMappingURL=AppBar.js.map

package/dist/features/app-bar/adapters/inbound/AppBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppBar.js","sourceRoot":"","sources":["../../../../../src/features/app-bar/adapters/inbound/AppBar.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { StyleSheet, View as ReactNativeView, type ViewStyle } from 'react-native';\nimport { SafeAreaInsetsContext } from 'react-native-safe-area-context';\n\nimport { useTheme } from '../../../../theme/ThemeContext';\nimport type { AppBarProps } from '../../../../types/app-bar';\nimport { Divider, View } from '../../../layout/public';\n\n/*** Renders application chrome with optional safe-area padding and leading/trailing slots. */\nexport function AppBar({\n  leading,\n  trailing,\n  children,\n  safeAreaTop = true,\n  divider = false,\n  contentStyle,\n  bg,\n  style,\n  ...props\n}: AppBarProps) {\n  const { theme } = useTheme();\n  const insets = React.use(SafeAreaInsetsContext);\n  const topInset = safeAreaTop ? (insets?.top ?? 0) : 0;\n  const safeAreaStyle: ViewStyle | undefined =\n    topInset === 0 ? undefined : { paddingTop: topInset };\n\n  return (\n    <View {...props} bg={bg ?? theme.semantics.surface.default} style={style}>\n      <ReactNativeView style={safeAreaStyle}>\n        <ReactNativeView\n          style={[styles.content, resolveHorizontalPadding(theme.spacing.m), contentStyle]}\n        >\n          {leading ? (\n            <ReactNativeView\n              style={[styles.accessory, resolveAccessoryMargin(theme.spacing.s, 'leading')]}\n            >\n              {leading}\n            </ReactNativeView>\n          ) : null}\n          <ReactNativeView style={styles.center}>{children}</ReactNativeView>\n          {trailing ? (\n            <ReactNativeView\n              style={[styles.accessory, resolveAccessoryMargin(theme.spacing.s, 'trailing')]}\n            >\n              {trailing}\n            </ReactNativeView>\n          ) : null}\n        </ReactNativeView>\n        {divider ? <Divider color={theme.semantics.neutral.divider} thickness={1} /> : null}\n      </ReactNativeView>\n    </View>\n  );\n}\n\n/*** Resolves dynamic horizontal padding for the AppBar content row. */\nfunction resolveHorizontalPadding(paddingHorizontal: number): ViewStyle {\n  return { paddingHorizontal };\n}\n\n/*** Resolves directional spacing for one AppBar accessory. */\nfunction resolveAccessoryMargin(spacing: number, position: 'leading' | 'trailing'): ViewStyle {\n  return position === 'leading' ? { marginRight: spacing } : { marginLeft: spacing };\n}\n\nconst styles = StyleSheet.create({\n  accessory: { flexShrink: 0 },\n  center: { flex: 1, minWidth: 0 },\n  content: { alignItems: 'center', flexDirection: 'row', minHeight: 56 },\n});\n"]}

package/dist/features/app-bar/public.d.ts

@@ -0,0 +1,3 @@
+export type { AppBarProps } from '../../types/app-bar';
+export { AppBar } from './adapters/inbound/AppBar';
+//# sourceMappingURL=public.d.ts.map

package/dist/features/app-bar/public.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../../src/features/app-bar/public.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC"}

package/dist/features/app-bar/public.js

@@ -0,0 +1,2 @@
+export { AppBar } from './adapters/inbound/AppBar';
+//# sourceMappingURL=public.js.map

package/dist/features/app-bar/public.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"public.js","sourceRoot":"","sources":["../../../src/features/app-bar/public.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC","sourcesContent":["export type { AppBarProps } from '../../types/app-bar';\nexport { AppBar } from './adapters/inbound/AppBar';\n"]}

package/dist/features/badge/adapters/inbound/Badge.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { resolveButtonColors, resolveControlSize } from '../../../../internal/resolvers';
 import { useTheme } from '../../../../theme/ThemeContext';
-import { Box } from '../../../layout/public';
+import { View } from '../../../layout/public';
 import { Text } from '../../../typography/public';
 /*** Renders compact semantic status or metadata content. */
 export function Badge({ content, variant = 'soft', color = 'primary', size = 's', testID, }) {
@@ -12,11 +12,11 @@ export function Badge({ content, variant = 'soft', color = 'primary', size = 's'
         color,
         state: { disabled: false, focused: false, hovered: false, pressed: false },
     });
-    return (<Box px={Math.max(theme.spacing.xs, controlSize.paddingHorizontal - 4)} py={Math.max(4, controlSize.paddingVertical - 2)} radius={controlSize.borderRadius} style={resolveBadgeStyle(colors.backgroundColor, colors.borderColor, variant)} testID={testID}>
+    return (<View px={Math.max(theme.spacing.xs, controlSize.paddingHorizontal - 4)} py={Math.max(4, controlSize.paddingVertical - 2)} radius={controlSize.borderRadius} style={resolveBadgeStyle(colors.backgroundColor, colors.borderColor, variant)} testID={testID}>
       <Text color={color} emphasis={variant === 'solid' ? 'inverse' : 'default'} variant="bodySmall" weight="medium">
         {content}
       </Text>
-    </Box>);
+    </View>);
 }
 /*** Resolves the visual container style for one badge variant. */
 function resolveBadgeStyle(backgroundColor, borderColor, variant) {

package/dist/features/badge/adapters/inbound/Badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../../../../../src/features/badge/adapters/inbound/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACzF,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAE1D,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AAElD,4DAA4D;AAC5D,MAAM,UAAU,KAAK,CAAC,EACpB,OAAO,EACP,OAAO,GAAG,MAAM,EAChB,KAAK,GAAG,SAAS,EACjB,IAAI,GAAG,GAAG,EACV,MAAM,GACK;IACX,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,EAAE,CAAC;IAC7B,MAAM,WAAW,GAAG,kBAAkB,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;IACpD,MAAM,MAAM,GAAG,mBAAmB,CAAC,KAAK,EAAE;QACxC,OAAO;QACP,KAAK;QACL,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE;KAC3E,CAAC,CAAC;IAEH,OAAO,CACL,CAAC,GAAG,CACF,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,EAAE,WAAW,CAAC,iBAAiB,GAAG,CAAC,CAAC,CAAC,CAClE,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,WAAW,CAAC,eAAe,GAAG,CAAC,CAAC,CAAC,CACjD,MAAM,CAAC,CAAC,WAAW,CAAC,YAAY,CAAC,CACjC,KAAK,CAAC,CAAC,iBAAiB,CAAC,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,WAAW,EAAE,OAAO,CAAC,CAAC,CAC9E,MAAM,CAAC,CAAC,MAAM,CAAC,CAEf;MAAA,CAAC,IAAI,CACH,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,QAAQ,CAAC,CAAC,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CACtD,OAAO,CAAC,WAAW,CACnB,MAAM,CAAC,QAAQ,CAEf;QAAA,CAAC,OAAO,CACV;MAAA,EAAE,IAAI,CACR;IAAA,EAAE,GAAG,CAAC,CACP,CAAC;AACJ,CAAC;AAED,kEAAkE;AAClE,SAAS,iBAAiB,CACxB,eAAuB,EACvB,WAAmB,EACnB,OAA2C;IAE3C,OAAO;QACL,SAAS,EAAE,YAAY;QACvB,eAAe;QACf,WAAW;QACX,WAAW,EAAE,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;KACzC,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\nimport type { ViewStyle } from 'react-native';\n\nimport { resolveButtonColors, resolveControlSize } from '../../../../internal/resolvers';\nimport { useTheme } from '../../../../theme/ThemeContext';\nimport type { BadgeProps } from '../../../../types/badge';\nimport { Box } from '../../../layout/public';\nimport { Text } from '../../../typography/public';\n\n/*** Renders compact semantic status or metadata content. */\nexport function Badge({\n  content,\n  variant = 'soft',\n  color = 'primary',\n  size = 's',\n  testID,\n}: BadgeProps) {\n  const { theme } = useTheme();\n  const controlSize = resolveControlSize(theme, size);\n  const colors = resolveButtonColors(theme, {\n    variant,\n    color,\n    state: { disabled: false, focused: false, hovered: false, pressed: false },\n  });\n\n  return (\n    <Box\n      px={Math.max(theme.spacing.xs, controlSize.paddingHorizontal - 4)}\n      py={Math.max(4, controlSize.paddingVertical - 2)}\n      radius={controlSize.borderRadius}\n      style={resolveBadgeStyle(colors.backgroundColor, colors.borderColor, variant)}\n      testID={testID}\n    >\n      <Text\n        color={color}\n        emphasis={variant === 'solid' ? 'inverse' : 'default'}\n        variant=\"bodySmall\"\n        weight=\"medium\"\n      >\n        {content}\n      </Text>\n    </Box>\n  );\n}\n\n/*** Resolves the visual container style for one badge variant. */\nfunction resolveBadgeStyle(\n  backgroundColor: string,\n  borderColor: string,\n  variant: NonNullable<BadgeProps['variant']>,\n): ViewStyle {\n  return {\n    alignSelf: 'flex-start',\n    backgroundColor,\n    borderColor,\n    borderWidth: variant === 'solid' ? 0 : 1,\n  };\n}\n"]}
+{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../../../../../src/features/badge/adapters/inbound/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACzF,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAE1D,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,OAAO,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AAElD,4DAA4D;AAC5D,MAAM,UAAU,KAAK,CAAC,EACpB,OAAO,EACP,OAAO,GAAG,MAAM,EAChB,KAAK,GAAG,SAAS,EACjB,IAAI,GAAG,GAAG,EACV,MAAM,GACK;IACX,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,EAAE,CAAC;IAC7B,MAAM,WAAW,GAAG,kBAAkB,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;IACpD,MAAM,MAAM,GAAG,mBAAmB,CAAC,KAAK,EAAE;QACxC,OAAO;QACP,KAAK;QACL,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE;KAC3E,CAAC,CAAC;IAEH,OAAO,CACL,CAAC,IAAI,CACH,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,EAAE,WAAW,CAAC,iBAAiB,GAAG,CAAC,CAAC,CAAC,CAClE,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,WAAW,CAAC,eAAe,GAAG,CAAC,CAAC,CAAC,CACjD,MAAM,CAAC,CAAC,WAAW,CAAC,YAAY,CAAC,CACjC,KAAK,CAAC,CAAC,iBAAiB,CAAC,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,WAAW,EAAE,OAAO,CAAC,CAAC,CAC9E,MAAM,CAAC,CAAC,MAAM,CAAC,CAEf;MAAA,CAAC,IAAI,CACH,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,QAAQ,CAAC,CAAC,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CACtD,OAAO,CAAC,WAAW,CACnB,MAAM,CAAC,QAAQ,CAEf;QAAA,CAAC,OAAO,CACV;MAAA,EAAE,IAAI,CACR;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC;AAED,kEAAkE;AAClE,SAAS,iBAAiB,CACxB,eAAuB,EACvB,WAAmB,EACnB,OAA2C;IAE3C,OAAO;QACL,SAAS,EAAE,YAAY;QACvB,eAAe;QACf,WAAW;QACX,WAAW,EAAE,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;KACzC,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\nimport type { ViewStyle } from 'react-native';\n\nimport { resolveButtonColors, resolveControlSize } from '../../../../internal/resolvers';\nimport { useTheme } from '../../../../theme/ThemeContext';\nimport type { BadgeProps } from '../../../../types/badge';\nimport { View } from '../../../layout/public';\nimport { Text } from '../../../typography/public';\n\n/*** Renders compact semantic status or metadata content. */\nexport function Badge({\n  content,\n  variant = 'soft',\n  color = 'primary',\n  size = 's',\n  testID,\n}: BadgeProps) {\n  const { theme } = useTheme();\n  const controlSize = resolveControlSize(theme, size);\n  const colors = resolveButtonColors(theme, {\n    variant,\n    color,\n    state: { disabled: false, focused: false, hovered: false, pressed: false },\n  });\n\n  return (\n    <View\n      px={Math.max(theme.spacing.xs, controlSize.paddingHorizontal - 4)}\n      py={Math.max(4, controlSize.paddingVertical - 2)}\n      radius={controlSize.borderRadius}\n      style={resolveBadgeStyle(colors.backgroundColor, colors.borderColor, variant)}\n      testID={testID}\n    >\n      <Text\n        color={color}\n        emphasis={variant === 'solid' ? 'inverse' : 'default'}\n        variant=\"bodySmall\"\n        weight=\"medium\"\n      >\n        {content}\n      </Text>\n    </View>\n  );\n}\n\n/*** Resolves the visual container style for one badge variant. */\nfunction resolveBadgeStyle(\n  backgroundColor: string,\n  borderColor: string,\n  variant: NonNullable<BadgeProps['variant']>,\n): ViewStyle {\n  return {\n    alignSelf: 'flex-start',\n    backgroundColor,\n    borderColor,\n    borderWidth: variant === 'solid' ? 0 : 1,\n  };\n}\n"]}

package/dist/features/button/adapters/inbound/Button.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { ActivityIndicator, View } from 'react-native';
+import { ActivityIndicator, View as ReactNativeView } from 'react-native';
 import { resolveButtonColors, resolveControlSize, resolveIconSize, } from '../../../../internal/resolvers';
 import { ButtonBase } from '../../../../primitives/button-base';
 import { useTheme } from '../../../../theme/ThemeContext';
 import { Icon } from '../../../icon/public';
-import { Box } from '../../../layout/public';
+import { View } from '../../../layout/public';
 import { Text } from '../../../typography/public';
 /*** Renders the primary Surface action control with semantic visual states. */
 export function Button({ children, variant = 'solid', color = 'primary', size = 'm', disabled = false, loading = false, leadingIcon, trailingIcon, fullWidth = false, onPress, testID, ...props }) {
@@ -21,19 +21,19 @@ function ButtonContent({ children, color, controlSize, fullWidth, leadingIcon, l
     const colors = resolveButtonColors(theme, { variant, color, state });
     const muted = colors.contentColor === theme.semantics.content.muted;
     const iconSize = resolveIconSize(theme, size);
-    return (<Box px={controlSize.paddingHorizontal} py={controlSize.paddingVertical} radius={controlSize.borderRadius} style={resolveButtonContentStyle(controlSize, colors, fullWidth, variant)}>
+    return (<View px={controlSize.paddingHorizontal} py={controlSize.paddingVertical} radius={controlSize.borderRadius} style={resolveButtonContentStyle(controlSize, colors, fullWidth, variant)}>
       {loading ? (<ActivityIndicator color={colors.contentColor} size="small"/>) : (<>
-          {leadingIcon ? (<View style={resolveAccessoryStyle(theme.spacing.s, 'leading')}>
+          {leadingIcon ? (<ReactNativeView style={resolveAccessoryStyle(theme.spacing.s, 'leading')}>
               <Icon {...leadingIcon} color={colors.contentColor} size={iconSize}/>
-            </View>) : null}
+            </ReactNativeView>) : null}
           <Text color={muted ? undefined : color} emphasis={muted ? 'muted' : variant === 'solid' ? 'inverse' : 'default'} variant={controlSize.textVariant} weight="semiBold">
             {children}
           </Text>
-          {trailingIcon ? (<View style={resolveAccessoryStyle(theme.spacing.s, 'trailing')}>
+          {trailingIcon ? (<ReactNativeView style={resolveAccessoryStyle(theme.spacing.s, 'trailing')}>
               <Icon {...trailingIcon} color={colors.contentColor} size={iconSize}/>
-            </View>) : null}
+            </ReactNativeView>) : null}
         </>)}
-    </Box>);
+    </View>);
 }
 /*** Resolves the outer ButtonBase layout style. */
 function resolveButtonBaseStyle(fullWidth) {