@artsy/palette-mobile 23.14.0 → 24.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Theme.js +16 -11
- package/dist/animation/CssTransition.js +71 -26
- package/dist/animation/index.js +17 -1
- package/dist/constants.js +12 -8
- package/dist/elements/ArtsyKeyboardAvoidingView/ArtsyKeyboardAvoidingView.js +116 -69
- package/dist/elements/ArtsyKeyboardAvoidingView/index.js +17 -1
- package/dist/elements/Autocomplete/Autocomplete.js +32 -23
- package/dist/elements/Autocomplete/Autocomplete.tests.js +128 -56
- package/dist/elements/Autocomplete/index.js +17 -1
- package/dist/elements/Avatar/Avatar.js +20 -15
- package/dist/elements/Avatar/Avatar.stories.js +29 -15
- package/dist/elements/Avatar/Avatar.tests.js +12 -10
- package/dist/elements/Avatar/index.js +17 -1
- package/dist/elements/BackButton/BackButton.js +16 -9
- package/dist/elements/BackButton/BackButton.stories.js +12 -8
- package/dist/elements/BackButton/index.js +17 -1
- package/dist/elements/Banner/Banner.js +45 -18
- package/dist/elements/Banner/Banner.stories.js +12 -8
- package/dist/elements/Banner/index.js +17 -1
- package/dist/elements/BorderBox/BorderBox.js +16 -11
- package/dist/elements/BorderBox/index.js +17 -1
- package/dist/elements/Box/Box.js +16 -14
- package/dist/elements/Box/Box.stories.js +21 -15
- package/dist/elements/Box/index.js +17 -1
- package/dist/elements/Button/Button.js +85 -64
- package/dist/elements/Button/Button.stories.js +48 -23
- package/dist/elements/Button/CTAButton.js +18 -3
- package/dist/elements/Button/FollowButton.js +38 -11
- package/dist/elements/Button/LinkButton.js +19 -4
- package/dist/elements/Button/colors.js +7 -3
- package/dist/elements/Button/index.js +20 -4
- package/dist/elements/ButtonNew/Button.js +114 -49
- package/dist/elements/ButtonNew/Button.stories.js +64 -38
- package/dist/elements/ButtonNew/Button.tests.js +23 -21
- package/dist/elements/ButtonNew/CTAButton.js +18 -3
- package/dist/elements/ButtonNew/FollowButton.js +36 -9
- package/dist/elements/ButtonNew/LinkButton.js +19 -4
- package/dist/elements/ButtonNew/colors.js +7 -3
- package/dist/elements/ButtonNew/index.js +20 -4
- package/dist/elements/Checkbox/Check.js +83 -46
- package/dist/elements/Checkbox/Checkbox.js +83 -47
- package/dist/elements/Checkbox/Checkbox.stories.js +10 -9
- package/dist/elements/Checkbox/index.js +18 -2
- package/dist/elements/Chip/Chip.js +23 -18
- package/dist/elements/Chip/Chip.stories.js +12 -8
- package/dist/elements/Chip/index.js +17 -1
- package/dist/elements/ClassTheme/ClassTheme.js +10 -5
- package/dist/elements/ClassTheme/index.js +17 -1
- package/dist/elements/Collapse/Collapse.js +9 -4
- package/dist/elements/Collapse/Collapse.stories.js +13 -9
- package/dist/elements/Collapse/index.js +17 -1
- package/dist/elements/CollapsibleMenuItem/CollapsibleMenuItem.js +32 -27
- package/dist/elements/CollapsibleMenuItem/CollapsibleMenuItem.stories.js +62 -37
- package/dist/elements/CollapsibleMenuItem/index.js +17 -1
- package/dist/elements/Dialog/Dialog.js +52 -26
- package/dist/elements/Dialog/Dialog.stories.js +41 -22
- package/dist/elements/Dialog/Dialog.tests.js +33 -31
- package/dist/elements/Dialog/index.js +17 -1
- package/dist/elements/EntityHeader/EntityHeader.js +42 -15
- package/dist/elements/EntityHeader/EntityHeader.stories.js +26 -18
- package/dist/elements/EntityHeader/index.js +17 -1
- package/dist/elements/Flex/Flex.js +32 -4
- package/dist/elements/Flex/index.js +17 -1
- package/dist/elements/Header/ArtsyLogoHeader.js +15 -8
- package/dist/elements/Header/index.js +17 -1
- package/dist/elements/Histogram/Histogram.js +19 -14
- package/dist/elements/Histogram/index.js +17 -1
- package/dist/elements/Image/Image.js +60 -28
- package/dist/elements/Image/Image.stories.js +35 -23
- package/dist/elements/Image/__tests__/getImageURL.tests.js +10 -8
- package/dist/elements/Image/helpers/getImageURL.js +13 -8
- package/dist/elements/Image/index.js +17 -1
- package/dist/elements/Input/Input.js +216 -168
- package/dist/elements/Input/Input.stories.js +15 -11
- package/dist/elements/Input/Input.tests.js +85 -39
- package/dist/elements/Input/InputTitle.js +9 -4
- package/dist/elements/Input/helpers.js +35 -27
- package/dist/elements/Input/index.js +19 -3
- package/dist/elements/Input/maskValue.js +25 -9
- package/dist/elements/Input/maskValue.tests.js +19 -17
- package/dist/elements/Join/Join.js +14 -9
- package/dist/elements/Join/index.js +17 -1
- package/dist/elements/LazyFlatlist/LazyFlatlist.js +11 -8
- package/dist/elements/LazyFlatlist/index.js +18 -2
- package/dist/elements/LazyFlatlist/useHasSeenItem.js +19 -12
- package/dist/elements/LegacyScreen/LegacyScreen.js +124 -83
- package/dist/elements/LegacyScreen/index.js +17 -1
- package/dist/elements/LegacyTabs/ContentTabs.js +18 -12
- package/dist/elements/LegacyTabs/NavigationalTabs.js +21 -15
- package/dist/elements/LegacyTabs/StepTabs.js +25 -19
- package/dist/elements/LegacyTabs/Tab.js +31 -19
- package/dist/elements/LegacyTabs/TabBarContainer.js +48 -39
- package/dist/elements/LegacyTabs/index.js +38 -9
- package/dist/elements/List/BulletedItem.js +34 -7
- package/dist/elements/List/List.stories.js +12 -8
- package/dist/elements/List/index.js +17 -1
- package/dist/elements/MeasuredView/MeasuredView.js +18 -12
- package/dist/elements/MeasuredView/index.js +17 -1
- package/dist/elements/MenuItem/MenuItem.js +14 -9
- package/dist/elements/MenuItem/MenuItem.stories.js +9 -5
- package/dist/elements/MenuItem/index.js +17 -1
- package/dist/elements/Message/Message.js +35 -19
- package/dist/elements/Message/Message.stories.d.ts +1 -1
- package/dist/elements/Message/Message.stories.js +23 -17
- package/dist/elements/Message/Message.tests.js +38 -36
- package/dist/elements/Message/index.js +17 -1
- package/dist/elements/Pill/Pill.js +116 -138
- package/dist/elements/Pill/Pill.stories.js +28 -20
- package/dist/elements/Pill/Pill.tests.js +15 -13
- package/dist/elements/Pill/index.js +17 -1
- package/dist/elements/PopIn/PopIn.js +13 -8
- package/dist/elements/PopIn/index.js +17 -1
- package/dist/elements/Popover/Popover.js +45 -15
- package/dist/elements/Popover/Popover.stories.js +25 -19
- package/dist/elements/Popover/index.js +17 -1
- package/dist/elements/ProgressBar/ProgressBar.js +68 -23
- package/dist/elements/ProgressBar/ProgressBar.stories.js +11 -7
- package/dist/elements/ProgressBar/ProgressBar.tests.js +48 -23
- package/dist/elements/ProgressBar/index.js +17 -1
- package/dist/elements/Radio/RadioButton.js +80 -44
- package/dist/elements/Radio/RadioButton.stories.js +17 -13
- package/dist/elements/Radio/RadioDot.js +31 -15
- package/dist/elements/Radio/index.js +7 -2
- package/dist/elements/Screen/Background.js +10 -3
- package/dist/elements/Screen/Body.js +37 -10
- package/dist/elements/Screen/BottomView.js +17 -9
- package/dist/elements/Screen/FloatingHeader.js +36 -9
- package/dist/elements/Screen/FullWidthDivider.js +20 -5
- package/dist/elements/Screen/FullWidthItem.js +20 -5
- package/dist/elements/Screen/Header.js +79 -26
- package/dist/elements/Screen/Screen.stories.js +46 -30
- package/dist/elements/Screen/ScreenBase.js +39 -11
- package/dist/elements/Screen/ScreenFlatList.js +26 -9
- package/dist/elements/Screen/ScreenScrollContext.js +21 -15
- package/dist/elements/Screen/ScreenScrollView.js +27 -9
- package/dist/elements/Screen/StickySubHeader.js +62 -23
- package/dist/elements/Screen/constants.js +8 -5
- package/dist/elements/Screen/hooks/useListenForScreenScroll.js +13 -9
- package/dist/elements/Screen/hooks/useShowLargeTitle.js +19 -14
- package/dist/elements/Screen/hooks/useTitleStyles.js +14 -10
- package/dist/elements/Screen/index.js +48 -31
- package/dist/elements/SearchInput/RoundSearchInput.js +79 -46
- package/dist/elements/SearchInput/SearchInput.js +43 -14
- package/dist/elements/SearchInput/index.js +18 -2
- package/dist/elements/Separator/Separator.js +20 -12
- package/dist/elements/Separator/Separator.stories.js +10 -6
- package/dist/elements/Separator/ShadowSeparator.js +14 -7
- package/dist/elements/Separator/index.js +18 -2
- package/dist/elements/SimpleMessage/SimpleMessage.js +47 -11
- package/dist/elements/SimpleMessage/index.js +17 -1
- package/dist/elements/Skeleton/Skeleton.js +50 -19
- package/dist/elements/Skeleton/Skeleton.stories.js +14 -10
- package/dist/elements/Skeleton/index.js +17 -1
- package/dist/elements/Spacer/Spacer.js +32 -3
- package/dist/elements/Spacer/Spacer.stories.js +35 -19
- package/dist/elements/Spacer/index.js +17 -1
- package/dist/elements/Spinner/Spinner.js +62 -33
- package/dist/elements/Spinner/index.js +17 -1
- package/dist/elements/Switch/Switch.js +50 -17
- package/dist/elements/Switch/Switch.stories.js +31 -14
- package/dist/elements/Switch/index.js +17 -1
- package/dist/elements/Tabs/SubTabBar.js +29 -20
- package/dist/elements/Tabs/TabFlashList.js +24 -12
- package/dist/elements/Tabs/TabFlatList.js +24 -12
- package/dist/elements/Tabs/TabMasonry.js +24 -12
- package/dist/elements/Tabs/TabScrollView.js +27 -14
- package/dist/elements/Tabs/Tabs.js +27 -24
- package/dist/elements/Tabs/Tabs.stories.js +93 -46
- package/dist/elements/Tabs/TabsContainer.js +62 -38
- package/dist/elements/Tabs/TabsWithHeader.js +41 -13
- package/dist/elements/Tabs/hooks/useListenForTabContentScroll.js +13 -9
- package/dist/elements/Tabs/index.js +17 -1
- package/dist/elements/Text/LinkText.js +32 -3
- package/dist/elements/Text/Text.js +61 -23
- package/dist/elements/Text/Text.stories.js +37 -28
- package/dist/elements/Text/Text.tests.js +7 -5
- package/dist/elements/Text/helpers.js +13 -7
- package/dist/elements/Text/index.js +19 -3
- package/dist/elements/ToolTip/ToolTip.js +67 -53
- package/dist/elements/ToolTip/ToolTip.stories.js +21 -14
- package/dist/elements/ToolTip/ToolTip.tests.js +15 -13
- package/dist/elements/ToolTip/ToolTipFlyout.js +68 -28
- package/dist/elements/ToolTip/index.js +17 -1
- package/dist/elements/Touchable/Touchable.js +41 -13
- package/dist/elements/Touchable/Touchable.stories.js +13 -9
- package/dist/elements/Touchable/TouchableHighlightColor.js +38 -12
- package/dist/elements/Touchable/TouchableWithScale.js +38 -11
- package/dist/elements/Touchable/index.js +19 -3
- package/dist/elements/VisualClue/VisualClue.stories.js +11 -7
- package/dist/elements/VisualClue/VisualClueDot.js +24 -14
- package/dist/elements/VisualClue/VisualClueText.js +26 -15
- package/dist/elements/VisualClue/index.js +18 -2
- package/dist/elements/index.js +62 -46
- package/dist/index.js +24 -8
- package/dist/setupJest.js +11 -6
- package/dist/storybook/decorators.js +36 -27
- package/dist/storybook/helpers.js +40 -22
- package/dist/tokens.js +28 -67
- package/dist/types.js +10 -5
- package/dist/utils/Wrap.js +16 -8
- package/dist/utils/colors.stories.js +31 -25
- package/dist/utils/createGeminiUrl.js +28 -22
- package/dist/utils/flattenChildren.js +20 -7
- package/dist/utils/formatLargeNumber.js +8 -4
- package/dist/utils/formatLargeNumbers.tests.js +15 -13
- package/dist/utils/hooks/index.js +20 -4
- package/dist/utils/hooks/useColor.js +6 -2
- package/dist/utils/hooks/useMeasure.js +40 -14
- package/dist/utils/hooks/useScreenDimensions.js +31 -20
- package/dist/utils/hooks/useSpace.js +6 -2
- package/dist/utils/hooks/useTheme.js +31 -23
- package/dist/utils/normalizeText.js +11 -6
- package/dist/utils/space.stories.js +15 -10
- package/dist/utils/tests/flattenChildren.tests.js +8 -6
- package/dist/utils/tests/isTestEnvironment.js +5 -1
- package/dist/utils/tests/renderWithWrappers.js +15 -7
- package/dist/utils/text.js +13 -9
- package/dist/utils/types.js +2 -0
- package/dist/utils/webTokensToMobile.js +16 -10
- package/package.json +30 -36
|
@@ -1,36 +1,42 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.imageAlreadyResized = void 0;
|
|
4
|
+
exports.createGeminiUrl = createGeminiUrl;
|
|
5
|
+
var react_native_1 = require("react-native");
|
|
6
|
+
var geminiHosts = [
|
|
3
7
|
"https://d7hftxdivxxvm.cloudfront.net",
|
|
4
8
|
"https://d196wkiy8qx2u5.cloudfront.net",
|
|
5
9
|
];
|
|
6
|
-
|
|
7
|
-
return geminiHosts.some((host)
|
|
10
|
+
var imageAlreadyResized = function (imageURL) {
|
|
11
|
+
return geminiHosts.some(function (host) { return imageURL.includes(host); });
|
|
8
12
|
};
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
13
|
+
exports.imageAlreadyResized = imageAlreadyResized;
|
|
14
|
+
function createGeminiUrl(_a) {
|
|
15
|
+
var imageURL = _a.imageURL, width = _a.width, height = _a.height, _b = _a.geminiHost, geminiHost = _b === void 0 ? "d7hftxdivxxvm.cloudfront.net" : _b, _c = _a.imageQuality, imageQuality = _c === void 0 ? 80 : _c, _d = _a.resizeMode, resizeMode = _d === void 0 ? "fill" : _d;
|
|
16
|
+
if ((0, exports.imageAlreadyResized)(imageURL)) {
|
|
17
|
+
console.error("Image: `performResize` on self referential url. Avoid resizing gemini urls. Pass performResize={false} to fix this.", { imageURL: imageURL });
|
|
12
18
|
}
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
19
|
+
var src = encodeURIComponent(imageURL);
|
|
20
|
+
var roundedHeight = Math.round(height);
|
|
21
|
+
var roundedWidth = Math.round(width);
|
|
22
|
+
var params = [
|
|
23
|
+
"height=".concat(roundedHeight),
|
|
24
|
+
"quality=".concat(imageQuality),
|
|
25
|
+
"resize_to=".concat(resizeMode),
|
|
26
|
+
"src=".concat(src),
|
|
27
|
+
"width=".concat(roundedWidth),
|
|
22
28
|
];
|
|
23
|
-
if (Platform.OS === "android" || (Platform.OS === "ios" && osMajorVersion() >= 14)) {
|
|
29
|
+
if (react_native_1.Platform.OS === "android" || (react_native_1.Platform.OS === "ios" && osMajorVersion() >= 14)) {
|
|
24
30
|
params.push("convert_to=webp");
|
|
25
31
|
}
|
|
26
|
-
return
|
|
32
|
+
return "https://".concat(geminiHost, "/?").concat(params.join("&"));
|
|
27
33
|
}
|
|
28
|
-
|
|
34
|
+
var osMajorVersion = function () {
|
|
29
35
|
// eslint-disable-next-line no-constant-condition
|
|
30
|
-
if (typeof (Platform.Version === "string")) {
|
|
31
|
-
return parseInt(Platform.Version, 10);
|
|
36
|
+
if (typeof (react_native_1.Platform.Version === "string")) {
|
|
37
|
+
return parseInt(react_native_1.Platform.Version, 10);
|
|
32
38
|
}
|
|
33
39
|
else {
|
|
34
|
-
return Platform.Version;
|
|
40
|
+
return react_native_1.Platform.Version;
|
|
35
41
|
}
|
|
36
42
|
};
|
|
@@ -1,13 +1,26 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
3
|
+
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
4
|
+
if (ar || !(i in from)) {
|
|
5
|
+
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
6
|
+
ar[i] = from[i];
|
|
7
|
+
}
|
|
8
|
+
}
|
|
9
|
+
return to.concat(ar || Array.prototype.slice.call(from));
|
|
10
|
+
};
|
|
11
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
+
exports.flattenChildren = void 0;
|
|
13
|
+
var react_1 = require("react");
|
|
2
14
|
/**
|
|
3
15
|
* Convert a fragment or nested fragment into an array of elements.
|
|
4
16
|
*/
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
return xs.reduce((acc, child)
|
|
8
|
-
if (child.type === Fragment) {
|
|
9
|
-
return [
|
|
17
|
+
var flattenChildren = function (children) {
|
|
18
|
+
var xs = react_1.Children.toArray(children).filter(react_1.isValidElement);
|
|
19
|
+
return xs.reduce(function (acc, child) {
|
|
20
|
+
if (child.type === react_1.Fragment) {
|
|
21
|
+
return __spreadArray(__spreadArray([], acc, true), (0, exports.flattenChildren)(child.props.children), true);
|
|
10
22
|
}
|
|
11
|
-
return [
|
|
23
|
+
return __spreadArray(__spreadArray([], acc, true), [child], false);
|
|
12
24
|
}, []);
|
|
13
25
|
};
|
|
26
|
+
exports.flattenChildren = flattenChildren;
|
|
@@ -1,14 +1,18 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.formatLargeNumber = formatLargeNumber;
|
|
4
|
+
function formatLargeNumber(number, decimalPlaces) {
|
|
5
|
+
if (decimalPlaces === void 0) { decimalPlaces = 0; }
|
|
2
6
|
if (number < 1000) {
|
|
3
7
|
return number.toString();
|
|
4
8
|
}
|
|
5
9
|
else if (number < 1000000) {
|
|
6
|
-
return
|
|
10
|
+
return "".concat((number / 1000).toFixed(decimalPlaces), "K");
|
|
7
11
|
}
|
|
8
12
|
else if (number < 1000000000) {
|
|
9
|
-
return
|
|
13
|
+
return "".concat((number / 1000000).toFixed(decimalPlaces), "M");
|
|
10
14
|
}
|
|
11
15
|
else {
|
|
12
|
-
return
|
|
16
|
+
return "".concat((number / 1000000000).toFixed(decimalPlaces), "B");
|
|
13
17
|
}
|
|
14
18
|
}
|
|
@@ -1,18 +1,20 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
var formatLargeNumber_1 = require("./formatLargeNumber");
|
|
4
|
+
describe("formatLargeNumber", function () {
|
|
5
|
+
it("should return the same number for numbers less than 1000", function () {
|
|
6
|
+
expect((0, formatLargeNumber_1.formatLargeNumber)(500)).toBe("500");
|
|
5
7
|
});
|
|
6
|
-
it("should format numbers in thousands correctly", ()
|
|
7
|
-
expect(formatLargeNumber(1500, 1)).toBe("1.5K");
|
|
8
|
-
expect(formatLargeNumber(1500, 2)).toBe("1.50K");
|
|
8
|
+
it("should format numbers in thousands correctly", function () {
|
|
9
|
+
expect((0, formatLargeNumber_1.formatLargeNumber)(1500, 1)).toBe("1.5K");
|
|
10
|
+
expect((0, formatLargeNumber_1.formatLargeNumber)(1500, 2)).toBe("1.50K");
|
|
9
11
|
});
|
|
10
|
-
it("should format numbers in millions correctly", ()
|
|
11
|
-
expect(formatLargeNumber(1500000, 1)).toBe("1.5M");
|
|
12
|
-
expect(formatLargeNumber(1500000, 2)).toBe("1.50M");
|
|
12
|
+
it("should format numbers in millions correctly", function () {
|
|
13
|
+
expect((0, formatLargeNumber_1.formatLargeNumber)(1500000, 1)).toBe("1.5M");
|
|
14
|
+
expect((0, formatLargeNumber_1.formatLargeNumber)(1500000, 2)).toBe("1.50M");
|
|
13
15
|
});
|
|
14
|
-
it("should format numbers in billions correctly", ()
|
|
15
|
-
expect(formatLargeNumber(1500000000, 1)).toBe("1.5B");
|
|
16
|
-
expect(formatLargeNumber(1500000000, 2)).toBe("1.50B");
|
|
16
|
+
it("should format numbers in billions correctly", function () {
|
|
17
|
+
expect((0, formatLargeNumber_1.formatLargeNumber)(1500000000, 1)).toBe("1.5B");
|
|
18
|
+
expect((0, formatLargeNumber_1.formatLargeNumber)(1500000000, 2)).toBe("1.50B");
|
|
17
19
|
});
|
|
18
20
|
});
|
|
@@ -1,4 +1,20 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
14
|
+
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
|
+
};
|
|
16
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
+
__exportStar(require("./useColor"), exports);
|
|
18
|
+
__exportStar(require("./useScreenDimensions"), exports);
|
|
19
|
+
__exportStar(require("./useSpace"), exports);
|
|
20
|
+
__exportStar(require("./useTheme"), exports);
|
|
@@ -1,2 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.useColor = void 0;
|
|
4
|
+
var useTheme_1 = require("./useTheme");
|
|
5
|
+
var useColor = function () { return (0, useTheme_1.useTheme)().color; };
|
|
6
|
+
exports.useColor = useColor;
|
|
@@ -1,24 +1,50 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
14
|
+
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
15
|
+
if (ar || !(i in from)) {
|
|
16
|
+
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
17
|
+
ar[i] = from[i];
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
return to.concat(ar || Array.prototype.slice.call(from));
|
|
21
|
+
};
|
|
22
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
23
|
+
exports.useMeasure = void 0;
|
|
24
|
+
var react_1 = require("react");
|
|
2
25
|
/*
|
|
3
26
|
useMeasure is a hook that measures the position of a ref element
|
|
4
27
|
and returns the x, y, width, height, pageX, pageY of the element
|
|
5
28
|
*/
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
29
|
+
var useMeasure = function (_a) {
|
|
30
|
+
var ref = _a.ref, _b = _a.extraDeps, extraDeps = _b === void 0 ? [] : _b;
|
|
31
|
+
var _c = (0, react_1.useState)(null), position = _c[0], setPosition = _c[1];
|
|
32
|
+
(0, react_1.useEffect)(function () {
|
|
33
|
+
var _a;
|
|
34
|
+
(_a = ref.current) === null || _a === void 0 ? void 0 : _a.measure(function (x, y, width, height, pageX, pageY) {
|
|
10
35
|
setPosition({
|
|
11
|
-
x,
|
|
12
|
-
y,
|
|
13
|
-
width,
|
|
14
|
-
height,
|
|
15
|
-
pageX,
|
|
16
|
-
pageY,
|
|
36
|
+
x: x,
|
|
37
|
+
y: y,
|
|
38
|
+
width: width,
|
|
39
|
+
height: height,
|
|
40
|
+
pageX: pageX,
|
|
41
|
+
pageY: pageY,
|
|
17
42
|
});
|
|
18
|
-
}, ()
|
|
43
|
+
}, function () {
|
|
19
44
|
console.error("measurement failed");
|
|
20
45
|
});
|
|
21
46
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
22
|
-
}, [JSON.stringify(position), ref,
|
|
23
|
-
return {
|
|
47
|
+
}, __spreadArray([JSON.stringify(position), ref], extraDeps, true));
|
|
48
|
+
return __assign({}, position);
|
|
24
49
|
};
|
|
50
|
+
exports.useMeasure = useMeasure;
|
|
@@ -1,24 +1,35 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
return (
|
|
12
|
-
...dimensions,
|
|
13
|
-
safeAreaInsets,
|
|
14
|
-
orientation,
|
|
15
|
-
size,
|
|
16
|
-
isSmallScreen,
|
|
17
|
-
}, children: children }));
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
18
12
|
};
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
13
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
14
|
+
exports.ScreenDimensionsProvider = void 0;
|
|
15
|
+
exports.useScreenDimensions = useScreenDimensions;
|
|
16
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
17
|
+
var react_1 = require("react");
|
|
18
|
+
var react_native_1 = require("react-native");
|
|
19
|
+
var react_native_safe_area_context_1 = require("react-native-safe-area-context");
|
|
20
|
+
var ScreenDimensionsProvider = function (_a) {
|
|
21
|
+
var children = _a.children;
|
|
22
|
+
var safeAreaInsets = (0, react_native_safe_area_context_1.useSafeAreaInsets)();
|
|
23
|
+
var dimensions = (0, react_native_1.useWindowDimensions)();
|
|
24
|
+
var orientation = dimensions.width > dimensions.height ? "landscape" : "portrait";
|
|
25
|
+
var size = dimensions.height < 667 ? "small" : dimensions.height <= 812 ? "standard" : "large";
|
|
26
|
+
var isSmallScreen = size === "small";
|
|
27
|
+
return ((0, jsx_runtime_1.jsx)(ScreenDimensionsContext.Provider, { value: __assign(__assign({}, dimensions), { safeAreaInsets: safeAreaInsets, orientation: orientation, size: size, isSmallScreen: isSmallScreen }), children: children }));
|
|
28
|
+
};
|
|
29
|
+
exports.ScreenDimensionsProvider = ScreenDimensionsProvider;
|
|
30
|
+
var ScreenDimensionsContext = (0, react_1.createContext)(null);
|
|
31
|
+
function useScreenDimensions() {
|
|
32
|
+
var context = (0, react_1.useContext)(ScreenDimensionsContext);
|
|
22
33
|
if (!context) {
|
|
23
34
|
throw new Error("useScreenDimensions must be used within a ScreenDimensionsProvider");
|
|
24
35
|
}
|
|
@@ -1,2 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.useSpace = void 0;
|
|
4
|
+
var useTheme_1 = require("./useTheme");
|
|
5
|
+
var useSpace = function () { return (0, useTheme_1.useTheme)().space; };
|
|
6
|
+
exports.useSpace = useSpace;
|
|
@@ -1,36 +1,44 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.useTheme = void 0;
|
|
4
|
+
var react_1 = require("react");
|
|
5
|
+
var native_1 = require("styled-components/native");
|
|
6
|
+
var tokens_1 = require("../../tokens");
|
|
7
|
+
var isTestEnvironment_1 = require("../tests/isTestEnvironment");
|
|
8
|
+
var useTheme = function () {
|
|
9
|
+
var maybeTheme = (0, react_1.useContext)(native_1.ThemeContext);
|
|
7
10
|
// if we are not wrapped in `<Theme>`, if we dev, throw error.
|
|
8
11
|
// if we are in prod, we will default to v2 to avoid a crash.
|
|
9
12
|
// if we are wrapped, then all good.
|
|
10
|
-
if ((__DEV__ || isTestEnvironment()) && maybeTheme === undefined) {
|
|
13
|
+
if ((__DEV__ || (0, isTestEnvironment_1.isTestEnvironment)()) && maybeTheme === undefined) {
|
|
11
14
|
console.error("You are trying to use the `Theme` context but you have not wrapped your component/screen with `<Theme>`. Please wrap and try again.");
|
|
12
15
|
throw new Error("ThemeContext is not defined. Wrap your component with `<Theme>` and try again.");
|
|
13
16
|
}
|
|
14
|
-
|
|
15
|
-
|
|
17
|
+
var defaultTheme = tokens_1.THEMES.v3light;
|
|
18
|
+
var theme = maybeTheme !== null && maybeTheme !== void 0 ? maybeTheme : defaultTheme;
|
|
16
19
|
return {
|
|
17
|
-
theme,
|
|
20
|
+
theme: theme,
|
|
18
21
|
space: space(theme),
|
|
19
22
|
color: color(theme),
|
|
20
23
|
};
|
|
21
24
|
};
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
return
|
|
25
|
+
exports.useTheme = useTheme;
|
|
26
|
+
var space = function (theme) {
|
|
27
|
+
return function (spaceName) {
|
|
28
|
+
var pixelValue = theme.space[spaceName];
|
|
29
|
+
return Number(pixelValue.split("px")[0]);
|
|
30
|
+
};
|
|
25
31
|
};
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
32
|
+
var color = function (theme) {
|
|
33
|
+
return function (colorName) {
|
|
34
|
+
if (colorName === undefined) {
|
|
35
|
+
return undefined;
|
|
36
|
+
}
|
|
37
|
+
var themeColor = theme.colors[colorName];
|
|
38
|
+
// return the color that was passed if it's not supported by the theme (e.g., for a theme-independent `white`).
|
|
39
|
+
if (!themeColor) {
|
|
40
|
+
return colorName;
|
|
41
|
+
}
|
|
42
|
+
return themeColor;
|
|
43
|
+
};
|
|
36
44
|
};
|
|
@@ -1,3 +1,6 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.normalizeText = normalizeText;
|
|
1
4
|
/*
|
|
2
5
|
Licensed under the Apache License, Version 2.0 (the "License");
|
|
3
6
|
you may not use this file except in compliance with the License.
|
|
@@ -14,7 +17,7 @@
|
|
|
14
17
|
THIS CODE TAKEN FROM
|
|
15
18
|
https://stackoverflow.com/a/18391901
|
|
16
19
|
*/
|
|
17
|
-
|
|
20
|
+
var defaultDiacriticsRemovalMap = [
|
|
18
21
|
{
|
|
19
22
|
base: "A",
|
|
20
23
|
letters: "\u0041\u24B6\uFF21\u00C0\u00C1\u00C2\u1EA6\u1EA4\u1EAA\u1EA8\u00C3\u0100\u0102\u1EB0\u1EAE\u1EB4\u1EB2\u0226\u01E0\u00C4\u01DE\u1EA2\u00C5\u01FA\u01CD\u0200\u0202\u1EA0\u1EAC\u1EB6\u1E00\u0104\u023A\u2C6F",
|
|
@@ -204,14 +207,16 @@ const defaultDiacriticsRemovalMap = [
|
|
|
204
207
|
letters: "\u007A\u24E9\uFF5A\u017A\u1E91\u017C\u017E\u1E93\u1E95\u01B6\u0225\u0240\u2C6C\uA763",
|
|
205
208
|
},
|
|
206
209
|
];
|
|
207
|
-
|
|
208
|
-
for (
|
|
209
|
-
|
|
210
|
+
var diacriticsMap = {};
|
|
211
|
+
for (var _i = 0, defaultDiacriticsRemovalMap_1 = defaultDiacriticsRemovalMap; _i < defaultDiacriticsRemovalMap_1.length; _i++) {
|
|
212
|
+
var _a = defaultDiacriticsRemovalMap_1[_i], letters = _a.letters, base = _a.base;
|
|
213
|
+
for (var _b = 0, letters_1 = letters; _b < letters_1.length; _b++) {
|
|
214
|
+
var letter = letters_1[_b];
|
|
210
215
|
diacriticsMap[letter] = base;
|
|
211
216
|
}
|
|
212
217
|
}
|
|
213
218
|
// "what?" version ... http://jsperf.com/diacritics/12
|
|
214
|
-
|
|
219
|
+
function normalizeText(text) {
|
|
215
220
|
return (text
|
|
216
221
|
.trim()
|
|
217
222
|
.toLocaleLowerCase()
|
|
@@ -220,7 +225,7 @@ export function normalizeText(text) {
|
|
|
220
225
|
.normalize("NFD")
|
|
221
226
|
.replace(/[\u0300-\u036f]/g, "")
|
|
222
227
|
// handle other edge cases like ø
|
|
223
|
-
.replace(/[^\u0000-\u007E]/g, (a)
|
|
228
|
+
.replace(/[^\u0000-\u007E]/g, function (a) {
|
|
224
229
|
return diacriticsMap[a] || a;
|
|
225
230
|
})
|
|
226
231
|
// remove punctuation https://stackoverflow.com/a/25575009
|
|
@@ -1,13 +1,18 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.SpacingUnits = void 0;
|
|
4
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
+
var hooks_1 = require("./hooks");
|
|
6
|
+
var text_1 = require("./text");
|
|
7
|
+
var elements_1 = require("../elements");
|
|
8
|
+
var helpers_1 = require("../storybook/helpers");
|
|
9
|
+
var SpaceLine = function (_a) {
|
|
10
|
+
var theSpace = _a.space;
|
|
11
|
+
var space = (0, hooks_1.useSpace)();
|
|
12
|
+
return ((0, jsx_runtime_1.jsxs)(elements_1.Box, { children: [(0, jsx_runtime_1.jsx)(elements_1.Box, { width: space(theSpace), borderBottomWidth: 1, borderColor: "black", marginBottom: "4px" }), (0, jsx_runtime_1.jsx)(elements_1.Text, { color: "black", children: "".concat(theSpace, " ").concat(text_1.bullet, " ").concat(space(theSpace), "px") })] }));
|
|
9
13
|
};
|
|
10
|
-
|
|
14
|
+
exports.default = {
|
|
11
15
|
title: "space",
|
|
12
16
|
};
|
|
13
|
-
|
|
17
|
+
var SpacingUnits = function () { return ((0, jsx_runtime_1.jsxs)(helpers_1.List, { style: { marginLeft: 50 }, contentContainerStyle: { alignItems: "flex-start" }, children: [(0, jsx_runtime_1.jsx)(SpaceLine, { space: 0.5 }), (0, jsx_runtime_1.jsx)(SpaceLine, { space: 1 }), (0, jsx_runtime_1.jsx)(SpaceLine, { space: 2 }), (0, jsx_runtime_1.jsx)(SpaceLine, { space: 4 }), (0, jsx_runtime_1.jsx)(SpaceLine, { space: 6 }), (0, jsx_runtime_1.jsx)(SpaceLine, { space: 12 })] })); };
|
|
18
|
+
exports.SpacingUnits = SpacingUnits;
|
|
@@ -1,9 +1,11 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
4
|
+
var react_native_1 = require("react-native");
|
|
5
|
+
var flattenChildren_1 = require("../flattenChildren");
|
|
6
|
+
describe("flattenChildren", function () {
|
|
7
|
+
it("flattens the children", function () {
|
|
8
|
+
var flattened = (0, flattenChildren_1.flattenChildren)((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_native_1.View, { children: "one" }), (0, jsx_runtime_1.jsx)(react_native_1.View, { children: "two" }), (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_native_1.View, { children: "three" }), (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(react_native_1.View, { children: "four" }) })] })] }));
|
|
7
9
|
expect(flattened).toHaveLength(4);
|
|
8
10
|
});
|
|
9
11
|
});
|
|
@@ -1,3 +1,7 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.isTestEnvironment = void 0;
|
|
4
|
+
var isTestEnvironment = function () {
|
|
2
5
|
return !!process.env.JEST_WORKER_ID;
|
|
3
6
|
};
|
|
7
|
+
exports.isTestEnvironment = isTestEnvironment;
|
|
@@ -1,15 +1,18 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.Providers = exports.renderWithWrappers = void 0;
|
|
4
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
+
var react_native_1 = require("@testing-library/react-native");
|
|
6
|
+
var react_native_safe_area_context_1 = require("react-native-safe-area-context");
|
|
7
|
+
var Theme_1 = require("../../Theme");
|
|
5
8
|
/**
|
|
6
9
|
* Renders a React Component with our page wrappers
|
|
7
10
|
* by using @testing-library/react-native
|
|
8
11
|
* @param component
|
|
9
12
|
*/
|
|
10
|
-
|
|
13
|
+
var renderWithWrappers = function (component) {
|
|
11
14
|
try {
|
|
12
|
-
return render(component, { wrapper: Providers });
|
|
15
|
+
return (0, react_native_1.render)(component, { wrapper: exports.Providers });
|
|
13
16
|
}
|
|
14
17
|
catch (error) {
|
|
15
18
|
if (error instanceof Error) {
|
|
@@ -17,4 +20,9 @@ export const renderWithWrappers = (component) => {
|
|
|
17
20
|
}
|
|
18
21
|
}
|
|
19
22
|
};
|
|
20
|
-
|
|
23
|
+
exports.renderWithWrappers = renderWithWrappers;
|
|
24
|
+
var Providers = function (_a) {
|
|
25
|
+
var children = _a.children;
|
|
26
|
+
return ((0, jsx_runtime_1.jsx)(react_native_safe_area_context_1.SafeAreaProvider, { children: (0, jsx_runtime_1.jsx)(Theme_1.Theme, { children: children }) }));
|
|
27
|
+
};
|
|
28
|
+
exports.Providers = Providers;
|
package/dist/utils/text.js
CHANGED
|
@@ -1,3 +1,6 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.range = exports.comma = exports.apostrophe = exports.quoteRight = exports.quoteLeft = exports.nbsp = exports.bullet = exports.emdash = exports.endash = void 0;
|
|
1
4
|
/**
|
|
2
5
|
* The endash is used in ranges like `$10k – $20k`.
|
|
3
6
|
* This export makes it easier to use in the code, without having to find
|
|
@@ -5,15 +8,16 @@
|
|
|
5
8
|
* It is a different character to the regular minus, usually a bit longer.
|
|
6
9
|
* (for reference: minus `-`, endash `–`)
|
|
7
10
|
*/
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
11
|
+
exports.endash = "–";
|
|
12
|
+
exports.emdash = "—";
|
|
13
|
+
exports.bullet = "•";
|
|
14
|
+
exports.nbsp = String.fromCharCode(160);
|
|
15
|
+
exports.quoteLeft = "“";
|
|
16
|
+
exports.quoteRight = "”";
|
|
17
|
+
exports.apostrophe = "’";
|
|
18
|
+
exports.comma = ",";
|
|
16
19
|
/**
|
|
17
20
|
* A helper func to create a range string out of two strings, by putting an endash between them.
|
|
18
21
|
*/
|
|
19
|
-
|
|
22
|
+
var range = function (left, right) { return "".concat(left, " ").concat(exports.endash, " ").concat(right); };
|
|
23
|
+
exports.range = range;
|
package/dist/utils/types.js
CHANGED