@artsy/palette-mobile 13.2.33 → 13.2.34

package/dist/elements/Avatar/Avatar.js

@@ -1,77 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Avatar = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const react_native_1 = require("react-native");
-const react_native_reanimated_1 = __importStar(require("react-native-reanimated"));
-const hooks_1 = require("../../utils/hooks");
-const Box_1 = require("../Box");
-const Flex_1 = require("../Flex");
-const Text_1 = require("../Text");
-const DEFAULT_SIZE = "md";
-const VARIANTS = {
-    xxs: {
-        diameter: 30,
-        textSize: "xs",
-    },
-    xs: {
-        diameter: 45,
-        textSize: "sm-display",
-    },
-    sm: {
-        diameter: 70,
-        textSize: "md",
-    },
-    md: {
-        diameter: 100,
-        textSize: "lg-display",
-    },
-};
-/** A circular Avatar component containing an image or initials */
-const Avatar = ({ src, initials, size = DEFAULT_SIZE }) => {
-    const color = (0, hooks_1.useColor)();
-    const [loading, setLoading] = (0, react_1.useState)(true);
-    const opacity = (0, react_native_reanimated_1.useSharedValue)(0);
-    opacity.value = (0, react_native_reanimated_1.withDelay)(100, (0, react_native_reanimated_1.withTiming)(1, {
-        duration: 200,
-        easing: react_native_reanimated_1.Easing.sin,
-    }));
-    const style = (0, react_native_reanimated_1.useAnimatedStyle)(() => {
-        return {
-            opacity: loading ? 0 : opacity.value,
-        };
-    }, [loading]);
-    const { diameter, textSize } = VARIANTS[size];
-    if (src) {
-        return ((0, jsx_runtime_1.jsx)(Box_1.Box, { width: diameter, height: diameter, borderRadius: diameter / 2, overflow: "hidden", borderColor: color("white100"), borderWidth: 1, children: (0, jsx_runtime_1.jsx)(react_native_reanimated_1.default.View, { style: style, children: (0, jsx_runtime_1.jsx)(react_native_1.Image, { onLoadStart: () => setLoading(true), onLoadEnd: () => setLoading(false), resizeMode: "cover", source: { uri: src }, accessibilityLabel: "AvatarImage", style: {
-                        width: diameter,
-                        height: diameter,
-                    } }) }) }));
-    }
-    return ((0, jsx_runtime_1.jsx)(Flex_1.Flex, { width: diameter, height: diameter, borderColor: "black10", borderWidth: 1, borderRadius: diameter, overflow: "hidden", alignItems: "center", justifyContent: "center", accessibilityLabel: "Avatar", children: (0, jsx_runtime_1.jsx)(Text_1.Text, { variant: textSize, children: initials }) }));
-};
-exports.Avatar = Avatar;

package/dist/elements/Avatar/Avatar.stories.d.ts

@@ -1,8 +0,0 @@
-/// <reference types="react" />
-import { AvatarProps } from "./Avatar";
-declare const _default: {
-    title: string;
-    component: ({ src, initials, size }: AvatarProps) => JSX.Element;
-};
-export default _default;
-export declare function Variants(): JSX.Element;

package/dist/elements/Avatar/Avatar.stories.js

@@ -1,15 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Variants = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const Avatar_1 = require("./Avatar");
-const helpers_1 = require("../../storybook/helpers");
-exports.default = {
-    title: "Avatar",
-    component: Avatar_1.Avatar,
-};
-const sizes = ["md", "sm", "xs", "xxs"];
-function Variants() {
-    return ((0, jsx_runtime_1.jsxs)(helpers_1.List, { children: [(0, jsx_runtime_1.jsx)(helpers_1.Row, { children: sizes.map((s) => ((0, jsx_runtime_1.jsx)(Avatar_1.Avatar, { initials: "A", size: s }, s))) }), (0, jsx_runtime_1.jsx)(helpers_1.Row, { children: sizes.map((s) => ((0, jsx_runtime_1.jsx)(Avatar_1.Avatar, { initials: "AA", size: s }, s))) }), (0, jsx_runtime_1.jsx)(helpers_1.Row, { children: sizes.map((s) => ((0, jsx_runtime_1.jsx)(Avatar_1.Avatar, { src: "https://placekitten.com/300/300", size: s }, s))) })] }));
-}
-exports.Variants = Variants;

