@yamada-ui/checkbox 1.3.0 → 1.3.1-dev-20241201045027

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 (42) hide show
  1. package/dist/checkbox-card-group.js +78 -44
  2. package/dist/checkbox-card-group.js.map +1 -1
  3. package/dist/checkbox-card-group.mjs +5 -5
  4. package/dist/checkbox-card.js +78 -44
  5. package/dist/checkbox-card.js.map +1 -1
  6. package/dist/checkbox-card.mjs +3 -3
  7. package/dist/checkbox-group.js +78 -44
  8. package/dist/checkbox-group.js.map +1 -1
  9. package/dist/checkbox-group.mjs +4 -4
  10. package/dist/checkbox.d.mts +16 -0
  11. package/dist/checkbox.d.ts +16 -0
  12. package/dist/checkbox.js +78 -44
  13. package/dist/checkbox.js.map +1 -1
  14. package/dist/checkbox.mjs +2 -2
  15. package/dist/{chunk-YKJPEUZC.mjs → chunk-A2JXM6CV.mjs} +67 -37
  16. package/dist/chunk-A2JXM6CV.mjs.map +1 -0
  17. package/dist/{chunk-4RRLZHGB.mjs → chunk-AMQ63CU2.mjs} +3 -3
  18. package/dist/{chunk-T4XJ55LG.mjs → chunk-D2MZMI2W.mjs} +3 -3
  19. package/dist/{chunk-LSEGOUL4.mjs → chunk-KRCEAKWH.mjs} +14 -10
  20. package/dist/chunk-KRCEAKWH.mjs.map +1 -0
  21. package/dist/{chunk-LDQSOOV2.mjs → chunk-LF6W4EB7.mjs} +3 -3
  22. package/dist/{chunk-3D6OL2QO.mjs → chunk-PH5Y6VMS.mjs} +1 -1
  23. package/dist/chunk-PH5Y6VMS.mjs.map +1 -0
  24. package/dist/index.js +78 -44
  25. package/dist/index.js.map +1 -1
  26. package/dist/index.mjs +6 -6
  27. package/dist/use-checkbox-group.d.mts +2 -0
  28. package/dist/use-checkbox-group.d.ts +2 -0
  29. package/dist/use-checkbox-group.js.map +1 -1
  30. package/dist/use-checkbox-group.mjs +1 -1
  31. package/dist/use-checkbox.d.mts +51 -1
  32. package/dist/use-checkbox.d.ts +51 -1
  33. package/dist/use-checkbox.js +66 -36
  34. package/dist/use-checkbox.js.map +1 -1
  35. package/dist/use-checkbox.mjs +1 -1
  36. package/package.json +1 -1
  37. package/dist/chunk-3D6OL2QO.mjs.map +0 -1
  38. package/dist/chunk-LSEGOUL4.mjs.map +0 -1
  39. package/dist/chunk-YKJPEUZC.mjs.map +0 -1
  40. /package/dist/{chunk-4RRLZHGB.mjs.map → chunk-AMQ63CU2.mjs.map} +0 -0
  41. /package/dist/{chunk-T4XJ55LG.mjs.map → chunk-D2MZMI2W.mjs.map} +0 -0
  42. /package/dist/{chunk-LDQSOOV2.mjs.map → chunk-LF6W4EB7.mjs.map} +0 -0
