react-native-terra-ui 0.3.0 → 0.4.1

package/CHANGELOG.md

@@ -1,5 +1,31 @@
 # Changelog
 
+## [0.4.1](https://github.com/earthlin9/react-native-terra-ui/compare/v0.4.0...v0.4.1) (2026-08-29)
+
+### Features
+
+* **showcase:** use Screen.List for the gallery list ([45daf7f](https://github.com/earthlin9/react-native-terra-ui/commit/45daf7ffe77f401f77567ca394b343beca460314))
+* **theme:** tune default header height and vertical margin scale ([3f8a73a](https://github.com/earthlin9/react-native-terra-ui/commit/3f8a73a68ccbf13d536534f1753cda66844ffdb3))
+* **ui:** [screen] add Screen.List, a polymorphic list container ([ec2909f](https://github.com/earthlin9/react-native-terra-ui/commit/ec2909f4646c9a83259485e54e68d33c0dd99912))
+
+### Bug Fixes
+
+* **showcase:** allow iPad to rotate ([bf081f5](https://github.com/earthlin9/react-native-terra-ui/commit/bf081f59477feaabaefe364df9e8eaabf1d42708))
+* **ui:** [screen] keep breakpoint-derived margins reactive on rotation ([4b2f28b](https://github.com/earthlin9/react-native-terra-ui/commit/4b2f28be54a48e383eeed7708ac7eabbcf6ca62e))
+
+## [0.4.0](https://github.com/earthlin9/react-native-terra-ui/compare/v0.3.0...v0.4.0) (2026-08-28)
+
+### ⚠ BREAKING CHANGES
+
+* **theme:** theme.layout.screen.margin.x and .y are now
+  Record<BreakpointName, number> instead of number. Any direct read of
+  theme.layout.screen.margin.x/y must resolve it first with
+  resolveScreenMargin(theme, rt.breakpoint) or useScreenMargin().
+
+### Features
+
+* **theme:** [screen] make screen margin follow viewport breakpoints ([#12](https://github.com/earthlin9/react-native-terra-ui/issues/12)) ([17ac346](https://github.com/earthlin9/react-native-terra-ui/commit/17ac346abaf0bc10a4b3265de088911a626394ad))
+
 ## [0.3.0](https://github.com/earthling-std/react-native-terra-ui/compare/v0.2.2...v0.3.0) (2026-08-26)
 
 ### ⚠ BREAKING CHANGES

package/lib/module/components/screen/Screen.js

@@ -8,6 +8,7 @@ import { PortalProvider } from "../portal/index.js";
 import { ScreenScrollProvider } from "./ScreenContext.js";
 import { ScreenFlashList } from "./ScreenFlashList.js";
 import { ScreenFlatList } from "./ScreenFlatList.js";
+import { ScreenList } from "./ScreenList.js";
 import { ScreenScrollView } from "./ScreenScrollView.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 /**
@@ -47,7 +48,8 @@ function hasScreenHeader(children) {
 /**
  * Themed page container: solid themed background, safe-area handling, and a
  * shared scroll context for headers. Pair with `Screen.ScrollView` /
- * `Screen.FlatList` and a `Header.LargeTitle` / `Header.Title`.
+ * `Screen.List` (or `Screen.FlatList` / `Screen.FlashList` directly) and a
+ * `Header.LargeTitle` / `Header.Title`.
  *
  * @example
  * ```tsx
@@ -88,6 +90,7 @@ ScreenBase.Header = ScreenHeader;
 ScreenBase.ScrollView = ScreenScrollView;
 ScreenBase.FlatList = ScreenFlatList;
 ScreenBase.FlashList = ScreenFlashList;
+ScreenBase.List = ScreenList;
 export const Screen = ScreenBase;
 const styles = StyleSheet.create((_theme, _runtime) => ({
   container: {

package/lib/module/components/screen/Screen.js.map

@@ -1 +1 @@
-{"version":3,"names":["Children","Fragment","forwardRef","isValidElement","useMemo","StyleSheet","useUnistyles","resolveThemeColor","PortalProvider","ScreenScrollProvider","ScreenFlashList","ScreenFlatList","ScreenScrollView","jsx","_jsx","ScreenHeader","children","as","rest","Component","displayName","hasScreenHeader","found","forEach","child","type","ScreenBase","Screen","bg","margins","hasMargins","style","_ref","hasHeader","resolvedMargins","theme","resolvedBg","color","background","View","styles","container","Header","ScrollView","FlatList","FlashList","create","_theme","_runtime","flex"],"sourceRoot":"../../../../src","sources":["components/screen/Screen.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["Children","Fragment","forwardRef","isValidElement","useMemo","StyleSheet","useUnistyles","resolveThemeColor","PortalProvider","ScreenScrollProvider","ScreenFlashList","ScreenFlatList","ScreenList","ScreenScrollView","jsx","_jsx","ScreenHeader","children","as","rest","Component","displayName","hasScreenHeader","found","forEach","child","type","ScreenBase","Screen","bg","margins","hasMargins","style","_ref","hasHeader","resolvedMargins","theme","resolvedBg","color","background","View","styles","container","Header","ScrollView","FlatList","FlashList","List","create","_theme","_runtime","flex"],"sourceRoot":"../../../../src","sources":["components/screen/Screen.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/screen/ScreenFlashList.js

@@ -4,6 +4,7 @@ import { View } from "react-native-unistyles/components/native/View";
 import { FlashList } from '@shopify/flash-list';
 import Animated, { useAnimatedScrollHandler, useComposedEventHandler } from 'react-native-reanimated';
 import { StyleSheet } from 'react-native-unistyles';
+import { resolveScreenMargin } from "../../theme/screen-margin.js";
 import { PortalHost } from "../portal/index.js";
 import { BottomSafeArea } from "./parts/BottomSafeArea.js";
 import { renderScreenPlaceholder } from "./parts/ScreenPlaceholder.js";
@@ -94,10 +95,12 @@ export function ScreenFlashList({
   const footerComponent = /*#__PURE__*/_jsxs(_Fragment, {
     children: [renderListHeader(ListFooterComponent), needsBottomSafeArea ? /*#__PURE__*/_jsx(BottomSafeArea, {}) : null]
   });
-  const headerComponent = /*#__PURE__*/_jsxs(View, {
-    style: styles.headerWrapper(resolvedMargins),
-    children: [/*#__PURE__*/_jsx(PortalHost, {
-      name: SCREEN_HEADER_PORTAL_HOST
+  const headerComponent = /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(View, {
+      style: styles.headerWrapper(resolvedMargins),
+      children: /*#__PURE__*/_jsx(PortalHost, {
+        name: SCREEN_HEADER_PORTAL_HOST
+      })
     }), renderListHeader(ListHeaderComponent)]
   });
   return /*#__PURE__*/_jsx(AnimatedFlashList, {
@@ -118,8 +121,19 @@ export function ScreenFlashList({
     onScroll: composedHandler
   });
 }
+
+// `resolveScreenMargin` is called *inside* each dynamic function below, not
+// hoisted to the factory's top level — the Babel plugin only attributes a
+// runtime dependency (here, breakpoint) to a style key when the `rt`/
+// `runtime` read it derives from sits inside that key's own value. Hoisting
+// it would silently drop the dependency, so the margin would freeze at
+// whatever breakpoint was active on mount and never update on rotation.
 const styles = StyleSheet.create((theme, runtime) => ({
   content: (margins, hasHeader, bottomInset) => {
+    const {
+      x: marginX,
+      y: marginY
+    } = resolveScreenMargin(theme, runtime.breakpoint);
     return {
       flexGrow: 1,
       // The header is absolutely positioned, so the list reserves its full
@@ -127,21 +141,26 @@ const styles = StyleSheet.create((theme, runtime) => ({
       // also get UIKit's automatic inset adjustment: on a native tab screen
       // that means `disableAutomaticContentInsets` on the tab, or the two
       // insets are counted twice.
-      paddingTop: (hasHeader ? theme.layout.header.height + runtime.insets.top : 0) + (hasYMargin(margins) ? theme.layout.screen.margin.y : 0),
-      paddingHorizontal: hasXMargin(margins) ? theme.layout.screen.margin.x : 0,
+      paddingTop: (hasHeader ? theme.layout.header.height + runtime.insets.top : 0) + (hasYMargin(margins) ? marginY : 0),
+      paddingHorizontal: hasXMargin(margins) ? marginX : 0,
       // The safe area is `BottomSafeArea`'s job; counting it here as well
       // would leave a gap the height of the gesture bar.
-      paddingBottom: bottomInset ?? (hasYMargin(margins) ? theme.layout.screen.margin.y : 0),
-      uni__dependencies: [0, 9]
+      paddingBottom: bottomInset ?? (hasYMargin(margins) ? marginY : 0),
+      uni__dependencies: [0, 3, 9]
     };
   },
   safeArea: {
     height: runtime.insets.top,
     uni__dependencies: [9]
   },
-  headerWrapper: margins => ({
-    marginHorizontal: hasXMargin(margins) ? -theme.layout.screen.margin.x : 0,
-    uni__dependencies: [0]
-  })
+  headerWrapper: margins => {
+    const {
+      x: marginX
+    } = resolveScreenMargin(theme, runtime.breakpoint);
+    return {
+      marginHorizontal: hasXMargin(margins) ? -marginX : 0,
+      uni__dependencies: [0, 3]
+    };
+  }
 }));
 //# sourceMappingURL=ScreenFlashList.js.map

package/lib/module/components/screen/ScreenFlashList.js.map

@@ -1 +1 @@
-{"version":3,"names":["FlashList","Animated","useAnimatedScrollHandler","useComposedEventHandler","StyleSheet","PortalHost","BottomSafeArea","renderScreenPlaceholder","SCREEN_HEADER_PORTAL_HOST","useScreen","hasXMargin","hasYMargin","renderListHeader","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","AnimatedFlashList","createAnimatedComponent","ScreenFlashList","data","style","contentContainerStyle","ListHeaderComponent","ListFooterComponent","ListEmptyComponent","horizontal","loading","LoadingComponent","EmptyComponent","margins","bottomInset","onScroll","rest","Error","background","scrollHandler","headerSnapOffsets","screenMargins","hasHeader","resolvedMargins","placeholder","isEmpty","length","jsScrollHandler","event","composedHandler","listProps","needsBottomSafeArea","undefined","footerComponent","children","headerComponent","View","styles","headerWrapper","name","backgroundColor","contentInsetAdjustmentBehavior","content","showsVerticalScrollIndicator","scrollEventThrottle","snapToOffsets","create","theme","runtime","flexGrow","paddingTop","layout","header","height","insets","top","screen","margin","y","paddingHorizontal","x","paddingBottom","uni__dependencies","safeArea","marginHorizontal"],"sourceRoot":"../../../../src","sources":["components/screen/ScreenFlashList.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["FlashList","Animated","useAnimatedScrollHandler","useComposedEventHandler","StyleSheet","resolveScreenMargin","PortalHost","BottomSafeArea","renderScreenPlaceholder","SCREEN_HEADER_PORTAL_HOST","useScreen","hasXMargin","hasYMargin","renderListHeader","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","AnimatedFlashList","createAnimatedComponent","ScreenFlashList","data","style","contentContainerStyle","ListHeaderComponent","ListFooterComponent","ListEmptyComponent","horizontal","loading","LoadingComponent","EmptyComponent","margins","bottomInset","onScroll","rest","Error","background","scrollHandler","headerSnapOffsets","screenMargins","hasHeader","resolvedMargins","placeholder","isEmpty","length","jsScrollHandler","event","composedHandler","listProps","needsBottomSafeArea","undefined","footerComponent","children","headerComponent","View","styles","headerWrapper","name","backgroundColor","contentInsetAdjustmentBehavior","content","showsVerticalScrollIndicator","scrollEventThrottle","snapToOffsets","create","theme","runtime","x","marginX","y","marginY","breakpoint","flexGrow","paddingTop","layout","header","height","insets","top","paddingHorizontal","paddingBottom","uni__dependencies","safeArea","marginHorizontal"],"sourceRoot":"../../../../src","sources":["components/screen/ScreenFlashList.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/screen/ScreenFlatList.js

@@ -3,6 +3,7 @@
 import { View } from "react-native-unistyles/components/native/View";
 import Animated, { useAnimatedScrollHandler, useComposedEventHandler } from 'react-native-reanimated';
 import { StyleSheet } from 'react-native-unistyles';
+import { resolveScreenMargin } from "../../theme/screen-margin.js";
 import { PortalHost } from "../portal/index.js";
 import { BottomSafeArea } from "./parts/BottomSafeArea.js";
 import { renderScreenPlaceholder } from "./parts/ScreenPlaceholder.js";
@@ -79,12 +80,12 @@ export function ScreenFlatList({
   const footerComponent = /*#__PURE__*/_jsxs(_Fragment, {
     children: [renderListHeader(ListFooterComponent), needsBottomSafeArea ? /*#__PURE__*/_jsx(BottomSafeArea, {}) : null]
   });
-  const headerComponent = /*#__PURE__*/_jsxs(View, {
-    style: styles.headerWrapper(resolvedMargins),
-    children: [hasHeader ? /*#__PURE__*/_jsx(View, {
-      style: styles.header
-    }) : null, /*#__PURE__*/_jsx(PortalHost, {
-      name: SCREEN_HEADER_PORTAL_HOST
+  const headerComponent = /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(View, {
+      style: styles.headerWrapper(resolvedMargins),
+      children: /*#__PURE__*/_jsx(PortalHost, {
+        name: SCREEN_HEADER_PORTAL_HOST
+      })
     }), renderListHeader(ListHeaderComponent)]
   });
   return /*#__PURE__*/_jsx(Animated.FlatList, {
@@ -106,35 +107,49 @@ export function ScreenFlatList({
     onScroll: composedHandler
   });
 }
+
+// `resolveScreenMargin` is called *inside* each dynamic function below, not
+// hoisted to the factory's top level — the Babel plugin only attributes a
+// runtime dependency (here, breakpoint) to a style key when the `rt`/
+// `runtime` read it derives from sits inside that key's own value. Hoisting
+// it would silently drop the dependency, so the margin would freeze at
+// whatever breakpoint was active on mount and never update on rotation.
 const styles = StyleSheet.create((theme, runtime) => ({
   scrollContent: {
     flexGrow: 1
   },
-  content: (margins, hasHeader, bottomInset) => ({
-    flexGrow: 1,
-    // The header is absolutely positioned, so the list reserves its full
-    // height — bar plus top safe area. This assumes the scroll view does not
-    // also get UIKit's automatic inset adjustment: on a native tab screen
-    // that means `disableAutomaticContentInsets` on the tab, or the two
-    // insets are counted twice.
-    paddingTop: (hasHeader ? theme.layout.header.height + runtime.insets.top : 0) + (hasYMargin(margins) ? theme.layout.screen.margin.y : 0),
-    paddingHorizontal: hasXMargin(margins) ? theme.layout.screen.margin.x : 0,
-    // The safe area is `BottomSafeArea`'s job; counting it here as well would
-    // leave a gap the height of the gesture bar.
-    paddingBottom: bottomInset ?? (hasYMargin(margins) ? theme.layout.screen.margin.y : 0),
-    uni__dependencies: [0, 9]
-  }),
+  content: (margins, hasHeader, bottomInset) => {
+    const {
+      x: marginX,
+      y: marginY
+    } = resolveScreenMargin(theme, runtime.breakpoint);
+    return {
+      flexGrow: 1,
+      // The header is absolutely positioned, so the list reserves its full
+      // height — bar plus top safe area. This assumes the scroll view does not
+      // also get UIKit's automatic inset adjustment: on a native tab screen
+      // that means `disableAutomaticContentInsets` on the tab, or the two
+      // insets are counted twice.
+      paddingTop: (hasHeader ? theme.layout.header.height + runtime.insets.top : 0) + (hasYMargin(margins) ? marginY : 0),
+      paddingHorizontal: hasXMargin(margins) ? marginX : 0,
+      // The safe area is `BottomSafeArea`'s job; counting it here as well
+      // would leave a gap the height of the gesture bar.
+      paddingBottom: bottomInset ?? (hasYMargin(margins) ? marginY : 0),
+      uni__dependencies: [0, 3, 9]
+    };
+  },
   safeArea: {
     height: runtime.insets.top,
     uni__dependencies: [9]
   },
-  headerWrapper: margins => ({
-    marginHorizontal: hasXMargin(margins) ? -theme.layout.screen.margin.x : 0,
-    uni__dependencies: [0]
-  }),
-  header: {
-    height: theme.layout.header.height,
-    uni__dependencies: [0]
+  headerWrapper: margins => {
+    const {
+      x: marginX
+    } = resolveScreenMargin(theme, runtime.breakpoint);
+    return {
+      marginHorizontal: hasXMargin(margins) ? -marginX : 0,
+      uni__dependencies: [0, 3]
+    };
   }
 }));
 //# sourceMappingURL=ScreenFlatList.js.map

package/lib/module/components/screen/ScreenFlatList.js.map

@@ -1 +1 @@
-{"version":3,"names":["Animated","useAnimatedScrollHandler","useComposedEventHandler","StyleSheet","PortalHost","BottomSafeArea","renderScreenPlaceholder","SCREEN_HEADER_PORTAL_HOST","useScreen","hasXMargin","hasYMargin","renderListHeader","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","ScreenFlatList","data","style","contentContainerStyle","ListHeaderComponent","ListFooterComponent","ListEmptyComponent","horizontal","loading","LoadingComponent","EmptyComponent","margins","bottomInset","onScroll","rest","background","scrollRef","scrollHandler","headerSnapOffsets","screenMargins","hasHeader","resolvedMargins","placeholder","isEmpty","length","jsScrollHandler","event","composedHandler","needsBottomSafeArea","undefined","footerComponent","children","headerComponent","View","styles","headerWrapper","header","name","FlatList","ref","backgroundColor","contentInsetAdjustmentBehavior","content","showsVerticalScrollIndicator","scrollEventThrottle","snapToOffsets","create","theme","runtime","scrollContent","flexGrow","paddingTop","layout","height","insets","top","screen","margin","y","paddingHorizontal","x","paddingBottom","uni__dependencies","safeArea","marginHorizontal"],"sourceRoot":"../../../../src","sources":["components/screen/ScreenFlatList.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["Animated","useAnimatedScrollHandler","useComposedEventHandler","StyleSheet","resolveScreenMargin","PortalHost","BottomSafeArea","renderScreenPlaceholder","SCREEN_HEADER_PORTAL_HOST","useScreen","hasXMargin","hasYMargin","renderListHeader","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","ScreenFlatList","data","style","contentContainerStyle","ListHeaderComponent","ListFooterComponent","ListEmptyComponent","horizontal","loading","LoadingComponent","EmptyComponent","margins","bottomInset","onScroll","rest","background","scrollRef","scrollHandler","headerSnapOffsets","screenMargins","hasHeader","resolvedMargins","placeholder","isEmpty","length","jsScrollHandler","event","composedHandler","needsBottomSafeArea","undefined","footerComponent","children","headerComponent","View","styles","headerWrapper","name","FlatList","ref","backgroundColor","contentInsetAdjustmentBehavior","content","showsVerticalScrollIndicator","scrollEventThrottle","snapToOffsets","create","theme","runtime","scrollContent","flexGrow","x","marginX","y","marginY","breakpoint","paddingTop","layout","header","height","insets","top","paddingHorizontal","paddingBottom","uni__dependencies","safeArea","marginHorizontal"],"sourceRoot":"../../../../src","sources":["components/screen/ScreenFlatList.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/screen/ScreenList.js

@@ -0,0 +1,160 @@
+"use strict";
+
+import { View } from "react-native-unistyles/components/native/View";
+import { FlatList } from "react-native-unistyles/components/native/FlatList";
+import { useMemo } from 'react';
+import Animated, { useAnimatedScrollHandler, useComposedEventHandler } from 'react-native-reanimated';
+import { StyleSheet } from 'react-native-unistyles';
+import { resolveScreenMargin } from "../../theme/screen-margin.js";
+import { PortalHost } from "../portal/index.js";
+import { BottomSafeArea } from "./parts/BottomSafeArea.js";
+import { renderScreenPlaceholder } from "./parts/ScreenPlaceholder.js";
+import { SCREEN_HEADER_PORTAL_HOST, useScreen } from "./ScreenContext.js";
+import { hasXMargin, hasYMargin, renderListHeader } from "./utils.js";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Polymorphic list container — renders whichever list `as` names (defaults
+ * to `FlatList`), applying the same margin/header/safe-area/scroll-handler
+ * chrome regardless of which one it is. A screen can swap list
+ * implementations by changing `as`, without relearning the surrounding API.
+ *
+ * @example
+ * ```tsx
+ * <Screen.List data={items} renderItem={({ item }) => <Row item={item} />} />
+ * ```
+ *
+ * @example Any other list component
+ * ```tsx
+ * import { FlashList } from '@shopify/flash-list';
+ *
+ * <Screen.List
+ *   as={FlashList}
+ *   data={items}
+ *   renderItem={({ item }) => <Row item={item} />}
+ * />
+ * ```
+ */
+export function ScreenList({
+  as,
+  data,
+  renderItem,
+  style,
+  contentContainerStyle,
+  ListHeaderComponent,
+  ListFooterComponent,
+  ListEmptyComponent,
+  horizontal = false,
+  loading = false,
+  LoadingComponent,
+  EmptyComponent,
+  margins,
+  bottomInset,
+  onScroll,
+  ...rest
+}) {
+  const isDefaultFlatList = as === undefined;
+  const Component = as ?? FlatList;
+
+  // `Animated.createAnimatedComponent` should only run once per component,
+  // not on every render — `as` is arbitrary here (not a fixed module-scope
+  // reference like `Screen.FlatList`/`Screen.FlashList` use), so it's
+  // memoized on the resolved component instead of hoisted to module scope.
+  const AnimatedComponent = useMemo(() => Animated.createAnimatedComponent(Component), [Component]);
+  const {
+    background,
+    scrollRef,
+    scrollHandler,
+    headerSnapOffsets,
+    margins: screenMargins,
+    hasHeader
+  } = useScreen();
+  const resolvedMargins = margins ?? screenMargins;
+  // The placeholder rides in on `ListEmptyComponent` rather than replacing the
+  // list, so the header portal, scroll binding and snap offsets all stay put.
+  // While loading the list is fed an empty `data` so that slot is the one that
+  // renders.
+  const placeholder = renderScreenPlaceholder({
+    loading,
+    LoadingComponent,
+    EmptyComponent,
+    isEmpty: !data || data.length === 0
+  });
+  const jsScrollHandler = useAnimatedScrollHandler(event => {
+    if (onScroll) onScroll(event);
+  }, [onScroll]);
+  const composedHandler = useComposedEventHandler([scrollHandler, jsScrollHandler]);
+
+  // A caller naming its own `bottomInset` has taken the bottom over entirely,
+  // and a horizontal list has no bottom edge to clear.
+  const needsBottomSafeArea = bottomInset === undefined && !horizontal;
+  const footerComponent = /*#__PURE__*/_jsxs(_Fragment, {
+    children: [renderListHeader(ListFooterComponent), needsBottomSafeArea ? /*#__PURE__*/_jsx(BottomSafeArea, {}) : null]
+  });
+  const headerComponent = /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(View, {
+      style: styles.headerWrapper(resolvedMargins),
+      children: /*#__PURE__*/_jsx(PortalHost, {
+        name: SCREEN_HEADER_PORTAL_HOST
+      })
+    }), renderListHeader(ListHeaderComponent)]
+  });
+  return /*#__PURE__*/_jsx(AnimatedComponent, {
+    ref: isDefaultFlatList ? scrollRef : undefined,
+    data: loading ? [] : data,
+    renderItem: renderItem,
+    style: [{
+      backgroundColor: background
+    }, style],
+    horizontal: horizontal,
+    contentInsetAdjustmentBehavior: hasHeader ? 'never' : undefined,
+    contentContainerStyle: [styles.content(resolvedMargins, hasHeader, bottomInset), contentContainerStyle],
+    ListHeaderComponent: headerComponent,
+    ListFooterComponent: footerComponent,
+    ListEmptyComponent: placeholder ?? ListEmptyComponent,
+    showsVerticalScrollIndicator: false,
+    scrollEventThrottle: 16,
+    snapToOffsets: headerSnapOffsets,
+    ...rest,
+    onScroll: composedHandler
+  });
+}
+ScreenList.displayName = 'Screen.List';
+
+// `resolveScreenMargin` is called *inside* each dynamic function below, not
+// hoisted to the factory's top level — the Babel plugin only attributes a
+// runtime dependency (here, breakpoint) to a style key when the `rt`/
+// `runtime` read it derives from sits inside that key's own value. Hoisting
+// it would silently drop the dependency, so the margin would freeze at
+// whatever breakpoint was active on mount and never update on rotation.
+const styles = StyleSheet.create((theme, runtime) => ({
+  content: (margins, hasHeader, bottomInset) => {
+    const {
+      x: marginX,
+      y: marginY
+    } = resolveScreenMargin(theme, runtime.breakpoint);
+    return {
+      flexGrow: 1,
+      // The header is absolutely positioned, so the list reserves its full
+      // height — bar plus top safe area. This assumes the scroll view does not
+      // also get UIKit's automatic inset adjustment: on a native tab screen
+      // that means `disableAutomaticContentInsets` on the tab, or the two
+      // insets are counted twice.
+      paddingTop: (hasHeader ? theme.layout.header.height + runtime.insets.top : 0) + (hasYMargin(margins) ? marginY : 0),
+      paddingHorizontal: hasXMargin(margins) ? marginX : 0,
+      // The safe area is `BottomSafeArea`'s job; counting it here as well
+      // would leave a gap the height of the gesture bar.
+      paddingBottom: bottomInset ?? (hasYMargin(margins) ? marginY : 0),
+      uni__dependencies: [0, 3, 9]
+    };
+  },
+  headerWrapper: margins => {
+    const {
+      x: marginX
+    } = resolveScreenMargin(theme, runtime.breakpoint);
+    return {
+      marginHorizontal: hasXMargin(margins) ? -marginX : 0,
+      uni__dependencies: [0, 3]
+    };
+  }
+}));
+//# sourceMappingURL=ScreenList.js.map

package/lib/module/components/screen/ScreenList.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useMemo","Animated","useAnimatedScrollHandler","useComposedEventHandler","StyleSheet","resolveScreenMargin","PortalHost","BottomSafeArea","renderScreenPlaceholder","SCREEN_HEADER_PORTAL_HOST","useScreen","hasXMargin","hasYMargin","renderListHeader","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","ScreenList","as","data","renderItem","style","contentContainerStyle","ListHeaderComponent","ListFooterComponent","ListEmptyComponent","horizontal","loading","LoadingComponent","EmptyComponent","margins","bottomInset","onScroll","rest","isDefaultFlatList","undefined","Component","FlatList","AnimatedComponent","createAnimatedComponent","background","scrollRef","scrollHandler","headerSnapOffsets","screenMargins","hasHeader","resolvedMargins","placeholder","isEmpty","length","jsScrollHandler","event","composedHandler","needsBottomSafeArea","footerComponent","children","headerComponent","View","styles","headerWrapper","name","ref","backgroundColor","contentInsetAdjustmentBehavior","content","showsVerticalScrollIndicator","scrollEventThrottle","snapToOffsets","displayName","create","theme","runtime","x","marginX","y","marginY","breakpoint","flexGrow","paddingTop","layout","header","height","insets","top","paddingHorizontal","paddingBottom","uni__dependencies","marginHorizontal"],"sourceRoot":"../../../../src","sources":["components/screen/ScreenList.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/screen/ScreenScrollView.js

@@ -5,6 +5,7 @@ import { Children } from 'react';
 import Animated, { useAnimatedScrollHandler, useComposedEventHandler } from 'react-native-reanimated';
 import { StyleSheet } from 'react-native-unistyles';
 import { scheduleOnRN } from 'react-native-worklets';
+import { resolveScreenMargin } from "../../theme/screen-margin.js";
 import { PortalHost } from "../portal/index.js";
 import { BottomSafeArea } from "./parts/BottomSafeArea.js";
 import { renderScreenPlaceholder } from "./parts/ScreenPlaceholder.js";
@@ -131,21 +132,38 @@ export function ScreenScrollView({
   });
 }
 const styles = StyleSheet.create((theme, rt) => ({
-  scrollContent: (hasHeader, margins) => ({
-    flexGrow: 1,
-    // The header inset and the safe area are structural — they apply whether
-    // or not margins are on; the y margin stacks on top of them.
-    paddingTop: (hasHeader ? theme.layout.header.height + rt.insets.top : 0) + (hasYMargin(margins) ? theme.layout.screen.margin.y : 0),
-    // The safe area is `BottomSafeArea`'s job; counting it here as well would
-    // leave a gap the height of the gesture bar.
-    paddingBottom: hasYMargin(margins) ? theme.layout.screen.margin.y : 0,
-    uni__dependencies: [0, 9]
-  }),
-  content: (horizontal, margins) => ({
-    flexGrow: 1,
-    paddingHorizontal: hasXMargin(margins) ? theme.layout.screen.margin.x : 0,
-    flexDirection: horizontal ? 'row' : 'column',
-    uni__dependencies: [0]
-  })
+  // `resolveScreenMargin` is called *inside* each dynamic function, not
+  // hoisted above `return` — the Babel plugin only attributes a runtime
+  // dependency (here, breakpoint) to a style key when the `rt` read it
+  // derives from sits inside that key's own value. Hoisting it to the
+  // factory's top level silently drops the dependency, so the margin would
+  // freeze at whatever breakpoint was active on mount and never update on
+  // rotation.
+  scrollContent: (hasHeader, margins) => {
+    const {
+      y: marginY
+    } = resolveScreenMargin(theme, rt.breakpoint);
+    return {
+      flexGrow: 1,
+      // The header inset and the safe area are structural — they apply
+      // whether or not margins are on; the y margin stacks on top of them.
+      paddingTop: (hasHeader ? theme.layout.header.height + rt.insets.top : 0) + (hasYMargin(margins) ? marginY : 0),
+      // The safe area is `BottomSafeArea`'s job; counting it here as well
+      // would leave a gap the height of the gesture bar.
+      paddingBottom: hasYMargin(margins) ? marginY : 0,
+      uni__dependencies: [0, 3, 9]
+    };
+  },
+  content: (horizontal, margins) => {
+    const {
+      x: marginX
+    } = resolveScreenMargin(theme, rt.breakpoint);
+    return {
+      flexGrow: 1,
+      paddingHorizontal: hasXMargin(margins) ? marginX : 0,
+      flexDirection: horizontal ? 'row' : 'column',
+      uni__dependencies: [0, 3]
+    };
+  }
 }));
 //# sourceMappingURL=ScreenScrollView.js.map

package/lib/module/components/screen/ScreenScrollView.js.map

@@ -1 +1 @@
-{"version":3,"names":["Children","Animated","useAnimatedScrollHandler","useComposedEventHandler","StyleSheet","scheduleOnRN","PortalHost","BottomSafeArea","renderScreenPlaceholder","SCREEN_HEADER_PORTAL_HOST","useScreen","hasXMargin","hasYMargin","jsx","_jsx","jsxs","_jsxs","ScreenScrollView","children","style","contentContainerStyle","scrollHandler","externalScrollHandler","onScroll","onScrollProp","horizontal","loading","LoadingComponent","EmptyComponent","margins","rest","scrollRef","screenScrollHandler","screenMargins","hasHeader","background","resolvedMargins","placeholder","isEmpty","toArray","length","jsScrollHandler","event","nativeEvent","handlers","composedHandler","ScrollView","ref","backgroundColor","contentInsetAdjustmentBehavior","undefined","showsVerticalScrollIndicator","scrollEventThrottle","styles","scrollContent","View","name","content","create","theme","rt","flexGrow","paddingTop","layout","header","height","insets","top","screen","margin","y","paddingBottom","uni__dependencies","paddingHorizontal","x","flexDirection"],"sourceRoot":"../../../../src","sources":["components/screen/ScreenScrollView.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["Children","Animated","useAnimatedScrollHandler","useComposedEventHandler","StyleSheet","scheduleOnRN","resolveScreenMargin","PortalHost","BottomSafeArea","renderScreenPlaceholder","SCREEN_HEADER_PORTAL_HOST","useScreen","hasXMargin","hasYMargin","jsx","_jsx","jsxs","_jsxs","ScreenScrollView","children","style","contentContainerStyle","scrollHandler","externalScrollHandler","onScroll","onScrollProp","horizontal","loading","LoadingComponent","EmptyComponent","margins","rest","scrollRef","screenScrollHandler","screenMargins","hasHeader","background","resolvedMargins","placeholder","isEmpty","toArray","length","jsScrollHandler","event","nativeEvent","handlers","composedHandler","ScrollView","ref","backgroundColor","contentInsetAdjustmentBehavior","undefined","showsVerticalScrollIndicator","scrollEventThrottle","styles","scrollContent","View","name","content","create","theme","rt","y","marginY","breakpoint","flexGrow","paddingTop","layout","header","height","insets","top","paddingBottom","uni__dependencies","x","marginX","paddingHorizontal","flexDirection"],"sourceRoot":"../../../../src","sources":["components/screen/ScreenScrollView.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/screen/index.js

@@ -4,5 +4,6 @@ export { Screen } from "./Screen.js";
 export { useScreen } from "./ScreenContext.js";
 export { ScreenFlashList } from "./ScreenFlashList.js";
 export { ScreenFlatList } from "./ScreenFlatList.js";
+export { ScreenList } from "./ScreenList.js";
 export { ScreenScrollView } from "./ScreenScrollView.js";
 //# sourceMappingURL=index.js.map

package/lib/module/components/screen/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["Screen","useScreen","ScreenFlashList","ScreenFlatList","ScreenScrollView"],"sourceRoot":"../../../../src","sources":["components/screen/index.ts"],"mappings":";;AACA,SAASA,MAAM;AAEf,SAASC,SAAS;AAElB,SAASC,eAAe;AAExB,SAASC,cAAc;AAEvB,SAASC,gBAAgB","ignoreList":[]}
+{"version":3,"names":["Screen","useScreen","ScreenFlashList","ScreenFlatList","ScreenList","ScreenScrollView"],"sourceRoot":"../../../../src","sources":["components/screen/index.ts"],"mappings":";;AACA,SAASA,MAAM;AAEf,SAASC,SAAS;AAElB,SAASC,eAAe;AAExB,SAASC,cAAc;AAEvB,SAASC,UAAU;AAEnB,SAASC,gBAAgB","ignoreList":[]}