@draftbit/core 52.1.1 → 52.1.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/SectionList/SectionHeader.js +1 -1
- package/lib/commonjs/components/SectionList/SectionList.js +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/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": "52.1.
|
|
3
|
+
"version": "52.1.2",
|
|
4
4
|
"description": "Core (non-native) Components",
|
|
5
5
|
"main": "lib/commonjs/index.js",
|
|
6
6
|
"types": "lib/typescript/src/index.d.ts",
|
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
"homepage": "https://github.com/draftbit/react-native-jigsaw#readme",
|
|
41
41
|
"dependencies": {
|
|
42
42
|
"@draftbit/react-theme-provider": "^2.1.1",
|
|
43
|
-
"@draftbit/theme": "52.1.
|
|
43
|
+
"@draftbit/theme": "52.1.2",
|
|
44
44
|
"@emotion/react": "^11.13.5",
|
|
45
45
|
"@emotion/styled": "^11.13.5",
|
|
46
46
|
"@expo/vector-icons": "^14.0.3",
|
|
@@ -118,5 +118,5 @@
|
|
|
118
118
|
],
|
|
119
119
|
"testEnvironment": "node"
|
|
120
120
|
},
|
|
121
|
-
"gitHead": "
|
|
121
|
+
"gitHead": "da433a32e4e756c3e469a31cef063957ebda13b5"
|
|
122
122
|
}
|
|
@@ -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,KAAK,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,KAAK,IAAG,QAAQ,CAAQ,CAAC;AAQ5C,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
|
}
|