@tamagui/list-item 1.0.1-beta.94 → 1.0.1-beta.95

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.
Files changed (9) hide show
  1. package/dist/cjs/ListItem.js +9 -1
  2. package/dist/cjs/ListItem.js.map +2 -2
  3. package/dist/esm/ListItem.js +9 -1
  4. package/dist/esm/ListItem.js.map +2 -2
  5. package/dist/jsx/ListItem.js +9 -1
  6. package/dist/jsx/ListItem.js.map +2 -2
  7. package/package.json +5 -5
  8. package/src/ListItem.tsx +10 -1
  9. package/types/ListItem.d.ts.map +1 -1
package/dist/cjs/ListItem.js CHANGED
@@ -97,6 +97,7 @@ const ListItemFrame = (0, import_core.styled)(import_stacks.ThemeableStack, {
97
97
  }
98
98
  });
99
99
  const ListItemText = (0, import_core.styled)(import_text.SizableText, {
100
+ name: "ListItemText",
100
101
  color: "$color",
101
102
  selectable: false,
102
103
  flexGrow: 1,
@@ -104,11 +105,18 @@ const ListItemText = (0, import_core.styled)(import_text.SizableText, {
104
105
  ellipse: true
105
106
  });
106
107
  const ListItemSubtitle = (0, import_core.styled)(ListItemText, {
108
+ name: "ListItemSubtitle",
107
109
  color: "$colorPress",
108
110
  marginTop: "$-2",
109
111
  opacity: 0.65,
112
+ ellipse: true,
113
+ maxWidth: "100%",
110
114
  size: "$3"
111
115
  });
116
+ const ListItemTitle = (0, import_core.styled)(ListItemText, {
117
+ name: "ListItemTitle",
118
+ ellipse: true
119
+ });
112
120
  const ListItemComponent = (0, import_react.forwardRef)((props, ref) => {
113
121
  const _a = props, {
114
122
  children,
@@ -164,7 +172,7 @@ const ListItemComponent = (0, import_react.forwardRef)((props, ref) => {
164
172
  size: spaceSize
165
173
  })) : null, Boolean(title || subTitle) ? /* @__PURE__ */ import_react.default.createElement(import_stacks.YStack, {
166
174
  flex: 1
167
- }, /* @__PURE__ */ import_react.default.createElement(ListItemText, null, title), subTitle ? typeof subTitle === "string" ? /* @__PURE__ */ import_react.default.createElement(ListItemSubtitle, {
175
+ }, /* @__PURE__ */ import_react.default.createElement(ListItemTitle, null, title), subTitle ? typeof subTitle === "string" ? /* @__PURE__ */ import_react.default.createElement(ListItemSubtitle, {
168
176
  size: subtitleSize
169
177
  }, subTitle) : subTitle : null, contents) : contents, themedIconAfter ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_core.Spacer, {
170
178
  flex: true,
package/dist/cjs/ListItem.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/ListItem.tsx"],
4
- "sourcesContent": ["import {\n FontSizeTokens,\n GetProps,\n Spacer,\n TamaguiComponent,\n ThemeableProps,\n getSize,\n getVariableValue,\n styled,\n themeable,\n withStaticProperties,\n} from '@tamagui/core'\nimport { getFontSize } from '@tamagui/font-size'\nimport { TextParentStyles, useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { ThemeableStack, YStack } from '@tamagui/stacks'\nimport { SizableText, wrapChildrenInText } from '@tamagui/text'\nimport React, { FunctionComponent, forwardRef } from 'react'\nimport { View } from 'react-native'\n\n// bugfix esbuild strips react jsx: 'preserve'\nReact['createElement']\n\ntype ListItemIconProps = { color?: string; size?: number }\ntype IconProp = JSX.Element | FunctionComponent<ListItemIconProps> | null\n\nexport type ListItemProps = Omit<TextParentStyles, 'TextComponent'> &\n GetProps<typeof ListItemFrame> &\n ThemeableProps & {\n // add icon before, passes color and size automatically if Component\n icon?: IconProp\n // add icon after, passes color and size automatically if Component\n iconAfter?: IconProp\n // adjust icon relative to size\n // default: -1\n scaleIcon?: number\n // make the spacing elements flex\n spaceFlex?: number | boolean\n // adjust internal space relative to icon size\n scaleSpace?: number\n // title\n title?: React.ReactNode\n // subtitle\n subTitle?: React.ReactNode\n }\n\nexport const ListItemFrame = styled(ThemeableStack, {\n name: 'ListItem',\n tag: 'li',\n alignItems: 'center',\n flexWrap: 'nowrap',\n width: '100%',\n borderColor: '$borderColor',\n maxWidth: '100%',\n overflow: 'hidden',\n flexDirection: 'row',\n\n variants: {\n size: {\n '...size': (val, { tokens }) => {\n return {\n minHeight: tokens.size[val],\n paddingHorizontal: tokens.space[val],\n }\n },\n },\n\n active: {\n true: {\n hoverStyle: {\n backgroundColor: '$background',\n },\n },\n },\n\n disabled: {\n true: {\n opacity: 0.5,\n // TODO breaking types\n pointerEvents: 'none' as any,\n },\n },\n },\n\n defaultVariants: {\n size: '$4',\n },\n})\n\nexport const ListItemText = styled(SizableText, {\n color: '$color',\n selectable: false,\n flexGrow: 1,\n flexShrink: 1,\n ellipse: true,\n})\n\nexport const ListItemSubtitle = styled(ListItemText, {\n color: '$colorPress',\n marginTop: '$-2',\n opacity: 0.65,\n size: '$3',\n})\n\nconst ListItemComponent = forwardRef((props: ListItemProps, ref) => {\n // careful not to desctructure and re-order props, order is important\n const {\n children,\n icon,\n iconAfter,\n noTextWrap,\n theme: themeName,\n space,\n spaceFlex,\n scaleIcon = 1,\n scaleSpace = 1,\n subTitle,\n\n // text props\n color,\n fontWeight,\n letterSpacing,\n fontSize,\n fontFamily,\n textAlign,\n textProps,\n title,\n ...rest\n } = props as ListItemProps\n\n const size = props.size || '$4'\n const subtitleSizeToken = getSize(size, -3)\n const subtitleSize = `$${subtitleSizeToken.key}` as FontSizeTokens\n const iconSize = getFontSize(size) * scaleIcon\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color })\n const [themedIcon, themedIconAfter] = [icon, iconAfter].map(getThemedIcon)\n const spaceSize = getVariableValue(iconSize) * scaleSpace\n const contents = wrapChildrenInText(ListItemText, props)\n\n return (\n <ListItemFrame fontFamily={fontFamily} ref={ref as any} {...rest}>\n {themedIcon ? (\n <>\n {themedIcon}\n <Spacer size={spaceSize} />\n </>\n ) : null}\n {/* helper for common title/subtitle pttern */}\n {Boolean(title || subTitle) ? (\n <YStack flex={1}>\n <ListItemText>{title}</ListItemText>\n {subTitle ? (\n typeof subTitle === 'string' ? (\n // TODO can use theme but we need to standardize to alt themes\n // or standardize on subtle colors in themes\n <ListItemSubtitle size={subtitleSize}>{subTitle}</ListItemSubtitle>\n ) : (\n subTitle\n )\n ) : null}\n {contents}\n </YStack>\n ) : (\n contents\n )}\n {themedIconAfter ? (\n <>\n <Spacer flex size={spaceSize} />\n {themedIconAfter}\n </>\n ) : null}\n </ListItemFrame>\n )\n})\n\nconst ListItemInner: TamaguiComponent<ListItemProps, HTMLLIElement | View> =\n ListItemFrame.extractable(themeable(ListItemComponent as any) as any, {\n inlineProps: new Set([\n // text props go here (can't really optimize them, but we never fully extract listItem anyway)\n 'color',\n 'fontWeight',\n 'fontSize',\n 'fontFamily',\n 'letterSpacing',\n 'textAlign',\n ]),\n })\n\nexport const ListItem = withStaticProperties(ListItemInner, {\n Text: ListItemText,\n Subtitle: ListItemSubtitle,\n})\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import {\n FontSizeTokens,\n GetProps,\n Spacer,\n TamaguiComponent,\n ThemeableProps,\n getSize,\n getVariableValue,\n styled,\n themeable,\n withStaticProperties,\n} from '@tamagui/core'\nimport { getFontSize } from '@tamagui/font-size'\nimport { TextParentStyles, useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { ThemeableStack, YStack } from '@tamagui/stacks'\nimport { SizableText, wrapChildrenInText } from '@tamagui/text'\nimport React, { FunctionComponent, forwardRef } from 'react'\nimport { View } from 'react-native'\n\n// bugfix esbuild strips react jsx: 'preserve'\nReact['createElement']\n\ntype ListItemIconProps = { color?: string; size?: number }\ntype IconProp = JSX.Element | FunctionComponent<ListItemIconProps> | null\n\nexport type ListItemProps = Omit<TextParentStyles, 'TextComponent'> &\n GetProps<typeof ListItemFrame> &\n ThemeableProps & {\n // add icon before, passes color and size automatically if Component\n icon?: IconProp\n // add icon after, passes color and size automatically if Component\n iconAfter?: IconProp\n // adjust icon relative to size\n // default: -1\n scaleIcon?: number\n // make the spacing elements flex\n spaceFlex?: number | boolean\n // adjust internal space relative to icon size\n scaleSpace?: number\n // title\n title?: React.ReactNode\n // subtitle\n subTitle?: React.ReactNode\n }\n\nexport const ListItemFrame = styled(ThemeableStack, {\n name: 'ListItem',\n tag: 'li',\n alignItems: 'center',\n flexWrap: 'nowrap',\n width: '100%',\n borderColor: '$borderColor',\n maxWidth: '100%',\n overflow: 'hidden',\n flexDirection: 'row',\n\n variants: {\n size: {\n '...size': (val, { tokens }) => {\n return {\n minHeight: tokens.size[val],\n paddingHorizontal: tokens.space[val],\n }\n },\n },\n\n active: {\n true: {\n hoverStyle: {\n backgroundColor: '$background',\n },\n },\n },\n\n disabled: {\n true: {\n opacity: 0.5,\n // TODO breaking types\n pointerEvents: 'none' as any,\n },\n },\n },\n\n defaultVariants: {\n size: '$4',\n },\n})\n\nexport const ListItemText = styled(SizableText, {\n name: 'ListItemText',\n color: '$color',\n selectable: false,\n flexGrow: 1,\n flexShrink: 1,\n ellipse: true,\n})\n\nexport const ListItemSubtitle = styled(ListItemText, {\n name: 'ListItemSubtitle',\n color: '$colorPress',\n marginTop: '$-2',\n opacity: 0.65,\n ellipse: true,\n maxWidth: '100%',\n size: '$3',\n})\n\nconst ListItemTitle = styled(ListItemText, {\n name: 'ListItemTitle',\n ellipse: true,\n})\n\nconst ListItemComponent = forwardRef((props: ListItemProps, ref) => {\n // careful not to desctructure and re-order props, order is important\n const {\n children,\n icon,\n iconAfter,\n noTextWrap,\n theme: themeName,\n space,\n spaceFlex,\n scaleIcon = 1,\n scaleSpace = 1,\n subTitle,\n\n // text props\n color,\n fontWeight,\n letterSpacing,\n fontSize,\n fontFamily,\n textAlign,\n textProps,\n title,\n ...rest\n } = props as ListItemProps\n\n const size = props.size || '$4'\n const subtitleSizeToken = getSize(size, -3)\n const subtitleSize = `$${subtitleSizeToken.key}` as FontSizeTokens\n const iconSize = getFontSize(size) * scaleIcon\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color })\n const [themedIcon, themedIconAfter] = [icon, iconAfter].map(getThemedIcon)\n const spaceSize = getVariableValue(iconSize) * scaleSpace\n const contents = wrapChildrenInText(ListItemText, props)\n\n return (\n <ListItemFrame fontFamily={fontFamily} ref={ref as any} {...rest}>\n {themedIcon ? (\n <>\n {themedIcon}\n <Spacer size={spaceSize} />\n </>\n ) : null}\n {/* helper for common title/subtitle pttern */}\n {Boolean(title || subTitle) ? (\n <YStack flex={1}>\n <ListItemTitle>{title}</ListItemTitle>\n {subTitle ? (\n typeof subTitle === 'string' ? (\n // TODO can use theme but we need to standardize to alt themes\n // or standardize on subtle colors in themes\n <ListItemSubtitle size={subtitleSize}>{subTitle}</ListItemSubtitle>\n ) : (\n subTitle\n )\n ) : null}\n {contents}\n </YStack>\n ) : (\n contents\n )}\n {themedIconAfter ? (\n <>\n <Spacer flex size={spaceSize} />\n {themedIconAfter}\n </>\n ) : null}\n </ListItemFrame>\n )\n})\n\nconst ListItemInner: TamaguiComponent<ListItemProps, HTMLLIElement | View> =\n ListItemFrame.extractable(themeable(ListItemComponent as any) as any, {\n inlineProps: new Set([\n // text props go here (can't really optimize them, but we never fully extract listItem anyway)\n 'color',\n 'fontWeight',\n 'fontSize',\n 'fontFamily',\n 'letterSpacing',\n 'textAlign',\n ]),\n })\n\nexport const ListItem = withStaticProperties(ListItemInner, {\n Text: ListItemText,\n Subtitle: ListItemSubtitle,\n})\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
package/dist/esm/ListItem.js CHANGED
@@ -78,6 +78,7 @@ const ListItemFrame = styled(ThemeableStack, {
78
78
  }
79
79
  });
80
80
  const ListItemText = styled(SizableText, {
81
+ name: "ListItemText",
81
82
  color: "$color",
82
83
  selectable: false,
83
84
  flexGrow: 1,
@@ -85,11 +86,18 @@ const ListItemText = styled(SizableText, {
85
86
  ellipse: true
86
87
  });
87
88
  const ListItemSubtitle = styled(ListItemText, {
89
+ name: "ListItemSubtitle",
88
90
  color: "$colorPress",
89
91
  marginTop: "$-2",
90
92
  opacity: 0.65,
93
+ ellipse: true,
94
+ maxWidth: "100%",
91
95
  size: "$3"
92
96
  });
97
+ const ListItemTitle = styled(ListItemText, {
98
+ name: "ListItemTitle",
99
+ ellipse: true
100
+ });
93
101
  const ListItemComponent = forwardRef((props, ref) => {
94
102
  const _a = props, {
95
103
  children,
@@ -145,7 +153,7 @@ const ListItemComponent = forwardRef((props, ref) => {
145
153
  size: spaceSize
146
154
  })) : null, Boolean(title || subTitle) ? /* @__PURE__ */ React.createElement(YStack, {
147
155
  flex: 1
148
- }, /* @__PURE__ */ React.createElement(ListItemText, null, title), subTitle ? typeof subTitle === "string" ? /* @__PURE__ */ React.createElement(ListItemSubtitle, {
156
+ }, /* @__PURE__ */ React.createElement(ListItemTitle, null, title), subTitle ? typeof subTitle === "string" ? /* @__PURE__ */ React.createElement(ListItemSubtitle, {
149
157
  size: subtitleSize
150
158
  }, subTitle) : subTitle : null, contents) : contents, themedIconAfter ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Spacer, {
151
159
  flex: true,
package/dist/esm/ListItem.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/ListItem.tsx"],
4
- "sourcesContent": ["import {\n FontSizeTokens,\n GetProps,\n Spacer,\n TamaguiComponent,\n ThemeableProps,\n getSize,\n getVariableValue,\n styled,\n themeable,\n withStaticProperties,\n} from '@tamagui/core'\nimport { getFontSize } from '@tamagui/font-size'\nimport { TextParentStyles, useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { ThemeableStack, YStack } from '@tamagui/stacks'\nimport { SizableText, wrapChildrenInText } from '@tamagui/text'\nimport React, { FunctionComponent, forwardRef } from 'react'\nimport { View } from 'react-native'\n\n// bugfix esbuild strips react jsx: 'preserve'\nReact['createElement']\n\ntype ListItemIconProps = { color?: string; size?: number }\ntype IconProp = JSX.Element | FunctionComponent<ListItemIconProps> | null\n\nexport type ListItemProps = Omit<TextParentStyles, 'TextComponent'> &\n GetProps<typeof ListItemFrame> &\n ThemeableProps & {\n // add icon before, passes color and size automatically if Component\n icon?: IconProp\n // add icon after, passes color and size automatically if Component\n iconAfter?: IconProp\n // adjust icon relative to size\n // default: -1\n scaleIcon?: number\n // make the spacing elements flex\n spaceFlex?: number | boolean\n // adjust internal space relative to icon size\n scaleSpace?: number\n // title\n title?: React.ReactNode\n // subtitle\n subTitle?: React.ReactNode\n }\n\nexport const ListItemFrame = styled(ThemeableStack, {\n name: 'ListItem',\n tag: 'li',\n alignItems: 'center',\n flexWrap: 'nowrap',\n width: '100%',\n borderColor: '$borderColor',\n maxWidth: '100%',\n overflow: 'hidden',\n flexDirection: 'row',\n\n variants: {\n size: {\n '...size': (val, { tokens }) => {\n return {\n minHeight: tokens.size[val],\n paddingHorizontal: tokens.space[val],\n }\n },\n },\n\n active: {\n true: {\n hoverStyle: {\n backgroundColor: '$background',\n },\n },\n },\n\n disabled: {\n true: {\n opacity: 0.5,\n // TODO breaking types\n pointerEvents: 'none' as any,\n },\n },\n },\n\n defaultVariants: {\n size: '$4',\n },\n})\n\nexport const ListItemText = styled(SizableText, {\n color: '$color',\n selectable: false,\n flexGrow: 1,\n flexShrink: 1,\n ellipse: true,\n})\n\nexport const ListItemSubtitle = styled(ListItemText, {\n color: '$colorPress',\n marginTop: '$-2',\n opacity: 0.65,\n size: '$3',\n})\n\nconst ListItemComponent = forwardRef((props: ListItemProps, ref) => {\n // careful not to desctructure and re-order props, order is important\n const {\n children,\n icon,\n iconAfter,\n noTextWrap,\n theme: themeName,\n space,\n spaceFlex,\n scaleIcon = 1,\n scaleSpace = 1,\n subTitle,\n\n // text props\n color,\n fontWeight,\n letterSpacing,\n fontSize,\n fontFamily,\n textAlign,\n textProps,\n title,\n ...rest\n } = props as ListItemProps\n\n const size = props.size || '$4'\n const subtitleSizeToken = getSize(size, -3)\n const subtitleSize = `$${subtitleSizeToken.key}` as FontSizeTokens\n const iconSize = getFontSize(size) * scaleIcon\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color })\n const [themedIcon, themedIconAfter] = [icon, iconAfter].map(getThemedIcon)\n const spaceSize = getVariableValue(iconSize) * scaleSpace\n const contents = wrapChildrenInText(ListItemText, props)\n\n return (\n <ListItemFrame fontFamily={fontFamily} ref={ref as any} {...rest}>\n {themedIcon ? (\n <>\n {themedIcon}\n <Spacer size={spaceSize} />\n </>\n ) : null}\n {/* helper for common title/subtitle pttern */}\n {Boolean(title || subTitle) ? (\n <YStack flex={1}>\n <ListItemText>{title}</ListItemText>\n {subTitle ? (\n typeof subTitle === 'string' ? (\n // TODO can use theme but we need to standardize to alt themes\n // or standardize on subtle colors in themes\n <ListItemSubtitle size={subtitleSize}>{subTitle}</ListItemSubtitle>\n ) : (\n subTitle\n )\n ) : null}\n {contents}\n </YStack>\n ) : (\n contents\n )}\n {themedIconAfter ? (\n <>\n <Spacer flex size={spaceSize} />\n {themedIconAfter}\n </>\n ) : null}\n </ListItemFrame>\n )\n})\n\nconst ListItemInner: TamaguiComponent<ListItemProps, HTMLLIElement | View> =\n ListItemFrame.extractable(themeable(ListItemComponent as any) as any, {\n inlineProps: new Set([\n // text props go here (can't really optimize them, but we never fully extract listItem anyway)\n 'color',\n 'fontWeight',\n 'fontSize',\n 'fontFamily',\n 'letterSpacing',\n 'textAlign',\n ]),\n })\n\nexport const ListItem = withStaticProperties(ListItemInner, {\n Text: ListItemText,\n Subtitle: ListItemSubtitle,\n})\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import {\n FontSizeTokens,\n GetProps,\n Spacer,\n TamaguiComponent,\n ThemeableProps,\n getSize,\n getVariableValue,\n styled,\n themeable,\n withStaticProperties,\n} from '@tamagui/core'\nimport { getFontSize } from '@tamagui/font-size'\nimport { TextParentStyles, useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { ThemeableStack, YStack } from '@tamagui/stacks'\nimport { SizableText, wrapChildrenInText } from '@tamagui/text'\nimport React, { FunctionComponent, forwardRef } from 'react'\nimport { View } from 'react-native'\n\n// bugfix esbuild strips react jsx: 'preserve'\nReact['createElement']\n\ntype ListItemIconProps = { color?: string; size?: number }\ntype IconProp = JSX.Element | FunctionComponent<ListItemIconProps> | null\n\nexport type ListItemProps = Omit<TextParentStyles, 'TextComponent'> &\n GetProps<typeof ListItemFrame> &\n ThemeableProps & {\n // add icon before, passes color and size automatically if Component\n icon?: IconProp\n // add icon after, passes color and size automatically if Component\n iconAfter?: IconProp\n // adjust icon relative to size\n // default: -1\n scaleIcon?: number\n // make the spacing elements flex\n spaceFlex?: number | boolean\n // adjust internal space relative to icon size\n scaleSpace?: number\n // title\n title?: React.ReactNode\n // subtitle\n subTitle?: React.ReactNode\n }\n\nexport const ListItemFrame = styled(ThemeableStack, {\n name: 'ListItem',\n tag: 'li',\n alignItems: 'center',\n flexWrap: 'nowrap',\n width: '100%',\n borderColor: '$borderColor',\n maxWidth: '100%',\n overflow: 'hidden',\n flexDirection: 'row',\n\n variants: {\n size: {\n '...size': (val, { tokens }) => {\n return {\n minHeight: tokens.size[val],\n paddingHorizontal: tokens.space[val],\n }\n },\n },\n\n active: {\n true: {\n hoverStyle: {\n backgroundColor: '$background',\n },\n },\n },\n\n disabled: {\n true: {\n opacity: 0.5,\n // TODO breaking types\n pointerEvents: 'none' as any,\n },\n },\n },\n\n defaultVariants: {\n size: '$4',\n },\n})\n\nexport const ListItemText = styled(SizableText, {\n name: 'ListItemText',\n color: '$color',\n selectable: false,\n flexGrow: 1,\n flexShrink: 1,\n ellipse: true,\n})\n\nexport const ListItemSubtitle = styled(ListItemText, {\n name: 'ListItemSubtitle',\n color: '$colorPress',\n marginTop: '$-2',\n opacity: 0.65,\n ellipse: true,\n maxWidth: '100%',\n size: '$3',\n})\n\nconst ListItemTitle = styled(ListItemText, {\n name: 'ListItemTitle',\n ellipse: true,\n})\n\nconst ListItemComponent = forwardRef((props: ListItemProps, ref) => {\n // careful not to desctructure and re-order props, order is important\n const {\n children,\n icon,\n iconAfter,\n noTextWrap,\n theme: themeName,\n space,\n spaceFlex,\n scaleIcon = 1,\n scaleSpace = 1,\n subTitle,\n\n // text props\n color,\n fontWeight,\n letterSpacing,\n fontSize,\n fontFamily,\n textAlign,\n textProps,\n title,\n ...rest\n } = props as ListItemProps\n\n const size = props.size || '$4'\n const subtitleSizeToken = getSize(size, -3)\n const subtitleSize = `$${subtitleSizeToken.key}` as FontSizeTokens\n const iconSize = getFontSize(size) * scaleIcon\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color })\n const [themedIcon, themedIconAfter] = [icon, iconAfter].map(getThemedIcon)\n const spaceSize = getVariableValue(iconSize) * scaleSpace\n const contents = wrapChildrenInText(ListItemText, props)\n\n return (\n <ListItemFrame fontFamily={fontFamily} ref={ref as any} {...rest}>\n {themedIcon ? (\n <>\n {themedIcon}\n <Spacer size={spaceSize} />\n </>\n ) : null}\n {/* helper for common title/subtitle pttern */}\n {Boolean(title || subTitle) ? (\n <YStack flex={1}>\n <ListItemTitle>{title}</ListItemTitle>\n {subTitle ? (\n typeof subTitle === 'string' ? (\n // TODO can use theme but we need to standardize to alt themes\n // or standardize on subtle colors in themes\n <ListItemSubtitle size={subtitleSize}>{subTitle}</ListItemSubtitle>\n ) : (\n subTitle\n )\n ) : null}\n {contents}\n </YStack>\n ) : (\n contents\n )}\n {themedIconAfter ? (\n <>\n <Spacer flex size={spaceSize} />\n {themedIconAfter}\n </>\n ) : null}\n </ListItemFrame>\n )\n})\n\nconst ListItemInner: TamaguiComponent<ListItemProps, HTMLLIElement | View> =\n ListItemFrame.extractable(themeable(ListItemComponent as any) as any, {\n inlineProps: new Set([\n // text props go here (can't really optimize them, but we never fully extract listItem anyway)\n 'color',\n 'fontWeight',\n 'fontSize',\n 'fontFamily',\n 'letterSpacing',\n 'textAlign',\n ]),\n })\n\nexport const ListItem = withStaticProperties(ListItemInner, {\n Text: ListItemText,\n Subtitle: ListItemSubtitle,\n})\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
package/dist/jsx/ListItem.js CHANGED
@@ -50,6 +50,7 @@ const ListItemFrame = styled(ThemeableStack, {
50
50
  }
51
51
  });
52
52
  const ListItemText = styled(SizableText, {
53
+ name: "ListItemText",
53
54
  color: "$color",
54
55
  selectable: false,
55
56
  flexGrow: 1,
@@ -57,11 +58,18 @@ const ListItemText = styled(SizableText, {
57
58
  ellipse: true
58
59
  });
59
60
  const ListItemSubtitle = styled(ListItemText, {
61
+ name: "ListItemSubtitle",
60
62
  color: "$colorPress",
61
63
  marginTop: "$-2",
62
64
  opacity: 0.65,
65
+ ellipse: true,
66
+ maxWidth: "100%",
63
67
  size: "$3"
64
68
  });
69
+ const ListItemTitle = styled(ListItemText, {
70
+ name: "ListItemTitle",
71
+ ellipse: true
72
+ });
65
73
  const ListItemComponent = forwardRef((props, ref) => {
66
74
  const {
67
75
  children,
@@ -98,7 +106,7 @@ const ListItemComponent = forwardRef((props, ref) => {
98
106
  <Spacer size={spaceSize} />
99
107
  </> : null}
100
108
  {Boolean(title || subTitle) ? <YStack flex={1}>
101
- <ListItemText>{title}</ListItemText>
109
+ <ListItemTitle>{title}</ListItemTitle>
102
110
  {subTitle ? typeof subTitle === "string" ? <ListItemSubtitle size={subtitleSize}>{subTitle}</ListItemSubtitle> : subTitle : null}
103
111
  {contents}
104
112
  </YStack> : contents}
package/dist/jsx/ListItem.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/ListItem.tsx"],
4
- "sourcesContent": ["import {\n FontSizeTokens,\n GetProps,\n Spacer,\n TamaguiComponent,\n ThemeableProps,\n getSize,\n getVariableValue,\n styled,\n themeable,\n withStaticProperties,\n} from '@tamagui/core'\nimport { getFontSize } from '@tamagui/font-size'\nimport { TextParentStyles, useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { ThemeableStack, YStack } from '@tamagui/stacks'\nimport { SizableText, wrapChildrenInText } from '@tamagui/text'\nimport React, { FunctionComponent, forwardRef } from 'react'\nimport { View } from 'react-native'\n\n// bugfix esbuild strips react jsx: 'preserve'\nReact['createElement']\n\ntype ListItemIconProps = { color?: string; size?: number }\ntype IconProp = JSX.Element | FunctionComponent<ListItemIconProps> | null\n\nexport type ListItemProps = Omit<TextParentStyles, 'TextComponent'> &\n GetProps<typeof ListItemFrame> &\n ThemeableProps & {\n // add icon before, passes color and size automatically if Component\n icon?: IconProp\n // add icon after, passes color and size automatically if Component\n iconAfter?: IconProp\n // adjust icon relative to size\n // default: -1\n scaleIcon?: number\n // make the spacing elements flex\n spaceFlex?: number | boolean\n // adjust internal space relative to icon size\n scaleSpace?: number\n // title\n title?: React.ReactNode\n // subtitle\n subTitle?: React.ReactNode\n }\n\nexport const ListItemFrame = styled(ThemeableStack, {\n name: 'ListItem',\n tag: 'li',\n alignItems: 'center',\n flexWrap: 'nowrap',\n width: '100%',\n borderColor: '$borderColor',\n maxWidth: '100%',\n overflow: 'hidden',\n flexDirection: 'row',\n\n variants: {\n size: {\n '...size': (val, { tokens }) => {\n return {\n minHeight: tokens.size[val],\n paddingHorizontal: tokens.space[val],\n }\n },\n },\n\n active: {\n true: {\n hoverStyle: {\n backgroundColor: '$background',\n },\n },\n },\n\n disabled: {\n true: {\n opacity: 0.5,\n // TODO breaking types\n pointerEvents: 'none' as any,\n },\n },\n },\n\n defaultVariants: {\n size: '$4',\n },\n})\n\nexport const ListItemText = styled(SizableText, {\n color: '$color',\n selectable: false,\n flexGrow: 1,\n flexShrink: 1,\n ellipse: true,\n})\n\nexport const ListItemSubtitle = styled(ListItemText, {\n color: '$colorPress',\n marginTop: '$-2',\n opacity: 0.65,\n size: '$3',\n})\n\nconst ListItemComponent = forwardRef((props: ListItemProps, ref) => {\n // careful not to desctructure and re-order props, order is important\n const {\n children,\n icon,\n iconAfter,\n noTextWrap,\n theme: themeName,\n space,\n spaceFlex,\n scaleIcon = 1,\n scaleSpace = 1,\n subTitle,\n\n // text props\n color,\n fontWeight,\n letterSpacing,\n fontSize,\n fontFamily,\n textAlign,\n textProps,\n title,\n ...rest\n } = props as ListItemProps\n\n const size = props.size || '$4'\n const subtitleSizeToken = getSize(size, -3)\n const subtitleSize = `$${subtitleSizeToken.key}` as FontSizeTokens\n const iconSize = getFontSize(size) * scaleIcon\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color })\n const [themedIcon, themedIconAfter] = [icon, iconAfter].map(getThemedIcon)\n const spaceSize = getVariableValue(iconSize) * scaleSpace\n const contents = wrapChildrenInText(ListItemText, props)\n\n return (\n <ListItemFrame fontFamily={fontFamily} ref={ref as any} {...rest}>\n {themedIcon ? (\n <>\n {themedIcon}\n <Spacer size={spaceSize} />\n </>\n ) : null}\n {/* helper for common title/subtitle pttern */}\n {Boolean(title || subTitle) ? (\n <YStack flex={1}>\n <ListItemText>{title}</ListItemText>\n {subTitle ? (\n typeof subTitle === 'string' ? (\n // TODO can use theme but we need to standardize to alt themes\n // or standardize on subtle colors in themes\n <ListItemSubtitle size={subtitleSize}>{subTitle}</ListItemSubtitle>\n ) : (\n subTitle\n )\n ) : null}\n {contents}\n </YStack>\n ) : (\n contents\n )}\n {themedIconAfter ? (\n <>\n <Spacer flex size={spaceSize} />\n {themedIconAfter}\n </>\n ) : null}\n </ListItemFrame>\n )\n})\n\nconst ListItemInner: TamaguiComponent<ListItemProps, HTMLLIElement | View> =\n ListItemFrame.extractable(themeable(ListItemComponent as any) as any, {\n inlineProps: new Set([\n // text props go here (can't really optimize them, but we never fully extract listItem anyway)\n 'color',\n 'fontWeight',\n 'fontSize',\n 'fontFamily',\n 'letterSpacing',\n 'textAlign',\n ]),\n })\n\nexport const ListItem = withStaticProperties(ListItemInner, {\n Text: ListItemText,\n Subtitle: ListItemSubtitle,\n})\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import {\n FontSizeTokens,\n GetProps,\n Spacer,\n TamaguiComponent,\n ThemeableProps,\n getSize,\n getVariableValue,\n styled,\n themeable,\n withStaticProperties,\n} from '@tamagui/core'\nimport { getFontSize } from '@tamagui/font-size'\nimport { TextParentStyles, useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { ThemeableStack, YStack } from '@tamagui/stacks'\nimport { SizableText, wrapChildrenInText } from '@tamagui/text'\nimport React, { FunctionComponent, forwardRef } from 'react'\nimport { View } from 'react-native'\n\n// bugfix esbuild strips react jsx: 'preserve'\nReact['createElement']\n\ntype ListItemIconProps = { color?: string; size?: number }\ntype IconProp = JSX.Element | FunctionComponent<ListItemIconProps> | null\n\nexport type ListItemProps = Omit<TextParentStyles, 'TextComponent'> &\n GetProps<typeof ListItemFrame> &\n ThemeableProps & {\n // add icon before, passes color and size automatically if Component\n icon?: IconProp\n // add icon after, passes color and size automatically if Component\n iconAfter?: IconProp\n // adjust icon relative to size\n // default: -1\n scaleIcon?: number\n // make the spacing elements flex\n spaceFlex?: number | boolean\n // adjust internal space relative to icon size\n scaleSpace?: number\n // title\n title?: React.ReactNode\n // subtitle\n subTitle?: React.ReactNode\n }\n\nexport const ListItemFrame = styled(ThemeableStack, {\n name: 'ListItem',\n tag: 'li',\n alignItems: 'center',\n flexWrap: 'nowrap',\n width: '100%',\n borderColor: '$borderColor',\n maxWidth: '100%',\n overflow: 'hidden',\n flexDirection: 'row',\n\n variants: {\n size: {\n '...size': (val, { tokens }) => {\n return {\n minHeight: tokens.size[val],\n paddingHorizontal: tokens.space[val],\n }\n },\n },\n\n active: {\n true: {\n hoverStyle: {\n backgroundColor: '$background',\n },\n },\n },\n\n disabled: {\n true: {\n opacity: 0.5,\n // TODO breaking types\n pointerEvents: 'none' as any,\n },\n },\n },\n\n defaultVariants: {\n size: '$4',\n },\n})\n\nexport const ListItemText = styled(SizableText, {\n name: 'ListItemText',\n color: '$color',\n selectable: false,\n flexGrow: 1,\n flexShrink: 1,\n ellipse: true,\n})\n\nexport const ListItemSubtitle = styled(ListItemText, {\n name: 'ListItemSubtitle',\n color: '$colorPress',\n marginTop: '$-2',\n opacity: 0.65,\n ellipse: true,\n maxWidth: '100%',\n size: '$3',\n})\n\nconst ListItemTitle = styled(ListItemText, {\n name: 'ListItemTitle',\n ellipse: true,\n})\n\nconst ListItemComponent = forwardRef((props: ListItemProps, ref) => {\n // careful not to desctructure and re-order props, order is important\n const {\n children,\n icon,\n iconAfter,\n noTextWrap,\n theme: themeName,\n space,\n spaceFlex,\n scaleIcon = 1,\n scaleSpace = 1,\n subTitle,\n\n // text props\n color,\n fontWeight,\n letterSpacing,\n fontSize,\n fontFamily,\n textAlign,\n textProps,\n title,\n ...rest\n } = props as ListItemProps\n\n const size = props.size || '$4'\n const subtitleSizeToken = getSize(size, -3)\n const subtitleSize = `$${subtitleSizeToken.key}` as FontSizeTokens\n const iconSize = getFontSize(size) * scaleIcon\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color })\n const [themedIcon, themedIconAfter] = [icon, iconAfter].map(getThemedIcon)\n const spaceSize = getVariableValue(iconSize) * scaleSpace\n const contents = wrapChildrenInText(ListItemText, props)\n\n return (\n <ListItemFrame fontFamily={fontFamily} ref={ref as any} {...rest}>\n {themedIcon ? (\n <>\n {themedIcon}\n <Spacer size={spaceSize} />\n </>\n ) : null}\n {/* helper for common title/subtitle pttern */}\n {Boolean(title || subTitle) ? (\n <YStack flex={1}>\n <ListItemTitle>{title}</ListItemTitle>\n {subTitle ? (\n typeof subTitle === 'string' ? (\n // TODO can use theme but we need to standardize to alt themes\n // or standardize on subtle colors in themes\n <ListItemSubtitle size={subtitleSize}>{subTitle}</ListItemSubtitle>\n ) : (\n subTitle\n )\n ) : null}\n {contents}\n </YStack>\n ) : (\n contents\n )}\n {themedIconAfter ? (\n <>\n <Spacer flex size={spaceSize} />\n {themedIconAfter}\n </>\n ) : null}\n </ListItemFrame>\n )\n})\n\nconst ListItemInner: TamaguiComponent<ListItemProps, HTMLLIElement | View> =\n ListItemFrame.extractable(themeable(ListItemComponent as any) as any, {\n inlineProps: new Set([\n // text props go here (can't really optimize them, but we never fully extract listItem anyway)\n 'color',\n 'fontWeight',\n 'fontSize',\n 'fontFamily',\n 'letterSpacing',\n 'textAlign',\n ]),\n })\n\nexport const ListItem = withStaticProperties(ListItemInner, {\n Text: ListItemText,\n Subtitle: ListItemSubtitle,\n})\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tamagui/list-item",
3
- "version": "1.0.1-beta.94",
3
+ "version": "1.0.1-beta.95",
4
4
  "sideEffects": [
5
5
  "*.css"
6
6
  ],
@@ -19,16 +19,16 @@
19
19
  "watch": "tamagui-build --watch"
20
20
  },
21
21
  "dependencies": {
22
- "@tamagui/core": "^1.0.1-beta.94",
23
- "@tamagui/font-size": "^1.0.1-beta.94",
24
- "@tamagui/helpers-tamagui": "^1.0.1-beta.94"
22
+ "@tamagui/core": "^1.0.1-beta.95",
23
+ "@tamagui/font-size": "^1.0.1-beta.95",
24
+ "@tamagui/helpers-tamagui": "^1.0.1-beta.95"
25
25
  },
26
26
  "peerDependencies": {
27
27
  "react": "*",
28
28
  "react-dom": "*"
29
29
  },
30
30
  "devDependencies": {
31
- "@tamagui/build": "^1.0.1-beta.94",
31
+ "@tamagui/build": "^1.0.1-beta.95",
32
32
  "react": "*",
33
33
  "react-dom": "*"
34
34
  },
package/src/ListItem.tsx CHANGED
@@ -87,6 +87,7 @@ export const ListItemFrame = styled(ThemeableStack, {
87
87
  })
88
88
 
89
89
  export const ListItemText = styled(SizableText, {
90
+ name: 'ListItemText',
90
91
  color: '$color',
91
92
  selectable: false,
92
93
  flexGrow: 1,
@@ -95,12 +96,20 @@ export const ListItemText = styled(SizableText, {
95
96
  })
96
97
 
97
98
  export const ListItemSubtitle = styled(ListItemText, {
99
+ name: 'ListItemSubtitle',
98
100
  color: '$colorPress',
99
101
  marginTop: '$-2',
100
102
  opacity: 0.65,
103
+ ellipse: true,
104
+ maxWidth: '100%',
101
105
  size: '$3',
102
106
  })
103
107
 
108
+ const ListItemTitle = styled(ListItemText, {
109
+ name: 'ListItemTitle',
110
+ ellipse: true,
111
+ })
112
+
104
113
  const ListItemComponent = forwardRef((props: ListItemProps, ref) => {
105
114
  // careful not to desctructure and re-order props, order is important
106
115
  const {
@@ -147,7 +156,7 @@ const ListItemComponent = forwardRef((props: ListItemProps, ref) => {
147
156
  {/* helper for common title/subtitle pttern */}
148
157
  {Boolean(title || subTitle) ? (
149
158
  <YStack flex={1}>
150
- <ListItemText>{title}</ListItemText>
159
+ <ListItemTitle>{title}</ListItemTitle>
151
160
  {subTitle ? (
152
161
  typeof subTitle === 'string' ? (
153
162
  // TODO can use theme but we need to standardize to alt themes
package/types/ListItem.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ListItem.d.ts","sourceRoot":"","sources":["../src/ListItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,cAAc,EACd,QAAQ,EAER,gBAAgB,EAChB,cAAc,EAMf,MAAM,eAAe,CAAA;AAEtB,OAAO,EAAE,gBAAgB,EAAoB,MAAM,0BAA0B,CAAA;AAG7E,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAAc,MAAM,OAAO,CAAA;AAC5D,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAKnC,aAAK,iBAAiB,GAAG;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,CAAA;AAC1D,aAAK,QAAQ,GAAG,GAAG,CAAC,OAAO,GAAG,iBAAiB,CAAC,iBAAiB,CAAC,GAAG,IAAI,CAAA;AAEzE,oBAAY,aAAa,GAAG,IAAI,CAAC,gBAAgB,EAAE,eAAe,CAAC,GACjE,QAAQ,CAAC,OAAO,aAAa,CAAC,GAC9B,cAAc,GAAG;IAEf,IAAI,CAAC,EAAE,QAAQ,CAAA;IAEf,SAAS,CAAC,EAAE,QAAQ,CAAA;IAGpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAE5B,UAAU,CAAC,EAAE,MAAM,CAAA;IAEnB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAEvB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B,CAAA;AAEH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyCxB,CAAA;AAEF,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;GAMvB,CAAA;AAEF,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAK3B,CAAA;AAsFF,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGnB,CAAA"}
1
+ {"version":3,"file":"ListItem.d.ts","sourceRoot":"","sources":["../src/ListItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,cAAc,EACd,QAAQ,EAER,gBAAgB,EAChB,cAAc,EAMf,MAAM,eAAe,CAAA;AAEtB,OAAO,EAAE,gBAAgB,EAAoB,MAAM,0BAA0B,CAAA;AAG7E,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAAc,MAAM,OAAO,CAAA;AAC5D,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAKnC,aAAK,iBAAiB,GAAG;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,CAAA;AAC1D,aAAK,QAAQ,GAAG,GAAG,CAAC,OAAO,GAAG,iBAAiB,CAAC,iBAAiB,CAAC,GAAG,IAAI,CAAA;AAEzE,oBAAY,aAAa,GAAG,IAAI,CAAC,gBAAgB,EAAE,eAAe,CAAC,GACjE,QAAQ,CAAC,OAAO,aAAa,CAAC,GAC9B,cAAc,GAAG;IAEf,IAAI,CAAC,EAAE,QAAQ,CAAA;IAEf,SAAS,CAAC,EAAE,QAAQ,CAAA;IAGpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAE5B,UAAU,CAAC,EAAE,MAAM,CAAA;IAEnB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAEvB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B,CAAA;AAEH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyCxB,CAAA;AAEF,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;GAOvB,CAAA;AAEF,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAQ3B,CAAA;AA2FF,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGnB,CAAA"}