package/dist/elements/Avatar/Avatar.tests.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/elements/Avatar/Avatar.tests.js

@@ -1,14 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_native_1 = require("@testing-library/react-native");
-const react_native_2 = require("react-native");
-const Avatar_1 = require("./Avatar");
-const renderWithWrappers_1 = require("../../utils/tests/renderWithWrappers");
-describe("Avatar", () => {
-    it("renders initials if no image url and initials provided", () => {
-        (0, renderWithWrappers_1.renderWithWrappers)((0, jsx_runtime_1.jsx)(Avatar_1.Avatar, { initials: "AB" }));
-        expect(react_native_1.screen.UNSAFE_queryByType(react_native_2.Image)).not.toBeTruthy();
-        expect(react_native_1.screen.getByText("AB")).toBeTruthy();
-    });
-});

package/dist/elements/Avatar/index.d.ts

@@ -1 +0,0 @@
-export * from "./Avatar";

package/dist/elements/Avatar/index.js

@@ -1,17 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./Avatar"), exports);

package/dist/elements/BackButton/BackButton.d.ts

@@ -1,13 +0,0 @@
-/// <reference types="react" />
-import { TouchableOpacityProps, ViewProps } from "react-native";
-import { Color } from "../../types";
-export interface BackButtonProps {
-    color?: Color;
-    hitSlop?: ViewProps["hitSlop"];
-    onPress?: () => void;
-    showX?: boolean;
-    style?: TouchableOpacityProps["style"];
-    iconSize?: number;
-}
-export declare const BackButton: React.FC<BackButtonProps>;
-export declare const BackButtonWithBackground: React.FC<BackButtonProps>;

package/dist/elements/BackButton/BackButton.js

@@ -1,16 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.BackButtonWithBackground = exports.BackButton = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_native_1 = require("react-native");
-const constants_1 = require("../../constants");
-const svgs_1 = require("../../svgs");
-const Flex_1 = require("../Flex");
-const BackButton = ({ color = "onBackgroundHigh", hitSlop = constants_1.DEFAULT_HIT_SLOP, onPress, showX = false, style, iconSize = 18, }) => {
-    return ((0, jsx_runtime_1.jsx)(react_native_1.TouchableOpacity, { onPress: onPress, hitSlop: hitSlop, accessibilityRole: "button", accessibilityLabel: showX ? "Close" : "Go back", accessibilityHint: showX ? "Dismiss this screen" : "Go back to the previous screen", style: style, children: showX ? ((0, jsx_runtime_1.jsx)(svgs_1.CloseIcon, { fill: color, width: iconSize, height: iconSize })) : ((0, jsx_runtime_1.jsx)(svgs_1.ChevronIcon, { direction: "left", fill: color, height: iconSize, width: iconSize })) }));
-};
-exports.BackButton = BackButton;
-const BackButtonWithBackground = ({ color = "onBackgroundHigh", hitSlop = constants_1.DEFAULT_HIT_SLOP, onPress, showX = false, style, }) => {
-    return ((0, jsx_runtime_1.jsx)(react_native_1.TouchableOpacity, { onPress: onPress, hitSlop: hitSlop, children: (0, jsx_runtime_1.jsx)(Flex_1.Flex, { backgroundColor: "background", width: 40, height: 40, borderRadius: 20, alignItems: "center", justifyContent: "center", accessibilityRole: "button", accessibilityLabel: showX ? "Close" : "Go back", accessibilityHint: showX ? "Dismiss this screen" : "Go back to the previous screen", style: style, children: showX ? ((0, jsx_runtime_1.jsx)(svgs_1.CloseIcon, { fill: color, width: 26, height: 26 })) : ((0, jsx_runtime_1.jsx)(svgs_1.ChevronIcon, { fill: color, direction: "left" })) }) }));
-};
-exports.BackButtonWithBackground = BackButtonWithBackground;

