react-native-terra-ui 0.11.8 → 0.11.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +6 -0
- package/lib/module/components/screen/ScreenList.js +4 -4
- package/lib/module/components/screen/ScreenList.js.map +1 -1
- package/lib/module/components/screen/ScreenScrollView.js +4 -4
- package/lib/module/components/screen/ScreenScrollView.js.map +1 -1
- package/lib/module/components/screen/parts/ScreenHeaderContent.js +32 -0
- package/lib/module/components/screen/parts/ScreenHeaderContent.js.map +1 -0
- package/lib/typescript/src/components/screen/parts/ScreenHeaderContent.d.ts +6 -0
- package/lib/typescript/src/components/screen/parts/ScreenHeaderContent.d.ts.map +1 -0
- package/package.json +1 -1
- package/src/components/screen/ScreenList.tsx +3 -3
- package/src/components/screen/ScreenScrollView.tsx +3 -3
- package/src/components/screen/parts/ScreenHeaderContent.tsx +33 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## [0.11.9](https://github.com/earthlin9/react-native-terra-ui/compare/v0.11.8...v0.11.9) (2026-09-15)
|
|
4
|
+
|
|
5
|
+
### Features
|
|
6
|
+
|
|
7
|
+
* **ui:** [screen] separate header content from the body ([29cfc9b](https://github.com/earthlin9/react-native-terra-ui/commit/29cfc9bd5eaeb2130712b8447f1365fced89fbbb))
|
|
8
|
+
|
|
3
9
|
## [0.11.8](https://github.com/earthlin9/react-native-terra-ui/compare/v0.11.7...v0.11.8) (2026-09-15)
|
|
4
10
|
|
|
5
11
|
### Bug Fixes
|
|
@@ -7,13 +7,13 @@ import { StyleSheet as NativeStyleSheet } from "react-native";
|
|
|
7
7
|
import Animated from "react-native-reanimated";
|
|
8
8
|
import { StyleSheet, useUnistyles } from "react-native-unistyles";
|
|
9
9
|
import { resolveScreenPadding } from "../../theme/screen-padding.js";
|
|
10
|
-
import { PortalHost } from "../portal/index.js";
|
|
11
10
|
import { useNestedContainerWarning } from "./hooks/use-nested-container-warning.js";
|
|
12
11
|
import { useScreenRef } from "./hooks/use-screen-ref.js";
|
|
13
12
|
import { useScreenScrollHandler } from "./hooks/use-screen-scroll-handler.js";
|
|
14
13
|
import { ScreenBottomInset } from "./parts/ScreenBottomInset";
|
|
14
|
+
import { ScreenHeaderContent } from "./parts/ScreenHeaderContent.js";
|
|
15
15
|
import { renderScreenPlaceholder } from "./parts/ScreenPlaceholder.js";
|
|
16
|
-
import {
|
|
16
|
+
import { useScreen } from "./ScreenContext.js";
|
|
17
17
|
import { hasHorizontalPadding, hasVerticalPadding, renderListComponent } from "./utils.js";
|
|
18
18
|
|
|
19
19
|
/** Minimal row information supported by custom list adapters. FlatList also supplies separators. */
|
|
@@ -100,8 +100,8 @@ const ScreenListBase = /*#__PURE__*/forwardRef(function ScreenList({
|
|
|
100
100
|
const header = /*#__PURE__*/_jsxs(_Fragment, {
|
|
101
101
|
children: [/*#__PURE__*/_jsx(View, {
|
|
102
102
|
style: styles.headerWrapper(resolvedPadding),
|
|
103
|
-
children: /*#__PURE__*/_jsx(
|
|
104
|
-
|
|
103
|
+
children: /*#__PURE__*/_jsx(ScreenHeaderContent, {
|
|
104
|
+
contentPadding: horizontal ? "none" : resolvedPadding
|
|
105
105
|
})
|
|
106
106
|
}), renderListComponent(ListHeaderComponent)]
|
|
107
107
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["forwardRef","useEffect","useMemo","StyleSheet","NativeStyleSheet","Animated","useUnistyles","resolveScreenPadding","
|
|
1
|
+
{"version":3,"names":["forwardRef","useEffect","useMemo","StyleSheet","NativeStyleSheet","Animated","useUnistyles","resolveScreenPadding","useNestedContainerWarning","useScreenRef","useScreenScrollHandler","ScreenBottomInset","ScreenHeaderContent","renderScreenPlaceholder","useScreen","hasHorizontalPadding","hasVerticalPadding","renderListComponent","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","ScreenListBase","ScreenList","as","data","renderItem","style","contentContainerStyle","ListHeaderComponent","ListFooterComponent","ListEmptyComponent","horizontal","isLoading","loading","loadingContent","LoadingComponent","emptyContent","EmptyComponent","contentPadding","margins","bottomInset","extraBottomPadding","scrollHandler","externalScrollHandler","onScroll","rest","ref","isDefaultFlatList","undefined","FlatList","Component","AnimatedComponent","createAnimatedComponent","background","scrollRef","headerSnapOffsets","screenPadding","hasHeader","headerAccessoryHeight","setContentTopPadding","contentOwnsBottomInset","platformAdjustsInsets","ownsBottomInset","mergedRef","resolvedPadding","theme","rt","y","paddingY","breakpoint","defaultTopPadding","layout","header","height","paddingTopOverride","flatten","paddingTop","contentTopPadding","resolvedLoading","placeholder","isEmpty","length","composedScrollHandler","children","View","styles","headerWrapper","footer","backgroundColor","contentInsetAdjustmentBehavior","automaticallyAdjustContentInsets","automaticallyAdjustsScrollIndicatorInsets","content","showsVerticalScrollIndicator","scrollEventThrottle","snapToOffsets","displayName","create","runtime","padding","accessoryHeight","x","flexGrow","paddingHorizontal","paddingBottom","uni__dependencies","marginHorizontal"],"sourceRoot":"../../../../src","sources":["components/screen/ScreenList.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -5,13 +5,13 @@ import { Children, forwardRef, useCallback } from "react";
|
|
|
5
5
|
import Animated from "react-native-reanimated";
|
|
6
6
|
import { StyleSheet } from "react-native-unistyles";
|
|
7
7
|
import { resolveScreenPadding } from "../../theme/screen-padding.js";
|
|
8
|
-
import { PortalHost } from "../portal/index.js";
|
|
9
8
|
import { useNestedContainerWarning } from "./hooks/use-nested-container-warning.js";
|
|
10
9
|
import { useScreenRef } from "./hooks/use-screen-ref.js";
|
|
11
10
|
import { useScreenScrollHandler } from "./hooks/use-screen-scroll-handler.js";
|
|
12
11
|
import { ScreenBottomInset } from "./parts/ScreenBottomInset";
|
|
12
|
+
import { ScreenHeaderContent } from "./parts/ScreenHeaderContent.js";
|
|
13
13
|
import { renderScreenPlaceholder } from "./parts/ScreenPlaceholder.js";
|
|
14
|
-
import {
|
|
14
|
+
import { useScreen } from "./ScreenContext.js";
|
|
15
15
|
import { hasHorizontalPadding, hasVerticalPadding } from "./utils.js";
|
|
16
16
|
|
|
17
17
|
/** Native ScrollView props plus Screen layout, placeholders, and worklet support. */
|
|
@@ -101,8 +101,8 @@ export const ScreenScrollView = /*#__PURE__*/forwardRef(function ScreenScrollVie
|
|
|
101
101
|
children: [/*#__PURE__*/_jsx(View, {
|
|
102
102
|
style: styles.headerWrapper(resolvedPadding),
|
|
103
103
|
onLayout: handleHeaderWrapperLayout,
|
|
104
|
-
children: /*#__PURE__*/_jsx(
|
|
105
|
-
|
|
104
|
+
children: /*#__PURE__*/_jsx(ScreenHeaderContent, {
|
|
105
|
+
contentPadding: horizontal ? "none" : resolvedPadding
|
|
106
106
|
})
|
|
107
107
|
}), /*#__PURE__*/_jsx(View, {
|
|
108
108
|
style: [styles.content(horizontal), contentStyle],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Children","forwardRef","useCallback","Animated","StyleSheet","resolveScreenPadding","
|
|
1
|
+
{"version":3,"names":["Children","forwardRef","useCallback","Animated","StyleSheet","resolveScreenPadding","useNestedContainerWarning","useScreenRef","useScreenScrollHandler","ScreenBottomInset","ScreenHeaderContent","renderScreenPlaceholder","useScreen","hasHorizontalPadding","hasVerticalPadding","jsx","_jsx","jsxs","_jsxs","ScreenScrollView","children","style","contentContainerStyle","contentStyle","scrollHandler","externalScrollHandler","onScroll","horizontal","isLoading","loading","loadingContent","LoadingComponent","emptyContent","EmptyComponent","contentPadding","margins","extraBottomPadding","isEmpty","rest","ref","scrollRef","screenPadding","hasHeader","headerAccessoryHeight","setContentTopPadding","background","contentOwnsBottomInset","platformAdjustsInsets","ownsBottomInset","resolvedPadding","mergedRef","placeholder","undefined","toArray","length","composedScrollHandler","handleHeaderWrapperLayout","event","nativeEvent","layout","y","ScrollView","backgroundColor","contentInsetAdjustmentBehavior","automaticallyAdjustContentInsets","automaticallyAdjustsScrollIndicatorInsets","showsVerticalScrollIndicator","scrollEventThrottle","styles","scrollContent","View","headerWrapper","onLayout","content","displayName","create","theme","runtime","padding","accessoryHeight","x","breakpoint","flexGrow","paddingTop","header","height","paddingHorizontal","paddingBottom","uni__dependencies","marginHorizontal","flexDirection"],"sourceRoot":"../../../../src","sources":["components/screen/ScreenScrollView.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useCallback, useState } from "react";
|
|
4
|
+
import { StyleSheet } from "react-native-unistyles";
|
|
5
|
+
import { resolveScreenPadding } from "../../../theme/screen-padding.js";
|
|
6
|
+
import { PortalHost } from "../../portal/index.js";
|
|
7
|
+
import { SCREEN_HEADER_PORTAL_HOST } from "../ScreenContext.js";
|
|
8
|
+
import { hasVerticalPadding } from "../utils.js";
|
|
9
|
+
|
|
10
|
+
/** Separates the large title and sticky accessory from the screen body. */
|
|
11
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
12
|
+
export function ScreenHeaderContent({
|
|
13
|
+
contentPadding
|
|
14
|
+
}) {
|
|
15
|
+
const [hasContent, setHasContent] = useState(false);
|
|
16
|
+
const handleLayout = useCallback(event => {
|
|
17
|
+
setHasContent(event.nativeEvent.layout.height > 0);
|
|
18
|
+
}, []);
|
|
19
|
+
return /*#__PURE__*/_jsx(PortalHost, {
|
|
20
|
+
name: SCREEN_HEADER_PORTAL_HOST,
|
|
21
|
+
onLayout: handleLayout,
|
|
22
|
+
style: styles.content(hasContent && hasVerticalPadding(contentPadding))
|
|
23
|
+
});
|
|
24
|
+
}
|
|
25
|
+
const styles = StyleSheet.create((theme, runtime) => ({
|
|
26
|
+
// Margin is excluded from the measured height, so an empty host releases the gap.
|
|
27
|
+
content: hasGap => ({
|
|
28
|
+
marginBottom: hasGap ? resolveScreenPadding(theme, runtime.breakpoint).y : 0,
|
|
29
|
+
uni__dependencies: [0, 3]
|
|
30
|
+
})
|
|
31
|
+
}));
|
|
32
|
+
//# sourceMappingURL=ScreenHeaderContent.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useCallback","useState","StyleSheet","resolveScreenPadding","PortalHost","SCREEN_HEADER_PORTAL_HOST","hasVerticalPadding","jsx","_jsx","ScreenHeaderContent","contentPadding","hasContent","setHasContent","handleLayout","event","nativeEvent","layout","height","name","onLayout","style","styles","content","create","theme","runtime","hasGap","marginBottom","breakpoint","y","uni__dependencies"],"sourceRoot":"../../../../../src","sources":["components/screen/parts/ScreenHeaderContent.tsx"],"mappings":";;AAAA,SAASA,WAAW,EAAEC,QAAQ,QAAQ,OAAO;AAG7C,SAASC,UAAU,QAAQ,wBAAwB;AAEnD,SAASC,oBAAoB;AAC7B,SAASC,UAAU;AACnB,SAASC,yBAAyB;AAElC,SAASC,kBAAkB;;AAE3B;AAAA,SAAAC,GAAA,IAAAC,IAAA;AACA,OAAO,SAASC,mBAAmBA,CAAC;EAAEC;AAAyD,CAAC,EAAE;EAChG,MAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAGX,QAAQ,CAAC,KAAK,CAAC;EACnD,MAAMY,YAAY,GAAGb,WAAW,CAAEc,KAAwB,IAAK;IAC7DF,aAAa,CAACE,KAAK,CAACC,WAAW,CAACC,MAAM,CAACC,MAAM,GAAG,CAAC,CAAC;EACpD,CAAC,EAAE,EAAE,CAAC;EAEN,oBACET,IAAA,CAACJ,UAAU;IACTc,IAAI,EAAEb,yBAA0B;IAChCc,QAAQ,EAAEN,YAAa;IACvBO,KAAK,EAAEC,MAAM,CAACC,OAAO,CAACX,UAAU,IAAIL,kBAAkB,CAACI,cAAc,CAAC;EAAE,CACzE,CAAC;AAEN;AAEA,MAAMW,MAAM,GAAGnB,UAAU,CAACqB,MAAM,CAAC,CAACC,KAAK,EAAEC,OAAO,MAAM;EACpD;EACAH,OAAO,EAAGI,MAAe,KAAM;IAC7BC,YAAY,EAAED,MAAM,GAAGvB,oBAAoB,CAACqB,KAAK,EAAEC,OAAO,CAACG,UAAU,CAAC,CAACC,CAAC,GAAG,CAAC;IAAAC,iBAAA;EAC9E,CAAC;AACH,CAAC,CAAC,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import type { ScreenContentPadding } from "../types.js";
|
|
2
|
+
/** Separates the large title and sticky accessory from the screen body. */
|
|
3
|
+
export declare function ScreenHeaderContent({ contentPadding }: {
|
|
4
|
+
contentPadding: ScreenContentPadding;
|
|
5
|
+
}): import("react").JSX.Element;
|
|
6
|
+
//# sourceMappingURL=ScreenHeaderContent.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ScreenHeaderContent.d.ts","sourceRoot":"","sources":["../../../../../../src/components/screen/parts/ScreenHeaderContent.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,aAAU,CAAC;AAGrD,2EAA2E;AAC3E,wBAAgB,mBAAmB,CAAC,EAAE,cAAc,EAAE,EAAE;IAAE,cAAc,EAAE,oBAAoB,CAAA;CAAE,+BAa/F"}
|
package/package.json
CHANGED
|
@@ -22,13 +22,13 @@ import Animated from "react-native-reanimated";
|
|
|
22
22
|
import { StyleSheet, useUnistyles } from "react-native-unistyles";
|
|
23
23
|
|
|
24
24
|
import { resolveScreenPadding } from "#theme/screen-padding";
|
|
25
|
-
import { PortalHost } from "../portal";
|
|
26
25
|
import { useNestedContainerWarning } from "./hooks/use-nested-container-warning";
|
|
27
26
|
import { useScreenRef } from "./hooks/use-screen-ref";
|
|
28
27
|
import { useScreenScrollHandler } from "./hooks/use-screen-scroll-handler";
|
|
29
28
|
import { ScreenBottomInset } from "./parts/ScreenBottomInset";
|
|
29
|
+
import { ScreenHeaderContent } from "./parts/ScreenHeaderContent";
|
|
30
30
|
import { renderScreenPlaceholder } from "./parts/ScreenPlaceholder";
|
|
31
|
-
import {
|
|
31
|
+
import { useScreen } from "./ScreenContext";
|
|
32
32
|
import type { ScreenContentPadding, ScreenScrollableProps } from "./types";
|
|
33
33
|
import { hasHorizontalPadding, hasVerticalPadding, renderListComponent } from "./utils";
|
|
34
34
|
|
|
@@ -215,7 +215,7 @@ const ScreenListBase = forwardRef(function ScreenList(
|
|
|
215
215
|
const header = (
|
|
216
216
|
<>
|
|
217
217
|
<View style={styles.headerWrapper(resolvedPadding)}>
|
|
218
|
-
<
|
|
218
|
+
<ScreenHeaderContent contentPadding={horizontal ? "none" : resolvedPadding} />
|
|
219
219
|
</View>
|
|
220
220
|
{renderListComponent(ListHeaderComponent)}
|
|
221
221
|
</>
|
|
@@ -12,13 +12,13 @@ import Animated from "react-native-reanimated";
|
|
|
12
12
|
import { StyleSheet } from "react-native-unistyles";
|
|
13
13
|
|
|
14
14
|
import { resolveScreenPadding } from "#theme/screen-padding";
|
|
15
|
-
import { PortalHost } from "../portal";
|
|
16
15
|
import { useNestedContainerWarning } from "./hooks/use-nested-container-warning";
|
|
17
16
|
import { useScreenRef } from "./hooks/use-screen-ref";
|
|
18
17
|
import { useScreenScrollHandler } from "./hooks/use-screen-scroll-handler";
|
|
19
18
|
import { ScreenBottomInset } from "./parts/ScreenBottomInset";
|
|
19
|
+
import { ScreenHeaderContent } from "./parts/ScreenHeaderContent";
|
|
20
20
|
import { renderScreenPlaceholder } from "./parts/ScreenPlaceholder";
|
|
21
|
-
import {
|
|
21
|
+
import { useScreen } from "./ScreenContext";
|
|
22
22
|
import type { ScreenContentPadding, ScreenScrollableProps } from "./types";
|
|
23
23
|
import { hasHorizontalPadding, hasVerticalPadding } from "./utils";
|
|
24
24
|
|
|
@@ -126,7 +126,7 @@ export const ScreenScrollView = forwardRef<ComponentRef<typeof ScrollView>, Scre
|
|
|
126
126
|
onScroll={composedScrollHandler}
|
|
127
127
|
>
|
|
128
128
|
<View style={styles.headerWrapper(resolvedPadding)} onLayout={handleHeaderWrapperLayout}>
|
|
129
|
-
<
|
|
129
|
+
<ScreenHeaderContent contentPadding={horizontal ? "none" : resolvedPadding} />
|
|
130
130
|
</View>
|
|
131
131
|
<View style={[styles.content(horizontal), contentStyle]}>{placeholder ?? children}</View>
|
|
132
132
|
{ownsBottomInset && <ScreenBottomInset />}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { useCallback, useState } from "react";
|
|
2
|
+
import type { LayoutChangeEvent } from "react-native";
|
|
3
|
+
|
|
4
|
+
import { StyleSheet } from "react-native-unistyles";
|
|
5
|
+
|
|
6
|
+
import { resolveScreenPadding } from "#theme/screen-padding";
|
|
7
|
+
import { PortalHost } from "../../portal";
|
|
8
|
+
import { SCREEN_HEADER_PORTAL_HOST } from "../ScreenContext";
|
|
9
|
+
import type { ScreenContentPadding } from "../types";
|
|
10
|
+
import { hasVerticalPadding } from "../utils";
|
|
11
|
+
|
|
12
|
+
/** Separates the large title and sticky accessory from the screen body. */
|
|
13
|
+
export function ScreenHeaderContent({ contentPadding }: { contentPadding: ScreenContentPadding }) {
|
|
14
|
+
const [hasContent, setHasContent] = useState(false);
|
|
15
|
+
const handleLayout = useCallback((event: LayoutChangeEvent) => {
|
|
16
|
+
setHasContent(event.nativeEvent.layout.height > 0);
|
|
17
|
+
}, []);
|
|
18
|
+
|
|
19
|
+
return (
|
|
20
|
+
<PortalHost
|
|
21
|
+
name={SCREEN_HEADER_PORTAL_HOST}
|
|
22
|
+
onLayout={handleLayout}
|
|
23
|
+
style={styles.content(hasContent && hasVerticalPadding(contentPadding))}
|
|
24
|
+
/>
|
|
25
|
+
);
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
const styles = StyleSheet.create((theme, runtime) => ({
|
|
29
|
+
// Margin is excluded from the measured height, so an empty host releases the gap.
|
|
30
|
+
content: (hasGap: boolean) => ({
|
|
31
|
+
marginBottom: hasGap ? resolveScreenPadding(theme, runtime.breakpoint).y : 0,
|
|
32
|
+
}),
|
|
33
|
+
}));
|