@artsy/palette-mobile 13.2.33 → 13.2.35

package/dist/elements/Input/InputTitle.js

@@ -1,12 +1,8 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.InputTitle = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const Text_1 = require("../Text");
-const InputTitle = ({ children: title, optional, required }) => {
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Text } from "../Text";
+export const InputTitle = ({ children: title, optional, required }) => {
     if (!title) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsxs)(Text_1.Text, { variant: "md", style: { fontSize: 13, marginBottom: 2, textTransform: "uppercase" }, children: [title, !!required && ((0, jsx_runtime_1.jsx)(Text_1.Text, { variant: "md", style: { fontSize: 13, textTransform: "none" }, color: "onBackgroundMedium", children: "Required" })), !!optional && ((0, jsx_runtime_1.jsxs)(Text_1.Text, { variant: "md", style: { fontSize: 13, textTransform: "none" }, color: "onBackgroundMedium", children: [" ", "Optional"] }))] }));
+    return (_jsxs(Text, { variant: "md", style: { fontSize: 13, marginBottom: 2, textTransform: "uppercase" }, children: [title, !!required && (_jsx(Text, { variant: "md", style: { fontSize: 13, textTransform: "none" }, color: "onBackgroundMedium", children: "Required" })), !!optional && (_jsxs(Text, { variant: "md", style: { fontSize: 13, textTransform: "none" }, color: "onBackgroundMedium", children: [" ", "Optional"] }))] }));
 };
-exports.InputTitle = InputTitle;

package/dist/elements/Input/helpers.d.ts

@@ -38,5 +38,5 @@ export declare const getInputState: ({ isFocused, value, }: {
 export declare const getInputVariant: ({ disabled, hasError, }: {
     disabled: boolean;
     hasError: boolean;
-}) => "default" | "error" | "disabled";
+}) => "default" | "disabled" | "error";
 export {};

package/dist/elements/Input/helpers.js