package/dist/elements/BackButton/BackButton.stories.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-declare const _default: {
-    title: string;
-    component: import("react").FC<import("./BackButton").BackButtonProps>;
-};
-export default _default;
-export declare const Styled: () => JSX.Element;

package/dist/elements/BackButton/BackButton.stories.js

@@ -1,14 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Styled = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const BackButton_1 = require("./BackButton");
-const Text_1 = require("../../elements/Text");
-const helpers_1 = require("../../storybook/helpers");
-const Flex_1 = require("../Flex");
-exports.default = {
-    title: "BackButton",
-    component: BackButton_1.BackButton,
-};
-const Styled = () => ((0, jsx_runtime_1.jsxs)(helpers_1.List, { style: { marginLeft: 50 }, contentContainerStyle: { alignItems: "flex-start" }, children: [(0, jsx_runtime_1.jsx)(Text_1.Text, { children: "Back button" }), (0, jsx_runtime_1.jsx)(BackButton_1.BackButton, {}), (0, jsx_runtime_1.jsx)(Text_1.Text, { children: "Back button with background" }), (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Flex, { backgroundColor: "red", width: 50, height: 50, position: "absolute" }), (0, jsx_runtime_1.jsx)(BackButton_1.BackButtonWithBackground, {})] })] }));
-exports.Styled = Styled;

package/dist/elements/BackButton/index.d.ts

@@ -1 +0,0 @@
-export * from "./BackButton";

package/dist/elements/BackButton/index.js

@@ -1,17 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./BackButton"), exports);

package/dist/elements/Banner/Banner.d.ts

@@ -1,33 +0,0 @@
-/// <reference types="react" />
-import { FlexProps } from "styled-system";
-export type BannerVariant = keyof typeof BANNER_VARIANTS;
-export interface BannerProps extends FlexProps {
-    text: string;
-    onClose?: () => void;
-    dismissable?: boolean;
-    variant?: BannerVariant;
-}
-export declare const Banner: ({ text, onClose, dismissable, variant, ...restProps }: BannerProps) => JSX.Element;
-declare const BANNER_VARIANTS: {
-    defaultLight: {
-        backgroundColor: string;
-        color: string;
-    };
-    defaultDark: {
-        backgroundColor: string;
-        color: string;
-    };
-    success: {
-        backgroundColor: string;
-        color: string;
-    };
-    error: {
-        backgroundColor: string;
-        color: string;
-    };
-    brand: {
-        backgroundColor: string;
-        color: string;
-    };
-};
-export {};

package/dist/elements/Banner/Banner.js

@@ -1,59 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Banner = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const react_native_1 = require("react-native");
-const constants_1 = require("../../constants");
-const svgs_1 = require("../../svgs");
-const Flex_1 = require("../Flex");
-const Text_1 = require("../Text");
-const Banner = ({ text, onClose, dismissable = false, variant = "defaultLight", ...restProps }) => {
-    const [tempHeight, setTempHeight] = (0, react_1.useState)(undefined);
-    const scaleYAnim = (0, react_1.useRef)(new react_native_1.Animated.Value(0)).current;
-    const handleClose = () => {
-        react_native_1.Animated.timing(scaleYAnim, {
-            toValue: 1,
-            duration: 150,
-            easing: react_native_1.Easing.linear,
-            useNativeDriver: true,
-        }).start(() => {
-            setTempHeight(0);
-        });
-        onClose?.();
-    };
-    return ((0, jsx_runtime_1.jsx)(react_native_1.Animated.View, { style: {
-            height: tempHeight,
-            transform: [
-                {
-                    scaleY: scaleYAnim.interpolate({
-                        inputRange: [0, 1],
-                        outputRange: [1, 0],
-                    }),
-                },
-            ],
-        }, children: (0, jsx_runtime_1.jsx)(Flex_1.Flex, { backgroundColor: BANNER_VARIANTS[variant].backgroundColor, ...restProps, children: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { px: 2, py: 1, flexDirection: "row", alignItems: "center", justifyContent: "space-between", children: [(0, jsx_runtime_1.jsx)(Flex_1.Flex, { flex: 1, alignItems: "center", children: (0, jsx_runtime_1.jsx)(Text_1.Text, { textAlign: "center", variant: "xs", color: BANNER_VARIANTS[variant].color, children: text }) }), !!dismissable && ((0, jsx_runtime_1.jsx)(Flex_1.Flex, { children: (0, jsx_runtime_1.jsx)(react_native_1.TouchableOpacity, { testID: "banner-close-button", onPress: handleClose, hitSlop: constants_1.DEFAULT_HIT_SLOP, children: (0, jsx_runtime_1.jsx)(svgs_1.CloseIcon, { fill: BANNER_VARIANTS[variant].color }) }) }))] }) }) }));
-};
-exports.Banner = Banner;
-const BANNER_VARIANTS = {
-    defaultLight: {
-        backgroundColor: "black10",
-        color: "black100",
-    },
-    defaultDark: {
-        backgroundColor: "black100",
-        color: "white100",
-    },
-    success: {
-        backgroundColor: "green100",
-        color: "white100",
-    },
-    error: {
-        backgroundColor: "red100",
-        color: "white100",
-    },
-    brand: {
-        backgroundColor: "brand",
-        color: "white100",
-    },
-};

