@artsy/palette-mobile 13.2.33 → 13.2.35

package/dist/svgs/icons.stories.js

@@ -1,44 +1,17 @@
-"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.AllIcons = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const Icons = __importStar(require("."));
-const Icon_1 = require("./Icon");
-const Flex_1 = require("../elements/Flex");
-const Spacer_1 = require("../elements/Spacer");
-const Text_1 = require("../elements/Text");
-const helpers_1 = require("../storybook/helpers");
-exports.default = {
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as Icons from ".";
+import { Icon } from "./Icon";
+import { Flex } from "../elements/Flex";
+import { Spacer } from "../elements/Spacer";
+import { Text } from "../elements/Text";
+import { List } from "../storybook/helpers";
+export default {
     title: "Icons",
-    component: Icon_1.Icon,
+    component: Icon,
 };
 const allIcons = Object.entries(Icons);
-const AllIcons = () => ((0, jsx_runtime_1.jsx)(helpers_1.List, { style: { marginLeft: 50 }, contentContainerStyle: { alignItems: "flex-start" }, children: allIcons.map((icon) => {
+export const AllIcons = () => (_jsx(List, { style: { marginLeft: 50 }, contentContainerStyle: { alignItems: "flex-start" }, children: allIcons.map((icon) => {
         const Comp = icon[1];
         const name = icon[0];
-        return ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "row", alignItems: "center", children: [(0, jsx_runtime_1.jsx)(Comp, { fill: "onBackgroundHigh" }), (0, jsx_runtime_1.jsx)(Spacer_1.Spacer, { x: 1 }), (0, jsx_runtime_1.jsx)(Text_1.Text, { children: name })] }));
+        return (_jsxs(Flex, { flexDirection: "row", alignItems: "center", children: [_jsx(Comp, { fill: "onBackgroundHigh" }), _jsx(Spacer, { x: 1 }), _jsx(Text, { children: name })] }));
     }) }));
-exports.AllIcons = AllIcons;

package/dist/svgs/index.js

@@ -1,129 +1,113 @@
-"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("./AddCircleFillIcon"), exports);
-__exportStar(require("./AddCircleIcon"), exports);
-__exportStar(require("./AddIcon"), exports);
-__exportStar(require("./AlertCircleFillIcon"), exports);
-__exportStar(require("./AlertIcon"), exports);
-__exportStar(require("./ArrowCircleFillIcons"), exports);
-__exportStar(require("./ArrowDownCircleIcon"), exports);
-__exportStar(require("./ArrowDownIcon"), exports);
-__exportStar(require("./ArrowLeftCircleIcon"), exports);
-__exportStar(require("./ArrowLeftIcon"), exports);
-__exportStar(require("./ArrowRightCircleIcon"), exports);
-__exportStar(require("./ArrowRightIcon"), exports);
-__exportStar(require("./ArrowUpCircleIcon"), exports);
-__exportStar(require("./ArrowUpIcon"), exports);
-__exportStar(require("./ArtsyLogoBlackIcon"), exports);
-__exportStar(require("./ArtsyLogoWhiteIcon"), exports);
-__exportStar(require("./ArtsyMarkBlackIcon"), exports);
-__exportStar(require("./ArtsyMarkWhiteIcon"), exports);
-__exportStar(require("./ArtworkIcon"), exports);
-__exportStar(require("./AuctionIcon"), exports);
-__exportStar(require("./BellFillIcon"), exports);
-__exportStar(require("./BellIcon"), exports);
-__exportStar(require("./BlueChipIcon"), exports);
-__exportStar(require("./BoltCircleFill"), exports);
-__exportStar(require("./BoltFill"), exports);
-__exportStar(require("./BookmarkFill"), exports);
-__exportStar(require("./BriefcaseIcon"), exports);
-__exportStar(require("./CertificateIcon"), exports);
-__exportStar(require("./CheckCircleFillIcon"), exports);
-__exportStar(require("./CheckCircleIcon"), exports);
-__exportStar(require("./CheckIcon"), exports);
-__exportStar(require("./ChevronIcon"), exports);
-__exportStar(require("./ClockFill"), exports);
-__exportStar(require("./CloseCircleFillIcon"), exports);
-__exportStar(require("./CloseCircleIcon"), exports);
-__exportStar(require("./CloseIcon"), exports);
-__exportStar(require("./CollapseIcon"), exports);
-__exportStar(require("./CreditCardIcon"), exports);
-__exportStar(require("./DecreaseIcon"), exports);
-__exportStar(require("./DocumentIcon"), exports);
-__exportStar(require("./DownloadIcon"), exports);
-__exportStar(require("./EditIcon"), exports);
-__exportStar(require("./EmptyCheckCircleIcon"), exports);
-__exportStar(require("./EnterIcon"), exports);
-__exportStar(require("./EnvelopeIcon"), exports);
-__exportStar(require("./EstablishedIcon"), exports);
-__exportStar(require("./ExclamationMarkCircleFill"), exports);
-__exportStar(require("./ExpandIcon"), exports);
-__exportStar(require("./EyeClosedIcon"), exports);
-__exportStar(require("./EyeOpenedIcon"), exports);
-__exportStar(require("./FacebookIcon"), exports);
-__exportStar(require("./FairIcon"), exports);
-__exportStar(require("./FilterIcon"), exports);
-__exportStar(require("./FullWidthIcon"), exports);
-__exportStar(require("./GenomeIcon"), exports);
-__exportStar(require("./GraphIcon"), exports);
-__exportStar(require("./GridIcon"), exports);
-__exportStar(require("./GuaranteeIcon"), exports);
-__exportStar(require("./HeartFillIcon"), exports);
-__exportStar(require("./HeartIcon"), exports);
-__exportStar(require("./HideIcon"), exports);
-__exportStar(require("./HomeIcon"), exports);
-__exportStar(require("./ImageIcon"), exports);
-__exportStar(require("./ImageSetIcon"), exports);
-__exportStar(require("./IncreaseIcon"), exports);
-__exportStar(require("./InfoCircleIcon"), exports);
-__exportStar(require("./InstagramAppIcon"), exports);
-__exportStar(require("./InstitutionIcon"), exports);
-__exportStar(require("./LinkIcon"), exports);
-__exportStar(require("./LoaderIcon"), exports);
-__exportStar(require("./LockIcon"), exports);
-__exportStar(require("./LogoutIcon"), exports);
-__exportStar(require("./MagnifyingGlassIcon"), exports);
-__exportStar(require("./MapPinIcon"), exports);
-__exportStar(require("./MenuIcon"), exports);
-__exportStar(require("./MessageIcon"), exports);
-__exportStar(require("./MessagesAppIcon"), exports);
-__exportStar(require("./MoneyCircleIcon"), exports);
-__exportStar(require("./MoneyFillIcon"), exports);
-__exportStar(require("./MoreIcon"), exports);
-__exportStar(require("./MultiplePersonsIcon"), exports);
-__exportStar(require("./NoArtworkIcon"), exports);
-__exportStar(require("./NoImageIcon"), exports);
-__exportStar(require("./PageIcon"), exports);
-__exportStar(require("./Payment2Icon"), exports);
-__exportStar(require("./PaymentIcon"), exports);
-__exportStar(require("./PersonIcon"), exports);
-__exportStar(require("./PublicationIcon"), exports);
-__exportStar(require("./QuestionCircleIcon"), exports);
-__exportStar(require("./ReloadIcon"), exports);
-__exportStar(require("./SecureLockIcon"), exports);
-__exportStar(require("./SettingsIcon"), exports);
-__exportStar(require("./ShareIcon"), exports);
-__exportStar(require("./ShieldIcon"), exports);
-__exportStar(require("./ShieldFilledIcon"), exports);
-__exportStar(require("./StarCircleFill"), exports);
-__exportStar(require("./StarCircleIcon"), exports);
-__exportStar(require("./Stopwatch"), exports);
-__exportStar(require("./Tag2Icon"), exports);
-__exportStar(require("./TagIcon"), exports);
-__exportStar(require("./TimerIcon"), exports);
-__exportStar(require("./TopEmergingIcon"), exports);
-__exportStar(require("./TrashIcon"), exports);
-__exportStar(require("./TrendingIcon"), exports);
-__exportStar(require("./TriangleDown"), exports);
-__exportStar(require("./TwitterIcon"), exports);
-__exportStar(require("./UserMultiIcon"), exports);
-__exportStar(require("./UserSingleIcon"), exports);
-__exportStar(require("./VerifiedIcon"), exports);
-__exportStar(require("./VerifiedPersonIcon"), exports);
-__exportStar(require("./WhatsAppAppIcon"), exports);
-__exportStar(require("./WorldGlobeCircleIcon"), exports);
-__exportStar(require("./XCircleIcon"), exports);
+export * from "./AddCircleFillIcon";
+export * from "./AddCircleIcon";
+export * from "./AddIcon";
+export * from "./AlertCircleFillIcon";
+export * from "./AlertIcon";
+export * from "./ArrowCircleFillIcons";
+export * from "./ArrowDownCircleIcon";
+export * from "./ArrowDownIcon";
+export * from "./ArrowLeftCircleIcon";
+export * from "./ArrowLeftIcon";
+export * from "./ArrowRightCircleIcon";
+export * from "./ArrowRightIcon";
+export * from "./ArrowUpCircleIcon";
+export * from "./ArrowUpIcon";
+export * from "./ArtsyLogoBlackIcon";
+export * from "./ArtsyLogoWhiteIcon";
+export * from "./ArtsyMarkBlackIcon";
+export * from "./ArtsyMarkWhiteIcon";
+export * from "./ArtworkIcon";
+export * from "./AuctionIcon";
+export * from "./BellFillIcon";
+export * from "./BellIcon";
+export * from "./BlueChipIcon";
+export * from "./BoltCircleFill";
+export * from "./BoltFill";
+export * from "./BookmarkFill";
+export * from "./BriefcaseIcon";
+export * from "./CertificateIcon";
+export * from "./CheckCircleFillIcon";
+export * from "./CheckCircleIcon";
+export * from "./CheckIcon";
+export * from "./ChevronIcon";
+export * from "./ClockFill";
+export * from "./CloseCircleFillIcon";
+export * from "./CloseCircleIcon";
+export * from "./CloseIcon";
+export * from "./CollapseIcon";
+export * from "./CreditCardIcon";
+export * from "./DecreaseIcon";
+export * from "./DocumentIcon";
+export * from "./DownloadIcon";
+export * from "./EditIcon";
+export * from "./EmptyCheckCircleIcon";
+export * from "./EnterIcon";
+export * from "./EnvelopeIcon";
+export * from "./EstablishedIcon";
+export * from "./ExclamationMarkCircleFill";
+export * from "./ExpandIcon";
+export * from "./EyeClosedIcon";
+export * from "./EyeOpenedIcon";
+export * from "./FacebookIcon";
+export * from "./FairIcon";
+export * from "./FilterIcon";
+export * from "./FullWidthIcon";
+export * from "./GenomeIcon";
+export * from "./GraphIcon";
+export * from "./GridIcon";
+export * from "./GuaranteeIcon";
+export * from "./HeartFillIcon";
+export * from "./HeartIcon";
+export * from "./HideIcon";
+export * from "./HomeIcon";
+export * from "./ImageIcon";
+export * from "./ImageSetIcon";
+export * from "./IncreaseIcon";
+export * from "./InfoCircleIcon";
+export * from "./InstagramAppIcon";
+export * from "./InstitutionIcon";
+export * from "./LinkIcon";
+export * from "./LoaderIcon";
+export * from "./LockIcon";
+export * from "./LogoutIcon";
+export * from "./MagnifyingGlassIcon";
+export * from "./MapPinIcon";
+export * from "./MenuIcon";
+export * from "./MessageIcon";
+export * from "./MessagesAppIcon";
+export * from "./MoneyCircleIcon";
+export * from "./MoneyFillIcon";
+export * from "./MoreIcon";
+export * from "./MultiplePersonsIcon";
+export * from "./NoArtworkIcon";
+export * from "./NoImageIcon";
+export * from "./PageIcon";
+export * from "./Payment2Icon";
+export * from "./PaymentIcon";
+export * from "./PersonIcon";
+export * from "./PublicationIcon";
+export * from "./QuestionCircleIcon";
+export * from "./ReloadIcon";
+export * from "./SecureLockIcon";
+export * from "./SettingsIcon";
+export * from "./ShareIcon";
+export * from "./ShieldIcon";
+export * from "./ShieldFilledIcon";
+export * from "./StarCircleFill";
+export * from "./StarCircleIcon";
+export * from "./Stopwatch";
+export * from "./Tag2Icon";
+export * from "./TagIcon";
+export * from "./TimerIcon";
+export * from "./TopEmergingIcon";
+export * from "./TrashIcon";
+export * from "./TrendingIcon";
+export * from "./TriangleDown";
+export * from "./TwitterIcon";
+export * from "./UserMultiIcon";
+export * from "./UserSingleIcon";
+export * from "./VerifiedIcon";
+export * from "./VerifiedPersonIcon";
+export * from "./WhatsAppAppIcon";
+export * from "./WorldGlobeCircleIcon";
+export * from "./XCircleIcon";

package/dist/tokens.js

@@ -1,20 +1,17 @@
-"use strict";
 /**
  * All of the config for the Artsy theming system, based on the
  * design system from our design team:
  * https://www.figma.com/file/gZNkyqLT8AU3T61tluVJyB/Artsy-3.1-Design-System
  */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.THEMES = exports.COLOR_LAYER_ROLE = exports.COLOR_LAYER_NAME = void 0;
-const palette_tokens_1 = require("@artsy/palette-tokens");
-const webTokensToMobile_1 = require("./utils/webTokensToMobile");
-const { textVariants, space, colors } = palette_tokens_1.THEME;
-exports.COLOR_LAYER_NAME = {
+import { THEME } from "@artsy/palette-tokens";
+import { convertWebSpacingUnitsToMobile, convertWebTextTreatmentsToMobile, } from "./utils/webTokensToMobile";
+const { textVariants, space, colors } = THEME;
+export const COLOR_LAYER_NAME = {
     ...colors,
     /** Adding this here for dev usage. Avoid using it for actual components. */
     devpurple: "#6E1EFF",
 };
-exports.COLOR_LAYER_ROLE = [
+export const COLOR_LAYER_ROLE = [
     // name: Anything big/surface: background, cards, button fills, etc.
     // onName: Anything small, texts, icons, etc.
     // onNameContrast: Anything small, texts, icons, etc based on contrast.
@@ -40,8 +37,8 @@ exports.COLOR_LAYER_ROLE = [
     "onBrand",
 ];
 const v3 = {
-    space: (0, webTokensToMobile_1.convertWebSpacingUnitsToMobile)(space),
-    colors: exports.COLOR_LAYER_NAME,
+    space: convertWebSpacingUnitsToMobile(space),
+    colors: COLOR_LAYER_NAME,
     fonts: {
         sans: {
             regular: "Unica77LL-Regular",
@@ -50,7 +47,7 @@ const v3 = {
             mediumItalic: "Unica77LL-MediumItalic",
         },
     },
-    textTreatments: (0, webTokensToMobile_1.convertWebTextTreatmentsToMobile)(textVariants),
+    textTreatments: convertWebTextTreatmentsToMobile(textVariants),
 };
 const v3light = {
     ...v3,
@@ -104,4 +101,4 @@ const v3dark = {
         onBrand: colors.white100,
     },
 };
-exports.THEMES = { v3, v3light, v3dark };
+export const THEMES = { v3, v3light, v3dark };

package/dist/types.js

@@ -1,12 +1,7 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.isNameLayer = exports.isRoleLayer = void 0;
-const tokens_1 = require("./tokens");
-const isRoleLayer = (name) => {
-    return tokens_1.COLOR_LAYER_ROLE.includes(name);
+import { COLOR_LAYER_ROLE, COLOR_LAYER_NAME } from "./tokens";
+export const isRoleLayer = (name) => {
+    return COLOR_LAYER_ROLE.includes(name);
 };
-exports.isRoleLayer = isRoleLayer;
-const isNameLayer = (name) => {
-    return Object.keys(tokens_1.COLOR_LAYER_NAME).includes(name);
+export const isNameLayer = (name) => {
+    return Object.keys(COLOR_LAYER_NAME).includes(name);
 };
-exports.isNameLayer = isNameLayer;

package/dist/utils/Wrap.js

@@ -1,13 +1,10 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Wrap = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_nanny_1 = require("react-nanny");
-const Wrap = ({ if: condition, children }) => {
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { getChildrenByTypeDeep } from "react-nanny";
+export const Wrap = ({ if: condition, children }) => {
     if (condition) {
-        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children });
+        return _jsx(_Fragment, { children: children });
     }
-    const wrapContentChildren = (0, react_nanny_1.getChildrenByTypeDeep)(children, exports.Wrap.Content);
+    const wrapContentChildren = getChildrenByTypeDeep(children, Wrap.Content);
     if (wrapContentChildren.length === 0) {
         throw new Error("Wrap.Content is required");
     }
@@ -15,7 +12,6 @@ const Wrap = ({ if: condition, children }) => {
         throw new Error("You can't have more than one Wrap.Content");
     }
     const actualWrapContent = wrapContentChildren[0];
-    return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: actualWrapContent });
+    return _jsx(_Fragment, { children: actualWrapContent });
 };
-exports.Wrap = Wrap;
-exports.Wrap.Content = ({ children }) => (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children });
+Wrap.Content = ({ children }) => _jsx(_Fragment, { children: children });

package/dist/utils/colors.stories.js

@@ -1,18 +1,15 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.All = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const Flex_1 = require("../elements/Flex");
-const Text_1 = require("../elements/Text");
-const helpers_1 = require("../storybook/helpers");
-const tokens_1 = require("../tokens");
-const types_1 = require("../types");
-const hooks_1 = require("../utils/hooks");
-exports.default = {
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Flex } from "../elements/Flex";
+import { Text } from "../elements/Text";
+import { List, Row } from "../storybook/helpers";
+import { COLOR_LAYER_NAME } from "../tokens";
+import { isRoleLayer } from "../types";
+import { useColor } from "../utils/hooks";
+export default {
     title: "Tokens/colors",
 };
 const ColorSquare = ({ color: theColor, border }) => {
-    const color = (0, hooks_1.useColor)();
+    const color = useColor();
     const contrast = theColor.startsWith("on") &&
         (theColor.endsWith("High") || theColor.endsWith("Medium") || theColor.endsWith("Low"))
         ? theColor.match(/(High|Medium|Low)$/)?.[0]
@@ -20,8 +17,8 @@ const ColorSquare = ({ color: theColor, border }) => {
     const colorWithoutContrast = theColor.replace(/(High|Medium|Low)$/, "");
     const cssName = useCssColorName(theColor);
     const namedName = useNamedColorName(theColor);
-    const displayName = (0, types_1.isRoleLayer)(theColor) ? namedName : cssName;
-    return ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Flex, { style: [
+    const displayName = isRoleLayer(theColor) ? namedName : cssName;
+    return (_jsxs(Flex, { children: [_jsx(Flex, { style: [
                     {
                         backgroundColor: color(theColor),
                         width: 80,
@@ -33,19 +30,18 @@ const ColorSquare = ({ color: theColor, border }) => {
                         borderWidth: 0.5,
                         borderColor: "grey",
                     },
-                ] }), (0, jsx_runtime_1.jsx)(Text_1.Text, { children: colorWithoutContrast }), contrast && (0, jsx_runtime_1.jsx)(Text_1.Text, { children: contrast }), (0, jsx_runtime_1.jsx)(Text_1.Text, { color: "onBackgroundLow", children: displayName })] }));
+                ] }), _jsx(Text, { children: colorWithoutContrast }), contrast && _jsx(Text, { children: contrast }), _jsx(Text, { color: "onBackgroundLow", children: displayName })] }));
 };
-const All = () => ((0, jsx_runtime_1.jsxs)(helpers_1.List, { children: [(0, jsx_runtime_1.jsxs)(helpers_1.Row, { children: [(0, jsx_runtime_1.jsx)(ColorSquare, { color: "black100", border: true }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "black60" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "black30" })] }), (0, jsx_runtime_1.jsxs)(helpers_1.Row, { children: [(0, jsx_runtime_1.jsx)(ColorSquare, { color: "black15" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "black10" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "black5" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "white100", border: true })] }), (0, jsx_runtime_1.jsxs)(helpers_1.Row, { children: [(0, jsx_runtime_1.jsx)(ColorSquare, { color: "blue150" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "blue100" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "blue10" })] }), (0, jsx_runtime_1.jsxs)(helpers_1.Row, { children: [(0, jsx_runtime_1.jsx)(ColorSquare, { color: "green150" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "green100" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "green10" })] }), (0, jsx_runtime_1.jsxs)(helpers_1.Row, { children: [(0, jsx_runtime_1.jsx)(ColorSquare, { color: "yellow150" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "yellow100" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "yellow10" })] }), (0, jsx_runtime_1.jsxs)(helpers_1.Row, { children: [(0, jsx_runtime_1.jsx)(ColorSquare, { color: "orange150" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "orange100" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "orange10" })] }), (0, jsx_runtime_1.jsxs)(helpers_1.Row, { children: [(0, jsx_runtime_1.jsx)(ColorSquare, { color: "red150" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "red100" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "red10" })] }), (0, jsx_runtime_1.jsxs)(helpers_1.Row, { children: [(0, jsx_runtime_1.jsx)(ColorSquare, { color: "brand" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "devpurple" })] }), (0, jsx_runtime_1.jsx)(helpers_1.Row, { children: (0, jsx_runtime_1.jsx)(ColorSquare, { color: "background", border: true }) }), (0, jsx_runtime_1.jsxs)(helpers_1.Row, { children: [(0, jsx_runtime_1.jsx)(ColorSquare, { color: "onBackgroundHigh", border: true }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "onBackgroundMedium" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "onBackgroundLow" })] }), (0, jsx_runtime_1.jsx)(helpers_1.Row, { children: (0, jsx_runtime_1.jsx)(ColorSquare, { color: "surface", border: true }) }), (0, jsx_runtime_1.jsxs)(helpers_1.Row, { children: [(0, jsx_runtime_1.jsx)(ColorSquare, { color: "onSurfaceHigh", border: true }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "onSurfaceMedium" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "onSurfaceLow" })] }), (0, jsx_runtime_1.jsx)(helpers_1.Row, { children: (0, jsx_runtime_1.jsx)(ColorSquare, { color: "primary", border: true }) }), (0, jsx_runtime_1.jsxs)(helpers_1.Row, { children: [(0, jsx_runtime_1.jsx)(ColorSquare, { color: "onPrimaryHigh", border: true }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "onPrimaryMedium" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "onPrimaryLow" })] }), (0, jsx_runtime_1.jsx)(helpers_1.Row, { children: (0, jsx_runtime_1.jsx)(ColorSquare, { color: "secondary" }) }), (0, jsx_runtime_1.jsxs)(helpers_1.Row, { children: [(0, jsx_runtime_1.jsx)(ColorSquare, { color: "onSecondaryHigh" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "onSecondaryMedium" }), (0, jsx_runtime_1.jsx)(ColorSquare, { color: "onSecondaryLow" })] }), (0, jsx_runtime_1.jsx)(helpers_1.Row, { children: (0, jsx_runtime_1.jsx)(ColorSquare, { color: "brand" }) }), (0, jsx_runtime_1.jsx)(helpers_1.Row, { children: (0, jsx_runtime_1.jsx)(ColorSquare, { color: "onBrand", border: true }) })] }));
-exports.All = All;
+export const All = () => (_jsxs(List, { children: [_jsxs(Row, { children: [_jsx(ColorSquare, { color: "black100", border: true }), _jsx(ColorSquare, { color: "black60" }), _jsx(ColorSquare, { color: "black30" })] }), _jsxs(Row, { children: [_jsx(ColorSquare, { color: "black15" }), _jsx(ColorSquare, { color: "black10" }), _jsx(ColorSquare, { color: "black5" }), _jsx(ColorSquare, { color: "white100", border: true })] }), _jsxs(Row, { children: [_jsx(ColorSquare, { color: "blue150" }), _jsx(ColorSquare, { color: "blue100" }), _jsx(ColorSquare, { color: "blue10" })] }), _jsxs(Row, { children: [_jsx(ColorSquare, { color: "green150" }), _jsx(ColorSquare, { color: "green100" }), _jsx(ColorSquare, { color: "green10" })] }), _jsxs(Row, { children: [_jsx(ColorSquare, { color: "yellow150" }), _jsx(ColorSquare, { color: "yellow100" }), _jsx(ColorSquare, { color: "yellow10" })] }), _jsxs(Row, { children: [_jsx(ColorSquare, { color: "orange150" }), _jsx(ColorSquare, { color: "orange100" }), _jsx(ColorSquare, { color: "orange10" })] }), _jsxs(Row, { children: [_jsx(ColorSquare, { color: "red150" }), _jsx(ColorSquare, { color: "red100" }), _jsx(ColorSquare, { color: "red10" })] }), _jsxs(Row, { children: [_jsx(ColorSquare, { color: "brand" }), _jsx(ColorSquare, { color: "devpurple" })] }), _jsx(Row, { children: _jsx(ColorSquare, { color: "background", border: true }) }), _jsxs(Row, { children: [_jsx(ColorSquare, { color: "onBackgroundHigh", border: true }), _jsx(ColorSquare, { color: "onBackgroundMedium" }), _jsx(ColorSquare, { color: "onBackgroundLow" })] }), _jsx(Row, { children: _jsx(ColorSquare, { color: "surface", border: true }) }), _jsxs(Row, { children: [_jsx(ColorSquare, { color: "onSurfaceHigh", border: true }), _jsx(ColorSquare, { color: "onSurfaceMedium" }), _jsx(ColorSquare, { color: "onSurfaceLow" })] }), _jsx(Row, { children: _jsx(ColorSquare, { color: "primary", border: true }) }), _jsxs(Row, { children: [_jsx(ColorSquare, { color: "onPrimaryHigh", border: true }), _jsx(ColorSquare, { color: "onPrimaryMedium" }), _jsx(ColorSquare, { color: "onPrimaryLow" })] }), _jsx(Row, { children: _jsx(ColorSquare, { color: "secondary" }) }), _jsxs(Row, { children: [_jsx(ColorSquare, { color: "onSecondaryHigh" }), _jsx(ColorSquare, { color: "onSecondaryMedium" }), _jsx(ColorSquare, { color: "onSecondaryLow" })] }), _jsx(Row, { children: _jsx(ColorSquare, { color: "brand" }) }), _jsx(Row, { children: _jsx(ColorSquare, { color: "onBrand", border: true }) })] }));
 const useNamedColorName = (theColor) => {
-    const color = (0, hooks_1.useColor)();
+    const color = useColor();
     const cssName = useCssColorName(theColor);
-    const namedColor = Object.keys(tokens_1.COLOR_LAYER_NAME).find((name) => color(name) === color(theColor));
+    const namedColor = Object.keys(COLOR_LAYER_NAME).find((name) => color(name) === color(theColor));
     if (namedColor === undefined)
         return cssName;
     return namedColor;
 };
 const useCssColorName = (theColor) => {
-    const color = (0, hooks_1.useColor)();
+    const color = useColor();
     return color(theColor);
 };

