@tamagui/group 1.11.2 → 1.12.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.
Files changed (14) hide show
  1. package/dist/cjs/Group.js +8 -7
  2. package/dist/cjs/Group.js.map +2 -2
  3. package/dist/esm/Group.js +8 -7
  4. package/dist/esm/Group.js.map +2 -2
  5. package/dist/esm/Group.mjs +8 -7
  6. package/dist/esm/Group.mjs.map +2 -2
  7. package/dist/jsx/Group.js +8 -7
  8. package/dist/jsx/Group.js.map +2 -2
  9. package/dist/jsx/Group.mjs +8 -7
  10. package/dist/jsx/Group.mjs.map +2 -2
  11. package/package.json +6 -6
  12. package/src/Group.tsx +12 -8
  13. package/types/Group.d.ts +16 -0
  14. package/types/Group.d.ts.map +1 -1
package/dist/cjs/Group.js CHANGED
@@ -80,13 +80,14 @@ function createGroup(verticalDefault) {
80
80
  separator,
81
81
  scrollable,
82
82
  axis = verticalDefault ? "vertical" : "horizontal",
83
+ orientation = axis,
83
84
  disabled: disabledProp,
84
85
  disablePassBorderRadius: disablePassBorderRadiusProp,
85
86
  borderRadius,
86
87
  forceUseItem,
87
88
  ...restProps
88
89
  } = (0, import_core.getExpandedShorthands)(activeProps);
89
- const vertical = axis === "vertical";
90
+ const vertical = orientation === "vertical";
90
91
  const [itemChildrenCount, setItemChildrenCount] = (0, import_use_controllable_state.useControllableState)({
91
92
  defaultProp: forceUseItem ? 1 : 0
92
93
  });