package/dist/elements/Banner/Banner.stories.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-declare const _default: {
-    title: string;
-    component: ({ text, onClose, dismissable, variant, ...restProps }: import("./Banner").BannerProps) => JSX.Element;
-};
-export default _default;
-export declare const States: () => JSX.Element;

package/dist/elements/Banner/Banner.stories.js

@@ -1,14 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.States = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const Banner_1 = require("./Banner");
-const helpers_1 = require("../../storybook/helpers");
-exports.default = {
-    title: "Banner",
-    component: Banner_1.Banner,
-};
-const States = () => {
-    return ((0, jsx_runtime_1.jsxs)(helpers_1.List, { contentContainerStyle: { alignItems: undefined }, children: [(0, jsx_runtime_1.jsx)(Banner_1.Banner, { text: "Lorem ipsum dolor sit amet consectetur adipisicing elit. Reiciendis quae\n        natus assumenda distinctio, voluptatum magni. autem sunt." }), (0, jsx_runtime_1.jsx)(Banner_1.Banner, { dismissable: true, text: "Default Light", variant: "defaultLight" }), (0, jsx_runtime_1.jsx)(Banner_1.Banner, { dismissable: true, text: "Default Dark", variant: "defaultDark" }), (0, jsx_runtime_1.jsx)(Banner_1.Banner, { dismissable: true, text: "Success", variant: "success" }), (0, jsx_runtime_1.jsx)(Banner_1.Banner, { dismissable: true, text: "Error", variant: "error" }), (0, jsx_runtime_1.jsx)(Banner_1.Banner, { dismissable: true, text: "Brand", variant: "brand" })] }));
-};
-exports.States = States;

package/dist/elements/Banner/index.d.ts

@@ -1 +0,0 @@
-export * from "./Banner";

package/dist/elements/Banner/index.js

@@ -1,17 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./Banner"), exports);

package/dist/elements/BorderBox/BorderBox.d.ts

@@ -1,12 +0,0 @@
-/// <reference types="react" />
-import { BorderProps, SpaceProps } from "styled-system";
-import { SpacingUnitsTheme } from "../../tokens";
-import { FlexProps } from "../Flex";
-export interface BorderBoxProps extends FlexProps, BorderProps, SpaceProps<SpacingUnitsTheme> {
-    hover?: boolean;
-}
-/**
- * A `View` or `div` (depending on the platform) that has a common border
- * and padding set by default
- */
-export declare const BorderBox: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("..").BoxProps & import("react").RefAttributes<import("react-native/types").View>>, any, BorderBoxProps, never>;

package/dist/elements/BorderBox/BorderBox.js