package/dist/checkbox.js CHANGED
@@ -57,10 +57,13 @@ var useCheckbox = ({
57
57
  }) => {
58
58
  const uuid = (0, import_react.useId)();
59
59
  id != null ? id : id = uuid;
60
- const {
60
+ let {
61
61
  id: _id,
62
62
  name,
63
+ checked: checkedProp,
64
+ defaultChecked,
63
65
  defaultIsChecked,
66
+ indeterminate,
64
67
  isChecked: isCheckedProp,
65
68
  isIndeterminate,
66
69
  selectOnEnter,
@@ -69,6 +72,9 @@ var useCheckbox = ({
69
72
  onChange: onChangeProp,
70
73
  ...computedProps
71
74
  } = (0, import_form_control.useFormControlProps)({ id, ...props });
75
+ checkedProp != null ? checkedProp : checkedProp = isCheckedProp;
76
+ indeterminate != null ? indeterminate : indeterminate = isIndeterminate;
77
+ defaultChecked != null ? defaultChecked : defaultChecked = defaultIsChecked;
72
78
  const [
73
79
  {
74
80
  "aria-readonly": _ariaReadonly,
@@ -81,26 +87,26 @@ var useCheckbox = ({
81
87
  },
82
88
  rest
83
89
  ] = (0, import_utils2.splitObject)(computedProps, import_form_control.formControlProperties);
84
- const [isFocusVisible, setIsFocusVisible] = (0, import_react.useState)(false);
85
- const [isFocused, setFocused] = (0, import_react.useState)(false);
86
- const [isHovered, setHovered] = (0, import_react.useState)(false);
87
- const [isActive, setActive] = (0, import_react.useState)(false);
90
+ const [focusVisible, setFocusVisible] = (0, import_react.useState)(false);
91
+ const [focused, setFocused] = (0, import_react.useState)(false);
92
+ const [hovered, setHovered] = (0, import_react.useState)(false);
93
+ const [active, setActive] = (0, import_react.useState)(false);
88
94
  const inputRef = (0, import_react.useRef)(null);
89
- const [isLabel, setIsLabel] = (0, import_react.useState)(true);
90
- const [isChecked, setIsChecked] = (0, import_react.useState)(!!defaultIsChecked);
91
- const isControlled = isCheckedProp !== void 0;
92
- const checked = isControlled ? isCheckedProp : isChecked;
95
+ const [label, setLabel] = (0, import_react.useState)(true);
96
+ const [isChecked, setIsChecked] = (0, import_react.useState)(!!defaultChecked);
97
+ const controlled = checkedProp !== void 0;
98
+ const checked = controlled ? checkedProp : isChecked;
93
99
  const onChange = (0, import_utils2.useCallbackRef)(
94
100
  (ev) => {
95
101
  if (readOnly || disabled) {
96
102
  ev.preventDefault();
97
103
  return;
98
104
  }
99
- if (!isControlled)
100
- setIsChecked(!checked || isIndeterminate ? true : ev.target.checked);
105
+ if (!controlled)
106
+ setIsChecked(!checked || indeterminate ? true : ev.target.checked);
101
107
  onChangeProp == null ? void 0 : onChangeProp(ev);
102
108
  },
103
- [readOnly, disabled, isControlled, checked, isIndeterminate]
109
+ [readOnly, disabled, controlled, checked, indeterminate]
104
110
  );
105
111
  const onFocus = (0, import_utils2.useCallbackRef)(onFocusProp);
106
112
  const onBlur = (0, import_utils2.useCallbackRef)(onBlurProp);
@@ -119,7 +125,7 @@ var useCheckbox = ({
119
125
  [setActive]
120
126
  );
121
127
  (0, import_react.useEffect)(() => {
122
- return (0, import_use_focus_visible.trackFocusVisible)(setIsFocusVisible);
128
+ return (0, import_use_focus_visible.trackFocusVisible)(setFocusVisible);
123
129
  }, []);
124
130
  (0, import_utils2.useSafeLayoutEffect)(() => {
125
131
  if (inputRef.current)
@@ -131,7 +137,7 @@ var useCheckbox = ({
131
137
  (0, import_utils2.useSafeLayoutEffect)(() => {
132
138
  var _a;
133
139
  if (!((_a = inputRef.current) == null ? void 0 : _a.form)) return;
134
- inputRef.current.form.onreset = () => setIsChecked(!!defaultIsChecked);
140
+ inputRef.current.form.onreset = () => setIsChecked(!!defaultChecked);
135
141
  }, []);
136
142
  (0, import_utils2.useSafeLayoutEffect)(() => {
137
143
  if (!inputRef.current) return;
@@ -143,14 +149,14 @@ var useCheckbox = ({
143
149
  ...formControlProps,
144
150
  ...props2,
145
151
  ref: (0, import_utils2.mergeRefs)(ref, (el) => {
146
- if (el) setIsLabel(el.tagName === "LABEL");
152
+ if (el) setLabel(el.tagName === "LABEL");
147
153
  }),
148
154
  "data-checked": (0, import_utils2.dataAttr)(checked),
149
- "data-focus": (0, import_utils2.dataAttr)(isFocused),
150
- "data-focus-visible": (0, import_utils2.dataAttr)(isFocused && isFocusVisible),
155
+ "data-focus": (0, import_utils2.dataAttr)(focused),
156
+ "data-focus-visible": (0, import_utils2.dataAttr)(focused && focusVisible),
151
157
  onClick: (0, import_utils2.handlerAll)(props2.onClick, () => {
152
158
  var _a;
153
- if (isLabel) return;
159
+ if (label) return;
154
160
  (_a = inputRef.current) == null ? void 0 : _a.click();
155
161
  requestAnimationFrame(() => {
156
162
  var _a2;
@@ -158,7 +164,7 @@ var useCheckbox = ({
158
164
  });
159
165
  })
160
166
  }),
161
- [checked, isLabel, isFocused, isFocusVisible, formControlProps]
167
+ [checked, label, focused, focusVisible, formControlProps]
162
168
  );
163
169
  const getIconProps = (0, import_react.useCallback)(
164
170
  (props2 = {}, ref = null) => ({
@@ -166,14 +172,14 @@ var useCheckbox = ({
166
172
  ...props2,
167
173
  ref,
168
174
  "aria-hidden": true,
169
- "data-active": (0, import_utils2.dataAttr)(isActive),
175
+ "data-active": (0, import_utils2.dataAttr)(active),
170
176
  "data-checked": (0, import_utils2.dataAttr)(checked),
171
- "data-focus": (0, import_utils2.dataAttr)(isFocused),
172
- "data-focus-visible": (0, import_utils2.dataAttr)(isFocused && isFocusVisible),
173
- "data-hover": (0, import_utils2.dataAttr)(isHovered),
174
- "data-indeterminate": (0, import_utils2.dataAttr)(isIndeterminate),
177
+ "data-focus": (0, import_utils2.dataAttr)(focused),
178
+ "data-focus-visible": (0, import_utils2.dataAttr)(focused && focusVisible),
179
+ "data-hover": (0, import_utils2.dataAttr)(hovered),
180
+ "data-indeterminate": (0, import_utils2.dataAttr)(indeterminate),
175
181
  onMouseDown: (0, import_utils2.handlerAll)(props2.onMouseDown, (ev) => {
176
- if (isFocused) ev.preventDefault();
182
+ if (focused) ev.preventDefault();
177
183
  setActive(true);
178
184
  }),
179
185
  onMouseEnter: (0, import_utils2.handlerAll)(props2.onMouseEnter, () => setHovered(true)),
@@ -181,12 +187,12 @@ var useCheckbox = ({
181
187
  onMouseUp: (0, import_utils2.handlerAll)(props2.onMouseUp, () => setActive(false))
182
188
  }),
183
189
  [
184
- isActive,
190
+ active,
185
191
  checked,
186
- isFocused,
187
- isHovered,
188
- isFocusVisible,
189
- isIndeterminate,
192
+ focused,
193
+ hovered,
194
+ focusVisible,
195
+ indeterminate,
190
196
  formControlProps
191
197
  ]
192
198
  );
@@ -209,7 +215,7 @@ var useCheckbox = ({
209
215
  whiteSpace: "nowrap",
210
216
  width: "1px"
211
217
  },
212
- "aria-checked": isIndeterminate ? "mixed" : checked,
218
+ "aria-checked": indeterminate ? "mixed" : checked,
213
219
  checked,
214
220
  disabled,
215
221
  readOnly,
@@ -223,7 +229,7 @@ var useCheckbox = ({
223
229
  onKeyUp: (0, import_utils2.handlerAll)(props2.onKeyUp, onKeyUp)
224
230
  }),
225
231
  [
226
- isIndeterminate,
232
+ indeterminate,
227
233
  formControlProps,
228
234
  id,
229
235
  name,
@@ -258,11 +264,35 @@ var useCheckbox = ({
258
264
  [checked, formControlProps]
259
265
  );
260
266
  return {
261
- isActive,
267
+ active,
268
+ checked,
269
+ focused,
270
+ focusVisible,
271
+ hovered,
272
+ indeterminate,
273
+ /**
274
+ * @deprecated Use `active` instead.
275
+ */
276
+ isActive: active,
277
+ /**
278
+ * @deprecated Use `checked` instead.
279
+ */
262
280
  isChecked: checked,
263
- isFocused,
264
- isFocusVisible,
265
- isHovered,
281
+ /**
282
+ * @deprecated Use `focused` instead.
283
+ */
284
+ isFocused: focused,
285
+ /**
286
+ * @deprecated Use `focusVisible` instead.
287
+ */
288
+ isFocusVisible: focusVisible,
289
+ /**
290
+ * @deprecated Use `hovered` instead.
291
+ */
292
+ isHovered: hovered,
293
+ /**
294
+ * @deprecated Use `indeterminate` instead.
295
+ */
266
296
  isIndeterminate,
267
297
  props: rest,
268
298
  getContainerProps,
@@ -301,8 +331,8 @@ var Checkbox = (0, import_react2.forwardRef)(
301
331
  const isCheckedProp = groupValue && computedProps.value ? groupValue.includes(computedProps.value) : computedProps.isChecked;
302
332
  const onChange = groupProps.onChange && computedProps.value ? (0, import_utils3.funcAll)(groupProps.onChange, computedProps.onChange) : computedProps.onChange;
303
333
  const {
304
- isChecked,
305
- isIndeterminate,
334
+ checked,
335
+ indeterminate,
306
336
  props: rest,
307
337
  getContainerProps,
308
338
  getIconProps,
@@ -319,15 +349,15 @@ var Checkbox = (0, import_react2.forwardRef)(
319
349
  });
320
350
  const { children: customIcon, ...resolvedIconProps } = { ...iconProps };
321
351
  const icon = (0, import_react2.cloneElement)(customIcon != null ? customIcon : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckboxIcon, {}), {
322
- isChecked,
352
+ checked,
353
+ indeterminate,
323
354
  isDisabled,
324
- isIndeterminate,
325
355
  isInvalid,
326
356
  isReadOnly,
327
357
  isRequired,
328
358
  __css: {
329
- opacity: isChecked || isIndeterminate ? 1 : 0,
330
- transform: isChecked || isIndeterminate ? "scale(1)" : "scale(0.95)",
359
+ opacity: checked || indeterminate ? 1 : 0,
360
+ transform: checked || indeterminate ? "scale(1)" : "scale(0.95)",
331
361
  transitionDuration: "normal",
332
362
  transitionProperty: "transform"
333
363
  }
@@ -386,6 +416,8 @@ var Checkbox = (0, import_react2.forwardRef)(
386
416
  Checkbox.displayName = "Checkbox";
387
417
  Checkbox.__ui__ = "Checkbox";
388
418
  var CheckboxIcon = ({
419
+ checked,
420
+ indeterminate,
389
421
  isChecked,
390
422
  isDisabled: _isDisabled,
391
423
  isIndeterminate,
@@ -394,7 +426,9 @@ var CheckboxIcon = ({
394
426
  isRequired: _isRequired,
395
427
  ...rest
396
428
  }) => {
397
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_motion.AnimatePresence, { initial: false, children: isIndeterminate || isChecked ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
429
+ checked != null ? checked : checked = isChecked;
430
+ indeterminate != null ? indeterminate : indeterminate = isIndeterminate;
431
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_motion.AnimatePresence, { initial: false, children: indeterminate || checked ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
398
432
  import_core.ui.div,
399
433
  {
400
434
  __css: {
@@ -418,7 +452,7 @@ var CheckboxIcon = ({
418
452
  checked: { scale: 1 },
419
453
  unchecked: { scale: 0.5 }
420
454
  },
421
- children: isIndeterminate ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckboxIndeterminateIcon, { ...rest }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckboxCheckIcon, { ...rest })
455
+ children: indeterminate ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckboxIndeterminateIcon, { ...rest }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckboxCheckIcon, { ...rest })
422
456
  }
423
457
  )
424
458
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/checkbox.tsx","../src/checkbox-context.tsx","../src/use-checkbox.ts"],"sourcesContent":["import type {\n ComponentArgs,\n FC,\n HTMLUIProps,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { MotionProps } from \"@yamada-ui/motion\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport type {\n CSSProperties,\n ForwardedRef,\n InputHTMLAttributes,\n ReactElement,\n ReactNode,\n Ref,\n} from \"react\"\nimport type { UseCheckboxProps } from \"./use-checkbox\"\nimport { omitThemeProps, ui, useComponentMultiStyle } from \"@yamada-ui/core\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport { AnimatePresence, motion } from \"@yamada-ui/motion\"\nimport { cx, funcAll } from \"@yamada-ui/utils\"\nimport { cloneElement, forwardRef } from \"react\"\nimport { useCheckboxGroupContext } from \"./checkbox-context\"\nimport { useCheckbox } from \"./use-checkbox\"\n\ninterface CheckboxOptions {\n /**\n * The label of the checkbox.\n */\n label?: ReactNode\n /**\n * Props for icon component.\n */\n iconProps?: { children: ReactElement } & Omit<HTMLUIProps, \"children\">\n /**\n * Props for input element.\n */\n inputProps?: InputHTMLAttributes<HTMLInputElement>\n /**\n * Props for label element.\n */\n labelProps?: HTMLUIProps<\"span\">\n}\n\nexport interface CheckboxProps<Y extends number | string = string>\n extends Omit<Merge<HTMLUIProps<\"label\">, UseCheckboxProps<Y>>, \"checked\">,\n ThemeProps<\"Checkbox\">,\n CheckboxOptions {}\n\n/**\n * `Checkbox` is a component used for allowing users to select multiple values from multiple options.\n *\n * @see Docs https://yamada-ui.com/components/forms/checkbox\n */\nexport const Checkbox = forwardRef(\n <Y extends number | string = string>(\n props: CheckboxProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useCheckboxGroupContext()\n const { value: groupValue, ...groupProps } = { ...group }\n const control = useFormControl(props)\n const [styles, mergedProps] = useComponentMultiStyle(\"Checkbox\", {\n ...groupProps,\n ...props,\n })\n const {\n className,\n children,\n gap = \"0.5rem\",\n isDisabled = groupProps.isDisabled ?? control.isDisabled,\n isInvalid = groupProps.isInvalid ?? control.isInvalid,\n isReadOnly = groupProps.isReadOnly ?? control.isReadOnly,\n isRequired = groupProps.isRequired ?? control.isRequired,\n label,\n iconProps,\n inputProps,\n labelProps,\n ...computedProps\n } = omitThemeProps(mergedProps)\n\n const isCheckedProp =\n groupValue && computedProps.value\n ? groupValue.includes(computedProps.value)\n : computedProps.isChecked\n const onChange =\n groupProps.onChange && computedProps.value\n ? funcAll(groupProps.onChange, computedProps.onChange)\n : computedProps.onChange\n\n const {\n isChecked,\n isIndeterminate,\n props: rest,\n getContainerProps,\n getIconProps,\n getInputProps,\n getLabelProps,\n } = useCheckbox({\n ...computedProps,\n isChecked: isCheckedProp,\n isDisabled,\n isInvalid,\n isReadOnly,\n isRequired,\n onChange,\n })\n\n const { children: customIcon, ...resolvedIconProps } = { ...iconProps }\n const icon = cloneElement(customIcon ?? <CheckboxIcon />, {\n isChecked,\n isDisabled,\n isIndeterminate,\n isInvalid,\n isReadOnly,\n isRequired,\n __css: {\n opacity: isChecked || isIndeterminate ? 1 : 0,\n transform: isChecked || isIndeterminate ? \"scale(1)\" : \"scale(0.95)\",\n transitionDuration: \"normal\",\n transitionProperty: \"transform\",\n },\n })\n\n return (\n <ui.label\n className={cx(\"ui-checkbox\", className)}\n {...getContainerProps()}\n __css={{\n alignItems: \"center\",\n cursor: \"pointer\",\n display: \"inline-flex\",\n gap,\n position: \"relative\",\n verticalAlign: \"top\",\n ...styles.container,\n }}\n {...rest}\n >\n <ui.input\n className=\"ui-checkbox__input\"\n {...getInputProps(inputProps, ref)}\n />\n\n <ui.div\n className=\"ui-checkbox__icon\"\n __css={{\n display: \"inline-block\",\n position: \"relative\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n {...getIconProps(resolvedIconProps)}\n >\n {icon}\n </ui.div>\n\n <ui.span\n className=\"ui-checkbox__label\"\n __css={{ ...styles.label }}\n {...getLabelProps(labelProps)}\n >\n {children ?? label}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends number | string = string>(\n props: { ref?: Ref<HTMLInputElement> } & CheckboxProps<Y>,\n ): ReactElement\n} & ComponentArgs\n\nCheckbox.displayName = \"Checkbox\"\nCheckbox.__ui__ = \"Checkbox\"\n\nexport type CheckboxIconProps = {\n /**\n * If `true`, the icon will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n /**\n * If `true`, the icon will be indeterminate.\n *\n * @default false\n */\n isIndeterminate?: boolean\n} & FormControlOptions &\n MotionProps<\"svg\">\n\nexport const CheckboxIcon: FC<CheckboxIconProps> = ({\n isChecked,\n isDisabled: _isDisabled,\n isIndeterminate,\n isInvalid: _isInvalid,\n isReadOnly: _isReadOnly,\n isRequired: _isRequired,\n ...rest\n}) => {\n return (\n <AnimatePresence initial={false}>\n {isIndeterminate || isChecked ? (\n <ui.div\n __css={{\n left: \"50%\",\n position: \"absolute\",\n top: \"50%\",\n transform: \"translate(-50%, -50%)\",\n }}\n >\n <motion.div\n style={\n {\n alignItems: \"center\",\n display: \"flex\",\n justifyContent: \"center\",\n } as CSSProperties\n }\n animate=\"checked\"\n exit=\"unchecked\"\n initial=\"unchecked\"\n variants={{\n checked: { scale: 1 },\n unchecked: { scale: 0.5 },\n }}\n >\n {isIndeterminate ? (\n <CheckboxIndeterminateIcon {...rest} />\n ) : (\n <CheckboxCheckIcon {...rest} />\n )}\n </motion.div>\n </ui.div>\n ) : null}\n </AnimatePresence>\n )\n}\n\nCheckboxIcon.displayName = \"CheckboxIcon\"\nCheckboxIcon.__ui__ = \"CheckboxIcon\"\n\ninterface CheckboxCheckIconProps extends MotionProps<\"svg\"> {}\n\nconst CheckboxCheckIcon: FC<CheckboxCheckIconProps> = (props) => {\n return (\n <motion.svg\n style={{\n fill: \"none\",\n stroke: \"currentColor\",\n strokeDasharray: 16,\n strokeWidth: 2,\n }}\n variants={{\n checked: {\n opacity: 1,\n strokeDashoffset: 0,\n transition: { duration: 0.2 },\n },\n unchecked: {\n opacity: 0,\n strokeDashoffset: 16,\n },\n }}\n viewBox=\"0 0 12 10\"\n width=\"1.2em\"\n {...props}\n >\n <polyline points=\"1.5 6 4.5 9 10.5 1\" />\n </motion.svg>\n )\n}\n\nCheckboxCheckIcon.displayName = \"CheckboxCheckIcon\"\nCheckboxCheckIcon.__ui__ = \"CheckboxCheckIcon\"\n\ninterface CheckboxIndeterminateIconProps extends MotionProps<\"svg\"> {}\n\nconst CheckboxIndeterminateIcon: FC<CheckboxIndeterminateIconProps> = (\n props,\n) => {\n return (\n <motion.svg\n style={{ stroke: \"currentColor\", strokeWidth: 4 }}\n variants={{\n checked: {\n opacity: 1,\n scaleX: 1,\n transition: {\n opacity: { duration: 0.02 },\n scaleX: { duration: 0 },\n },\n },\n unchecked: {\n opacity: 0,\n scaleX: 0.65,\n },\n }}\n viewBox=\"0 0 24 24\"\n width=\"1.2em\"\n {...props}\n >\n <line x1=\"21\" x2=\"3\" y1=\"12\" y2=\"12\" />\n </motion.svg>\n )\n}\n\nCheckboxIndeterminateIcon.displayName = \"CheckboxIndeterminateIcon\"\nCheckboxIndeterminateIcon.__ui__ = \"CheckboxIndeterminateIcon\"\n","import type {\n CSSUIObject,\n HTMLUIProps,\n PropGetter,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { ChangeEvent, ReactElement } from \"react\"\nimport type { CheckboxCardProps } from \"./checkbox-card\"\nimport { createContext } from \"@yamada-ui/utils\"\n\ninterface CheckboxGroupSharedContext extends FormControlOptions {\n value: (number | string)[]\n onChange: (evOrValue: ChangeEvent<HTMLInputElement> | number | string) => void\n}\n\nexport interface CheckboxGroupContext\n extends CheckboxGroupSharedContext,\n ThemeProps<\"Checkbox\">,\n FormControlOptions {}\n\nexport const [CheckboxGroupProvider, useCheckboxGroupContext] =\n createContext<CheckboxGroupContext>({\n name: \"CheckboxGroupContext\",\n strict: false,\n })\n\nexport interface CheckboxCardGroupContext\n extends CheckboxGroupSharedContext,\n Pick<\n CheckboxCardProps,\n \"addonProps\" | \"descriptionProps\" | \"labelProps\" | \"withIcon\"\n >,\n ThemeProps<\"CheckboxCard\"> {}\n\nexport const [CheckboxCardGroupProvider, useCheckboxCardGroupContext] =\n createContext<CheckboxCardGroupContext>({\n name: \"CheckboxCardGroupContext\",\n strict: false,\n })\n\nexport interface CheckboxCardContext {\n icon: ReactElement\n styles: { [key: string]: CSSUIObject | undefined }\n withIcon: boolean\n getIconProps: PropGetter\n iconProps?: HTMLUIProps\n}\n\nexport const [CheckboxCardProvider, useCheckboxCardContext] =\n createContext<CheckboxCardContext>({\n name: \"CheckboxCardContext\",\n errorMessage: `useCheckboxCardContext returned is 'undefined'. Seems you forgot to wrap the components in \"<CheckboxCard />\"`,\n })\n","import type { PropGetter } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { Dict } from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n ChangeEventHandler,\n FocusEventHandler,\n KeyboardEvent,\n SyntheticEvent,\n} from \"react\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport {\n dataAttr,\n handlerAll,\n mergeRefs,\n splitObject,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport { useCallback, useEffect, useId, useRef, useState } from \"react\"\n\nexport interface UseCheckboxProps<Y extends number | string = string>\n extends FormControlOptions {\n /**\n * id assigned to input.\n */\n id?: string\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * If `true`, the checkbox will be initially checked.\n *\n * @default false\n */\n defaultIsChecked?: boolean\n /**\n * If `true`, the checkbox will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n /**\n * If `true`, the checkbox will be indeterminate.\n *\n * @default false\n */\n isIndeterminate?: boolean\n /**\n * If `true`, the checkbox will be selected when the Enter key is pressed.\n *\n * @default false\n */\n selectOnEnter?: boolean\n /**\n * The tab-index property of the underlying input element.\n */\n tabIndex?: number\n /**\n * The value to be used in the checkbox input.\n */\n value?: Y\n /**\n * The callback invoked when the checkbox is blurred.\n */\n onBlur?: FocusEventHandler<HTMLInputElement>\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n /**\n * The callback invoked when the checkbox is focused.\n */\n onFocus?: FocusEventHandler<HTMLInputElement>\n}\n\nexport const useCheckbox = <\n Y extends number | string = string,\n M extends Dict = Dict,\n>({\n id,\n ...props\n}: M & UseCheckboxProps<Y>) => {\n const uuid = useId()\n\n id ??= uuid\n\n const {\n id: _id,\n name,\n defaultIsChecked,\n isChecked: isCheckedProp,\n isIndeterminate,\n selectOnEnter,\n tabIndex,\n value,\n onChange: onChangeProp,\n ...computedProps\n } = useFormControlProps({ id, ...props })\n const [\n {\n \"aria-readonly\": _ariaReadonly,\n disabled,\n readOnly,\n required,\n onBlur: onBlurProp,\n onFocus: onFocusProp,\n ...formControlProps\n },\n rest,\n ] = splitObject(computedProps, formControlProperties)\n\n const [isFocusVisible, setIsFocusVisible] = useState<boolean>(false)\n const [isFocused, setFocused] = useState<boolean>(false)\n const [isHovered, setHovered] = useState<boolean>(false)\n const [isActive, setActive] = useState<boolean>(false)\n\n const inputRef = useRef<HTMLInputElement>(null)\n const [isLabel, setIsLabel] = useState<boolean>(true)\n\n const [isChecked, setIsChecked] = useState<boolean>(!!defaultIsChecked)\n\n const isControlled = isCheckedProp !== undefined\n const checked = isControlled ? (isCheckedProp as boolean) : isChecked\n\n const onChange = useCallbackRef(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (readOnly || disabled) {\n ev.preventDefault()\n\n return\n }\n\n if (!isControlled)\n setIsChecked(!checked || isIndeterminate ? true : ev.target.checked)\n\n onChangeProp?.(ev)\n },\n [readOnly, disabled, isControlled, checked, isIndeterminate],\n )\n const onFocus = useCallbackRef(onFocusProp)\n const onBlur = useCallbackRef(onBlurProp)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent) => {\n if (key === \" \") setActive(true)\n\n if (selectOnEnter && key === \"Enter\") inputRef.current?.click()\n },\n [setActive, selectOnEnter],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent) => {\n if (key === \" \") setActive(false)\n },\n [setActive],\n )\n\n useEffect(() => {\n return trackFocusVisible(setIsFocusVisible)\n }, [])\n\n useSafeLayoutEffect(() => {\n if (inputRef.current)\n inputRef.current.indeterminate = Boolean(isIndeterminate)\n }, [isIndeterminate])\n\n useUpdateEffect(() => {\n if (disabled) setFocused(false)\n }, [disabled, setFocused])\n\n useSafeLayoutEffect(() => {\n if (!inputRef.current?.form) return\n\n inputRef.current.form.onreset = () => setIsChecked(!!defaultIsChecked)\n }, [])\n\n useSafeLayoutEffect(() => {\n if (!inputRef.current) return\n\n if (inputRef.current.checked !== checked)\n setIsChecked(inputRef.current.checked)\n }, [inputRef.current])\n\n const getContainerProps: PropGetter<\"label\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref: mergeRefs(ref, (el: HTMLElement | undefined) => {\n if (el) setIsLabel(el.tagName === \"LABEL\")\n }),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n onClick: handlerAll(props.onClick, () => {\n if (isLabel) return\n\n inputRef.current?.click()\n\n requestAnimationFrame(() => inputRef.current?.focus())\n }),\n }),\n [checked, isLabel, isFocused, isFocusVisible, formControlProps],\n )\n\n const getIconProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"aria-hidden\": true,\n \"data-active\": dataAttr(isActive),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n \"data-hover\": dataAttr(isHovered),\n \"data-indeterminate\": dataAttr(isIndeterminate),\n onMouseDown: handlerAll(props.onMouseDown, (ev: React.MouseEvent) => {\n if (isFocused) ev.preventDefault()\n\n setActive(true)\n }),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n }),\n [\n isActive,\n checked,\n isFocused,\n isHovered,\n isFocusVisible,\n isIndeterminate,\n formControlProps,\n ],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n id,\n ref: mergeRefs(inputRef, ref),\n type: \"checkbox\",\n name,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n margin: \"-1px\",\n overflow: \"hidden\",\n padding: \"0px\",\n position: \"absolute\",\n whiteSpace: \"nowrap\",\n width: \"1px\",\n },\n \"aria-checked\": isIndeterminate ? \"mixed\" : checked,\n checked,\n disabled,\n readOnly,\n required,\n tabIndex,\n value,\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onChange: handlerAll(props.onChange, onChange),\n onFocus: handlerAll(props.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props.onKeyUp, onKeyUp),\n }),\n [\n isIndeterminate,\n formControlProps,\n id,\n name,\n value,\n tabIndex,\n required,\n disabled,\n readOnly,\n checked,\n onChange,\n onBlur,\n onFocus,\n onKeyDown,\n onKeyUp,\n ],\n )\n\n const getLabelProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-checked\": dataAttr(checked),\n onMouseDown: handlerAll(props.onMouseDown, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n onTouchStart: handlerAll(props.onTouchStart, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n }),\n [checked, formControlProps],\n )\n\n return {\n isActive,\n isChecked: checked,\n isFocused,\n isFocusVisible,\n isHovered,\n isIndeterminate,\n props: rest,\n getContainerProps,\n getIconProps,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseCheckboxReturn = ReturnType<typeof useCheckbox>\n"],"mappings":"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","names":["import_form_control","import_utils","import_react","import_utils","props","_a"]}
1
+ {"version":3,"sources":["../src/checkbox.tsx","../src/checkbox-context.tsx","../src/use-checkbox.ts"],"sourcesContent":["import type {\n ComponentArgs,\n FC,\n HTMLUIProps,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { MotionProps } from \"@yamada-ui/motion\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport type {\n CSSProperties,\n ForwardedRef,\n InputHTMLAttributes,\n ReactElement,\n ReactNode,\n Ref,\n} from \"react\"\nimport type { UseCheckboxProps } from \"./use-checkbox\"\nimport { omitThemeProps, ui, useComponentMultiStyle } from \"@yamada-ui/core\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport { AnimatePresence, motion } from \"@yamada-ui/motion\"\nimport { cx, funcAll } from \"@yamada-ui/utils\"\nimport { cloneElement, forwardRef } from \"react\"\nimport { useCheckboxGroupContext } from \"./checkbox-context\"\nimport { useCheckbox } from \"./use-checkbox\"\n\ninterface CheckboxOptions {\n /**\n * The label of the checkbox.\n */\n label?: ReactNode\n /**\n * Props for icon component.\n */\n iconProps?: { children: ReactElement } & Omit<HTMLUIProps, \"children\">\n /**\n * Props for input element.\n */\n inputProps?: InputHTMLAttributes<HTMLInputElement>\n /**\n * Props for label element.\n */\n labelProps?: HTMLUIProps<\"span\">\n}\n\nexport interface CheckboxProps<Y extends number | string = string>\n extends Omit<Merge<HTMLUIProps<\"label\">, UseCheckboxProps<Y>>, \"checked\">,\n ThemeProps<\"Checkbox\">,\n CheckboxOptions {}\n\n/**\n * `Checkbox` is a component used for allowing users to select multiple values from multiple options.\n *\n * @see Docs https://yamada-ui.com/components/forms/checkbox\n */\nexport const Checkbox = forwardRef(\n <Y extends number | string = string>(\n props: CheckboxProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useCheckboxGroupContext()\n const { value: groupValue, ...groupProps } = { ...group }\n const control = useFormControl(props)\n const [styles, mergedProps] = useComponentMultiStyle(\"Checkbox\", {\n ...groupProps,\n ...props,\n })\n const {\n className,\n children,\n gap = \"0.5rem\",\n isDisabled = groupProps.isDisabled ?? control.isDisabled,\n isInvalid = groupProps.isInvalid ?? control.isInvalid,\n isReadOnly = groupProps.isReadOnly ?? control.isReadOnly,\n isRequired = groupProps.isRequired ?? control.isRequired,\n label,\n iconProps,\n inputProps,\n labelProps,\n ...computedProps\n } = omitThemeProps(mergedProps)\n\n const isCheckedProp =\n groupValue && computedProps.value\n ? groupValue.includes(computedProps.value)\n : computedProps.isChecked\n const onChange =\n groupProps.onChange && computedProps.value\n ? funcAll(groupProps.onChange, computedProps.onChange)\n : computedProps.onChange\n\n const {\n checked,\n indeterminate,\n props: rest,\n getContainerProps,\n getIconProps,\n getInputProps,\n getLabelProps,\n } = useCheckbox({\n ...computedProps,\n isChecked: isCheckedProp,\n isDisabled,\n isInvalid,\n isReadOnly,\n isRequired,\n onChange,\n })\n\n const { children: customIcon, ...resolvedIconProps } = { ...iconProps }\n const icon = cloneElement(customIcon ?? <CheckboxIcon />, {\n checked,\n indeterminate,\n isDisabled,\n isInvalid,\n isReadOnly,\n isRequired,\n __css: {\n opacity: checked || indeterminate ? 1 : 0,\n transform: checked || indeterminate ? \"scale(1)\" : \"scale(0.95)\",\n transitionDuration: \"normal\",\n transitionProperty: \"transform\",\n },\n })\n\n return (\n <ui.label\n className={cx(\"ui-checkbox\", className)}\n {...getContainerProps()}\n __css={{\n alignItems: \"center\",\n cursor: \"pointer\",\n display: \"inline-flex\",\n gap,\n position: \"relative\",\n verticalAlign: \"top\",\n ...styles.container,\n }}\n {...rest}\n >\n <ui.input\n className=\"ui-checkbox__input\"\n {...getInputProps(inputProps, ref)}\n />\n\n <ui.div\n className=\"ui-checkbox__icon\"\n __css={{\n display: \"inline-block\",\n position: \"relative\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n {...getIconProps(resolvedIconProps)}\n >\n {icon}\n </ui.div>\n\n <ui.span\n className=\"ui-checkbox__label\"\n __css={{ ...styles.label }}\n {...getLabelProps(labelProps)}\n >\n {children ?? label}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends number | string = string>(\n props: { ref?: Ref<HTMLInputElement> } & CheckboxProps<Y>,\n ): ReactElement\n} & ComponentArgs\n\nCheckbox.displayName = \"Checkbox\"\nCheckbox.__ui__ = \"Checkbox\"\n\nexport type CheckboxIconProps = {\n /**\n * If `true`, the icon will be checked.\n *\n * @default false\n */\n checked?: boolean\n /**\n * If `true`, the icon will be indeterminate.\n *\n * @default false\n */\n indeterminate?: boolean\n /**\n * If `true`, the icon will be checked.\n *\n * @default false\n *\n * @deprecated Use `checked` instead.\n */\n isChecked?: boolean\n /**\n * If `true`, the icon will be indeterminate.\n *\n * @default false\n *\n * @deprecated Use `indeterminate` instead.\n */\n isIndeterminate?: boolean\n} & FormControlOptions &\n MotionProps<\"svg\">\n\nexport const CheckboxIcon: FC<CheckboxIconProps> = ({\n checked,\n indeterminate,\n isChecked,\n isDisabled: _isDisabled,\n isIndeterminate,\n isInvalid: _isInvalid,\n isReadOnly: _isReadOnly,\n isRequired: _isRequired,\n ...rest\n}) => {\n checked ??= isChecked\n indeterminate ??= isIndeterminate\n\n return (\n <AnimatePresence initial={false}>\n {indeterminate || checked ? (\n <ui.div\n __css={{\n left: \"50%\",\n position: \"absolute\",\n top: \"50%\",\n transform: \"translate(-50%, -50%)\",\n }}\n >\n <motion.div\n style={\n {\n alignItems: \"center\",\n display: \"flex\",\n justifyContent: \"center\",\n } as CSSProperties\n }\n animate=\"checked\"\n exit=\"unchecked\"\n initial=\"unchecked\"\n variants={{\n checked: { scale: 1 },\n unchecked: { scale: 0.5 },\n }}\n >\n {indeterminate ? (\n <CheckboxIndeterminateIcon {...rest} />\n ) : (\n <CheckboxCheckIcon {...rest} />\n )}\n </motion.div>\n </ui.div>\n ) : null}\n </AnimatePresence>\n )\n}\n\nCheckboxIcon.displayName = \"CheckboxIcon\"\nCheckboxIcon.__ui__ = \"CheckboxIcon\"\n\ninterface CheckboxCheckIconProps extends MotionProps<\"svg\"> {}\n\nconst CheckboxCheckIcon: FC<CheckboxCheckIconProps> = (props) => {\n return (\n <motion.svg\n style={{\n fill: \"none\",\n stroke: \"currentColor\",\n strokeDasharray: 16,\n strokeWidth: 2,\n }}\n variants={{\n checked: {\n opacity: 1,\n strokeDashoffset: 0,\n transition: { duration: 0.2 },\n },\n unchecked: {\n opacity: 0,\n strokeDashoffset: 16,\n },\n }}\n viewBox=\"0 0 12 10\"\n width=\"1.2em\"\n {...props}\n >\n <polyline points=\"1.5 6 4.5 9 10.5 1\" />\n </motion.svg>\n )\n}\n\nCheckboxCheckIcon.displayName = \"CheckboxCheckIcon\"\nCheckboxCheckIcon.__ui__ = \"CheckboxCheckIcon\"\n\ninterface CheckboxIndeterminateIconProps extends MotionProps<\"svg\"> {}\n\nconst CheckboxIndeterminateIcon: FC<CheckboxIndeterminateIconProps> = (\n props,\n) => {\n return (\n <motion.svg\n style={{ stroke: \"currentColor\", strokeWidth: 4 }}\n variants={{\n checked: {\n opacity: 1,\n scaleX: 1,\n transition: {\n opacity: { duration: 0.02 },\n scaleX: { duration: 0 },\n },\n },\n unchecked: {\n opacity: 0,\n scaleX: 0.65,\n },\n }}\n viewBox=\"0 0 24 24\"\n width=\"1.2em\"\n {...props}\n >\n <line x1=\"21\" x2=\"3\" y1=\"12\" y2=\"12\" />\n </motion.svg>\n )\n}\n\nCheckboxIndeterminateIcon.displayName = \"CheckboxIndeterminateIcon\"\nCheckboxIndeterminateIcon.__ui__ = \"CheckboxIndeterminateIcon\"\n","import type {\n CSSUIObject,\n HTMLUIProps,\n PropGetter,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { ChangeEvent, ReactElement } from \"react\"\nimport type { CheckboxCardProps } from \"./checkbox-card\"\nimport { createContext } from \"@yamada-ui/utils\"\n\ninterface CheckboxGroupSharedContext extends FormControlOptions {\n value: (number | string)[]\n onChange: (evOrValue: ChangeEvent<HTMLInputElement> | number | string) => void\n}\n\nexport interface CheckboxGroupContext\n extends CheckboxGroupSharedContext,\n ThemeProps<\"Checkbox\">,\n FormControlOptions {}\n\nexport const [CheckboxGroupProvider, useCheckboxGroupContext] =\n createContext<CheckboxGroupContext>({\n name: \"CheckboxGroupContext\",\n strict: false,\n })\n\nexport interface CheckboxCardGroupContext\n extends CheckboxGroupSharedContext,\n Pick<\n CheckboxCardProps,\n \"addonProps\" | \"descriptionProps\" | \"labelProps\" | \"withIcon\"\n >,\n ThemeProps<\"CheckboxCard\"> {}\n\nexport const [CheckboxCardGroupProvider, useCheckboxCardGroupContext] =\n createContext<CheckboxCardGroupContext>({\n name: \"CheckboxCardGroupContext\",\n strict: false,\n })\n\nexport interface CheckboxCardContext {\n icon: ReactElement\n styles: { [key: string]: CSSUIObject | undefined }\n withIcon: boolean\n getIconProps: PropGetter\n iconProps?: HTMLUIProps\n}\n\nexport const [CheckboxCardProvider, useCheckboxCardContext] =\n createContext<CheckboxCardContext>({\n name: \"CheckboxCardContext\",\n errorMessage: `useCheckboxCardContext returned is 'undefined'. Seems you forgot to wrap the components in \"<CheckboxCard />\"`,\n })\n","import type { PropGetter } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { Dict } from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n ChangeEventHandler,\n FocusEventHandler,\n KeyboardEvent,\n SyntheticEvent,\n} from \"react\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport {\n dataAttr,\n handlerAll,\n mergeRefs,\n splitObject,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport { useCallback, useEffect, useId, useRef, useState } from \"react\"\n\nexport interface UseCheckboxProps<Y extends number | string = string>\n extends FormControlOptions {\n /**\n * id assigned to input.\n */\n id?: string\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * If `true`, the checkbox will be checked.\n *\n * @default false\n */\n checked?: boolean\n /**\n * If `true`, the checkbox will be initially checked.\n *\n * @default false\n */\n defaultChecked?: boolean\n /**\n * If `true`, the checkbox will be initially checked.\n *\n * @default false\n *\n * @deprecated Use `defaultChecked` instead.\n */\n defaultIsChecked?: boolean\n /**\n * If `true`, the checkbox will be indeterminate.\n *\n * @default false\n */\n indeterminate?: boolean\n /**\n * If `true`, the checkbox will be checked.\n *\n * @default false\n *\n * @deprecated Use `checked` instead.\n */\n isChecked?: boolean\n /**\n * If `true`, the checkbox will be indeterminate.\n *\n * @default false\n *\n * @deprecated Use `indeterminate` instead.\n */\n isIndeterminate?: boolean\n /**\n * If `true`, the checkbox will be selected when the Enter key is pressed.\n *\n * @default false\n */\n selectOnEnter?: boolean\n /**\n * The tab-index property of the underlying input element.\n */\n tabIndex?: number\n /**\n * The value to be used in the checkbox input.\n */\n value?: Y\n /**\n * The callback invoked when the checkbox is blurred.\n */\n onBlur?: FocusEventHandler<HTMLInputElement>\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n /**\n * The callback invoked when the checkbox is focused.\n */\n onFocus?: FocusEventHandler<HTMLInputElement>\n}\n\nexport const useCheckbox = <\n Y extends number | string = string,\n M extends Dict = Dict,\n>({\n id,\n ...props\n}: M & UseCheckboxProps<Y>) => {\n const uuid = useId()\n\n id ??= uuid\n\n let {\n id: _id,\n name,\n checked: checkedProp,\n defaultChecked,\n defaultIsChecked,\n indeterminate,\n isChecked: isCheckedProp,\n isIndeterminate,\n selectOnEnter,\n tabIndex,\n value,\n onChange: onChangeProp,\n ...computedProps\n } = useFormControlProps({ id, ...props })\n\n checkedProp ??= isCheckedProp\n indeterminate ??= isIndeterminate\n defaultChecked ??= defaultIsChecked\n\n const [\n {\n \"aria-readonly\": _ariaReadonly,\n disabled,\n readOnly,\n required,\n onBlur: onBlurProp,\n onFocus: onFocusProp,\n ...formControlProps\n },\n rest,\n ] = splitObject(computedProps, formControlProperties)\n\n const [focusVisible, setFocusVisible] = useState<boolean>(false)\n const [focused, setFocused] = useState<boolean>(false)\n const [hovered, setHovered] = useState<boolean>(false)\n const [active, setActive] = useState<boolean>(false)\n\n const inputRef = useRef<HTMLInputElement>(null)\n const [label, setLabel] = useState<boolean>(true)\n\n const [isChecked, setIsChecked] = useState<boolean>(!!defaultChecked)\n\n const controlled = checkedProp !== undefined\n const checked = controlled ? (checkedProp as boolean) : isChecked\n\n const onChange = useCallbackRef(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (readOnly || disabled) {\n ev.preventDefault()\n\n return\n }\n\n if (!controlled)\n setIsChecked(!checked || indeterminate ? true : ev.target.checked)\n\n onChangeProp?.(ev)\n },\n [readOnly, disabled, controlled, checked, indeterminate],\n )\n const onFocus = useCallbackRef(onFocusProp)\n const onBlur = useCallbackRef(onBlurProp)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent) => {\n if (key === \" \") setActive(true)\n\n if (selectOnEnter && key === \"Enter\") inputRef.current?.click()\n },\n [setActive, selectOnEnter],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent) => {\n if (key === \" \") setActive(false)\n },\n [setActive],\n )\n\n useEffect(() => {\n return trackFocusVisible(setFocusVisible)\n }, [])\n\n useSafeLayoutEffect(() => {\n if (inputRef.current)\n inputRef.current.indeterminate = Boolean(isIndeterminate)\n }, [isIndeterminate])\n\n useUpdateEffect(() => {\n if (disabled) setFocused(false)\n }, [disabled, setFocused])\n\n useSafeLayoutEffect(() => {\n if (!inputRef.current?.form) return\n\n inputRef.current.form.onreset = () => setIsChecked(!!defaultChecked)\n }, [])\n\n useSafeLayoutEffect(() => {\n if (!inputRef.current) return\n\n if (inputRef.current.checked !== checked)\n setIsChecked(inputRef.current.checked)\n }, [inputRef.current])\n\n const getContainerProps: PropGetter<\"label\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref: mergeRefs(ref, (el: HTMLElement | undefined) => {\n if (el) setLabel(el.tagName === \"LABEL\")\n }),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(focused),\n \"data-focus-visible\": dataAttr(focused && focusVisible),\n onClick: handlerAll(props.onClick, () => {\n if (label) return\n\n inputRef.current?.click()\n\n requestAnimationFrame(() => inputRef.current?.focus())\n }),\n }),\n [checked, label, focused, focusVisible, formControlProps],\n )\n\n const getIconProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"aria-hidden\": true,\n \"data-active\": dataAttr(active),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(focused),\n \"data-focus-visible\": dataAttr(focused && focusVisible),\n \"data-hover\": dataAttr(hovered),\n \"data-indeterminate\": dataAttr(indeterminate),\n onMouseDown: handlerAll(props.onMouseDown, (ev: React.MouseEvent) => {\n if (focused) ev.preventDefault()\n\n setActive(true)\n }),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n }),\n [\n active,\n checked,\n focused,\n hovered,\n focusVisible,\n indeterminate,\n formControlProps,\n ],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n id,\n ref: mergeRefs(inputRef, ref),\n type: \"checkbox\",\n name,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n margin: \"-1px\",\n overflow: \"hidden\",\n padding: \"0px\",\n position: \"absolute\",\n whiteSpace: \"nowrap\",\n width: \"1px\",\n },\n \"aria-checked\": indeterminate ? \"mixed\" : checked,\n checked,\n disabled,\n readOnly,\n required,\n tabIndex,\n value,\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onChange: handlerAll(props.onChange, onChange),\n onFocus: handlerAll(props.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props.onKeyUp, onKeyUp),\n }),\n [\n indeterminate,\n formControlProps,\n id,\n name,\n value,\n tabIndex,\n required,\n disabled,\n readOnly,\n checked,\n onChange,\n onBlur,\n onFocus,\n onKeyDown,\n onKeyUp,\n ],\n )\n\n const getLabelProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-checked\": dataAttr(checked),\n onMouseDown: handlerAll(props.onMouseDown, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n onTouchStart: handlerAll(props.onTouchStart, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n }),\n [checked, formControlProps],\n )\n\n return {\n active,\n checked,\n focused,\n focusVisible,\n hovered,\n indeterminate,\n /**\n * @deprecated Use `active` instead.\n */\n isActive: active,\n /**\n * @deprecated Use `checked` instead.\n */\n isChecked: checked,\n /**\n * @deprecated Use `focused` instead.\n */\n isFocused: focused,\n /**\n * @deprecated Use `focusVisible` instead.\n */\n isFocusVisible: focusVisible,\n /**\n * @deprecated Use `hovered` instead.\n */\n isHovered: hovered,\n /**\n * @deprecated Use `indeterminate` instead.\n */\n isIndeterminate,\n props: rest,\n getContainerProps,\n getIconProps,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseCheckboxReturn = ReturnType<typeof useCheckbox>\n"],"mappings":"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","names":["import_form_control","import_utils","import_react","import_utils","props","_a"]}
package/dist/checkbox.mjs CHANGED
@@ -2,8 +2,8 @@
2
2
  import {
3
3
  Checkbox,
4
4
  CheckboxIcon
5
- } from "./chunk-LSEGOUL4.mjs";
6
- import "./chunk-YKJPEUZC.mjs";
5
+ } from "./chunk-KRCEAKWH.mjs";
6
+ import "./chunk-A2JXM6CV.mjs";
7
7
  import "./chunk-2VDJDPFI.mjs";
8
8
  export {
9
9
  Checkbox,
@@ -22,10 +22,13 @@ var useCheckbox = ({
22
22
  }) => {
23
23
  const uuid = useId();
24
24
  id != null ? id : id = uuid;
25
- const {
25
+ let {
26
26
  id: _id,
27
27
  name,
28
+ checked: checkedProp,
29
+ defaultChecked,
28
30
  defaultIsChecked,
31
+ indeterminate,
29
32
  isChecked: isCheckedProp,
30
33
  isIndeterminate,
31
34
  selectOnEnter,
@@ -34,6 +37,9 @@ var useCheckbox = ({
34
37
  onChange: onChangeProp,
35
38
  ...computedProps
36
39
  } = useFormControlProps({ id, ...props });
40
+ checkedProp != null ? checkedProp : checkedProp = isCheckedProp;
41
+ indeterminate != null ? indeterminate : indeterminate = isIndeterminate;
42
+ defaultChecked != null ? defaultChecked : defaultChecked = defaultIsChecked;
37
43
  const [
38
44
  {
39
45
  "aria-readonly": _ariaReadonly,
@@ -46,26 +52,26 @@ var useCheckbox = ({
46
52
  },
47
53
  rest
48
54
  ] = splitObject(computedProps, formControlProperties);
49
- const [isFocusVisible, setIsFocusVisible] = useState(false);
50
- const [isFocused, setFocused] = useState(false);
51
- const [isHovered, setHovered] = useState(false);
52
- const [isActive, setActive] = useState(false);
55
+ const [focusVisible, setFocusVisible] = useState(false);
56
+ const [focused, setFocused] = useState(false);
57
+ const [hovered, setHovered] = useState(false);
58
+ const [active, setActive] = useState(false);
53
59
  const inputRef = useRef(null);
54
- const [isLabel, setIsLabel] = useState(true);
55
- const [isChecked, setIsChecked] = useState(!!defaultIsChecked);
56
- const isControlled = isCheckedProp !== void 0;
57
- const checked = isControlled ? isCheckedProp : isChecked;
60
+ const [label, setLabel] = useState(true);
61
+ const [isChecked, setIsChecked] = useState(!!defaultChecked);
62
+ const controlled = checkedProp !== void 0;
63
+ const checked = controlled ? checkedProp : isChecked;
58
64
  const onChange = useCallbackRef(
59
65
  (ev) => {
60
66
  if (readOnly || disabled) {
61
67
  ev.preventDefault();
62
68
  return;
63
69
  }
64
- if (!isControlled)
65
- setIsChecked(!checked || isIndeterminate ? true : ev.target.checked);
70
+ if (!controlled)
71
+ setIsChecked(!checked || indeterminate ? true : ev.target.checked);
66
72
  onChangeProp == null ? void 0 : onChangeProp(ev);
67
73
  },
68
- [readOnly, disabled, isControlled, checked, isIndeterminate]
74
+ [readOnly, disabled, controlled, checked, indeterminate]
69
75
  );
70
76
  const onFocus = useCallbackRef(onFocusProp);
71
77
  const onBlur = useCallbackRef(onBlurProp);
@@ -84,7 +90,7 @@ var useCheckbox = ({
84
90
  [setActive]
85
91
  );
86
92
  useEffect(() => {
87
- return trackFocusVisible(setIsFocusVisible);
93
+ return trackFocusVisible(setFocusVisible);
88
94
  }, []);
89
95
  useSafeLayoutEffect(() => {
90
96
  if (inputRef.current)
@@ -96,7 +102,7 @@ var useCheckbox = ({
96
102
  useSafeLayoutEffect(() => {
97
103
  var _a;
98
104
  if (!((_a = inputRef.current) == null ? void 0 : _a.form)) return;
99
- inputRef.current.form.onreset = () => setIsChecked(!!defaultIsChecked);
105
+ inputRef.current.form.onreset = () => setIsChecked(!!defaultChecked);
100
106
  }, []);
101
107
  useSafeLayoutEffect(() => {
102
108
  if (!inputRef.current) return;
@@ -108,14 +114,14 @@ var useCheckbox = ({
108
114
  ...formControlProps,
109
115
  ...props2,
110
116
  ref: mergeRefs(ref, (el) => {
111
- if (el) setIsLabel(el.tagName === "LABEL");
117
+ if (el) setLabel(el.tagName === "LABEL");
112
118
  }),
113
119
  "data-checked": dataAttr(checked),
114
- "data-focus": dataAttr(isFocused),
115
- "data-focus-visible": dataAttr(isFocused && isFocusVisible),
120
+ "data-focus": dataAttr(focused),
121
+ "data-focus-visible": dataAttr(focused && focusVisible),
116
122
  onClick: handlerAll(props2.onClick, () => {
117
123
  var _a;
118
- if (isLabel) return;
124
+ if (label) return;
119
125
  (_a = inputRef.current) == null ? void 0 : _a.click();
120
126
  requestAnimationFrame(() => {
121
127
  var _a2;
@@ -123,7 +129,7 @@ var useCheckbox = ({
123
129
  });
124
130
  })
125
131
  }),
126
- [checked, isLabel, isFocused, isFocusVisible, formControlProps]
132
+ [checked, label, focused, focusVisible, formControlProps]
127
133
  );
128
134
  const getIconProps = useCallback(
129
135
  (props2 = {}, ref = null) => ({
@@ -131,14 +137,14 @@ var useCheckbox = ({
131
137
  ...props2,
132
138
  ref,
133
139
  "aria-hidden": true,
134
- "data-active": dataAttr(isActive),
140
+ "data-active": dataAttr(active),
135
141
  "data-checked": dataAttr(checked),
136
- "data-focus": dataAttr(isFocused),
137
- "data-focus-visible": dataAttr(isFocused && isFocusVisible),
138
- "data-hover": dataAttr(isHovered),
139
- "data-indeterminate": dataAttr(isIndeterminate),
142
+ "data-focus": dataAttr(focused),
143
+ "data-focus-visible": dataAttr(focused && focusVisible),
144
+ "data-hover": dataAttr(hovered),
145
+ "data-indeterminate": dataAttr(indeterminate),
140
146
  onMouseDown: handlerAll(props2.onMouseDown, (ev) => {
141
- if (isFocused) ev.preventDefault();
147
+ if (focused) ev.preventDefault();
142
148
  setActive(true);
143
149
  }),
144
150
  onMouseEnter: handlerAll(props2.onMouseEnter, () => setHovered(true)),
@@ -146,12 +152,12 @@ var useCheckbox = ({
146
152
  onMouseUp: handlerAll(props2.onMouseUp, () => setActive(false))
147
153
  }),
148
154
  [
149
- isActive,
155
+ active,
150
156
  checked,
151
- isFocused,
152
- isHovered,
153
- isFocusVisible,
154
- isIndeterminate,
157
+ focused,
158
+ hovered,
159
+ focusVisible,
160
+ indeterminate,
155
161
  formControlProps
156
162
  ]
157
163
  );
@@ -174,7 +180,7 @@ var useCheckbox = ({
174
180
  whiteSpace: "nowrap",
175
181
  width: "1px"
176
182
  },
177
- "aria-checked": isIndeterminate ? "mixed" : checked,
183
+ "aria-checked": indeterminate ? "mixed" : checked,
178
184
  checked,
179
185
  disabled,
180
186
  readOnly,
@@ -188,7 +194,7 @@ var useCheckbox = ({
188
194
  onKeyUp: handlerAll(props2.onKeyUp, onKeyUp)
189
195
  }),
190
196
  [
191
- isIndeterminate,
197
+ indeterminate,
192
198
  formControlProps,
193
199
  id,
194
200
  name,
@@ -223,11 +229,35 @@ var useCheckbox = ({
223
229
  [checked, formControlProps]
224
230
  );
225
231
  return {
226
- isActive,
232
+ active,
233
+ checked,
234
+ focused,
235
+ focusVisible,
236
+ hovered,
237
+ indeterminate,
238
+ /**
239
+ * @deprecated Use `active` instead.
240
+ */
241
+ isActive: active,
242
+ /**
243
+ * @deprecated Use `checked` instead.
244
+ */
227
245
  isChecked: checked,
228
- isFocused,
229
- isFocusVisible,
230
- isHovered,
246
+ /**
247
+ * @deprecated Use `focused` instead.
248
+ */
249
+ isFocused: focused,
250
+ /**
251
+ * @deprecated Use `focusVisible` instead.
252
+ */
253
+ isFocusVisible: focusVisible,
254
+ /**
255
+ * @deprecated Use `hovered` instead.
256
+ */
257
+ isHovered: hovered,
258
+ /**
259
+ * @deprecated Use `indeterminate` instead.
260
+ */
231
261
  isIndeterminate,
232
262
  props: rest,
233
263
  getContainerProps,
@@ -240,4 +270,4 @@ var useCheckbox = ({
240
270
  export {
241
271
  useCheckbox
242
272
  };
243
- //# sourceMappingURL=chunk-YKJPEUZC.mjs.map
273
+ //# sourceMappingURL=chunk-A2JXM6CV.mjs.map