@draftbit/core 48.5.6 → 48.5.7-efd08d.2

package/lib/typescript/src/components/RadioButton/index.d.ts

@@ -1,3 +1,3 @@
-export { default as RadioButton } from "./RadioButton";
-export { default as RadioButtonGroup } from "./RadioButtonGroup";
-export { default as RadioButtonRow } from "./RadioButtonRow";
+export { default as RadioButton } from "./RadioButton";
+export { default as RadioButtonGroup } from "./RadioButtonGroup";
+export { default as RadioButtonRow } from "./RadioButtonRow";

package/lib/typescript/src/components/RadioButton/index.js

@@ -1,4 +1,4 @@
-export { default as RadioButton } from "./RadioButton";
-export { default as RadioButtonGroup } from "./RadioButtonGroup";
-export { default as RadioButtonRow } from "./RadioButtonRow";
+export { default as RadioButton } from "./RadioButton";
+export { default as RadioButtonGroup } from "./RadioButtonGroup";
+export { default as RadioButtonRow } from "./RadioButtonRow";
 //# sourceMappingURL=index.js.map

package/lib/typescript/src/components/Row.d.ts

@@ -1,20 +1,20 @@
-import * as React from "react";
-import { ImageSourcePropType, StyleProp, TextStyle, ViewStyle } from "react-native";
-import theme from "../styles/DefaultTheme";
-declare type Props = {
-    titleTypeStyle?: StyleProp<TextStyle>;
-    titleColor?: string;
-    subtitleTypeStyle?: StyleProp<TextStyle>;
-    subtitleColor?: string;
-    title?: string;
-    subtitle?: string;
-    multilineSubtitle?: boolean;
-    image?: string | ImageSourcePropType;
-    right?: () => React.ReactNode;
-    style?: StyleProp<ViewStyle>;
-    theme: typeof theme;
-};
-declare const _default: React.ComponentType<import("@draftbit/react-theme-provider").$Without<React.PropsWithChildren<Props>, "theme"> & {
-    theme?: import("@draftbit/react-theme-provider").$DeepPartial<any> | undefined;
-}> & import("@draftbit/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics<React.ComponentType<React.PropsWithChildren<Props>> & React.FC<React.PropsWithChildren<Props>>, {}>;
-export default _default;
+import * as React from "react";
+import { ImageSourcePropType, StyleProp, TextStyle, ViewStyle } from "react-native";
+import theme from "../styles/DefaultTheme";
+declare type Props = {
+    titleTypeStyle?: StyleProp<TextStyle>;
+    titleColor?: string;
+    subtitleTypeStyle?: StyleProp<TextStyle>;
+    subtitleColor?: string;
+    title?: string;
+    subtitle?: string;
+    multilineSubtitle?: boolean;
+    image?: string | ImageSourcePropType;
+    right?: () => React.ReactNode;
+    style?: StyleProp<ViewStyle>;
+    theme: typeof theme;
+};
+declare const _default: React.ComponentType<import("@draftbit/react-theme-provider").$Without<React.PropsWithChildren<Props>, "theme"> & {
+    theme?: import("@draftbit/react-theme-provider").$DeepPartial<any> | undefined;
+}> & import("@draftbit/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics<React.ComponentType<React.PropsWithChildren<Props>> & React.FC<React.PropsWithChildren<Props>>, {}>;
+export default _default;

package/lib/typescript/src/components/Row.js

@@ -1,49 +1,49 @@
-import * as React from "react";
-import { View, Text, Image, StyleSheet, } from "react-native";
-import { withTheme } from "../theming";
-import Config from "./Config";
-const Row = ({ titleTypeStyle, titleColor, subtitleTypeStyle, subtitleColor, title, subtitle, multilineSubtitle, image, right, style, }) => {
-    return (React.createElement(View, { style: [styles.container, { padding: 16 }, style] },
-        React.createElement(View, { style: styles.leftContainer },
-            image && (React.createElement(Image, { source: typeof image === "string" ? { uri: image } : image, style: {
-                    marginRight: 12,
-                    width: subtitle
-                        ? Config.rowMultiLineImageSize
-                        : Config.rowSingleLineImageSize,
-                    height: subtitle
-                        ? Config.rowMultiLineImageSize
-                        : Config.rowSingleLineImageSize,
-                } })),
-            React.createElement(View, { style: styles.textContainer },
-                React.createElement(Text, { style: [
-                        titleTypeStyle,
-                        {
-                            color: titleColor,
-                        },
-                    ], numberOfLines: 1 }, title),
-                subtitle ? (React.createElement(Text, { style: [
-                        subtitleTypeStyle,
-                        {
-                            color: subtitleColor,
-                            marginTop: 4,
-                        },
-                    ], numberOfLines: multilineSubtitle ? undefined : 1 }, subtitle)) : null)),
-        right && right()));
-};
-const styles = StyleSheet.create({
-    leftContainer: {
-        flexDirection: "row",
-        flex: 1,
-    },
-    container: {
-        flexDirection: "row",
-        justifyContent: "space-between",
-        alignItems: "center",
-    },
-    textContainer: {
-        flex: 1,
-        justifyContent: "center",
-    },
-});
-export default withTheme(Row);
+import * as React from "react";
+import { View, Text, Image, StyleSheet, } from "react-native";
+import { withTheme } from "../theming";
+import Config from "./Config";
+const Row = ({ titleTypeStyle, titleColor, subtitleTypeStyle, subtitleColor, title, subtitle, multilineSubtitle, image, right, style, }) => {
+    return (React.createElement(View, { style: [styles.container, { padding: 16 }, style] },
+        React.createElement(View, { style: styles.leftContainer },
+            image && (React.createElement(Image, { source: typeof image === "string" ? { uri: image } : image, style: {
+                    marginRight: 12,
+                    width: subtitle
+                        ? Config.rowMultiLineImageSize
+                        : Config.rowSingleLineImageSize,
+                    height: subtitle
+                        ? Config.rowMultiLineImageSize
+                        : Config.rowSingleLineImageSize,
+                } })),
+            React.createElement(View, { style: styles.textContainer },
+                React.createElement(Text, { style: [
+                        titleTypeStyle,
+                        {
+                            color: titleColor,
+                        },
+                    ], numberOfLines: 1 }, title),
+                subtitle ? (React.createElement(Text, { style: [
+                        subtitleTypeStyle,
+                        {
+                            color: subtitleColor,
+                            marginTop: 4,
+                        },
+                    ], numberOfLines: multilineSubtitle ? undefined : 1 }, subtitle)) : null)),
+        right && right()));
+};
+const styles = StyleSheet.create({
+    leftContainer: {
+        flexDirection: "row",
+        flex: 1,
+    },
+    container: {
+        flexDirection: "row",
+        justifyContent: "space-between",
+        alignItems: "center",
+    },
+    textContainer: {
+        flex: 1,
+        justifyContent: "center",
+    },
+});
+export default withTheme(Row);
 //# sourceMappingURL=Row.js.map

package/lib/typescript/src/components/SVG.d.ts

@@ -1,8 +1,8 @@
-import * as React from "react";
-import { StyleProp, ImageStyle } from "react-native";
-declare type SVGComponentProps = {
-    source: string;
-    style?: StyleProp<ImageStyle>;
-};
-declare const SVG: React.FC<React.PropsWithChildren<SVGComponentProps>>;
-export default SVG;
+import * as React from "react";
+import { StyleProp, ImageStyle } from "react-native";
+declare type SVGComponentProps = {
+    source: string;
+    style?: StyleProp<ImageStyle>;
+};
+declare const SVG: React.FC<React.PropsWithChildren<SVGComponentProps>>;
+export default SVG;

package/lib/typescript/src/components/SVG.js

@@ -1,14 +1,14 @@
-import * as React from "react";
-import { View, Platform, Image } from "react-native";
-import { SvgUri } from "react-native-svg";
-import Config from "./Config";
-const SVG = ({ source = Config.placeholderSvgURL, style, }) => {
-    return (React.createElement(React.Fragment, null,
-        Platform.OS === "ios" && (React.createElement(View, { style: style },
-            React.createElement(SvgUri, { width: "100%", height: "100%", uri: source }))),
-        Platform.OS === "android" && (React.createElement(View, { style: style },
-            React.createElement(SvgUri, { width: "100%", height: "100%", uri: source }))),
-        Platform.OS === "web" && (React.createElement(Image, { style: style, source: { uri: source } }))));
-};
-export default SVG;
+import * as React from "react";
+import { View, Platform, Image } from "react-native";
+import { SvgUri } from "react-native-svg";
+import Config from "./Config";
+const SVG = ({ source = Config.placeholderSvgURL, style, }) => {
+    return (React.createElement(React.Fragment, null,
+        Platform.OS === "ios" && (React.createElement(View, { style: style },
+            React.createElement(SvgUri, { width: "100%", height: "100%", uri: source }))),
+        Platform.OS === "android" && (React.createElement(View, { style: style },
+            React.createElement(SvgUri, { width: "100%", height: "100%", uri: source }))),
+        Platform.OS === "web" && (React.createElement(Image, { style: style, source: { uri: source } }))));
+};
+export default SVG;
 //# sourceMappingURL=SVG.js.map

package/lib/typescript/src/components/ScreenContainer.d.ts

@@ -1,17 +1,17 @@
-import * as React from "react";
-import { StyleProp, ViewStyle } from "react-native";
-import type { Theme } from "../styles/DefaultTheme";
-declare type ScreenContainerProps = {
-    scrollable?: boolean;
-    hasSafeArea?: boolean;
-    hasTopSafeArea?: boolean;
-    hasBottomSafeArea?: boolean;
-    theme: Theme;
-    style?: StyleProp<ViewStyle>;
-    children?: React.ReactNode;
-};
-declare function ScreenContainer({ scrollable, hasSafeArea, hasBottomSafeArea, hasTopSafeArea, theme, style, children, ...rest }: ScreenContainerProps): JSX.Element;
-declare const _default: React.ComponentType<import("@draftbit/react-theme-provider").$Without<ScreenContainerProps, "theme"> & {
-    theme?: import("@draftbit/react-theme-provider").$DeepPartial<any> | undefined;
-}> & import("@draftbit/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics<React.ComponentType<ScreenContainerProps> & typeof ScreenContainer, {}>;
-export default _default;
+import * as React from "react";
+import { StyleProp, ViewStyle } from "react-native";
+import type { Theme } from "../styles/DefaultTheme";
+declare type ScreenContainerProps = {
+    scrollable?: boolean;
+    hasSafeArea?: boolean;
+    hasTopSafeArea?: boolean;
+    hasBottomSafeArea?: boolean;
+    theme: Theme;
+    style?: StyleProp<ViewStyle>;
+    children?: React.ReactNode;
+};
+declare function ScreenContainer({ scrollable, hasSafeArea, hasBottomSafeArea, hasTopSafeArea, theme, style, children, ...rest }: ScreenContainerProps): JSX.Element;
+declare const _default: React.ComponentType<import("@draftbit/react-theme-provider").$Without<ScreenContainerProps, "theme"> & {
+    theme?: import("@draftbit/react-theme-provider").$DeepPartial<any> | undefined;
+}> & import("@draftbit/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics<React.ComponentType<ScreenContainerProps> & typeof ScreenContainer, {}>;
+export default _default;

package/lib/typescript/src/components/ScreenContainer.js

@@ -1,36 +1,36 @@
-import * as React from "react";
-import { StyleSheet, ScrollView, View, } from "react-native";
-import { SafeAreaView } from "react-native-safe-area-context";
-import { withTheme } from "../theming";
-function ScreenContainer({ scrollable = false, hasSafeArea = false, hasBottomSafeArea = false, hasTopSafeArea = false, theme, style, children, ...rest }) {
-    var _a;
-    const backgroundColor = ((_a = StyleSheet.flatten(style)) === null || _a === void 0 ? void 0 : _a.backgroundColor) || theme.colors.background;
-    const edges = ["left", "right"];
-    if (hasSafeArea || hasTopSafeArea) {
-        edges.push("top");
-    }
-    if (hasSafeArea || hasBottomSafeArea) {
-        edges.push("bottom");
-    }
-    return (React.createElement(SafeAreaView, { edges: edges, style: [
-            styles.container,
-            {
-                backgroundColor,
-            },
-        ], ...rest }, scrollable ? (React.createElement(ScrollView, { contentContainerStyle: [
-            styles.scrollViewContainer,
-            { backgroundColor },
-            style,
-        ] }, children)) : (React.createElement(View, { style: [styles.container, { backgroundColor }, style] }, children))));
-}
-const styles = StyleSheet.create({
-    container: {
-        flex: 1,
-    },
-    scrollViewContainer: {
-        flexGrow: 1,
-        flex: undefined,
-    },
-});
-export default withTheme(ScreenContainer);
+import * as React from "react";
+import { StyleSheet, ScrollView, View, } from "react-native";
+import { SafeAreaView } from "react-native-safe-area-context";
+import { withTheme } from "../theming";
+function ScreenContainer({ scrollable = false, hasSafeArea = false, hasBottomSafeArea = false, hasTopSafeArea = false, theme, style, children, ...rest }) {
+    var _a;
+    const backgroundColor = ((_a = StyleSheet.flatten(style)) === null || _a === void 0 ? void 0 : _a.backgroundColor) || theme.colors.background;
+    const edges = ["left", "right"];
+    if (hasSafeArea || hasTopSafeArea) {
+        edges.push("top");
+    }
+    if (hasSafeArea || hasBottomSafeArea) {
+        edges.push("bottom");
+    }
+    return (React.createElement(SafeAreaView, { edges: edges, style: [
+            styles.container,
+            {
+                backgroundColor,
+            },
+        ], ...rest }, scrollable ? (React.createElement(ScrollView, { contentContainerStyle: [
+            styles.scrollViewContainer,
+            { backgroundColor },
+            style,
+        ] }, children)) : (React.createElement(View, { style: [styles.container, { backgroundColor }, style] }, children))));
+}
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+    },
+    scrollViewContainer: {
+        flexGrow: 1,
+        flex: undefined,
+    },
+});
+export default withTheme(ScreenContainer);
 //# sourceMappingURL=ScreenContainer.js.map

package/lib/typescript/src/components/SectionList/SectionHeader.d.ts

@@ -1,15 +1,15 @@
-import React from "react";
-import { StyleProp, ViewStyle } from "react-native";
-import type { Theme } from "../../styles/DefaultTheme";
-interface SectionHeaderProps {
-    style?: StyleProp<ViewStyle>;
-}
-declare const SectionHeader: React.FC<React.PropsWithChildren<SectionHeaderProps>>;
-interface DefaultSectionHeaderProps {
-    title: string;
-    theme: Theme;
-}
-export declare const DefaultSectionHeader: React.ComponentType<import("@draftbit/react-theme-provider").$Without<DefaultSectionHeaderProps, "theme"> & {
-    theme?: import("@draftbit/react-theme-provider").$DeepPartial<any> | undefined;
-}> & import("@draftbit/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics<React.ComponentType<DefaultSectionHeaderProps> & (({ title, theme }: DefaultSectionHeaderProps) => JSX.Element), {}>;
-export default SectionHeader;
+import React from "react";
+import { StyleProp, ViewStyle } from "react-native";
+import type { Theme } from "../../styles/DefaultTheme";
+interface SectionHeaderProps {
+    style?: StyleProp<ViewStyle>;
+}
+declare const SectionHeader: React.FC<React.PropsWithChildren<SectionHeaderProps>>;
+interface DefaultSectionHeaderProps {
+    title: string;
+    theme: Theme;
+}
+export declare const DefaultSectionHeader: React.ComponentType<import("@draftbit/react-theme-provider").$Without<DefaultSectionHeaderProps, "theme"> & {
+    theme?: import("@draftbit/react-theme-provider").$DeepPartial<any> | undefined;
+}> & import("@draftbit/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics<React.ComponentType<DefaultSectionHeaderProps> & (({ title, theme }: DefaultSectionHeaderProps) => JSX.Element), {}>;
+export default SectionHeader;

package/lib/typescript/src/components/SectionList/SectionHeader.js

@@ -1,14 +1,14 @@
-import React from "react";
-import { View, Text } from "react-native";
-import { withTheme } from "../../theming";
-const SectionHeader = ({ style, children, }) => React.createElement(View, { style: [style] }, children);
-export const DefaultSectionHeader = withTheme(({ title, theme }) => {
-    return (React.createElement(Text, { testID: "default-section-header", style: {
-            color: theme.colors.background,
-            backgroundColor: theme.colors.primary,
-            fontSize: 16,
-            padding: 10,
-        } }, title));
-});
-export default SectionHeader;
+import React from "react";
+import { View, Text } from "react-native";
+import { withTheme } from "../../theming";
+const SectionHeader = ({ style, children, }) => React.createElement(View, { style: [style] }, children);
+export const DefaultSectionHeader = withTheme(({ title, theme }) => {
+    return (React.createElement(Text, { testID: "default-section-header", style: {
+            color: theme.colors.background,
+            backgroundColor: theme.colors.primary,
+            fontSize: 16,
+            padding: 10,
+        } }, title));
+});
+export default SectionHeader;
 //# sourceMappingURL=SectionHeader.js.map

package/lib/typescript/src/components/SectionList/SectionList.d.ts

@@ -1,22 +1,22 @@
-/// <reference types="react" />
-import { FlashListProps } from "@shopify/flash-list";
-import { FlatListProps } from "react-native";
-declare type ListComponentType = "FlatList" | "FlashList";
-interface AdditionalSectionListProps<T> {
-    sectionKey: string;
-    stickyHeader?: boolean;
-    renderItem: (itemInfo: {
-        item?: T;
-        index: number;
-        section: string;
-    }) => JSX.Element;
-    keyExtractor?: (item: T, index: number) => string;
-    listComponent?: ListComponentType;
-}
-declare type FlatListSectionListProps<T> = Omit<FlatListProps<T>, "renderItem"> & AdditionalSectionListProps<T>;
-declare type FlashListSectionListProps<T> = Omit<FlashListProps<T>, "renderItem"> & AdditionalSectionListProps<T>;
-export declare const DEFAULT_SECTION = "Uncategorized";
-declare const SectionList: <T extends {
-    [key: string]: any;
-}>({ sectionKey, stickyHeader, listComponent, data: dataProp, renderItem: renderItemProp, keyExtractor: keyExtractorProp, ...rest }: FlatListSectionListProps<T> | FlashListSectionListProps<T>) => JSX.Element;
-export default SectionList;
+/// <reference types="react" />
+import { FlashListProps } from "@shopify/flash-list";
+import { FlatListProps } from "react-native";
+declare type ListComponentType = "FlatList" | "FlashList";
+interface AdditionalSectionListProps<T> {
+    sectionKey: string;
+    stickyHeader?: boolean;
+    renderItem: (itemInfo: {
+        item?: T;
+        index: number;
+        section: string;
+    }) => JSX.Element;
+    keyExtractor?: (item: T, index: number) => string;
+    listComponent?: ListComponentType;
+}
+declare type FlatListSectionListProps<T> = Omit<FlatListProps<T>, "renderItem"> & AdditionalSectionListProps<T>;
+declare type FlashListSectionListProps<T> = Omit<FlashListProps<T>, "renderItem"> & AdditionalSectionListProps<T>;
+export declare const DEFAULT_SECTION = "Uncategorized";
+declare const SectionList: <T extends {
+    [key: string]: any;
+}>({ sectionKey, stickyHeader, listComponent, data: dataProp, renderItem: renderItemProp, keyExtractor: keyExtractorProp, ...rest }: FlatListSectionListProps<T> | FlashListSectionListProps<T>) => JSX.Element;
+export default SectionList;

package/lib/typescript/src/components/SectionList/SectionList.js

@@ -1,111 +1,111 @@
-import React from "react";
-import { FlashList } from "@shopify/flash-list";
-import { FlatList } from "react-native";
-import SectionHeader, { DefaultSectionHeader } from "./SectionHeader";
-import { flattenReactFragments } from "../../utilities";
-export const DEFAULT_SECTION = "Uncategorized";
-const SectionList = ({ sectionKey, stickyHeader = false, listComponent = "FlatList", data: dataProp, renderItem: renderItemProp, keyExtractor: keyExtractorProp, ...rest }) => {
-    const data = React.useMemo(() => (Array.isArray(dataProp) ? dataProp : []), [dataProp]);
-    const dataWithSections = React.useMemo(() => {
-        var _a;
-        const result = [];
-        const sectionDataItems = {};
-        for (const item of data) {
-            const section = ((_a = item[sectionKey]) === null || _a === void 0 ? void 0 : _a.toString()) || DEFAULT_SECTION;
-            if (sectionDataItems[section]) {
-                sectionDataItems[section].push(item);
-            }
-            else {
-                sectionDataItems[section] = [item];
-            }
-        }
-        for (const section in sectionDataItems) {
-            result.push({ type: "SECTION_ITEM", title: section });
-            const sectionItems = sectionDataItems[section].map((item) => ({ type: "DATA_ITEM", data: item }));
-            result.push(...sectionItems);
-        }
-        return result;
-    }, [data, sectionKey]);
-    const sectionHeaderIndicies = React.useMemo(() => stickyHeader
-        ? dataWithSections
-            .filter((item) => item.type === "SECTION_ITEM")
-            .map((item) => dataWithSections.indexOf(item))
-        : undefined, [dataWithSections, stickyHeader]);
-    const extractSectionHeader = (element) => {
-        if (!element) {
-            return null;
-        }
-        const props = element.props || {};
-        const children = flattenReactFragments(React.Children.toArray(props.children));
-        if (element.type === SectionHeader) {
-            return element;
-        }
-        else {
-            for (const child of children) {
-                if (child.type === SectionHeader) {
-                    return child;
-                }
-            }
-        }
-        return null;
-    };
-    const extractRemainingNonSectionHeader = (element) => {
-        if (!element) {
-            return null;
-        }
-        const props = element.props || {};
-        const children = flattenReactFragments(React.Children.toArray(props.children));
-        if (element.type === SectionHeader) {
-            return null;
-        }
-        else {
-            const newChildren = [];
-            for (const child of children) {
-                if (child.type !== SectionHeader) {
-                    newChildren.push(child);
-                }
-            }
-            return React.cloneElement(element, {
-                ...props,
-                children: newChildren,
-            });
-        }
-    };
-    const renderItem = ({ item, index, }) => {
-        switch (item.type) {
-            case "SECTION_ITEM": {
-                const renderedItem = renderItemProp({
-                    index,
-                    section: item.title,
-                });
-                return (extractSectionHeader(renderedItem) || (React.createElement(DefaultSectionHeader, { title: item.title })));
-            }
-            case "DATA_ITEM": {
-                const renderedItem = renderItemProp({
-                    item: item.data,
-                    index,
-                    section: item.data[sectionKey] || DEFAULT_SECTION,
-                });
-                return extractRemainingNonSectionHeader(renderedItem);
-            }
-        }
-    };
-    const keyExtractor = (item, index) => {
-        switch (item.type) {
-            case "SECTION_ITEM": {
-                return `section_${index.toString()}`;
-            }
-            case "DATA_ITEM": {
-                return (keyExtractorProp === null || keyExtractorProp === void 0 ? void 0 : keyExtractorProp(item.data, index)) || index.toString();
-            }
-        }
-    };
-    switch (listComponent) {
-        case "FlatList":
-            return (React.createElement(FlatList, { stickyHeaderIndices: sectionHeaderIndicies, ...rest, data: dataWithSections, renderItem: renderItem, keyExtractor: keyExtractor }));
-        case "FlashList":
-            return (React.createElement(FlashList, { stickyHeaderIndices: sectionHeaderIndicies, ...rest, data: dataWithSections, renderItem: renderItem, keyExtractor: keyExtractor }));
-    }
-};
-export default SectionList;
+import React from "react";
+import { FlashList } from "@shopify/flash-list";
+import { FlatList } from "react-native";
+import SectionHeader, { DefaultSectionHeader } from "./SectionHeader";
+import { flattenReactFragments } from "../../utilities";
+export const DEFAULT_SECTION = "Uncategorized";
+const SectionList = ({ sectionKey, stickyHeader = false, listComponent = "FlatList", data: dataProp, renderItem: renderItemProp, keyExtractor: keyExtractorProp, ...rest }) => {
+    const data = React.useMemo(() => (Array.isArray(dataProp) ? dataProp : []), [dataProp]);
+    const dataWithSections = React.useMemo(() => {
+        var _a;
+        const result = [];
+        const sectionDataItems = {};
+        for (const item of data) {
+            const section = ((_a = item[sectionKey]) === null || _a === void 0 ? void 0 : _a.toString()) || DEFAULT_SECTION;
+            if (sectionDataItems[section]) {
+                sectionDataItems[section].push(item);
+            }
+            else {
+                sectionDataItems[section] = [item];
+            }
+        }
+        for (const section in sectionDataItems) {
+            result.push({ type: "SECTION_ITEM", title: section });
+            const sectionItems = sectionDataItems[section].map((item) => ({ type: "DATA_ITEM", data: item }));
+            result.push(...sectionItems);
+        }
+        return result;
+    }, [data, sectionKey]);
+    const sectionHeaderIndicies = React.useMemo(() => stickyHeader
+        ? dataWithSections
+            .filter((item) => item.type === "SECTION_ITEM")
+            .map((item) => dataWithSections.indexOf(item))
+        : undefined, [dataWithSections, stickyHeader]);
+    const extractSectionHeader = (element) => {
+        if (!element) {
+            return null;
+        }
+        const props = element.props || {};
+        const children = flattenReactFragments(React.Children.toArray(props.children));
+        if (element.type === SectionHeader) {
+            return element;
+        }
+        else {
+            for (const child of children) {
+                if (child.type === SectionHeader) {
+                    return child;
+                }
+            }
+        }
+        return null;
+    };
+    const extractRemainingNonSectionHeader = (element) => {
+        if (!element) {
+            return null;
+        }
+        const props = element.props || {};
+        const children = flattenReactFragments(React.Children.toArray(props.children));
+        if (element.type === SectionHeader) {
+            return null;
+        }
+        else {
+            const newChildren = [];
+            for (const child of children) {
+                if (child.type !== SectionHeader) {
+                    newChildren.push(child);
+                }
+            }
+            return React.cloneElement(element, {
+                ...props,
+                children: newChildren,
+            });
+        }
+    };
+    const renderItem = ({ item, index, }) => {
+        switch (item.type) {
+            case "SECTION_ITEM": {
+                const renderedItem = renderItemProp({
+                    index,
+                    section: item.title,
+                });
+                return (extractSectionHeader(renderedItem) || (React.createElement(DefaultSectionHeader, { title: item.title })));
+            }
+            case "DATA_ITEM": {
+                const renderedItem = renderItemProp({
+                    item: item.data,
+                    index,
+                    section: item.data[sectionKey] || DEFAULT_SECTION,
+                });
+                return extractRemainingNonSectionHeader(renderedItem);
+            }
+        }
+    };
+    const keyExtractor = (item, index) => {
+        switch (item.type) {
+            case "SECTION_ITEM": {
+                return `section_${index.toString()}`;
+            }
+            case "DATA_ITEM": {
+                return (keyExtractorProp === null || keyExtractorProp === void 0 ? void 0 : keyExtractorProp(item.data, index)) || index.toString();
+            }
+        }
+    };
+    switch (listComponent) {
+        case "FlatList":
+            return (React.createElement(FlatList, { stickyHeaderIndices: sectionHeaderIndicies, ...rest, data: dataWithSections, renderItem: renderItem, keyExtractor: keyExtractor }));
+        case "FlashList":
+            return (React.createElement(FlashList, { stickyHeaderIndices: sectionHeaderIndicies, ...rest, data: dataWithSections, renderItem: renderItem, keyExtractor: keyExtractor }));
+    }
+};
+export default SectionList;
 //# sourceMappingURL=SectionList.js.map