@@ -1,21 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.BorderBox = void 0;
-const theme_get_1 = require("@styled-system/theme-get");
-const native_1 = __importDefault(require("styled-components/native"));
-const styled_system_1 = require("styled-system");
-const Flex_1 = require("../Flex");
-/**
- * A `View` or `div` (depending on the platform) that has a common border
- * and padding set by default
- */
-exports.BorderBox = (0, native_1.default)(Flex_1.Flex) `
-  border: 1px solid ${(0, theme_get_1.themeGet)("colors.black10")};
-  border-radius: 2px;
-  padding: ${(0, theme_get_1.themeGet)("space.2")};
-  ${styled_system_1.border}
-  ${styled_system_1.space}
-`;

package/dist/elements/BorderBox/index.d.ts

@@ -1 +0,0 @@
-export * from "./BorderBox";

package/dist/elements/BorderBox/index.js

@@ -1,17 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./BorderBox"), exports);

package/dist/elements/Box/Box.d.ts

@@ -1,15 +0,0 @@
-import { View, ViewProps, ViewStyle } from "react-native";
-import { BorderProps, ColorProps, FlexboxProps, LayoutProps, PositionProps, SpaceProps, TextAlignProps } from "styled-system";
-import { ColorsTheme, SpacingUnitsTheme } from "../../tokens";
-type GapProps = {
-    gap?: ViewStyle["gap"];
-    rowGap?: ViewStyle["rowGap"];
-    columnGap?: ViewStyle["columnGap"];
-};
-export interface BoxProps extends ViewProps, SpaceProps<SpacingUnitsTheme>, Omit<ColorProps<ColorsTheme>, "color">, FlexboxProps, LayoutProps, PositionProps, BorderProps, GapProps, TextAlignProps {
-}
-/**
- * Box is just a `View` with common styled-system props.
- */
-export declare const Box: import("styled-components").StyledComponent<typeof View, any, BoxProps, never>;
-export {};

package/dist/elements/Box/Box.js

@@ -1,21 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Box = void 0;
-const react_native_1 = require("react-native");
-const native_1 = __importDefault(require("styled-components/native"));
-const styled_system_1 = require("styled-system");
-/**
- * Box is just a `View` with common styled-system props.
- */
-exports.Box = (0, native_1.default)(react_native_1.View) `
-  ${styled_system_1.space}
-  ${styled_system_1.color}
-  ${styled_system_1.flexbox}
-  ${styled_system_1.layout}
-  ${styled_system_1.position}
-  ${styled_system_1.border}
-  ${styled_system_1.textAlign}
-`;

package/dist/elements/Box/Box.stories.d.ts

@@ -1,10 +0,0 @@
-/// <reference types="react" />
-import { View } from "react-native";
-declare const _default: {
-    title: string;
-    component: import("styled-components").StyledComponent<typeof View, any, import("./Box").BoxProps, never>;
-};
-export default _default;
-export declare const Styled: () => JSX.Element;
-export declare const RegularViewProps: () => JSX.Element;
-export declare const GapProps: () => JSX.Element;

package/dist/elements/Box/Box.stories.js

