@tamagui/toggle-group 1.14.0 → 1.14.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/Toggle.js +130 -1
- package/dist/cjs/Toggle.js.map +2 -2
- package/dist/cjs/ToggleGroup.js +341 -1
- package/dist/cjs/ToggleGroup.js.map +2 -2
- package/dist/cjs/index.js +18 -1
- package/dist/cjs/index.js.map +2 -2
- package/dist/esm/Toggle.js +95 -1
- package/dist/esm/Toggle.js.map +2 -2
- package/dist/esm/Toggle.mjs +95 -1
- package/dist/esm/Toggle.mjs.map +2 -2
- package/dist/esm/ToggleGroup.js +312 -1
- package/dist/esm/ToggleGroup.js.map +2 -2
- package/dist/esm/ToggleGroup.mjs +312 -1
- package/dist/esm/ToggleGroup.mjs.map +2 -2
- package/dist/esm/index.js +1 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/index.mjs +1 -1
- package/dist/esm/index.mjs.map +1 -1
- package/dist/jsx/Toggle.js +91 -1
- package/dist/jsx/Toggle.js.map +2 -2
- package/dist/jsx/Toggle.mjs +91 -1
- package/dist/jsx/Toggle.mjs.map +2 -2
- package/dist/jsx/ToggleGroup.js +278 -1
- package/dist/jsx/ToggleGroup.js.map +2 -2
- package/dist/jsx/ToggleGroup.mjs +278 -1
- package/dist/jsx/ToggleGroup.mjs.map +2 -2
- package/dist/jsx/index.js +1 -1
- package/dist/jsx/index.js.map +1 -1
- package/dist/jsx/index.mjs +1 -1
- package/dist/jsx/index.mjs.map +1 -1
- package/package.json +13 -13
package/dist/jsx/ToggleGroup.mjs
CHANGED
|
@@ -1,2 +1,279 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { createContextScope } from "@tamagui/create-context";
|
|
2
|
+
import { registerFocusable } from "@tamagui/focusable";
|
|
3
|
+
import { getFontSize } from "@tamagui/font-size";
|
|
4
|
+
import { stepTokenUpOrDown } from "@tamagui/get-size";
|
|
5
|
+
import { Group, useGroupItem } from "@tamagui/group";
|
|
6
|
+
import { useGetThemedIcon } from "@tamagui/helpers-tamagui";
|
|
7
|
+
import { RovingFocusGroup, createRovingFocusGroupScope } from "@tamagui/roving-focus";
|
|
8
|
+
import { useControllableState } from "@tamagui/use-controllable-state";
|
|
9
|
+
import { useDirection } from "@tamagui/use-direction";
|
|
10
|
+
import {
|
|
11
|
+
getVariableValue,
|
|
12
|
+
isWeb,
|
|
13
|
+
styled,
|
|
14
|
+
useTheme,
|
|
15
|
+
withStaticProperties
|
|
16
|
+
} from "@tamagui/web";
|
|
17
|
+
import React from "react";
|
|
18
|
+
import { Toggle, ToggleFrame } from "./Toggle";
|
|
19
|
+
const TOGGLE_GROUP_NAME = "ToggleGroup";
|
|
20
|
+
const [createToggleGroupContext, createToggleGroupScope] = createContextScope(
|
|
21
|
+
TOGGLE_GROUP_NAME,
|
|
22
|
+
[createRovingFocusGroupScope]
|
|
23
|
+
);
|
|
24
|
+
const TOGGLE_GROUP_ITEM_NAME = "ToggleGroupItem";
|
|
25
|
+
const [createToggleGroupItemContext, createToggleGroupItemScope] = createContextScope(TOGGLE_GROUP_ITEM_NAME);
|
|
26
|
+
const [ToggleGroupItemProvider, useToggleGroupItemContext] = createToggleGroupContext(TOGGLE_GROUP_NAME);
|
|
27
|
+
const useToggleGroupItemScope = createToggleGroupItemScope();
|
|
28
|
+
const ToggleGroupItem = ToggleFrame.extractable(
|
|
29
|
+
React.forwardRef(
|
|
30
|
+
(props, forwardedRef) => {
|
|
31
|
+
const valueContext = useToggleGroupValueContext(
|
|
32
|
+
TOGGLE_GROUP_ITEM_NAME,
|
|
33
|
+
props.__scopeToggleGroup
|
|
34
|
+
);
|
|
35
|
+
const context = useToggleGroupContext(
|
|
36
|
+
TOGGLE_GROUP_ITEM_NAME,
|
|
37
|
+
props.__scopeToggleGroup
|
|
38
|
+
);
|
|
39
|
+
const __scopeToggleGroup = props.__scopeToggleGroup;
|
|
40
|
+
const rovingFocusGroupScope = useRovingFocusGroupScope(props.__scopeToggleGroup);
|
|
41
|
+
const pressed = valueContext.value.includes(props.value);
|
|
42
|
+
const disabled = context.disabled || props.disabled || false;
|
|
43
|
+
const ref = React.useRef(null);
|
|
44
|
+
const groupItemProps = useGroupItem({ disabled });
|
|
45
|
+
const size = props.size ?? context.size;
|
|
46
|
+
const sizeProps = {
|
|
47
|
+
width: void 0,
|
|
48
|
+
height: void 0,
|
|
49
|
+
padding: getVariableValue(size) * 0.6
|
|
50
|
+
};
|
|
51
|
+
if (props.orientation === "horizontal")
|
|
52
|
+
sizeProps.height = getVariableValue(size) * 2.4;
|
|
53
|
+
else
|
|
54
|
+
sizeProps.width = getVariableValue(size) * 2.4;
|
|
55
|
+
const iconSize = (typeof size === "number" ? size * 0.7 : getFontSize(size)) * 1.2;
|
|
56
|
+
const theme = useTheme();
|
|
57
|
+
const getThemedIcon = useGetThemedIcon({ size: iconSize, color: theme.color });
|
|
58
|
+
const childrens = React.Children.toArray(props.children);
|
|
59
|
+
const children = childrens.map((child) => {
|
|
60
|
+
if (props.disablePassStyles || !React.isValidElement(child)) {
|
|
61
|
+
return child;
|
|
62
|
+
}
|
|
63
|
+
return getThemedIcon(child);
|
|
64
|
+
});
|
|
65
|
+
const commonProps = { ...props, pressed, disabled, ...sizeProps, children };
|
|
66
|
+
return <ToggleGroupItemProvider scope={__scopeToggleGroup}>{context.rovingFocus ? <RovingFocusGroup.Item
|
|
67
|
+
asChild
|
|
68
|
+
{...rovingFocusGroupScope}
|
|
69
|
+
focusable={!disabled}
|
|
70
|
+
active={pressed}
|
|
71
|
+
><ToggleFrame
|
|
72
|
+
asChild
|
|
73
|
+
focusable={!disabled}
|
|
74
|
+
disabled={disabled}
|
|
75
|
+
ref={ref}
|
|
76
|
+
{...groupItemProps}
|
|
77
|
+
><ToggleGroupItemImpl {...commonProps} ref={forwardedRef} /></ToggleFrame></RovingFocusGroup.Item> : <ToggleFrame asChild focusable={!disabled} disabled={disabled} ref={ref}><ToggleGroupItemImpl {...commonProps} ref={forwardedRef} /></ToggleFrame>}</ToggleGroupItemProvider>;
|
|
78
|
+
}
|
|
79
|
+
)
|
|
80
|
+
);
|
|
81
|
+
ToggleGroupItem.displayName = TOGGLE_GROUP_ITEM_NAME;
|
|
82
|
+
const ToggleGroupItemImpl = ToggleFrame.extractable(
|
|
83
|
+
React.forwardRef(
|
|
84
|
+
(props, forwardedRef) => {
|
|
85
|
+
const { __scopeToggleGroup, value, ...itemProps } = props;
|
|
86
|
+
const valueContext = useToggleGroupValueContext(
|
|
87
|
+
TOGGLE_GROUP_ITEM_NAME,
|
|
88
|
+
__scopeToggleGroup
|
|
89
|
+
);
|
|
90
|
+
const singleProps = {
|
|
91
|
+
"aria-pressed": void 0
|
|
92
|
+
};
|
|
93
|
+
const typeProps = valueContext.type === "single" ? singleProps : void 0;
|
|
94
|
+
return <Toggle
|
|
95
|
+
{...typeProps}
|
|
96
|
+
{...itemProps}
|
|
97
|
+
ref={forwardedRef}
|
|
98
|
+
onPressedChange={(pressed) => {
|
|
99
|
+
if (pressed) {
|
|
100
|
+
valueContext.onItemActivate(value);
|
|
101
|
+
} else {
|
|
102
|
+
valueContext.onItemDeactivate(value);
|
|
103
|
+
}
|
|
104
|
+
}}
|
|
105
|
+
/>;
|
|
106
|
+
}
|
|
107
|
+
)
|
|
108
|
+
);
|
|
109
|
+
const useRovingFocusGroupScope = createRovingFocusGroupScope();
|
|
110
|
+
const ToggleGroup = withStaticProperties(
|
|
111
|
+
React.forwardRef((props, forwardedRef) => {
|
|
112
|
+
const { type, ...toggleGroupProps } = props;
|
|
113
|
+
if (!isWeb) {
|
|
114
|
+
React.useEffect(() => {
|
|
115
|
+
if (!props.id)
|
|
116
|
+
return;
|
|
117
|
+
return registerFocusable(props.id, {
|
|
118
|
+
// TODO: would be nice to focus on the first child later - could be done with reforest
|
|
119
|
+
// for now leaving it empty
|
|
120
|
+
focus: () => {
|
|
121
|
+
}
|
|
122
|
+
});
|
|
123
|
+
}, [props.id]);
|
|
124
|
+
}
|
|
125
|
+
if (type === "single") {
|
|
126
|
+
const singleProps = toggleGroupProps;
|
|
127
|
+
return <ToggleGroupImplSingle {...singleProps} ref={forwardedRef} />;
|
|
128
|
+
}
|
|
129
|
+
if (type === "multiple") {
|
|
130
|
+
const multipleProps = toggleGroupProps;
|
|
131
|
+
return <ToggleGroupImplMultiple {...multipleProps} ref={forwardedRef} />;
|
|
132
|
+
}
|
|
133
|
+
throw new Error(`Missing prop \`type\` expected on \`${TOGGLE_GROUP_NAME}\``);
|
|
134
|
+
}),
|
|
135
|
+
{
|
|
136
|
+
Item: ToggleGroupItem
|
|
137
|
+
}
|
|
138
|
+
);
|
|
139
|
+
ToggleGroup.displayName = TOGGLE_GROUP_NAME;
|
|
140
|
+
const [ToggleGroupValueProvider, useToggleGroupValueContext] = createToggleGroupContext(TOGGLE_GROUP_NAME);
|
|
141
|
+
const ToggleGroupImplSingle = React.forwardRef((props, forwardedRef) => {
|
|
142
|
+
const {
|
|
143
|
+
value: valueProp,
|
|
144
|
+
defaultValue,
|
|
145
|
+
onValueChange = () => {
|
|
146
|
+
},
|
|
147
|
+
disableDeactivation = false,
|
|
148
|
+
...toggleGroupSingleProps
|
|
149
|
+
} = props;
|
|
150
|
+
const [value, setValue] = useControllableState({
|
|
151
|
+
prop: valueProp,
|
|
152
|
+
defaultProp: defaultValue,
|
|
153
|
+
onChange: onValueChange
|
|
154
|
+
});
|
|
155
|
+
return <ToggleGroupValueProvider
|
|
156
|
+
scope={props.__scopeToggleGroup}
|
|
157
|
+
type="single"
|
|
158
|
+
value={value ? [value] : []}
|
|
159
|
+
defaultValue={value}
|
|
160
|
+
onItemActivate={setValue}
|
|
161
|
+
onItemDeactivate={React.useCallback(() => disableDeactivation ? null : setValue(""), [setValue, disableDeactivation])}
|
|
162
|
+
><ToggleGroupImpl {...toggleGroupSingleProps} ref={forwardedRef} /></ToggleGroupValueProvider>;
|
|
163
|
+
});
|
|
164
|
+
const ToggleGroupImplMultiple = React.forwardRef((props, forwardedRef) => {
|
|
165
|
+
const {
|
|
166
|
+
value: valueProp,
|
|
167
|
+
defaultValue,
|
|
168
|
+
onValueChange = () => {
|
|
169
|
+
},
|
|
170
|
+
...toggleGroupMultipleProps
|
|
171
|
+
} = props;
|
|
172
|
+
const [value = [], setValue] = useControllableState({
|
|
173
|
+
prop: valueProp,
|
|
174
|
+
defaultProp: defaultValue,
|
|
175
|
+
onChange: onValueChange
|
|
176
|
+
});
|
|
177
|
+
const handleButtonActivate = React.useCallback(
|
|
178
|
+
(itemValue) => setValue((prevValue = []) => [...prevValue, itemValue]),
|
|
179
|
+
[setValue]
|
|
180
|
+
);
|
|
181
|
+
const handleButtonDeactivate = React.useCallback(
|
|
182
|
+
(itemValue) => setValue((prevValue = []) => prevValue.filter((value2) => value2 !== itemValue)),
|
|
183
|
+
[setValue]
|
|
184
|
+
);
|
|
185
|
+
return <ToggleGroupValueProvider
|
|
186
|
+
scope={props.__scopeToggleGroup}
|
|
187
|
+
type="multiple"
|
|
188
|
+
value={value}
|
|
189
|
+
defaultValue={value}
|
|
190
|
+
onItemActivate={handleButtonActivate}
|
|
191
|
+
onItemDeactivate={handleButtonDeactivate}
|
|
192
|
+
><ToggleGroupImpl {...toggleGroupMultipleProps} ref={forwardedRef} /></ToggleGroupValueProvider>;
|
|
193
|
+
});
|
|
194
|
+
ToggleGroup.displayName = TOGGLE_GROUP_NAME;
|
|
195
|
+
const [ToggleGroupContext, useToggleGroupContext] = createToggleGroupContext(TOGGLE_GROUP_NAME);
|
|
196
|
+
const ToggleGroupImplElementFrame = styled(Group, {
|
|
197
|
+
name: TOGGLE_GROUP_NAME,
|
|
198
|
+
variants: {
|
|
199
|
+
unstyled: {
|
|
200
|
+
false: {
|
|
201
|
+
backgroundColor: "$background"
|
|
202
|
+
}
|
|
203
|
+
},
|
|
204
|
+
orientation: {
|
|
205
|
+
vertical: {
|
|
206
|
+
flexDirection: "column",
|
|
207
|
+
spaceDirection: "vertical"
|
|
208
|
+
},
|
|
209
|
+
horizontal: {
|
|
210
|
+
flexDirection: "row",
|
|
211
|
+
spaceDirection: "horizontal"
|
|
212
|
+
}
|
|
213
|
+
}
|
|
214
|
+
},
|
|
215
|
+
defaultVariants: {
|
|
216
|
+
unstyled: false
|
|
217
|
+
}
|
|
218
|
+
});
|
|
219
|
+
const ToggleGroupImpl = ToggleGroupImplElementFrame.extractable(
|
|
220
|
+
React.forwardRef(
|
|
221
|
+
(props, forwardedRef) => {
|
|
222
|
+
const {
|
|
223
|
+
__scopeToggleGroup,
|
|
224
|
+
disabled = false,
|
|
225
|
+
orientation = "horizontal",
|
|
226
|
+
dir,
|
|
227
|
+
rovingFocus = true,
|
|
228
|
+
loop = true,
|
|
229
|
+
unstyled = false,
|
|
230
|
+
size: sizeProp = "$true",
|
|
231
|
+
sizeAdjust = 0,
|
|
232
|
+
...toggleGroupProps
|
|
233
|
+
} = props;
|
|
234
|
+
const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeToggleGroup);
|
|
235
|
+
const direction = useDirection(dir);
|
|
236
|
+
const commonProps = {
|
|
237
|
+
role: "togglegroup",
|
|
238
|
+
dir: direction,
|
|
239
|
+
...toggleGroupProps
|
|
240
|
+
};
|
|
241
|
+
const adjustedSize = getVariableValue(
|
|
242
|
+
stepTokenUpOrDown("size", props.size, sizeAdjust)
|
|
243
|
+
);
|
|
244
|
+
const size = Math.round(adjustedSize * 0.45);
|
|
245
|
+
return <ToggleGroupContext
|
|
246
|
+
scope={__scopeToggleGroup}
|
|
247
|
+
rovingFocus={rovingFocus}
|
|
248
|
+
disabled={disabled}
|
|
249
|
+
size={size}
|
|
250
|
+
>{rovingFocus ? <RovingFocusGroup
|
|
251
|
+
asChild
|
|
252
|
+
{...rovingFocusGroupScope}
|
|
253
|
+
orientation={orientation}
|
|
254
|
+
dir={direction}
|
|
255
|
+
loop={loop}
|
|
256
|
+
><ToggleGroupImplElementFrame
|
|
257
|
+
aria-orientation={orientation}
|
|
258
|
+
orientation={orientation}
|
|
259
|
+
axis={orientation}
|
|
260
|
+
ref={forwardedRef}
|
|
261
|
+
data-disabled={disabled ? "" : void 0}
|
|
262
|
+
unstyled={unstyled}
|
|
263
|
+
{...commonProps}
|
|
264
|
+
/></RovingFocusGroup> : <ToggleGroupImplElementFrame
|
|
265
|
+
aria-orientation={orientation}
|
|
266
|
+
ref={forwardedRef}
|
|
267
|
+
orientation={orientation}
|
|
268
|
+
data-disabled={disabled ? "" : void 0}
|
|
269
|
+
unstyled={unstyled}
|
|
270
|
+
{...commonProps}
|
|
271
|
+
/>}</ToggleGroupContext>;
|
|
272
|
+
}
|
|
273
|
+
)
|
|
274
|
+
);
|
|
275
|
+
export {
|
|
276
|
+
ToggleGroup,
|
|
277
|
+
createToggleGroupScope
|
|
278
|
+
};
|
|
2
279
|
//# sourceMappingURL=ToggleGroup.mjs.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ToggleGroup.tsx"],
|
|
4
4
|
"sourcesContent": ["import { Scope, createContextScope } from '@tamagui/create-context'\nimport { registerFocusable } from '@tamagui/focusable'\nimport { getFontSize } from '@tamagui/font-size'\nimport { stepTokenUpOrDown } from '@tamagui/get-size'\nimport { Group, GroupProps, useGroupItem } from '@tamagui/group'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { RovingFocusGroup, createRovingFocusGroupScope } from '@tamagui/roving-focus'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport { useDirection } from '@tamagui/use-direction'\nimport {\n GetProps,\n SizeTokens,\n getVariableValue,\n isWeb,\n styled,\n useTheme,\n withStaticProperties,\n} from '@tamagui/web'\nimport React from 'react'\n\nimport { Toggle, ToggleFrame, ToggleProps } from './Toggle'\n\nconst TOGGLE_GROUP_NAME = 'ToggleGroup'\nconst [createToggleGroupContext, createToggleGroupScope] = createContextScope(\n TOGGLE_GROUP_NAME,\n [createRovingFocusGroupScope]\n)\n/* -------------------------------------------------------------------------------------------------\n * ToggleGroupItem\n * -----------------------------------------------------------------------------------------------*/\n\nconst TOGGLE_GROUP_ITEM_NAME = 'ToggleGroupItem'\n\ntype ToggleGroupItemContextValue = { disabled?: boolean }\n\nconst [createToggleGroupItemContext, createToggleGroupItemScope] =\n createContextScope(TOGGLE_GROUP_ITEM_NAME)\nconst [ToggleGroupItemProvider, useToggleGroupItemContext] =\n createToggleGroupContext<ToggleGroupItemContextValue>(TOGGLE_GROUP_NAME)\nconst useToggleGroupItemScope = createToggleGroupItemScope()\n\ntype ToggleGroupItemElement = ToggleGroupItemImplElement\n\ntype ToggleGroupItemProps = GetProps<typeof ToggleFrame> & {\n value: string\n id?: string\n disabled?: boolean\n size?: SizeTokens\n /**\n * Used to disable passing styles down to children.\n */\n disablePassStyles?: boolean\n}\nconst ToggleGroupItem = ToggleFrame.extractable(\n React.forwardRef<ToggleGroupItemElement, ToggleGroupItemProps>(\n (props: ScopedProps<ToggleGroupItemProps>, forwardedRef) => {\n const valueContext = useToggleGroupValueContext(\n TOGGLE_GROUP_ITEM_NAME,\n props.__scopeToggleGroup\n )\n const context = useToggleGroupContext(\n TOGGLE_GROUP_ITEM_NAME,\n props.__scopeToggleGroup\n )\n const __scopeToggleGroup = props.__scopeToggleGroup\n const rovingFocusGroupScope = useRovingFocusGroupScope(props.__scopeToggleGroup)\n const pressed = valueContext.value.includes(props.value)\n const disabled = context.disabled || props.disabled || false\n const ref = React.useRef<HTMLDivElement>(null)\n const groupItemProps = useGroupItem({ disabled })\n const size = props.size ?? context.size\n\n const sizeProps: Record<string, any> = {\n width: undefined,\n height: undefined,\n padding: getVariableValue(size) * 0.6,\n }\n if (props.orientation === 'horizontal')\n sizeProps.height = getVariableValue(size) * 2.4\n else sizeProps.width = getVariableValue(size) * 2.4\n\n const iconSize = (typeof size === 'number' ? size * 0.7 : getFontSize(size)) * 1.2\n\n const theme = useTheme()\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color: theme.color })\n\n const childrens = React.Children.toArray(props.children)\n const children = childrens.map((child) => {\n if (props.disablePassStyles || !React.isValidElement(child)) {\n return child\n }\n return getThemedIcon(child)\n })\n\n const commonProps = { ...props, pressed, disabled, ...sizeProps, children }\n\n return (\n <ToggleGroupItemProvider scope={__scopeToggleGroup}>\n {context.rovingFocus ? (\n <RovingFocusGroup.Item\n asChild\n {...rovingFocusGroupScope}\n focusable={!disabled}\n active={pressed}\n >\n <ToggleFrame\n asChild\n focusable={!disabled}\n disabled={disabled}\n ref={ref}\n {...groupItemProps}\n >\n <ToggleGroupItemImpl {...commonProps} ref={forwardedRef} />\n </ToggleFrame>\n </RovingFocusGroup.Item>\n ) : (\n <ToggleFrame asChild focusable={!disabled} disabled={disabled} ref={ref}>\n <ToggleGroupItemImpl {...commonProps} ref={forwardedRef} />\n </ToggleFrame>\n )}\n </ToggleGroupItemProvider>\n )\n }\n )\n)\nToggleGroupItem.displayName = TOGGLE_GROUP_ITEM_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype ToggleGroupItemImplElement = React.ElementRef<typeof Toggle>\ntype ToggleGroupItemImplProps = Omit<\n ToggleProps,\n 'defaultPressed' | 'onPressedChange' | 'size'\n> & {\n /**\n * A string value for the toggle group item. All items within a toggle group should use a unique value.\n */\n value: string\n size?: SizeTokens\n}\n\nconst ToggleGroupItemImpl = ToggleFrame.extractable(\n React.forwardRef<ToggleGroupItemImplElement, ToggleGroupItemImplProps>(\n (props: ScopedProps<ToggleGroupItemImplProps>, forwardedRef) => {\n const { __scopeToggleGroup, value, ...itemProps } = props\n const valueContext = useToggleGroupValueContext(\n TOGGLE_GROUP_ITEM_NAME,\n __scopeToggleGroup\n )\n const singleProps = {\n 'aria-pressed': undefined,\n }\n const typeProps = valueContext.type === 'single' ? singleProps : undefined\n\n return (\n <Toggle\n {...typeProps}\n {...itemProps}\n ref={forwardedRef}\n onPressedChange={(pressed) => {\n if (pressed) {\n valueContext.onItemActivate(value)\n } else {\n valueContext.onItemDeactivate(value)\n }\n }}\n />\n )\n }\n )\n)\n\n/* -----------------------------------------------------------------------------------------------*/\n\n/* -------------------------------------------------------------------------------------------------\n * ToggleGroup\n * -----------------------------------------------------------------------------------------------*/\n\ntype ScopedProps<P> = P & { __scopeToggleGroup?: Scope }\n\nconst useRovingFocusGroupScope = createRovingFocusGroupScope()\n\ntype ToggleGroupElement = ToggleGroupImplSingleElement | ToggleGroupImplMultipleElement\ninterface ToggleGroupSingleProps extends ToggleGroupImplSingleProps {\n type: 'single'\n}\ninterface ToggleGroupMultipleProps extends ToggleGroupImplMultipleProps {\n type: 'multiple'\n}\n\ntype ToggleGroupProps = ToggleGroupSingleProps | ToggleGroupMultipleProps\n\nconst ToggleGroup = withStaticProperties(\n React.forwardRef<ToggleGroupElement, ToggleGroupProps>((props, forwardedRef) => {\n const { type, ...toggleGroupProps } = props\n\n if (!isWeb) {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useEffect(() => {\n if (!props.id) return\n return registerFocusable(props.id, {\n // TODO: would be nice to focus on the first child later - could be done with reforest\n // for now leaving it empty\n focus: () => {},\n })\n }, [props.id])\n }\n\n if (type === 'single') {\n const singleProps = toggleGroupProps as ToggleGroupImplSingleProps\n return <ToggleGroupImplSingle {...singleProps} ref={forwardedRef} />\n }\n\n if (type === 'multiple') {\n const multipleProps = toggleGroupProps as ToggleGroupImplMultipleProps\n return <ToggleGroupImplMultiple {...multipleProps} ref={forwardedRef} />\n }\n\n throw new Error(`Missing prop \\`type\\` expected on \\`${TOGGLE_GROUP_NAME}\\``)\n }),\n {\n Item: ToggleGroupItem,\n }\n)\n\nToggleGroup.displayName = TOGGLE_GROUP_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype ToggleGroupValueContextValue = {\n type: 'single' | 'multiple'\n defaultValue?: string | string[]\n value: string[]\n onItemActivate(value: string): void\n onItemDeactivate(value: string): void\n}\n\nconst [ToggleGroupValueProvider, useToggleGroupValueContext] =\n createToggleGroupContext<ToggleGroupValueContextValue>(TOGGLE_GROUP_NAME)\n\ntype ToggleGroupImplSingleElement = ToggleGroupImplElement\ninterface ToggleGroupImplSingleProps extends ToggleGroupImplProps {\n /**\n * The controlled stateful value of the item that is pressed.\n */\n value?: string\n /**\n * The value of the item that is pressed when initially rendered. Use\n * `defaultValue` if you do not need to control the state of a toggle group.\n */\n defaultValue?: string\n /**\n * The callback that fires when the value of the toggle group changes.\n */\n onValueChange?(value: string): void\n /**\n * Won't let the user turn the active item off.\n */\n disableDeactivation?: boolean\n}\n\nconst ToggleGroupImplSingle = React.forwardRef<\n ToggleGroupImplSingleElement,\n ToggleGroupImplSingleProps\n>((props: ScopedProps<ToggleGroupImplSingleProps>, forwardedRef) => {\n const {\n value: valueProp,\n defaultValue,\n onValueChange = () => {},\n disableDeactivation = false,\n ...toggleGroupSingleProps\n } = props\n\n const [value, setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue!,\n onChange: onValueChange,\n })\n\n return (\n <ToggleGroupValueProvider\n scope={props.__scopeToggleGroup}\n type=\"single\"\n value={value ? [value] : []}\n defaultValue={value}\n onItemActivate={setValue}\n onItemDeactivate={React.useCallback(() => disableDeactivation ? null : setValue(''), [setValue, disableDeactivation])}\n >\n <ToggleGroupImpl {...toggleGroupSingleProps} ref={forwardedRef} />\n </ToggleGroupValueProvider>\n )\n})\n\ntype ToggleGroupImplMultipleElement = ToggleGroupImplElement\ninterface ToggleGroupImplMultipleProps extends ToggleGroupImplProps {\n /**\n * The controlled stateful value of the items that are pressed.\n */\n value?: string[]\n /**\n * The value of the items that are pressed when initially rendered. Use\n * `defaultValue` if you do not need to control the state of a toggle group.\n */\n defaultValue?: string[]\n /**\n * The callback that fires when the state of the toggle group changes.\n */\n onValueChange?(value: string[]): void\n}\n\nconst ToggleGroupImplMultiple = React.forwardRef<\n ToggleGroupImplMultipleElement,\n ToggleGroupImplMultipleProps\n>((props: ScopedProps<ToggleGroupImplMultipleProps>, forwardedRef) => {\n const {\n value: valueProp,\n defaultValue,\n onValueChange = () => {},\n ...toggleGroupMultipleProps\n } = props\n\n const [value = [], setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue!,\n onChange: onValueChange,\n })\n\n const handleButtonActivate = React.useCallback(\n (itemValue: string) => setValue((prevValue = []) => [...prevValue, itemValue]),\n [setValue]\n )\n\n const handleButtonDeactivate = React.useCallback(\n (itemValue: string) =>\n setValue((prevValue = []) => prevValue.filter((value) => value !== itemValue)),\n [setValue]\n )\n\n return (\n <ToggleGroupValueProvider\n scope={props.__scopeToggleGroup}\n type=\"multiple\"\n value={value}\n defaultValue={value}\n onItemActivate={handleButtonActivate}\n onItemDeactivate={handleButtonDeactivate}\n >\n <ToggleGroupImpl {...toggleGroupMultipleProps} ref={forwardedRef} />\n </ToggleGroupValueProvider>\n )\n})\n\nToggleGroup.displayName = TOGGLE_GROUP_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype ToggleGroupContextValue = {\n rovingFocus: boolean\n disabled: boolean\n size: SizeTokens\n}\n\nconst [ToggleGroupContext, useToggleGroupContext] =\n createToggleGroupContext<ToggleGroupContextValue>(TOGGLE_GROUP_NAME)\n\ntype RovingFocusGroupProps = React.ComponentPropsWithoutRef<typeof RovingFocusGroup>\ntype TamaguiElement = HTMLElement\ntype ToggleGroupImplElement = TamaguiElement\n\nconst ToggleGroupImplElementFrame = styled(Group, {\n name: TOGGLE_GROUP_NAME,\n variants: {\n unstyled: {\n false: {\n backgroundColor: '$background',\n },\n },\n orientation: {\n vertical: {\n flexDirection: 'column',\n spaceDirection: 'vertical',\n },\n horizontal: {\n flexDirection: 'row',\n spaceDirection: 'horizontal',\n },\n },\n } as const,\n defaultVariants: {\n unstyled: false,\n },\n})\n\ntype ToggleGroupImplProps = GetProps<typeof ToggleGroupImplElementFrame> &\n GroupProps & {\n rovingFocus?: boolean\n dir?: RovingFocusGroupProps['dir']\n loop?: RovingFocusGroupProps['loop']\n sizeAdjust?: number\n }\n\nconst ToggleGroupImpl = ToggleGroupImplElementFrame.extractable(\n React.forwardRef<ToggleGroupImplElement, ToggleGroupImplProps>(\n (props: ScopedProps<ToggleGroupImplProps>, forwardedRef) => {\n const {\n __scopeToggleGroup,\n disabled = false,\n orientation = 'horizontal',\n dir,\n rovingFocus = true,\n loop = true,\n unstyled = false,\n size: sizeProp = '$true',\n sizeAdjust = 0,\n ...toggleGroupProps\n } = props\n const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeToggleGroup)\n const direction = useDirection(dir)\n const commonProps = {\n role: 'togglegroup',\n dir: direction,\n ...toggleGroupProps,\n }\n const adjustedSize = getVariableValue(\n stepTokenUpOrDown('size', props.size, sizeAdjust)\n )\n const size = Math.round(adjustedSize * 0.45)\n\n return (\n <ToggleGroupContext\n scope={__scopeToggleGroup}\n rovingFocus={rovingFocus}\n disabled={disabled}\n size={size}\n >\n {rovingFocus ? (\n <RovingFocusGroup\n asChild\n {...rovingFocusGroupScope}\n orientation={orientation}\n dir={direction}\n loop={loop}\n >\n <ToggleGroupImplElementFrame\n aria-orientation={orientation}\n orientation={orientation}\n axis={orientation}\n ref={forwardedRef}\n data-disabled={disabled ? '' : undefined}\n unstyled={unstyled}\n {...commonProps}\n />\n </RovingFocusGroup>\n ) : (\n <ToggleGroupImplElementFrame\n aria-orientation={orientation}\n ref={forwardedRef}\n orientation={orientation}\n data-disabled={disabled ? '' : undefined}\n unstyled={unstyled}\n {...commonProps}\n />\n )}\n </ToggleGroupContext>\n )\n }\n )\n)\n\nexport { ToggleGroup, createToggleGroupScope }\nexport type {\n ToggleGroupItemProps,\n ToggleGroupMultipleProps,\n ToggleGroupSingleProps,\n ToggleGroupProps,\n}\n"],
|
|
5
|
-
"mappings": "AAAA,
|
|
6
|
-
"names": ["
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["value"]
|
|
7
7
|
}
|
package/dist/jsx/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export*from"./ToggleGroup";
|
|
1
|
+
export * from "./ToggleGroup";
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/dist/jsx/index.js.map
CHANGED
package/dist/jsx/index.mjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export*from"./ToggleGroup";
|
|
1
|
+
export * from "./ToggleGroup";
|
|
2
2
|
//# sourceMappingURL=index.mjs.map
|
package/dist/jsx/index.mjs.map
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/toggle-group",
|
|
3
|
-
"version": "1.14.
|
|
3
|
+
"version": "1.14.2",
|
|
4
4
|
"sideEffects": [
|
|
5
5
|
"*.css"
|
|
6
6
|
],
|
|
@@ -31,23 +31,23 @@
|
|
|
31
31
|
}
|
|
32
32
|
},
|
|
33
33
|
"dependencies": {
|
|
34
|
-
"@tamagui/create-context": "1.14.
|
|
35
|
-
"@tamagui/focusable": "1.14.
|
|
36
|
-
"@tamagui/font-size": "1.14.
|
|
37
|
-
"@tamagui/get-size": "1.14.
|
|
38
|
-
"@tamagui/group": "1.14.
|
|
39
|
-
"@tamagui/helpers-tamagui": "1.14.
|
|
40
|
-
"@tamagui/roving-focus": "1.14.
|
|
41
|
-
"@tamagui/stacks": "1.14.
|
|
42
|
-
"@tamagui/use-controllable-state": "1.14.
|
|
43
|
-
"@tamagui/use-direction": "1.14.
|
|
44
|
-
"@tamagui/web": "1.14.
|
|
34
|
+
"@tamagui/create-context": "1.14.2",
|
|
35
|
+
"@tamagui/focusable": "1.14.2",
|
|
36
|
+
"@tamagui/font-size": "1.14.2",
|
|
37
|
+
"@tamagui/get-size": "1.14.2",
|
|
38
|
+
"@tamagui/group": "1.14.2",
|
|
39
|
+
"@tamagui/helpers-tamagui": "1.14.2",
|
|
40
|
+
"@tamagui/roving-focus": "1.14.2",
|
|
41
|
+
"@tamagui/stacks": "1.14.2",
|
|
42
|
+
"@tamagui/use-controllable-state": "1.14.2",
|
|
43
|
+
"@tamagui/use-direction": "1.14.2",
|
|
44
|
+
"@tamagui/web": "1.14.2"
|
|
45
45
|
},
|
|
46
46
|
"peerDependencies": {
|
|
47
47
|
"react": "*"
|
|
48
48
|
},
|
|
49
49
|
"devDependencies": {
|
|
50
|
-
"@tamagui/build": "1.14.
|
|
50
|
+
"@tamagui/build": "1.14.2",
|
|
51
51
|
"react": "^18.2.0"
|
|
52
52
|
},
|
|
53
53
|
"publishConfig": {
|