@tamagui/checkbox 1.3.0 → 1.4.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/Checkbox.js +124 -121
- package/dist/cjs/Checkbox.js.map +2 -2
- package/dist/esm/Checkbox.js +125 -124
- package/dist/esm/Checkbox.js.map +2 -2
- package/dist/esm/Checkbox.mjs +125 -124
- package/dist/esm/Checkbox.mjs.map +2 -2
- package/dist/jsx/Checkbox.js +111 -110
- package/dist/jsx/Checkbox.js.map +2 -2
- package/dist/jsx/Checkbox.mjs +111 -110
- package/dist/jsx/Checkbox.mjs.map +2 -2
- package/package.json +11 -11
- package/src/Checkbox.tsx +140 -138
- package/types/Checkbox.d.ts +8 -3
- package/types/Checkbox.d.ts.map +1 -1
package/dist/jsx/Checkbox.mjs
CHANGED
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
import { usePrevious } from "@radix-ui/react-use-previous";
|
|
2
2
|
import {
|
|
3
3
|
composeEventHandlers,
|
|
4
|
-
getConfig,
|
|
5
4
|
getVariableValue,
|
|
6
5
|
isWeb,
|
|
7
|
-
mergeProps,
|
|
8
6
|
styled,
|
|
9
7
|
useComposedRefs,
|
|
10
8
|
useMediaPropsActive,
|
|
@@ -17,7 +15,7 @@ import { getFontSize } from "@tamagui/font-size";
|
|
|
17
15
|
import { getSize, stepTokenUpOrDown } from "@tamagui/get-size";
|
|
18
16
|
import { useGetThemedIcon } from "@tamagui/helpers-tamagui";
|
|
19
17
|
import { useLabelContext } from "@tamagui/label";
|
|
20
|
-
import { ThemeableStack
|
|
18
|
+
import { ThemeableStack } from "@tamagui/stacks";
|
|
21
19
|
import { useControllableState } from "@tamagui/use-controllable-state";
|
|
22
20
|
import * as React from "react";
|
|
23
21
|
function isIndeterminate(checked) {
|
|
@@ -71,54 +69,60 @@ const INDICATOR_NAME = "CheckboxIndicator";
|
|
|
71
69
|
const CheckboxIndicatorFrame = styled(ThemeableStack, {
|
|
72
70
|
name: INDICATOR_NAME
|
|
73
71
|
});
|
|
74
|
-
const CheckboxIndicator =
|
|
75
|
-
(
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
72
|
+
const CheckboxIndicator = CheckboxIndicatorFrame.extractable(
|
|
73
|
+
React.forwardRef(
|
|
74
|
+
(props, forwardedRef) => {
|
|
75
|
+
const {
|
|
76
|
+
__scopeCheckbox,
|
|
77
|
+
children: childrenProp,
|
|
78
|
+
forceMount,
|
|
79
|
+
disablePassStyles,
|
|
80
|
+
...indicatorProps
|
|
81
|
+
} = props;
|
|
82
|
+
const context = useCheckboxContext(INDICATOR_NAME, __scopeCheckbox);
|
|
83
|
+
const iconSize = (typeof context.size === "number" ? context.size * 0.65 : getFontSize(context.size)) * context.scaleIcon;
|
|
84
|
+
const theme = useTheme();
|
|
85
|
+
const getThemedIcon = useGetThemedIcon({ size: iconSize, color: theme.color });
|
|
86
|
+
const childrens = React.Children.toArray(childrenProp);
|
|
87
|
+
const children = childrens.map((child) => {
|
|
88
|
+
if (disablePassStyles || !React.isValidElement(child)) {
|
|
89
|
+
return child;
|
|
90
|
+
}
|
|
91
|
+
return getThemedIcon(child);
|
|
92
|
+
});
|
|
93
|
+
if (forceMount || isIndeterminate(context.state) || context.state === true)
|
|
94
|
+
return <CheckboxIndicatorFrame
|
|
95
|
+
theme="active"
|
|
96
|
+
data-state={getState(context.state)}
|
|
97
|
+
data-disabled={context.disabled ? "" : void 0}
|
|
98
|
+
pointerEvents="none"
|
|
99
|
+
{...indicatorProps}
|
|
100
|
+
ref={forwardedRef}
|
|
101
|
+
>{children}</CheckboxIndicatorFrame>;
|
|
102
|
+
return null;
|
|
103
|
+
}
|
|
104
|
+
)
|
|
105
105
|
);
|
|
106
106
|
CheckboxIndicator.displayName = INDICATOR_NAME;
|
|
107
107
|
const CHECKBOX_NAME = "Checkbox";
|
|
108
108
|
const CheckboxFrame = styled(ThemeableStack, {
|
|
109
109
|
name: CHECKBOX_NAME,
|
|
110
110
|
tag: "button",
|
|
111
|
-
backgroundColor: "$background",
|
|
112
|
-
alignItems: "center",
|
|
113
|
-
justifyContent: "center",
|
|
114
|
-
pressTheme: true,
|
|
115
|
-
focusable: true,
|
|
116
|
-
borderWidth: 2,
|
|
117
|
-
borderColor: "transparent",
|
|
118
|
-
focusStyle: {
|
|
119
|
-
borderColor: "$borderColorFocus"
|
|
120
|
-
},
|
|
121
111
|
variants: {
|
|
112
|
+
unstyled: {
|
|
113
|
+
false: {
|
|
114
|
+
backgroundColor: "$background",
|
|
115
|
+
alignItems: "center",
|
|
116
|
+
justifyContent: "center",
|
|
117
|
+
pressTheme: true,
|
|
118
|
+
focusable: true,
|
|
119
|
+
borderWidth: 2,
|
|
120
|
+
borderColor: "transparent",
|
|
121
|
+
focusStyle: {
|
|
122
|
+
borderColor: "$borderColorFocus"
|
|
123
|
+
}
|
|
124
|
+
}
|
|
125
|
+
},
|
|
122
126
|
size: {
|
|
123
127
|
"...size": (val, { tokens }) => {
|
|
124
128
|
const radiusToken = getVariableValue(getSize(val)) / 8;
|
|
@@ -129,7 +133,8 @@ const CheckboxFrame = styled(ThemeableStack, {
|
|
|
129
133
|
}
|
|
130
134
|
},
|
|
131
135
|
defaultVariants: {
|
|
132
|
-
size: "$true"
|
|
136
|
+
size: "$true",
|
|
137
|
+
unstyled: false
|
|
133
138
|
}
|
|
134
139
|
});
|
|
135
140
|
const [createCheckboxContext, createCheckboxScope] = createContextScope(CHECKBOX_NAME);
|
|
@@ -146,6 +151,7 @@ const Checkbox = withStaticProperties(
|
|
|
146
151
|
defaultChecked,
|
|
147
152
|
required,
|
|
148
153
|
scaleIcon = 1,
|
|
154
|
+
scaleSize = 0.45,
|
|
149
155
|
sizeAdjust = 0,
|
|
150
156
|
disabled,
|
|
151
157
|
value = "on",
|
|
@@ -163,11 +169,13 @@ const Checkbox = withStaticProperties(
|
|
|
163
169
|
defaultProp: defaultChecked,
|
|
164
170
|
onChange: onCheckedChange
|
|
165
171
|
});
|
|
166
|
-
const
|
|
167
|
-
|
|
172
|
+
const adjustedSize = getVariableValue(
|
|
173
|
+
stepTokenUpOrDown("size", propsActive.size, sizeAdjust)
|
|
174
|
+
);
|
|
175
|
+
const size = scaleSize ? Math.round(adjustedSize * scaleSize) : adjustedSize;
|
|
168
176
|
const labelId = useLabelContext(button);
|
|
169
177
|
const labelledBy = ariaLabelledby || labelId;
|
|
170
|
-
if (
|
|
178
|
+
if (process.env.TAMAGUI_TARGET === "native") {
|
|
171
179
|
React.useEffect(() => {
|
|
172
180
|
if (!props.id)
|
|
173
181
|
return;
|
|
@@ -180,15 +188,60 @@ const Checkbox = withStaticProperties(
|
|
|
180
188
|
});
|
|
181
189
|
}, [props.id, setChecked]);
|
|
182
190
|
}
|
|
183
|
-
return
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
191
|
+
return <CheckboxProvider
|
|
192
|
+
scope={__scopeCheckbox}
|
|
193
|
+
state={checked}
|
|
194
|
+
disabled={disabled}
|
|
195
|
+
size={size}
|
|
196
|
+
scaleIcon={scaleIcon}
|
|
197
|
+
>{isWeb && native ? <BubbleInput
|
|
198
|
+
control={button}
|
|
199
|
+
bubbles={!hasConsumerStoppedPropagationRef.current}
|
|
200
|
+
name={name}
|
|
201
|
+
value={value}
|
|
202
|
+
checked={checked}
|
|
203
|
+
required={required}
|
|
204
|
+
disabled={disabled}
|
|
205
|
+
id={props.id}
|
|
206
|
+
/> : <>
|
|
207
|
+
<CheckboxFrame
|
|
208
|
+
width={size}
|
|
209
|
+
height={size}
|
|
210
|
+
theme={checked ? "active" : null}
|
|
211
|
+
tag="button"
|
|
212
|
+
role="checkbox"
|
|
213
|
+
aria-labelledby={labelledBy}
|
|
214
|
+
aria-checked={isIndeterminate(checked) ? "mixed" : checked}
|
|
215
|
+
aria-required={required}
|
|
216
|
+
data-state={getState(checked)}
|
|
217
|
+
data-disabled={disabled ? "" : void 0}
|
|
188
218
|
disabled={disabled}
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
219
|
+
{...checkboxProps}
|
|
220
|
+
ref={composedRefs}
|
|
221
|
+
{...isWeb && {
|
|
222
|
+
type: "button",
|
|
223
|
+
value,
|
|
224
|
+
onKeyDown: composeEventHandlers(
|
|
225
|
+
props.onKeyDown,
|
|
226
|
+
(event) => {
|
|
227
|
+
if (event.key === "Enter")
|
|
228
|
+
event.preventDefault();
|
|
229
|
+
}
|
|
230
|
+
)
|
|
231
|
+
}}
|
|
232
|
+
onPress={composeEventHandlers(props.onPress, (event) => {
|
|
233
|
+
setChecked(
|
|
234
|
+
(prevChecked) => isIndeterminate(prevChecked) ? true : !prevChecked
|
|
235
|
+
);
|
|
236
|
+
if (isFormControl) {
|
|
237
|
+
hasConsumerStoppedPropagationRef.current = event.isPropagationStopped();
|
|
238
|
+
if (!hasConsumerStoppedPropagationRef.current)
|
|
239
|
+
event.stopPropagation();
|
|
240
|
+
}
|
|
241
|
+
})}
|
|
242
|
+
/>
|
|
243
|
+
{isWeb && isFormControl ? <BubbleInput
|
|
244
|
+
isHidden
|
|
192
245
|
control={button}
|
|
193
246
|
bubbles={!hasConsumerStoppedPropagationRef.current}
|
|
194
247
|
name={name}
|
|
@@ -196,56 +249,8 @@ const Checkbox = withStaticProperties(
|
|
|
196
249
|
checked={checked}
|
|
197
250
|
required={required}
|
|
198
251
|
disabled={disabled}
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
<CheckboxFrame
|
|
202
|
-
width={size}
|
|
203
|
-
height={size}
|
|
204
|
-
theme={checked ? "active" : null}
|
|
205
|
-
tag="button"
|
|
206
|
-
role="checkbox"
|
|
207
|
-
aria-labelledby={labelledBy}
|
|
208
|
-
aria-checked={isIndeterminate(checked) ? "mixed" : checked}
|
|
209
|
-
aria-required={required}
|
|
210
|
-
data-state={getState(checked)}
|
|
211
|
-
data-disabled={disabled ? "" : void 0}
|
|
212
|
-
disabled={disabled}
|
|
213
|
-
{...checkboxProps}
|
|
214
|
-
ref={composedRefs}
|
|
215
|
-
{...isWeb && {
|
|
216
|
-
type: "button",
|
|
217
|
-
value,
|
|
218
|
-
onKeyDown: composeEventHandlers(
|
|
219
|
-
props.onKeyDown,
|
|
220
|
-
(event) => {
|
|
221
|
-
if (event.key === "Enter")
|
|
222
|
-
event.preventDefault();
|
|
223
|
-
}
|
|
224
|
-
)
|
|
225
|
-
}}
|
|
226
|
-
onPress={composeEventHandlers(props.onPress, (event) => {
|
|
227
|
-
setChecked(
|
|
228
|
-
(prevChecked) => isIndeterminate(prevChecked) ? true : !prevChecked
|
|
229
|
-
);
|
|
230
|
-
if (isFormControl) {
|
|
231
|
-
hasConsumerStoppedPropagationRef.current = event.isPropagationStopped();
|
|
232
|
-
if (!hasConsumerStoppedPropagationRef.current)
|
|
233
|
-
event.stopPropagation();
|
|
234
|
-
}
|
|
235
|
-
})}
|
|
236
|
-
/>
|
|
237
|
-
{isWeb && isFormControl ? <BubbleInput
|
|
238
|
-
isHidden
|
|
239
|
-
control={button}
|
|
240
|
-
bubbles={!hasConsumerStoppedPropagationRef.current}
|
|
241
|
-
name={name}
|
|
242
|
-
value={value}
|
|
243
|
-
checked={checked}
|
|
244
|
-
required={required}
|
|
245
|
-
disabled={disabled}
|
|
246
|
-
/> : null}
|
|
247
|
-
</>}</CheckboxProvider></YStack>
|
|
248
|
-
);
|
|
252
|
+
/> : null}
|
|
253
|
+
</>}</CheckboxProvider>;
|
|
249
254
|
}
|
|
250
255
|
)
|
|
251
256
|
),
|
|
@@ -254,10 +259,6 @@ const Checkbox = withStaticProperties(
|
|
|
254
259
|
}
|
|
255
260
|
);
|
|
256
261
|
Checkbox.displayName = CHECKBOX_NAME;
|
|
257
|
-
const cloneElementWithPropOrder = (child, props) => {
|
|
258
|
-
const next = mergeProps(child.props, props, false, getConfig().shorthands)[0];
|
|
259
|
-
return React.cloneElement({ ...child, props: null }, next);
|
|
260
|
-
};
|
|
261
262
|
export {
|
|
262
263
|
BubbleInput,
|
|
263
264
|
Checkbox,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Checkbox.tsx"],
|
|
4
|
-
"sourcesContent": ["// fork of radix\n// https://github.com/radix-ui/primitives/tree/main/packages/react/checkbox/src/Checkbox.tsx\n\nimport { usePrevious } from '@radix-ui/react-use-previous'\nimport {\n GetProps,\n SizeTokens,\n TamaguiElement,\n composeEventHandlers,\n getConfig,\n getVariableValue,\n isWeb,\n mergeProps,\n styled,\n useComposedRefs,\n useMediaPropsActive,\n useTheme,\n withStaticProperties,\n} from '@tamagui/core'\nimport type { Scope } from '@tamagui/create-context'\nimport { createContextScope } from '@tamagui/create-context'\nimport { registerFocusable } from '@tamagui/focusable'\nimport { getFontSize } from '@tamagui/font-size'\nimport { getSize, stepTokenUpOrDown } from '@tamagui/get-size'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { useLabelContext } from '@tamagui/label'\nimport { ThemeableStack, YStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\n\nexport type CheckedState = boolean | 'indeterminate'\n\nexport function isIndeterminate(checked?: CheckedState): checked is 'indeterminate' {\n return checked === 'indeterminate'\n}\n\nexport function getState(checked: CheckedState) {\n return isIndeterminate(checked) ? 'indeterminate' : checked ? 'checked' : 'unchecked'\n}\n\ntype InputProps = any //Radix.ComponentPropsWithoutRef<'input'>\ninterface BubbleInputProps extends Omit<InputProps, 'checked'> {\n checked: CheckedState\n control: HTMLElement | null\n bubbles: boolean\n\n isHidden?: boolean\n}\n\nexport const BubbleInput = (props: BubbleInputProps) => {\n const { checked, bubbles = true, control, isHidden, ...inputProps } = props\n const ref = React.useRef<HTMLInputElement>(null)\n const prevChecked = usePrevious(checked)\n // const controlSize = useSize(control)\n\n // Bubble checked change to parents (e.g form change event)\n React.useEffect(() => {\n const input = ref.current!\n const inputProto = window.HTMLInputElement.prototype\n const descriptor = Object.getOwnPropertyDescriptor(\n inputProto,\n 'checked'\n ) as PropertyDescriptor\n const setChecked = descriptor.set\n\n if (prevChecked !== checked && setChecked) {\n const event = new Event('click', { bubbles })\n input.indeterminate = isIndeterminate(checked)\n setChecked.call(input, isIndeterminate(checked) ? false : checked)\n input.dispatchEvent(event)\n }\n }, [prevChecked, checked, bubbles])\n\n return (\n <input\n type=\"checkbox\"\n defaultChecked={isIndeterminate(checked) ? false : checked}\n {...inputProps}\n tabIndex={-1}\n ref={ref}\n aria-hidden={isHidden}\n style={{\n ...(isHidden\n ? {\n // ...controlSize,\n position: 'absolute',\n pointerEvents: 'none',\n opacity: 0,\n margin: 0,\n }\n : {\n appearance: 'auto',\n accentColor: 'var(--color6)',\n }),\n\n ...props.style,\n }}\n />\n )\n}\n\n/* -------------------------------------------------------------------------------------------------\n * CheckboxIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = 'CheckboxIndicator'\n\nconst CheckboxIndicatorFrame = styled(ThemeableStack, {\n name: INDICATOR_NAME,\n})\n\ntype CheckboxIndicatorFrameProps = GetProps<typeof CheckboxIndicatorFrame>\n\nexport type CheckboxIndicatorProps = CheckboxIndicatorFrameProps & {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n /**\n * Used to disable passing styles down to children.\n */\n disablePassStyles?: boolean\n}\n\nconst CheckboxIndicator = React.forwardRef<TamaguiElement, CheckboxIndicatorProps>(\n (props: ScopedProps<CheckboxIndicatorProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n children: childrenProp,\n forceMount,\n disablePassStyles,\n ...indicatorProps\n } = props\n const context = useCheckboxContext(INDICATOR_NAME, __scopeCheckbox)\n const iconSize =\n (typeof context.size === 'number'\n ? context.size * 0.65\n : getFontSize(context.size)) * context.scaleIcon\n const theme = useTheme()\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color: theme.color })\n\n const childrens = React.Children.toArray(childrenProp)\n const children = childrens.map((child) => {\n if (disablePassStyles || !React.isValidElement(child)) {\n return child\n }\n return getThemedIcon(child)\n })\n\n if (forceMount || isIndeterminate(context.state) || context.state === true)\n return (\n <CheckboxIndicatorFrame\n theme=\"active\"\n data-state={getState(context.state)}\n data-disabled={context.disabled ? '' : undefined}\n pointerEvents=\"none\"\n {...indicatorProps}\n ref={forwardedRef}\n >\n {children}\n </CheckboxIndicatorFrame>\n )\n\n return null\n }\n)\n\nCheckboxIndicator.displayName = INDICATOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * Checkbox\n * -----------------------------------------------------------------------------------------------*/\n\nconst CHECKBOX_NAME = 'Checkbox'\n\nexport const CheckboxFrame = styled(ThemeableStack, {\n name: CHECKBOX_NAME,\n tag: 'button',\n backgroundColor: '$background',\n alignItems: 'center',\n justifyContent: 'center',\n pressTheme: true,\n focusable: true,\n borderWidth: 2,\n borderColor: 'transparent',\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n\n variants: {\n size: {\n '...size': (val, { tokens }) => {\n const radiusToken = getVariableValue(getSize(val)) / 8\n return {\n borderRadius: radiusToken,\n }\n },\n },\n } as const,\n\n defaultVariants: {\n size: '$true',\n },\n})\n\ntype ScopedProps<P> = P & { __scopeCheckbox?: Scope }\nconst [createCheckboxContext, createCheckboxScope] = createContextScope(CHECKBOX_NAME)\n\ntype CheckboxContextValue = {\n state: CheckedState\n disabled?: boolean\n size: SizeTokens\n scaleIcon: number\n}\n\nconst [CheckboxProvider, useCheckboxContext] =\n createCheckboxContext<CheckboxContextValue>(CHECKBOX_NAME)\n\ntype CheckboxFrameProps = GetProps<typeof CheckboxFrame>\nexport interface CheckboxProps\n extends Omit<CheckboxFrameProps, 'checked' | 'defaultChecked'> {\n checked?: CheckedState\n defaultChecked?: CheckedState\n required?: boolean\n onCheckedChange?(checked: CheckedState): void\n labelledBy?: string\n name?: string\n value?: string\n native?: boolean\n scaleIcon?: number\n sizeAdjust?: number\n}\n\nexport const Checkbox = withStaticProperties(\n CheckboxFrame.extractable(\n React.forwardRef<HTMLButtonElement, CheckboxProps>(\n (props: ScopedProps<CheckboxProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n labelledBy: ariaLabelledby,\n name,\n checked: checkedProp,\n defaultChecked,\n required,\n scaleIcon = 1,\n sizeAdjust = 0,\n disabled,\n value = 'on',\n onCheckedChange,\n native,\n ...checkboxProps\n } = props\n const [button, setButton] = React.useState<HTMLButtonElement | null>(null)\n const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node))\n const hasConsumerStoppedPropagationRef = React.useRef(false)\n const propsActive = useMediaPropsActive(props)\n // We set this to true by default so that events bubble to forms without JS (SSR)\n const isFormControl = isWeb\n ? button\n ? Boolean(button.closest('form'))\n : true\n : false\n const [checked = false, setChecked] = useControllableState({\n prop: checkedProp,\n defaultProp: defaultChecked!,\n onChange: onCheckedChange,\n })\n\n const adjustedSizeToken = stepTokenUpOrDown('size', propsActive.size, sizeAdjust)\n const size = Math.floor(getVariableValue(adjustedSizeToken) * 0.5)\n\n const labelId = useLabelContext(button)\n const labelledBy = ariaLabelledby || labelId\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 focusAndSelect: () => {\n setChecked((x) => !x)\n },\n focus: () => {},\n })\n }, [props.id, setChecked])\n }\n\n return (\n // YStack is here to provide theme for native input\n <YStack asChild theme={checkboxProps.theme}>\n <CheckboxProvider\n scope={__scopeCheckbox}\n state={checked}\n disabled={disabled}\n size={size}\n scaleIcon={scaleIcon}\n >\n {isWeb && native ? (\n <BubbleInput\n control={button}\n bubbles={!hasConsumerStoppedPropagationRef.current}\n name={name}\n value={value}\n checked={checked}\n required={required}\n disabled={disabled}\n id={props.id}\n />\n ) : (\n <>\n <CheckboxFrame\n width={size}\n height={size}\n theme={checked ? 'active' : null}\n tag=\"button\"\n role=\"checkbox\"\n aria-labelledby={labelledBy}\n aria-checked={isIndeterminate(checked) ? 'mixed' : checked}\n aria-required={required}\n data-state={getState(checked)}\n data-disabled={disabled ? '' : undefined}\n disabled={disabled}\n {...checkboxProps}\n ref={composedRefs}\n {...(isWeb && {\n type: 'button',\n value: value,\n onKeyDown: composeEventHandlers(\n (props as React.HTMLProps<HTMLButtonElement>).onKeyDown,\n (event) => {\n // According to WAI ARIA, Checkboxes don't activate on enter keypress\n if (event.key === 'Enter') event.preventDefault()\n }\n ),\n })}\n onPress={composeEventHandlers(props.onPress as any, (event) => {\n setChecked((prevChecked) =>\n isIndeterminate(prevChecked) ? true : !prevChecked\n )\n if (isFormControl) {\n hasConsumerStoppedPropagationRef.current =\n event.isPropagationStopped()\n // if checkbox is in a form, stop propagation from the button so that we only propagate\n // one click event (from the input). We propagate changes from an input so that native\n // form validation works and form events reflect checkbox updates.\n if (!hasConsumerStoppedPropagationRef.current)\n event.stopPropagation()\n }\n })}\n />\n\n {isWeb && isFormControl ? (\n <BubbleInput\n isHidden\n control={button}\n bubbles={!hasConsumerStoppedPropagationRef.current}\n name={name}\n value={value}\n checked={checked}\n required={required}\n disabled={disabled}\n />\n ) : null}\n </>\n )}\n </CheckboxProvider>\n </YStack>\n )\n }\n )\n ),\n {\n Indicator: CheckboxIndicator,\n }\n)\n\nCheckbox.displayName = CHECKBOX_NAME\n\nexport { createCheckboxScope }\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": "AAGA,SAAS,mBAAmB;AAC5B;AAAA,EAIE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,
|
|
4
|
+
"sourcesContent": ["// fork of radix\n// https://github.com/radix-ui/primitives/tree/main/packages/react/checkbox/src/Checkbox.tsx\n\nimport { usePrevious } from '@radix-ui/react-use-previous'\nimport {\n GetProps,\n SizeTokens,\n TamaguiElement,\n composeEventHandlers,\n getVariableValue,\n isWeb,\n styled,\n useComposedRefs,\n useMediaPropsActive,\n useTheme,\n withStaticProperties,\n} from '@tamagui/core'\nimport type { Scope } from '@tamagui/create-context'\nimport { createContextScope } from '@tamagui/create-context'\nimport { registerFocusable } from '@tamagui/focusable'\nimport { getFontSize } from '@tamagui/font-size'\nimport { getSize, stepTokenUpOrDown } from '@tamagui/get-size'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { useLabelContext } from '@tamagui/label'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\n\nexport type CheckedState = boolean | 'indeterminate'\n\nexport function isIndeterminate(checked?: CheckedState): checked is 'indeterminate' {\n return checked === 'indeterminate'\n}\n\nexport function getState(checked: CheckedState) {\n return isIndeterminate(checked) ? 'indeterminate' : checked ? 'checked' : 'unchecked'\n}\n\ntype InputProps = any //Radix.ComponentPropsWithoutRef<'input'>\ninterface BubbleInputProps extends Omit<InputProps, 'checked'> {\n checked: CheckedState\n control: HTMLElement | null\n bubbles: boolean\n\n isHidden?: boolean\n}\n\nexport const BubbleInput = (props: BubbleInputProps) => {\n const { checked, bubbles = true, control, isHidden, ...inputProps } = props\n const ref = React.useRef<HTMLInputElement>(null)\n const prevChecked = usePrevious(checked)\n // const controlSize = useSize(control)\n\n // Bubble checked change to parents (e.g form change event)\n React.useEffect(() => {\n const input = ref.current!\n const inputProto = window.HTMLInputElement.prototype\n const descriptor = Object.getOwnPropertyDescriptor(\n inputProto,\n 'checked'\n ) as PropertyDescriptor\n const setChecked = descriptor.set\n\n if (prevChecked !== checked && setChecked) {\n const event = new Event('click', { bubbles })\n input.indeterminate = isIndeterminate(checked)\n setChecked.call(input, isIndeterminate(checked) ? false : checked)\n input.dispatchEvent(event)\n }\n }, [prevChecked, checked, bubbles])\n\n return (\n <input\n type=\"checkbox\"\n defaultChecked={isIndeterminate(checked) ? false : checked}\n {...inputProps}\n tabIndex={-1}\n ref={ref}\n aria-hidden={isHidden}\n style={{\n ...(isHidden\n ? {\n // ...controlSize,\n position: 'absolute',\n pointerEvents: 'none',\n opacity: 0,\n margin: 0,\n }\n : {\n appearance: 'auto',\n accentColor: 'var(--color6)',\n }),\n\n ...props.style,\n }}\n />\n )\n}\n\n/* -------------------------------------------------------------------------------------------------\n * CheckboxIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = 'CheckboxIndicator'\n\nconst CheckboxIndicatorFrame = styled(ThemeableStack, {\n name: INDICATOR_NAME,\n})\n\ntype CheckboxIndicatorFrameProps = GetProps<typeof CheckboxIndicatorFrame>\n\nexport type CheckboxIndicatorProps = CheckboxIndicatorFrameProps & {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n /**\n * Used to disable passing styles down to children.\n */\n disablePassStyles?: boolean\n}\n\nconst CheckboxIndicator = CheckboxIndicatorFrame.extractable(\n React.forwardRef<TamaguiElement, CheckboxIndicatorProps>(\n (props: ScopedProps<CheckboxIndicatorProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n children: childrenProp,\n forceMount,\n disablePassStyles,\n ...indicatorProps\n } = props\n const context = useCheckboxContext(INDICATOR_NAME, __scopeCheckbox)\n const iconSize =\n (typeof context.size === 'number'\n ? context.size * 0.65\n : getFontSize(context.size)) * context.scaleIcon\n const theme = useTheme()\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color: theme.color })\n\n const childrens = React.Children.toArray(childrenProp)\n const children = childrens.map((child) => {\n if (disablePassStyles || !React.isValidElement(child)) {\n return child\n }\n return getThemedIcon(child)\n })\n\n if (forceMount || isIndeterminate(context.state) || context.state === true)\n return (\n <CheckboxIndicatorFrame\n theme=\"active\"\n data-state={getState(context.state)}\n data-disabled={context.disabled ? '' : undefined}\n pointerEvents=\"none\"\n {...indicatorProps}\n ref={forwardedRef}\n >\n {children}\n </CheckboxIndicatorFrame>\n )\n\n return null\n }\n )\n)\n\nCheckboxIndicator.displayName = INDICATOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * Checkbox\n * -----------------------------------------------------------------------------------------------*/\n\nconst CHECKBOX_NAME = 'Checkbox'\n\nexport const CheckboxFrame = styled(ThemeableStack, {\n name: CHECKBOX_NAME,\n tag: 'button',\n\n variants: {\n unstyled: {\n false: {\n backgroundColor: '$background',\n alignItems: 'center',\n justifyContent: 'center',\n pressTheme: true,\n focusable: true,\n borderWidth: 2,\n borderColor: 'transparent',\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n },\n },\n\n size: {\n '...size': (val, { tokens }) => {\n const radiusToken = getVariableValue(getSize(val)) / 8\n return {\n borderRadius: radiusToken,\n }\n },\n },\n } as const,\n\n defaultVariants: {\n size: '$true',\n unstyled: false,\n },\n})\n\ntype ScopedProps<P> = P & { __scopeCheckbox?: Scope }\nconst [createCheckboxContext, createCheckboxScope] = createContextScope(CHECKBOX_NAME)\n\ntype CheckboxContextValue = {\n state: CheckedState\n disabled?: boolean\n size: SizeTokens\n scaleIcon: number\n}\n\nconst [CheckboxProvider, useCheckboxContext] =\n createCheckboxContext<CheckboxContextValue>(CHECKBOX_NAME)\n\ntype CheckboxFrameProps = GetProps<typeof CheckboxFrame>\nexport interface CheckboxProps\n extends Omit<CheckboxFrameProps, 'checked' | 'defaultChecked'> {\n checked?: CheckedState\n defaultChecked?: CheckedState\n required?: boolean\n onCheckedChange?(checked: CheckedState): void\n labelledBy?: string\n name?: string\n value?: string\n native?: boolean\n scaleIcon?: number\n scaleSize?: number\n sizeAdjust?: number\n}\n\nexport const Checkbox = withStaticProperties(\n CheckboxFrame.extractable(\n React.forwardRef<HTMLButtonElement, CheckboxProps>(\n (props: ScopedProps<CheckboxProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n labelledBy: ariaLabelledby,\n name,\n checked: checkedProp,\n defaultChecked,\n required,\n scaleIcon = 1,\n scaleSize = 0.45,\n sizeAdjust = 0,\n disabled,\n value = 'on',\n onCheckedChange,\n native,\n ...checkboxProps\n } = props\n const [button, setButton] = React.useState<HTMLButtonElement | null>(null)\n const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node))\n const hasConsumerStoppedPropagationRef = React.useRef(false)\n const propsActive = useMediaPropsActive(props)\n // We set this to true by default so that events bubble to forms without JS (SSR)\n const isFormControl = isWeb\n ? button\n ? Boolean(button.closest('form'))\n : true\n : false\n const [checked = false, setChecked] = useControllableState({\n prop: checkedProp,\n defaultProp: defaultChecked!,\n onChange: onCheckedChange,\n })\n\n const adjustedSize = getVariableValue(\n stepTokenUpOrDown('size', propsActive.size, sizeAdjust)\n )\n const size = scaleSize ? Math.round(adjustedSize * scaleSize) : adjustedSize\n\n const labelId = useLabelContext(button)\n const labelledBy = ariaLabelledby || labelId\n\n if (process.env.TAMAGUI_TARGET === 'native') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useEffect(() => {\n if (!props.id) return\n return registerFocusable(props.id, {\n focusAndSelect: () => {\n setChecked((x) => !x)\n },\n focus: () => {},\n })\n }, [props.id, setChecked])\n }\n\n return (\n <CheckboxProvider\n scope={__scopeCheckbox}\n state={checked}\n disabled={disabled}\n size={size}\n scaleIcon={scaleIcon}\n >\n {isWeb && native ? (\n <BubbleInput\n control={button}\n bubbles={!hasConsumerStoppedPropagationRef.current}\n name={name}\n value={value}\n checked={checked}\n required={required}\n disabled={disabled}\n id={props.id}\n />\n ) : (\n <>\n <CheckboxFrame\n width={size}\n height={size}\n theme={checked ? 'active' : null}\n tag=\"button\"\n role=\"checkbox\"\n aria-labelledby={labelledBy}\n aria-checked={isIndeterminate(checked) ? 'mixed' : checked}\n aria-required={required}\n data-state={getState(checked)}\n data-disabled={disabled ? '' : undefined}\n disabled={disabled}\n {...checkboxProps}\n ref={composedRefs}\n {...(isWeb && {\n type: 'button',\n value,\n onKeyDown: composeEventHandlers(\n (props as React.HTMLProps<HTMLButtonElement>).onKeyDown,\n (event) => {\n // According to WAI ARIA, Checkboxes don't activate on enter keypress\n if (event.key === 'Enter') event.preventDefault()\n }\n ),\n })}\n onPress={composeEventHandlers(props.onPress as any, (event) => {\n setChecked((prevChecked) =>\n isIndeterminate(prevChecked) ? true : !prevChecked\n )\n if (isFormControl) {\n hasConsumerStoppedPropagationRef.current =\n event.isPropagationStopped()\n // if checkbox is in a form, stop propagation from the button so that we only propagate\n // one click event (from the input). We propagate changes from an input so that native\n // form validation works and form events reflect checkbox updates.\n if (!hasConsumerStoppedPropagationRef.current)\n event.stopPropagation()\n }\n })}\n />\n\n {isWeb && isFormControl ? (\n <BubbleInput\n isHidden\n control={button}\n bubbles={!hasConsumerStoppedPropagationRef.current}\n name={name}\n value={value}\n checked={checked}\n required={required}\n disabled={disabled}\n />\n ) : null}\n </>\n )}\n </CheckboxProvider>\n )\n }\n )\n ),\n {\n Indicator: CheckboxIndicator,\n }\n)\n\nCheckbox.displayName = CHECKBOX_NAME\n\nexport { createCheckboxScope }\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/checkbox",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.4.0",
|
|
4
4
|
"sideEffects": [
|
|
5
5
|
"*.css"
|
|
6
6
|
],
|
|
@@ -20,22 +20,22 @@
|
|
|
20
20
|
},
|
|
21
21
|
"dependencies": {
|
|
22
22
|
"@radix-ui/react-use-previous": "^0.1.1",
|
|
23
|
-
"@tamagui/core": "^1.
|
|
24
|
-
"@tamagui/create-context": "^1.
|
|
25
|
-
"@tamagui/focusable": "^1.
|
|
26
|
-
"@tamagui/font-size": "^1.
|
|
27
|
-
"@tamagui/get-size": "^1.
|
|
28
|
-
"@tamagui/helpers-tamagui": "^1.
|
|
29
|
-
"@tamagui/label": "^1.
|
|
30
|
-
"@tamagui/stacks": "^1.
|
|
31
|
-
"@tamagui/use-controllable-state": "^1.
|
|
23
|
+
"@tamagui/core": "^1.4.0",
|
|
24
|
+
"@tamagui/create-context": "^1.4.0",
|
|
25
|
+
"@tamagui/focusable": "^1.4.0",
|
|
26
|
+
"@tamagui/font-size": "^1.4.0",
|
|
27
|
+
"@tamagui/get-size": "^1.4.0",
|
|
28
|
+
"@tamagui/helpers-tamagui": "^1.4.0",
|
|
29
|
+
"@tamagui/label": "^1.4.0",
|
|
30
|
+
"@tamagui/stacks": "^1.4.0",
|
|
31
|
+
"@tamagui/use-controllable-state": "^1.4.0"
|
|
32
32
|
},
|
|
33
33
|
"peerDependencies": {
|
|
34
34
|
"react": "*",
|
|
35
35
|
"react-dom": "*"
|
|
36
36
|
},
|
|
37
37
|
"devDependencies": {
|
|
38
|
-
"@tamagui/build": "^1.
|
|
38
|
+
"@tamagui/build": "^1.4.0",
|
|
39
39
|
"react": "^18.2.0",
|
|
40
40
|
"react-dom": "^18.2.0"
|
|
41
41
|
},
|