package/dist/utils/createGeminiUrl.js

@@ -1,8 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.createGeminiUrl = void 0;
-const react_native_1 = require("react-native");
-function createGeminiUrl({ imageURL, width, height, geminiHost = "d7hftxdivxxvm.cloudfront.net", imageQuality = 80, resizeMode = "fill", }) {
+import { Platform } from "react-native";
+export function createGeminiUrl({ imageURL, width, height, geminiHost = "d7hftxdivxxvm.cloudfront.net", imageQuality = 80, resizeMode = "fill", }) {
     const src = encodeURIComponent(imageURL);
     const roundedHeight = Math.round(height);
     const roundedWidth = Math.round(width);
@@ -13,18 +10,17 @@ function createGeminiUrl({ imageURL, width, height, geminiHost = "d7hftxdivxxvm.
         `src=${src}`,
         `width=${roundedWidth}`,
     ];
-    if (react_native_1.Platform.OS === "android" || (react_native_1.Platform.OS === "ios" && osMajorVersion() >= 14)) {
+    if (Platform.OS === "android" || (Platform.OS === "ios" && osMajorVersion() >= 14)) {
         params.push("convert_to=webp");
     }
     return `https://${geminiHost}/?${params.join("&")}`;
 }
-exports.createGeminiUrl = createGeminiUrl;
 const osMajorVersion = () => {
     // eslint-disable-next-line no-constant-condition
-    if (typeof (react_native_1.Platform.Version === "string")) {
-        return parseInt(react_native_1.Platform.Version, 10);
+    if (typeof (Platform.Version === "string")) {
+        return parseInt(Platform.Version, 10);
     }
     else {
-        return react_native_1.Platform.Version;
+        return Platform.Version;
     }
 };

package/dist/utils/flattenChildren.js

@@ -1,17 +1,13 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.flattenChildren = void 0;
-const react_1 = require("react");
+import { isValidElement, Children, Fragment } from "react";
 /**
  * Convert a fragment or nested fragment into an array of elements.
  */
-const flattenChildren = (children) => {
-    const xs = react_1.Children.toArray(children).filter(react_1.isValidElement);
+export const flattenChildren = (children) => {
+    const xs = Children.toArray(children).filter(isValidElement);
     return xs.reduce((acc, child) => {
-        if (child.type === react_1.Fragment) {
-            return [...acc, ...(0, exports.flattenChildren)(child.props.children)];
+        if (child.type === Fragment) {
+            return [...acc, ...flattenChildren(child.props.children)];
         }
         return [...acc, child];
     }, []);
 };
-exports.flattenChildren = flattenChildren;

package/dist/utils/formatLargeNumber.js

@@ -1,7 +1,4 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.formatLargeNumber = void 0;
-function formatLargeNumber(number, decimalPlaces = 0) {
+export function formatLargeNumber(number, decimalPlaces = 0) {
     if (number < 1000) {
         return number.toString();
     }
@@ -15,4 +12,3 @@ function formatLargeNumber(number, decimalPlaces = 0) {
         return `${(number / 1000000000).toFixed(decimalPlaces)}B`;
     }
 }
-exports.formatLargeNumber = formatLargeNumber;

package/dist/utils/formatLargeNumbers.tests.js

@@ -1,20 +1,18 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const formatLargeNumber_1 = require("./formatLargeNumber");
+import { formatLargeNumber } from "./formatLargeNumber";
 describe("formatLargeNumber", () => {
     it("should return the same number for numbers less than 1000", () => {
-        expect((0, formatLargeNumber_1.formatLargeNumber)(500)).toBe("500");
+        expect(formatLargeNumber(500)).toBe("500");
     });
     it("should format numbers in thousands correctly", () => {
-        expect((0, formatLargeNumber_1.formatLargeNumber)(1500, 1)).toBe("1.5K");
-        expect((0, formatLargeNumber_1.formatLargeNumber)(1500, 2)).toBe("1.50K");
+        expect(formatLargeNumber(1500, 1)).toBe("1.5K");
+        expect(formatLargeNumber(1500, 2)).toBe("1.50K");
     });
     it("should format numbers in millions correctly", () => {
-        expect((0, formatLargeNumber_1.formatLargeNumber)(1500000, 1)).toBe("1.5M");
-        expect((0, formatLargeNumber_1.formatLargeNumber)(1500000, 2)).toBe("1.50M");
+        expect(formatLargeNumber(1500000, 1)).toBe("1.5M");
+        expect(formatLargeNumber(1500000, 2)).toBe("1.50M");
     });
     it("should format numbers in billions correctly", () => {
-        expect((0, formatLargeNumber_1.formatLargeNumber)(1500000000, 1)).toBe("1.5B");
-        expect((0, formatLargeNumber_1.formatLargeNumber)(1500000000, 2)).toBe("1.50B");
+        expect(formatLargeNumber(1500000000, 1)).toBe("1.5B");
+        expect(formatLargeNumber(1500000000, 2)).toBe("1.50B");
     });
 });

package/dist/utils/hooks/index.js

@@ -1,20 +1,4 @@
-"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("./useColor"), exports);
-__exportStar(require("./useScreenDimensions"), exports);
-__exportStar(require("./useSpace"), exports);
-__exportStar(require("./useTheme"), exports);
+export * from "./useColor";
+export * from "./useScreenDimensions";
+export * from "./useSpace";
+export * from "./useTheme";