@draftbit/core 50.8.3 → 50.8.5-08c65b.2
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/lib/commonjs/components/MediaPlayer/VideoPlayer/VideoPlayer.js +1 -1
- package/lib/commonjs/components/SectionList/SectionHeader.js +1 -1
- package/lib/commonjs/components/SectionList/SectionList.js +1 -1
- package/lib/typescript/src/components/MediaPlayer/VideoPlayer/VideoPlayer.d.ts +1 -0
- package/lib/typescript/src/components/MediaPlayer/VideoPlayer/VideoPlayer.js +16 -3
- package/lib/typescript/src/components/MediaPlayer/VideoPlayer/VideoPlayer.js.map +1 -1
- package/lib/typescript/src/components/SectionList/SectionHeader.d.ts +2 -0
- package/lib/typescript/src/components/SectionList/SectionHeader.js +3 -3
- package/lib/typescript/src/components/SectionList/SectionHeader.js.map +1 -1
- package/lib/typescript/src/components/SectionList/SectionList.d.ts +2 -0
- package/lib/typescript/src/components/SectionList/SectionList.js +2 -2
- package/lib/typescript/src/components/SectionList/SectionList.js.map +1 -1
- package/lib/typescript/tsconfig.tsbuildinfo +1 -1
- package/package.json +3 -3
- package/src/components/MediaPlayer/VideoPlayer/VideoPlayer.js +16 -3
- package/src/components/MediaPlayer/VideoPlayer/VideoPlayer.js.map +1 -1
- package/src/components/MediaPlayer/VideoPlayer/VideoPlayer.tsx +18 -0
- package/src/components/SectionList/SectionHeader.js +3 -3
- package/src/components/SectionList/SectionHeader.js.map +1 -1
- package/src/components/SectionList/SectionHeader.tsx +5 -3
- package/src/components/SectionList/SectionList.js +2 -2
- package/src/components/SectionList/SectionList.js.map +1 -1
- package/src/components/SectionList/SectionList.tsx +9 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@draftbit/core",
|
|
3
|
-
"version": "50.8.
|
|
3
|
+
"version": "50.8.5-08c65b.2+08c65b0",
|
|
4
4
|
"description": "Core (non-native) Components",
|
|
5
5
|
"main": "lib/commonjs/index.js",
|
|
6
6
|
"types": "lib/typescript/src/index.d.ts",
|
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
"@date-io/date-fns": "^1.3.13",
|
|
43
43
|
"@dotlottie/react-player": "1.6.1",
|
|
44
44
|
"@draftbit/react-theme-provider": "^2.1.1",
|
|
45
|
-
"@draftbit/theme": "50.8.
|
|
45
|
+
"@draftbit/theme": "^50.8.5-08c65b.2+08c65b0",
|
|
46
46
|
"@expo/vector-icons": "^14.0.0",
|
|
47
47
|
"@gorhom/bottom-sheet": "5.0.6",
|
|
48
48
|
"@lottiefiles/react-lottie-player": "3.5.3",
|
|
@@ -123,5 +123,5 @@
|
|
|
123
123
|
],
|
|
124
124
|
"testEnvironment": "node"
|
|
125
125
|
},
|
|
126
|
-
"gitHead": "
|
|
126
|
+
"gitHead": "08c65b0ce6ce2bcc0ce330c6cf93e6b1d77ce367"
|
|
127
127
|
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import { Video as VideoPlayerComponent, ResizeMode as ExpoResizeMode, VideoFullscreenUpdate, } from "expo-av";
|
|
2
|
+
import { Video as VideoPlayerComponent, ResizeMode as ExpoResizeMode, VideoFullscreenUpdate, Audio, } from "expo-av";
|
|
3
3
|
import { extractSizeStyles } from "../../../utilities";
|
|
4
4
|
import MediaPlaybackWrapper from "../MediaPlaybackWrapper";
|
|
5
5
|
import { mapToMediaPlayerStatus, normalizeBase64Source, useSourceDeepCompareEffect, } from "../MediaPlayerCommon";
|
|
6
|
-
const VideoPlayer = React.forwardRef(({ style, resizeMode = "contain", posterResizeMode = "cover", onPlaybackStatusUpdate: onPlaybackStatusUpdateProp, onPlaybackFinish, source, ...rest }, ref) => {
|
|
6
|
+
const VideoPlayer = React.forwardRef(({ style, resizeMode = "contain", posterResizeMode = "cover", onPlaybackStatusUpdate: onPlaybackStatusUpdateProp, onPlaybackFinish, source, playsInSilentModeIOS = false, ...rest }, ref) => {
|
|
7
7
|
const [videoMediaObject, setVideoMediaObject] = React.useState();
|
|
8
8
|
const [isPlaying, setIsPlaying] = React.useState(false);
|
|
9
9
|
const [isFullscreen, setIsFullscreen] = React.useState(false);
|
|
@@ -52,6 +52,19 @@ const VideoPlayer = React.forwardRef(({ style, resizeMode = "contain", posterRes
|
|
|
52
52
|
await (videoMediaObject === null || videoMediaObject === void 0 ? void 0 : videoMediaObject.presentFullscreenPlayer());
|
|
53
53
|
}
|
|
54
54
|
}, [isFullscreen, videoMediaObject]);
|
|
55
|
+
const updateAudioMode = React.useCallback(async () => {
|
|
56
|
+
try {
|
|
57
|
+
await Audio.setAudioModeAsync({
|
|
58
|
+
playsInSilentModeIOS,
|
|
59
|
+
});
|
|
60
|
+
}
|
|
61
|
+
catch (e) {
|
|
62
|
+
console.error("Failed to set audio mode. Error details:", e);
|
|
63
|
+
}
|
|
64
|
+
}, [playsInSilentModeIOS]);
|
|
65
|
+
React.useEffect(() => {
|
|
66
|
+
updateAudioMode();
|
|
67
|
+
}, [updateAudioMode]);
|
|
55
68
|
React.useImperativeHandle(ref, () => {
|
|
56
69
|
var _a, _b, _c, _d;
|
|
57
70
|
return ({
|
|
@@ -72,7 +85,7 @@ const VideoPlayer = React.forwardRef(({ style, resizeMode = "contain", posterRes
|
|
|
72
85
|
};
|
|
73
86
|
updateSource();
|
|
74
87
|
}, [source]);
|
|
75
|
-
return (React.createElement(MediaPlaybackWrapper, { media: videoMediaObject, isPlaying: isPlaying, ref: mediaPlaybackWrapperRef },
|
|
88
|
+
return (React.createElement(MediaPlaybackWrapper, { media: videoMediaObject, isPlaying: isPlaying, ref: mediaPlaybackWrapperRef, onTogglePlayback: updateAudioMode },
|
|
76
89
|
React.createElement(VideoPlayerComponent
|
|
77
90
|
// https://docs.expo.dev/versions/latest/sdk/av/#example-video to see why ref is handled this way
|
|
78
91
|
, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VideoPlayer.js","sourceRoot":"","sources":["VideoPlayer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EACL,KAAK,IAAI,oBAAoB,EAE7B,UAAU,IAAI,cAAc,EAE5B,qBAAqB,
|
|
1
|
+
{"version":3,"file":"VideoPlayer.js","sourceRoot":"","sources":["VideoPlayer.tsx"],"names":[],"mappings":"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"}
|
|
@@ -7,6 +7,7 @@ import {
|
|
|
7
7
|
AVPlaybackStatus,
|
|
8
8
|
VideoFullscreenUpdate,
|
|
9
9
|
AVPlaybackSource,
|
|
10
|
+
Audio,
|
|
10
11
|
} from "expo-av";
|
|
11
12
|
import { extractSizeStyles } from "../../../utilities";
|
|
12
13
|
import MediaPlaybackWrapper from "../MediaPlaybackWrapper";
|
|
@@ -27,6 +28,7 @@ type ExpoVideoPropsOmitted = Omit<
|
|
|
27
28
|
interface VideoPlayerProps extends ExpoVideoPropsOmitted, MediaPlayerProps {
|
|
28
29
|
resizeMode?: ResizeMode;
|
|
29
30
|
posterResizeMode?: ImageResizeMode;
|
|
31
|
+
playsInSilentModeIOS?: boolean;
|
|
30
32
|
}
|
|
31
33
|
|
|
32
34
|
export interface VideoPlayerRef extends MediaPlayerRef {
|
|
@@ -42,6 +44,7 @@ const VideoPlayer = React.forwardRef<VideoPlayerRef, VideoPlayerProps>(
|
|
|
42
44
|
onPlaybackStatusUpdate: onPlaybackStatusUpdateProp,
|
|
43
45
|
onPlaybackFinish,
|
|
44
46
|
source,
|
|
47
|
+
playsInSilentModeIOS = false,
|
|
45
48
|
...rest
|
|
46
49
|
},
|
|
47
50
|
ref
|
|
@@ -102,6 +105,20 @@ const VideoPlayer = React.forwardRef<VideoPlayerRef, VideoPlayerProps>(
|
|
|
102
105
|
}
|
|
103
106
|
}, [isFullscreen, videoMediaObject]);
|
|
104
107
|
|
|
108
|
+
const updateAudioMode = React.useCallback(async () => {
|
|
109
|
+
try {
|
|
110
|
+
await Audio.setAudioModeAsync({
|
|
111
|
+
playsInSilentModeIOS,
|
|
112
|
+
});
|
|
113
|
+
} catch (e) {
|
|
114
|
+
console.error("Failed to set audio mode. Error details:", e);
|
|
115
|
+
}
|
|
116
|
+
}, [playsInSilentModeIOS]);
|
|
117
|
+
|
|
118
|
+
React.useEffect(() => {
|
|
119
|
+
updateAudioMode();
|
|
120
|
+
}, [updateAudioMode]);
|
|
121
|
+
|
|
105
122
|
React.useImperativeHandle(
|
|
106
123
|
ref,
|
|
107
124
|
() => ({
|
|
@@ -131,6 +148,7 @@ const VideoPlayer = React.forwardRef<VideoPlayerRef, VideoPlayerProps>(
|
|
|
131
148
|
media={videoMediaObject as Playback | undefined}
|
|
132
149
|
isPlaying={isPlaying}
|
|
133
150
|
ref={mediaPlaybackWrapperRef}
|
|
151
|
+
onTogglePlayback={updateAudioMode}
|
|
134
152
|
>
|
|
135
153
|
<VideoPlayerComponent
|
|
136
154
|
// https://docs.expo.dev/versions/latest/sdk/av/#example-video to see why ref is handled this way
|
|
@@ -2,10 +2,10 @@ import React from "react";
|
|
|
2
2
|
import { View, Text } from "react-native";
|
|
3
3
|
import { withTheme } from "@draftbit/theme";
|
|
4
4
|
const SectionHeader = ({ style, children, }) => React.createElement(View, { style: [style] }, children);
|
|
5
|
-
export const DefaultSectionHeader = withTheme(({ title, theme }) => {
|
|
5
|
+
export const DefaultSectionHeader = withTheme(({ title, theme, backgroundColor, textColor }) => {
|
|
6
6
|
return (React.createElement(Text, { testID: "default-section-header", style: {
|
|
7
|
-
color: theme.colors.background.base,
|
|
8
|
-
backgroundColor: theme.colors.branding.primary,
|
|
7
|
+
color: textColor !== null && textColor !== void 0 ? textColor : theme.colors.background.base,
|
|
8
|
+
backgroundColor: backgroundColor !== null && backgroundColor !== void 0 ? backgroundColor : theme.colors.branding.primary,
|
|
9
9
|
fontSize: 16,
|
|
10
10
|
padding: 10,
|
|
11
11
|
} }, title));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SectionHeader.js","sourceRoot":"","sources":["SectionHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAwB,IAAI,EAAE,MAAM,cAAc,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAO5C,MAAM,aAAa,GAA0D,CAAC,EAC5E,KAAK,EACL,QAAQ,GACT,EAAE,EAAE,CAAC,oBAAC,IAAI,IAAC,KAAK,EAAE,CAAC,KAAK,CAAC,IAAG,QAAQ,CAAQ,CAAC;
|
|
1
|
+
{"version":3,"file":"SectionHeader.js","sourceRoot":"","sources":["SectionHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAwB,IAAI,EAAE,MAAM,cAAc,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAO5C,MAAM,aAAa,GAA0D,CAAC,EAC5E,KAAK,EACL,QAAQ,GACT,EAAE,EAAE,CAAC,oBAAC,IAAI,IAAC,KAAK,EAAE,CAAC,KAAK,CAAC,IAAG,QAAQ,CAAQ,CAAC;AAQ9C,MAAM,CAAC,MAAM,oBAAoB,GAAG,SAAS,CAC3C,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,eAAe,EAAE,SAAS,EAA6B,EAAE,EAAE;IAC1E,OAAO,CACL,oBAAC,IAAI,IACH,MAAM,EAAC,wBAAwB,EAC/B,KAAK,EAAE;YACL,KAAK,EAAE,SAAS,aAAT,SAAS,cAAT,SAAS,GAAI,KAAK,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI;YAChD,eAAe,EAAE,eAAe,aAAf,eAAe,cAAf,eAAe,GAAI,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,OAAO;YACjE,QAAQ,EAAE,EAAE;YACZ,OAAO,EAAE,EAAE;SACZ,IAEA,KAAK,CACD,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,aAAa,CAAC"}
|
|
@@ -15,15 +15,17 @@ const SectionHeader: React.FC<React.PropsWithChildren<SectionHeaderProps>> = ({
|
|
|
15
15
|
interface DefaultSectionHeaderProps {
|
|
16
16
|
title: string;
|
|
17
17
|
theme: ReadTheme;
|
|
18
|
+
backgroundColor?: string;
|
|
19
|
+
textColor?: string;
|
|
18
20
|
}
|
|
19
21
|
export const DefaultSectionHeader = withTheme(
|
|
20
|
-
({ title, theme }: DefaultSectionHeaderProps) => {
|
|
22
|
+
({ title, theme, backgroundColor, textColor }: DefaultSectionHeaderProps) => {
|
|
21
23
|
return (
|
|
22
24
|
<Text
|
|
23
25
|
testID="default-section-header"
|
|
24
26
|
style={{
|
|
25
|
-
color: theme.colors.background.base,
|
|
26
|
-
backgroundColor: theme.colors.branding.primary,
|
|
27
|
+
color: textColor ?? theme.colors.background.base,
|
|
28
|
+
backgroundColor: backgroundColor ?? theme.colors.branding.primary,
|
|
27
29
|
fontSize: 16,
|
|
28
30
|
padding: 10,
|
|
29
31
|
}}
|
|
@@ -4,7 +4,7 @@ import SectionHeader, { DefaultSectionHeader } from "./SectionHeader";
|
|
|
4
4
|
import { flattenReactFragments } from "../../utilities";
|
|
5
5
|
import FlatList from "../FlatList";
|
|
6
6
|
export const DEFAULT_SECTION = "Uncategorized";
|
|
7
|
-
const SectionList = React.forwardRef(({ sectionKey, stickyHeader = false, listComponent = "FlatList", data: dataProp, renderItem: renderItemProp, keyExtractor: keyExtractorProp, ...rest }, ref) => {
|
|
7
|
+
const SectionList = React.forwardRef(({ sectionKey, stickyHeader = false, listComponent = "FlatList", data: dataProp, renderItem: renderItemProp, keyExtractor: keyExtractorProp, sectionHeaderBackgroundColor, sectionHeaderTextColor, ...rest }, ref) => {
|
|
8
8
|
const data = React.useMemo(() => (Array.isArray(dataProp) ? dataProp : []), [dataProp]);
|
|
9
9
|
const dataWithSections = React.useMemo(() => {
|
|
10
10
|
var _a;
|
|
@@ -78,7 +78,7 @@ const SectionList = React.forwardRef(({ sectionKey, stickyHeader = false, listCo
|
|
|
78
78
|
index,
|
|
79
79
|
section: item.title,
|
|
80
80
|
});
|
|
81
|
-
return (extractSectionHeader(renderedItem) || (React.createElement(DefaultSectionHeader, { title: item.title })));
|
|
81
|
+
return (extractSectionHeader(renderedItem) || (React.createElement(DefaultSectionHeader, { title: item.title, backgroundColor: sectionHeaderBackgroundColor, textColor: sectionHeaderTextColor })));
|
|
82
82
|
}
|
|
83
83
|
case "DATA_ITEM": {
|
|
84
84
|
const renderedItem = renderItemProp({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SectionList.js","sourceRoot":"","sources":["SectionList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAkB,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAGhE,OAAO,aAAa,EAAE,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AACtE,OAAO,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAC;AACxD,OAAO,QAAQ,MAAM,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"SectionList.js","sourceRoot":"","sources":["SectionList.tsx"],"names":[],"mappings":"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"}
|
|
@@ -18,6 +18,8 @@ interface AdditionalSectionListProps<T> {
|
|
|
18
18
|
}) => JSX.Element;
|
|
19
19
|
keyExtractor?: (item: T, index: number) => string;
|
|
20
20
|
listComponent?: ListComponentType;
|
|
21
|
+
sectionHeaderBackgroundColor?: string;
|
|
22
|
+
sectionHeaderTextColor?: string;
|
|
21
23
|
}
|
|
22
24
|
|
|
23
25
|
export type FlatListSectionListProps<T> = Omit<FlatListProps<T>, "renderItem"> &
|
|
@@ -52,6 +54,8 @@ const SectionList = React.forwardRef(
|
|
|
52
54
|
data: dataProp,
|
|
53
55
|
renderItem: renderItemProp,
|
|
54
56
|
keyExtractor: keyExtractorProp,
|
|
57
|
+
sectionHeaderBackgroundColor,
|
|
58
|
+
sectionHeaderTextColor,
|
|
55
59
|
...rest
|
|
56
60
|
}: FlatListSectionListProps<T> | FlashListSectionListProps<T>,
|
|
57
61
|
ref: React.Ref<FlatListComponent | FlashList<any>>
|
|
@@ -161,7 +165,11 @@ const SectionList = React.forwardRef(
|
|
|
161
165
|
});
|
|
162
166
|
return (
|
|
163
167
|
extractSectionHeader(renderedItem) || (
|
|
164
|
-
<DefaultSectionHeader
|
|
168
|
+
<DefaultSectionHeader
|
|
169
|
+
title={item.title}
|
|
170
|
+
backgroundColor={sectionHeaderBackgroundColor}
|
|
171
|
+
textColor={sectionHeaderTextColor}
|
|
172
|
+
/>
|
|
165
173
|
)
|
|
166
174
|
);
|
|
167
175
|
}
|