@tamagui/toggle-group 1.141.5 → 1.142.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/Toggle.cjs +23 -15
- package/dist/cjs/Toggle.js +20 -15
- package/dist/cjs/Toggle.js.map +2 -2
- package/dist/cjs/Toggle.native.js +26 -17
- package/dist/cjs/Toggle.native.js.map +1 -1
- package/dist/cjs/ToggleGroup.cjs +46 -36
- package/dist/cjs/ToggleGroup.js +82 -87
- package/dist/cjs/ToggleGroup.js.map +2 -2
- package/dist/cjs/ToggleGroup.native.js +48 -36
- package/dist/cjs/ToggleGroup.native.js.map +1 -1
- package/dist/esm/Toggle.js +20 -15
- package/dist/esm/Toggle.js.map +2 -2
- package/dist/esm/Toggle.mjs +23 -15
- package/dist/esm/Toggle.mjs.map +1 -1
- package/dist/esm/Toggle.native.js +26 -17
- package/dist/esm/Toggle.native.js.map +1 -1
- package/dist/esm/ToggleGroup.js +84 -95
- package/dist/esm/ToggleGroup.js.map +1 -1
- package/dist/esm/ToggleGroup.mjs +48 -38
- package/dist/esm/ToggleGroup.mjs.map +1 -1
- package/dist/esm/ToggleGroup.native.js +50 -38
- package/dist/esm/ToggleGroup.native.js.map +1 -1
- package/dist/jsx/Toggle.js +20 -15
- package/dist/jsx/Toggle.js.map +2 -2
- package/dist/jsx/Toggle.mjs +23 -15
- package/dist/jsx/Toggle.mjs.map +1 -1
- package/dist/jsx/Toggle.native.js +26 -17
- package/dist/jsx/Toggle.native.js.map +1 -1
- package/dist/jsx/ToggleGroup.js +84 -95
- package/dist/jsx/ToggleGroup.js.map +1 -1
- package/dist/jsx/ToggleGroup.mjs +48 -38
- package/dist/jsx/ToggleGroup.mjs.map +1 -1
- package/dist/jsx/ToggleGroup.native.js +48 -36
- package/dist/jsx/ToggleGroup.native.js.map +1 -1
- package/package.json +15 -15
- package/src/Toggle.tsx +23 -25
- package/src/ToggleGroup.tsx +136 -140
- package/types/Toggle.d.ts +10 -14
- package/types/Toggle.d.ts.map +1 -1
- package/types/ToggleGroup.d.ts +165 -9
- package/types/ToggleGroup.d.ts.map +1 -1
package/dist/esm/ToggleGroup.js
CHANGED
|
@@ -8,48 +8,40 @@ import { useGetThemedIcon } from "@tamagui/helpers-tamagui";
|
|
|
8
8
|
import { RovingFocusGroup } from "@tamagui/roving-focus";
|
|
9
9
|
import { useControllableState } from "@tamagui/use-controllable-state";
|
|
10
10
|
import { useDirection } from "@tamagui/use-direction";
|
|
11
|
-
import {
|
|
12
|
-
createStyledContext,
|
|
13
|
-
getVariableValue,
|
|
14
|
-
styled,
|
|
15
|
-
usePropsAndStyle,
|
|
16
|
-
useTheme
|
|
17
|
-
} from "@tamagui/web";
|
|
11
|
+
import { createStyledContext, getVariableValue, styled, useTheme } from "@tamagui/web";
|
|
18
12
|
import React from "react";
|
|
19
|
-
import { Toggle, ToggleFrame } from "./Toggle";
|
|
13
|
+
import { Toggle, ToggleFrame, context as ToggleContext } from "./Toggle";
|
|
20
14
|
import { jsx } from "react/jsx-runtime";
|
|
21
|
-
const TOGGLE_GROUP_NAME = "ToggleGroup", TOGGLE_GROUP_ITEM_NAME = "ToggleGroupItem", TOGGLE_GROUP_CONTEXT = "ToggleGroup", { Provider: ToggleGroupItemProvider
|
|
22
|
-
|
|
23
|
-
(props,
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
}
|
|
52
|
-
)
|
|
15
|
+
const TOGGLE_GROUP_NAME = "ToggleGroup", TOGGLE_GROUP_ITEM_NAME = "ToggleGroupItem", TOGGLE_GROUP_CONTEXT = "ToggleGroup", { Provider: ToggleGroupItemProvider } = createStyledContext(), { Provider: ToggleGroupContext, useStyledContext: useToggleGroupContext } = createStyledContext(), ToggleGroupItem = ToggleFrame.styleable(
|
|
16
|
+
(props, forwardedRef) => {
|
|
17
|
+
const valueContext = useToggleGroupValueContext(props.__scopeToggleGroup), context = useToggleGroupContext(props.__scopeToggleGroup), toggleContext = ToggleContext.useStyledContext(props.__scopeToggleGroup), pressed = valueContext?.value.includes(props.value), toggledStyle = props.toggledStyle || toggleContext.toggledStyle, color = props.color || toggleContext.color, { disablePassStyles, toggledStyle: _, ...rest } = props, disabled = context.disabled || props.disabled || !1, groupItemProps = useGroupItem({ disabled }), size = props.size ?? context.size, sizeProps = props.unstyled ? {} : {
|
|
18
|
+
width: void 0,
|
|
19
|
+
height: void 0,
|
|
20
|
+
padding: getVariableValue(size) * 0.6
|
|
21
|
+
}, iconSize = (typeof size == "number" ? size * 0.7 : getFontSize(size)) * 1.2, theme = useTheme(), toggledColor = toggledStyle?.color, getThemedIcon = useGetThemedIcon({
|
|
22
|
+
size: iconSize,
|
|
23
|
+
color: (pressed && toggledColor ? toggledColor : color) || theme.color
|
|
24
|
+
}), children = React.Children.toArray(props.children).map((child) => props.disablePassStyles || !React.isValidElement(child) ? child : React.cloneElement(getThemedIcon(child), { active: pressed })), commonProps = { pressed, disabled, ...sizeProps, ...rest, children }, inner = /* @__PURE__ */ jsx(
|
|
25
|
+
ToggleGroupItemImpl,
|
|
26
|
+
{
|
|
27
|
+
...commonProps,
|
|
28
|
+
ref: forwardedRef,
|
|
29
|
+
tabIndex: disabled ? -1 : 0,
|
|
30
|
+
disabled,
|
|
31
|
+
...groupItemProps
|
|
32
|
+
}
|
|
33
|
+
);
|
|
34
|
+
return /* @__PURE__ */ jsx(ToggleGroupItemProvider, { scope: props.__scopeToggleGroup, children: /* @__PURE__ */ jsx(ToggleContext.Provider, { color, toggledStyle, children: context.rovingFocus ? /* @__PURE__ */ jsx(
|
|
35
|
+
RovingFocusGroup.Item,
|
|
36
|
+
{
|
|
37
|
+
asChild: "except-style",
|
|
38
|
+
__scopeRovingFocusGroup: props.__scopeToggleGroup || TOGGLE_GROUP_CONTEXT,
|
|
39
|
+
focusable: !disabled,
|
|
40
|
+
active: pressed,
|
|
41
|
+
children: inner
|
|
42
|
+
}
|
|
43
|
+
) : inner }) });
|
|
44
|
+
}
|
|
53
45
|
);
|
|
54
46
|
ToggleGroupItem.displayName = TOGGLE_GROUP_ITEM_NAME;
|
|
55
47
|
const ToggleGroupItemImpl = React.forwardRef((props, forwardedRef) => {
|
|
@@ -177,73 +169,70 @@ const ToggleGroupImplElementFrame = styled(Group, {
|
|
|
177
169
|
defaultVariants: {
|
|
178
170
|
unstyled: process.env.TAMAGUI_HEADLESS === "1"
|
|
179
171
|
}
|
|
180
|
-
}), ToggleGroupImpl = ToggleGroupImplElementFrame.
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
172
|
+
}), ToggleGroupImpl = ToggleGroupImplElementFrame.styleable((props, forwardedRef) => {
|
|
173
|
+
const {
|
|
174
|
+
__scopeToggleGroup,
|
|
175
|
+
disabled = !1,
|
|
176
|
+
orientation = "horizontal",
|
|
177
|
+
dir,
|
|
178
|
+
rovingFocus = !0,
|
|
179
|
+
loop = !0,
|
|
180
|
+
unstyled = !1,
|
|
181
|
+
size: sizeProp = "$true",
|
|
182
|
+
sizeAdjust = 0,
|
|
183
|
+
toggledStyle,
|
|
184
|
+
color,
|
|
185
|
+
...toggleGroupProps
|
|
186
|
+
} = props, direction = useDirection(dir), commonProps = {
|
|
187
|
+
role: "group",
|
|
188
|
+
dir: direction,
|
|
189
|
+
...toggleGroupProps
|
|
190
|
+
}, adjustedSize = getVariableValue(
|
|
191
|
+
getSize(sizeProp, {
|
|
192
|
+
shift: sizeAdjust
|
|
193
|
+
})
|
|
194
|
+
), size = Math.round(adjustedSize * 0.45);
|
|
195
|
+
return /* @__PURE__ */ jsx(
|
|
196
|
+
ToggleGroupContext,
|
|
197
|
+
{
|
|
198
|
+
scope: __scopeToggleGroup,
|
|
199
|
+
rovingFocus,
|
|
200
|
+
disabled,
|
|
201
|
+
size,
|
|
202
|
+
children: /* @__PURE__ */ jsx(ToggleContext.Provider, { color, toggledStyle, children: rovingFocus ? /* @__PURE__ */ jsx(
|
|
203
|
+
RovingFocusGroup,
|
|
205
204
|
{
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
{
|
|
213
|
-
asChild: "except-style",
|
|
214
|
-
__scopeRovingFocusGroup: __scopeToggleGroup || TOGGLE_GROUP_CONTEXT,
|
|
215
|
-
orientation,
|
|
216
|
-
dir: direction,
|
|
217
|
-
loop,
|
|
218
|
-
children: /* @__PURE__ */ jsx(
|
|
219
|
-
ToggleGroupImplElementFrame,
|
|
220
|
-
{
|
|
221
|
-
"aria-orientation": orientation,
|
|
222
|
-
orientation,
|
|
223
|
-
axis: orientation,
|
|
224
|
-
ref: forwardedRef,
|
|
225
|
-
"data-disabled": disabled ? "" : void 0,
|
|
226
|
-
unstyled,
|
|
227
|
-
...commonProps
|
|
228
|
-
}
|
|
229
|
-
)
|
|
230
|
-
}
|
|
231
|
-
) : /* @__PURE__ */ jsx(
|
|
205
|
+
asChild: "except-style",
|
|
206
|
+
__scopeRovingFocusGroup: __scopeToggleGroup || TOGGLE_GROUP_CONTEXT,
|
|
207
|
+
orientation,
|
|
208
|
+
dir: direction,
|
|
209
|
+
loop,
|
|
210
|
+
children: /* @__PURE__ */ jsx(
|
|
232
211
|
ToggleGroupImplElementFrame,
|
|
233
212
|
{
|
|
234
213
|
"aria-orientation": orientation,
|
|
235
|
-
ref: forwardedRef,
|
|
236
214
|
orientation,
|
|
215
|
+
ref: forwardedRef,
|
|
237
216
|
"data-disabled": disabled ? "" : void 0,
|
|
238
217
|
unstyled,
|
|
239
218
|
...commonProps
|
|
240
219
|
}
|
|
241
220
|
)
|
|
242
221
|
}
|
|
243
|
-
)
|
|
222
|
+
) : /* @__PURE__ */ jsx(
|
|
223
|
+
ToggleGroupImplElementFrame,
|
|
224
|
+
{
|
|
225
|
+
"aria-orientation": orientation,
|
|
226
|
+
ref: forwardedRef,
|
|
227
|
+
orientation,
|
|
228
|
+
"data-disabled": disabled ? "" : void 0,
|
|
229
|
+
unstyled,
|
|
230
|
+
...commonProps
|
|
231
|
+
}
|
|
232
|
+
) })
|
|
244
233
|
}
|
|
245
|
-
)
|
|
246
|
-
);
|
|
234
|
+
);
|
|
235
|
+
});
|
|
247
236
|
export {
|
|
248
237
|
ToggleGroup
|
|
249
238
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ToggleGroup.tsx"],
|
|
4
|
-
"mappings": "AAAA,SAAS,aAAa;AACtB,SAAS,yBAAyB;AAClC,SAAS,mBAAmB;AAC5B,SAAS,eAAe;AAExB,SAAS,OAAO,oBAAoB;AACpC,SAAS,4BAA4B;AACrC,SAAS,wBAAwB;AACjC,SAAS,wBAAwB;AACjC,SAAS,4BAA4B;AACrC,SAAS,oBAAoB;AAE7B
|
|
4
|
+
"mappings": "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",
|
|
5
5
|
"names": ["value"]
|
|
6
6
|
}
|
package/dist/esm/ToggleGroup.mjs
CHANGED
|
@@ -8,32 +8,32 @@ import { useGetThemedIcon } from "@tamagui/helpers-tamagui";
|
|
|
8
8
|
import { RovingFocusGroup } from "@tamagui/roving-focus";
|
|
9
9
|
import { useControllableState } from "@tamagui/use-controllable-state";
|
|
10
10
|
import { useDirection } from "@tamagui/use-direction";
|
|
11
|
-
import { createStyledContext, getVariableValue, styled,
|
|
11
|
+
import { createStyledContext, getVariableValue, styled, useTheme } from "@tamagui/web";
|
|
12
12
|
import React from "react";
|
|
13
|
-
import { Toggle, ToggleFrame } from "./Toggle.mjs";
|
|
13
|
+
import { Toggle, ToggleFrame, context as ToggleContext } from "./Toggle.mjs";
|
|
14
14
|
import { jsx } from "react/jsx-runtime";
|
|
15
15
|
const TOGGLE_GROUP_NAME = "ToggleGroup",
|
|
16
16
|
TOGGLE_GROUP_ITEM_NAME = "ToggleGroupItem",
|
|
17
17
|
TOGGLE_GROUP_CONTEXT = "ToggleGroup",
|
|
18
18
|
{
|
|
19
|
-
Provider: ToggleGroupItemProvider
|
|
20
|
-
useStyledContext: useToggleGroupItemContext
|
|
19
|
+
Provider: ToggleGroupItemProvider
|
|
21
20
|
} = createStyledContext(),
|
|
22
21
|
{
|
|
23
22
|
Provider: ToggleGroupContext,
|
|
24
23
|
useStyledContext: useToggleGroupContext
|
|
25
24
|
} = createStyledContext(),
|
|
26
|
-
ToggleGroupItem = ToggleFrame.
|
|
27
|
-
const
|
|
28
|
-
|
|
29
|
-
|
|
25
|
+
ToggleGroupItem = ToggleFrame.styleable((props, forwardedRef) => {
|
|
26
|
+
const valueContext = useToggleGroupValueContext(props.__scopeToggleGroup),
|
|
27
|
+
context = useToggleGroupContext(props.__scopeToggleGroup),
|
|
28
|
+
toggleContext = ToggleContext.useStyledContext(props.__scopeToggleGroup),
|
|
29
|
+
pressed = valueContext?.value.includes(props.value),
|
|
30
|
+
toggledStyle = props.toggledStyle || toggleContext.toggledStyle,
|
|
31
|
+
color = props.color || toggleContext.color,
|
|
30
32
|
{
|
|
31
33
|
disablePassStyles,
|
|
34
|
+
toggledStyle: _,
|
|
32
35
|
...rest
|
|
33
36
|
} = props,
|
|
34
|
-
valueContext = useToggleGroupValueContext(props.__scopeToggleGroup),
|
|
35
|
-
context = useToggleGroupContext(props.__scopeToggleGroup),
|
|
36
|
-
pressed = valueContext?.value.includes(props.value),
|
|
37
37
|
disabled = context.disabled || props.disabled || !1,
|
|
38
38
|
groupItemProps = useGroupItem({
|
|
39
39
|
disabled
|
|
@@ -46,9 +46,10 @@ const TOGGLE_GROUP_NAME = "ToggleGroup",
|
|
|
46
46
|
},
|
|
47
47
|
iconSize = (typeof size == "number" ? size * 0.7 : getFontSize(size)) * 1.2,
|
|
48
48
|
theme = useTheme(),
|
|
49
|
+
toggledColor = toggledStyle?.color,
|
|
49
50
|
getThemedIcon = useGetThemedIcon({
|
|
50
51
|
size: iconSize,
|
|
51
|
-
color: color
|
|
52
|
+
color: (pressed && toggledColor ? toggledColor : color) || theme.color
|
|
52
53
|
}),
|
|
53
54
|
children = React.Children.toArray(props.children).map(child => props.disablePassStyles || !React.isValidElement(child) ? child : React.cloneElement(getThemedIcon(child), {
|
|
54
55
|
active: pressed
|
|
@@ -69,15 +70,19 @@ const TOGGLE_GROUP_NAME = "ToggleGroup",
|
|
|
69
70
|
});
|
|
70
71
|
return /* @__PURE__ */jsx(ToggleGroupItemProvider, {
|
|
71
72
|
scope: props.__scopeToggleGroup,
|
|
72
|
-
children:
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
73
|
+
children: /* @__PURE__ */jsx(ToggleContext.Provider, {
|
|
74
|
+
color,
|
|
75
|
+
toggledStyle,
|
|
76
|
+
children: context.rovingFocus ? /* @__PURE__ */jsx(RovingFocusGroup.Item, {
|
|
77
|
+
asChild: "except-style",
|
|
78
|
+
__scopeRovingFocusGroup: props.__scopeToggleGroup || TOGGLE_GROUP_CONTEXT,
|
|
79
|
+
focusable: !disabled,
|
|
80
|
+
active: pressed,
|
|
81
|
+
children: inner
|
|
82
|
+
}) : inner
|
|
83
|
+
})
|
|
79
84
|
});
|
|
80
|
-
})
|
|
85
|
+
});
|
|
81
86
|
ToggleGroupItem.displayName = TOGGLE_GROUP_ITEM_NAME;
|
|
82
87
|
const ToggleGroupItemImpl = React.forwardRef((props, forwardedRef) => {
|
|
83
88
|
const {
|
|
@@ -205,7 +210,7 @@ const ToggleGroupImplElementFrame = styled(Group, {
|
|
|
205
210
|
unstyled: process.env.TAMAGUI_HEADLESS === "1"
|
|
206
211
|
}
|
|
207
212
|
}),
|
|
208
|
-
ToggleGroupImpl = ToggleGroupImplElementFrame.
|
|
213
|
+
ToggleGroupImpl = ToggleGroupImplElementFrame.styleable((props, forwardedRef) => {
|
|
209
214
|
const {
|
|
210
215
|
__scopeToggleGroup,
|
|
211
216
|
disabled = !1,
|
|
@@ -216,6 +221,8 @@ const ToggleGroupImplElementFrame = styled(Group, {
|
|
|
216
221
|
unstyled = !1,
|
|
217
222
|
size: sizeProp = "$true",
|
|
218
223
|
sizeAdjust = 0,
|
|
224
|
+
toggledStyle,
|
|
225
|
+
color,
|
|
219
226
|
...toggleGroupProps
|
|
220
227
|
} = props,
|
|
221
228
|
direction = useDirection(dir),
|
|
@@ -233,30 +240,33 @@ const ToggleGroupImplElementFrame = styled(Group, {
|
|
|
233
240
|
rovingFocus,
|
|
234
241
|
disabled,
|
|
235
242
|
size,
|
|
236
|
-
children:
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
children: /* @__PURE__ */jsx(ToggleGroupImplElementFrame, {
|
|
243
|
-
"aria-orientation": orientation,
|
|
243
|
+
children: /* @__PURE__ */jsx(ToggleContext.Provider, {
|
|
244
|
+
color,
|
|
245
|
+
toggledStyle,
|
|
246
|
+
children: rovingFocus ? /* @__PURE__ */jsx(RovingFocusGroup, {
|
|
247
|
+
asChild: "except-style",
|
|
248
|
+
__scopeRovingFocusGroup: __scopeToggleGroup || TOGGLE_GROUP_CONTEXT,
|
|
244
249
|
orientation,
|
|
245
|
-
|
|
250
|
+
dir: direction,
|
|
251
|
+
loop,
|
|
252
|
+
children: /* @__PURE__ */jsx(ToggleGroupImplElementFrame, {
|
|
253
|
+
"aria-orientation": orientation,
|
|
254
|
+
orientation,
|
|
255
|
+
ref: forwardedRef,
|
|
256
|
+
"data-disabled": disabled ? "" : void 0,
|
|
257
|
+
unstyled,
|
|
258
|
+
...commonProps
|
|
259
|
+
})
|
|
260
|
+
}) : /* @__PURE__ */jsx(ToggleGroupImplElementFrame, {
|
|
261
|
+
"aria-orientation": orientation,
|
|
246
262
|
ref: forwardedRef,
|
|
263
|
+
orientation,
|
|
247
264
|
"data-disabled": disabled ? "" : void 0,
|
|
248
265
|
unstyled,
|
|
249
266
|
...commonProps
|
|
250
267
|
})
|
|
251
|
-
}) : /* @__PURE__ */jsx(ToggleGroupImplElementFrame, {
|
|
252
|
-
"aria-orientation": orientation,
|
|
253
|
-
ref: forwardedRef,
|
|
254
|
-
orientation,
|
|
255
|
-
"data-disabled": disabled ? "" : void 0,
|
|
256
|
-
unstyled,
|
|
257
|
-
...commonProps
|
|
258
268
|
})
|
|
259
269
|
});
|
|
260
|
-
})
|
|
270
|
+
});
|
|
261
271
|
export { ToggleGroup };
|
|
262
272
|
//# sourceMappingURL=ToggleGroup.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["isWeb","registerFocusable","getFontSize","getSize","Group","useGroupItem","withStaticProperties","useGetThemedIcon","RovingFocusGroup","useControllableState","useDirection","createStyledContext","getVariableValue","styled","
|
|
1
|
+
{"version":3,"names":["isWeb","registerFocusable","getFontSize","getSize","Group","useGroupItem","withStaticProperties","useGetThemedIcon","RovingFocusGroup","useControllableState","useDirection","createStyledContext","getVariableValue","styled","useTheme","React","Toggle","ToggleFrame","context","ToggleContext","jsx","TOGGLE_GROUP_NAME","TOGGLE_GROUP_ITEM_NAME","TOGGLE_GROUP_CONTEXT","Provider","ToggleGroupItemProvider","ToggleGroupContext","useStyledContext","useToggleGroupContext","ToggleGroupItem","styleable","props","forwardedRef","valueContext","useToggleGroupValueContext","__scopeToggleGroup","toggleContext","pressed","value","includes","toggledStyle","color","disablePassStyles","_","rest","disabled","groupItemProps","size","sizeProps","unstyled","width","height","padding","iconSize","theme","toggledColor","getThemedIcon","children","Children","toArray","map","child","isValidElement","cloneElement","active","commonProps","inner","ToggleGroupItemImpl","ref","tabIndex","scope","rovingFocus","Item","asChild","__scopeRovingFocusGroup","focusable","displayName","forwardRef","itemProps","singleProps","typeProps","type","onPressedChange","onItemActivate","onItemDeactivate","ToggleGroup","toggleGroupProps","useEffect","id","focus","ToggleGroupImplSingle","ToggleGroupImplMultiple","Error","ToggleGroupValueProvider","valueProp","defaultValue","onValueChange","disableDeactivation","toggleGroupSingleProps","setValue","prop","defaultProp","onChange","useCallback","ToggleGroupImpl","toggleGroupMultipleProps","handleButtonActivate","itemValue","prevValue","handleButtonDeactivate","filter","value2","ToggleGroupImplElementFrame","name","variants","false","backgroundColor","orientation","vertical","flexDirection","spaceDirection","horizontal","defaultVariants","process","env","TAMAGUI_HEADLESS","dir","loop","sizeProp","sizeAdjust","direction","role","adjustedSize","shift","Math","round"],"sources":["../../src/ToggleGroup.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
|
|
@@ -9,31 +9,31 @@ import { useGetThemedIcon } from "@tamagui/helpers-tamagui";
|
|
|
9
9
|
import { RovingFocusGroup } from "@tamagui/roving-focus";
|
|
10
10
|
import { useControllableState } from "@tamagui/use-controllable-state";
|
|
11
11
|
import { useDirection } from "@tamagui/use-direction";
|
|
12
|
-
import { createStyledContext, getVariableValue, styled,
|
|
12
|
+
import { createStyledContext, getVariableValue, styled, useTheme } from "@tamagui/web";
|
|
13
13
|
import React from "react";
|
|
14
|
-
import { Toggle, ToggleFrame } from "./Toggle.native.js";
|
|
14
|
+
import { Toggle, ToggleFrame, context as ToggleContext } from "./Toggle.native.js";
|
|
15
15
|
var TOGGLE_GROUP_NAME = "ToggleGroup",
|
|
16
16
|
TOGGLE_GROUP_ITEM_NAME = "ToggleGroupItem",
|
|
17
17
|
TOGGLE_GROUP_CONTEXT = "ToggleGroup",
|
|
18
18
|
{
|
|
19
|
-
Provider: ToggleGroupItemProvider
|
|
20
|
-
useStyledContext: useToggleGroupItemContext
|
|
19
|
+
Provider: ToggleGroupItemProvider
|
|
21
20
|
} = createStyledContext(),
|
|
22
21
|
{
|
|
23
22
|
Provider: ToggleGroupContext,
|
|
24
23
|
useStyledContext: useToggleGroupContext
|
|
25
24
|
} = createStyledContext(),
|
|
26
|
-
ToggleGroupItem = ToggleFrame.
|
|
27
|
-
var
|
|
28
|
-
|
|
29
|
-
|
|
25
|
+
ToggleGroupItem = ToggleFrame.styleable(function (props, forwardedRef) {
|
|
26
|
+
var valueContext = useToggleGroupValueContext(props.__scopeToggleGroup),
|
|
27
|
+
context = useToggleGroupContext(props.__scopeToggleGroup),
|
|
28
|
+
toggleContext = ToggleContext.useStyledContext(props.__scopeToggleGroup),
|
|
29
|
+
pressed = valueContext?.value.includes(props.value),
|
|
30
|
+
toggledStyle = props.toggledStyle || toggleContext.toggledStyle,
|
|
31
|
+
color = props.color || toggleContext.color,
|
|
30
32
|
{
|
|
31
33
|
disablePassStyles,
|
|
34
|
+
toggledStyle: _,
|
|
32
35
|
...rest
|
|
33
36
|
} = props,
|
|
34
|
-
valueContext = useToggleGroupValueContext(props.__scopeToggleGroup),
|
|
35
|
-
context = useToggleGroupContext(props.__scopeToggleGroup),
|
|
36
|
-
pressed = valueContext?.value.includes(props.value),
|
|
37
37
|
disabled = context.disabled || props.disabled || !1,
|
|
38
38
|
groupItemProps = useGroupItem({
|
|
39
39
|
disabled
|
|
@@ -47,9 +47,11 @@ var TOGGLE_GROUP_NAME = "ToggleGroup",
|
|
|
47
47
|
},
|
|
48
48
|
iconSize = (typeof size == "number" ? size * 0.7 : getFontSize(size)) * 1.2,
|
|
49
49
|
theme = useTheme(),
|
|
50
|
+
toggledColor = toggledStyle?.color,
|
|
51
|
+
activeColor = pressed && toggledColor ? toggledColor : color,
|
|
50
52
|
getThemedIcon = useGetThemedIcon({
|
|
51
53
|
size: iconSize,
|
|
52
|
-
color:
|
|
54
|
+
color: activeColor || theme.color
|
|
53
55
|
}),
|
|
54
56
|
childrens = React.Children.toArray(props.children),
|
|
55
57
|
children = childrens.map(function (child) {
|
|
@@ -74,15 +76,19 @@ var TOGGLE_GROUP_NAME = "ToggleGroup",
|
|
|
74
76
|
});
|
|
75
77
|
return /* @__PURE__ */_jsx(ToggleGroupItemProvider, {
|
|
76
78
|
scope: props.__scopeToggleGroup,
|
|
77
|
-
children:
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
79
|
+
children: /* @__PURE__ */_jsx(ToggleContext.Provider, {
|
|
80
|
+
color,
|
|
81
|
+
toggledStyle,
|
|
82
|
+
children: context.rovingFocus ? /* @__PURE__ */_jsx(RovingFocusGroup.Item, {
|
|
83
|
+
asChild: "except-style",
|
|
84
|
+
__scopeRovingFocusGroup: props.__scopeToggleGroup || TOGGLE_GROUP_CONTEXT,
|
|
85
|
+
focusable: !disabled,
|
|
86
|
+
active: pressed,
|
|
87
|
+
children: inner
|
|
88
|
+
}) : inner
|
|
89
|
+
})
|
|
84
90
|
});
|
|
85
|
-
})
|
|
91
|
+
});
|
|
86
92
|
ToggleGroupItem.displayName = TOGGLE_GROUP_ITEM_NAME;
|
|
87
93
|
var ToggleGroupItemImpl = /* @__PURE__ */React.forwardRef(function (props, forwardedRef) {
|
|
88
94
|
var {
|
|
@@ -230,7 +236,7 @@ var ToggleGroupImplElementFrame = styled(Group, {
|
|
|
230
236
|
unstyled: process.env.TAMAGUI_HEADLESS === "1"
|
|
231
237
|
}
|
|
232
238
|
}),
|
|
233
|
-
ToggleGroupImpl = ToggleGroupImplElementFrame.
|
|
239
|
+
ToggleGroupImpl = ToggleGroupImplElementFrame.styleable(function (props, forwardedRef) {
|
|
234
240
|
var {
|
|
235
241
|
__scopeToggleGroup,
|
|
236
242
|
disabled = !1,
|
|
@@ -241,6 +247,8 @@ var ToggleGroupImplElementFrame = styled(Group, {
|
|
|
241
247
|
unstyled = !1,
|
|
242
248
|
size: sizeProp = "$true",
|
|
243
249
|
sizeAdjust = 0,
|
|
250
|
+
toggledStyle,
|
|
251
|
+
color,
|
|
244
252
|
...toggleGroupProps
|
|
245
253
|
} = props,
|
|
246
254
|
direction = useDirection(dir),
|
|
@@ -258,30 +266,34 @@ var ToggleGroupImplElementFrame = styled(Group, {
|
|
|
258
266
|
rovingFocus,
|
|
259
267
|
disabled,
|
|
260
268
|
size,
|
|
261
|
-
children:
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
children: /* @__PURE__ */_jsx(ToggleGroupImplElementFrame, {
|
|
268
|
-
"aria-orientation": orientation,
|
|
269
|
+
children: /* @__PURE__ */_jsx(ToggleContext.Provider, {
|
|
270
|
+
color,
|
|
271
|
+
toggledStyle,
|
|
272
|
+
children: rovingFocus ? /* @__PURE__ */_jsx(RovingFocusGroup, {
|
|
273
|
+
asChild: "except-style",
|
|
274
|
+
__scopeRovingFocusGroup: __scopeToggleGroup || TOGGLE_GROUP_CONTEXT,
|
|
269
275
|
orientation,
|
|
270
|
-
|
|
276
|
+
dir: direction,
|
|
277
|
+
loop,
|
|
278
|
+
children: /* @__PURE__ */_jsx(ToggleGroupImplElementFrame, {
|
|
279
|
+
"aria-orientation": orientation,
|
|
280
|
+
orientation,
|
|
281
|
+
// axis={orientation}
|
|
282
|
+
ref: forwardedRef,
|
|
283
|
+
"data-disabled": disabled ? "" : void 0,
|
|
284
|
+
unstyled,
|
|
285
|
+
...commonProps
|
|
286
|
+
})
|
|
287
|
+
}) : /* @__PURE__ */_jsx(ToggleGroupImplElementFrame, {
|
|
288
|
+
"aria-orientation": orientation,
|
|
271
289
|
ref: forwardedRef,
|
|
290
|
+
orientation,
|
|
272
291
|
"data-disabled": disabled ? "" : void 0,
|
|
273
292
|
unstyled,
|
|
274
293
|
...commonProps
|
|
275
294
|
})
|
|
276
|
-
}) : /* @__PURE__ */_jsx(ToggleGroupImplElementFrame, {
|
|
277
|
-
"aria-orientation": orientation,
|
|
278
|
-
ref: forwardedRef,
|
|
279
|
-
orientation,
|
|
280
|
-
"data-disabled": disabled ? "" : void 0,
|
|
281
|
-
unstyled,
|
|
282
|
-
...commonProps
|
|
283
295
|
})
|
|
284
296
|
});
|
|
285
|
-
})
|
|
297
|
+
});
|
|
286
298
|
export { ToggleGroup };
|
|
287
299
|
//# sourceMappingURL=ToggleGroup.native.js.map
|