react-native-collapsible-sticky-header 0.0.0-stage → 0.1.0
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/LICENSE +21 -0
- package/README.md +569 -2
- package/lib/commonjs/Badge.js +65 -0
- package/lib/commonjs/Badge.js.map +1 -0
- package/lib/commonjs/CollapsibleStickyHeaderScreen.js +386 -0
- package/lib/commonjs/CollapsibleStickyHeaderScreen.js.map +1 -0
- package/lib/commonjs/HeaderGreeting.js +122 -0
- package/lib/commonjs/HeaderGreeting.js.map +1 -0
- package/lib/commonjs/HeaderNavBar.js +219 -0
- package/lib/commonjs/HeaderNavBar.js.map +1 -0
- package/lib/commonjs/ImageOrNode.js +40 -0
- package/lib/commonjs/ImageOrNode.js.map +1 -0
- package/lib/commonjs/animations.js +34 -0
- package/lib/commonjs/animations.js.map +1 -0
- package/lib/commonjs/index.js +122 -0
- package/lib/commonjs/index.js.map +1 -0
- package/lib/commonjs/optionalGradient.js +24 -0
- package/lib/commonjs/optionalGradient.js.map +1 -0
- package/lib/commonjs/package.json +1 -0
- package/lib/commonjs/theme.js +93 -0
- package/lib/commonjs/theme.js.map +1 -0
- package/lib/commonjs/types.js +6 -0
- package/lib/commonjs/types.js.map +1 -0
- package/lib/commonjs/useStickyHeader.js +143 -0
- package/lib/commonjs/useStickyHeader.js.map +1 -0
- package/lib/commonjs/utils.js +90 -0
- package/lib/commonjs/utils.js.map +1 -0
- package/lib/module/Badge.js +61 -0
- package/lib/module/Badge.js.map +1 -0
- package/lib/module/CollapsibleStickyHeaderScreen.js +379 -0
- package/lib/module/CollapsibleStickyHeaderScreen.js.map +1 -0
- package/lib/module/HeaderGreeting.js +118 -0
- package/lib/module/HeaderGreeting.js.map +1 -0
- package/lib/module/HeaderNavBar.js +215 -0
- package/lib/module/HeaderNavBar.js.map +1 -0
- package/lib/module/ImageOrNode.js +36 -0
- package/lib/module/ImageOrNode.js.map +1 -0
- package/lib/module/animations.js +28 -0
- package/lib/module/animations.js.map +1 -0
- package/lib/module/index.js +11 -0
- package/lib/module/index.js.map +1 -0
- package/lib/module/optionalGradient.js +20 -0
- package/lib/module/optionalGradient.js.map +1 -0
- package/lib/module/package.json +1 -0
- package/lib/module/theme.js +88 -0
- package/lib/module/theme.js.map +1 -0
- package/lib/module/types.js +4 -0
- package/lib/module/types.js.map +1 -0
- package/lib/module/useStickyHeader.js +138 -0
- package/lib/module/useStickyHeader.js.map +1 -0
- package/lib/module/utils.js +78 -0
- package/lib/module/utils.js.map +1 -0
- package/lib/typescript/commonjs/package.json +1 -0
- package/lib/typescript/commonjs/src/Badge.d.ts +20 -0
- package/lib/typescript/commonjs/src/Badge.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/CollapsibleStickyHeaderScreen.d.ts +10 -0
- package/lib/typescript/commonjs/src/CollapsibleStickyHeaderScreen.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/HeaderGreeting.d.ts +33 -0
- package/lib/typescript/commonjs/src/HeaderGreeting.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/HeaderNavBar.d.ts +48 -0
- package/lib/typescript/commonjs/src/HeaderNavBar.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/ImageOrNode.d.ts +16 -0
- package/lib/typescript/commonjs/src/ImageOrNode.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/animations.d.ts +9 -0
- package/lib/typescript/commonjs/src/animations.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/index.d.ts +10 -0
- package/lib/typescript/commonjs/src/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/optionalGradient.d.ts +13 -0
- package/lib/typescript/commonjs/src/optionalGradient.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/theme.d.ts +81 -0
- package/lib/typescript/commonjs/src/theme.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/types.d.ts +244 -0
- package/lib/typescript/commonjs/src/types.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/useStickyHeader.d.ts +12 -0
- package/lib/typescript/commonjs/src/useStickyHeader.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/utils.d.ts +30 -0
- package/lib/typescript/commonjs/src/utils.d.ts.map +1 -0
- package/lib/typescript/module/package.json +1 -0
- package/lib/typescript/module/src/Badge.d.ts +20 -0
- package/lib/typescript/module/src/Badge.d.ts.map +1 -0
- package/lib/typescript/module/src/CollapsibleStickyHeaderScreen.d.ts +10 -0
- package/lib/typescript/module/src/CollapsibleStickyHeaderScreen.d.ts.map +1 -0
- package/lib/typescript/module/src/HeaderGreeting.d.ts +33 -0
- package/lib/typescript/module/src/HeaderGreeting.d.ts.map +1 -0
- package/lib/typescript/module/src/HeaderNavBar.d.ts +48 -0
- package/lib/typescript/module/src/HeaderNavBar.d.ts.map +1 -0
- package/lib/typescript/module/src/ImageOrNode.d.ts +16 -0
- package/lib/typescript/module/src/ImageOrNode.d.ts.map +1 -0
- package/lib/typescript/module/src/animations.d.ts +9 -0
- package/lib/typescript/module/src/animations.d.ts.map +1 -0
- package/lib/typescript/module/src/index.d.ts +10 -0
- package/lib/typescript/module/src/index.d.ts.map +1 -0
- package/lib/typescript/module/src/optionalGradient.d.ts +13 -0
- package/lib/typescript/module/src/optionalGradient.d.ts.map +1 -0
- package/lib/typescript/module/src/theme.d.ts +81 -0
- package/lib/typescript/module/src/theme.d.ts.map +1 -0
- package/lib/typescript/module/src/types.d.ts +244 -0
- package/lib/typescript/module/src/types.d.ts.map +1 -0
- package/lib/typescript/module/src/useStickyHeader.d.ts +12 -0
- package/lib/typescript/module/src/useStickyHeader.d.ts.map +1 -0
- package/lib/typescript/module/src/utils.d.ts +30 -0
- package/lib/typescript/module/src/utils.d.ts.map +1 -0
- package/package.json +142 -4
|
@@ -0,0 +1,379 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useEffect, useMemo } from 'react';
|
|
4
|
+
import { Image, SectionList, StyleSheet, View } from 'react-native';
|
|
5
|
+
import Animated, { Easing, FadeInUp } from 'react-native-reanimated';
|
|
6
|
+
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
|
7
|
+
import { HeaderGreeting } from "./HeaderGreeting.js";
|
|
8
|
+
import { HeaderNavBar } from "./HeaderNavBar.js";
|
|
9
|
+
import { getLinearGradient } from "./optionalGradient.js";
|
|
10
|
+
import { createTheme } from "./theme.js";
|
|
11
|
+
import { useStickyHeader } from "./useStickyHeader.js";
|
|
12
|
+
import { limitActions, warnActionOverflow } from "./utils.js";
|
|
13
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
14
|
+
const AnimatedSectionList = Animated.createAnimatedComponent(SectionList);
|
|
15
|
+
export const DEFAULT_BACKGROUND_OVERHANG = 60;
|
|
16
|
+
export const DEFAULT_FADE_HEIGHT = 60;
|
|
17
|
+
const DEFAULT_STICKY_CONTENT = ['logo', 'title', 'actions'];
|
|
18
|
+
const DEFAULT_ENTERING = {
|
|
19
|
+
duration: 650,
|
|
20
|
+
stagger: 70,
|
|
21
|
+
easing: Easing.out(Easing.cubic)
|
|
22
|
+
};
|
|
23
|
+
const DEFAULT_SHADOW = {
|
|
24
|
+
shadowOpacity: 0.08,
|
|
25
|
+
shadowRadius: 6,
|
|
26
|
+
shadowOffset: {
|
|
27
|
+
width: 0,
|
|
28
|
+
height: 2
|
|
29
|
+
},
|
|
30
|
+
elevation: 4
|
|
31
|
+
};
|
|
32
|
+
|
|
33
|
+
/**
|
|
34
|
+
* A scrollable screen with a hero header that collapses as you scroll, and a
|
|
35
|
+
* compact sticky bar that fades in once the expanded nav bar has scrolled away.
|
|
36
|
+
*/
|
|
37
|
+
export function CollapsibleStickyHeaderScreen(props) {
|
|
38
|
+
const {
|
|
39
|
+
// background
|
|
40
|
+
backgroundImage,
|
|
41
|
+
backgroundColor,
|
|
42
|
+
backgroundStyle,
|
|
43
|
+
backgroundImageStyle,
|
|
44
|
+
renderBackground,
|
|
45
|
+
backgroundOverhang,
|
|
46
|
+
headerBottomRadius,
|
|
47
|
+
showFade,
|
|
48
|
+
fadeColors,
|
|
49
|
+
fadeHeight = DEFAULT_FADE_HEIGHT,
|
|
50
|
+
renderBackgroundFade,
|
|
51
|
+
// content
|
|
52
|
+
logo,
|
|
53
|
+
stickyLogo,
|
|
54
|
+
logoSize,
|
|
55
|
+
logoStyle,
|
|
56
|
+
logoAccessibilityLabel,
|
|
57
|
+
onLogoPress,
|
|
58
|
+
greeting,
|
|
59
|
+
title,
|
|
60
|
+
subtitle,
|
|
61
|
+
avatar,
|
|
62
|
+
avatarPosition,
|
|
63
|
+
avatarSize,
|
|
64
|
+
onAvatarPress,
|
|
65
|
+
avatarAccessibilityLabel,
|
|
66
|
+
greetingStyle,
|
|
67
|
+
titleStyle,
|
|
68
|
+
subtitleStyle,
|
|
69
|
+
avatarStyle,
|
|
70
|
+
stickyTitle,
|
|
71
|
+
stickyTitleStyle,
|
|
72
|
+
stickyContent,
|
|
73
|
+
stickyAvatarSize,
|
|
74
|
+
stickyAvatarStyle,
|
|
75
|
+
actions: actionsProp,
|
|
76
|
+
// slots
|
|
77
|
+
renderExpandedNav,
|
|
78
|
+
renderCollapsible,
|
|
79
|
+
renderStickyNav,
|
|
80
|
+
renderStickyBackground,
|
|
81
|
+
children,
|
|
82
|
+
ListHeaderExtra,
|
|
83
|
+
// behaviour
|
|
84
|
+
thresholdOffset,
|
|
85
|
+
stickyFadeDistance,
|
|
86
|
+
stickyPointerOffset,
|
|
87
|
+
collapseTranslateY,
|
|
88
|
+
collapseAnimation,
|
|
89
|
+
stickyAnimation,
|
|
90
|
+
respectSafeArea = true,
|
|
91
|
+
enteringAnimations = true,
|
|
92
|
+
onStickyChange,
|
|
93
|
+
// styling
|
|
94
|
+
theme: themeOverrides,
|
|
95
|
+
stickyBarStyle,
|
|
96
|
+
stickyBarBackground,
|
|
97
|
+
stickyShadow = true,
|
|
98
|
+
containerStyle,
|
|
99
|
+
headerStyle,
|
|
100
|
+
testID = 'sticky-header-screen'
|
|
101
|
+
} = props;
|
|
102
|
+
const theme = useMemo(() => createTheme(themeOverrides), [themeOverrides]);
|
|
103
|
+
const insets = useSafeAreaInsets();
|
|
104
|
+
const topPadding = respectSafeArea ? insets.top : 0;
|
|
105
|
+
const scrollProps = props.scrollProps ?? {};
|
|
106
|
+
const sticky = useStickyHeader({
|
|
107
|
+
thresholdOffset,
|
|
108
|
+
stickyFadeDistance,
|
|
109
|
+
stickyPointerOffset,
|
|
110
|
+
collapseTranslateY,
|
|
111
|
+
collapseAnimation,
|
|
112
|
+
stickyAnimation,
|
|
113
|
+
respectSafeArea,
|
|
114
|
+
onStickyChange,
|
|
115
|
+
onScroll: scrollProps.onScroll
|
|
116
|
+
});
|
|
117
|
+
const {
|
|
118
|
+
isSticky,
|
|
119
|
+
reducedMotion
|
|
120
|
+
} = sticky;
|
|
121
|
+
const {
|
|
122
|
+
actions,
|
|
123
|
+
overflow
|
|
124
|
+
} = useMemo(() => limitActions(actionsProp), [actionsProp]);
|
|
125
|
+
useEffect(() => warnActionOverflow(overflow), [overflow]);
|
|
126
|
+
const entering = useMemo(() => {
|
|
127
|
+
if (enteringAnimations === false || reducedMotion) return () => undefined;
|
|
128
|
+
const cfg = {
|
|
129
|
+
...DEFAULT_ENTERING,
|
|
130
|
+
...(typeof enteringAnimations === 'object' ? enteringAnimations : null)
|
|
131
|
+
};
|
|
132
|
+
return index => FadeInUp.duration(cfg.duration).delay(index * cfg.stagger).easing(cfg.easing);
|
|
133
|
+
}, [enteringAnimations, reducedMotion]);
|
|
134
|
+
const expandedCtx = useMemo(() => ({
|
|
135
|
+
progress: sticky.collapseProgress,
|
|
136
|
+
isSticky,
|
|
137
|
+
variant: 'overlay',
|
|
138
|
+
theme,
|
|
139
|
+
insets,
|
|
140
|
+
actions
|
|
141
|
+
}), [sticky.collapseProgress, isSticky, theme, insets, actions]);
|
|
142
|
+
const stickyCtx = useMemo(() => ({
|
|
143
|
+
...expandedCtx,
|
|
144
|
+
progress: sticky.stickyProgress,
|
|
145
|
+
variant: 'solid'
|
|
146
|
+
}), [expandedCtx, sticky.stickyProgress]);
|
|
147
|
+
const expandedNav = useMemo(() => renderExpandedNav ? renderExpandedNav(expandedCtx) : /*#__PURE__*/_jsx(HeaderNavBar, {
|
|
148
|
+
variant: "overlay",
|
|
149
|
+
resolvedTheme: theme,
|
|
150
|
+
logo: logo,
|
|
151
|
+
logoSize: logoSize?.expanded,
|
|
152
|
+
logoStyle: logoStyle,
|
|
153
|
+
logoAccessibilityLabel: logoAccessibilityLabel,
|
|
154
|
+
onLogoPress: onLogoPress ? () => onLogoPress('overlay') : undefined,
|
|
155
|
+
actions: actions
|
|
156
|
+
}), [renderExpandedNav, expandedCtx, theme, logo, logoSize?.expanded, logoStyle, logoAccessibilityLabel, onLogoPress, actions]);
|
|
157
|
+
const hasGreeting = greeting != null || title != null || subtitle != null || avatar != null;
|
|
158
|
+
const collapsible = useMemo(() => {
|
|
159
|
+
if (renderCollapsible) return renderCollapsible(expandedCtx);
|
|
160
|
+
if (!hasGreeting) return null;
|
|
161
|
+
return /*#__PURE__*/_jsx(HeaderGreeting, {
|
|
162
|
+
resolvedTheme: theme,
|
|
163
|
+
greeting: greeting,
|
|
164
|
+
title: title,
|
|
165
|
+
subtitle: subtitle,
|
|
166
|
+
avatar: avatar,
|
|
167
|
+
avatarPosition: avatarPosition,
|
|
168
|
+
avatarSize: avatarSize,
|
|
169
|
+
onAvatarPress: onAvatarPress,
|
|
170
|
+
avatarAccessibilityLabel: avatarAccessibilityLabel,
|
|
171
|
+
greetingStyle: greetingStyle,
|
|
172
|
+
titleStyle: titleStyle,
|
|
173
|
+
subtitleStyle: subtitleStyle,
|
|
174
|
+
avatarStyle: avatarStyle
|
|
175
|
+
});
|
|
176
|
+
}, [renderCollapsible, expandedCtx, hasGreeting, theme, greeting, title, subtitle, avatar, avatarPosition, avatarSize, onAvatarPress, avatarAccessibilityLabel, greetingStyle, titleStyle, subtitleStyle, avatarStyle]);
|
|
177
|
+
const stickyNav = useMemo(() => renderStickyNav ? renderStickyNav(stickyCtx) : /*#__PURE__*/_jsx(HeaderNavBar, {
|
|
178
|
+
variant: "solid",
|
|
179
|
+
resolvedTheme: theme,
|
|
180
|
+
logo: stickyLogo === false ? null : stickyLogo ?? logo,
|
|
181
|
+
logoSize: logoSize?.compact,
|
|
182
|
+
logoStyle: logoStyle,
|
|
183
|
+
logoAccessibilityLabel: logoAccessibilityLabel,
|
|
184
|
+
onLogoPress: onLogoPress ? () => onLogoPress('solid') : undefined,
|
|
185
|
+
title: stickyTitle,
|
|
186
|
+
titleStyle: stickyTitleStyle,
|
|
187
|
+
avatar: avatar,
|
|
188
|
+
avatarSize: stickyAvatarSize,
|
|
189
|
+
avatarStyle: stickyAvatarStyle,
|
|
190
|
+
onAvatarPress: onAvatarPress,
|
|
191
|
+
avatarAccessibilityLabel: avatarAccessibilityLabel,
|
|
192
|
+
show: stickyContent ?? DEFAULT_STICKY_CONTENT,
|
|
193
|
+
actions: actions
|
|
194
|
+
}), [renderStickyNav, stickyCtx, theme, stickyLogo, logo, logoSize?.compact, logoStyle, logoAccessibilityLabel, onLogoPress, stickyTitle, stickyTitleStyle, avatar, stickyAvatarSize, stickyAvatarStyle, onAvatarPress, avatarAccessibilityLabel, stickyContent, actions]);
|
|
195
|
+
const stickyBackground = useMemo(() => renderStickyBackground ? /*#__PURE__*/_jsx(View, {
|
|
196
|
+
pointerEvents: "none",
|
|
197
|
+
style: styles.fill,
|
|
198
|
+
children: renderStickyBackground(stickyCtx)
|
|
199
|
+
}) : null, [renderStickyBackground, stickyCtx]);
|
|
200
|
+
|
|
201
|
+
// Background
|
|
202
|
+
const radius = headerBottomRadius ?? theme.radius.headerBottom;
|
|
203
|
+
const rounded = radius > 0;
|
|
204
|
+
const overhang = backgroundOverhang ?? (rounded ? 0 : DEFAULT_BACKGROUND_OVERHANG);
|
|
205
|
+
const fadeEnabled = showFade ?? !rounded;
|
|
206
|
+
const resolvedFadeColors = fadeColors ?? theme.colors.fade;
|
|
207
|
+
const background = useMemo(() => {
|
|
208
|
+
let fade = null;
|
|
209
|
+
if (fadeEnabled && fadeHeight > 0) {
|
|
210
|
+
const style = StyleSheet.absoluteFill;
|
|
211
|
+
if (renderBackgroundFade) {
|
|
212
|
+
fade = renderBackgroundFade({
|
|
213
|
+
colors: resolvedFadeColors,
|
|
214
|
+
height: fadeHeight,
|
|
215
|
+
style
|
|
216
|
+
});
|
|
217
|
+
} else {
|
|
218
|
+
const LinearGradient = getLinearGradient();
|
|
219
|
+
fade = LinearGradient ? /*#__PURE__*/_jsx(LinearGradient, {
|
|
220
|
+
colors: resolvedFadeColors,
|
|
221
|
+
style: style,
|
|
222
|
+
pointerEvents: "none"
|
|
223
|
+
}) : null;
|
|
224
|
+
}
|
|
225
|
+
}
|
|
226
|
+
const content = renderBackground ? renderBackground({
|
|
227
|
+
theme,
|
|
228
|
+
insets,
|
|
229
|
+
collapseProgress: sticky.collapseProgress
|
|
230
|
+
}) : backgroundImage != null ? /*#__PURE__*/_jsx(Image, {
|
|
231
|
+
testID: "sticky-header-background-image",
|
|
232
|
+
source: backgroundImage,
|
|
233
|
+
resizeMode: "cover",
|
|
234
|
+
style: [styles.fill, backgroundImageStyle]
|
|
235
|
+
}) : null;
|
|
236
|
+
return /*#__PURE__*/_jsxs(View, {
|
|
237
|
+
testID: "sticky-header-background",
|
|
238
|
+
pointerEvents: "none",
|
|
239
|
+
style: [styles.background, {
|
|
240
|
+
bottom: -overhang,
|
|
241
|
+
backgroundColor: backgroundColor ?? theme.colors.headerBg
|
|
242
|
+
}, backgroundStyle],
|
|
243
|
+
children: [content, fade != null ? /*#__PURE__*/_jsx(View, {
|
|
244
|
+
testID: "sticky-header-fade",
|
|
245
|
+
pointerEvents: "none",
|
|
246
|
+
style: [styles.fade, {
|
|
247
|
+
height: fadeHeight
|
|
248
|
+
}],
|
|
249
|
+
children: fade
|
|
250
|
+
}) : null]
|
|
251
|
+
});
|
|
252
|
+
}, [fadeEnabled, fadeHeight, renderBackgroundFade, resolvedFadeColors, renderBackground, theme, insets, sticky.collapseProgress, backgroundImage, backgroundImageStyle, overhang, backgroundColor, backgroundStyle]);
|
|
253
|
+
const {
|
|
254
|
+
onNavLayout,
|
|
255
|
+
collapseStyle,
|
|
256
|
+
stickyStyle
|
|
257
|
+
} = sticky;
|
|
258
|
+
const headerElement = useMemo(() => /*#__PURE__*/_jsxs(_Fragment, {
|
|
259
|
+
children: [/*#__PURE__*/_jsxs(View, {
|
|
260
|
+
testID: "sticky-header-expanded",
|
|
261
|
+
style: [rounded && {
|
|
262
|
+
borderBottomLeftRadius: radius,
|
|
263
|
+
borderBottomRightRadius: radius,
|
|
264
|
+
overflow: 'hidden'
|
|
265
|
+
}, headerStyle],
|
|
266
|
+
children: [background, /*#__PURE__*/_jsxs(View, {
|
|
267
|
+
style: {
|
|
268
|
+
paddingTop: topPadding
|
|
269
|
+
},
|
|
270
|
+
children: [/*#__PURE__*/_jsx(Animated.View, {
|
|
271
|
+
entering: entering(0),
|
|
272
|
+
onLayout: onNavLayout,
|
|
273
|
+
children: expandedNav
|
|
274
|
+
}), collapsible != null ? /*#__PURE__*/_jsx(Animated.View, {
|
|
275
|
+
entering: entering(1),
|
|
276
|
+
children: /*#__PURE__*/_jsx(Animated.View, {
|
|
277
|
+
testID: "sticky-header-collapsible",
|
|
278
|
+
style: collapseStyle,
|
|
279
|
+
children: collapsible
|
|
280
|
+
})
|
|
281
|
+
}) : null, children != null ? /*#__PURE__*/_jsx(Animated.View, {
|
|
282
|
+
entering: entering(2),
|
|
283
|
+
children: children
|
|
284
|
+
}) : null]
|
|
285
|
+
})]
|
|
286
|
+
}), ListHeaderExtra]
|
|
287
|
+
}), [rounded, radius, headerStyle, background, topPadding, entering, onNavLayout, expandedNav, collapsible, collapseStyle, children, ListHeaderExtra]);
|
|
288
|
+
const shadow = stickyShadow === false ? null : {
|
|
289
|
+
shadowColor: theme.colors.shadow,
|
|
290
|
+
...DEFAULT_SHADOW,
|
|
291
|
+
...(typeof stickyShadow === 'object' ? stickyShadow : null)
|
|
292
|
+
};
|
|
293
|
+
|
|
294
|
+
// Scroll container
|
|
295
|
+
const as = props.as ?? 'FlatList';
|
|
296
|
+
let Scrollable;
|
|
297
|
+
let placement = 'ListHeaderComponent';
|
|
298
|
+
if (as === 'FlatList') {
|
|
299
|
+
Scrollable = Animated.FlatList;
|
|
300
|
+
} else if (as === 'SectionList') {
|
|
301
|
+
Scrollable = AnimatedSectionList;
|
|
302
|
+
} else if (as === 'ScrollView') {
|
|
303
|
+
Scrollable = Animated.ScrollView;
|
|
304
|
+
placement = 'children';
|
|
305
|
+
} else {
|
|
306
|
+
Scrollable = as;
|
|
307
|
+
placement = ('headerPlacement' in props ? props.headerPlacement : undefined) ?? 'ListHeaderComponent';
|
|
308
|
+
}
|
|
309
|
+
const {
|
|
310
|
+
onScroll: _onScroll,
|
|
311
|
+
scrollEventThrottle = 16,
|
|
312
|
+
children: scrollChildren,
|
|
313
|
+
...restScrollProps
|
|
314
|
+
} = scrollProps;
|
|
315
|
+
const placementProps = placement === 'children' ? {
|
|
316
|
+
children: /*#__PURE__*/_jsxs(_Fragment, {
|
|
317
|
+
children: [headerElement, scrollChildren]
|
|
318
|
+
})
|
|
319
|
+
} : {
|
|
320
|
+
ListHeaderComponent: headerElement,
|
|
321
|
+
children: scrollChildren
|
|
322
|
+
};
|
|
323
|
+
return /*#__PURE__*/_jsxs(View, {
|
|
324
|
+
testID: testID,
|
|
325
|
+
style: [styles.container, containerStyle],
|
|
326
|
+
children: [/*#__PURE__*/_jsx(Scrollable, {
|
|
327
|
+
ref: props.listRef,
|
|
328
|
+
...restScrollProps,
|
|
329
|
+
...placementProps,
|
|
330
|
+
onScroll: sticky.scrollHandler,
|
|
331
|
+
scrollEventThrottle: scrollEventThrottle
|
|
332
|
+
}), /*#__PURE__*/_jsxs(Animated.View, {
|
|
333
|
+
testID: "sticky-header-sticky-bar",
|
|
334
|
+
pointerEvents: isSticky ? 'auto' : 'none',
|
|
335
|
+
importantForAccessibility: isSticky ? 'auto' : 'no-hide-descendants',
|
|
336
|
+
accessibilityElementsHidden: !isSticky,
|
|
337
|
+
style: [styles.sticky, {
|
|
338
|
+
paddingTop: topPadding,
|
|
339
|
+
backgroundColor: stickyBarBackground ?? (renderStickyBackground ? 'transparent' : theme.colors.stickyBg)
|
|
340
|
+
}, shadow, stickyBarStyle, stickyStyle],
|
|
341
|
+
children: [stickyBackground, stickyNav]
|
|
342
|
+
})]
|
|
343
|
+
});
|
|
344
|
+
}
|
|
345
|
+
const styles = StyleSheet.create({
|
|
346
|
+
container: {
|
|
347
|
+
flex: 1
|
|
348
|
+
},
|
|
349
|
+
background: {
|
|
350
|
+
position: 'absolute',
|
|
351
|
+
top: 0,
|
|
352
|
+
left: 0,
|
|
353
|
+
right: 0,
|
|
354
|
+
overflow: 'hidden'
|
|
355
|
+
},
|
|
356
|
+
fill: {
|
|
357
|
+
position: 'absolute',
|
|
358
|
+
top: 0,
|
|
359
|
+
left: 0,
|
|
360
|
+
right: 0,
|
|
361
|
+
bottom: 0,
|
|
362
|
+
width: '100%',
|
|
363
|
+
height: '100%'
|
|
364
|
+
},
|
|
365
|
+
fade: {
|
|
366
|
+
position: 'absolute',
|
|
367
|
+
left: 0,
|
|
368
|
+
right: 0,
|
|
369
|
+
bottom: 0
|
|
370
|
+
},
|
|
371
|
+
sticky: {
|
|
372
|
+
position: 'absolute',
|
|
373
|
+
top: 0,
|
|
374
|
+
left: 0,
|
|
375
|
+
right: 0,
|
|
376
|
+
zIndex: 20
|
|
377
|
+
}
|
|
378
|
+
});
|
|
379
|
+
//# sourceMappingURL=CollapsibleStickyHeaderScreen.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useEffect","useMemo","Image","SectionList","StyleSheet","View","Animated","Easing","FadeInUp","useSafeAreaInsets","HeaderGreeting","HeaderNavBar","getLinearGradient","createTheme","useStickyHeader","limitActions","warnActionOverflow","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","AnimatedSectionList","createAnimatedComponent","DEFAULT_BACKGROUND_OVERHANG","DEFAULT_FADE_HEIGHT","DEFAULT_STICKY_CONTENT","DEFAULT_ENTERING","duration","stagger","easing","out","cubic","DEFAULT_SHADOW","shadowOpacity","shadowRadius","shadowOffset","width","height","elevation","CollapsibleStickyHeaderScreen","props","backgroundImage","backgroundColor","backgroundStyle","backgroundImageStyle","renderBackground","backgroundOverhang","headerBottomRadius","showFade","fadeColors","fadeHeight","renderBackgroundFade","logo","stickyLogo","logoSize","logoStyle","logoAccessibilityLabel","onLogoPress","greeting","title","subtitle","avatar","avatarPosition","avatarSize","onAvatarPress","avatarAccessibilityLabel","greetingStyle","titleStyle","subtitleStyle","avatarStyle","stickyTitle","stickyTitleStyle","stickyContent","stickyAvatarSize","stickyAvatarStyle","actions","actionsProp","renderExpandedNav","renderCollapsible","renderStickyNav","renderStickyBackground","children","ListHeaderExtra","thresholdOffset","stickyFadeDistance","stickyPointerOffset","collapseTranslateY","collapseAnimation","stickyAnimation","respectSafeArea","enteringAnimations","onStickyChange","theme","themeOverrides","stickyBarStyle","stickyBarBackground","stickyShadow","containerStyle","headerStyle","testID","insets","topPadding","top","scrollProps","sticky","onScroll","isSticky","reducedMotion","overflow","entering","undefined","cfg","index","delay","expandedCtx","progress","collapseProgress","variant","stickyCtx","stickyProgress","expandedNav","resolvedTheme","expanded","hasGreeting","collapsible","stickyNav","compact","show","stickyBackground","pointerEvents","style","styles","fill","radius","headerBottom","rounded","overhang","fadeEnabled","resolvedFadeColors","colors","fade","background","absoluteFill","LinearGradient","content","source","resizeMode","bottom","headerBg","onNavLayout","collapseStyle","stickyStyle","headerElement","borderBottomLeftRadius","borderBottomRightRadius","paddingTop","onLayout","shadow","shadowColor","as","Scrollable","placement","FlatList","ScrollView","headerPlacement","_onScroll","scrollEventThrottle","scrollChildren","restScrollProps","placementProps","ListHeaderComponent","container","ref","listRef","scrollHandler","importantForAccessibility","accessibilityElementsHidden","stickyBg","create","flex","position","left","right","zIndex"],"sourceRoot":"../../src","sources":["CollapsibleStickyHeaderScreen.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,118 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { memo, useMemo } from 'react';
|
|
4
|
+
import { Pressable, StyleSheet, Text, View } from 'react-native';
|
|
5
|
+
import { ImageOrNode } from "./ImageOrNode.js";
|
|
6
|
+
import { createTheme } from "./theme.js";
|
|
7
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
8
|
+
function renderLine(value, style, testID, isHeader = false, numberOfLines) {
|
|
9
|
+
if (value == null || value === false || value === '') return null;
|
|
10
|
+
if (typeof value === 'string' || typeof value === 'number') {
|
|
11
|
+
return /*#__PURE__*/_jsx(Text, {
|
|
12
|
+
testID: testID,
|
|
13
|
+
accessibilityRole: isHeader ? 'header' : undefined,
|
|
14
|
+
numberOfLines: numberOfLines,
|
|
15
|
+
style: style,
|
|
16
|
+
children: value
|
|
17
|
+
});
|
|
18
|
+
}
|
|
19
|
+
return value;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
/** The default collapsible block: greeting, title, subtitle and an optional avatar. */
|
|
23
|
+
export const HeaderGreeting = /*#__PURE__*/memo(function HeaderGreeting({
|
|
24
|
+
greeting,
|
|
25
|
+
title,
|
|
26
|
+
subtitle,
|
|
27
|
+
avatar,
|
|
28
|
+
avatarPosition = 'right',
|
|
29
|
+
avatarSize,
|
|
30
|
+
onAvatarPress,
|
|
31
|
+
avatarAccessibilityLabel = 'Profile',
|
|
32
|
+
greetingStyle,
|
|
33
|
+
titleStyle,
|
|
34
|
+
subtitleStyle,
|
|
35
|
+
avatarStyle,
|
|
36
|
+
theme: themeOverrides,
|
|
37
|
+
resolvedTheme,
|
|
38
|
+
children,
|
|
39
|
+
style,
|
|
40
|
+
testID = 'sticky-header-greeting'
|
|
41
|
+
}) {
|
|
42
|
+
const theme = useMemo(() => resolvedTheme ?? createTheme(themeOverrides), [resolvedTheme, themeOverrides]);
|
|
43
|
+
const size = avatarSize ?? theme.avatarSize;
|
|
44
|
+
const {
|
|
45
|
+
colors,
|
|
46
|
+
typography
|
|
47
|
+
} = theme;
|
|
48
|
+
const text = /*#__PURE__*/_jsxs(View, {
|
|
49
|
+
style: styles.text,
|
|
50
|
+
testID: `${testID}-text`,
|
|
51
|
+
children: [renderLine(greeting, [{
|
|
52
|
+
color: colors.greeting,
|
|
53
|
+
fontSize: typography.greetingSize
|
|
54
|
+
}, greetingStyle], `${testID}-greeting`), renderLine(title, [styles.title, {
|
|
55
|
+
color: colors.title,
|
|
56
|
+
fontSize: typography.titleSize
|
|
57
|
+
}, titleStyle], `${testID}-title`, true, 2), renderLine(subtitle, [{
|
|
58
|
+
color: colors.subtitle,
|
|
59
|
+
fontSize: typography.subtitleSize
|
|
60
|
+
}, subtitleStyle], `${testID}-subtitle`), children]
|
|
61
|
+
}, "text");
|
|
62
|
+
let avatarNode = null;
|
|
63
|
+
if (avatar != null && avatar !== false) {
|
|
64
|
+
const image = /*#__PURE__*/_jsx(ImageOrNode, {
|
|
65
|
+
value: avatar,
|
|
66
|
+
resizeMode: "cover",
|
|
67
|
+
accessibilityLabel: onAvatarPress ? undefined : avatarAccessibilityLabel,
|
|
68
|
+
style: [{
|
|
69
|
+
width: size,
|
|
70
|
+
height: size,
|
|
71
|
+
borderRadius: size / 2,
|
|
72
|
+
overflow: 'hidden'
|
|
73
|
+
}, avatarStyle]
|
|
74
|
+
});
|
|
75
|
+
const gap = avatarPosition === 'left' ? {
|
|
76
|
+
marginEnd: theme.spacing.avatarGap
|
|
77
|
+
} : {
|
|
78
|
+
marginStart: theme.spacing.avatarGap
|
|
79
|
+
};
|
|
80
|
+
avatarNode = onAvatarPress ? /*#__PURE__*/_jsx(Pressable, {
|
|
81
|
+
testID: `${testID}-avatar`,
|
|
82
|
+
onPress: onAvatarPress,
|
|
83
|
+
accessibilityRole: "button",
|
|
84
|
+
accessibilityLabel: avatarAccessibilityLabel,
|
|
85
|
+
style: [styles.avatar, gap],
|
|
86
|
+
children: image
|
|
87
|
+
}, "avatar") : /*#__PURE__*/_jsx(View, {
|
|
88
|
+
testID: `${testID}-avatar`,
|
|
89
|
+
style: [styles.avatar, gap],
|
|
90
|
+
children: image
|
|
91
|
+
}, "avatar");
|
|
92
|
+
}
|
|
93
|
+
return /*#__PURE__*/_jsx(View, {
|
|
94
|
+
testID: testID,
|
|
95
|
+
style: [styles.row, {
|
|
96
|
+
paddingHorizontal: theme.spacing.horizontal
|
|
97
|
+
}, style],
|
|
98
|
+
children: avatarPosition === 'left' ? [avatarNode, text] : [text, avatarNode]
|
|
99
|
+
});
|
|
100
|
+
});
|
|
101
|
+
const styles = StyleSheet.create({
|
|
102
|
+
row: {
|
|
103
|
+
flexDirection: 'row',
|
|
104
|
+
alignItems: 'center',
|
|
105
|
+
paddingVertical: 8
|
|
106
|
+
},
|
|
107
|
+
text: {
|
|
108
|
+
flex: 1
|
|
109
|
+
},
|
|
110
|
+
avatar: {
|
|
111
|
+
flexShrink: 0
|
|
112
|
+
},
|
|
113
|
+
title: {
|
|
114
|
+
fontWeight: '700',
|
|
115
|
+
marginTop: 2
|
|
116
|
+
}
|
|
117
|
+
});
|
|
118
|
+
//# sourceMappingURL=HeaderGreeting.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["memo","useMemo","Pressable","StyleSheet","Text","View","ImageOrNode","createTheme","jsx","_jsx","jsxs","_jsxs","renderLine","value","style","testID","isHeader","numberOfLines","accessibilityRole","undefined","children","HeaderGreeting","greeting","title","subtitle","avatar","avatarPosition","avatarSize","onAvatarPress","avatarAccessibilityLabel","greetingStyle","titleStyle","subtitleStyle","avatarStyle","theme","themeOverrides","resolvedTheme","size","colors","typography","text","styles","color","fontSize","greetingSize","titleSize","subtitleSize","avatarNode","image","resizeMode","accessibilityLabel","width","height","borderRadius","overflow","gap","marginEnd","spacing","avatarGap","marginStart","onPress","row","paddingHorizontal","horizontal","create","flexDirection","alignItems","paddingVertical","flex","flexShrink","fontWeight","marginTop"],"sourceRoot":"../../src","sources":["HeaderGreeting.tsx"],"mappings":"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","ignoreList":[]}
|