@artsy/palette-mobile 17.20.0 → 17.22.0

package/dist/elements/Tabs/TabsWithHeader.d.ts

@@ -3,10 +3,11 @@ import { CollapsibleProps } from "react-native-collapsible-tab-view";
 import { TabsContainerProps } from "./TabsContainer";
 import { HeaderProps } from "../Screen/Header";
 export interface TabsWithHeaderProps extends TabsContainerProps {
-    title: string | JSX.Element;
     BelowTitleHeaderComponent?: () => JSX.Element;
+    children: CollapsibleProps["children"];
     headerProps?: HeaderProps;
+    hideScreen?: boolean;
     showLargeHeaderText?: boolean;
-    children: CollapsibleProps["children"];
+    title: string | JSX.Element;
 }
 export declare const TabsWithHeader: React.FC<TabsWithHeaderProps>;

package/dist/elements/Tabs/TabsWithHeader.js

@@ -1,11 +1,17 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { TabsContainer } from "./TabsContainer";
 import { Flex } from "../Flex";
 import { Screen } from "../Screen";
 import { Text } from "../Text";
-export const TabsWithHeader = ({ children, BelowTitleHeaderComponent, headerProps = {}, showLargeHeaderText = true, title, ...rest }) => {
+export const TabsWithHeader = ({ headerProps = {}, hideScreen = false, title, ...rest }) => {
+    if (hideScreen) {
+        return _jsx(Content, { title: title, ...rest });
+    }
+    return (_jsxs(Screen, { children: [_jsx(Screen.AnimatedHeader, { title: title, ...headerProps }), _jsx(Screen.Body, { fullwidth: true, children: _jsx(Content, { title: title, ...rest }) })] }));
+};
+const Content = ({ BelowTitleHeaderComponent, children, showLargeHeaderText = true, title, ...rest }) => {
     const showTitle = showLargeHeaderText && !!title;
-    return (_jsxs(Screen, { children: [_jsx(Screen.AnimatedHeader, { title: title, ...headerProps }), _jsx(Screen.Body, { fullwidth: true, children: _jsx(TabsContainer, { ...rest, renderHeader: () => {
-                        return (_jsxs(_Fragment, { children: [!!showTitle && (_jsx(Flex, { my: 1, px: 2, justifyContent: "center", pointerEvents: "none", children: _jsx(Text, { variant: "lg-display", numberOfLines: 2, children: title }) })), !!BelowTitleHeaderComponent && _jsx(BelowTitleHeaderComponent, {})] }));
-                    }, children: children }) })] }));
+    return (_jsx(TabsContainer, { ...rest, renderHeader: () => {
+            return (_jsxs(_Fragment, { children: [!!showTitle && (_jsx(Flex, { my: 1, px: 2, justifyContent: "center", pointerEvents: "none", children: _jsx(Text, { variant: "lg-display", numberOfLines: 2, children: title }) })), !!BelowTitleHeaderComponent && _jsx(BelowTitleHeaderComponent, {})] }));
+        }, children: children }));
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@artsy/palette-mobile",
-  "version": "17.20.0",
+  "version": "17.22.0",
   "description": "Artsy's design system for React Native",
   "scripts": {
     "android": "RCT_METRO_PORT=8082 react-native run-android --port 8082 --terminal terminal",
@@ -34,7 +34,7 @@
   ],
   "dependencies": {
     "@artsy/palette-tokens": "^7.0.0",
-    "@shopify/flash-list": "1.7.6",
+    "@shopify/flash-list": "^1.8.3",
     "@styled-system/core": "^5.1.2",
     "@styled-system/theme-get": "^5.1.2",
     "events": "^3.3.0",
@@ -60,6 +60,7 @@
     "react-native-linear-gradient": "*",
     "react-native-reanimated": "*",
     "react-native-svg": "*",
+    "react-native-collapsible-tab-view": "*",
     "styled-components": ">= 5"
   },
   "devDependencies": {