@@ -1,94 +1,91 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getInputVariant = exports.getInputState = exports.INPUT_VARIANTS = exports.EXPANDED_LABEL_TOP = exports.SHRINKED_LABEL_TOP = void 0;
-const palette_tokens_1 = require("@artsy/palette-tokens");
-exports.SHRINKED_LABEL_TOP = 13;
-exports.EXPANDED_LABEL_TOP = 40;
+import { THEME } from "@artsy/palette-tokens";
+export const SHRINKED_LABEL_TOP = 13;
+export const EXPANDED_LABEL_TOP = 40;
 const DEFAULT_VARIANT_STATES = {
     // Unfocused input with no value
     untouched: {
-        inputBorderColor: palette_tokens_1.THEME.colors.black30,
-        labelFontSize: parseInt(palette_tokens_1.THEME.textVariants["sm-display"].fontSize, 10),
-        labelColor: palette_tokens_1.THEME.colors.black60,
-        labelTop: exports.EXPANDED_LABEL_TOP,
-        inputTextColor: palette_tokens_1.THEME.colors.black100,
+        inputBorderColor: THEME.colors.black30,
+        labelFontSize: parseInt(THEME.textVariants["sm-display"].fontSize, 10),
+        labelColor: THEME.colors.black60,
+        labelTop: EXPANDED_LABEL_TOP,
+        inputTextColor: THEME.colors.black100,
     },
     // Unfocused input with value
     touched: {
-        inputBorderColor: palette_tokens_1.THEME.colors.black60,
-        labelFontSize: parseInt(palette_tokens_1.THEME.textVariants.xs.fontSize, 10),
-        labelColor: palette_tokens_1.THEME.colors.black60,
-        labelTop: exports.SHRINKED_LABEL_TOP,
-        inputTextColor: palette_tokens_1.THEME.colors.black100,
+        inputBorderColor: THEME.colors.black60,
+        labelFontSize: parseInt(THEME.textVariants.xs.fontSize, 10),
+        labelColor: THEME.colors.black60,
+        labelTop: SHRINKED_LABEL_TOP,
+        inputTextColor: THEME.colors.black100,
     },
     // Focused input with or without value
     focused: {
-        inputBorderColor: palette_tokens_1.THEME.colors.blue100,
-        labelFontSize: parseInt(palette_tokens_1.THEME.textVariants.xs.fontSize, 10),
-        labelColor: palette_tokens_1.THEME.colors.blue100,
-        labelTop: exports.SHRINKED_LABEL_TOP,
-        inputTextColor: palette_tokens_1.THEME.colors.black100,
+        inputBorderColor: THEME.colors.blue100,
+        labelFontSize: parseInt(THEME.textVariants.xs.fontSize, 10),
+        labelColor: THEME.colors.blue100,
+        labelTop: SHRINKED_LABEL_TOP,
+        inputTextColor: THEME.colors.black100,
     },
 };
 const ERROR_VARIANT_STATES = {
     // Unfocused error input with no value
     untouched: {
-        inputBorderColor: palette_tokens_1.THEME.colors.red100,
-        labelFontSize: parseInt(palette_tokens_1.THEME.textVariants["sm-display"].fontSize, 10),
-        labelColor: palette_tokens_1.THEME.colors.red100,
-        labelTop: exports.EXPANDED_LABEL_TOP,
-        inputTextColor: palette_tokens_1.THEME.colors.black100,
+        inputBorderColor: THEME.colors.red100,
+        labelFontSize: parseInt(THEME.textVariants["sm-display"].fontSize, 10),
+        labelColor: THEME.colors.red100,
+        labelTop: EXPANDED_LABEL_TOP,
+        inputTextColor: THEME.colors.black100,
     },
     // Unfocused error input with value
     touched: {
-        inputBorderColor: palette_tokens_1.THEME.colors.red100,
-        labelFontSize: parseInt(palette_tokens_1.THEME.textVariants.xs.fontSize, 10),
-        labelColor: palette_tokens_1.THEME.colors.red100,
-        labelTop: exports.SHRINKED_LABEL_TOP,
-        inputTextColor: palette_tokens_1.THEME.colors.black100,
+        inputBorderColor: THEME.colors.red100,
+        labelFontSize: parseInt(THEME.textVariants.xs.fontSize, 10),
+        labelColor: THEME.colors.red100,
+        labelTop: SHRINKED_LABEL_TOP,
+        inputTextColor: THEME.colors.black100,
     },
     // Focused error input with or without value
     focused: {
-        inputBorderColor: palette_tokens_1.THEME.colors.red100,
-        labelFontSize: parseInt(palette_tokens_1.THEME.textVariants.xs.fontSize, 10),
-        labelColor: palette_tokens_1.THEME.colors.red100,
-        labelTop: exports.SHRINKED_LABEL_TOP,
-        inputTextColor: palette_tokens_1.THEME.colors.black100,
+        inputBorderColor: THEME.colors.red100,
+        labelFontSize: parseInt(THEME.textVariants.xs.fontSize, 10),
+        labelColor: THEME.colors.red100,
+        labelTop: SHRINKED_LABEL_TOP,
+        inputTextColor: THEME.colors.black100,
     },
 };
 const DISABLED_VARIANT_STATES = {
     // Unfocused disabled input with no value
     untouched: {
-        inputBorderColor: palette_tokens_1.THEME.colors.black30,
-        labelFontSize: parseInt(palette_tokens_1.THEME.textVariants["sm-display"].fontSize, 10),
-        labelColor: palette_tokens_1.THEME.colors.black30,
-        labelTop: exports.EXPANDED_LABEL_TOP,
-        inputTextColor: palette_tokens_1.THEME.colors.black30,
+        inputBorderColor: THEME.colors.black30,
+        labelFontSize: parseInt(THEME.textVariants["sm-display"].fontSize, 10),
+        labelColor: THEME.colors.black30,
+        labelTop: EXPANDED_LABEL_TOP,
+        inputTextColor: THEME.colors.black30,
     },
     // Unfocused disabled input with value
     touched: {
-        inputBorderColor: palette_tokens_1.THEME.colors.black30,
-        labelFontSize: parseInt(palette_tokens_1.THEME.textVariants.xs.fontSize, 10),
-        labelColor: palette_tokens_1.THEME.colors.black30,
-        labelTop: exports.SHRINKED_LABEL_TOP,
-        inputTextColor: palette_tokens_1.THEME.colors.black30,
+        inputBorderColor: THEME.colors.black30,
+        labelFontSize: parseInt(THEME.textVariants.xs.fontSize, 10),
+        labelColor: THEME.colors.black30,
+        labelTop: SHRINKED_LABEL_TOP,
+        inputTextColor: THEME.colors.black30,
     },
     // Focused disabled input with or without value
     // Adding this just to satisfy typescript because a disabled input can't be focused
     focused: {
-        inputBorderColor: palette_tokens_1.THEME.colors.black30,
-        labelFontSize: parseInt(palette_tokens_1.THEME.textVariants.xs.fontSize, 10),
-        labelColor: palette_tokens_1.THEME.colors.black30,
-        labelTop: exports.SHRINKED_LABEL_TOP,
-        inputTextColor: palette_tokens_1.THEME.colors.black30,
+        inputBorderColor: THEME.colors.black30,
+        labelFontSize: parseInt(THEME.textVariants.xs.fontSize, 10),
+        labelColor: THEME.colors.black30,
+        labelTop: SHRINKED_LABEL_TOP,
+        inputTextColor: THEME.colors.black30,
     },
 };