@@ -137,7 +138,7 @@ function createGroup(verticalDefault) {
137
138
  GroupProvider,
138
139
  {
139
140
  disablePassBorderRadius,
140
- vertical: axis === "vertical",
141
+ vertical: orientation === "vertical",
141
142
  radius,
142
143
  disabled: disabledProp,
143
144
  onItemMount,
@@ -148,10 +149,10 @@ function createGroup(verticalDefault) {
148
149
  {
149
150
  ref,
150
151
  size,
151
- flexDirection: axis === "horizontal" ? "row" : "column",
152
+ flexDirection: orientation === "horizontal" ? "row" : "column",
152
153
  borderRadius,
153
154
  ...restProps,
154
- children: wrapScroll({ ...activeProps, axis }, indexedChildren)
155
+ children: wrapScroll({ ...activeProps, orientation }, indexedChildren)
155
156
  }
156
157
  )
157
158
  }
@@ -215,15 +216,15 @@ const useGroupItem = (childrenProps, __scopeGroup) => {
215
216
  const Group = createGroup(true);
216
217
  const YGroup = Group;
217
218
  const XGroup = createGroup(false);
218
- const wrapScroll = ({ scrollable, axis, showScrollIndicator = false }, children) => {
219
+ const wrapScroll = ({ scrollable, orientation, showScrollIndicator = false }, children) => {
219
220
  if (scrollable)
220
221
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
221
222
  import_react_native.ScrollView,
222
223
  {
223
- ...axis === "vertical" && {
224
+ ...orientation === "vertical" && {
224
225
  showsVerticalScrollIndicator: showScrollIndicator
225
226
  },
226
- ...axis === "horizontal" && {
227
+ ...orientation === "horizontal" && {
227
228
  horizontal: true,
228
229
  showsHorizontalScrollIndicator: showScrollIndicator
229
230
  },
package/dist/cjs/Group.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Group.tsx"],
4
- "sourcesContent": ["import {\n GetProps,\n TamaguiElement,\n UnionableString,\n Variable,\n getConfig,\n getExpandedShorthands,\n getTokens,\n getVariableValue,\n isTamaguiElement,\n mergeProps,\n spacedChildren,\n styled,\n useMediaPropsActive,\n withStaticProperties,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport React, { Children, forwardRef, isValidElement } from 'react'\nimport { ScrollView } from 'react-native'\nimport { useIndex, useIndexedChildren } from 'reforest'\n\ntype DisablePassBorderRadius = boolean | 'bottom' | 'top' | 'start' | 'end'\n\ninterface GroupContextValue {\n vertical: boolean\n disablePassBorderRadius: DisablePassBorderRadius\n onItemMount: () => void\n onItemUnmount: () => void\n radius?: number | UnionableString | Variable<any>\n disabled?: boolean\n}\n\nconst GROUP_NAME = 'Group'\n\ntype ScopedProps<P> = P & { __scopeGroup?: Scope }\nconst [createGroupContext, createGroupScope] = createContextScope(GROUP_NAME)\nconst [GroupProvider, useGroupContext] = createGroupContext<GroupContextValue>(GROUP_NAME)\n\nexport const GroupFrame = styled(ThemeableStack, {\n name: 'GroupFrame',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n y: 0,\n backgroundColor: '$background',\n },\n },\n\n size: (val, { tokens }) => {\n const borderRadius = tokens.radius[val] ?? val ?? tokens.radius['$true']\n return {\n borderRadius,\n }\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\nexport type GroupProps = GetProps<typeof GroupFrame> & {\n axis?: 'horizontal' | 'vertical'\n\n scrollable?: boolean\n /**\n * @default false\n */\n showScrollIndicator?: boolean\n disabled?: boolean\n disablePassBorderRadius?: DisablePassBorderRadius\n /**\n * forces the group to use the Group.Item API\n */\n forceUseItem?: boolean\n}\n\nfunction createGroup(verticalDefault: boolean) {\n return withStaticProperties(\n forwardRef<TamaguiElement, ScopedProps<GroupProps>>((props, ref) => {\n const activeProps = useMediaPropsActive(props)\n\n const {\n __scopeGroup,\n children: childrenProp,\n space,\n size = '$true',\n spaceDirection,\n separator,\n scrollable,\n axis = verticalDefault ? 'vertical' : 'horizontal',\n disabled: disabledProp,\n disablePassBorderRadius: disablePassBorderRadiusProp,\n borderRadius,\n forceUseItem,\n ...restProps\n } = getExpandedShorthands(activeProps)\n\n const vertical = axis === 'vertical'\n const [itemChildrenCount, setItemChildrenCount] = useControllableState({\n defaultProp: forceUseItem ? 1 : 0,\n })\n const isUsingItems = true // itemChildrenCount > 0\n\n // 1 off given border to adjust for border radius? This should be user controllable\n const radius =\n borderRadius ??\n (size ? getVariableValue(getTokens().radius[size]) - 1 : undefined)\n\n const hasRadius = radius !== undefined\n const disablePassBorderRadius = disablePassBorderRadiusProp ?? !hasRadius\n\n if (!isUsingItems) console.log('screw up!')\n const childrenArray = Children.toArray(childrenProp)\n const children = isUsingItems\n ? childrenProp\n : childrenArray.map((child, i) => {\n if (!isValidElement(child)) {\n return child\n }\n const disabled = child.props.disabled ?? disabledProp\n\n const isFirst = i === 0\n const isLast = i === childrenArray.length - 1\n\n const radiusStyles =\n disablePassBorderRadius === true\n ? null\n : getBorderRadius({\n isFirst,\n isLast,\n radius,\n vertical,\n disable: disablePassBorderRadius,\n })\n const props = {\n disabled,\n ...(isTamaguiElement(child) ? radiusStyles : { style: radiusStyles }),\n }\n\n return cloneElementWithPropOrder(child, props)\n })\n\n const indexedChildren = useIndexedChildren(\n spacedChildren({\n direction: spaceDirection,\n separator,\n space,\n children,\n })\n )\n\n const onItemMount = React.useCallback(\n () => setItemChildrenCount((prev) => prev + 1),\n []\n )\n const onItemUnmount = React.useCallback(\n () => setItemChildrenCount((prev) => prev - 1),\n []\n )\n\n return (\n <GroupProvider\n disablePassBorderRadius={disablePassBorderRadius}\n vertical={axis === 'vertical'}\n radius={radius}\n disabled={disabledProp}\n onItemMount={onItemMount}\n onItemUnmount={onItemUnmount}\n scope={__scopeGroup}\n >\n <GroupFrame\n ref={ref}\n size={size}\n flexDirection={axis === 'horizontal' ? 'row' : 'column'}\n borderRadius={borderRadius}\n {...restProps}\n >\n {wrapScroll({ ...activeProps, axis }, indexedChildren)}\n </GroupFrame>\n </GroupProvider>\n )\n }),\n {\n Item: GroupItem,\n }\n )\n}\n\nconst GroupItem = (props: ScopedProps<{ children: React.ReactNode }>) => {\n const { __scopeGroup, children } = props\n const groupItemProps = useGroupItem(\n { disabled: isValidElement(children) ? children.props.disabled : undefined },\n __scopeGroup\n )\n\n if (!isValidElement(children)) {\n return children as any\n }\n\n if (isTamaguiElement(children)) {\n return React.cloneElement(children, groupItemProps)\n }\n\n return React.cloneElement(children, {\n style: {\n ...children.props?.['style'],\n ...groupItemProps,\n },\n } as any)\n}\n\nexport const useGroupItem = (\n childrenProps: { disabled: boolean },\n __scopeGroup?: Scope\n) => {\n const treeIndex = useIndex()\n const context = useGroupContext('GroupItem', __scopeGroup)\n\n React.useEffect(() => {\n context.onItemMount()\n return () => {\n context.onItemUnmount()\n }\n }, [])\n\n if (!treeIndex) {\n throw Error('<Group.Item/> should only be used within a <Group/>')\n }\n\n const isFirst = treeIndex.index === 0\n const isLast = treeIndex.index === treeIndex.maxIndex\n\n const disabled = childrenProps.disabled ?? context.disabled\n\n let propsToPass: Record<string, any> = {\n disabled,\n }\n\n if (context.disablePassBorderRadius !== true) {\n const borderRadius = getBorderRadius({\n radius: context.radius,\n isFirst,\n isLast,\n vertical: context.vertical,\n disable: context.disablePassBorderRadius,\n })\n return { ...propsToPass, ...borderRadius }\n }\n return propsToPass\n}\n\nexport const Group = createGroup(true)\nexport const YGroup = Group\nexport const XGroup = createGroup(false)\n\nconst wrapScroll = (\n { scrollable, axis, showScrollIndicator = false }: GroupProps,\n children: any\n) => {\n if (scrollable)\n return (\n <ScrollView\n {...(axis === 'vertical' && {\n showsVerticalScrollIndicator: showScrollIndicator,\n })}\n {...(axis === 'horizontal' && {\n horizontal: true,\n showsHorizontalScrollIndicator: showScrollIndicator,\n })}\n >\n {children}\n </ScrollView>\n )\n return children\n}\n\nconst getBorderRadius = ({\n isFirst,\n isLast,\n radius,\n vertical,\n disable,\n}: {\n radius: any\n vertical: boolean\n isFirst: boolean\n isLast: boolean\n disable: DisablePassBorderRadius\n}) => {\n // TODO: RTL support would be nice here\n return {\n borderTopLeftRadius: isFirst && disable !== 'top' && disable !== 'start' ? radius : 0,\n borderTopRightRadius:\n disable !== 'top' &&\n disable !== 'end' &&\n ((vertical && isFirst) || (!vertical && isLast))\n ? radius\n : 0,\n borderBottomLeftRadius:\n disable !== 'bottom' &&\n disable !== 'start' &&\n ((vertical && isLast) || (!vertical && isFirst))\n ? radius\n : 0,\n borderBottomRightRadius:\n isLast && disable !== 'bottom' && disable !== 'end' ? radius : 0,\n }\n}\n\nconst cloneElementWithPropOrder = (child: any, props: Object) => {\n const next = mergeProps(child.props, props, false, getConfig().shorthands)[0]\n return React.cloneElement({ ...child, props: null }, next)\n}\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import {\n GetProps,\n TamaguiElement,\n UnionableString,\n Variable,\n getConfig,\n getExpandedShorthands,\n getTokens,\n getVariableValue,\n isTamaguiElement,\n mergeProps,\n spacedChildren,\n styled,\n useMediaPropsActive,\n withStaticProperties,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport React, { Children, forwardRef, isValidElement } from 'react'\nimport { ScrollView } from 'react-native'\nimport { useIndex, useIndexedChildren } from 'reforest'\n\ntype DisablePassBorderRadius = boolean | 'bottom' | 'top' | 'start' | 'end'\n\ninterface GroupContextValue {\n vertical: boolean\n disablePassBorderRadius: DisablePassBorderRadius\n onItemMount: () => void\n onItemUnmount: () => void\n radius?: number | UnionableString | Variable<any>\n disabled?: boolean\n}\n\nconst GROUP_NAME = 'Group'\n\ntype ScopedProps<P> = P & { __scopeGroup?: Scope }\nconst [createGroupContext, createGroupScope] = createContextScope(GROUP_NAME)\nconst [GroupProvider, useGroupContext] = createGroupContext<GroupContextValue>(GROUP_NAME)\n\nexport const GroupFrame = styled(ThemeableStack, {\n name: 'GroupFrame',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n y: 0,\n backgroundColor: '$background',\n },\n },\n\n size: (val, { tokens }) => {\n const borderRadius = tokens.radius[val] ?? val ?? tokens.radius['$true']\n return {\n borderRadius,\n }\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\nexport type GroupProps = GetProps<typeof GroupFrame> & {\n /**\n * @deprecated use `orientation` instead\n */\n axis?: 'horizontal' | 'vertical'\n orientation?: 'horizontal' | 'vertical'\n scrollable?: boolean\n /**\n * @default false\n */\n showScrollIndicator?: boolean\n disabled?: boolean\n disablePassBorderRadius?: DisablePassBorderRadius\n /**\n * forces the group to use the Group.Item API\n */\n forceUseItem?: boolean\n}\n\nfunction createGroup(verticalDefault: boolean) {\n return withStaticProperties(\n forwardRef<TamaguiElement, ScopedProps<GroupProps>>((props, ref) => {\n const activeProps = useMediaPropsActive(props)\n\n const {\n __scopeGroup,\n children: childrenProp,\n space,\n size = '$true',\n spaceDirection,\n separator,\n scrollable,\n axis = verticalDefault ? 'vertical' : 'horizontal',\n orientation = axis,\n disabled: disabledProp,\n disablePassBorderRadius: disablePassBorderRadiusProp,\n borderRadius,\n forceUseItem,\n ...restProps\n } = getExpandedShorthands(activeProps)\n\n const vertical = orientation === 'vertical'\n const [itemChildrenCount, setItemChildrenCount] = useControllableState({\n defaultProp: forceUseItem ? 1 : 0,\n })\n const isUsingItems = true // itemChildrenCount > 0\n\n // 1 off given border to adjust for border radius? This should be user controllable\n const radius =\n borderRadius ??\n (size ? getVariableValue(getTokens().radius[size]) - 1 : undefined)\n\n const hasRadius = radius !== undefined\n const disablePassBorderRadius = disablePassBorderRadiusProp ?? !hasRadius\n\n if (!isUsingItems) console.log('screw up!')\n const childrenArray = Children.toArray(childrenProp)\n const children = isUsingItems\n ? childrenProp\n : childrenArray.map((child, i) => {\n if (!isValidElement(child)) {\n return child\n }\n const disabled = child.props.disabled ?? disabledProp\n\n const isFirst = i === 0\n const isLast = i === childrenArray.length - 1\n\n const radiusStyles =\n disablePassBorderRadius === true\n ? null\n : getBorderRadius({\n isFirst,\n isLast,\n radius,\n vertical,\n disable: disablePassBorderRadius,\n })\n const props = {\n disabled,\n ...(isTamaguiElement(child) ? radiusStyles : { style: radiusStyles }),\n }\n\n return cloneElementWithPropOrder(child, props)\n })\n\n const indexedChildren = useIndexedChildren(\n spacedChildren({\n direction: spaceDirection,\n separator,\n space,\n children,\n })\n )\n\n const onItemMount = React.useCallback(\n () => setItemChildrenCount((prev) => prev + 1),\n []\n )\n const onItemUnmount = React.useCallback(\n () => setItemChildrenCount((prev) => prev - 1),\n []\n )\n\n return (\n <GroupProvider\n disablePassBorderRadius={disablePassBorderRadius}\n vertical={orientation === 'vertical'}\n radius={radius}\n disabled={disabledProp}\n onItemMount={onItemMount}\n onItemUnmount={onItemUnmount}\n scope={__scopeGroup}\n >\n <GroupFrame\n ref={ref}\n size={size}\n flexDirection={orientation === 'horizontal' ? 'row' : 'column'}\n borderRadius={borderRadius}\n {...restProps}\n >\n {wrapScroll({ ...activeProps, orientation }, indexedChildren)}\n </GroupFrame>\n </GroupProvider>\n )\n }),\n {\n Item: GroupItem,\n }\n )\n}\n\nconst GroupItem = (props: ScopedProps<{ children: React.ReactNode }>) => {\n const { __scopeGroup, children } = props\n const groupItemProps = useGroupItem(\n { disabled: isValidElement(children) ? children.props.disabled : undefined },\n __scopeGroup\n )\n\n if (!isValidElement(children)) {\n return children as any\n }\n\n if (isTamaguiElement(children)) {\n return React.cloneElement(children, groupItemProps)\n }\n\n return React.cloneElement(children, {\n style: {\n ...children.props?.['style'],\n ...groupItemProps,\n },\n } as any)\n}\n\nexport const useGroupItem = (\n childrenProps: { disabled: boolean },\n __scopeGroup?: Scope\n) => {\n const treeIndex = useIndex()\n const context = useGroupContext('GroupItem', __scopeGroup)\n\n React.useEffect(() => {\n context.onItemMount()\n return () => {\n context.onItemUnmount()\n }\n }, [])\n\n if (!treeIndex) {\n throw Error('<Group.Item/> should only be used within a <Group/>')\n }\n\n const isFirst = treeIndex.index === 0\n const isLast = treeIndex.index === treeIndex.maxIndex\n\n const disabled = childrenProps.disabled ?? context.disabled\n\n let propsToPass: Record<string, any> = {\n disabled,\n }\n\n if (context.disablePassBorderRadius !== true) {\n const borderRadius = getBorderRadius({\n radius: context.radius,\n isFirst,\n isLast,\n vertical: context.vertical,\n disable: context.disablePassBorderRadius,\n })\n return { ...propsToPass, ...borderRadius }\n }\n return propsToPass\n}\n\nexport const Group = createGroup(true)\nexport const YGroup = Group\nexport const XGroup = createGroup(false)\n\nconst wrapScroll = (\n { scrollable, orientation, showScrollIndicator = false }: GroupProps,\n children: any\n) => {\n if (scrollable)\n return (\n <ScrollView\n {...(orientation === 'vertical' && {\n showsVerticalScrollIndicator: showScrollIndicator,\n })}\n {...(orientation === 'horizontal' && {\n horizontal: true,\n showsHorizontalScrollIndicator: showScrollIndicator,\n })}\n >\n {children}\n </ScrollView>\n )\n return children\n}\n\nconst getBorderRadius = ({\n isFirst,\n isLast,\n radius,\n vertical,\n disable,\n}: {\n radius: any\n vertical: boolean\n isFirst: boolean\n isLast: boolean\n disable: DisablePassBorderRadius\n}) => {\n // TODO: RTL support would be nice here\n return {\n borderTopLeftRadius: isFirst && disable !== 'top' && disable !== 'start' ? radius : 0,\n borderTopRightRadius:\n disable !== 'top' &&\n disable !== 'end' &&\n ((vertical && isFirst) || (!vertical && isLast))\n ? radius\n : 0,\n borderBottomLeftRadius:\n disable !== 'bottom' &&\n disable !== 'start' &&\n ((vertical && isLast) || (!vertical && isFirst))\n ? radius\n : 0,\n borderBottomRightRadius:\n isLast && disable !== 'bottom' && disable !== 'end' ? radius : 0,\n }\n}\n\nconst cloneElementWithPropOrder = (child: any, props: Object) => {\n const next = mergeProps(child.props, props, false, getConfig().shorthands)[0]\n return React.cloneElement({ ...child, props: null }, next)\n}\n"],
5
+ "mappings": "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",
6
6
  "names": ["props", "React"]
7
7
  }
package/dist/esm/Group.js CHANGED
@@ -54,13 +54,14 @@ function createGroup(verticalDefault) {
54
54
  separator,
55
55
  scrollable,
56
56
  axis = verticalDefault ? "vertical" : "horizontal",
57
+ orientation = axis,
57
58
  disabled: disabledProp,
58
59
  disablePassBorderRadius: disablePassBorderRadiusProp,
59
60
  borderRadius,
60
61
  forceUseItem,
61
62
  ...restProps
62
63
  } = getExpandedShorthands(activeProps);
63
- const vertical = axis === "vertical";
64
+ const vertical = orientation === "vertical";
64
65
  const [itemChildrenCount, setItemChildrenCount] = useControllableState({
65
66
  defaultProp: forceUseItem ? 1 : 0
66
67
  });
@@ -111,7 +112,7 @@ function createGroup(verticalDefault) {
111
112
  GroupProvider,
112
113
  {
113
114
  disablePassBorderRadius,
114
- vertical: axis === "vertical",
115
+ vertical: orientation === "vertical",
115
116
  radius,
116
117
  disabled: disabledProp,
117
118
  onItemMount,
@@ -122,10 +123,10 @@ function createGroup(verticalDefault) {
122
123
  {
123
124
  ref,
124
125
  size,
125
- flexDirection: axis === "horizontal" ? "row" : "column",
126
+ flexDirection: orientation === "horizontal" ? "row" : "column",
126
127
  borderRadius,
127
128
  ...restProps,
128
- children: wrapScroll({ ...activeProps, axis }, indexedChildren)
129
+ children: wrapScroll({ ...activeProps, orientation }, indexedChildren)
129
130
  }
130
131
  )
131
132
  }
@@ -189,15 +190,15 @@ const useGroupItem = (childrenProps, __scopeGroup) => {
189
190
  const Group = createGroup(true);
190
191
  const YGroup = Group;
191
192
  const XGroup = createGroup(false);
192
- const wrapScroll = ({ scrollable, axis, showScrollIndicator = false }, children) => {
193
+ const wrapScroll = ({ scrollable, orientation, showScrollIndicator = false }, children) => {
193
194
  if (scrollable)
194
195
  return /* @__PURE__ */ jsx(
195
196
  ScrollView,
196
197
  {
197
- ...axis === "vertical" && {
198
+ ...orientation === "vertical" && {
198
199
  showsVerticalScrollIndicator: showScrollIndicator
199
200
  },
200
- ...axis === "horizontal" && {
201
+ ...orientation === "horizontal" && {
201
202
  horizontal: true,
202
203
  showsHorizontalScrollIndicator: showScrollIndicator
203
204
  },
package/dist/esm/Group.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Group.tsx"],
4
- "sourcesContent": ["import {\n GetProps,\n TamaguiElement,\n UnionableString,\n Variable,\n getConfig,\n getExpandedShorthands,\n getTokens,\n getVariableValue,\n isTamaguiElement,\n mergeProps,\n spacedChildren,\n styled,\n useMediaPropsActive,\n withStaticProperties,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport React, { Children, forwardRef, isValidElement } from 'react'\nimport { ScrollView } from 'react-native'\nimport { useIndex, useIndexedChildren } from 'reforest'\n\ntype DisablePassBorderRadius = boolean | 'bottom' | 'top' | 'start' | 'end'\n\ninterface GroupContextValue {\n vertical: boolean\n disablePassBorderRadius: DisablePassBorderRadius\n onItemMount: () => void\n onItemUnmount: () => void\n radius?: number | UnionableString | Variable<any>\n disabled?: boolean\n}\n\nconst GROUP_NAME = 'Group'\n\ntype ScopedProps<P> = P & { __scopeGroup?: Scope }\nconst [createGroupContext, createGroupScope] = createContextScope(GROUP_NAME)\nconst [GroupProvider, useGroupContext] = createGroupContext<GroupContextValue>(GROUP_NAME)\n\nexport const GroupFrame = styled(ThemeableStack, {\n name: 'GroupFrame',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n y: 0,\n backgroundColor: '$background',\n },\n },\n\n size: (val, { tokens }) => {\n const borderRadius = tokens.radius[val] ?? val ?? tokens.radius['$true']\n return {\n borderRadius,\n }\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\nexport type GroupProps = GetProps<typeof GroupFrame> & {\n axis?: 'horizontal' | 'vertical'\n\n scrollable?: boolean\n /**\n * @default false\n */\n showScrollIndicator?: boolean\n disabled?: boolean\n disablePassBorderRadius?: DisablePassBorderRadius\n /**\n * forces the group to use the Group.Item API\n */\n forceUseItem?: boolean\n}\n\nfunction createGroup(verticalDefault: boolean) {\n return withStaticProperties(\n forwardRef<TamaguiElement, ScopedProps<GroupProps>>((props, ref) => {\n const activeProps = useMediaPropsActive(props)\n\n const {\n __scopeGroup,\n children: childrenProp,\n space,\n size = '$true',\n spaceDirection,\n separator,\n scrollable,\n axis = verticalDefault ? 'vertical' : 'horizontal',\n disabled: disabledProp,\n disablePassBorderRadius: disablePassBorderRadiusProp,\n borderRadius,\n forceUseItem,\n ...restProps\n } = getExpandedShorthands(activeProps)\n\n const vertical = axis === 'vertical'\n const [itemChildrenCount, setItemChildrenCount] = useControllableState({\n defaultProp: forceUseItem ? 1 : 0,\n })\n const isUsingItems = true // itemChildrenCount > 0\n\n // 1 off given border to adjust for border radius? This should be user controllable\n const radius =\n borderRadius ??\n (size ? getVariableValue(getTokens().radius[size]) - 1 : undefined)\n\n const hasRadius = radius !== undefined\n const disablePassBorderRadius = disablePassBorderRadiusProp ?? !hasRadius\n\n if (!isUsingItems) console.log('screw up!')\n const childrenArray = Children.toArray(childrenProp)\n const children = isUsingItems\n ? childrenProp\n : childrenArray.map((child, i) => {\n if (!isValidElement(child)) {\n return child\n }\n const disabled = child.props.disabled ?? disabledProp\n\n const isFirst = i === 0\n const isLast = i === childrenArray.length - 1\n\n const radiusStyles =\n disablePassBorderRadius === true\n ? null\n : getBorderRadius({\n isFirst,\n isLast,\n radius,\n vertical,\n disable: disablePassBorderRadius,\n })\n const props = {\n disabled,\n ...(isTamaguiElement(child) ? radiusStyles : { style: radiusStyles }),\n }\n\n return cloneElementWithPropOrder(child, props)\n })\n\n const indexedChildren = useIndexedChildren(\n spacedChildren({\n direction: spaceDirection,\n separator,\n space,\n children,\n })\n )\n\n const onItemMount = React.useCallback(\n () => setItemChildrenCount((prev) => prev + 1),\n []\n )\n const onItemUnmount = React.useCallback(\n () => setItemChildrenCount((prev) => prev - 1),\n []\n )\n\n return (\n <GroupProvider\n disablePassBorderRadius={disablePassBorderRadius}\n vertical={axis === 'vertical'}\n radius={radius}\n disabled={disabledProp}\n onItemMount={onItemMount}\n onItemUnmount={onItemUnmount}\n scope={__scopeGroup}\n >\n <GroupFrame\n ref={ref}\n size={size}\n flexDirection={axis === 'horizontal' ? 'row' : 'column'}\n borderRadius={borderRadius}\n {...restProps}\n >\n {wrapScroll({ ...activeProps, axis }, indexedChildren)}\n </GroupFrame>\n </GroupProvider>\n )\n }),\n {\n Item: GroupItem,\n }\n )\n}\n\nconst GroupItem = (props: ScopedProps<{ children: React.ReactNode }>) => {\n const { __scopeGroup, children } = props\n const groupItemProps = useGroupItem(\n { disabled: isValidElement(children) ? children.props.disabled : undefined },\n __scopeGroup\n )\n\n if (!isValidElement(children)) {\n return children as any\n }\n\n if (isTamaguiElement(children)) {\n return React.cloneElement(children, groupItemProps)\n }\n\n return React.cloneElement(children, {\n style: {\n ...children.props?.['style'],\n ...groupItemProps,\n },\n } as any)\n}\n\nexport const useGroupItem = (\n childrenProps: { disabled: boolean },\n __scopeGroup?: Scope\n) => {\n const treeIndex = useIndex()\n const context = useGroupContext('GroupItem', __scopeGroup)\n\n React.useEffect(() => {\n context.onItemMount()\n return () => {\n context.onItemUnmount()\n }\n }, [])\n\n if (!treeIndex) {\n throw Error('<Group.Item/> should only be used within a <Group/>')\n }\n\n const isFirst = treeIndex.index === 0\n const isLast = treeIndex.index === treeIndex.maxIndex\n\n const disabled = childrenProps.disabled ?? context.disabled\n\n let propsToPass: Record<string, any> = {\n disabled,\n }\n\n if (context.disablePassBorderRadius !== true) {\n const borderRadius = getBorderRadius({\n radius: context.radius,\n isFirst,\n isLast,\n vertical: context.vertical,\n disable: context.disablePassBorderRadius,\n })\n return { ...propsToPass, ...borderRadius }\n }\n return propsToPass\n}\n\nexport const Group = createGroup(true)\nexport const YGroup = Group\nexport const XGroup = createGroup(false)\n\nconst wrapScroll = (\n { scrollable, axis, showScrollIndicator = false }: GroupProps,\n children: any\n) => {\n if (scrollable)\n return (\n <ScrollView\n {...(axis === 'vertical' && {\n showsVerticalScrollIndicator: showScrollIndicator,\n })}\n {...(axis === 'horizontal' && {\n horizontal: true,\n showsHorizontalScrollIndicator: showScrollIndicator,\n })}\n >\n {children}\n </ScrollView>\n )\n return children\n}\n\nconst getBorderRadius = ({\n isFirst,\n isLast,\n radius,\n vertical,\n disable,\n}: {\n radius: any\n vertical: boolean\n isFirst: boolean\n isLast: boolean\n disable: DisablePassBorderRadius\n}) => {\n // TODO: RTL support would be nice here\n return {\n borderTopLeftRadius: isFirst && disable !== 'top' && disable !== 'start' ? radius : 0,\n borderTopRightRadius:\n disable !== 'top' &&\n disable !== 'end' &&\n ((vertical && isFirst) || (!vertical && isLast))\n ? radius\n : 0,\n borderBottomLeftRadius:\n disable !== 'bottom' &&\n disable !== 'start' &&\n ((vertical && isLast) || (!vertical && isFirst))\n ? radius\n : 0,\n borderBottomRightRadius:\n isLast && disable !== 'bottom' && disable !== 'end' ? radius : 0,\n }\n}\n\nconst cloneElementWithPropOrder = (child: any, props: Object) => {\n const next = mergeProps(child.props, props, false, getConfig().shorthands)[0]\n return React.cloneElement({ ...child, props: null }, next)\n}\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import {\n GetProps,\n TamaguiElement,\n UnionableString,\n Variable,\n getConfig,\n getExpandedShorthands,\n getTokens,\n getVariableValue,\n isTamaguiElement,\n mergeProps,\n spacedChildren,\n styled,\n useMediaPropsActive,\n withStaticProperties,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport React, { Children, forwardRef, isValidElement } from 'react'\nimport { ScrollView } from 'react-native'\nimport { useIndex, useIndexedChildren } from 'reforest'\n\ntype DisablePassBorderRadius = boolean | 'bottom' | 'top' | 'start' | 'end'\n\ninterface GroupContextValue {\n vertical: boolean\n disablePassBorderRadius: DisablePassBorderRadius\n onItemMount: () => void\n onItemUnmount: () => void\n radius?: number | UnionableString | Variable<any>\n disabled?: boolean\n}\n\nconst GROUP_NAME = 'Group'\n\ntype ScopedProps<P> = P & { __scopeGroup?: Scope }\nconst [createGroupContext, createGroupScope] = createContextScope(GROUP_NAME)\nconst [GroupProvider, useGroupContext] = createGroupContext<GroupContextValue>(GROUP_NAME)\n\nexport const GroupFrame = styled(ThemeableStack, {\n name: 'GroupFrame',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n y: 0,\n backgroundColor: '$background',\n },\n },\n\n size: (val, { tokens }) => {\n const borderRadius = tokens.radius[val] ?? val ?? tokens.radius['$true']\n return {\n borderRadius,\n }\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\nexport type GroupProps = GetProps<typeof GroupFrame> & {\n /**\n * @deprecated use `orientation` instead\n */\n axis?: 'horizontal' | 'vertical'\n orientation?: 'horizontal' | 'vertical'\n scrollable?: boolean\n /**\n * @default false\n */\n showScrollIndicator?: boolean\n disabled?: boolean\n disablePassBorderRadius?: DisablePassBorderRadius\n /**\n * forces the group to use the Group.Item API\n */\n forceUseItem?: boolean\n}\n\nfunction createGroup(verticalDefault: boolean) {\n return withStaticProperties(\n forwardRef<TamaguiElement, ScopedProps<GroupProps>>((props, ref) => {\n const activeProps = useMediaPropsActive(props)\n\n const {\n __scopeGroup,\n children: childrenProp,\n space,\n size = '$true',\n spaceDirection,\n separator,\n scrollable,\n axis = verticalDefault ? 'vertical' : 'horizontal',\n orientation = axis,\n disabled: disabledProp,\n disablePassBorderRadius: disablePassBorderRadiusProp,\n borderRadius,\n forceUseItem,\n ...restProps\n } = getExpandedShorthands(activeProps)\n\n const vertical = orientation === 'vertical'\n const [itemChildrenCount, setItemChildrenCount] = useControllableState({\n defaultProp: forceUseItem ? 1 : 0,\n })\n const isUsingItems = true // itemChildrenCount > 0\n\n // 1 off given border to adjust for border radius? This should be user controllable\n const radius =\n borderRadius ??\n (size ? getVariableValue(getTokens().radius[size]) - 1 : undefined)\n\n const hasRadius = radius !== undefined\n const disablePassBorderRadius = disablePassBorderRadiusProp ?? !hasRadius\n\n if (!isUsingItems) console.log('screw up!')\n const childrenArray = Children.toArray(childrenProp)\n const children = isUsingItems\n ? childrenProp\n : childrenArray.map((child, i) => {\n if (!isValidElement(child)) {\n return child\n }\n const disabled = child.props.disabled ?? disabledProp\n\n const isFirst = i === 0\n const isLast = i === childrenArray.length - 1\n\n const radiusStyles =\n disablePassBorderRadius === true\n ? null\n : getBorderRadius({\n isFirst,\n isLast,\n radius,\n vertical,\n disable: disablePassBorderRadius,\n })\n const props = {\n disabled,\n ...(isTamaguiElement(child) ? radiusStyles : { style: radiusStyles }),\n }\n\n return cloneElementWithPropOrder(child, props)\n })\n\n const indexedChildren = useIndexedChildren(\n spacedChildren({\n direction: spaceDirection,\n separator,\n space,\n children,\n })\n )\n\n const onItemMount = React.useCallback(\n () => setItemChildrenCount((prev) => prev + 1),\n []\n )\n const onItemUnmount = React.useCallback(\n () => setItemChildrenCount((prev) => prev - 1),\n []\n )\n\n return (\n <GroupProvider\n disablePassBorderRadius={disablePassBorderRadius}\n vertical={orientation === 'vertical'}\n radius={radius}\n disabled={disabledProp}\n onItemMount={onItemMount}\n onItemUnmount={onItemUnmount}\n scope={__scopeGroup}\n >\n <GroupFrame\n ref={ref}\n size={size}\n flexDirection={orientation === 'horizontal' ? 'row' : 'column'}\n borderRadius={borderRadius}\n {...restProps}\n >\n {wrapScroll({ ...activeProps, orientation }, indexedChildren)}\n </GroupFrame>\n </GroupProvider>\n )\n }),\n {\n Item: GroupItem,\n }\n )\n}\n\nconst GroupItem = (props: ScopedProps<{ children: React.ReactNode }>) => {\n const { __scopeGroup, children } = props\n const groupItemProps = useGroupItem(\n { disabled: isValidElement(children) ? children.props.disabled : undefined },\n __scopeGroup\n )\n\n if (!isValidElement(children)) {\n return children as any\n }\n\n if (isTamaguiElement(children)) {\n return React.cloneElement(children, groupItemProps)\n }\n\n return React.cloneElement(children, {\n style: {\n ...children.props?.['style'],\n ...groupItemProps,\n },\n } as any)\n}\n\nexport const useGroupItem = (\n childrenProps: { disabled: boolean },\n __scopeGroup?: Scope\n) => {\n const treeIndex = useIndex()\n const context = useGroupContext('GroupItem', __scopeGroup)\n\n React.useEffect(() => {\n context.onItemMount()\n return () => {\n context.onItemUnmount()\n }\n }, [])\n\n if (!treeIndex) {\n throw Error('<Group.Item/> should only be used within a <Group/>')\n }\n\n const isFirst = treeIndex.index === 0\n const isLast = treeIndex.index === treeIndex.maxIndex\n\n const disabled = childrenProps.disabled ?? context.disabled\n\n let propsToPass: Record<string, any> = {\n disabled,\n }\n\n if (context.disablePassBorderRadius !== true) {\n const borderRadius = getBorderRadius({\n radius: context.radius,\n isFirst,\n isLast,\n vertical: context.vertical,\n disable: context.disablePassBorderRadius,\n })\n return { ...propsToPass, ...borderRadius }\n }\n return propsToPass\n}\n\nexport const Group = createGroup(true)\nexport const YGroup = Group\nexport const XGroup = createGroup(false)\n\nconst wrapScroll = (\n { scrollable, orientation, showScrollIndicator = false }: GroupProps,\n children: any\n) => {\n if (scrollable)\n return (\n <ScrollView\n {...(orientation === 'vertical' && {\n showsVerticalScrollIndicator: showScrollIndicator,\n })}\n {...(orientation === 'horizontal' && {\n horizontal: true,\n showsHorizontalScrollIndicator: showScrollIndicator,\n })}\n >\n {children}\n </ScrollView>\n )\n return children\n}\n\nconst getBorderRadius = ({\n isFirst,\n isLast,\n radius,\n vertical,\n disable,\n}: {\n radius: any\n vertical: boolean\n isFirst: boolean\n isLast: boolean\n disable: DisablePassBorderRadius\n}) => {\n // TODO: RTL support would be nice here\n return {\n borderTopLeftRadius: isFirst && disable !== 'top' && disable !== 'start' ? radius : 0,\n borderTopRightRadius:\n disable !== 'top' &&\n disable !== 'end' &&\n ((vertical && isFirst) || (!vertical && isLast))\n ? radius\n : 0,\n borderBottomLeftRadius:\n disable !== 'bottom' &&\n disable !== 'start' &&\n ((vertical && isLast) || (!vertical && isFirst))\n ? radius\n : 0,\n borderBottomRightRadius:\n isLast && disable !== 'bottom' && disable !== 'end' ? radius : 0,\n }\n}\n\nconst cloneElementWithPropOrder = (child: any, props: Object) => {\n const next = mergeProps(child.props, props, false, getConfig().shorthands)[0]\n return React.cloneElement({ ...child, props: null }, next)\n}\n"],
5
+ "mappings": "AAmLU;AAnLV;AAAA,EAKE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAgB,0BAA0B;AAC1C,SAAS,sBAAsB;AAC/B,SAAS,4BAA4B;AACrC,OAAO,SAAS,UAAU,YAAY,sBAAsB;AAC5D,SAAS,kBAAkB;AAC3B,SAAS,UAAU,0BAA0B;AAa7C,MAAM,aAAa;AAGnB,MAAM,CAAC,oBAAoB,gBAAgB,IAAI,mBAAmB,UAAU;AAC5E,MAAM,CAAC,eAAe,eAAe,IAAI,mBAAsC,UAAU;AAElF,MAAM,aAAa,OAAO,gBAAgB;AAAA,EAC/C,MAAM;AAAA,EAEN,UAAU;AAAA,IACR,UAAU;AAAA,MACR,OAAO;AAAA,QACL,MAAM;AAAA,QACN,GAAG;AAAA,QACH,iBAAiB;AAAA,MACnB;AAAA,IACF;AAAA,IAEA,MAAM,CAAC,KAAK,EAAE,OAAO,MAAM;AACzB,YAAM,eAAe,OAAO,OAAO,GAAG,KAAK,OAAO,OAAO,OAAO,OAAO;AACvE,aAAO;AAAA,QACL;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAAA,EAEA,iBAAiB;AAAA,IACf,UAAU;AAAA,EACZ;AACF,CAAC;AAqBD,SAAS,YAAY,iBAA0B;AAC7C,SAAO;AAAA,IACL,WAAoD,CAAC,OAAO,QAAQ;AAClE,YAAM,cAAc,oBAAoB,KAAK;AAE7C,YAAM;AAAA,QACJ;AAAA,QACA,UAAU;AAAA,QACV;AAAA,QACA,OAAO;AAAA,QACP;AAAA,QACA;AAAA,QACA;AAAA,QACA,OAAO,kBAAkB,aAAa;AAAA,QACtC,cAAc;AAAA,QACd,UAAU;AAAA,QACV,yBAAyB;AAAA,QACzB;AAAA,QACA;AAAA,QACA,GAAG;AAAA,MACL,IAAI,sBAAsB,WAAW;AAErC,YAAM,WAAW,gBAAgB;AACjC,YAAM,CAAC,mBAAmB,oBAAoB,IAAI,qBAAqB;AAAA,QACrE,aAAa,eAAe,IAAI;AAAA,MAClC,CAAC;AACD,YAAM,eAAe;AAGrB,YAAM,SACJ,iBACC,OAAO,iBAAiB,UAAU,EAAE,OAAO,IAAI,CAAC,IAAI,IAAI;AAE3D,YAAM,YAAY,WAAW;AAC7B,YAAM,0BAA0B,+BAA+B,CAAC;AAEhE,UAAI,CAAC;AAAc,gBAAQ,IAAI,WAAW;AAC1C,YAAM,gBAAgB,SAAS,QAAQ,YAAY;AACnD,YAAM,WAAW,eACb,eACA,cAAc,IAAI,CAAC,OAAO,MAAM;AAC9B,YAAI,CAAC,eAAe,KAAK,GAAG;AAC1B,iBAAO;AAAA,QACT;AACA,cAAM,WAAW,MAAM,MAAM,YAAY;AAEzC,cAAM,UAAU,MAAM;AACtB,cAAM,SAAS,MAAM,cAAc,SAAS;AAE5C,cAAM,eACJ,4BAA4B,OACxB,OACA,gBAAgB;AAAA,UACd;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA,SAAS;AAAA,QACX,CAAC;AACP,cAAMA,SAAQ;AAAA,UACZ;AAAA,UACA,GAAI,iBAAiB,KAAK,IAAI,eAAe,EAAE,OAAO,aAAa;AAAA,QACrE;AAEA,eAAO,0BAA0B,OAAOA,MAAK;AAAA,MAC/C,CAAC;AAEL,YAAM,kBAAkB;AAAA,QACtB,eAAe;AAAA,UACb,WAAW;AAAA,UACX;AAAA,UACA;AAAA,UACA;AAAA,QACF,CAAC;AAAA,MACH;AAEA,YAAM,cAAc,MAAM;AAAA,QACxB,MAAM,qBAAqB,CAAC,SAAS,OAAO,CAAC;AAAA,QAC7C,CAAC;AAAA,MACH;AACA,YAAM,gBAAgB,MAAM;AAAA,QAC1B,MAAM,qBAAqB,CAAC,SAAS,OAAO,CAAC;AAAA,QAC7C,CAAC;AAAA,MACH;AAEA,aACE;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,UAAU,gBAAgB;AAAA,UAC1B;AAAA,UACA,UAAU;AAAA,UACV;AAAA,UACA;AAAA,UACA,OAAO;AAAA,UAEP;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA,eAAe,gBAAgB,eAAe,QAAQ;AAAA,cACtD;AAAA,cACC,GAAG;AAAA,cAEH,qBAAW,EAAE,GAAG,aAAa,YAAY,GAAG,eAAe;AAAA;AAAA,UAC9D;AAAA;AAAA,MACF;AAAA,IAEJ,CAAC;AAAA,IACD;AAAA,MACE,MAAM;AAAA,IACR;AAAA,EACF;AACF;AAEA,MAAM,YAAY,CAAC,UAAsD;AArMzE;AAsME,QAAM,EAAE,cAAc,SAAS,IAAI;AACnC,QAAM,iBAAiB;AAAA,IACrB,EAAE,UAAU,eAAe,QAAQ,IAAI,SAAS,MAAM,WAAW,OAAU;AAAA,IAC3E;AAAA,EACF;AAEA,MAAI,CAAC,eAAe,QAAQ,GAAG;AAC7B,WAAO;AAAA,EACT;AAEA,MAAI,iBAAiB,QAAQ,GAAG;AAC9B,WAAO,MAAM,aAAa,UAAU,cAAc;AAAA,EACpD;AAEA,SAAO,MAAM,aAAa,UAAU;AAAA,IAClC,OAAO;AAAA,MACL,IAAG,cAAS,UAAT,mBAAiB;AAAA,MACpB,GAAG;AAAA,IACL;AAAA,EACF,CAAQ;AACV;AAEO,MAAM,eAAe,CAC1B,eACA,iBACG;AACH,QAAM,YAAY,SAAS;AAC3B,QAAM,UAAU,gBAAgB,aAAa,YAAY;AAEzD,QAAM,UAAU,MAAM;AACpB,YAAQ,YAAY;AACpB,WAAO,MAAM;AACX,cAAQ,cAAc;AAAA,IACxB;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,MAAI,CAAC,WAAW;AACd,UAAM,MAAM,qDAAqD;AAAA,EACnE;AAEA,QAAM,UAAU,UAAU,UAAU;AACpC,QAAM,SAAS,UAAU,UAAU,UAAU;AAE7C,QAAM,WAAW,cAAc,YAAY,QAAQ;AAEnD,MAAI,cAAmC;AAAA,IACrC;AAAA,EACF;AAEA,MAAI,QAAQ,4BAA4B,MAAM;AAC5C,UAAM,eAAe,gBAAgB;AAAA,MACnC,QAAQ,QAAQ;AAAA,MAChB;AAAA,MACA;AAAA,MACA,UAAU,QAAQ;AAAA,MAClB,SAAS,QAAQ;AAAA,IACnB,CAAC;AACD,WAAO,EAAE,GAAG,aAAa,GAAG,aAAa;AAAA,EAC3C;AACA,SAAO;AACT;AAEO,MAAM,QAAQ,YAAY,IAAI;AAC9B,MAAM,SAAS;AACf,MAAM,SAAS,YAAY,KAAK;AAEvC,MAAM,aAAa,CACjB,EAAE,YAAY,aAAa,sBAAsB,MAAM,GACvD,aACG;AACH,MAAI;AACF,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAI,gBAAgB,cAAc;AAAA,UACjC,8BAA8B;AAAA,QAChC;AAAA,QACC,GAAI,gBAAgB,gBAAgB;AAAA,UACnC,YAAY;AAAA,UACZ,gCAAgC;AAAA,QAClC;AAAA,QAEC;AAAA;AAAA,IACH;AAEJ,SAAO;AACT;AAEA,MAAM,kBAAkB,CAAC;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAMM;AAEJ,SAAO;AAAA,IACL,qBAAqB,WAAW,YAAY,SAAS,YAAY,UAAU,SAAS;AAAA,IACpF,sBACE,YAAY,SACZ,YAAY,UACV,YAAY,WAAa,CAAC,YAAY,UACpC,SACA;AAAA,IACN,wBACE,YAAY,YACZ,YAAY,YACV,YAAY,UAAY,CAAC,YAAY,WACnC,SACA;AAAA,IACN,yBACE,UAAU,YAAY,YAAY,YAAY,QAAQ,SAAS;AAAA,EACnE;AACF;AAEA,MAAM,4BAA4B,CAAC,OAAY,UAAkB;AAC/D,QAAM,OAAO,WAAW,MAAM,OAAO,OAAO,OAAO,UAAU,EAAE,UAAU,EAAE,CAAC;AAC5E,SAAO,MAAM,aAAa,EAAE,GAAG,OAAO,OAAO,KAAK,GAAG,IAAI;AAC3D;",
6
6
  "names": ["props"]
7
7
  }
package/dist/esm/Group.mjs CHANGED
@@ -54,13 +54,14 @@ function createGroup(verticalDefault) {
54
54
  separator,
55
55
  scrollable,
56
56
  axis = verticalDefault ? "vertical" : "horizontal",
57
+ orientation = axis,
57
58
  disabled: disabledProp,
58
59
  disablePassBorderRadius: disablePassBorderRadiusProp,
59
60
  borderRadius,
60
61
  forceUseItem,
61
62
  ...restProps
62
63
  } = getExpandedShorthands(activeProps);
63
- const vertical = axis === "vertical";
64
+ const vertical = orientation === "vertical";
64
65
  const [itemChildrenCount, setItemChildrenCount] = useControllableState({
65
66
  defaultProp: forceUseItem ? 1 : 0
66
67
  });
@@ -111,7 +112,7 @@ function createGroup(verticalDefault) {
111
112
  GroupProvider,
112
113
  {
113
114
  disablePassBorderRadius,
114
- vertical: axis === "vertical",
115
+ vertical: orientation === "vertical",
115
116
  radius,
116
117
  disabled: disabledProp,
117
118
  onItemMount,
@@ -122,10 +123,10 @@ function createGroup(verticalDefault) {
122
123
  {
123
124
  ref,
124
125
  size,
125
- flexDirection: axis === "horizontal" ? "row" : "column",
126
+ flexDirection: orientation === "horizontal" ? "row" : "column",
126
127
  borderRadius,
127
128
  ...restProps,
128
- children: wrapScroll({ ...activeProps, axis }, indexedChildren)
129
+ children: wrapScroll({ ...activeProps, orientation }, indexedChildren)
129
130
  }
130
131
  )
131
132
  }
@@ -189,15 +190,15 @@ const useGroupItem = (childrenProps, __scopeGroup) => {
189
190
  const Group = createGroup(true);
190
191
  const YGroup = Group;
191
192
  const XGroup = createGroup(false);
192
- const wrapScroll = ({ scrollable, axis, showScrollIndicator = false }, children) => {
193
+ const wrapScroll = ({ scrollable, orientation, showScrollIndicator = false }, children) => {
193
194
  if (scrollable)
194
195
  return /* @__PURE__ */ jsx(
195
196
  ScrollView,
196
197
  {
197
- ...axis === "vertical" && {
198
+ ...orientation === "vertical" && {
198
199
  showsVerticalScrollIndicator: showScrollIndicator
199
200
  },
200
- ...axis === "horizontal" && {
201
+ ...orientation === "horizontal" && {
201
202
  horizontal: true,
202
203
  showsHorizontalScrollIndicator: showScrollIndicator
203
204
  },
package/dist/esm/Group.mjs.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Group.tsx"],
4
- "sourcesContent": ["import {\n GetProps,\n TamaguiElement,\n UnionableString,\n Variable,\n getConfig,\n getExpandedShorthands,\n getTokens,\n getVariableValue,\n isTamaguiElement,\n mergeProps,\n spacedChildren,\n styled,\n useMediaPropsActive,\n withStaticProperties,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport React, { Children, forwardRef, isValidElement } from 'react'\nimport { ScrollView } from 'react-native'\nimport { useIndex, useIndexedChildren } from 'reforest'\n\ntype DisablePassBorderRadius = boolean | 'bottom' | 'top' | 'start' | 'end'\n\ninterface GroupContextValue {\n vertical: boolean\n disablePassBorderRadius: DisablePassBorderRadius\n onItemMount: () => void\n onItemUnmount: () => void\n radius?: number | UnionableString | Variable<any>\n disabled?: boolean\n}\n\nconst GROUP_NAME = 'Group'\n\ntype ScopedProps<P> = P & { __scopeGroup?: Scope }\nconst [createGroupContext, createGroupScope] = createContextScope(GROUP_NAME)\nconst [GroupProvider, useGroupContext] = createGroupContext<GroupContextValue>(GROUP_NAME)\n\nexport const GroupFrame = styled(ThemeableStack, {\n name: 'GroupFrame',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n y: 0,\n backgroundColor: '$background',\n },\n },\n\n size: (val, { tokens }) => {\n const borderRadius = tokens.radius[val] ?? val ?? tokens.radius['$true']\n return {\n borderRadius,\n }\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\nexport type GroupProps = GetProps<typeof GroupFrame> & {\n axis?: 'horizontal' | 'vertical'\n\n scrollable?: boolean\n /**\n * @default false\n */\n showScrollIndicator?: boolean\n disabled?: boolean\n disablePassBorderRadius?: DisablePassBorderRadius\n /**\n * forces the group to use the Group.Item API\n */\n forceUseItem?: boolean\n}\n\nfunction createGroup(verticalDefault: boolean) {\n return withStaticProperties(\n forwardRef<TamaguiElement, ScopedProps<GroupProps>>((props, ref) => {\n const activeProps = useMediaPropsActive(props)\n\n const {\n __scopeGroup,\n children: childrenProp,\n space,\n size = '$true',\n spaceDirection,\n separator,\n scrollable,\n axis = verticalDefault ? 'vertical' : 'horizontal',\n disabled: disabledProp,\n disablePassBorderRadius: disablePassBorderRadiusProp,\n borderRadius,\n forceUseItem,\n ...restProps\n } = getExpandedShorthands(activeProps)\n\n const vertical = axis === 'vertical'\n const [itemChildrenCount, setItemChildrenCount] = useControllableState({\n defaultProp: forceUseItem ? 1 : 0,\n })\n const isUsingItems = true // itemChildrenCount > 0\n\n // 1 off given border to adjust for border radius? This should be user controllable\n const radius =\n borderRadius ??\n (size ? getVariableValue(getTokens().radius[size]) - 1 : undefined)\n\n const hasRadius = radius !== undefined\n const disablePassBorderRadius = disablePassBorderRadiusProp ?? !hasRadius\n\n if (!isUsingItems) console.log('screw up!')\n const childrenArray = Children.toArray(childrenProp)\n const children = isUsingItems\n ? childrenProp\n : childrenArray.map((child, i) => {\n if (!isValidElement(child)) {\n return child\n }\n const disabled = child.props.disabled ?? disabledProp\n\n const isFirst = i === 0\n const isLast = i === childrenArray.length - 1\n\n const radiusStyles =\n disablePassBorderRadius === true\n ? null\n : getBorderRadius({\n isFirst,\n isLast,\n radius,\n vertical,\n disable: disablePassBorderRadius,\n })\n const props = {\n disabled,\n ...(isTamaguiElement(child) ? radiusStyles : { style: radiusStyles }),\n }\n\n return cloneElementWithPropOrder(child, props)\n })\n\n const indexedChildren = useIndexedChildren(\n spacedChildren({\n direction: spaceDirection,\n separator,\n space,\n children,\n })\n )\n\n const onItemMount = React.useCallback(\n () => setItemChildrenCount((prev) => prev + 1),\n []\n )\n const onItemUnmount = React.useCallback(\n () => setItemChildrenCount((prev) => prev - 1),\n []\n )\n\n return (\n <GroupProvider\n disablePassBorderRadius={disablePassBorderRadius}\n vertical={axis === 'vertical'}\n radius={radius}\n disabled={disabledProp}\n onItemMount={onItemMount}\n onItemUnmount={onItemUnmount}\n scope={__scopeGroup}\n >\n <GroupFrame\n ref={ref}\n size={size}\n flexDirection={axis === 'horizontal' ? 'row' : 'column'}\n borderRadius={borderRadius}\n {...restProps}\n >\n {wrapScroll({ ...activeProps, axis }, indexedChildren)}\n </GroupFrame>\n </GroupProvider>\n )\n }),\n {\n Item: GroupItem,\n }\n )\n}\n\nconst GroupItem = (props: ScopedProps<{ children: React.ReactNode }>) => {\n const { __scopeGroup, children } = props\n const groupItemProps = useGroupItem(\n { disabled: isValidElement(children) ? children.props.disabled : undefined },\n __scopeGroup\n )\n\n if (!isValidElement(children)) {\n return children as any\n }\n\n if (isTamaguiElement(children)) {\n return React.cloneElement(children, groupItemProps)\n }\n\n return React.cloneElement(children, {\n style: {\n ...children.props?.['style'],\n ...groupItemProps,\n },\n } as any)\n}\n\nexport const useGroupItem = (\n childrenProps: { disabled: boolean },\n __scopeGroup?: Scope\n) => {\n const treeIndex = useIndex()\n const context = useGroupContext('GroupItem', __scopeGroup)\n\n React.useEffect(() => {\n context.onItemMount()\n return () => {\n context.onItemUnmount()\n }\n }, [])\n\n if (!treeIndex) {\n throw Error('<Group.Item/> should only be used within a <Group/>')\n }\n\n const isFirst = treeIndex.index === 0\n const isLast = treeIndex.index === treeIndex.maxIndex\n\n const disabled = childrenProps.disabled ?? context.disabled\n\n let propsToPass: Record<string, any> = {\n disabled,\n }\n\n if (context.disablePassBorderRadius !== true) {\n const borderRadius = getBorderRadius({\n radius: context.radius,\n isFirst,\n isLast,\n vertical: context.vertical,\n disable: context.disablePassBorderRadius,\n })\n return { ...propsToPass, ...borderRadius }\n }\n return propsToPass\n}\n\nexport const Group = createGroup(true)\nexport const YGroup = Group\nexport const XGroup = createGroup(false)\n\nconst wrapScroll = (\n { scrollable, axis, showScrollIndicator = false }: GroupProps,\n children: any\n) => {\n if (scrollable)\n return (\n <ScrollView\n {...(axis === 'vertical' && {\n showsVerticalScrollIndicator: showScrollIndicator,\n })}\n {...(axis === 'horizontal' && {\n horizontal: true,\n showsHorizontalScrollIndicator: showScrollIndicator,\n })}\n >\n {children}\n </ScrollView>\n )\n return children\n}\n\nconst getBorderRadius = ({\n isFirst,\n isLast,\n radius,\n vertical,\n disable,\n}: {\n radius: any\n vertical: boolean\n isFirst: boolean\n isLast: boolean\n disable: DisablePassBorderRadius\n}) => {\n // TODO: RTL support would be nice here\n return {\n borderTopLeftRadius: isFirst && disable !== 'top' && disable !== 'start' ? radius : 0,\n borderTopRightRadius:\n disable !== 'top' &&\n disable !== 'end' &&\n ((vertical && isFirst) || (!vertical && isLast))\n ? radius\n : 0,\n borderBottomLeftRadius:\n disable !== 'bottom' &&\n disable !== 'start' &&\n ((vertical && isLast) || (!vertical && isFirst))\n ? radius\n : 0,\n borderBottomRightRadius:\n isLast && disable !== 'bottom' && disable !== 'end' ? radius : 0,\n }\n}\n\nconst cloneElementWithPropOrder = (child: any, props: Object) => {\n const next = mergeProps(child.props, props, false, getConfig().shorthands)[0]\n return React.cloneElement({ ...child, props: null }, next)\n}\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import {\n GetProps,\n TamaguiElement,\n UnionableString,\n Variable,\n getConfig,\n getExpandedShorthands,\n getTokens,\n getVariableValue,\n isTamaguiElement,\n mergeProps,\n spacedChildren,\n styled,\n useMediaPropsActive,\n withStaticProperties,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport React, { Children, forwardRef, isValidElement } from 'react'\nimport { ScrollView } from 'react-native'\nimport { useIndex, useIndexedChildren } from 'reforest'\n\ntype DisablePassBorderRadius = boolean | 'bottom' | 'top' | 'start' | 'end'\n\ninterface GroupContextValue {\n vertical: boolean\n disablePassBorderRadius: DisablePassBorderRadius\n onItemMount: () => void\n onItemUnmount: () => void\n radius?: number | UnionableString | Variable<any>\n disabled?: boolean\n}\n\nconst GROUP_NAME = 'Group'\n\ntype ScopedProps<P> = P & { __scopeGroup?: Scope }\nconst [createGroupContext, createGroupScope] = createContextScope(GROUP_NAME)\nconst [GroupProvider, useGroupContext] = createGroupContext<GroupContextValue>(GROUP_NAME)\n\nexport const GroupFrame = styled(ThemeableStack, {\n name: 'GroupFrame',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n y: 0,\n backgroundColor: '$background',\n },\n },\n\n size: (val, { tokens }) => {\n const borderRadius = tokens.radius[val] ?? val ?? tokens.radius['$true']\n return {\n borderRadius,\n }\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\nexport type GroupProps = GetProps<typeof GroupFrame> & {\n /**\n * @deprecated use `orientation` instead\n */\n axis?: 'horizontal' | 'vertical'\n orientation?: 'horizontal' | 'vertical'\n scrollable?: boolean\n /**\n * @default false\n */\n showScrollIndicator?: boolean\n disabled?: boolean\n disablePassBorderRadius?: DisablePassBorderRadius\n /**\n * forces the group to use the Group.Item API\n */\n forceUseItem?: boolean\n}\n\nfunction createGroup(verticalDefault: boolean) {\n return withStaticProperties(\n forwardRef<TamaguiElement, ScopedProps<GroupProps>>((props, ref) => {\n const activeProps = useMediaPropsActive(props)\n\n const {\n __scopeGroup,\n children: childrenProp,\n space,\n size = '$true',\n spaceDirection,\n separator,\n scrollable,\n axis = verticalDefault ? 'vertical' : 'horizontal',\n orientation = axis,\n disabled: disabledProp,\n disablePassBorderRadius: disablePassBorderRadiusProp,\n borderRadius,\n forceUseItem,\n ...restProps\n } = getExpandedShorthands(activeProps)\n\n const vertical = orientation === 'vertical'\n const [itemChildrenCount, setItemChildrenCount] = useControllableState({\n defaultProp: forceUseItem ? 1 : 0,\n })\n const isUsingItems = true // itemChildrenCount > 0\n\n // 1 off given border to adjust for border radius? This should be user controllable\n const radius =\n borderRadius ??\n (size ? getVariableValue(getTokens().radius[size]) - 1 : undefined)\n\n const hasRadius = radius !== undefined\n const disablePassBorderRadius = disablePassBorderRadiusProp ?? !hasRadius\n\n if (!isUsingItems) console.log('screw up!')\n const childrenArray = Children.toArray(childrenProp)\n const children = isUsingItems\n ? childrenProp\n : childrenArray.map((child, i) => {\n if (!isValidElement(child)) {\n return child\n }\n const disabled = child.props.disabled ?? disabledProp\n\n const isFirst = i === 0\n const isLast = i === childrenArray.length - 1\n\n const radiusStyles =\n disablePassBorderRadius === true\n ? null\n : getBorderRadius({\n isFirst,\n isLast,\n radius,\n vertical,\n disable: disablePassBorderRadius,\n })\n const props = {\n disabled,\n ...(isTamaguiElement(child) ? radiusStyles : { style: radiusStyles }),\n }\n\n return cloneElementWithPropOrder(child, props)\n })\n\n const indexedChildren = useIndexedChildren(\n spacedChildren({\n direction: spaceDirection,\n separator,\n space,\n children,\n })\n )\n\n const onItemMount = React.useCallback(\n () => setItemChildrenCount((prev) => prev + 1),\n []\n )\n const onItemUnmount = React.useCallback(\n () => setItemChildrenCount((prev) => prev - 1),\n []\n )\n\n return (\n <GroupProvider\n disablePassBorderRadius={disablePassBorderRadius}\n vertical={orientation === 'vertical'}\n radius={radius}\n disabled={disabledProp}\n onItemMount={onItemMount}\n onItemUnmount={onItemUnmount}\n scope={__scopeGroup}\n >\n <GroupFrame\n ref={ref}\n size={size}\n flexDirection={orientation === 'horizontal' ? 'row' : 'column'}\n borderRadius={borderRadius}\n {...restProps}\n >\n {wrapScroll({ ...activeProps, orientation }, indexedChildren)}\n </GroupFrame>\n </GroupProvider>\n )\n }),\n {\n Item: GroupItem,\n }\n )\n}\n\nconst GroupItem = (props: ScopedProps<{ children: React.ReactNode }>) => {\n const { __scopeGroup, children } = props\n const groupItemProps = useGroupItem(\n { disabled: isValidElement(children) ? children.props.disabled : undefined },\n __scopeGroup\n )\n\n if (!isValidElement(children)) {\n return children as any\n }\n\n if (isTamaguiElement(children)) {\n return React.cloneElement(children, groupItemProps)\n }\n\n return React.cloneElement(children, {\n style: {\n ...children.props?.['style'],\n ...groupItemProps,\n },\n } as any)\n}\n\nexport const useGroupItem = (\n childrenProps: { disabled: boolean },\n __scopeGroup?: Scope\n) => {\n const treeIndex = useIndex()\n const context = useGroupContext('GroupItem', __scopeGroup)\n\n React.useEffect(() => {\n context.onItemMount()\n return () => {\n context.onItemUnmount()\n }\n }, [])\n\n if (!treeIndex) {\n throw Error('<Group.Item/> should only be used within a <Group/>')\n }\n\n const isFirst = treeIndex.index === 0\n const isLast = treeIndex.index === treeIndex.maxIndex\n\n const disabled = childrenProps.disabled ?? context.disabled\n\n let propsToPass: Record<string, any> = {\n disabled,\n }\n\n if (context.disablePassBorderRadius !== true) {\n const borderRadius = getBorderRadius({\n radius: context.radius,\n isFirst,\n isLast,\n vertical: context.vertical,\n disable: context.disablePassBorderRadius,\n })\n return { ...propsToPass, ...borderRadius }\n }\n return propsToPass\n}\n\nexport const Group = createGroup(true)\nexport const YGroup = Group\nexport const XGroup = createGroup(false)\n\nconst wrapScroll = (\n { scrollable, orientation, showScrollIndicator = false }: GroupProps,\n children: any\n) => {\n if (scrollable)\n return (\n <ScrollView\n {...(orientation === 'vertical' && {\n showsVerticalScrollIndicator: showScrollIndicator,\n })}\n {...(orientation === 'horizontal' && {\n horizontal: true,\n showsHorizontalScrollIndicator: showScrollIndicator,\n })}\n >\n {children}\n </ScrollView>\n )\n return children\n}\n\nconst getBorderRadius = ({\n isFirst,\n isLast,\n radius,\n vertical,\n disable,\n}: {\n radius: any\n vertical: boolean\n isFirst: boolean\n isLast: boolean\n disable: DisablePassBorderRadius\n}) => {\n // TODO: RTL support would be nice here\n return {\n borderTopLeftRadius: isFirst && disable !== 'top' && disable !== 'start' ? radius : 0,\n borderTopRightRadius:\n disable !== 'top' &&\n disable !== 'end' &&\n ((vertical && isFirst) || (!vertical && isLast))\n ? radius\n : 0,\n borderBottomLeftRadius:\n disable !== 'bottom' &&\n disable !== 'start' &&\n ((vertical && isLast) || (!vertical && isFirst))\n ? radius\n : 0,\n borderBottomRightRadius:\n isLast && disable !== 'bottom' && disable !== 'end' ? radius : 0,\n }\n}\n\nconst cloneElementWithPropOrder = (child: any, props: Object) => {\n const next = mergeProps(child.props, props, false, getConfig().shorthands)[0]\n return React.cloneElement({ ...child, props: null }, next)\n}\n"],
5
+ "mappings": "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",
6
6
  "names": ["props"]
7
7
  }
package/dist/jsx/Group.js CHANGED
@@ -53,13 +53,14 @@ function createGroup(verticalDefault) {
53
53
  separator,
54
54
  scrollable,
55
55
  axis = verticalDefault ? "vertical" : "horizontal",
56
+ orientation = axis,
56
57
  disabled: disabledProp,
57
58
  disablePassBorderRadius: disablePassBorderRadiusProp,
58
59
  borderRadius,
59
60
  forceUseItem,
60
61
  ...restProps
61
62
  } = getExpandedShorthands(activeProps);
62
- const vertical = axis === "vertical";
63
+ const vertical = orientation === "vertical";
63
64
  const [itemChildrenCount, setItemChildrenCount] = useControllableState({
64
65
  defaultProp: forceUseItem ? 1 : 0
65
66
  });
@@ -108,7 +109,7 @@ function createGroup(verticalDefault) {
108
109
  );
109
110
  return <GroupProvider
110
111
  disablePassBorderRadius={disablePassBorderRadius}
111
- vertical={axis === "vertical"}
112
+ vertical={orientation === "vertical"}
112
113
  radius={radius}
113
114
  disabled={disabledProp}
114
115
  onItemMount={onItemMount}
@@ -117,10 +118,10 @@ function createGroup(verticalDefault) {
117
118
  ><GroupFrame
118
119
  ref={ref}
119
120
  size={size}
120
- flexDirection={axis === "horizontal" ? "row" : "column"}
121
+ flexDirection={orientation === "horizontal" ? "row" : "column"}
121
122
  borderRadius={borderRadius}
122
123
  {...restProps}
123
- >{wrapScroll({ ...activeProps, axis }, indexedChildren)}</GroupFrame></GroupProvider>;
124
+ >{wrapScroll({ ...activeProps, orientation }, indexedChildren)}</GroupFrame></GroupProvider>;
124
125
  }),
125
126
  {
126
127
  Item: GroupItem
@@ -179,13 +180,13 @@ const useGroupItem = (childrenProps, __scopeGroup) => {
179
180
  const Group = createGroup(true);
180
181
  const YGroup = Group;
181
182
  const XGroup = createGroup(false);
182
- const wrapScroll = ({ scrollable, axis, showScrollIndicator = false }, children) => {
183
+ const wrapScroll = ({ scrollable, orientation, showScrollIndicator = false }, children) => {
183
184
  if (scrollable)
184
185
  return <ScrollView
185
- {...axis === "vertical" && {
186
+ {...orientation === "vertical" && {
186
187
  showsVerticalScrollIndicator: showScrollIndicator
187
188
  }}
188
- {...axis === "horizontal" && {
189
+ {...orientation === "horizontal" && {
189
190
  horizontal: true,
190
191
  showsHorizontalScrollIndicator: showScrollIndicator
191
192
  }}
package/dist/jsx/Group.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Group.tsx"],
4
- "sourcesContent": ["import {\n GetProps,\n TamaguiElement,\n UnionableString,\n Variable,\n getConfig,\n getExpandedShorthands,\n getTokens,\n getVariableValue,\n isTamaguiElement,\n mergeProps,\n spacedChildren,\n styled,\n useMediaPropsActive,\n withStaticProperties,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport React, { Children, forwardRef, isValidElement } from 'react'\nimport { ScrollView } from 'react-native'\nimport { useIndex, useIndexedChildren } from 'reforest'\n\ntype DisablePassBorderRadius = boolean | 'bottom' | 'top' | 'start' | 'end'\n\ninterface GroupContextValue {\n vertical: boolean\n disablePassBorderRadius: DisablePassBorderRadius\n onItemMount: () => void\n onItemUnmount: () => void\n radius?: number | UnionableString | Variable<any>\n disabled?: boolean\n}\n\nconst GROUP_NAME = 'Group'\n\ntype ScopedProps<P> = P & { __scopeGroup?: Scope }\nconst [createGroupContext, createGroupScope] = createContextScope(GROUP_NAME)\nconst [GroupProvider, useGroupContext] = createGroupContext<GroupContextValue>(GROUP_NAME)\n\nexport const GroupFrame = styled(ThemeableStack, {\n name: 'GroupFrame',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n y: 0,\n backgroundColor: '$background',\n },\n },\n\n size: (val, { tokens }) => {\n const borderRadius = tokens.radius[val] ?? val ?? tokens.radius['$true']\n return {\n borderRadius,\n }\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\nexport type GroupProps = GetProps<typeof GroupFrame> & {\n axis?: 'horizontal' | 'vertical'\n\n scrollable?: boolean\n /**\n * @default false\n */\n showScrollIndicator?: boolean\n disabled?: boolean\n disablePassBorderRadius?: DisablePassBorderRadius\n /**\n * forces the group to use the Group.Item API\n */\n forceUseItem?: boolean\n}\n\nfunction createGroup(verticalDefault: boolean) {\n return withStaticProperties(\n forwardRef<TamaguiElement, ScopedProps<GroupProps>>((props, ref) => {\n const activeProps = useMediaPropsActive(props)\n\n const {\n __scopeGroup,\n children: childrenProp,\n space,\n size = '$true',\n spaceDirection,\n separator,\n scrollable,\n axis = verticalDefault ? 'vertical' : 'horizontal',\n disabled: disabledProp,\n disablePassBorderRadius: disablePassBorderRadiusProp,\n borderRadius,\n forceUseItem,\n ...restProps\n } = getExpandedShorthands(activeProps)\n\n const vertical = axis === 'vertical'\n const [itemChildrenCount, setItemChildrenCount] = useControllableState({\n defaultProp: forceUseItem ? 1 : 0,\n })\n const isUsingItems = true // itemChildrenCount > 0\n\n // 1 off given border to adjust for border radius? This should be user controllable\n const radius =\n borderRadius ??\n (size ? getVariableValue(getTokens().radius[size]) - 1 : undefined)\n\n const hasRadius = radius !== undefined\n const disablePassBorderRadius = disablePassBorderRadiusProp ?? !hasRadius\n\n if (!isUsingItems) console.log('screw up!')\n const childrenArray = Children.toArray(childrenProp)\n const children = isUsingItems\n ? childrenProp\n : childrenArray.map((child, i) => {\n if (!isValidElement(child)) {\n return child\n }\n const disabled = child.props.disabled ?? disabledProp\n\n const isFirst = i === 0\n const isLast = i === childrenArray.length - 1\n\n const radiusStyles =\n disablePassBorderRadius === true\n ? null\n : getBorderRadius({\n isFirst,\n isLast,\n radius,\n vertical,\n disable: disablePassBorderRadius,\n })\n const props = {\n disabled,\n ...(isTamaguiElement(child) ? radiusStyles : { style: radiusStyles }),\n }\n\n return cloneElementWithPropOrder(child, props)\n })\n\n const indexedChildren = useIndexedChildren(\n spacedChildren({\n direction: spaceDirection,\n separator,\n space,\n children,\n })\n )\n\n const onItemMount = React.useCallback(\n () => setItemChildrenCount((prev) => prev + 1),\n []\n )\n const onItemUnmount = React.useCallback(\n () => setItemChildrenCount((prev) => prev - 1),\n []\n )\n\n return (\n <GroupProvider\n disablePassBorderRadius={disablePassBorderRadius}\n vertical={axis === 'vertical'}\n radius={radius}\n disabled={disabledProp}\n onItemMount={onItemMount}\n onItemUnmount={onItemUnmount}\n scope={__scopeGroup}\n >\n <GroupFrame\n ref={ref}\n size={size}\n flexDirection={axis === 'horizontal' ? 'row' : 'column'}\n borderRadius={borderRadius}\n {...restProps}\n >\n {wrapScroll({ ...activeProps, axis }, indexedChildren)}\n </GroupFrame>\n </GroupProvider>\n )\n }),\n {\n Item: GroupItem,\n }\n )\n}\n\nconst GroupItem = (props: ScopedProps<{ children: React.ReactNode }>) => {\n const { __scopeGroup, children } = props\n const groupItemProps = useGroupItem(\n { disabled: isValidElement(children) ? children.props.disabled : undefined },\n __scopeGroup\n )\n\n if (!isValidElement(children)) {\n return children as any\n }\n\n if (isTamaguiElement(children)) {\n return React.cloneElement(children, groupItemProps)\n }\n\n return React.cloneElement(children, {\n style: {\n ...children.props?.['style'],\n ...groupItemProps,\n },\n } as any)\n}\n\nexport const useGroupItem = (\n childrenProps: { disabled: boolean },\n __scopeGroup?: Scope\n) => {\n const treeIndex = useIndex()\n const context = useGroupContext('GroupItem', __scopeGroup)\n\n React.useEffect(() => {\n context.onItemMount()\n return () => {\n context.onItemUnmount()\n }\n }, [])\n\n if (!treeIndex) {\n throw Error('<Group.Item/> should only be used within a <Group/>')\n }\n\n const isFirst = treeIndex.index === 0\n const isLast = treeIndex.index === treeIndex.maxIndex\n\n const disabled = childrenProps.disabled ?? context.disabled\n\n let propsToPass: Record<string, any> = {\n disabled,\n }\n\n if (context.disablePassBorderRadius !== true) {\n const borderRadius = getBorderRadius({\n radius: context.radius,\n isFirst,\n isLast,\n vertical: context.vertical,\n disable: context.disablePassBorderRadius,\n })\n return { ...propsToPass, ...borderRadius }\n }\n return propsToPass\n}\n\nexport const Group = createGroup(true)\nexport const YGroup = Group\nexport const XGroup = createGroup(false)\n\nconst wrapScroll = (\n { scrollable, axis, showScrollIndicator = false }: GroupProps,\n children: any\n) => {\n if (scrollable)\n return (\n <ScrollView\n {...(axis === 'vertical' && {\n showsVerticalScrollIndicator: showScrollIndicator,\n })}\n {...(axis === 'horizontal' && {\n horizontal: true,\n showsHorizontalScrollIndicator: showScrollIndicator,\n })}\n >\n {children}\n </ScrollView>\n )\n return children\n}\n\nconst getBorderRadius = ({\n isFirst,\n isLast,\n radius,\n vertical,\n disable,\n}: {\n radius: any\n vertical: boolean\n isFirst: boolean\n isLast: boolean\n disable: DisablePassBorderRadius\n}) => {\n // TODO: RTL support would be nice here\n return {\n borderTopLeftRadius: isFirst && disable !== 'top' && disable !== 'start' ? radius : 0,\n borderTopRightRadius:\n disable !== 'top' &&\n disable !== 'end' &&\n ((vertical && isFirst) || (!vertical && isLast))\n ? radius\n : 0,\n borderBottomLeftRadius:\n disable !== 'bottom' &&\n disable !== 'start' &&\n ((vertical && isLast) || (!vertical && isFirst))\n ? radius\n : 0,\n borderBottomRightRadius:\n isLast && disable !== 'bottom' && disable !== 'end' ? radius : 0,\n }\n}\n\nconst cloneElementWithPropOrder = (child: any, props: Object) => {\n const next = mergeProps(child.props, props, false, getConfig().shorthands)[0]\n return React.cloneElement({ ...child, props: null }, next)\n}\n"],
5
- "mappings": "AAAA;AAAA,EAKE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAgB,0BAA0B;AAC1C,SAAS,sBAAsB;AAC/B,SAAS,4BAA4B;AACrC,OAAO,SAAS,UAAU,YAAY,sBAAsB;AAC5D,SAAS,kBAAkB;AAC3B,SAAS,UAAU,0BAA0B;AAa7C,MAAM,aAAa;AAGnB,MAAM,CAAC,oBAAoB,gBAAgB,IAAI,mBAAmB,UAAU;AAC5E,MAAM,CAAC,eAAe,eAAe,IAAI,mBAAsC,UAAU;AAElF,MAAM,aAAa,OAAO,gBAAgB;AAAA,EAC/C,MAAM;AAAA,EAEN,UAAU;AAAA,IACR,UAAU;AAAA,MACR,OAAO;AAAA,QACL,MAAM;AAAA,QACN,GAAG;AAAA,QACH,iBAAiB;AAAA,MACnB;AAAA,IACF;AAAA,IAEA,MAAM,CAAC,KAAK,EAAE,OAAO,MAAM;AACzB,YAAM,eAAe,OAAO,OAAO,GAAG,KAAK,OAAO,OAAO,OAAO,OAAO;AACvE,aAAO;AAAA,QACL;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAAA,EAEA,iBAAiB;AAAA,IACf,UAAU;AAAA,EACZ;AACF,CAAC;AAkBD,SAAS,YAAY,iBAA0B;AAC7C,SAAO;AAAA,IACL,WAAoD,CAAC,OAAO,QAAQ;AAClE,YAAM,cAAc,oBAAoB,KAAK;AAE7C,YAAM;AAAA,QACJ;AAAA,QACA,UAAU;AAAA,QACV;AAAA,QACA,OAAO;AAAA,QACP;AAAA,QACA;AAAA,QACA;AAAA,QACA,OAAO,kBAAkB,aAAa;AAAA,QACtC,UAAU;AAAA,QACV,yBAAyB;AAAA,QACzB;AAAA,QACA;AAAA,QACA,GAAG;AAAA,MACL,IAAI,sBAAsB,WAAW;AAErC,YAAM,WAAW,SAAS;AAC1B,YAAM,CAAC,mBAAmB,oBAAoB,IAAI,qBAAqB;AAAA,QACrE,aAAa,eAAe,IAAI;AAAA,MAClC,CAAC;AACD,YAAM,eAAe;AAGrB,YAAM,SACJ,iBACC,OAAO,iBAAiB,UAAU,EAAE,OAAO,IAAI,CAAC,IAAI,IAAI;AAE3D,YAAM,YAAY,WAAW;AAC7B,YAAM,0BAA0B,+BAA+B,CAAC;AAEhE,UAAI,CAAC;AAAc,gBAAQ,IAAI,WAAW;AAC1C,YAAM,gBAAgB,SAAS,QAAQ,YAAY;AACnD,YAAM,WAAW,eACb,eACA,cAAc,IAAI,CAAC,OAAO,MAAM;AAC9B,YAAI,CAAC,eAAe,KAAK,GAAG;AAC1B,iBAAO;AAAA,QACT;AACA,cAAM,WAAW,MAAM,MAAM,YAAY;AAEzC,cAAM,UAAU,MAAM;AACtB,cAAM,SAAS,MAAM,cAAc,SAAS;AAE5C,cAAM,eACJ,4BAA4B,OACxB,OACA,gBAAgB;AAAA,UACd;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA,SAAS;AAAA,QACX,CAAC;AACP,cAAMA,SAAQ;AAAA,UACZ;AAAA,UACA,GAAI,iBAAiB,KAAK,IAAI,eAAe,EAAE,OAAO,aAAa;AAAA,QACrE;AAEA,eAAO,0BAA0B,OAAOA,MAAK;AAAA,MAC/C,CAAC;AAEL,YAAM,kBAAkB;AAAA,QACtB,eAAe;AAAA,UACb,WAAW;AAAA,UACX;AAAA,UACA;AAAA,UACA;AAAA,QACF,CAAC;AAAA,MACH;AAEA,YAAM,cAAc,MAAM;AAAA,QACxB,MAAM,qBAAqB,CAAC,SAAS,OAAO,CAAC;AAAA,QAC7C,CAAC;AAAA,MACH;AACA,YAAM,gBAAgB,MAAM;AAAA,QAC1B,MAAM,qBAAqB,CAAC,SAAS,OAAO,CAAC;AAAA,QAC7C,CAAC;AAAA,MACH;AAEA,aACE,CAAC;AAAA,QACC,yBAAyB;AAAA,QACzB,UAAU,SAAS;AAAA,QACnB,QAAQ;AAAA,QACR,UAAU;AAAA,QACV,aAAa;AAAA,QACb,eAAe;AAAA,QACf,OAAO;AAAA,OAEP,CAAC;AAAA,QACC,KAAK;AAAA,QACL,MAAM;AAAA,QACN,eAAe,SAAS,eAAe,QAAQ;AAAA,QAC/C,cAAc;AAAA,YACV;AAAA,QAEH,WAAW,EAAE,GAAG,aAAa,KAAK,GAAG,eAAe,EACvD,EARC,WASH,EAlBC;AAAA,IAoBL,CAAC;AAAA,IACD;AAAA,MACE,MAAM;AAAA,IACR;AAAA,EACF;AACF;AAEA,MAAM,YAAY,CAAC,UAAsD;AACvE,QAAM,EAAE,cAAc,SAAS,IAAI;AACnC,QAAM,iBAAiB;AAAA,IACrB,EAAE,UAAU,eAAe,QAAQ,IAAI,SAAS,MAAM,WAAW,OAAU;AAAA,IAC3E;AAAA,EACF;AAEA,MAAI,CAAC,eAAe,QAAQ,GAAG;AAC7B,WAAO;AAAA,EACT;AAEA,MAAI,iBAAiB,QAAQ,GAAG;AAC9B,WAAO,MAAM,aAAa,UAAU,cAAc;AAAA,EACpD;AAEA,SAAO,MAAM,aAAa,UAAU;AAAA,IAClC,OAAO;AAAA,MACL,GAAG,SAAS,QAAQ,OAAO;AAAA,MAC3B,GAAG;AAAA,IACL;AAAA,EACF,CAAQ;AACV;AAEO,MAAM,eAAe,CAC1B,eACA,iBACG;AACH,QAAM,YAAY,SAAS;AAC3B,QAAM,UAAU,gBAAgB,aAAa,YAAY;AAEzD,QAAM,UAAU,MAAM;AACpB,YAAQ,YAAY;AACpB,WAAO,MAAM;AACX,cAAQ,cAAc;AAAA,IACxB;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,MAAI,CAAC,WAAW;AACd,UAAM,MAAM,qDAAqD;AAAA,EACnE;AAEA,QAAM,UAAU,UAAU,UAAU;AACpC,QAAM,SAAS,UAAU,UAAU,UAAU;AAE7C,QAAM,WAAW,cAAc,YAAY,QAAQ;AAEnD,MAAI,cAAmC;AAAA,IACrC;AAAA,EACF;AAEA,MAAI,QAAQ,4BAA4B,MAAM;AAC5C,UAAM,eAAe,gBAAgB;AAAA,MACnC,QAAQ,QAAQ;AAAA,MAChB;AAAA,MACA;AAAA,MACA,UAAU,QAAQ;AAAA,MAClB,SAAS,QAAQ;AAAA,IACnB,CAAC;AACD,WAAO,EAAE,GAAG,aAAa,GAAG,aAAa;AAAA,EAC3C;AACA,SAAO;AACT;AAEO,MAAM,QAAQ,YAAY,IAAI;AAC9B,MAAM,SAAS;AACf,MAAM,SAAS,YAAY,KAAK;AAEvC,MAAM,aAAa,CACjB,EAAE,YAAY,MAAM,sBAAsB,MAAM,GAChD,aACG;AACH,MAAI;AACF,WACE,CAAC;AAAA,UACM,SAAS,cAAc;AAAA,QAC1B,8BAA8B;AAAA,MAChC;AAAA,UACK,SAAS,gBAAgB;AAAA,QAC5B,YAAY;AAAA,QACZ,gCAAgC;AAAA,MAClC;AAAA,MAEC,SACH,EAVC;AAYL,SAAO;AACT;AAEA,MAAM,kBAAkB,CAAC;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAMM;AAEJ,SAAO;AAAA,IACL,qBAAqB,WAAW,YAAY,SAAS,YAAY,UAAU,SAAS;AAAA,IACpF,sBACE,YAAY,SACZ,YAAY,UACV,YAAY,WAAa,CAAC,YAAY,UACpC,SACA;AAAA,IACN,wBACE,YAAY,YACZ,YAAY,YACV,YAAY,UAAY,CAAC,YAAY,WACnC,SACA;AAAA,IACN,yBACE,UAAU,YAAY,YAAY,YAAY,QAAQ,SAAS;AAAA,EACnE;AACF;AAEA,MAAM,4BAA4B,CAAC,OAAY,UAAkB;AAC/D,QAAM,OAAO,WAAW,MAAM,OAAO,OAAO,OAAO,UAAU,EAAE,UAAU,EAAE,CAAC;AAC5E,SAAO,MAAM,aAAa,EAAE,GAAG,OAAO,OAAO,KAAK,GAAG,IAAI;AAC3D;",
4
+ "sourcesContent": ["import {\n GetProps,\n TamaguiElement,\n UnionableString,\n Variable,\n getConfig,\n getExpandedShorthands,\n getTokens,\n getVariableValue,\n isTamaguiElement,\n mergeProps,\n spacedChildren,\n styled,\n useMediaPropsActive,\n withStaticProperties,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport React, { Children, forwardRef, isValidElement } from 'react'\nimport { ScrollView } from 'react-native'\nimport { useIndex, useIndexedChildren } from 'reforest'\n\ntype DisablePassBorderRadius = boolean | 'bottom' | 'top' | 'start' | 'end'\n\ninterface GroupContextValue {\n vertical: boolean\n disablePassBorderRadius: DisablePassBorderRadius\n onItemMount: () => void\n onItemUnmount: () => void\n radius?: number | UnionableString | Variable<any>\n disabled?: boolean\n}\n\nconst GROUP_NAME = 'Group'\n\ntype ScopedProps<P> = P & { __scopeGroup?: Scope }\nconst [createGroupContext, createGroupScope] = createContextScope(GROUP_NAME)\nconst [GroupProvider, useGroupContext] = createGroupContext<GroupContextValue>(GROUP_NAME)\n\nexport const GroupFrame = styled(ThemeableStack, {\n name: 'GroupFrame',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n y: 0,\n backgroundColor: '$background',\n },\n },\n\n size: (val, { tokens }) => {\n const borderRadius = tokens.radius[val] ?? val ?? tokens.radius['$true']\n return {\n borderRadius,\n }\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\nexport type GroupProps = GetProps<typeof GroupFrame> & {\n /**\n * @deprecated use `orientation` instead\n */\n axis?: 'horizontal' | 'vertical'\n orientation?: 'horizontal' | 'vertical'\n scrollable?: boolean\n /**\n * @default false\n */\n showScrollIndicator?: boolean\n disabled?: boolean\n disablePassBorderRadius?: DisablePassBorderRadius\n /**\n * forces the group to use the Group.Item API\n */\n forceUseItem?: boolean\n}\n\nfunction createGroup(verticalDefault: boolean) {\n return withStaticProperties(\n forwardRef<TamaguiElement, ScopedProps<GroupProps>>((props, ref) => {\n const activeProps = useMediaPropsActive(props)\n\n const {\n __scopeGroup,\n children: childrenProp,\n space,\n size = '$true',\n spaceDirection,\n separator,\n scrollable,\n axis = verticalDefault ? 'vertical' : 'horizontal',\n orientation = axis,\n disabled: disabledProp,\n disablePassBorderRadius: disablePassBorderRadiusProp,\n borderRadius,\n forceUseItem,\n ...restProps\n } = getExpandedShorthands(activeProps)\n\n const vertical = orientation === 'vertical'\n const [itemChildrenCount, setItemChildrenCount] = useControllableState({\n defaultProp: forceUseItem ? 1 : 0,\n })\n const isUsingItems = true // itemChildrenCount > 0\n\n // 1 off given border to adjust for border radius? This should be user controllable\n const radius =\n borderRadius ??\n (size ? getVariableValue(getTokens().radius[size]) - 1 : undefined)\n\n const hasRadius = radius !== undefined\n const disablePassBorderRadius = disablePassBorderRadiusProp ?? !hasRadius\n\n if (!isUsingItems) console.log('screw up!')\n const childrenArray = Children.toArray(childrenProp)\n const children = isUsingItems\n ? childrenProp\n : childrenArray.map((child, i) => {\n if (!isValidElement(child)) {\n return child\n }\n const disabled = child.props.disabled ?? disabledProp\n\n const isFirst = i === 0\n const isLast = i === childrenArray.length - 1\n\n const radiusStyles =\n disablePassBorderRadius === true\n ? null\n : getBorderRadius({\n isFirst,\n isLast,\n radius,\n vertical,\n disable: disablePassBorderRadius,\n })\n const props = {\n disabled,\n ...(isTamaguiElement(child) ? radiusStyles : { style: radiusStyles }),\n }\n\n return cloneElementWithPropOrder(child, props)\n })\n\n const indexedChildren = useIndexedChildren(\n spacedChildren({\n direction: spaceDirection,\n separator,\n space,\n children,\n })\n )\n\n const onItemMount = React.useCallback(\n () => setItemChildrenCount((prev) => prev + 1),\n []\n )\n const onItemUnmount = React.useCallback(\n () => setItemChildrenCount((prev) => prev - 1),\n []\n )\n\n return (\n <GroupProvider\n disablePassBorderRadius={disablePassBorderRadius}\n vertical={orientation === 'vertical'}\n radius={radius}\n disabled={disabledProp}\n onItemMount={onItemMount}\n onItemUnmount={onItemUnmount}\n scope={__scopeGroup}\n >\n <GroupFrame\n ref={ref}\n size={size}\n flexDirection={orientation === 'horizontal' ? 'row' : 'column'}\n borderRadius={borderRadius}\n {...restProps}\n >\n {wrapScroll({ ...activeProps, orientation }, indexedChildren)}\n </GroupFrame>\n </GroupProvider>\n )\n }),\n {\n Item: GroupItem,\n }\n )\n}\n\nconst GroupItem = (props: ScopedProps<{ children: React.ReactNode }>) => {\n const { __scopeGroup, children } = props\n const groupItemProps = useGroupItem(\n { disabled: isValidElement(children) ? children.props.disabled : undefined },\n __scopeGroup\n )\n\n if (!isValidElement(children)) {\n return children as any\n }\n\n if (isTamaguiElement(children)) {\n return React.cloneElement(children, groupItemProps)\n }\n\n return React.cloneElement(children, {\n style: {\n ...children.props?.['style'],\n ...groupItemProps,\n },\n } as any)\n}\n\nexport const useGroupItem = (\n childrenProps: { disabled: boolean },\n __scopeGroup?: Scope\n) => {\n const treeIndex = useIndex()\n const context = useGroupContext('GroupItem', __scopeGroup)\n\n React.useEffect(() => {\n context.onItemMount()\n return () => {\n context.onItemUnmount()\n }\n }, [])\n\n if (!treeIndex) {\n throw Error('<Group.Item/> should only be used within a <Group/>')\n }\n\n const isFirst = treeIndex.index === 0\n const isLast = treeIndex.index === treeIndex.maxIndex\n\n const disabled = childrenProps.disabled ?? context.disabled\n\n let propsToPass: Record<string, any> = {\n disabled,\n }\n\n if (context.disablePassBorderRadius !== true) {\n const borderRadius = getBorderRadius({\n radius: context.radius,\n isFirst,\n isLast,\n vertical: context.vertical,\n disable: context.disablePassBorderRadius,\n })\n return { ...propsToPass, ...borderRadius }\n }\n return propsToPass\n}\n\nexport const Group = createGroup(true)\nexport const YGroup = Group\nexport const XGroup = createGroup(false)\n\nconst wrapScroll = (\n { scrollable, orientation, showScrollIndicator = false }: GroupProps,\n children: any\n) => {\n if (scrollable)\n return (\n <ScrollView\n {...(orientation === 'vertical' && {\n showsVerticalScrollIndicator: showScrollIndicator,\n })}\n {...(orientation === 'horizontal' && {\n horizontal: true,\n showsHorizontalScrollIndicator: showScrollIndicator,\n })}\n >\n {children}\n </ScrollView>\n )\n return children\n}\n\nconst getBorderRadius = ({\n isFirst,\n isLast,\n radius,\n vertical,\n disable,\n}: {\n radius: any\n vertical: boolean\n isFirst: boolean\n isLast: boolean\n disable: DisablePassBorderRadius\n}) => {\n // TODO: RTL support would be nice here\n return {\n borderTopLeftRadius: isFirst && disable !== 'top' && disable !== 'start' ? radius : 0,\n borderTopRightRadius:\n disable !== 'top' &&\n disable !== 'end' &&\n ((vertical && isFirst) || (!vertical && isLast))\n ? radius\n : 0,\n borderBottomLeftRadius:\n disable !== 'bottom' &&\n disable !== 'start' &&\n ((vertical && isLast) || (!vertical && isFirst))\n ? radius\n : 0,\n borderBottomRightRadius:\n isLast && disable !== 'bottom' && disable !== 'end' ? radius : 0,\n }\n}\n\nconst cloneElementWithPropOrder = (child: any, props: Object) => {\n const next = mergeProps(child.props, props, false, getConfig().shorthands)[0]\n return React.cloneElement({ ...child, props: null }, next)\n}\n"],
5
+ "mappings": "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",
6
6
  "names": ["props"]
7
7
  }
package/dist/jsx/Group.mjs CHANGED
@@ -53,13 +53,14 @@ function createGroup(verticalDefault) {
53
53
  separator,
54
54
  scrollable,
55
55
  axis = verticalDefault ? "vertical" : "horizontal",
56
+ orientation = axis,
56
57
  disabled: disabledProp,
57
58
  disablePassBorderRadius: disablePassBorderRadiusProp,
58
59
  borderRadius,
59
60
  forceUseItem,
60
61
  ...restProps
61
62
  } = getExpandedShorthands(activeProps);
62
- const vertical = axis === "vertical";
63
+ const vertical = orientation === "vertical";
63
64
  const [itemChildrenCount, setItemChildrenCount] = useControllableState({
64
65
  defaultProp: forceUseItem ? 1 : 0
65
66
  });
@@ -108,7 +109,7 @@ function createGroup(verticalDefault) {
108
109
  );
109
110
  return <GroupProvider
110
111
  disablePassBorderRadius={disablePassBorderRadius}
111
- vertical={axis === "vertical"}
112
+ vertical={orientation === "vertical"}
112
113
  radius={radius}
113
114
  disabled={disabledProp}
114
115
  onItemMount={onItemMount}
@@ -117,10 +118,10 @@ function createGroup(verticalDefault) {
117
118
  ><GroupFrame
118
119
  ref={ref}
119
120
  size={size}
120
- flexDirection={axis === "horizontal" ? "row" : "column"}
121
+ flexDirection={orientation === "horizontal" ? "row" : "column"}
121
122
  borderRadius={borderRadius}
122
123
  {...restProps}
123
- >{wrapScroll({ ...activeProps, axis }, indexedChildren)}</GroupFrame></GroupProvider>;
124
+ >{wrapScroll({ ...activeProps, orientation }, indexedChildren)}</GroupFrame></GroupProvider>;
124
125
  }),
125
126
  {
126
127
  Item: GroupItem
@@ -179,13 +180,13 @@ const useGroupItem = (childrenProps, __scopeGroup) => {
179
180
  const Group = createGroup(true);
180
181
  const YGroup = Group;
181
182
  const XGroup = createGroup(false);
182
- const wrapScroll = ({ scrollable, axis, showScrollIndicator = false }, children) => {
183
+ const wrapScroll = ({ scrollable, orientation, showScrollIndicator = false }, children) => {
183
184
  if (scrollable)
184
185
  return <ScrollView
185
- {...axis === "vertical" && {
186
+ {...orientation === "vertical" && {
186
187
  showsVerticalScrollIndicator: showScrollIndicator
187
188
  }}
188
- {...axis === "horizontal" && {
189
+ {...orientation === "horizontal" && {
189
190
  horizontal: true,
190
191
  showsHorizontalScrollIndicator: showScrollIndicator
191
192
  }}
package/dist/jsx/Group.mjs.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Group.tsx"],
4
- "sourcesContent": ["import {\n GetProps,\n TamaguiElement,\n UnionableString,\n Variable,\n getConfig,\n getExpandedShorthands,\n getTokens,\n getVariableValue,\n isTamaguiElement,\n mergeProps,\n spacedChildren,\n styled,\n useMediaPropsActive,\n withStaticProperties,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport React, { Children, forwardRef, isValidElement } from 'react'\nimport { ScrollView } from 'react-native'\nimport { useIndex, useIndexedChildren } from 'reforest'\n\ntype DisablePassBorderRadius = boolean | 'bottom' | 'top' | 'start' | 'end'\n\ninterface GroupContextValue {\n vertical: boolean\n disablePassBorderRadius: DisablePassBorderRadius\n onItemMount: () => void\n onItemUnmount: () => void\n radius?: number | UnionableString | Variable<any>\n disabled?: boolean\n}\n\nconst GROUP_NAME = 'Group'\n\ntype ScopedProps<P> = P & { __scopeGroup?: Scope }\nconst [createGroupContext, createGroupScope] = createContextScope(GROUP_NAME)\nconst [GroupProvider, useGroupContext] = createGroupContext<GroupContextValue>(GROUP_NAME)\n\nexport const GroupFrame = styled(ThemeableStack, {\n name: 'GroupFrame',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n y: 0,\n backgroundColor: '$background',\n },\n },\n\n size: (val, { tokens }) => {\n const borderRadius = tokens.radius[val] ?? val ?? tokens.radius['$true']\n return {\n borderRadius,\n }\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\nexport type GroupProps = GetProps<typeof GroupFrame> & {\n axis?: 'horizontal' | 'vertical'\n\n scrollable?: boolean\n /**\n * @default false\n */\n showScrollIndicator?: boolean\n disabled?: boolean\n disablePassBorderRadius?: DisablePassBorderRadius\n /**\n * forces the group to use the Group.Item API\n */\n forceUseItem?: boolean\n}\n\nfunction createGroup(verticalDefault: boolean) {\n return withStaticProperties(\n forwardRef<TamaguiElement, ScopedProps<GroupProps>>((props, ref) => {\n const activeProps = useMediaPropsActive(props)\n\n const {\n __scopeGroup,\n children: childrenProp,\n space,\n size = '$true',\n spaceDirection,\n separator,\n scrollable,\n axis = verticalDefault ? 'vertical' : 'horizontal',\n disabled: disabledProp,\n disablePassBorderRadius: disablePassBorderRadiusProp,\n borderRadius,\n forceUseItem,\n ...restProps\n } = getExpandedShorthands(activeProps)\n\n const vertical = axis === 'vertical'\n const [itemChildrenCount, setItemChildrenCount] = useControllableState({\n defaultProp: forceUseItem ? 1 : 0,\n })\n const isUsingItems = true // itemChildrenCount > 0\n\n // 1 off given border to adjust for border radius? This should be user controllable\n const radius =\n borderRadius ??\n (size ? getVariableValue(getTokens().radius[size]) - 1 : undefined)\n\n const hasRadius = radius !== undefined\n const disablePassBorderRadius = disablePassBorderRadiusProp ?? !hasRadius\n\n if (!isUsingItems) console.log('screw up!')\n const childrenArray = Children.toArray(childrenProp)\n const children = isUsingItems\n ? childrenProp\n : childrenArray.map((child, i) => {\n if (!isValidElement(child)) {\n return child\n }\n const disabled = child.props.disabled ?? disabledProp\n\n const isFirst = i === 0\n const isLast = i === childrenArray.length - 1\n\n const radiusStyles =\n disablePassBorderRadius === true\n ? null\n : getBorderRadius({\n isFirst,\n isLast,\n radius,\n vertical,\n disable: disablePassBorderRadius,\n })\n const props = {\n disabled,\n ...(isTamaguiElement(child) ? radiusStyles : { style: radiusStyles }),\n }\n\n return cloneElementWithPropOrder(child, props)\n })\n\n const indexedChildren = useIndexedChildren(\n spacedChildren({\n direction: spaceDirection,\n separator,\n space,\n children,\n })\n )\n\n const onItemMount = React.useCallback(\n () => setItemChildrenCount((prev) => prev + 1),\n []\n )\n const onItemUnmount = React.useCallback(\n () => setItemChildrenCount((prev) => prev - 1),\n []\n )\n\n return (\n <GroupProvider\n disablePassBorderRadius={disablePassBorderRadius}\n vertical={axis === 'vertical'}\n radius={radius}\n disabled={disabledProp}\n onItemMount={onItemMount}\n onItemUnmount={onItemUnmount}\n scope={__scopeGroup}\n >\n <GroupFrame\n ref={ref}\n size={size}\n flexDirection={axis === 'horizontal' ? 'row' : 'column'}\n borderRadius={borderRadius}\n {...restProps}\n >\n {wrapScroll({ ...activeProps, axis }, indexedChildren)}\n </GroupFrame>\n </GroupProvider>\n )\n }),\n {\n Item: GroupItem,\n }\n )\n}\n\nconst GroupItem = (props: ScopedProps<{ children: React.ReactNode }>) => {\n const { __scopeGroup, children } = props\n const groupItemProps = useGroupItem(\n { disabled: isValidElement(children) ? children.props.disabled : undefined },\n __scopeGroup\n )\n\n if (!isValidElement(children)) {\n return children as any\n }\n\n if (isTamaguiElement(children)) {\n return React.cloneElement(children, groupItemProps)\n }\n\n return React.cloneElement(children, {\n style: {\n ...children.props?.['style'],\n ...groupItemProps,\n },\n } as any)\n}\n\nexport const useGroupItem = (\n childrenProps: { disabled: boolean },\n __scopeGroup?: Scope\n) => {\n const treeIndex = useIndex()\n const context = useGroupContext('GroupItem', __scopeGroup)\n\n React.useEffect(() => {\n context.onItemMount()\n return () => {\n context.onItemUnmount()\n }\n }, [])\n\n if (!treeIndex) {\n throw Error('<Group.Item/> should only be used within a <Group/>')\n }\n\n const isFirst = treeIndex.index === 0\n const isLast = treeIndex.index === treeIndex.maxIndex\n\n const disabled = childrenProps.disabled ?? context.disabled\n\n let propsToPass: Record<string, any> = {\n disabled,\n }\n\n if (context.disablePassBorderRadius !== true) {\n const borderRadius = getBorderRadius({\n radius: context.radius,\n isFirst,\n isLast,\n vertical: context.vertical,\n disable: context.disablePassBorderRadius,\n })\n return { ...propsToPass, ...borderRadius }\n }\n return propsToPass\n}\n\nexport const Group = createGroup(true)\nexport const YGroup = Group\nexport const XGroup = createGroup(false)\n\nconst wrapScroll = (\n { scrollable, axis, showScrollIndicator = false }: GroupProps,\n children: any\n) => {\n if (scrollable)\n return (\n <ScrollView\n {...(axis === 'vertical' && {\n showsVerticalScrollIndicator: showScrollIndicator,\n })}\n {...(axis === 'horizontal' && {\n horizontal: true,\n showsHorizontalScrollIndicator: showScrollIndicator,\n })}\n >\n {children}\n </ScrollView>\n )\n return children\n}\n\nconst getBorderRadius = ({\n isFirst,\n isLast,\n radius,\n vertical,\n disable,\n}: {\n radius: any\n vertical: boolean\n isFirst: boolean\n isLast: boolean\n disable: DisablePassBorderRadius\n}) => {\n // TODO: RTL support would be nice here\n return {\n borderTopLeftRadius: isFirst && disable !== 'top' && disable !== 'start' ? radius : 0,\n borderTopRightRadius:\n disable !== 'top' &&\n disable !== 'end' &&\n ((vertical && isFirst) || (!vertical && isLast))\n ? radius\n : 0,\n borderBottomLeftRadius:\n disable !== 'bottom' &&\n disable !== 'start' &&\n ((vertical && isLast) || (!vertical && isFirst))\n ? radius\n : 0,\n borderBottomRightRadius:\n isLast && disable !== 'bottom' && disable !== 'end' ? radius : 0,\n }\n}\n\nconst cloneElementWithPropOrder = (child: any, props: Object) => {\n const next = mergeProps(child.props, props, false, getConfig().shorthands)[0]\n return React.cloneElement({ ...child, props: null }, next)\n}\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import {\n GetProps,\n TamaguiElement,\n UnionableString,\n Variable,\n getConfig,\n getExpandedShorthands,\n getTokens,\n getVariableValue,\n isTamaguiElement,\n mergeProps,\n spacedChildren,\n styled,\n useMediaPropsActive,\n withStaticProperties,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport React, { Children, forwardRef, isValidElement } from 'react'\nimport { ScrollView } from 'react-native'\nimport { useIndex, useIndexedChildren } from 'reforest'\n\ntype DisablePassBorderRadius = boolean | 'bottom' | 'top' | 'start' | 'end'\n\ninterface GroupContextValue {\n vertical: boolean\n disablePassBorderRadius: DisablePassBorderRadius\n onItemMount: () => void\n onItemUnmount: () => void\n radius?: number | UnionableString | Variable<any>\n disabled?: boolean\n}\n\nconst GROUP_NAME = 'Group'\n\ntype ScopedProps<P> = P & { __scopeGroup?: Scope }\nconst [createGroupContext, createGroupScope] = createContextScope(GROUP_NAME)\nconst [GroupProvider, useGroupContext] = createGroupContext<GroupContextValue>(GROUP_NAME)\n\nexport const GroupFrame = styled(ThemeableStack, {\n name: 'GroupFrame',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n y: 0,\n backgroundColor: '$background',\n },\n },\n\n size: (val, { tokens }) => {\n const borderRadius = tokens.radius[val] ?? val ?? tokens.radius['$true']\n return {\n borderRadius,\n }\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\nexport type GroupProps = GetProps<typeof GroupFrame> & {\n /**\n * @deprecated use `orientation` instead\n */\n axis?: 'horizontal' | 'vertical'\n orientation?: 'horizontal' | 'vertical'\n scrollable?: boolean\n /**\n * @default false\n */\n showScrollIndicator?: boolean\n disabled?: boolean\n disablePassBorderRadius?: DisablePassBorderRadius\n /**\n * forces the group to use the Group.Item API\n */\n forceUseItem?: boolean\n}\n\nfunction createGroup(verticalDefault: boolean) {\n return withStaticProperties(\n forwardRef<TamaguiElement, ScopedProps<GroupProps>>((props, ref) => {\n const activeProps = useMediaPropsActive(props)\n\n const {\n __scopeGroup,\n children: childrenProp,\n space,\n size = '$true',\n spaceDirection,\n separator,\n scrollable,\n axis = verticalDefault ? 'vertical' : 'horizontal',\n orientation = axis,\n disabled: disabledProp,\n disablePassBorderRadius: disablePassBorderRadiusProp,\n borderRadius,\n forceUseItem,\n ...restProps\n } = getExpandedShorthands(activeProps)\n\n const vertical = orientation === 'vertical'\n const [itemChildrenCount, setItemChildrenCount] = useControllableState({\n defaultProp: forceUseItem ? 1 : 0,\n })\n const isUsingItems = true // itemChildrenCount > 0\n\n // 1 off given border to adjust for border radius? This should be user controllable\n const radius =\n borderRadius ??\n (size ? getVariableValue(getTokens().radius[size]) - 1 : undefined)\n\n const hasRadius = radius !== undefined\n const disablePassBorderRadius = disablePassBorderRadiusProp ?? !hasRadius\n\n if (!isUsingItems) console.log('screw up!')\n const childrenArray = Children.toArray(childrenProp)\n const children = isUsingItems\n ? childrenProp\n : childrenArray.map((child, i) => {\n if (!isValidElement(child)) {\n return child\n }\n const disabled = child.props.disabled ?? disabledProp\n\n const isFirst = i === 0\n const isLast = i === childrenArray.length - 1\n\n const radiusStyles =\n disablePassBorderRadius === true\n ? null\n : getBorderRadius({\n isFirst,\n isLast,\n radius,\n vertical,\n disable: disablePassBorderRadius,\n })\n const props = {\n disabled,\n ...(isTamaguiElement(child) ? radiusStyles : { style: radiusStyles }),\n }\n\n return cloneElementWithPropOrder(child, props)\n })\n\n const indexedChildren = useIndexedChildren(\n spacedChildren({\n direction: spaceDirection,\n separator,\n space,\n children,\n })\n )\n\n const onItemMount = React.useCallback(\n () => setItemChildrenCount((prev) => prev + 1),\n []\n )\n const onItemUnmount = React.useCallback(\n () => setItemChildrenCount((prev) => prev - 1),\n []\n )\n\n return (\n <GroupProvider\n disablePassBorderRadius={disablePassBorderRadius}\n vertical={orientation === 'vertical'}\n radius={radius}\n disabled={disabledProp}\n onItemMount={onItemMount}\n onItemUnmount={onItemUnmount}\n scope={__scopeGroup}\n >\n <GroupFrame\n ref={ref}\n size={size}\n flexDirection={orientation === 'horizontal' ? 'row' : 'column'}\n borderRadius={borderRadius}\n {...restProps}\n >\n {wrapScroll({ ...activeProps, orientation }, indexedChildren)}\n </GroupFrame>\n </GroupProvider>\n )\n }),\n {\n Item: GroupItem,\n }\n )\n}\n\nconst GroupItem = (props: ScopedProps<{ children: React.ReactNode }>) => {\n const { __scopeGroup, children } = props\n const groupItemProps = useGroupItem(\n { disabled: isValidElement(children) ? children.props.disabled : undefined },\n __scopeGroup\n )\n\n if (!isValidElement(children)) {\n return children as any\n }\n\n if (isTamaguiElement(children)) {\n return React.cloneElement(children, groupItemProps)\n }\n\n return React.cloneElement(children, {\n style: {\n ...children.props?.['style'],\n ...groupItemProps,\n },\n } as any)\n}\n\nexport const useGroupItem = (\n childrenProps: { disabled: boolean },\n __scopeGroup?: Scope\n) => {\n const treeIndex = useIndex()\n const context = useGroupContext('GroupItem', __scopeGroup)\n\n React.useEffect(() => {\n context.onItemMount()\n return () => {\n context.onItemUnmount()\n }\n }, [])\n\n if (!treeIndex) {\n throw Error('<Group.Item/> should only be used within a <Group/>')\n }\n\n const isFirst = treeIndex.index === 0\n const isLast = treeIndex.index === treeIndex.maxIndex\n\n const disabled = childrenProps.disabled ?? context.disabled\n\n let propsToPass: Record<string, any> = {\n disabled,\n }\n\n if (context.disablePassBorderRadius !== true) {\n const borderRadius = getBorderRadius({\n radius: context.radius,\n isFirst,\n isLast,\n vertical: context.vertical,\n disable: context.disablePassBorderRadius,\n })\n return { ...propsToPass, ...borderRadius }\n }\n return propsToPass\n}\n\nexport const Group = createGroup(true)\nexport const YGroup = Group\nexport const XGroup = createGroup(false)\n\nconst wrapScroll = (\n { scrollable, orientation, showScrollIndicator = false }: GroupProps,\n children: any\n) => {\n if (scrollable)\n return (\n <ScrollView\n {...(orientation === 'vertical' && {\n showsVerticalScrollIndicator: showScrollIndicator,\n })}\n {...(orientation === 'horizontal' && {\n horizontal: true,\n showsHorizontalScrollIndicator: showScrollIndicator,\n })}\n >\n {children}\n </ScrollView>\n )\n return children\n}\n\nconst getBorderRadius = ({\n isFirst,\n isLast,\n radius,\n vertical,\n disable,\n}: {\n radius: any\n vertical: boolean\n isFirst: boolean\n isLast: boolean\n disable: DisablePassBorderRadius\n}) => {\n // TODO: RTL support would be nice here\n return {\n borderTopLeftRadius: isFirst && disable !== 'top' && disable !== 'start' ? radius : 0,\n borderTopRightRadius:\n disable !== 'top' &&\n disable !== 'end' &&\n ((vertical && isFirst) || (!vertical && isLast))\n ? radius\n : 0,\n borderBottomLeftRadius:\n disable !== 'bottom' &&\n disable !== 'start' &&\n ((vertical && isLast) || (!vertical && isFirst))\n ? radius\n : 0,\n borderBottomRightRadius:\n isLast && disable !== 'bottom' && disable !== 'end' ? radius : 0,\n }\n}\n\nconst cloneElementWithPropOrder = (child: any, props: Object) => {\n const next = mergeProps(child.props, props, false, getConfig().shorthands)[0]\n return React.cloneElement({ ...child, props: null }, next)\n}\n"],
5
+ "mappings": "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",
6
6
  "names": ["props"]
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tamagui/group",
3
- "version": "1.11.2",
3
+ "version": "1.12.0",
4
4
  "sideEffects": [
5
5
  "*.css"
6
6
  ],
@@ -23,17 +23,17 @@
23
23
  "clean:build": "tamagui-build clean:build"
24
24
  },
25
25
  "dependencies": {
26
- "@tamagui/core": "1.11.2",
27
- "@tamagui/create-context": "1.11.2",
28
- "@tamagui/stacks": "1.11.2",
29
- "@tamagui/use-controllable-state": "1.11.2",
26
+ "@tamagui/core": "1.12.0",
27
+ "@tamagui/create-context": "1.12.0",
28
+ "@tamagui/stacks": "1.12.0",
29
+ "@tamagui/use-controllable-state": "1.12.0",
30
30
  "reforest": "^0.12.1"
31
31
  },
32
32
  "peerDependencies": {
33
33
  "react": "*"
34
34
  },
35
35
  "devDependencies": {
36
- "@tamagui/build": "1.11.2",
36
+ "@tamagui/build": "1.12.0",
37
37
  "react": "^18.2.0"
38
38
  },
39
39
  "publishConfig": {
package/src/Group.tsx CHANGED
@@ -64,8 +64,11 @@ export const GroupFrame = styled(ThemeableStack, {
64
64
  })
65
65
 
66
66
  export type GroupProps = GetProps<typeof GroupFrame> & {
67
+ /**
68
+ * @deprecated use `orientation` instead
69
+ */
67
70
  axis?: 'horizontal' | 'vertical'
68
-
71
+ orientation?: 'horizontal' | 'vertical'
69
72
  scrollable?: boolean
70
73
  /**
71
74
  * @default false
@@ -93,6 +96,7 @@ function createGroup(verticalDefault: boolean) {
93
96
  separator,
94
97
  scrollable,
95
98
  axis = verticalDefault ? 'vertical' : 'horizontal',
99
+ orientation = axis,
96
100
  disabled: disabledProp,
97
101
  disablePassBorderRadius: disablePassBorderRadiusProp,
98
102
  borderRadius,
@@ -100,7 +104,7 @@ function createGroup(verticalDefault: boolean) {
100
104
  ...restProps
101
105
  } = getExpandedShorthands(activeProps)
102
106
 
103
- const vertical = axis === 'vertical'
107
+ const vertical = orientation === 'vertical'
104
108
  const [itemChildrenCount, setItemChildrenCount] = useControllableState({
105
109
  defaultProp: forceUseItem ? 1 : 0,
106
110
  })
@@ -166,7 +170,7 @@ function createGroup(verticalDefault: boolean) {
166
170
  return (
167
171
  <GroupProvider
168
172
  disablePassBorderRadius={disablePassBorderRadius}
169
- vertical={axis === 'vertical'}
173
+ vertical={orientation === 'vertical'}
170
174
  radius={radius}
171
175
  disabled={disabledProp}
172
176
  onItemMount={onItemMount}
@@ -176,11 +180,11 @@ function createGroup(verticalDefault: boolean) {
176
180
  <GroupFrame
177
181
  ref={ref}
178
182
  size={size}
179
- flexDirection={axis === 'horizontal' ? 'row' : 'column'}
183
+ flexDirection={orientation === 'horizontal' ? 'row' : 'column'}
180
184
  borderRadius={borderRadius}
181
185
  {...restProps}
182
186
  >
183
- {wrapScroll({ ...activeProps, axis }, indexedChildren)}
187
+ {wrapScroll({ ...activeProps, orientation }, indexedChildren)}
184
188
  </GroupFrame>
185
189
  </GroupProvider>
186
190
  )
@@ -259,16 +263,16 @@ export const YGroup = Group
259
263
  export const XGroup = createGroup(false)
260
264
 
261
265
  const wrapScroll = (
262
- { scrollable, axis, showScrollIndicator = false }: GroupProps,
266
+ { scrollable, orientation, showScrollIndicator = false }: GroupProps,
263
267
  children: any
264
268
  ) => {
265
269
  if (scrollable)
266
270
  return (
267
271
  <ScrollView
268
- {...(axis === 'vertical' && {
272
+ {...(orientation === 'vertical' && {
269
273
  showsVerticalScrollIndicator: showScrollIndicator,
270
274
  })}
271
- {...(axis === 'horizontal' && {
275
+ {...(orientation === 'horizontal' && {
272
276
  horizontal: true,
273
277
  showsHorizontalScrollIndicator: showScrollIndicator,
274
278
  })}
package/types/Group.d.ts CHANGED
@@ -79,7 +79,11 @@ export declare const GroupFrame: import("@tamagui/core").TamaguiComponent<Omit<i
79
79
  readonly size?: any;
80
80
  }>;
81
81
  export type GroupProps = GetProps<typeof GroupFrame> & {
82
+ /**
83
+ * @deprecated use `orientation` instead
84
+ */
82
85
  axis?: 'horizontal' | 'vertical';
86
+ orientation?: 'horizontal' | 'vertical';
83
87
  scrollable?: boolean;
84
88
  /**
85
89
  * @default false
@@ -150,7 +154,11 @@ export declare const Group: React.ForwardRefExoticComponent<Omit<import("react-n
150
154
  readonly unstyled?: boolean | undefined;
151
155
  readonly size?: any;
152
156
  }>> & {
157
+ /**
158
+ * @deprecated use `orientation` instead
159
+ */
153
160
  axis?: "horizontal" | "vertical" | undefined;
161
+ orientation?: "horizontal" | "vertical" | undefined;
154
162
  scrollable?: boolean | undefined;
155
163
  /**
156
164
  * @default false
@@ -224,7 +232,11 @@ export declare const YGroup: React.ForwardRefExoticComponent<Omit<import("react-
224
232
  readonly unstyled?: boolean | undefined;
225
233
  readonly size?: any;
226
234
  }>> & {
235
+ /**
236
+ * @deprecated use `orientation` instead
237
+ */
227
238
  axis?: "horizontal" | "vertical" | undefined;
239
+ orientation?: "horizontal" | "vertical" | undefined;
228
240
  scrollable?: boolean | undefined;
229
241
  /**
230
242
  * @default false
@@ -298,7 +310,11 @@ export declare const XGroup: React.ForwardRefExoticComponent<Omit<import("react-
298
310
  readonly unstyled?: boolean | undefined;
299
311
  readonly size?: any;
300
312
  }>> & {
313
+ /**
314
+ * @deprecated use `orientation` instead
315
+ */
301
316
  axis?: "horizontal" | "vertical" | undefined;
317
+ orientation?: "horizontal" | "vertical" | undefined;
302
318
  scrollable?: boolean | undefined;
303
319
  /**
304
320
  * @default false
package/types/Group.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Group.d.ts","sourceRoot":"","sources":["../src/Group.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EACR,cAAc,EAaf,MAAM,eAAe,CAAA;AACtB,OAAO,EAAE,KAAK,EAAsB,MAAM,yBAAyB,CAAA;AAGnE,OAAO,KAA+C,MAAM,OAAO,CAAA;AAInE,KAAK,uBAAuB,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,OAAO,GAAG,KAAK,CAAA;AAa3E,KAAK,WAAW,CAAC,CAAC,IAAI,CAAC,GAAG;IAAE,YAAY,CAAC,EAAE,KAAK,CAAA;CAAE,CAAA;AAIlD,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuBrB,CAAA;AAEF,MAAM,MAAM,UAAU,GAAG,QAAQ,CAAC,OAAO,UAAU,CAAC,GAAG;IACrD,IAAI,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IAEhC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,uBAAuB,CAAC,EAAE,uBAAuB,CAAA;IACjD;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAA;CACvB,CAAA;AAyID,eAAO,MAAM,YAAY,kBACR;IAAE,QAAQ,EAAE,OAAO,CAAA;CAAE,iBACrB,KAAK,wBAoCrB,CAAA;AAED,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA3LhB;;OAEG;;;;IAIH;;OAEG;;;mBAzCsC,KAAK;;kBA6JtB,YAAY;QAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;KAAE,CAAC;CA+D9B,CAAA;AACtC,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA5LjB;;OAEG;;;;IAIH;;OAEG;;;mBAzCsC,KAAK;;kBA6JtB,YAAY;QAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;KAAE,CAAC;CAgEzC,CAAA;AAC3B,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA7LjB;;OAEG;;;;IAIH;;OAEG;;;mBAzCsC,KAAK;;kBA6JtB,YAAY;QAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;KAAE,CAAC;CAiE5B,CAAA"}
1
+ {"version":3,"file":"Group.d.ts","sourceRoot":"","sources":["../src/Group.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EACR,cAAc,EAaf,MAAM,eAAe,CAAA;AACtB,OAAO,EAAE,KAAK,EAAsB,MAAM,yBAAyB,CAAA;AAGnE,OAAO,KAA+C,MAAM,OAAO,CAAA;AAInE,KAAK,uBAAuB,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,OAAO,GAAG,KAAK,CAAA;AAa3E,KAAK,WAAW,CAAC,CAAC,IAAI,CAAC,GAAG;IAAE,YAAY,CAAC,EAAE,KAAK,CAAA;CAAE,CAAA;AAIlD,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuBrB,CAAA;AAEF,MAAM,MAAM,UAAU,GAAG,QAAQ,CAAC,OAAO,UAAU,CAAC,GAAG;IACrD;;OAEG;IACH,IAAI,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IAChC,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IACvC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,uBAAuB,CAAC,EAAE,uBAAuB,CAAA;IACjD;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAA;CACvB,CAAA;AA0ID,eAAO,MAAM,YAAY,kBACR;IAAE,QAAQ,EAAE,OAAO,CAAA;CAAE,iBACrB,KAAK,wBAoCrB,CAAA;AAED,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAlMhB;;OAEG;;;;IAIH;;OAEG;;;;IAIH;;OAEG;;;mBA5CsC,KAAK;;kBAiKtB,YAAY;QAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;KAAE,CAAC;CA+D9B,CAAA;AACtC,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAnMjB;;OAEG;;;;IAIH;;OAEG;;;;IAIH;;OAEG;;;mBA5CsC,KAAK;;kBAiKtB,YAAY;QAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;KAAE,CAAC;CAgEzC,CAAA;AAC3B,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IApMjB;;OAEG;;;;IAIH;;OAEG;;;;IAIH;;OAEG;;;mBA5CsC,KAAK;;kBAiKtB,YAAY;QAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;KAAE,CAAC;CAiE5B,CAAA"}