@@ -1,24 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.GapProps = exports.RegularViewProps = exports.Styled = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const helpers_1 = require("../../storybook/helpers");
-const Box_1 = require("../Box");
-const Flex_1 = require("../Flex");
-const Spacer_1 = require("../Spacer");
-const Text_1 = require("../Text");
-exports.default = {
-    title: "Box",
-    component: Box_1.Box,
-};
-const Styled = () => ((0, jsx_runtime_1.jsx)(helpers_1.List, { style: { marginLeft: 50 }, contentContainerStyle: { alignItems: "flex-start" }, children: (0, jsx_runtime_1.jsx)(Box_1.Box, { px: 1, backgroundColor: "blue100", flexDirection: "row", height: 300, width: 200, top: 2, borderBottomWidth: 1, textAlign: "center" }) }));
-exports.Styled = Styled;
-const RegularViewProps = () => {
-    const r = (0, react_1.useRef)(null);
-    return ((0, jsx_runtime_1.jsx)(Flex_1.Flex, { flex: 1, children: (0, jsx_runtime_1.jsx)(Box_1.Box, { px: 1, height: 200, width: 200, backgroundColor: "red100", onLayout: (e) => console.log(e.nativeEvent.layout), ref: r }) }));
-};
-exports.RegularViewProps = RegularViewProps;
-const colors = ["red10", "green10", "yellow10", "devpurple", "red100", "black10"];
-const GapProps = () => ((0, jsx_runtime_1.jsxs)(helpers_1.List, { style: { marginHorizontal: 20 }, children: [(0, jsx_runtime_1.jsx)(Text_1.Text, { children: "Gap \uD83D\uDC47" }), (0, jsx_runtime_1.jsx)(Box_1.Box, { borderWidth: 1, borderColor: "black100", gap: 10, flexWrap: "wrap", flexDirection: "row", children: colors.map((color) => ((0, jsx_runtime_1.jsx)(Box_1.Box, { backgroundColor: color, width: 100, height: 100, children: (0, jsx_runtime_1.jsx)(Text_1.Text, { children: color }) }, `${color}-1`))) }), (0, jsx_runtime_1.jsx)(Text_1.Text, { children: "Row gap \uD83D\uDC47" }), (0, jsx_runtime_1.jsx)(Box_1.Box, { borderWidth: 1, borderColor: "black100", rowGap: 10, flexWrap: "wrap", flexDirection: "row", children: colors.map((color) => ((0, jsx_runtime_1.jsx)(Box_1.Box, { backgroundColor: color, width: 100, height: 100, children: (0, jsx_runtime_1.jsx)(Text_1.Text, { children: color }) }, `${color}-2`))) }), (0, jsx_runtime_1.jsx)(Text_1.Text, { children: "Column gap \uD83D\uDC47" }), (0, jsx_runtime_1.jsx)(Box_1.Box, { borderWidth: 1, borderColor: "black100", columnGap: 10, flexWrap: "wrap", flexDirection: "row", children: colors.map((color) => ((0, jsx_runtime_1.jsx)(Box_1.Box, { backgroundColor: color, width: 100, height: 100, children: (0, jsx_runtime_1.jsx)(Text_1.Text, { children: color }) }, `${color}-3`))) }), (0, jsx_runtime_1.jsx)(Spacer_1.Spacer, { y: 6 })] }));
-exports.GapProps = GapProps;

package/dist/elements/Box/index.d.ts

@@ -1 +0,0 @@
-export * from "./Box";

package/dist/elements/Box/index.js

@@ -1,17 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./Box"), exports);

package/dist/elements/Button/Button.d.ts

@@ -1,40 +0,0 @@
-/// <reference types="react" />
-import { TextVariant } from "@artsy/palette-tokens/dist/typography/v3";
-import { PressableProps } from "react-native";
-import { HapticFeedbackTypes } from "react-native-haptic-feedback";
-import { BoxProps } from "../Box";
-export interface ButtonProps extends BoxProps {
-    children: React.ReactNode;
-    size?: "small" | "large";
-    variant?: "fillDark" | "fillLight" | "fillGray" | "fillSuccess" | "outline" | "outlineGray" | "outlineLight" | "text";
-    onPress?: PressableProps["onPress"];
-    icon?: React.ReactNode;
-    iconPosition?: "left" | "left-start" | "right";
-    /**
-     * `haptic` can be used like:
-     * <Button haptic />
-     * or
-     * <Button haptic="impactHeavy" />
-     * to add haptic feedback on the button.
-     */
-    haptic?: HapticFeedbackTypes | true;
-    /** Displays a loader in the button */
-    loading?: boolean;
-    /** Disabled interactions */
-    disabled?: boolean;
-    /** Makes button full width */
-    block?: boolean;
-    /** Pass the longest text to the button for the button to keep longest text width */
-    longestText?: string;
-    /** Used only for tests and stories */
-    testOnly_state?: DisplayState;
-    textVariant?: TextVariant;
-}
-declare enum DisplayState {
-    Enabled = "enabled",
-    Disabled = "disabled",
-    Loading = "loading",
-    Pressed = "pressed"
-}
-export declare const Button: React.FC<ButtonProps>;
-export { DisplayState as _test_DisplayState };