@artsy/palette-mobile 14.0.18 → 14.0.20
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/README.md
CHANGED
|
@@ -17,6 +17,12 @@ Palette is a collection of primitive, product-agnostic elements that help encaps
|
|
|
17
17
|
|
|
18
18
|
If the component applies to Artsy as a brand and can/will be used across multiple digital products, then Palette is a great place for it. If it's highly product specific then it's best to leave the component where it's used. We can always move things later!
|
|
19
19
|
|
|
20
|
+
## Looking for home view components?
|
|
21
|
+
|
|
22
|
+
The server-driven home view architecture launched in Eigen (Q4 2024) makes use of a standard library of home view section components.
|
|
23
|
+
|
|
24
|
+
Those components may make use of palette-mobile primitives, but they are not defined here. Instead they are defined [directly in Eigen](https://github.com/artsy/eigen/tree/main/src/app/Scenes/HomeView/Sections) and documented in [this Notion page](https://www.notion.so/artsy/Home-view-section-reference-150cab0764a0803fb00ed5dc3d860d1f).
|
|
25
|
+
|
|
20
26
|
If the above guidance still doesn't give you a good sense of what to do, please join the mobile practice meetings.
|
|
21
27
|
|
|
22
28
|
# How to install
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { isValidElement, useMemo } from "react";
|
|
3
|
+
import { Text as RNText } from "react-native";
|
|
3
4
|
import { LockIcon } from "../../svgs";
|
|
4
5
|
import { bullet } from "../../utils/text";
|
|
5
6
|
import { Avatar } from "../Avatar";
|
|
@@ -7,7 +8,7 @@ import { Flex } from "../Flex";
|
|
|
7
8
|
import { Text } from "../Text";
|
|
8
9
|
export const EntityHeader = ({ avatarSize = "xs", FollowButton, RightButton, imageUrl, initials, meta, name, smallVariant = false, displayPrivateIcon, theme = "light", ...restProps }) => {
|
|
9
10
|
const rightButton = (RightButton || FollowButton) && (_jsx(Flex, { ml: smallVariant ? 0.5 : 1, flexDirection: "row", alignItems: "center", justifyContent: "flex-end", children: RightButton || FollowButton }));
|
|
10
|
-
const headerName = (_jsxs(Flex, { flexDirection: "row", alignItems: "center", children: [_jsx(Text, { color: theme === "light" ? "black100" : "white100",
|
|
11
|
+
const headerName = (_jsxs(Flex, { flexDirection: "row", alignItems: "center", children: [_jsx(RNText, { ellipsizeMode: "tail", numberOfLines: 1, children: _jsx(Text, { color: theme === "light" ? "black100" : "white100", variant: "sm", lineHeight: "18px", style: { flexShrink: 1 }, children: name }) }), displayPrivateIcon && (_jsx(LockIcon, { ml: "2px", width: 16, height: 16, testID: "lock-icon", fill: theme === "light" ? "black100" : "white100" }))] }));
|
|
11
12
|
const headerMeta = useMemo(() => {
|
|
12
13
|
if (meta) {
|
|
13
14
|
if (isValidElement(meta)) {
|
package/package.json
CHANGED