-exports.INPUT_VARIANTS = {
+export const INPUT_VARIANTS = {
     default: DEFAULT_VARIANT_STATES,
     error: ERROR_VARIANT_STATES,
     disabled: DISABLED_VARIANT_STATES,
 };
-const getInputState = ({ isFocused, value, }) => {
+export const getInputState = ({ isFocused, value, }) => {
     if (isFocused) {
         return "focused";
     }
@@ -99,8 +96,7 @@ const getInputState = ({ isFocused, value, }) => {
         return "untouched";
     }
 };
-exports.getInputState = getInputState;
-const getInputVariant = ({ disabled, hasError, }) => {
+export const getInputVariant = ({ disabled, hasError, }) => {
     if (hasError) {
         return "error";
     }
@@ -109,4 +105,3 @@ const getInputVariant = ({ disabled, hasError, }) => {
     }
     return "default";
 };
-exports.getInputVariant = getInputVariant;

package/dist/elements/Input/index.js

@@ -1,19 +1,3 @@
-"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("./Input"), exports);
-__exportStar(require("./helpers"), exports);
-__exportStar(require("./InputTitle"), exports);
+export * from "./Input";
+export * from "./helpers";
+export * from "./InputTitle";

package/dist/elements/Input/maskValue.js

@@ -1,6 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.unmaskText = exports.maskValue = void 0;
 const maskString = (value, mask) => {
     let result = mask.replace(/9/g, "_");
     for (const digit of value.replace(/\D/g, "")) {
@@ -16,11 +13,11 @@ const maskString = (value, mask) => {
     }
     return result;
 };
-const maskValue = ({ currentValue, mask, previousValue = "", }) => {
+export const maskValue = ({ currentValue, mask, previousValue = "", }) => {
     if (!currentValue || !mask || mask.length === 0) {
         return currentValue;
     }
-    const value = (0, exports.unmaskText)(currentValue);
+    const value = unmaskText(currentValue);
     if (previousValue && previousValue.length > currentValue.length) {
         // user is deleting, don't mess with the format
         return currentValue;
@@ -29,12 +26,12 @@ const maskValue = ({ currentValue, mask, previousValue = "", }) => {
         return maskString(currentValue, mask);
     }
     else {
-        if (value.length <= (0, exports.unmaskText)(mask[0]).length) {
+        if (value.length <= unmaskText(mask[0]).length) {
             return maskString(value, mask[0]);
         }
         else {
             const nearestMask = [...mask].reverse().find((m) => {
-                if (value.length >= (0, exports.unmaskText)(m).length) {
+                if (value.length >= unmaskText(m).length) {
                     return true;
                 }
                 return false;
@@ -43,7 +40,5 @@ const maskValue = ({ currentValue, mask, previousValue = "", }) => {
         }
     }
 };
-exports.maskValue = maskValue;
 // Helper method to clean the mask and remove all non-digits and spaces
-const unmaskText = (mask) => mask.replace(/\W/g, "");
-exports.unmaskText = unmaskText;
+export const unmaskText = (mask) => mask.replace(/\W/g, "");

package/dist/elements/Input/maskValue.tests.js

@@ -1,6 +1,4 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const maskValue_1 = require("./maskValue");
+import { maskValue } from "./maskValue";
 const GERMANY_PHONE_MASKS = [
     "999 999",
     "999 9999",
@@ -12,45 +10,45 @@ const GERMANY_PHONE_MASKS = [
 ];
 const TUNISIA_PHONE_MASK = "99 999 999";
 const UNITED_STATES_PHONE_MASK = "999 999 9999";
-describe(maskValue_1.maskValue, () => {
+describe(maskValue, () => {
     it("leaves the value value alone if the user is deleting characters", () => {
-        expect((0, maskValue_1.maskValue)({
+        expect(maskValue({
             currentValue: "017672458053",
             mask: GERMANY_PHONE_MASKS,
         })).toBe("0176 72458053");
-        expect((0, maskValue_1.maskValue)({
+        expect(maskValue({
             currentValue: "17672458053",
             mask: GERMANY_PHONE_MASKS,
         })).toBe("176 72458053");
-        expect((0, maskValue_1.maskValue)({
+        expect(maskValue({
             currentValue: "030901820",
             mask: GERMANY_PHONE_MASKS,
         })).toBe("030 901820");
-        expect((0, maskValue_1.maskValue)({
+        expect(maskValue({
             currentValue: "901820",
             mask: GERMANY_PHONE_MASKS,
         })).toBe("901 820");
-        expect((0, maskValue_1.maskValue)({
+        expect(maskValue({
             currentValue: "20335902",
             mask: TUNISIA_PHONE_MASK,
         })).toBe("20 335 902");
     });
     it("works with empty strings", () => {
-        expect((0, maskValue_1.maskValue)({
+        expect(maskValue({
             currentValue: "",
             mask: GERMANY_PHONE_MASKS,
         })).toBe("");
-        expect((0, maskValue_1.maskValue)({
+        expect(maskValue({
             currentValue: "",
             mask: "",
         })).toBe("");
     });
     it("formats a given phone number to the given country's default format", () => {
-        expect((0, maskValue_1.maskValue)({
+        expect(maskValue({
             currentValue: "7825577664",
             mask: UNITED_STATES_PHONE_MASK,
         })).toBe("782 557 7664");
-        expect((0, maskValue_1.maskValue)({
+        expect(maskValue({
             currentValue: "782557766",
             mask: UNITED_STATES_PHONE_MASK,
         })).toBe("782 557 766");

package/dist/elements/Join/Join.js

@@ -1,8 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Join = void 0;
-const react_1 = require("react");
-const flattenChildren_1 = require("../../utils/flattenChildren");
+import { Children, cloneElement } from "react";
+import { flattenChildren } from "../../utils/flattenChildren";
 /**
  * `Join` is a higher order component that renders a separator component
  * between each of `Join`'s direct children.
@@ -23,19 +20,18 @@ const flattenChildren_1 = require("../../utils/flattenChildren");
  * <SomeComponent/>
  * <child3/>
  */
-const Join = ({ separator, children, flatten = false }) => {
-    const childArray = flatten ? (0, flattenChildren_1.flattenChildren)(children) : react_1.Children.toArray(children);
+export const Join = ({ separator, children, flatten = false }) => {
+    const childArray = flatten ? flattenChildren(children) : Children.toArray(children);
     return childArray.reduce((acc, curr, currentIndex) => {
-        acc.push((0, react_1.cloneElement)(curr, {
+        acc.push(cloneElement(curr, {
             key: `join-${currentIndex}`,
         }));
         if (currentIndex !== childArray.length - 1) {
             acc.push(separator &&
-                (0, react_1.cloneElement)(separator, {
+                cloneElement(separator, {
                     key: `join-sep-${currentIndex}`,
                 }));
         }
         return acc;
     }, []);
 };
-exports.Join = Join;

package/dist/elements/Join/index.js

@@ -1,17 +1 @@
-"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("./Join"), exports);
+export * from "./Join";

package/dist/elements/LazyFlatlist/LazyFlatlist.js

@@ -1,9 +1,6 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.LazyFlatlist = void 0;
-const useHasSeenItem_1 = require("./useHasSeenItem");
-function LazyFlatlist(props) {
-    const { viewabilityConfig, onViewableItemsChanged, hasSeenItem, viewedItems } = (0, useHasSeenItem_1.useHasSeenItem)({
+import { useHasSeenItem } from "./useHasSeenItem";
+export function LazyFlatlist(props) {
+    const { viewabilityConfig, onViewableItemsChanged, hasSeenItem, viewedItems } = useHasSeenItem({
         keyExtractor: props.keyExtractor,
     });
     if (!props.children || typeof props.children !== "function") {
@@ -16,4 +13,3 @@ function LazyFlatlist(props) {
         hasSeenItem,
     });
 }
-exports.LazyFlatlist = LazyFlatlist;

package/dist/elements/LazyFlatlist/index.js

@@ -1,18 +1,2 @@
-"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("./LazyFlatlist"), exports);
-__exportStar(require("./useHasSeenItem"), exports);
+export * from "./LazyFlatlist";
+export * from "./useHasSeenItem";

package/dist/elements/LazyFlatlist/useHasSeenItem.js

@@ -1,18 +1,15 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useHasSeenItem = void 0;
-const react_1 = require("react");
+import { useRef, useState } from "react";
 // This is a custom hook that is used to determine if a user has seen an item in a list or not
-const useHasSeenItem = ({ keyExtractor }) => {
-    const [viewedItems, setViewedItems] = (0, react_1.useState)(new Set());
-    const viewabilityConfig = (0, react_1.useRef)({
+export const useHasSeenItem = ({ keyExtractor }) => {
+    const [viewedItems, setViewedItems] = useState(new Set());
+    const viewabilityConfig = useRef({
         // Percent of of the item that is visible for a partially occluded item to count as "viewable"
         itemVisiblePercentThreshold: 20,
         minimumViewTime: 300,
         waitForInteraction: false,
     }).current;
-    const viewedItemsRef = (0, react_1.useRef)(new Set()).current;
-    const onViewableItemsChanged = (0, react_1.useRef)(({ viewableItems }) => {
+    const viewedItemsRef = useRef(new Set()).current;
+    const onViewableItemsChanged = useRef(({ viewableItems }) => {
         viewableItems.forEach(({ item }) => {
             viewedItemsRef.add(keyExtractor(item));
         });
@@ -28,4 +25,3 @@ const useHasSeenItem = ({ keyExtractor }) => {
         viewedItems,
     };
 };
-exports.useHasSeenItem = useHasSeenItem;