@yamada-ui/checkbox 0.5.12 → 1.0.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/checkbox-group.js.map +1 -1
- package/dist/checkbox-group.mjs +1 -1
- package/dist/checkbox.d.mts +5 -0
- package/dist/checkbox.d.ts +5 -0
- package/dist/checkbox.js.map +1 -1
- package/dist/checkbox.mjs +1 -1
- package/dist/{chunk-M6JXMMIP.mjs → chunk-2J2PDM37.mjs} +1 -1
- package/dist/chunk-2J2PDM37.mjs.map +1 -0
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1 -1
- package/package.json +9 -8
- package/dist/chunk-M6JXMMIP.mjs.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/checkbox-group.tsx","../src/checkbox.tsx"],"sourcesContent":["import type { ComponentArgs, ThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport type { FlexProps } from \"@yamada-ui/layouts\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport type { PropGetter, DOMAttributes } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n omitObject,\n useCallbackRef,\n getValidChildren,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent, ForwardedRef, ReactElement, Ref } from \"react\"\nimport { forwardRef, useCallback } from \"react\"\nimport type { CheckboxProps } from \"./checkbox\"\nimport { Checkbox } from \"./checkbox\"\n\nexport type CheckboxItem<Y extends string | number = string> =\n CheckboxProps<Y> & {\n label?: string\n }\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport type UseCheckboxGroupProps<Y extends string | number = string> = {\n /**\n * The value of the checkbox group.\n */\n value?: Y[]\n /**\n * The initial value of the checkbox group.\n */\n defaultValue?: Y[]\n /**\n * The callback fired when any children checkbox is checked or unchecked.\n */\n onChange?: (value: Y[]) => void\n /**\n * If `true`, input elements will receive `checked` attribute instead of `isChecked`.\n *\n * This assumes, you're using native radio inputs.\n *\n * @default false\n */\n isNative?: boolean\n}\n\nexport const useCheckboxGroup = <Y extends string | number = string>({\n isNative,\n ...props\n}: UseCheckboxGroupProps<Y>) => {\n props.onChange = useCallbackRef(props.onChange)\n\n const [value, setValue] = useControllableState({\n value: props.value,\n defaultValue: props.defaultValue || [],\n onChange: props.onChange,\n })\n\n const onChange = useCallback(\n (evOrValue: ChangeEvent<HTMLInputElement> | Y) => {\n const isChecked = isEvent(evOrValue)\n ? evOrValue.target.checked\n : !value.includes(evOrValue)\n\n const selectedValue = (\n isEvent(evOrValue) ? evOrValue.target.value : evOrValue\n ) as Y\n\n const nextValue = isChecked\n ? [...value, selectedValue]\n : value.filter((v) => String(v) !== String(selectedValue))\n\n setValue(nextValue)\n },\n [value, setValue],\n )\n\n const getCheckboxProps: PropGetter<\n DOMAttributes<HTMLInputElement> & { isChecked?: boolean },\n Omit<DOMAttributes<HTMLInputElement>, \"onChange\"> & {\n onChange: (ev: ChangeEvent<HTMLInputElement> | Y) => void\n }\n > = useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref,\n [isNative ? \"checked\" : \"isChecked\"]: value.some(\n (val) => String(props.value) === String(val),\n ),\n onChange,\n }),\n [onChange, isNative, value],\n )\n\n return { value, setValue, onChange, getCheckboxProps }\n}\n\nexport type UseCheckboxGroupReturn<Y extends string | number = string> =\n ReturnType<typeof useCheckboxGroup<Y>>\n\nexport type CheckboxGroupProps<Y extends string | number = string> =\n ThemeProps<\"Checkbox\"> &\n Omit<FlexProps, \"onChange\"> &\n UseCheckboxGroupProps<Y> &\n FormControlOptions & {\n /**\n * If provided, generate checkboxes based on items.\n *\n * @default '[]'\n */\n items?: CheckboxItem<Y>[]\n }\n\ntype CheckboxContext = ThemeProps<\"Checkbox\"> &\n FormControlOptions & {\n value: (string | number)[]\n onChange: (\n evOrValue: ChangeEvent<HTMLInputElement> | string | number,\n ) => void\n }\n\nconst [CheckboxGroupProvider, useCheckboxGroupContext] = createContext<\n CheckboxContext | undefined\n>({\n strict: false,\n name: \"CheckboxGroupContext\",\n})\n\nexport { useCheckboxGroupContext }\n\nexport const CheckboxGroup = forwardRef(\n <Y extends string | number = string>(\n {\n className,\n size,\n variant,\n colorScheme,\n children,\n items = [],\n direction = \"column\",\n gap,\n ...props\n }: CheckboxGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const { value, onChange } = useCheckboxGroup<Y>(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid } =\n useFormControl(props)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length) {\n computedChildren = items.map(({ label, value, ...props }, i) => (\n <Checkbox key={i} value={value} {...props}>\n {label}\n </Checkbox>\n ))\n }\n\n return (\n <CheckboxGroupProvider\n value={\n {\n size,\n variant,\n colorScheme,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n value,\n onChange,\n } as CheckboxContext\n }\n >\n <Flex\n ref={ref}\n className={cx(\"ui-checkbox-group\", className)}\n role=\"group\"\n direction={direction}\n gap={gap ?? (direction === \"row\" ? \"1rem\" : undefined)}\n {...omitObject(props, [\n \"value\",\n \"defaultValue\",\n \"onChange\",\n \"isInvalid\",\n \"isDisabled\",\n \"isRequired\",\n \"isReadOnly\",\n ])}\n >\n {children ?? computedChildren}\n </Flex>\n </CheckboxGroupProvider>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: CheckboxGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nCheckboxGroup.displayName = \"CheckboxGroup\"\n","import type { HTMLUIProps, ThemeProps, ComponentArgs } from \"@yamada-ui/core\"\nimport { ui, useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n useFormControl,\n useFormControlProps,\n formControlProperties,\n} from \"@yamada-ui/form-control\"\nimport type { SVGMotionProps } from \"@yamada-ui/motion\"\nimport { AnimatePresence, motion } from \"@yamada-ui/motion\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport type { PropGetter } from \"@yamada-ui/utils\"\nimport {\n cx,\n omitObject,\n pickObject,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n handlerAll,\n dataAttr,\n mergeRefs,\n funcAll,\n} from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n ChangeEventHandler,\n CSSProperties,\n FC,\n FocusEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n ReactElement,\n SyntheticEvent,\n ForwardedRef,\n Ref,\n} from \"react\"\nimport {\n cloneElement,\n useCallback,\n useEffect,\n useRef,\n useState,\n forwardRef,\n} from \"react\"\nimport { useCheckboxGroupContext } from \"./checkbox-group\"\n\nexport type UseCheckboxProps<Y extends string | number = string> =\n 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 * The value to be used in the checkbox input.\n */\n value?: Y\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 * 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 * The callback invoked when the checkbox is blurred.\n */\n onBlur?: FocusEventHandler<HTMLInputElement>\n /**\n * The tab-index property of the underlying input element.\n */\n tabIndex?: number\n }\n\nexport const useCheckbox = <Y extends string | number = string>(\n props: UseCheckboxProps<Y>,\n) => {\n const {\n id,\n name,\n value,\n defaultIsChecked,\n tabIndex,\n required,\n disabled,\n readOnly,\n isIndeterminate,\n ...rest\n } = useFormControlProps(props)\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 = props.isChecked !== undefined\n const checked = isControlled ? (props.isChecked 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 rest.onChange?.(ev)\n },\n [readOnly, disabled, isControlled, checked, isIndeterminate],\n )\n const onBlur = useCallbackRef(rest.onBlur)\n const onFocus = useCallbackRef(rest.onFocus)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\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 = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref: mergeRefs(ref, (el: HTMLElement | undefined) => {\n if (el) setIsLabel(el.tagName === \"LABEL\")\n }),\n \"data-checked\": dataAttr(checked),\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, rest],\n )\n\n const getIconProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n \"data-active\": dataAttr(isActive),\n \"data-hover\": dataAttr(isHovered),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n \"data-indeterminate\": dataAttr(isIndeterminate),\n \"aria-hidden\": true,\n onMouseDown: handlerAll(props.onMouseDown, (ev: React.MouseEvent) => {\n if (isFocused) ev.preventDefault()\n\n setActive(true)\n }),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n }),\n [\n isActive,\n checked,\n isFocused,\n isHovered,\n isFocusVisible,\n isIndeterminate,\n rest,\n ],\n )\n\n const getInputProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref: mergeRefs(inputRef, ref),\n id,\n type: \"checkbox\",\n name,\n value,\n tabIndex,\n required,\n disabled,\n readOnly,\n checked,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n width: \"1px\",\n margin: \"-1px\",\n padding: \"0px\",\n overflow: \"hidden\",\n whiteSpace: \"nowrap\",\n position: \"absolute\",\n },\n onChange: handlerAll(props.onChange, onChange),\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onFocus: handlerAll(props.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props.onKeyUp, onKeyUp),\n }),\n [\n rest,\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 ...pickObject(rest, formControlProperties),\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, rest],\n )\n\n return {\n isFocusVisible,\n isFocused,\n isHovered,\n isActive,\n isChecked: checked,\n isIndeterminate,\n getContainerProps,\n getIconProps,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseCheckboxReturn = ReturnType<typeof useCheckbox>\n\ntype CheckboxOptions = {\n /**\n * Props for icon component.\n */\n iconProps?: Omit<HTMLUIProps<\"span\">, \"children\"> & { children: ReactElement }\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 type CheckboxProps<Y extends string | number = string> = Omit<\n HTMLUIProps<\"label\">,\n keyof UseCheckboxProps | \"checked\"\n> &\n ThemeProps<\"Checkbox\"> &\n UseCheckboxProps<Y> &\n CheckboxOptions\n\nexport const Checkbox = forwardRef(\n <Y extends string | number = string>(\n props: CheckboxProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useCheckboxGroupContext()\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Checkbox\", {\n ...(group ? omitObject(group, [\"value\"]) : {}),\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = group?.isRequired ?? control.isRequired,\n isReadOnly = group?.isReadOnly ?? control.isReadOnly,\n isDisabled = group?.isDisabled ?? control.isDisabled,\n isInvalid = group?.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const {\n isChecked,\n isIndeterminate,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n } = useCheckbox({\n ...rest,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked:\n group?.value && rest.value\n ? group.value.includes(rest.value)\n : rest.isChecked,\n onChange:\n group?.onChange && rest.value\n ? funcAll(group.onChange, rest.onChange)\n : rest.onChange,\n })\n\n const cloneIcon = cloneElement(iconProps?.children ?? <CheckboxIcon />, {\n __css: {\n opacity: isChecked || isIndeterminate ? 1 : 0,\n transform: isChecked || isIndeterminate ? \"scale(1)\" : \"scale(0.95)\",\n transitionProperty: \"transform\",\n transitionDuration: \"normal\",\n },\n isIndeterminate,\n isChecked,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n })\n\n return (\n <ui.label\n className={cx(\"ui-checkbox\", className)}\n {...getContainerProps()}\n __css={{\n cursor: \"pointer\",\n position: \"relative\",\n display: \"inline-flex\",\n alignItems: \"center\",\n verticalAlign: \"top\",\n gap,\n ...styles.container,\n }}\n {...omitObject(rest, [\n \"id\",\n \"name\",\n \"value\",\n \"defaultValue\",\n \"defaultIsChecked\",\n \"isChecked\",\n \"isIndeterminate\",\n \"onChange\",\n \"onBlur\",\n \"onFocus\",\n \"tabIndex\",\n ])}\n >\n <ui.input\n className=\"ui-checkbox__input\"\n {...getInputProps(inputProps, ref)}\n />\n\n <ui.span\n className=\"ui-checkbox__icon\"\n __css={{\n pointerEvents: isReadOnly ? \"none\" : undefined,\n position: \"relative\",\n display: \"inline-block\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n {...getIconProps(\n omitObject(iconProps ?? { children: undefined }, [\"children\"]),\n )}\n >\n {cloneIcon}\n </ui.span>\n\n <ui.span\n className=\"ui-checkbox__label\"\n __css={{ ...styles.label }}\n {...getLabelProps(labelProps)}\n >\n {children}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: CheckboxProps<Y> & { ref?: Ref<HTMLInputElement> },\n ): JSX.Element\n} & ComponentArgs\n\nCheckbox.displayName = \"Checkbox\"\n\nexport type CheckboxIconProps = HTMLUIProps<\"svg\"> &\n SVGMotionProps<SVGSVGElement> &\n FormControlOptions & {\n /**\n * If `true`, the icon will be indeterminate.\n *\n * @default false\n */\n isIndeterminate?: boolean\n /**\n * If `true`, the icon will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n }\n\nexport const CheckboxIcon: FC<CheckboxIconProps> = ({\n isIndeterminate,\n isChecked,\n ...rest\n}) => {\n const iconProps = omitObject(rest, [\n \"isRequired\",\n \"isReadOnly\",\n \"isDisabled\",\n \"isInvalid\",\n ])\n\n return (\n <AnimatePresence initial={false}>\n {isIndeterminate || isChecked ? (\n <ui.div\n __css={{\n position: \"absolute\",\n top: \"50%\",\n left: \"50%\",\n transform: \"translate(-50%, -50%)\",\n }}\n >\n <ui.div\n as={motion.div}\n variants={{\n unchecked: { scale: 0.5 },\n checked: { scale: 1 },\n }}\n initial=\"unchecked\"\n animate=\"checked\"\n exit=\"unchecked\"\n style={\n {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n } as CSSProperties\n }\n >\n {isIndeterminate ? (\n <IndeterminateIcon {...iconProps} />\n ) : (\n <CheckIcon {...iconProps} />\n )}\n </ui.div>\n </ui.div>\n ) : null}\n </AnimatePresence>\n )\n}\n\nconst CheckIcon: FC<HTMLUIProps<\"svg\"> & SVGMotionProps<SVGSVGElement>> = (\n props,\n) => {\n return (\n <ui.svg\n as={motion.svg}\n width=\"1.2em\"\n viewBox=\"0 0 12 10\"\n variants={{\n unchecked: {\n opacity: 0,\n strokeDashoffset: 16,\n },\n checked: {\n opacity: 1,\n strokeDashoffset: 0,\n transition: { duration: 0.2 },\n },\n }}\n style={{\n fill: \"none\",\n strokeWidth: 2,\n stroke: \"currentColor\",\n strokeDasharray: 16,\n }}\n {...props}\n >\n <polyline points=\"1.5 6 4.5 9 10.5 1\" />\n </ui.svg>\n )\n}\n\nconst IndeterminateIcon: FC<\n HTMLUIProps<\"svg\"> & SVGMotionProps<SVGSVGElement>\n> = (props) => {\n return (\n <ui.svg\n as={motion.svg}\n width=\"1.2em\"\n viewBox=\"0 0 24 24\"\n variants={{\n unchecked: {\n scaleX: 0.65,\n opacity: 0,\n },\n checked: {\n scaleX: 1,\n opacity: 1,\n transition: {\n scaleX: { duration: 0 },\n opacity: { duration: 0.02 },\n },\n },\n }}\n style={{ stroke: \"currentColor\", strokeWidth: 4 }}\n {...props}\n >\n <line x1=\"21\" x2=\"3\" y1=\"12\" y2=\"12\" />\n </ui.svg>\n )\n}\n"],"mappings":"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","names":["import_form_control","import_utils","import_react","props","_a","import_jsx_runtime","props","value","props"]}
|
|
1
|
+
{"version":3,"sources":["../src/checkbox-group.tsx","../src/checkbox.tsx"],"sourcesContent":["import type { ComponentArgs, ThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport type { FlexProps } from \"@yamada-ui/layouts\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport type { PropGetter, DOMAttributes } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n omitObject,\n useCallbackRef,\n getValidChildren,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent, ForwardedRef, ReactElement, Ref } from \"react\"\nimport { forwardRef, useCallback } from \"react\"\nimport type { CheckboxProps } from \"./checkbox\"\nimport { Checkbox } from \"./checkbox\"\n\nexport type CheckboxItem<Y extends string | number = string> =\n CheckboxProps<Y> & {\n label?: string\n }\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport type UseCheckboxGroupProps<Y extends string | number = string> = {\n /**\n * The value of the checkbox group.\n */\n value?: Y[]\n /**\n * The initial value of the checkbox group.\n */\n defaultValue?: Y[]\n /**\n * The callback fired when any children checkbox is checked or unchecked.\n */\n onChange?: (value: Y[]) => void\n /**\n * If `true`, input elements will receive `checked` attribute instead of `isChecked`.\n *\n * This assumes, you're using native radio inputs.\n *\n * @default false\n */\n isNative?: boolean\n}\n\nexport const useCheckboxGroup = <Y extends string | number = string>({\n isNative,\n ...props\n}: UseCheckboxGroupProps<Y>) => {\n props.onChange = useCallbackRef(props.onChange)\n\n const [value, setValue] = useControllableState({\n value: props.value,\n defaultValue: props.defaultValue || [],\n onChange: props.onChange,\n })\n\n const onChange = useCallback(\n (evOrValue: ChangeEvent<HTMLInputElement> | Y) => {\n const isChecked = isEvent(evOrValue)\n ? evOrValue.target.checked\n : !value.includes(evOrValue)\n\n const selectedValue = (\n isEvent(evOrValue) ? evOrValue.target.value : evOrValue\n ) as Y\n\n const nextValue = isChecked\n ? [...value, selectedValue]\n : value.filter((v) => String(v) !== String(selectedValue))\n\n setValue(nextValue)\n },\n [value, setValue],\n )\n\n const getCheckboxProps: PropGetter<\n DOMAttributes<HTMLInputElement> & { isChecked?: boolean },\n Omit<DOMAttributes<HTMLInputElement>, \"onChange\"> & {\n onChange: (ev: ChangeEvent<HTMLInputElement> | Y) => void\n }\n > = useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref,\n [isNative ? \"checked\" : \"isChecked\"]: value.some(\n (val) => String(props.value) === String(val),\n ),\n onChange,\n }),\n [onChange, isNative, value],\n )\n\n return { value, setValue, onChange, getCheckboxProps }\n}\n\nexport type UseCheckboxGroupReturn<Y extends string | number = string> =\n ReturnType<typeof useCheckboxGroup<Y>>\n\nexport type CheckboxGroupProps<Y extends string | number = string> =\n ThemeProps<\"Checkbox\"> &\n Omit<FlexProps, \"onChange\"> &\n UseCheckboxGroupProps<Y> &\n FormControlOptions & {\n /**\n * If provided, generate checkboxes based on items.\n *\n * @default '[]'\n */\n items?: CheckboxItem<Y>[]\n }\n\ntype CheckboxContext = ThemeProps<\"Checkbox\"> &\n FormControlOptions & {\n value: (string | number)[]\n onChange: (\n evOrValue: ChangeEvent<HTMLInputElement> | string | number,\n ) => void\n }\n\nconst [CheckboxGroupProvider, useCheckboxGroupContext] = createContext<\n CheckboxContext | undefined\n>({\n strict: false,\n name: \"CheckboxGroupContext\",\n})\n\nexport { useCheckboxGroupContext }\n\nexport const CheckboxGroup = forwardRef(\n <Y extends string | number = string>(\n {\n className,\n size,\n variant,\n colorScheme,\n children,\n items = [],\n direction = \"column\",\n gap,\n ...props\n }: CheckboxGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const { value, onChange } = useCheckboxGroup<Y>(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid } =\n useFormControl(props)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length) {\n computedChildren = items.map(({ label, value, ...props }, i) => (\n <Checkbox key={i} value={value} {...props}>\n {label}\n </Checkbox>\n ))\n }\n\n return (\n <CheckboxGroupProvider\n value={\n {\n size,\n variant,\n colorScheme,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n value,\n onChange,\n } as CheckboxContext\n }\n >\n <Flex\n ref={ref}\n className={cx(\"ui-checkbox-group\", className)}\n role=\"group\"\n direction={direction}\n gap={gap ?? (direction === \"row\" ? \"1rem\" : undefined)}\n {...omitObject(props, [\n \"value\",\n \"defaultValue\",\n \"onChange\",\n \"isInvalid\",\n \"isDisabled\",\n \"isRequired\",\n \"isReadOnly\",\n ])}\n >\n {children ?? computedChildren}\n </Flex>\n </CheckboxGroupProvider>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: CheckboxGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nCheckboxGroup.displayName = \"CheckboxGroup\"\n","import type { HTMLUIProps, ThemeProps, ComponentArgs } from \"@yamada-ui/core\"\nimport { ui, useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n useFormControl,\n useFormControlProps,\n formControlProperties,\n} from \"@yamada-ui/form-control\"\nimport type { SVGMotionProps } from \"@yamada-ui/motion\"\nimport { AnimatePresence, motion } from \"@yamada-ui/motion\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport type { PropGetter } from \"@yamada-ui/utils\"\nimport {\n cx,\n omitObject,\n pickObject,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n handlerAll,\n dataAttr,\n mergeRefs,\n funcAll,\n} from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n ChangeEventHandler,\n CSSProperties,\n FC,\n FocusEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n ReactElement,\n SyntheticEvent,\n ForwardedRef,\n Ref,\n} from \"react\"\nimport {\n cloneElement,\n useCallback,\n useEffect,\n useRef,\n useState,\n forwardRef,\n} from \"react\"\nimport { useCheckboxGroupContext } from \"./checkbox-group\"\n\nexport type UseCheckboxProps<Y extends string | number = string> =\n 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 * The value to be used in the checkbox input.\n */\n value?: Y\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 * 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 * The callback invoked when the checkbox is blurred.\n */\n onBlur?: FocusEventHandler<HTMLInputElement>\n /**\n * The tab-index property of the underlying input element.\n */\n tabIndex?: number\n }\n\nexport const useCheckbox = <Y extends string | number = string>(\n props: UseCheckboxProps<Y>,\n) => {\n const {\n id,\n name,\n value,\n defaultIsChecked,\n tabIndex,\n required,\n disabled,\n readOnly,\n isIndeterminate,\n ...rest\n } = useFormControlProps(props)\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 = props.isChecked !== undefined\n const checked = isControlled ? (props.isChecked 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 rest.onChange?.(ev)\n },\n [readOnly, disabled, isControlled, checked, isIndeterminate],\n )\n const onBlur = useCallbackRef(rest.onBlur)\n const onFocus = useCallbackRef(rest.onFocus)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\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 = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref: mergeRefs(ref, (el: HTMLElement | undefined) => {\n if (el) setIsLabel(el.tagName === \"LABEL\")\n }),\n \"data-checked\": dataAttr(checked),\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, rest],\n )\n\n const getIconProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n \"data-active\": dataAttr(isActive),\n \"data-hover\": dataAttr(isHovered),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n \"data-indeterminate\": dataAttr(isIndeterminate),\n \"aria-hidden\": true,\n onMouseDown: handlerAll(props.onMouseDown, (ev: React.MouseEvent) => {\n if (isFocused) ev.preventDefault()\n\n setActive(true)\n }),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n }),\n [\n isActive,\n checked,\n isFocused,\n isHovered,\n isFocusVisible,\n isIndeterminate,\n rest,\n ],\n )\n\n const getInputProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref: mergeRefs(inputRef, ref),\n id,\n type: \"checkbox\",\n name,\n value,\n tabIndex,\n required,\n disabled,\n readOnly,\n checked,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n width: \"1px\",\n margin: \"-1px\",\n padding: \"0px\",\n overflow: \"hidden\",\n whiteSpace: \"nowrap\",\n position: \"absolute\",\n },\n onChange: handlerAll(props.onChange, onChange),\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onFocus: handlerAll(props.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props.onKeyUp, onKeyUp),\n }),\n [\n rest,\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 ...pickObject(rest, formControlProperties),\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, rest],\n )\n\n return {\n isFocusVisible,\n isFocused,\n isHovered,\n isActive,\n isChecked: checked,\n isIndeterminate,\n getContainerProps,\n getIconProps,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseCheckboxReturn = ReturnType<typeof useCheckbox>\n\ntype CheckboxOptions = {\n /**\n * Props for icon component.\n */\n iconProps?: Omit<HTMLUIProps<\"span\">, \"children\"> & { children: ReactElement }\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 type CheckboxProps<Y extends string | number = string> = Omit<\n HTMLUIProps<\"label\">,\n keyof UseCheckboxProps | \"checked\"\n> &\n ThemeProps<\"Checkbox\"> &\n UseCheckboxProps<Y> &\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 string | number = string>(\n props: CheckboxProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useCheckboxGroupContext()\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Checkbox\", {\n ...(group ? omitObject(group, [\"value\"]) : {}),\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = group?.isRequired ?? control.isRequired,\n isReadOnly = group?.isReadOnly ?? control.isReadOnly,\n isDisabled = group?.isDisabled ?? control.isDisabled,\n isInvalid = group?.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const {\n isChecked,\n isIndeterminate,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n } = useCheckbox({\n ...rest,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked:\n group?.value && rest.value\n ? group.value.includes(rest.value)\n : rest.isChecked,\n onChange:\n group?.onChange && rest.value\n ? funcAll(group.onChange, rest.onChange)\n : rest.onChange,\n })\n\n const cloneIcon = cloneElement(iconProps?.children ?? <CheckboxIcon />, {\n __css: {\n opacity: isChecked || isIndeterminate ? 1 : 0,\n transform: isChecked || isIndeterminate ? \"scale(1)\" : \"scale(0.95)\",\n transitionProperty: \"transform\",\n transitionDuration: \"normal\",\n },\n isIndeterminate,\n isChecked,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n })\n\n return (\n <ui.label\n className={cx(\"ui-checkbox\", className)}\n {...getContainerProps()}\n __css={{\n cursor: \"pointer\",\n position: \"relative\",\n display: \"inline-flex\",\n alignItems: \"center\",\n verticalAlign: \"top\",\n gap,\n ...styles.container,\n }}\n {...omitObject(rest, [\n \"id\",\n \"name\",\n \"value\",\n \"defaultValue\",\n \"defaultIsChecked\",\n \"isChecked\",\n \"isIndeterminate\",\n \"onChange\",\n \"onBlur\",\n \"onFocus\",\n \"tabIndex\",\n ])}\n >\n <ui.input\n className=\"ui-checkbox__input\"\n {...getInputProps(inputProps, ref)}\n />\n\n <ui.span\n className=\"ui-checkbox__icon\"\n __css={{\n pointerEvents: isReadOnly ? \"none\" : undefined,\n position: \"relative\",\n display: \"inline-block\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n {...getIconProps(\n omitObject(iconProps ?? { children: undefined }, [\"children\"]),\n )}\n >\n {cloneIcon}\n </ui.span>\n\n <ui.span\n className=\"ui-checkbox__label\"\n __css={{ ...styles.label }}\n {...getLabelProps(labelProps)}\n >\n {children}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: CheckboxProps<Y> & { ref?: Ref<HTMLInputElement> },\n ): JSX.Element\n} & ComponentArgs\n\nCheckbox.displayName = \"Checkbox\"\n\nexport type CheckboxIconProps = HTMLUIProps<\"svg\"> &\n SVGMotionProps<SVGSVGElement> &\n FormControlOptions & {\n /**\n * If `true`, the icon will be indeterminate.\n *\n * @default false\n */\n isIndeterminate?: boolean\n /**\n * If `true`, the icon will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n }\n\nexport const CheckboxIcon: FC<CheckboxIconProps> = ({\n isIndeterminate,\n isChecked,\n ...rest\n}) => {\n const iconProps = omitObject(rest, [\n \"isRequired\",\n \"isReadOnly\",\n \"isDisabled\",\n \"isInvalid\",\n ])\n\n return (\n <AnimatePresence initial={false}>\n {isIndeterminate || isChecked ? (\n <ui.div\n __css={{\n position: \"absolute\",\n top: \"50%\",\n left: \"50%\",\n transform: \"translate(-50%, -50%)\",\n }}\n >\n <ui.div\n as={motion.div}\n variants={{\n unchecked: { scale: 0.5 },\n checked: { scale: 1 },\n }}\n initial=\"unchecked\"\n animate=\"checked\"\n exit=\"unchecked\"\n style={\n {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n } as CSSProperties\n }\n >\n {isIndeterminate ? (\n <IndeterminateIcon {...iconProps} />\n ) : (\n <CheckIcon {...iconProps} />\n )}\n </ui.div>\n </ui.div>\n ) : null}\n </AnimatePresence>\n )\n}\n\nconst CheckIcon: FC<HTMLUIProps<\"svg\"> & SVGMotionProps<SVGSVGElement>> = (\n props,\n) => {\n return (\n <ui.svg\n as={motion.svg}\n width=\"1.2em\"\n viewBox=\"0 0 12 10\"\n variants={{\n unchecked: {\n opacity: 0,\n strokeDashoffset: 16,\n },\n checked: {\n opacity: 1,\n strokeDashoffset: 0,\n transition: { duration: 0.2 },\n },\n }}\n style={{\n fill: \"none\",\n strokeWidth: 2,\n stroke: \"currentColor\",\n strokeDasharray: 16,\n }}\n {...props}\n >\n <polyline points=\"1.5 6 4.5 9 10.5 1\" />\n </ui.svg>\n )\n}\n\nconst IndeterminateIcon: FC<\n HTMLUIProps<\"svg\"> & SVGMotionProps<SVGSVGElement>\n> = (props) => {\n return (\n <ui.svg\n as={motion.svg}\n width=\"1.2em\"\n viewBox=\"0 0 24 24\"\n variants={{\n unchecked: {\n scaleX: 0.65,\n opacity: 0,\n },\n checked: {\n scaleX: 1,\n opacity: 1,\n transition: {\n scaleX: { duration: 0 },\n opacity: { duration: 0.02 },\n },\n },\n }}\n style={{ stroke: \"currentColor\", strokeWidth: 4 }}\n {...props}\n >\n <line x1=\"21\" x2=\"3\" y1=\"12\" y2=\"12\" />\n </ui.svg>\n )\n}\n"],"mappings":"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","names":["import_form_control","import_utils","import_react","props","_a","import_jsx_runtime","props","value","props"]}
|
package/dist/checkbox-group.mjs
CHANGED
package/dist/checkbox.d.mts
CHANGED
|
@@ -82,6 +82,11 @@ type CheckboxOptions = {
|
|
|
82
82
|
labelProps?: HTMLUIProps<"span">;
|
|
83
83
|
};
|
|
84
84
|
type CheckboxProps<Y extends string | number = string> = Omit<HTMLUIProps<"label">, keyof UseCheckboxProps | "checked"> & ThemeProps<"Checkbox"> & UseCheckboxProps<Y> & CheckboxOptions;
|
|
85
|
+
/**
|
|
86
|
+
* `Checkbox` is a component used for allowing users to select multiple values from multiple options.
|
|
87
|
+
*
|
|
88
|
+
* @see Docs https://yamada-ui.com/components/forms/checkbox
|
|
89
|
+
*/
|
|
85
90
|
declare const Checkbox: (<Y extends string | number = string>(props: Omit<HTMLUIProps<"label">, "id" | "tabIndex" | "onFocus" | "onBlur" | "onChange" | keyof FormControlOptions | "name" | "value" | "defaultIsChecked" | "isChecked" | "isIndeterminate" | "checked"> & ThemeProps<"Checkbox"> & FormControlOptions & {
|
|
86
91
|
/**
|
|
87
92
|
* id assigned to input.
|
package/dist/checkbox.d.ts
CHANGED
|
@@ -82,6 +82,11 @@ type CheckboxOptions = {
|
|
|
82
82
|
labelProps?: HTMLUIProps<"span">;
|
|
83
83
|
};
|
|
84
84
|
type CheckboxProps<Y extends string | number = string> = Omit<HTMLUIProps<"label">, keyof UseCheckboxProps | "checked"> & ThemeProps<"Checkbox"> & UseCheckboxProps<Y> & CheckboxOptions;
|
|
85
|
+
/**
|
|
86
|
+
* `Checkbox` is a component used for allowing users to select multiple values from multiple options.
|
|
87
|
+
*
|
|
88
|
+
* @see Docs https://yamada-ui.com/components/forms/checkbox
|
|
89
|
+
*/
|
|
85
90
|
declare const Checkbox: (<Y extends string | number = string>(props: Omit<HTMLUIProps<"label">, "id" | "tabIndex" | "onFocus" | "onBlur" | "onChange" | keyof FormControlOptions | "name" | "value" | "defaultIsChecked" | "isChecked" | "isIndeterminate" | "checked"> & ThemeProps<"Checkbox"> & FormControlOptions & {
|
|
86
91
|
/**
|
|
87
92
|
* id assigned to input.
|
package/dist/checkbox.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/checkbox.tsx","../src/checkbox-group.tsx"],"sourcesContent":["import type { HTMLUIProps, ThemeProps, ComponentArgs } from \"@yamada-ui/core\"\nimport { ui, useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n useFormControl,\n useFormControlProps,\n formControlProperties,\n} from \"@yamada-ui/form-control\"\nimport type { SVGMotionProps } from \"@yamada-ui/motion\"\nimport { AnimatePresence, motion } from \"@yamada-ui/motion\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport type { PropGetter } from \"@yamada-ui/utils\"\nimport {\n cx,\n omitObject,\n pickObject,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n handlerAll,\n dataAttr,\n mergeRefs,\n funcAll,\n} from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n ChangeEventHandler,\n CSSProperties,\n FC,\n FocusEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n ReactElement,\n SyntheticEvent,\n ForwardedRef,\n Ref,\n} from \"react\"\nimport {\n cloneElement,\n useCallback,\n useEffect,\n useRef,\n useState,\n forwardRef,\n} from \"react\"\nimport { useCheckboxGroupContext } from \"./checkbox-group\"\n\nexport type UseCheckboxProps<Y extends string | number = string> =\n 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 * The value to be used in the checkbox input.\n */\n value?: Y\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 * 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 * The callback invoked when the checkbox is blurred.\n */\n onBlur?: FocusEventHandler<HTMLInputElement>\n /**\n * The tab-index property of the underlying input element.\n */\n tabIndex?: number\n }\n\nexport const useCheckbox = <Y extends string | number = string>(\n props: UseCheckboxProps<Y>,\n) => {\n const {\n id,\n name,\n value,\n defaultIsChecked,\n tabIndex,\n required,\n disabled,\n readOnly,\n isIndeterminate,\n ...rest\n } = useFormControlProps(props)\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 = props.isChecked !== undefined\n const checked = isControlled ? (props.isChecked 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 rest.onChange?.(ev)\n },\n [readOnly, disabled, isControlled, checked, isIndeterminate],\n )\n const onBlur = useCallbackRef(rest.onBlur)\n const onFocus = useCallbackRef(rest.onFocus)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\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 = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref: mergeRefs(ref, (el: HTMLElement | undefined) => {\n if (el) setIsLabel(el.tagName === \"LABEL\")\n }),\n \"data-checked\": dataAttr(checked),\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, rest],\n )\n\n const getIconProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n \"data-active\": dataAttr(isActive),\n \"data-hover\": dataAttr(isHovered),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n \"data-indeterminate\": dataAttr(isIndeterminate),\n \"aria-hidden\": true,\n onMouseDown: handlerAll(props.onMouseDown, (ev: React.MouseEvent) => {\n if (isFocused) ev.preventDefault()\n\n setActive(true)\n }),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n }),\n [\n isActive,\n checked,\n isFocused,\n isHovered,\n isFocusVisible,\n isIndeterminate,\n rest,\n ],\n )\n\n const getInputProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref: mergeRefs(inputRef, ref),\n id,\n type: \"checkbox\",\n name,\n value,\n tabIndex,\n required,\n disabled,\n readOnly,\n checked,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n width: \"1px\",\n margin: \"-1px\",\n padding: \"0px\",\n overflow: \"hidden\",\n whiteSpace: \"nowrap\",\n position: \"absolute\",\n },\n onChange: handlerAll(props.onChange, onChange),\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onFocus: handlerAll(props.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props.onKeyUp, onKeyUp),\n }),\n [\n rest,\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 ...pickObject(rest, formControlProperties),\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, rest],\n )\n\n return {\n isFocusVisible,\n isFocused,\n isHovered,\n isActive,\n isChecked: checked,\n isIndeterminate,\n getContainerProps,\n getIconProps,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseCheckboxReturn = ReturnType<typeof useCheckbox>\n\ntype CheckboxOptions = {\n /**\n * Props for icon component.\n */\n iconProps?: Omit<HTMLUIProps<\"span\">, \"children\"> & { children: ReactElement }\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 type CheckboxProps<Y extends string | number = string> = Omit<\n HTMLUIProps<\"label\">,\n keyof UseCheckboxProps | \"checked\"\n> &\n ThemeProps<\"Checkbox\"> &\n UseCheckboxProps<Y> &\n CheckboxOptions\n\nexport const Checkbox = forwardRef(\n <Y extends string | number = string>(\n props: CheckboxProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useCheckboxGroupContext()\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Checkbox\", {\n ...(group ? omitObject(group, [\"value\"]) : {}),\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = group?.isRequired ?? control.isRequired,\n isReadOnly = group?.isReadOnly ?? control.isReadOnly,\n isDisabled = group?.isDisabled ?? control.isDisabled,\n isInvalid = group?.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const {\n isChecked,\n isIndeterminate,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n } = useCheckbox({\n ...rest,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked:\n group?.value && rest.value\n ? group.value.includes(rest.value)\n : rest.isChecked,\n onChange:\n group?.onChange && rest.value\n ? funcAll(group.onChange, rest.onChange)\n : rest.onChange,\n })\n\n const cloneIcon = cloneElement(iconProps?.children ?? <CheckboxIcon />, {\n __css: {\n opacity: isChecked || isIndeterminate ? 1 : 0,\n transform: isChecked || isIndeterminate ? \"scale(1)\" : \"scale(0.95)\",\n transitionProperty: \"transform\",\n transitionDuration: \"normal\",\n },\n isIndeterminate,\n isChecked,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n })\n\n return (\n <ui.label\n className={cx(\"ui-checkbox\", className)}\n {...getContainerProps()}\n __css={{\n cursor: \"pointer\",\n position: \"relative\",\n display: \"inline-flex\",\n alignItems: \"center\",\n verticalAlign: \"top\",\n gap,\n ...styles.container,\n }}\n {...omitObject(rest, [\n \"id\",\n \"name\",\n \"value\",\n \"defaultValue\",\n \"defaultIsChecked\",\n \"isChecked\",\n \"isIndeterminate\",\n \"onChange\",\n \"onBlur\",\n \"onFocus\",\n \"tabIndex\",\n ])}\n >\n <ui.input\n className=\"ui-checkbox__input\"\n {...getInputProps(inputProps, ref)}\n />\n\n <ui.span\n className=\"ui-checkbox__icon\"\n __css={{\n pointerEvents: isReadOnly ? \"none\" : undefined,\n position: \"relative\",\n display: \"inline-block\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n {...getIconProps(\n omitObject(iconProps ?? { children: undefined }, [\"children\"]),\n )}\n >\n {cloneIcon}\n </ui.span>\n\n <ui.span\n className=\"ui-checkbox__label\"\n __css={{ ...styles.label }}\n {...getLabelProps(labelProps)}\n >\n {children}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: CheckboxProps<Y> & { ref?: Ref<HTMLInputElement> },\n ): JSX.Element\n} & ComponentArgs\n\nCheckbox.displayName = \"Checkbox\"\n\nexport type CheckboxIconProps = HTMLUIProps<\"svg\"> &\n SVGMotionProps<SVGSVGElement> &\n FormControlOptions & {\n /**\n * If `true`, the icon will be indeterminate.\n *\n * @default false\n */\n isIndeterminate?: boolean\n /**\n * If `true`, the icon will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n }\n\nexport const CheckboxIcon: FC<CheckboxIconProps> = ({\n isIndeterminate,\n isChecked,\n ...rest\n}) => {\n const iconProps = omitObject(rest, [\n \"isRequired\",\n \"isReadOnly\",\n \"isDisabled\",\n \"isInvalid\",\n ])\n\n return (\n <AnimatePresence initial={false}>\n {isIndeterminate || isChecked ? (\n <ui.div\n __css={{\n position: \"absolute\",\n top: \"50%\",\n left: \"50%\",\n transform: \"translate(-50%, -50%)\",\n }}\n >\n <ui.div\n as={motion.div}\n variants={{\n unchecked: { scale: 0.5 },\n checked: { scale: 1 },\n }}\n initial=\"unchecked\"\n animate=\"checked\"\n exit=\"unchecked\"\n style={\n {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n } as CSSProperties\n }\n >\n {isIndeterminate ? (\n <IndeterminateIcon {...iconProps} />\n ) : (\n <CheckIcon {...iconProps} />\n )}\n </ui.div>\n </ui.div>\n ) : null}\n </AnimatePresence>\n )\n}\n\nconst CheckIcon: FC<HTMLUIProps<\"svg\"> & SVGMotionProps<SVGSVGElement>> = (\n props,\n) => {\n return (\n <ui.svg\n as={motion.svg}\n width=\"1.2em\"\n viewBox=\"0 0 12 10\"\n variants={{\n unchecked: {\n opacity: 0,\n strokeDashoffset: 16,\n },\n checked: {\n opacity: 1,\n strokeDashoffset: 0,\n transition: { duration: 0.2 },\n },\n }}\n style={{\n fill: \"none\",\n strokeWidth: 2,\n stroke: \"currentColor\",\n strokeDasharray: 16,\n }}\n {...props}\n >\n <polyline points=\"1.5 6 4.5 9 10.5 1\" />\n </ui.svg>\n )\n}\n\nconst IndeterminateIcon: FC<\n HTMLUIProps<\"svg\"> & SVGMotionProps<SVGSVGElement>\n> = (props) => {\n return (\n <ui.svg\n as={motion.svg}\n width=\"1.2em\"\n viewBox=\"0 0 24 24\"\n variants={{\n unchecked: {\n scaleX: 0.65,\n opacity: 0,\n },\n checked: {\n scaleX: 1,\n opacity: 1,\n transition: {\n scaleX: { duration: 0 },\n opacity: { duration: 0.02 },\n },\n },\n }}\n style={{ stroke: \"currentColor\", strokeWidth: 4 }}\n {...props}\n >\n <line x1=\"21\" x2=\"3\" y1=\"12\" y2=\"12\" />\n </ui.svg>\n )\n}\n","import type { ComponentArgs, ThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport type { FlexProps } from \"@yamada-ui/layouts\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport type { PropGetter, DOMAttributes } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n omitObject,\n useCallbackRef,\n getValidChildren,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent, ForwardedRef, ReactElement, Ref } from \"react\"\nimport { forwardRef, useCallback } from \"react\"\nimport type { CheckboxProps } from \"./checkbox\"\nimport { Checkbox } from \"./checkbox\"\n\nexport type CheckboxItem<Y extends string | number = string> =\n CheckboxProps<Y> & {\n label?: string\n }\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport type UseCheckboxGroupProps<Y extends string | number = string> = {\n /**\n * The value of the checkbox group.\n */\n value?: Y[]\n /**\n * The initial value of the checkbox group.\n */\n defaultValue?: Y[]\n /**\n * The callback fired when any children checkbox is checked or unchecked.\n */\n onChange?: (value: Y[]) => void\n /**\n * If `true`, input elements will receive `checked` attribute instead of `isChecked`.\n *\n * This assumes, you're using native radio inputs.\n *\n * @default false\n */\n isNative?: boolean\n}\n\nexport const useCheckboxGroup = <Y extends string | number = string>({\n isNative,\n ...props\n}: UseCheckboxGroupProps<Y>) => {\n props.onChange = useCallbackRef(props.onChange)\n\n const [value, setValue] = useControllableState({\n value: props.value,\n defaultValue: props.defaultValue || [],\n onChange: props.onChange,\n })\n\n const onChange = useCallback(\n (evOrValue: ChangeEvent<HTMLInputElement> | Y) => {\n const isChecked = isEvent(evOrValue)\n ? evOrValue.target.checked\n : !value.includes(evOrValue)\n\n const selectedValue = (\n isEvent(evOrValue) ? evOrValue.target.value : evOrValue\n ) as Y\n\n const nextValue = isChecked\n ? [...value, selectedValue]\n : value.filter((v) => String(v) !== String(selectedValue))\n\n setValue(nextValue)\n },\n [value, setValue],\n )\n\n const getCheckboxProps: PropGetter<\n DOMAttributes<HTMLInputElement> & { isChecked?: boolean },\n Omit<DOMAttributes<HTMLInputElement>, \"onChange\"> & {\n onChange: (ev: ChangeEvent<HTMLInputElement> | Y) => void\n }\n > = useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref,\n [isNative ? \"checked\" : \"isChecked\"]: value.some(\n (val) => String(props.value) === String(val),\n ),\n onChange,\n }),\n [onChange, isNative, value],\n )\n\n return { value, setValue, onChange, getCheckboxProps }\n}\n\nexport type UseCheckboxGroupReturn<Y extends string | number = string> =\n ReturnType<typeof useCheckboxGroup<Y>>\n\nexport type CheckboxGroupProps<Y extends string | number = string> =\n ThemeProps<\"Checkbox\"> &\n Omit<FlexProps, \"onChange\"> &\n UseCheckboxGroupProps<Y> &\n FormControlOptions & {\n /**\n * If provided, generate checkboxes based on items.\n *\n * @default '[]'\n */\n items?: CheckboxItem<Y>[]\n }\n\ntype CheckboxContext = ThemeProps<\"Checkbox\"> &\n FormControlOptions & {\n value: (string | number)[]\n onChange: (\n evOrValue: ChangeEvent<HTMLInputElement> | string | number,\n ) => void\n }\n\nconst [CheckboxGroupProvider, useCheckboxGroupContext] = createContext<\n CheckboxContext | undefined\n>({\n strict: false,\n name: \"CheckboxGroupContext\",\n})\n\nexport { useCheckboxGroupContext }\n\nexport const CheckboxGroup = forwardRef(\n <Y extends string | number = string>(\n {\n className,\n size,\n variant,\n colorScheme,\n children,\n items = [],\n direction = \"column\",\n gap,\n ...props\n }: CheckboxGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const { value, onChange } = useCheckboxGroup<Y>(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid } =\n useFormControl(props)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length) {\n computedChildren = items.map(({ label, value, ...props }, i) => (\n <Checkbox key={i} value={value} {...props}>\n {label}\n </Checkbox>\n ))\n }\n\n return (\n <CheckboxGroupProvider\n value={\n {\n size,\n variant,\n colorScheme,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n value,\n onChange,\n } as CheckboxContext\n }\n >\n <Flex\n ref={ref}\n className={cx(\"ui-checkbox-group\", className)}\n role=\"group\"\n direction={direction}\n gap={gap ?? (direction === \"row\" ? \"1rem\" : undefined)}\n {...omitObject(props, [\n \"value\",\n \"defaultValue\",\n \"onChange\",\n \"isInvalid\",\n \"isDisabled\",\n \"isRequired\",\n \"isReadOnly\",\n ])}\n >\n {children ?? computedChildren}\n </Flex>\n </CheckboxGroupProvider>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: CheckboxGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nCheckboxGroup.displayName = \"CheckboxGroup\"\n"],"mappings":"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","names":["import_form_control","import_utils","import_react","props","value","props","import_jsx_runtime","props","_a"]}
|
|
1
|
+
{"version":3,"sources":["../src/checkbox.tsx","../src/checkbox-group.tsx"],"sourcesContent":["import type { HTMLUIProps, ThemeProps, ComponentArgs } from \"@yamada-ui/core\"\nimport { ui, useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n useFormControl,\n useFormControlProps,\n formControlProperties,\n} from \"@yamada-ui/form-control\"\nimport type { SVGMotionProps } from \"@yamada-ui/motion\"\nimport { AnimatePresence, motion } from \"@yamada-ui/motion\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport type { PropGetter } from \"@yamada-ui/utils\"\nimport {\n cx,\n omitObject,\n pickObject,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n handlerAll,\n dataAttr,\n mergeRefs,\n funcAll,\n} from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n ChangeEventHandler,\n CSSProperties,\n FC,\n FocusEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n ReactElement,\n SyntheticEvent,\n ForwardedRef,\n Ref,\n} from \"react\"\nimport {\n cloneElement,\n useCallback,\n useEffect,\n useRef,\n useState,\n forwardRef,\n} from \"react\"\nimport { useCheckboxGroupContext } from \"./checkbox-group\"\n\nexport type UseCheckboxProps<Y extends string | number = string> =\n 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 * The value to be used in the checkbox input.\n */\n value?: Y\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 * 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 * The callback invoked when the checkbox is blurred.\n */\n onBlur?: FocusEventHandler<HTMLInputElement>\n /**\n * The tab-index property of the underlying input element.\n */\n tabIndex?: number\n }\n\nexport const useCheckbox = <Y extends string | number = string>(\n props: UseCheckboxProps<Y>,\n) => {\n const {\n id,\n name,\n value,\n defaultIsChecked,\n tabIndex,\n required,\n disabled,\n readOnly,\n isIndeterminate,\n ...rest\n } = useFormControlProps(props)\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 = props.isChecked !== undefined\n const checked = isControlled ? (props.isChecked 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 rest.onChange?.(ev)\n },\n [readOnly, disabled, isControlled, checked, isIndeterminate],\n )\n const onBlur = useCallbackRef(rest.onBlur)\n const onFocus = useCallbackRef(rest.onFocus)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\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 = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref: mergeRefs(ref, (el: HTMLElement | undefined) => {\n if (el) setIsLabel(el.tagName === \"LABEL\")\n }),\n \"data-checked\": dataAttr(checked),\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, rest],\n )\n\n const getIconProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n \"data-active\": dataAttr(isActive),\n \"data-hover\": dataAttr(isHovered),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n \"data-indeterminate\": dataAttr(isIndeterminate),\n \"aria-hidden\": true,\n onMouseDown: handlerAll(props.onMouseDown, (ev: React.MouseEvent) => {\n if (isFocused) ev.preventDefault()\n\n setActive(true)\n }),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n }),\n [\n isActive,\n checked,\n isFocused,\n isHovered,\n isFocusVisible,\n isIndeterminate,\n rest,\n ],\n )\n\n const getInputProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref: mergeRefs(inputRef, ref),\n id,\n type: \"checkbox\",\n name,\n value,\n tabIndex,\n required,\n disabled,\n readOnly,\n checked,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n width: \"1px\",\n margin: \"-1px\",\n padding: \"0px\",\n overflow: \"hidden\",\n whiteSpace: \"nowrap\",\n position: \"absolute\",\n },\n onChange: handlerAll(props.onChange, onChange),\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onFocus: handlerAll(props.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props.onKeyUp, onKeyUp),\n }),\n [\n rest,\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 ...pickObject(rest, formControlProperties),\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, rest],\n )\n\n return {\n isFocusVisible,\n isFocused,\n isHovered,\n isActive,\n isChecked: checked,\n isIndeterminate,\n getContainerProps,\n getIconProps,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseCheckboxReturn = ReturnType<typeof useCheckbox>\n\ntype CheckboxOptions = {\n /**\n * Props for icon component.\n */\n iconProps?: Omit<HTMLUIProps<\"span\">, \"children\"> & { children: ReactElement }\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 type CheckboxProps<Y extends string | number = string> = Omit<\n HTMLUIProps<\"label\">,\n keyof UseCheckboxProps | \"checked\"\n> &\n ThemeProps<\"Checkbox\"> &\n UseCheckboxProps<Y> &\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 string | number = string>(\n props: CheckboxProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useCheckboxGroupContext()\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Checkbox\", {\n ...(group ? omitObject(group, [\"value\"]) : {}),\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = group?.isRequired ?? control.isRequired,\n isReadOnly = group?.isReadOnly ?? control.isReadOnly,\n isDisabled = group?.isDisabled ?? control.isDisabled,\n isInvalid = group?.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const {\n isChecked,\n isIndeterminate,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n } = useCheckbox({\n ...rest,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked:\n group?.value && rest.value\n ? group.value.includes(rest.value)\n : rest.isChecked,\n onChange:\n group?.onChange && rest.value\n ? funcAll(group.onChange, rest.onChange)\n : rest.onChange,\n })\n\n const cloneIcon = cloneElement(iconProps?.children ?? <CheckboxIcon />, {\n __css: {\n opacity: isChecked || isIndeterminate ? 1 : 0,\n transform: isChecked || isIndeterminate ? \"scale(1)\" : \"scale(0.95)\",\n transitionProperty: \"transform\",\n transitionDuration: \"normal\",\n },\n isIndeterminate,\n isChecked,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n })\n\n return (\n <ui.label\n className={cx(\"ui-checkbox\", className)}\n {...getContainerProps()}\n __css={{\n cursor: \"pointer\",\n position: \"relative\",\n display: \"inline-flex\",\n alignItems: \"center\",\n verticalAlign: \"top\",\n gap,\n ...styles.container,\n }}\n {...omitObject(rest, [\n \"id\",\n \"name\",\n \"value\",\n \"defaultValue\",\n \"defaultIsChecked\",\n \"isChecked\",\n \"isIndeterminate\",\n \"onChange\",\n \"onBlur\",\n \"onFocus\",\n \"tabIndex\",\n ])}\n >\n <ui.input\n className=\"ui-checkbox__input\"\n {...getInputProps(inputProps, ref)}\n />\n\n <ui.span\n className=\"ui-checkbox__icon\"\n __css={{\n pointerEvents: isReadOnly ? \"none\" : undefined,\n position: \"relative\",\n display: \"inline-block\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n {...getIconProps(\n omitObject(iconProps ?? { children: undefined }, [\"children\"]),\n )}\n >\n {cloneIcon}\n </ui.span>\n\n <ui.span\n className=\"ui-checkbox__label\"\n __css={{ ...styles.label }}\n {...getLabelProps(labelProps)}\n >\n {children}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: CheckboxProps<Y> & { ref?: Ref<HTMLInputElement> },\n ): JSX.Element\n} & ComponentArgs\n\nCheckbox.displayName = \"Checkbox\"\n\nexport type CheckboxIconProps = HTMLUIProps<\"svg\"> &\n SVGMotionProps<SVGSVGElement> &\n FormControlOptions & {\n /**\n * If `true`, the icon will be indeterminate.\n *\n * @default false\n */\n isIndeterminate?: boolean\n /**\n * If `true`, the icon will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n }\n\nexport const CheckboxIcon: FC<CheckboxIconProps> = ({\n isIndeterminate,\n isChecked,\n ...rest\n}) => {\n const iconProps = omitObject(rest, [\n \"isRequired\",\n \"isReadOnly\",\n \"isDisabled\",\n \"isInvalid\",\n ])\n\n return (\n <AnimatePresence initial={false}>\n {isIndeterminate || isChecked ? (\n <ui.div\n __css={{\n position: \"absolute\",\n top: \"50%\",\n left: \"50%\",\n transform: \"translate(-50%, -50%)\",\n }}\n >\n <ui.div\n as={motion.div}\n variants={{\n unchecked: { scale: 0.5 },\n checked: { scale: 1 },\n }}\n initial=\"unchecked\"\n animate=\"checked\"\n exit=\"unchecked\"\n style={\n {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n } as CSSProperties\n }\n >\n {isIndeterminate ? (\n <IndeterminateIcon {...iconProps} />\n ) : (\n <CheckIcon {...iconProps} />\n )}\n </ui.div>\n </ui.div>\n ) : null}\n </AnimatePresence>\n )\n}\n\nconst CheckIcon: FC<HTMLUIProps<\"svg\"> & SVGMotionProps<SVGSVGElement>> = (\n props,\n) => {\n return (\n <ui.svg\n as={motion.svg}\n width=\"1.2em\"\n viewBox=\"0 0 12 10\"\n variants={{\n unchecked: {\n opacity: 0,\n strokeDashoffset: 16,\n },\n checked: {\n opacity: 1,\n strokeDashoffset: 0,\n transition: { duration: 0.2 },\n },\n }}\n style={{\n fill: \"none\",\n strokeWidth: 2,\n stroke: \"currentColor\",\n strokeDasharray: 16,\n }}\n {...props}\n >\n <polyline points=\"1.5 6 4.5 9 10.5 1\" />\n </ui.svg>\n )\n}\n\nconst IndeterminateIcon: FC<\n HTMLUIProps<\"svg\"> & SVGMotionProps<SVGSVGElement>\n> = (props) => {\n return (\n <ui.svg\n as={motion.svg}\n width=\"1.2em\"\n viewBox=\"0 0 24 24\"\n variants={{\n unchecked: {\n scaleX: 0.65,\n opacity: 0,\n },\n checked: {\n scaleX: 1,\n opacity: 1,\n transition: {\n scaleX: { duration: 0 },\n opacity: { duration: 0.02 },\n },\n },\n }}\n style={{ stroke: \"currentColor\", strokeWidth: 4 }}\n {...props}\n >\n <line x1=\"21\" x2=\"3\" y1=\"12\" y2=\"12\" />\n </ui.svg>\n )\n}\n","import type { ComponentArgs, ThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport type { FlexProps } from \"@yamada-ui/layouts\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport type { PropGetter, DOMAttributes } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n omitObject,\n useCallbackRef,\n getValidChildren,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent, ForwardedRef, ReactElement, Ref } from \"react\"\nimport { forwardRef, useCallback } from \"react\"\nimport type { CheckboxProps } from \"./checkbox\"\nimport { Checkbox } from \"./checkbox\"\n\nexport type CheckboxItem<Y extends string | number = string> =\n CheckboxProps<Y> & {\n label?: string\n }\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport type UseCheckboxGroupProps<Y extends string | number = string> = {\n /**\n * The value of the checkbox group.\n */\n value?: Y[]\n /**\n * The initial value of the checkbox group.\n */\n defaultValue?: Y[]\n /**\n * The callback fired when any children checkbox is checked or unchecked.\n */\n onChange?: (value: Y[]) => void\n /**\n * If `true`, input elements will receive `checked` attribute instead of `isChecked`.\n *\n * This assumes, you're using native radio inputs.\n *\n * @default false\n */\n isNative?: boolean\n}\n\nexport const useCheckboxGroup = <Y extends string | number = string>({\n isNative,\n ...props\n}: UseCheckboxGroupProps<Y>) => {\n props.onChange = useCallbackRef(props.onChange)\n\n const [value, setValue] = useControllableState({\n value: props.value,\n defaultValue: props.defaultValue || [],\n onChange: props.onChange,\n })\n\n const onChange = useCallback(\n (evOrValue: ChangeEvent<HTMLInputElement> | Y) => {\n const isChecked = isEvent(evOrValue)\n ? evOrValue.target.checked\n : !value.includes(evOrValue)\n\n const selectedValue = (\n isEvent(evOrValue) ? evOrValue.target.value : evOrValue\n ) as Y\n\n const nextValue = isChecked\n ? [...value, selectedValue]\n : value.filter((v) => String(v) !== String(selectedValue))\n\n setValue(nextValue)\n },\n [value, setValue],\n )\n\n const getCheckboxProps: PropGetter<\n DOMAttributes<HTMLInputElement> & { isChecked?: boolean },\n Omit<DOMAttributes<HTMLInputElement>, \"onChange\"> & {\n onChange: (ev: ChangeEvent<HTMLInputElement> | Y) => void\n }\n > = useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref,\n [isNative ? \"checked\" : \"isChecked\"]: value.some(\n (val) => String(props.value) === String(val),\n ),\n onChange,\n }),\n [onChange, isNative, value],\n )\n\n return { value, setValue, onChange, getCheckboxProps }\n}\n\nexport type UseCheckboxGroupReturn<Y extends string | number = string> =\n ReturnType<typeof useCheckboxGroup<Y>>\n\nexport type CheckboxGroupProps<Y extends string | number = string> =\n ThemeProps<\"Checkbox\"> &\n Omit<FlexProps, \"onChange\"> &\n UseCheckboxGroupProps<Y> &\n FormControlOptions & {\n /**\n * If provided, generate checkboxes based on items.\n *\n * @default '[]'\n */\n items?: CheckboxItem<Y>[]\n }\n\ntype CheckboxContext = ThemeProps<\"Checkbox\"> &\n FormControlOptions & {\n value: (string | number)[]\n onChange: (\n evOrValue: ChangeEvent<HTMLInputElement> | string | number,\n ) => void\n }\n\nconst [CheckboxGroupProvider, useCheckboxGroupContext] = createContext<\n CheckboxContext | undefined\n>({\n strict: false,\n name: \"CheckboxGroupContext\",\n})\n\nexport { useCheckboxGroupContext }\n\nexport const CheckboxGroup = forwardRef(\n <Y extends string | number = string>(\n {\n className,\n size,\n variant,\n colorScheme,\n children,\n items = [],\n direction = \"column\",\n gap,\n ...props\n }: CheckboxGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const { value, onChange } = useCheckboxGroup<Y>(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid } =\n useFormControl(props)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length) {\n computedChildren = items.map(({ label, value, ...props }, i) => (\n <Checkbox key={i} value={value} {...props}>\n {label}\n </Checkbox>\n ))\n }\n\n return (\n <CheckboxGroupProvider\n value={\n {\n size,\n variant,\n colorScheme,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n value,\n onChange,\n } as CheckboxContext\n }\n >\n <Flex\n ref={ref}\n className={cx(\"ui-checkbox-group\", className)}\n role=\"group\"\n direction={direction}\n gap={gap ?? (direction === \"row\" ? \"1rem\" : undefined)}\n {...omitObject(props, [\n \"value\",\n \"defaultValue\",\n \"onChange\",\n \"isInvalid\",\n \"isDisabled\",\n \"isRequired\",\n \"isReadOnly\",\n ])}\n >\n {children ?? computedChildren}\n </Flex>\n </CheckboxGroupProvider>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: CheckboxGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nCheckboxGroup.displayName = \"CheckboxGroup\"\n"],"mappings":"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","names":["import_form_control","import_utils","import_react","props","value","props","import_jsx_runtime","props","_a"]}
|
package/dist/checkbox.mjs
CHANGED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/checkbox.tsx","../src/checkbox-group.tsx"],"sourcesContent":["import type { HTMLUIProps, ThemeProps, ComponentArgs } from \"@yamada-ui/core\"\nimport { ui, useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n useFormControl,\n useFormControlProps,\n formControlProperties,\n} from \"@yamada-ui/form-control\"\nimport type { SVGMotionProps } from \"@yamada-ui/motion\"\nimport { AnimatePresence, motion } from \"@yamada-ui/motion\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport type { PropGetter } from \"@yamada-ui/utils\"\nimport {\n cx,\n omitObject,\n pickObject,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n handlerAll,\n dataAttr,\n mergeRefs,\n funcAll,\n} from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n ChangeEventHandler,\n CSSProperties,\n FC,\n FocusEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n ReactElement,\n SyntheticEvent,\n ForwardedRef,\n Ref,\n} from \"react\"\nimport {\n cloneElement,\n useCallback,\n useEffect,\n useRef,\n useState,\n forwardRef,\n} from \"react\"\nimport { useCheckboxGroupContext } from \"./checkbox-group\"\n\nexport type UseCheckboxProps<Y extends string | number = string> =\n 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 * The value to be used in the checkbox input.\n */\n value?: Y\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 * 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 * The callback invoked when the checkbox is blurred.\n */\n onBlur?: FocusEventHandler<HTMLInputElement>\n /**\n * The tab-index property of the underlying input element.\n */\n tabIndex?: number\n }\n\nexport const useCheckbox = <Y extends string | number = string>(\n props: UseCheckboxProps<Y>,\n) => {\n const {\n id,\n name,\n value,\n defaultIsChecked,\n tabIndex,\n required,\n disabled,\n readOnly,\n isIndeterminate,\n ...rest\n } = useFormControlProps(props)\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 = props.isChecked !== undefined\n const checked = isControlled ? (props.isChecked 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 rest.onChange?.(ev)\n },\n [readOnly, disabled, isControlled, checked, isIndeterminate],\n )\n const onBlur = useCallbackRef(rest.onBlur)\n const onFocus = useCallbackRef(rest.onFocus)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\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 = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref: mergeRefs(ref, (el: HTMLElement | undefined) => {\n if (el) setIsLabel(el.tagName === \"LABEL\")\n }),\n \"data-checked\": dataAttr(checked),\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, rest],\n )\n\n const getIconProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n \"data-active\": dataAttr(isActive),\n \"data-hover\": dataAttr(isHovered),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n \"data-indeterminate\": dataAttr(isIndeterminate),\n \"aria-hidden\": true,\n onMouseDown: handlerAll(props.onMouseDown, (ev: React.MouseEvent) => {\n if (isFocused) ev.preventDefault()\n\n setActive(true)\n }),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n }),\n [\n isActive,\n checked,\n isFocused,\n isHovered,\n isFocusVisible,\n isIndeterminate,\n rest,\n ],\n )\n\n const getInputProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref: mergeRefs(inputRef, ref),\n id,\n type: \"checkbox\",\n name,\n value,\n tabIndex,\n required,\n disabled,\n readOnly,\n checked,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n width: \"1px\",\n margin: \"-1px\",\n padding: \"0px\",\n overflow: \"hidden\",\n whiteSpace: \"nowrap\",\n position: \"absolute\",\n },\n onChange: handlerAll(props.onChange, onChange),\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onFocus: handlerAll(props.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props.onKeyUp, onKeyUp),\n }),\n [\n rest,\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 ...pickObject(rest, formControlProperties),\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, rest],\n )\n\n return {\n isFocusVisible,\n isFocused,\n isHovered,\n isActive,\n isChecked: checked,\n isIndeterminate,\n getContainerProps,\n getIconProps,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseCheckboxReturn = ReturnType<typeof useCheckbox>\n\ntype CheckboxOptions = {\n /**\n * Props for icon component.\n */\n iconProps?: Omit<HTMLUIProps<\"span\">, \"children\"> & { children: ReactElement }\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 type CheckboxProps<Y extends string | number = string> = Omit<\n HTMLUIProps<\"label\">,\n keyof UseCheckboxProps | \"checked\"\n> &\n ThemeProps<\"Checkbox\"> &\n UseCheckboxProps<Y> &\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 string | number = string>(\n props: CheckboxProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useCheckboxGroupContext()\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Checkbox\", {\n ...(group ? omitObject(group, [\"value\"]) : {}),\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = group?.isRequired ?? control.isRequired,\n isReadOnly = group?.isReadOnly ?? control.isReadOnly,\n isDisabled = group?.isDisabled ?? control.isDisabled,\n isInvalid = group?.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const {\n isChecked,\n isIndeterminate,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n } = useCheckbox({\n ...rest,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked:\n group?.value && rest.value\n ? group.value.includes(rest.value)\n : rest.isChecked,\n onChange:\n group?.onChange && rest.value\n ? funcAll(group.onChange, rest.onChange)\n : rest.onChange,\n })\n\n const cloneIcon = cloneElement(iconProps?.children ?? <CheckboxIcon />, {\n __css: {\n opacity: isChecked || isIndeterminate ? 1 : 0,\n transform: isChecked || isIndeterminate ? \"scale(1)\" : \"scale(0.95)\",\n transitionProperty: \"transform\",\n transitionDuration: \"normal\",\n },\n isIndeterminate,\n isChecked,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n })\n\n return (\n <ui.label\n className={cx(\"ui-checkbox\", className)}\n {...getContainerProps()}\n __css={{\n cursor: \"pointer\",\n position: \"relative\",\n display: \"inline-flex\",\n alignItems: \"center\",\n verticalAlign: \"top\",\n gap,\n ...styles.container,\n }}\n {...omitObject(rest, [\n \"id\",\n \"name\",\n \"value\",\n \"defaultValue\",\n \"defaultIsChecked\",\n \"isChecked\",\n \"isIndeterminate\",\n \"onChange\",\n \"onBlur\",\n \"onFocus\",\n \"tabIndex\",\n ])}\n >\n <ui.input\n className=\"ui-checkbox__input\"\n {...getInputProps(inputProps, ref)}\n />\n\n <ui.span\n className=\"ui-checkbox__icon\"\n __css={{\n pointerEvents: isReadOnly ? \"none\" : undefined,\n position: \"relative\",\n display: \"inline-block\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n {...getIconProps(\n omitObject(iconProps ?? { children: undefined }, [\"children\"]),\n )}\n >\n {cloneIcon}\n </ui.span>\n\n <ui.span\n className=\"ui-checkbox__label\"\n __css={{ ...styles.label }}\n {...getLabelProps(labelProps)}\n >\n {children}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: CheckboxProps<Y> & { ref?: Ref<HTMLInputElement> },\n ): JSX.Element\n} & ComponentArgs\n\nCheckbox.displayName = \"Checkbox\"\n\nexport type CheckboxIconProps = HTMLUIProps<\"svg\"> &\n SVGMotionProps<SVGSVGElement> &\n FormControlOptions & {\n /**\n * If `true`, the icon will be indeterminate.\n *\n * @default false\n */\n isIndeterminate?: boolean\n /**\n * If `true`, the icon will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n }\n\nexport const CheckboxIcon: FC<CheckboxIconProps> = ({\n isIndeterminate,\n isChecked,\n ...rest\n}) => {\n const iconProps = omitObject(rest, [\n \"isRequired\",\n \"isReadOnly\",\n \"isDisabled\",\n \"isInvalid\",\n ])\n\n return (\n <AnimatePresence initial={false}>\n {isIndeterminate || isChecked ? (\n <ui.div\n __css={{\n position: \"absolute\",\n top: \"50%\",\n left: \"50%\",\n transform: \"translate(-50%, -50%)\",\n }}\n >\n <ui.div\n as={motion.div}\n variants={{\n unchecked: { scale: 0.5 },\n checked: { scale: 1 },\n }}\n initial=\"unchecked\"\n animate=\"checked\"\n exit=\"unchecked\"\n style={\n {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n } as CSSProperties\n }\n >\n {isIndeterminate ? (\n <IndeterminateIcon {...iconProps} />\n ) : (\n <CheckIcon {...iconProps} />\n )}\n </ui.div>\n </ui.div>\n ) : null}\n </AnimatePresence>\n )\n}\n\nconst CheckIcon: FC<HTMLUIProps<\"svg\"> & SVGMotionProps<SVGSVGElement>> = (\n props,\n) => {\n return (\n <ui.svg\n as={motion.svg}\n width=\"1.2em\"\n viewBox=\"0 0 12 10\"\n variants={{\n unchecked: {\n opacity: 0,\n strokeDashoffset: 16,\n },\n checked: {\n opacity: 1,\n strokeDashoffset: 0,\n transition: { duration: 0.2 },\n },\n }}\n style={{\n fill: \"none\",\n strokeWidth: 2,\n stroke: \"currentColor\",\n strokeDasharray: 16,\n }}\n {...props}\n >\n <polyline points=\"1.5 6 4.5 9 10.5 1\" />\n </ui.svg>\n )\n}\n\nconst IndeterminateIcon: FC<\n HTMLUIProps<\"svg\"> & SVGMotionProps<SVGSVGElement>\n> = (props) => {\n return (\n <ui.svg\n as={motion.svg}\n width=\"1.2em\"\n viewBox=\"0 0 24 24\"\n variants={{\n unchecked: {\n scaleX: 0.65,\n opacity: 0,\n },\n checked: {\n scaleX: 1,\n opacity: 1,\n transition: {\n scaleX: { duration: 0 },\n opacity: { duration: 0.02 },\n },\n },\n }}\n style={{ stroke: \"currentColor\", strokeWidth: 4 }}\n {...props}\n >\n <line x1=\"21\" x2=\"3\" y1=\"12\" y2=\"12\" />\n </ui.svg>\n )\n}\n","import type { ComponentArgs, ThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport type { FlexProps } from \"@yamada-ui/layouts\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport type { PropGetter, DOMAttributes } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n omitObject,\n useCallbackRef,\n getValidChildren,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent, ForwardedRef, ReactElement, Ref } from \"react\"\nimport { forwardRef, useCallback } from \"react\"\nimport type { CheckboxProps } from \"./checkbox\"\nimport { Checkbox } from \"./checkbox\"\n\nexport type CheckboxItem<Y extends string | number = string> =\n CheckboxProps<Y> & {\n label?: string\n }\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport type UseCheckboxGroupProps<Y extends string | number = string> = {\n /**\n * The value of the checkbox group.\n */\n value?: Y[]\n /**\n * The initial value of the checkbox group.\n */\n defaultValue?: Y[]\n /**\n * The callback fired when any children checkbox is checked or unchecked.\n */\n onChange?: (value: Y[]) => void\n /**\n * If `true`, input elements will receive `checked` attribute instead of `isChecked`.\n *\n * This assumes, you're using native radio inputs.\n *\n * @default false\n */\n isNative?: boolean\n}\n\nexport const useCheckboxGroup = <Y extends string | number = string>({\n isNative,\n ...props\n}: UseCheckboxGroupProps<Y>) => {\n props.onChange = useCallbackRef(props.onChange)\n\n const [value, setValue] = useControllableState({\n value: props.value,\n defaultValue: props.defaultValue || [],\n onChange: props.onChange,\n })\n\n const onChange = useCallback(\n (evOrValue: ChangeEvent<HTMLInputElement> | Y) => {\n const isChecked = isEvent(evOrValue)\n ? evOrValue.target.checked\n : !value.includes(evOrValue)\n\n const selectedValue = (\n isEvent(evOrValue) ? evOrValue.target.value : evOrValue\n ) as Y\n\n const nextValue = isChecked\n ? [...value, selectedValue]\n : value.filter((v) => String(v) !== String(selectedValue))\n\n setValue(nextValue)\n },\n [value, setValue],\n )\n\n const getCheckboxProps: PropGetter<\n DOMAttributes<HTMLInputElement> & { isChecked?: boolean },\n Omit<DOMAttributes<HTMLInputElement>, \"onChange\"> & {\n onChange: (ev: ChangeEvent<HTMLInputElement> | Y) => void\n }\n > = useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref,\n [isNative ? \"checked\" : \"isChecked\"]: value.some(\n (val) => String(props.value) === String(val),\n ),\n onChange,\n }),\n [onChange, isNative, value],\n )\n\n return { value, setValue, onChange, getCheckboxProps }\n}\n\nexport type UseCheckboxGroupReturn<Y extends string | number = string> =\n ReturnType<typeof useCheckboxGroup<Y>>\n\nexport type CheckboxGroupProps<Y extends string | number = string> =\n ThemeProps<\"Checkbox\"> &\n Omit<FlexProps, \"onChange\"> &\n UseCheckboxGroupProps<Y> &\n FormControlOptions & {\n /**\n * If provided, generate checkboxes based on items.\n *\n * @default '[]'\n */\n items?: CheckboxItem<Y>[]\n }\n\ntype CheckboxContext = ThemeProps<\"Checkbox\"> &\n FormControlOptions & {\n value: (string | number)[]\n onChange: (\n evOrValue: ChangeEvent<HTMLInputElement> | string | number,\n ) => void\n }\n\nconst [CheckboxGroupProvider, useCheckboxGroupContext] = createContext<\n CheckboxContext | undefined\n>({\n strict: false,\n name: \"CheckboxGroupContext\",\n})\n\nexport { useCheckboxGroupContext }\n\nexport const CheckboxGroup = forwardRef(\n <Y extends string | number = string>(\n {\n className,\n size,\n variant,\n colorScheme,\n children,\n items = [],\n direction = \"column\",\n gap,\n ...props\n }: CheckboxGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const { value, onChange } = useCheckboxGroup<Y>(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid } =\n useFormControl(props)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length) {\n computedChildren = items.map(({ label, value, ...props }, i) => (\n <Checkbox key={i} value={value} {...props}>\n {label}\n </Checkbox>\n ))\n }\n\n return (\n <CheckboxGroupProvider\n value={\n {\n size,\n variant,\n colorScheme,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n value,\n onChange,\n } as CheckboxContext\n }\n >\n <Flex\n ref={ref}\n className={cx(\"ui-checkbox-group\", className)}\n role=\"group\"\n direction={direction}\n gap={gap ?? (direction === \"row\" ? \"1rem\" : undefined)}\n {...omitObject(props, [\n \"value\",\n \"defaultValue\",\n \"onChange\",\n \"isInvalid\",\n \"isDisabled\",\n \"isRequired\",\n \"isReadOnly\",\n ])}\n >\n {children ?? computedChildren}\n </Flex>\n </CheckboxGroupProvider>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: CheckboxGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nCheckboxGroup.displayName = \"CheckboxGroup\"\n"],"mappings":"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","names":["useFormControl","cx","omitObject","useCallbackRef","useCallback","forwardRef","props","value","props","jsx","useCallbackRef","useCallback","props","_a","forwardRef","useFormControl","omitObject","cx"]}
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/checkbox.tsx","../src/checkbox-group.tsx"],"sourcesContent":["export { Checkbox, CheckboxIcon, useCheckbox } from \"./checkbox\"\nexport type {\n CheckboxProps,\n CheckboxIconProps,\n UseCheckboxProps,\n UseCheckboxReturn,\n} from \"./checkbox\"\nexport { CheckboxGroup, useCheckboxGroup } from \"./checkbox-group\"\nexport type {\n CheckboxItem,\n CheckboxGroupProps,\n UseCheckboxGroupProps,\n UseCheckboxGroupReturn,\n} from \"./checkbox-group\"\n","import type { HTMLUIProps, ThemeProps, ComponentArgs } from \"@yamada-ui/core\"\nimport { ui, useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n useFormControl,\n useFormControlProps,\n formControlProperties,\n} from \"@yamada-ui/form-control\"\nimport type { SVGMotionProps } from \"@yamada-ui/motion\"\nimport { AnimatePresence, motion } from \"@yamada-ui/motion\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport type { PropGetter } from \"@yamada-ui/utils\"\nimport {\n cx,\n omitObject,\n pickObject,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n handlerAll,\n dataAttr,\n mergeRefs,\n funcAll,\n} from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n ChangeEventHandler,\n CSSProperties,\n FC,\n FocusEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n ReactElement,\n SyntheticEvent,\n ForwardedRef,\n Ref,\n} from \"react\"\nimport {\n cloneElement,\n useCallback,\n useEffect,\n useRef,\n useState,\n forwardRef,\n} from \"react\"\nimport { useCheckboxGroupContext } from \"./checkbox-group\"\n\nexport type UseCheckboxProps<Y extends string | number = string> =\n 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 * The value to be used in the checkbox input.\n */\n value?: Y\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 * 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 * The callback invoked when the checkbox is blurred.\n */\n onBlur?: FocusEventHandler<HTMLInputElement>\n /**\n * The tab-index property of the underlying input element.\n */\n tabIndex?: number\n }\n\nexport const useCheckbox = <Y extends string | number = string>(\n props: UseCheckboxProps<Y>,\n) => {\n const {\n id,\n name,\n value,\n defaultIsChecked,\n tabIndex,\n required,\n disabled,\n readOnly,\n isIndeterminate,\n ...rest\n } = useFormControlProps(props)\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 = props.isChecked !== undefined\n const checked = isControlled ? (props.isChecked 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 rest.onChange?.(ev)\n },\n [readOnly, disabled, isControlled, checked, isIndeterminate],\n )\n const onBlur = useCallbackRef(rest.onBlur)\n const onFocus = useCallbackRef(rest.onFocus)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\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 = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref: mergeRefs(ref, (el: HTMLElement | undefined) => {\n if (el) setIsLabel(el.tagName === \"LABEL\")\n }),\n \"data-checked\": dataAttr(checked),\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, rest],\n )\n\n const getIconProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n \"data-active\": dataAttr(isActive),\n \"data-hover\": dataAttr(isHovered),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n \"data-indeterminate\": dataAttr(isIndeterminate),\n \"aria-hidden\": true,\n onMouseDown: handlerAll(props.onMouseDown, (ev: React.MouseEvent) => {\n if (isFocused) ev.preventDefault()\n\n setActive(true)\n }),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n }),\n [\n isActive,\n checked,\n isFocused,\n isHovered,\n isFocusVisible,\n isIndeterminate,\n rest,\n ],\n )\n\n const getInputProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref: mergeRefs(inputRef, ref),\n id,\n type: \"checkbox\",\n name,\n value,\n tabIndex,\n required,\n disabled,\n readOnly,\n checked,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n width: \"1px\",\n margin: \"-1px\",\n padding: \"0px\",\n overflow: \"hidden\",\n whiteSpace: \"nowrap\",\n position: \"absolute\",\n },\n onChange: handlerAll(props.onChange, onChange),\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onFocus: handlerAll(props.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props.onKeyUp, onKeyUp),\n }),\n [\n rest,\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 ...pickObject(rest, formControlProperties),\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, rest],\n )\n\n return {\n isFocusVisible,\n isFocused,\n isHovered,\n isActive,\n isChecked: checked,\n isIndeterminate,\n getContainerProps,\n getIconProps,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseCheckboxReturn = ReturnType<typeof useCheckbox>\n\ntype CheckboxOptions = {\n /**\n * Props for icon component.\n */\n iconProps?: Omit<HTMLUIProps<\"span\">, \"children\"> & { children: ReactElement }\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 type CheckboxProps<Y extends string | number = string> = Omit<\n HTMLUIProps<\"label\">,\n keyof UseCheckboxProps | \"checked\"\n> &\n ThemeProps<\"Checkbox\"> &\n UseCheckboxProps<Y> &\n CheckboxOptions\n\nexport const Checkbox = forwardRef(\n <Y extends string | number = string>(\n props: CheckboxProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useCheckboxGroupContext()\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Checkbox\", {\n ...(group ? omitObject(group, [\"value\"]) : {}),\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = group?.isRequired ?? control.isRequired,\n isReadOnly = group?.isReadOnly ?? control.isReadOnly,\n isDisabled = group?.isDisabled ?? control.isDisabled,\n isInvalid = group?.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const {\n isChecked,\n isIndeterminate,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n } = useCheckbox({\n ...rest,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked:\n group?.value && rest.value\n ? group.value.includes(rest.value)\n : rest.isChecked,\n onChange:\n group?.onChange && rest.value\n ? funcAll(group.onChange, rest.onChange)\n : rest.onChange,\n })\n\n const cloneIcon = cloneElement(iconProps?.children ?? <CheckboxIcon />, {\n __css: {\n opacity: isChecked || isIndeterminate ? 1 : 0,\n transform: isChecked || isIndeterminate ? \"scale(1)\" : \"scale(0.95)\",\n transitionProperty: \"transform\",\n transitionDuration: \"normal\",\n },\n isIndeterminate,\n isChecked,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n })\n\n return (\n <ui.label\n className={cx(\"ui-checkbox\", className)}\n {...getContainerProps()}\n __css={{\n cursor: \"pointer\",\n position: \"relative\",\n display: \"inline-flex\",\n alignItems: \"center\",\n verticalAlign: \"top\",\n gap,\n ...styles.container,\n }}\n {...omitObject(rest, [\n \"id\",\n \"name\",\n \"value\",\n \"defaultValue\",\n \"defaultIsChecked\",\n \"isChecked\",\n \"isIndeterminate\",\n \"onChange\",\n \"onBlur\",\n \"onFocus\",\n \"tabIndex\",\n ])}\n >\n <ui.input\n className=\"ui-checkbox__input\"\n {...getInputProps(inputProps, ref)}\n />\n\n <ui.span\n className=\"ui-checkbox__icon\"\n __css={{\n pointerEvents: isReadOnly ? \"none\" : undefined,\n position: \"relative\",\n display: \"inline-block\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n {...getIconProps(\n omitObject(iconProps ?? { children: undefined }, [\"children\"]),\n )}\n >\n {cloneIcon}\n </ui.span>\n\n <ui.span\n className=\"ui-checkbox__label\"\n __css={{ ...styles.label }}\n {...getLabelProps(labelProps)}\n >\n {children}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: CheckboxProps<Y> & { ref?: Ref<HTMLInputElement> },\n ): JSX.Element\n} & ComponentArgs\n\nCheckbox.displayName = \"Checkbox\"\n\nexport type CheckboxIconProps = HTMLUIProps<\"svg\"> &\n SVGMotionProps<SVGSVGElement> &\n FormControlOptions & {\n /**\n * If `true`, the icon will be indeterminate.\n *\n * @default false\n */\n isIndeterminate?: boolean\n /**\n * If `true`, the icon will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n }\n\nexport const CheckboxIcon: FC<CheckboxIconProps> = ({\n isIndeterminate,\n isChecked,\n ...rest\n}) => {\n const iconProps = omitObject(rest, [\n \"isRequired\",\n \"isReadOnly\",\n \"isDisabled\",\n \"isInvalid\",\n ])\n\n return (\n <AnimatePresence initial={false}>\n {isIndeterminate || isChecked ? (\n <ui.div\n __css={{\n position: \"absolute\",\n top: \"50%\",\n left: \"50%\",\n transform: \"translate(-50%, -50%)\",\n }}\n >\n <ui.div\n as={motion.div}\n variants={{\n unchecked: { scale: 0.5 },\n checked: { scale: 1 },\n }}\n initial=\"unchecked\"\n animate=\"checked\"\n exit=\"unchecked\"\n style={\n {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n } as CSSProperties\n }\n >\n {isIndeterminate ? (\n <IndeterminateIcon {...iconProps} />\n ) : (\n <CheckIcon {...iconProps} />\n )}\n </ui.div>\n </ui.div>\n ) : null}\n </AnimatePresence>\n )\n}\n\nconst CheckIcon: FC<HTMLUIProps<\"svg\"> & SVGMotionProps<SVGSVGElement>> = (\n props,\n) => {\n return (\n <ui.svg\n as={motion.svg}\n width=\"1.2em\"\n viewBox=\"0 0 12 10\"\n variants={{\n unchecked: {\n opacity: 0,\n strokeDashoffset: 16,\n },\n checked: {\n opacity: 1,\n strokeDashoffset: 0,\n transition: { duration: 0.2 },\n },\n }}\n style={{\n fill: \"none\",\n strokeWidth: 2,\n stroke: \"currentColor\",\n strokeDasharray: 16,\n }}\n {...props}\n >\n <polyline points=\"1.5 6 4.5 9 10.5 1\" />\n </ui.svg>\n )\n}\n\nconst IndeterminateIcon: FC<\n HTMLUIProps<\"svg\"> & SVGMotionProps<SVGSVGElement>\n> = (props) => {\n return (\n <ui.svg\n as={motion.svg}\n width=\"1.2em\"\n viewBox=\"0 0 24 24\"\n variants={{\n unchecked: {\n scaleX: 0.65,\n opacity: 0,\n },\n checked: {\n scaleX: 1,\n opacity: 1,\n transition: {\n scaleX: { duration: 0 },\n opacity: { duration: 0.02 },\n },\n },\n }}\n style={{ stroke: \"currentColor\", strokeWidth: 4 }}\n {...props}\n >\n <line x1=\"21\" x2=\"3\" y1=\"12\" y2=\"12\" />\n </ui.svg>\n )\n}\n","import type { ComponentArgs, ThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport type { FlexProps } from \"@yamada-ui/layouts\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport type { PropGetter, DOMAttributes } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n omitObject,\n useCallbackRef,\n getValidChildren,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent, ForwardedRef, ReactElement, Ref } from \"react\"\nimport { forwardRef, useCallback } from \"react\"\nimport type { CheckboxProps } from \"./checkbox\"\nimport { Checkbox } from \"./checkbox\"\n\nexport type CheckboxItem<Y extends string | number = string> =\n CheckboxProps<Y> & {\n label?: string\n }\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport type UseCheckboxGroupProps<Y extends string | number = string> = {\n /**\n * The value of the checkbox group.\n */\n value?: Y[]\n /**\n * The initial value of the checkbox group.\n */\n defaultValue?: Y[]\n /**\n * The callback fired when any children checkbox is checked or unchecked.\n */\n onChange?: (value: Y[]) => void\n /**\n * If `true`, input elements will receive `checked` attribute instead of `isChecked`.\n *\n * This assumes, you're using native radio inputs.\n *\n * @default false\n */\n isNative?: boolean\n}\n\nexport const useCheckboxGroup = <Y extends string | number = string>({\n isNative,\n ...props\n}: UseCheckboxGroupProps<Y>) => {\n props.onChange = useCallbackRef(props.onChange)\n\n const [value, setValue] = useControllableState({\n value: props.value,\n defaultValue: props.defaultValue || [],\n onChange: props.onChange,\n })\n\n const onChange = useCallback(\n (evOrValue: ChangeEvent<HTMLInputElement> | Y) => {\n const isChecked = isEvent(evOrValue)\n ? evOrValue.target.checked\n : !value.includes(evOrValue)\n\n const selectedValue = (\n isEvent(evOrValue) ? evOrValue.target.value : evOrValue\n ) as Y\n\n const nextValue = isChecked\n ? [...value, selectedValue]\n : value.filter((v) => String(v) !== String(selectedValue))\n\n setValue(nextValue)\n },\n [value, setValue],\n )\n\n const getCheckboxProps: PropGetter<\n DOMAttributes<HTMLInputElement> & { isChecked?: boolean },\n Omit<DOMAttributes<HTMLInputElement>, \"onChange\"> & {\n onChange: (ev: ChangeEvent<HTMLInputElement> | Y) => void\n }\n > = useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref,\n [isNative ? \"checked\" : \"isChecked\"]: value.some(\n (val) => String(props.value) === String(val),\n ),\n onChange,\n }),\n [onChange, isNative, value],\n )\n\n return { value, setValue, onChange, getCheckboxProps }\n}\n\nexport type UseCheckboxGroupReturn<Y extends string | number = string> =\n ReturnType<typeof useCheckboxGroup<Y>>\n\nexport type CheckboxGroupProps<Y extends string | number = string> =\n ThemeProps<\"Checkbox\"> &\n Omit<FlexProps, \"onChange\"> &\n UseCheckboxGroupProps<Y> &\n FormControlOptions & {\n /**\n * If provided, generate checkboxes based on items.\n *\n * @default '[]'\n */\n items?: CheckboxItem<Y>[]\n }\n\ntype CheckboxContext = ThemeProps<\"Checkbox\"> &\n FormControlOptions & {\n value: (string | number)[]\n onChange: (\n evOrValue: ChangeEvent<HTMLInputElement> | string | number,\n ) => void\n }\n\nconst [CheckboxGroupProvider, useCheckboxGroupContext] = createContext<\n CheckboxContext | undefined\n>({\n strict: false,\n name: \"CheckboxGroupContext\",\n})\n\nexport { useCheckboxGroupContext }\n\nexport const CheckboxGroup = forwardRef(\n <Y extends string | number = string>(\n {\n className,\n size,\n variant,\n colorScheme,\n children,\n items = [],\n direction = \"column\",\n gap,\n ...props\n }: CheckboxGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const { value, onChange } = useCheckboxGroup<Y>(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid } =\n useFormControl(props)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length) {\n computedChildren = items.map(({ label, value, ...props }, i) => (\n <Checkbox key={i} value={value} {...props}>\n {label}\n </Checkbox>\n ))\n }\n\n return (\n <CheckboxGroupProvider\n value={\n {\n size,\n variant,\n colorScheme,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n value,\n onChange,\n } as CheckboxContext\n }\n >\n <Flex\n ref={ref}\n className={cx(\"ui-checkbox-group\", className)}\n role=\"group\"\n direction={direction}\n gap={gap ?? (direction === \"row\" ? \"1rem\" : undefined)}\n {...omitObject(props, [\n \"value\",\n \"defaultValue\",\n \"onChange\",\n \"isInvalid\",\n \"isDisabled\",\n \"isRequired\",\n \"isReadOnly\",\n ])}\n >\n {children ?? computedChildren}\n </Flex>\n </CheckboxGroupProvider>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: CheckboxGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nCheckboxGroup.displayName = \"CheckboxGroup\"\n"],"mappings":"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","names":["import_form_control","import_utils","import_react","props","value","props","import_jsx_runtime","props","_a"]}
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/checkbox.tsx","../src/checkbox-group.tsx"],"sourcesContent":["export { Checkbox, CheckboxIcon, useCheckbox } from \"./checkbox\"\nexport type {\n CheckboxProps,\n CheckboxIconProps,\n UseCheckboxProps,\n UseCheckboxReturn,\n} from \"./checkbox\"\nexport { CheckboxGroup, useCheckboxGroup } from \"./checkbox-group\"\nexport type {\n CheckboxItem,\n CheckboxGroupProps,\n UseCheckboxGroupProps,\n UseCheckboxGroupReturn,\n} from \"./checkbox-group\"\n","import type { HTMLUIProps, ThemeProps, ComponentArgs } from \"@yamada-ui/core\"\nimport { ui, useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n useFormControl,\n useFormControlProps,\n formControlProperties,\n} from \"@yamada-ui/form-control\"\nimport type { SVGMotionProps } from \"@yamada-ui/motion\"\nimport { AnimatePresence, motion } from \"@yamada-ui/motion\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport type { PropGetter } from \"@yamada-ui/utils\"\nimport {\n cx,\n omitObject,\n pickObject,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n handlerAll,\n dataAttr,\n mergeRefs,\n funcAll,\n} from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n ChangeEventHandler,\n CSSProperties,\n FC,\n FocusEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n ReactElement,\n SyntheticEvent,\n ForwardedRef,\n Ref,\n} from \"react\"\nimport {\n cloneElement,\n useCallback,\n useEffect,\n useRef,\n useState,\n forwardRef,\n} from \"react\"\nimport { useCheckboxGroupContext } from \"./checkbox-group\"\n\nexport type UseCheckboxProps<Y extends string | number = string> =\n 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 * The value to be used in the checkbox input.\n */\n value?: Y\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 * 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 * The callback invoked when the checkbox is blurred.\n */\n onBlur?: FocusEventHandler<HTMLInputElement>\n /**\n * The tab-index property of the underlying input element.\n */\n tabIndex?: number\n }\n\nexport const useCheckbox = <Y extends string | number = string>(\n props: UseCheckboxProps<Y>,\n) => {\n const {\n id,\n name,\n value,\n defaultIsChecked,\n tabIndex,\n required,\n disabled,\n readOnly,\n isIndeterminate,\n ...rest\n } = useFormControlProps(props)\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 = props.isChecked !== undefined\n const checked = isControlled ? (props.isChecked 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 rest.onChange?.(ev)\n },\n [readOnly, disabled, isControlled, checked, isIndeterminate],\n )\n const onBlur = useCallbackRef(rest.onBlur)\n const onFocus = useCallbackRef(rest.onFocus)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\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 = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref: mergeRefs(ref, (el: HTMLElement | undefined) => {\n if (el) setIsLabel(el.tagName === \"LABEL\")\n }),\n \"data-checked\": dataAttr(checked),\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, rest],\n )\n\n const getIconProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n \"data-active\": dataAttr(isActive),\n \"data-hover\": dataAttr(isHovered),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n \"data-indeterminate\": dataAttr(isIndeterminate),\n \"aria-hidden\": true,\n onMouseDown: handlerAll(props.onMouseDown, (ev: React.MouseEvent) => {\n if (isFocused) ev.preventDefault()\n\n setActive(true)\n }),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n }),\n [\n isActive,\n checked,\n isFocused,\n isHovered,\n isFocusVisible,\n isIndeterminate,\n rest,\n ],\n )\n\n const getInputProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref: mergeRefs(inputRef, ref),\n id,\n type: \"checkbox\",\n name,\n value,\n tabIndex,\n required,\n disabled,\n readOnly,\n checked,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n width: \"1px\",\n margin: \"-1px\",\n padding: \"0px\",\n overflow: \"hidden\",\n whiteSpace: \"nowrap\",\n position: \"absolute\",\n },\n onChange: handlerAll(props.onChange, onChange),\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onFocus: handlerAll(props.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props.onKeyUp, onKeyUp),\n }),\n [\n rest,\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 ...pickObject(rest, formControlProperties),\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, rest],\n )\n\n return {\n isFocusVisible,\n isFocused,\n isHovered,\n isActive,\n isChecked: checked,\n isIndeterminate,\n getContainerProps,\n getIconProps,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseCheckboxReturn = ReturnType<typeof useCheckbox>\n\ntype CheckboxOptions = {\n /**\n * Props for icon component.\n */\n iconProps?: Omit<HTMLUIProps<\"span\">, \"children\"> & { children: ReactElement }\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 type CheckboxProps<Y extends string | number = string> = Omit<\n HTMLUIProps<\"label\">,\n keyof UseCheckboxProps | \"checked\"\n> &\n ThemeProps<\"Checkbox\"> &\n UseCheckboxProps<Y> &\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 string | number = string>(\n props: CheckboxProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useCheckboxGroupContext()\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Checkbox\", {\n ...(group ? omitObject(group, [\"value\"]) : {}),\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = group?.isRequired ?? control.isRequired,\n isReadOnly = group?.isReadOnly ?? control.isReadOnly,\n isDisabled = group?.isDisabled ?? control.isDisabled,\n isInvalid = group?.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const {\n isChecked,\n isIndeterminate,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n } = useCheckbox({\n ...rest,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked:\n group?.value && rest.value\n ? group.value.includes(rest.value)\n : rest.isChecked,\n onChange:\n group?.onChange && rest.value\n ? funcAll(group.onChange, rest.onChange)\n : rest.onChange,\n })\n\n const cloneIcon = cloneElement(iconProps?.children ?? <CheckboxIcon />, {\n __css: {\n opacity: isChecked || isIndeterminate ? 1 : 0,\n transform: isChecked || isIndeterminate ? \"scale(1)\" : \"scale(0.95)\",\n transitionProperty: \"transform\",\n transitionDuration: \"normal\",\n },\n isIndeterminate,\n isChecked,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n })\n\n return (\n <ui.label\n className={cx(\"ui-checkbox\", className)}\n {...getContainerProps()}\n __css={{\n cursor: \"pointer\",\n position: \"relative\",\n display: \"inline-flex\",\n alignItems: \"center\",\n verticalAlign: \"top\",\n gap,\n ...styles.container,\n }}\n {...omitObject(rest, [\n \"id\",\n \"name\",\n \"value\",\n \"defaultValue\",\n \"defaultIsChecked\",\n \"isChecked\",\n \"isIndeterminate\",\n \"onChange\",\n \"onBlur\",\n \"onFocus\",\n \"tabIndex\",\n ])}\n >\n <ui.input\n className=\"ui-checkbox__input\"\n {...getInputProps(inputProps, ref)}\n />\n\n <ui.span\n className=\"ui-checkbox__icon\"\n __css={{\n pointerEvents: isReadOnly ? \"none\" : undefined,\n position: \"relative\",\n display: \"inline-block\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n {...getIconProps(\n omitObject(iconProps ?? { children: undefined }, [\"children\"]),\n )}\n >\n {cloneIcon}\n </ui.span>\n\n <ui.span\n className=\"ui-checkbox__label\"\n __css={{ ...styles.label }}\n {...getLabelProps(labelProps)}\n >\n {children}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: CheckboxProps<Y> & { ref?: Ref<HTMLInputElement> },\n ): JSX.Element\n} & ComponentArgs\n\nCheckbox.displayName = \"Checkbox\"\n\nexport type CheckboxIconProps = HTMLUIProps<\"svg\"> &\n SVGMotionProps<SVGSVGElement> &\n FormControlOptions & {\n /**\n * If `true`, the icon will be indeterminate.\n *\n * @default false\n */\n isIndeterminate?: boolean\n /**\n * If `true`, the icon will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n }\n\nexport const CheckboxIcon: FC<CheckboxIconProps> = ({\n isIndeterminate,\n isChecked,\n ...rest\n}) => {\n const iconProps = omitObject(rest, [\n \"isRequired\",\n \"isReadOnly\",\n \"isDisabled\",\n \"isInvalid\",\n ])\n\n return (\n <AnimatePresence initial={false}>\n {isIndeterminate || isChecked ? (\n <ui.div\n __css={{\n position: \"absolute\",\n top: \"50%\",\n left: \"50%\",\n transform: \"translate(-50%, -50%)\",\n }}\n >\n <ui.div\n as={motion.div}\n variants={{\n unchecked: { scale: 0.5 },\n checked: { scale: 1 },\n }}\n initial=\"unchecked\"\n animate=\"checked\"\n exit=\"unchecked\"\n style={\n {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n } as CSSProperties\n }\n >\n {isIndeterminate ? (\n <IndeterminateIcon {...iconProps} />\n ) : (\n <CheckIcon {...iconProps} />\n )}\n </ui.div>\n </ui.div>\n ) : null}\n </AnimatePresence>\n )\n}\n\nconst CheckIcon: FC<HTMLUIProps<\"svg\"> & SVGMotionProps<SVGSVGElement>> = (\n props,\n) => {\n return (\n <ui.svg\n as={motion.svg}\n width=\"1.2em\"\n viewBox=\"0 0 12 10\"\n variants={{\n unchecked: {\n opacity: 0,\n strokeDashoffset: 16,\n },\n checked: {\n opacity: 1,\n strokeDashoffset: 0,\n transition: { duration: 0.2 },\n },\n }}\n style={{\n fill: \"none\",\n strokeWidth: 2,\n stroke: \"currentColor\",\n strokeDasharray: 16,\n }}\n {...props}\n >\n <polyline points=\"1.5 6 4.5 9 10.5 1\" />\n </ui.svg>\n )\n}\n\nconst IndeterminateIcon: FC<\n HTMLUIProps<\"svg\"> & SVGMotionProps<SVGSVGElement>\n> = (props) => {\n return (\n <ui.svg\n as={motion.svg}\n width=\"1.2em\"\n viewBox=\"0 0 24 24\"\n variants={{\n unchecked: {\n scaleX: 0.65,\n opacity: 0,\n },\n checked: {\n scaleX: 1,\n opacity: 1,\n transition: {\n scaleX: { duration: 0 },\n opacity: { duration: 0.02 },\n },\n },\n }}\n style={{ stroke: \"currentColor\", strokeWidth: 4 }}\n {...props}\n >\n <line x1=\"21\" x2=\"3\" y1=\"12\" y2=\"12\" />\n </ui.svg>\n )\n}\n","import type { ComponentArgs, ThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport type { FlexProps } from \"@yamada-ui/layouts\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport type { PropGetter, DOMAttributes } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n omitObject,\n useCallbackRef,\n getValidChildren,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent, ForwardedRef, ReactElement, Ref } from \"react\"\nimport { forwardRef, useCallback } from \"react\"\nimport type { CheckboxProps } from \"./checkbox\"\nimport { Checkbox } from \"./checkbox\"\n\nexport type CheckboxItem<Y extends string | number = string> =\n CheckboxProps<Y> & {\n label?: string\n }\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport type UseCheckboxGroupProps<Y extends string | number = string> = {\n /**\n * The value of the checkbox group.\n */\n value?: Y[]\n /**\n * The initial value of the checkbox group.\n */\n defaultValue?: Y[]\n /**\n * The callback fired when any children checkbox is checked or unchecked.\n */\n onChange?: (value: Y[]) => void\n /**\n * If `true`, input elements will receive `checked` attribute instead of `isChecked`.\n *\n * This assumes, you're using native radio inputs.\n *\n * @default false\n */\n isNative?: boolean\n}\n\nexport const useCheckboxGroup = <Y extends string | number = string>({\n isNative,\n ...props\n}: UseCheckboxGroupProps<Y>) => {\n props.onChange = useCallbackRef(props.onChange)\n\n const [value, setValue] = useControllableState({\n value: props.value,\n defaultValue: props.defaultValue || [],\n onChange: props.onChange,\n })\n\n const onChange = useCallback(\n (evOrValue: ChangeEvent<HTMLInputElement> | Y) => {\n const isChecked = isEvent(evOrValue)\n ? evOrValue.target.checked\n : !value.includes(evOrValue)\n\n const selectedValue = (\n isEvent(evOrValue) ? evOrValue.target.value : evOrValue\n ) as Y\n\n const nextValue = isChecked\n ? [...value, selectedValue]\n : value.filter((v) => String(v) !== String(selectedValue))\n\n setValue(nextValue)\n },\n [value, setValue],\n )\n\n const getCheckboxProps: PropGetter<\n DOMAttributes<HTMLInputElement> & { isChecked?: boolean },\n Omit<DOMAttributes<HTMLInputElement>, \"onChange\"> & {\n onChange: (ev: ChangeEvent<HTMLInputElement> | Y) => void\n }\n > = useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref,\n [isNative ? \"checked\" : \"isChecked\"]: value.some(\n (val) => String(props.value) === String(val),\n ),\n onChange,\n }),\n [onChange, isNative, value],\n )\n\n return { value, setValue, onChange, getCheckboxProps }\n}\n\nexport type UseCheckboxGroupReturn<Y extends string | number = string> =\n ReturnType<typeof useCheckboxGroup<Y>>\n\nexport type CheckboxGroupProps<Y extends string | number = string> =\n ThemeProps<\"Checkbox\"> &\n Omit<FlexProps, \"onChange\"> &\n UseCheckboxGroupProps<Y> &\n FormControlOptions & {\n /**\n * If provided, generate checkboxes based on items.\n *\n * @default '[]'\n */\n items?: CheckboxItem<Y>[]\n }\n\ntype CheckboxContext = ThemeProps<\"Checkbox\"> &\n FormControlOptions & {\n value: (string | number)[]\n onChange: (\n evOrValue: ChangeEvent<HTMLInputElement> | string | number,\n ) => void\n }\n\nconst [CheckboxGroupProvider, useCheckboxGroupContext] = createContext<\n CheckboxContext | undefined\n>({\n strict: false,\n name: \"CheckboxGroupContext\",\n})\n\nexport { useCheckboxGroupContext }\n\nexport const CheckboxGroup = forwardRef(\n <Y extends string | number = string>(\n {\n className,\n size,\n variant,\n colorScheme,\n children,\n items = [],\n direction = \"column\",\n gap,\n ...props\n }: CheckboxGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const { value, onChange } = useCheckboxGroup<Y>(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid } =\n useFormControl(props)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length) {\n computedChildren = items.map(({ label, value, ...props }, i) => (\n <Checkbox key={i} value={value} {...props}>\n {label}\n </Checkbox>\n ))\n }\n\n return (\n <CheckboxGroupProvider\n value={\n {\n size,\n variant,\n colorScheme,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n value,\n onChange,\n } as CheckboxContext\n }\n >\n <Flex\n ref={ref}\n className={cx(\"ui-checkbox-group\", className)}\n role=\"group\"\n direction={direction}\n gap={gap ?? (direction === \"row\" ? \"1rem\" : undefined)}\n {...omitObject(props, [\n \"value\",\n \"defaultValue\",\n \"onChange\",\n \"isInvalid\",\n \"isDisabled\",\n \"isRequired\",\n \"isReadOnly\",\n ])}\n >\n {children ?? computedChildren}\n </Flex>\n </CheckboxGroupProvider>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: CheckboxGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nCheckboxGroup.displayName = \"CheckboxGroup\"\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACCA,kBAA2D;AAE3D,IAAAA,uBAIO;AAEP,oBAAwC;AACxC,+BAAkC;AAElC,IAAAC,gBAWO;AAcP,IAAAC,gBAOO;;;AC1CP,0BAA+B;AAE/B,qBAAqB;AACrB,oCAAqC;AAErC,mBAOO;AAEP,mBAAwC;AA+IhC;AAtIR,IAAM,UAAU,CAAC,UACf,aAAS,uBAAS,KAAK,SAAK,uBAAS,MAAM,MAAM;AAyB5C,IAAM,mBAAmB,CAAqC;AAAA,EACnE;AAAA,EACA,GAAG;AACL,MAAgC;AAC9B,QAAM,eAAW,6BAAe,MAAM,QAAQ;AAE9C,QAAM,CAAC,OAAO,QAAQ,QAAI,oDAAqB;AAAA,IAC7C,OAAO,MAAM;AAAA,IACb,cAAc,MAAM,gBAAgB,CAAC;AAAA,IACrC,UAAU,MAAM;AAAA,EAClB,CAAC;AAED,QAAM,eAAW;AAAA,IACf,CAAC,cAAiD;AAChD,YAAM,YAAY,QAAQ,SAAS,IAC/B,UAAU,OAAO,UACjB,CAAC,MAAM,SAAS,SAAS;AAE7B,YAAM,gBACJ,QAAQ,SAAS,IAAI,UAAU,OAAO,QAAQ;AAGhD,YAAM,YAAY,YACd,CAAC,GAAG,OAAO,aAAa,IACxB,MAAM,OAAO,CAAC,MAAM,OAAO,CAAC,MAAM,OAAO,aAAa,CAAC;AAE3D,eAAS,SAAS;AAAA,IACpB;AAAA,IACA,CAAC,OAAO,QAAQ;AAAA,EAClB;AAEA,QAAM,uBAKF;AAAA,IACF,CAACC,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,GAAGA;AAAA,MACH;AAAA,MACA,CAAC,WAAW,YAAY,WAAW,GAAG,MAAM;AAAA,QAC1C,CAAC,QAAQ,OAAOA,OAAM,KAAK,MAAM,OAAO,GAAG;AAAA,MAC7C;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,UAAU,UAAU,KAAK;AAAA,EAC5B;AAEA,SAAO,EAAE,OAAO,UAAU,UAAU,iBAAiB;AACvD;AA0BA,IAAM,CAAC,uBAAuB,uBAAuB,QAAI,4BAEvD;AAAA,EACA,QAAQ;AAAA,EACR,MAAM;AACR,CAAC;AAIM,IAAM,oBAAgB;AAAA,EAC3B,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ,CAAC;AAAA,IACT,YAAY;AAAA,IACZ;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,EAAE,OAAO,SAAS,IAAI,iBAAoB,KAAK;AACrD,UAAM,EAAE,YAAY,YAAY,YAAY,UAAU,QACpD,oCAAe,KAAK;AAEtB,UAAM,oBAAgB,+BAAiB,QAAQ;AAC/C,QAAI,mBAAmC,CAAC;AAExC,QAAI,CAAC,cAAc,UAAU,MAAM,QAAQ;AACzC,yBAAmB,MAAM,IAAI,CAAC,EAAE,OAAO,OAAAC,QAAO,GAAGC,OAAM,GAAG,MACxD,4CAAC,YAAiB,OAAOD,QAAQ,GAAGC,QACjC,mBADY,CAEf,CACD;AAAA,IACH;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,OACE;AAAA,UACE;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QAGF;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,eAAW,iBAAG,qBAAqB,SAAS;AAAA,YAC5C,MAAK;AAAA,YACL;AAAA,YACA,KAAK,oBAAQ,cAAc,QAAQ,SAAS;AAAA,YAC3C,OAAG,yBAAW,OAAO;AAAA,cACpB;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,YACF,CAAC;AAAA,YAEA,wCAAY;AAAA;AAAA,QACf;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAMA,cAAc,cAAc;;;AD0L8B,IAAAC,sBAAA;AAzSnD,IAAM,cAAc,CACzB,UACG;AACH,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,QAAI,0CAAoB,KAAK;AAE7B,QAAM,CAAC,gBAAgB,iBAAiB,QAAI,wBAAkB,KAAK;AACnE,QAAM,CAAC,WAAW,UAAU,QAAI,wBAAkB,KAAK;AACvD,QAAM,CAAC,WAAW,UAAU,QAAI,wBAAkB,KAAK;AACvD,QAAM,CAAC,UAAU,SAAS,QAAI,wBAAkB,KAAK;AAErD,QAAM,eAAW,sBAAyB,IAAI;AAC9C,QAAM,CAAC,SAAS,UAAU,QAAI,wBAAkB,IAAI;AAEpD,QAAM,CAAC,WAAW,YAAY,QAAI,wBAAkB,CAAC,CAAC,gBAAgB;AAEtE,QAAM,eAAe,MAAM,cAAc;AACzC,QAAM,UAAU,eAAgB,MAAM,YAAwB;AAE9D,QAAM,eAAW;AAAA,IACf,CAAC,OAAsC;AA/H3C;AAgIM,UAAI,YAAY,UAAU;AACxB,WAAG,eAAe;AAElB;AAAA,MACF;AAEA,UAAI,CAAC;AACH,qBAAa,CAAC,WAAW,kBAAkB,OAAO,GAAG,OAAO,OAAO;AAErE,iBAAK,aAAL,8BAAgB;AAAA,IAClB;AAAA,IACA,CAAC,UAAU,UAAU,cAAc,SAAS,eAAe;AAAA,EAC7D;AACA,QAAM,aAAS,8BAAe,KAAK,MAAM;AACzC,QAAM,cAAU,8BAAe,KAAK,OAAO;AAE3C,QAAM,gBAAY;AAAA,IAChB,CAAC,EAAE,IAAI,MAA8B;AACnC,UAAI,QAAQ;AAAK,kBAAU,IAAI;AAAA,IACjC;AAAA,IACA,CAAC,SAAS;AAAA,EACZ;AAEA,QAAM,cAAU;AAAA,IACd,CAAC,EAAE,IAAI,MAA8B;AACnC,UAAI,QAAQ;AAAK,kBAAU,KAAK;AAAA,IAClC;AAAA,IACA,CAAC,SAAS;AAAA,EACZ;AAEA,+BAAU,MAAM;AACd,eAAO,4CAAkB,iBAAiB;AAAA,EAC5C,GAAG,CAAC,CAAC;AAEL,yCAAoB,MAAM;AACxB,QAAI,SAAS;AACX,eAAS,QAAQ,gBAAgB,QAAQ,eAAe;AAAA,EAC5D,GAAG,CAAC,eAAe,CAAC;AAEpB,qCAAgB,MAAM;AACpB,QAAI;AAAU,iBAAW,KAAK;AAAA,EAChC,GAAG,CAAC,UAAU,UAAU,CAAC;AAEzB,yCAAoB,MAAM;AA3K5B;AA4KI,QAAI,GAAC,cAAS,YAAT,mBAAkB;AAAM;AAE7B,aAAS,QAAQ,KAAK,UAAU,MAAM,aAAa,CAAC,CAAC,gBAAgB;AAAA,EACvE,GAAG,CAAC,CAAC;AAEL,yCAAoB,MAAM;AACxB,QAAI,CAAC,SAAS;AAAS;AAEvB,QAAI,SAAS,QAAQ,YAAY;AAC/B,mBAAa,SAAS,QAAQ,OAAO;AAAA,EACzC,GAAG,CAAC,SAAS,OAAO,CAAC;AAErB,QAAM,wBAAgC;AAAA,IACpC,CAACC,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,OAAG,0BAAW,MAAM,0CAAqB;AAAA,MACzC,GAAGA;AAAA,MACH,SAAK,yBAAU,KAAK,CAAC,OAAgC;AACnD,YAAI;AAAI,qBAAW,GAAG,YAAY,OAAO;AAAA,MAC3C,CAAC;AAAA,MACD,oBAAgB,wBAAS,OAAO;AAAA,MAChC,aAAS,0BAAWA,OAAM,SAAS,MAAM;AAhM/C;AAiMQ,YAAI;AAAS;AAEb,uBAAS,YAAT,mBAAkB;AAElB,8BAAsB,MAAG;AArMjC,cAAAC;AAqMoC,kBAAAA,MAAA,SAAS,YAAT,gBAAAA,IAAkB;AAAA,SAAO;AAAA,MACvD,CAAC;AAAA,IACH;AAAA,IACA,CAAC,SAAS,SAAS,IAAI;AAAA,EACzB;AAEA,QAAM,mBAA2B;AAAA,IAC/B,CAACD,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,OAAG,0BAAW,MAAM,0CAAqB;AAAA,MACzC,GAAGA;AAAA,MACH;AAAA,MACA,mBAAe,wBAAS,QAAQ;AAAA,MAChC,kBAAc,wBAAS,SAAS;AAAA,MAChC,oBAAgB,wBAAS,OAAO;AAAA,MAChC,kBAAc,wBAAS,SAAS;AAAA,MAChC,0BAAsB,wBAAS,aAAa,cAAc;AAAA,MAC1D,0BAAsB,wBAAS,eAAe;AAAA,MAC9C,eAAe;AAAA,MACf,iBAAa,0BAAWA,OAAM,aAAa,CAAC,OAAyB;AACnE,YAAI;AAAW,aAAG,eAAe;AAEjC,kBAAU,IAAI;AAAA,MAChB,CAAC;AAAA,MACD,eAAW,0BAAWA,OAAM,WAAW,MAAM,UAAU,KAAK,CAAC;AAAA,MAC7D,kBAAc,0BAAWA,OAAM,cAAc,MAAM,WAAW,IAAI,CAAC;AAAA,MACnE,kBAAc,0BAAWA,OAAM,cAAc,MAAM,WAAW,KAAK,CAAC;AAAA,IACtE;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,QAAM,oBAA4B;AAAA,IAChC,CAACA,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,OAAG,0BAAW,MAAM,0CAAqB;AAAA,MACzC,GAAGA;AAAA,MACH,SAAK,yBAAU,UAAU,GAAG;AAAA,MAC5B;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO;AAAA,QACL,QAAQ;AAAA,QACR,MAAM;AAAA,QACN,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,UAAU;AAAA,QACV,YAAY;AAAA,QACZ,UAAU;AAAA,MACZ;AAAA,MACA,cAAU,0BAAWA,OAAM,UAAU,QAAQ;AAAA,MAC7C,YAAQ,0BAAWA,OAAM,QAAQ,QAAQ,MAAM,WAAW,KAAK,CAAC;AAAA,MAChE,aAAS,0BAAWA,OAAM,SAAS,SAAS,MAAM,WAAW,IAAI,CAAC;AAAA,MAClE,eAAW,0BAAWA,OAAM,WAAW,SAAS;AAAA,MAChD,aAAS,0BAAWA,OAAM,SAAS,OAAO;AAAA,IAC5C;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,QAAM,oBAA4B;AAAA,IAChC,CAACA,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,OAAG,0BAAW,MAAM,0CAAqB;AAAA,MACzC,GAAGA;AAAA,MACH;AAAA,MACA,oBAAgB,wBAAS,OAAO;AAAA,MAChC,iBAAa,0BAAWA,OAAM,aAAa,CAAC,OAAuB;AACjE,WAAG,eAAe;AAClB,WAAG,gBAAgB;AAAA,MACrB,CAAC;AAAA,MACD,kBAAc,0BAAWA,OAAM,cAAc,CAAC,OAAuB;AACnE,WAAG,eAAe;AAClB,WAAG,gBAAgB;AAAA,MACrB,CAAC;AAAA,IACH;AAAA,IACA,CAAC,SAAS,IAAI;AAAA,EAChB;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AAgCO,IAAM,eAAW;AAAA,EACtB,CACE,OACA,QACG;AA9VP;AA+VI,UAAM,QAAQ,wBAAwB;AACtC,UAAM,cAAU,qCAAe,KAAK;AACpC,UAAM,CAAC,QAAQ,WAAW,QAAI,oCAAuB,YAAY;AAAA,MAC/D,GAAI,YAAQ,0BAAW,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC;AAAA,MAC5C,GAAG;AAAA,IACL,CAAC;AACD,UAAM;AAAA,MACJ;AAAA,MACA,MAAM;AAAA,MACN,cAAa,oCAAO,eAAP,YAAqB,QAAQ;AAAA,MAC1C,cAAa,oCAAO,eAAP,YAAqB,QAAQ;AAAA,MAC1C,cAAa,oCAAO,eAAP,YAAqB,QAAQ;AAAA,MAC1C,aAAY,oCAAO,cAAP,YAAoB,QAAQ;AAAA,MACxC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,QAAI,4BAAe,WAAW;AAE9B,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,IAAI,YAAY;AAAA,MACd,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,YACE,+BAAO,UAAS,KAAK,QACjB,MAAM,MAAM,SAAS,KAAK,KAAK,IAC/B,KAAK;AAAA,MACX,WACE,+BAAO,aAAY,KAAK,YACpB,uBAAQ,MAAM,UAAU,KAAK,QAAQ,IACrC,KAAK;AAAA,IACb,CAAC;AAED,UAAM,gBAAY,6BAAa,4CAAW,aAAX,YAAuB,6CAAC,gBAAa,GAAI;AAAA,MACtE,OAAO;AAAA,QACL,SAAS,aAAa,kBAAkB,IAAI;AAAA,QAC5C,WAAW,aAAa,kBAAkB,aAAa;AAAA,QACvD,oBAAoB;AAAA,QACpB,oBAAoB;AAAA,MACtB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAED,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC,eAAW,kBAAG,eAAe,SAAS;AAAA,QACrC,GAAG,kBAAkB;AAAA,QACtB,OAAO;AAAA,UACL,QAAQ;AAAA,UACR,UAAU;AAAA,UACV,SAAS;AAAA,UACT,YAAY;AAAA,UACZ,eAAe;AAAA,UACf;AAAA,UACA,GAAG,OAAO;AAAA,QACZ;AAAA,QACC,OAAG,0BAAW,MAAM;AAAA,UACnB;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF,CAAC;AAAA,QAED;AAAA;AAAA,YAAC,eAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACT,GAAG,cAAc,YAAY,GAAG;AAAA;AAAA,UACnC;AAAA,UAEA;AAAA,YAAC,eAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACV,OAAO;AAAA,gBACL,eAAe,aAAa,SAAS;AAAA,gBACrC,UAAU;AAAA,gBACV,SAAS;AAAA,gBACT,YAAY;AAAA,gBACZ,GAAG,OAAO;AAAA,cACZ;AAAA,cACC,GAAG;AAAA,oBACF,0BAAW,gCAAa,EAAE,UAAU,OAAU,GAAG,CAAC,UAAU,CAAC;AAAA,cAC/D;AAAA,cAEC;AAAA;AAAA,UACH;AAAA,UAEA;AAAA,YAAC,eAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACV,OAAO,EAAE,GAAG,OAAO,MAAM;AAAA,cACxB,GAAG,cAAc,UAAU;AAAA,cAE3B;AAAA;AAAA,UACH;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAMA,SAAS,cAAc;AAmBhB,IAAM,eAAsC,CAAC;AAAA,EAClD;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,gBAAY,0BAAW,MAAM;AAAA,IACjC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,SACE,6CAAC,iCAAgB,SAAS,OACvB,6BAAmB,YAClB;AAAA,IAAC,eAAG;AAAA,IAAH;AAAA,MACC,OAAO;AAAA,QACL,UAAU;AAAA,QACV,KAAK;AAAA,QACL,MAAM;AAAA,QACN,WAAW;AAAA,MACb;AAAA,MAEA;AAAA,QAAC,eAAG;AAAA,QAAH;AAAA,UACC,IAAI,qBAAO;AAAA,UACX,UAAU;AAAA,YACR,WAAW,EAAE,OAAO,IAAI;AAAA,YACxB,SAAS,EAAE,OAAO,EAAE;AAAA,UACtB;AAAA,UACA,SAAQ;AAAA,UACR,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,OACE;AAAA,YACE,SAAS;AAAA,YACT,YAAY;AAAA,YACZ,gBAAgB;AAAA,UAClB;AAAA,UAGD,4BACC,6CAAC,qBAAmB,GAAG,WAAW,IAElC,6CAAC,aAAW,GAAG,WAAW;AAAA;AAAA,MAE9B;AAAA;AAAA,EACF,IACE,MACN;AAEJ;AAEA,IAAM,YAAoE,CACxE,UACG;AACH,SACE;AAAA,IAAC,eAAG;AAAA,IAAH;AAAA,MACC,IAAI,qBAAO;AAAA,MACX,OAAM;AAAA,MACN,SAAQ;AAAA,MACR,UAAU;AAAA,QACR,WAAW;AAAA,UACT,SAAS;AAAA,UACT,kBAAkB;AAAA,QACpB;AAAA,QACA,SAAS;AAAA,UACP,SAAS;AAAA,UACT,kBAAkB;AAAA,UAClB,YAAY,EAAE,UAAU,IAAI;AAAA,QAC9B;AAAA,MACF;AAAA,MACA,OAAO;AAAA,QACL,MAAM;AAAA,QACN,aAAa;AAAA,QACb,QAAQ;AAAA,QACR,iBAAiB;AAAA,MACnB;AAAA,MACC,GAAG;AAAA,MAEJ,uDAAC,cAAS,QAAO,sBAAqB;AAAA;AAAA,EACxC;AAEJ;AAEA,IAAM,oBAEF,CAAC,UAAU;AACb,SACE;AAAA,IAAC,eAAG;AAAA,IAAH;AAAA,MACC,IAAI,qBAAO;AAAA,MACX,OAAM;AAAA,MACN,SAAQ;AAAA,MACR,UAAU;AAAA,QACR,WAAW;AAAA,UACT,QAAQ;AAAA,UACR,SAAS;AAAA,QACX;AAAA,QACA,SAAS;AAAA,UACP,QAAQ;AAAA,UACR,SAAS;AAAA,UACT,YAAY;AAAA,YACV,QAAQ,EAAE,UAAU,EAAE;AAAA,YACtB,SAAS,EAAE,UAAU,KAAK;AAAA,UAC5B;AAAA,QACF;AAAA,MACF;AAAA,MACA,OAAO,EAAE,QAAQ,gBAAgB,aAAa,EAAE;AAAA,MAC/C,GAAG;AAAA,MAEJ,uDAAC,UAAK,IAAG,MAAK,IAAG,KAAI,IAAG,MAAK,IAAG,MAAK;AAAA;AAAA,EACvC;AAEJ;","names":["import_form_control","import_utils","import_react","props","value","props","import_jsx_runtime","props","_a"]}
|
package/dist/index.mjs
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@yamada-ui/checkbox",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "1.0.0",
|
|
4
4
|
"description": "Yamada UI checkbox component",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"yamada",
|
|
@@ -26,6 +26,7 @@
|
|
|
26
26
|
"publishConfig": {
|
|
27
27
|
"access": "public"
|
|
28
28
|
},
|
|
29
|
+
"homepage": "https://yamada-ui.com",
|
|
29
30
|
"repository": {
|
|
30
31
|
"type": "git",
|
|
31
32
|
"url": "git+https://github.com/hirotomoyamada/yamada-ui",
|
|
@@ -35,13 +36,13 @@
|
|
|
35
36
|
"url": "https://github.com/hirotomoyamada/yamada-ui/issues"
|
|
36
37
|
},
|
|
37
38
|
"dependencies": {
|
|
38
|
-
"@yamada-ui/core": "0.
|
|
39
|
-
"@yamada-ui/utils": "0.
|
|
40
|
-
"@yamada-ui/layouts": "0.
|
|
41
|
-
"@yamada-ui/form-control": "0.
|
|
42
|
-
"@yamada-ui/motion": "0.
|
|
43
|
-
"@yamada-ui/use-focus-visible": "0.
|
|
44
|
-
"@yamada-ui/use-controllable-state": "0.
|
|
39
|
+
"@yamada-ui/core": "1.0.0",
|
|
40
|
+
"@yamada-ui/utils": "1.0.0",
|
|
41
|
+
"@yamada-ui/layouts": "1.0.0",
|
|
42
|
+
"@yamada-ui/form-control": "1.0.0",
|
|
43
|
+
"@yamada-ui/motion": "1.0.0",
|
|
44
|
+
"@yamada-ui/use-focus-visible": "1.0.0",
|
|
45
|
+
"@yamada-ui/use-controllable-state": "1.0.0"
|
|
45
46
|
},
|
|
46
47
|
"devDependencies": {
|
|
47
48
|
"react": "^18.0.0",
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/checkbox.tsx","../src/checkbox-group.tsx"],"sourcesContent":["import type { HTMLUIProps, ThemeProps, ComponentArgs } from \"@yamada-ui/core\"\nimport { ui, useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n useFormControl,\n useFormControlProps,\n formControlProperties,\n} from \"@yamada-ui/form-control\"\nimport type { SVGMotionProps } from \"@yamada-ui/motion\"\nimport { AnimatePresence, motion } from \"@yamada-ui/motion\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport type { PropGetter } from \"@yamada-ui/utils\"\nimport {\n cx,\n omitObject,\n pickObject,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n handlerAll,\n dataAttr,\n mergeRefs,\n funcAll,\n} from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n ChangeEventHandler,\n CSSProperties,\n FC,\n FocusEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n ReactElement,\n SyntheticEvent,\n ForwardedRef,\n Ref,\n} from \"react\"\nimport {\n cloneElement,\n useCallback,\n useEffect,\n useRef,\n useState,\n forwardRef,\n} from \"react\"\nimport { useCheckboxGroupContext } from \"./checkbox-group\"\n\nexport type UseCheckboxProps<Y extends string | number = string> =\n 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 * The value to be used in the checkbox input.\n */\n value?: Y\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 * 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 * The callback invoked when the checkbox is blurred.\n */\n onBlur?: FocusEventHandler<HTMLInputElement>\n /**\n * The tab-index property of the underlying input element.\n */\n tabIndex?: number\n }\n\nexport const useCheckbox = <Y extends string | number = string>(\n props: UseCheckboxProps<Y>,\n) => {\n const {\n id,\n name,\n value,\n defaultIsChecked,\n tabIndex,\n required,\n disabled,\n readOnly,\n isIndeterminate,\n ...rest\n } = useFormControlProps(props)\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 = props.isChecked !== undefined\n const checked = isControlled ? (props.isChecked 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 rest.onChange?.(ev)\n },\n [readOnly, disabled, isControlled, checked, isIndeterminate],\n )\n const onBlur = useCallbackRef(rest.onBlur)\n const onFocus = useCallbackRef(rest.onFocus)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\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 = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref: mergeRefs(ref, (el: HTMLElement | undefined) => {\n if (el) setIsLabel(el.tagName === \"LABEL\")\n }),\n \"data-checked\": dataAttr(checked),\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, rest],\n )\n\n const getIconProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n \"data-active\": dataAttr(isActive),\n \"data-hover\": dataAttr(isHovered),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n \"data-indeterminate\": dataAttr(isIndeterminate),\n \"aria-hidden\": true,\n onMouseDown: handlerAll(props.onMouseDown, (ev: React.MouseEvent) => {\n if (isFocused) ev.preventDefault()\n\n setActive(true)\n }),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n }),\n [\n isActive,\n checked,\n isFocused,\n isHovered,\n isFocusVisible,\n isIndeterminate,\n rest,\n ],\n )\n\n const getInputProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref: mergeRefs(inputRef, ref),\n id,\n type: \"checkbox\",\n name,\n value,\n tabIndex,\n required,\n disabled,\n readOnly,\n checked,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n width: \"1px\",\n margin: \"-1px\",\n padding: \"0px\",\n overflow: \"hidden\",\n whiteSpace: \"nowrap\",\n position: \"absolute\",\n },\n onChange: handlerAll(props.onChange, onChange),\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onFocus: handlerAll(props.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props.onKeyUp, onKeyUp),\n }),\n [\n rest,\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 ...pickObject(rest, formControlProperties),\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, rest],\n )\n\n return {\n isFocusVisible,\n isFocused,\n isHovered,\n isActive,\n isChecked: checked,\n isIndeterminate,\n getContainerProps,\n getIconProps,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseCheckboxReturn = ReturnType<typeof useCheckbox>\n\ntype CheckboxOptions = {\n /**\n * Props for icon component.\n */\n iconProps?: Omit<HTMLUIProps<\"span\">, \"children\"> & { children: ReactElement }\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 type CheckboxProps<Y extends string | number = string> = Omit<\n HTMLUIProps<\"label\">,\n keyof UseCheckboxProps | \"checked\"\n> &\n ThemeProps<\"Checkbox\"> &\n UseCheckboxProps<Y> &\n CheckboxOptions\n\nexport const Checkbox = forwardRef(\n <Y extends string | number = string>(\n props: CheckboxProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useCheckboxGroupContext()\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Checkbox\", {\n ...(group ? omitObject(group, [\"value\"]) : {}),\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = group?.isRequired ?? control.isRequired,\n isReadOnly = group?.isReadOnly ?? control.isReadOnly,\n isDisabled = group?.isDisabled ?? control.isDisabled,\n isInvalid = group?.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const {\n isChecked,\n isIndeterminate,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n } = useCheckbox({\n ...rest,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked:\n group?.value && rest.value\n ? group.value.includes(rest.value)\n : rest.isChecked,\n onChange:\n group?.onChange && rest.value\n ? funcAll(group.onChange, rest.onChange)\n : rest.onChange,\n })\n\n const cloneIcon = cloneElement(iconProps?.children ?? <CheckboxIcon />, {\n __css: {\n opacity: isChecked || isIndeterminate ? 1 : 0,\n transform: isChecked || isIndeterminate ? \"scale(1)\" : \"scale(0.95)\",\n transitionProperty: \"transform\",\n transitionDuration: \"normal\",\n },\n isIndeterminate,\n isChecked,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n })\n\n return (\n <ui.label\n className={cx(\"ui-checkbox\", className)}\n {...getContainerProps()}\n __css={{\n cursor: \"pointer\",\n position: \"relative\",\n display: \"inline-flex\",\n alignItems: \"center\",\n verticalAlign: \"top\",\n gap,\n ...styles.container,\n }}\n {...omitObject(rest, [\n \"id\",\n \"name\",\n \"value\",\n \"defaultValue\",\n \"defaultIsChecked\",\n \"isChecked\",\n \"isIndeterminate\",\n \"onChange\",\n \"onBlur\",\n \"onFocus\",\n \"tabIndex\",\n ])}\n >\n <ui.input\n className=\"ui-checkbox__input\"\n {...getInputProps(inputProps, ref)}\n />\n\n <ui.span\n className=\"ui-checkbox__icon\"\n __css={{\n pointerEvents: isReadOnly ? \"none\" : undefined,\n position: \"relative\",\n display: \"inline-block\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n {...getIconProps(\n omitObject(iconProps ?? { children: undefined }, [\"children\"]),\n )}\n >\n {cloneIcon}\n </ui.span>\n\n <ui.span\n className=\"ui-checkbox__label\"\n __css={{ ...styles.label }}\n {...getLabelProps(labelProps)}\n >\n {children}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: CheckboxProps<Y> & { ref?: Ref<HTMLInputElement> },\n ): JSX.Element\n} & ComponentArgs\n\nCheckbox.displayName = \"Checkbox\"\n\nexport type CheckboxIconProps = HTMLUIProps<\"svg\"> &\n SVGMotionProps<SVGSVGElement> &\n FormControlOptions & {\n /**\n * If `true`, the icon will be indeterminate.\n *\n * @default false\n */\n isIndeterminate?: boolean\n /**\n * If `true`, the icon will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n }\n\nexport const CheckboxIcon: FC<CheckboxIconProps> = ({\n isIndeterminate,\n isChecked,\n ...rest\n}) => {\n const iconProps = omitObject(rest, [\n \"isRequired\",\n \"isReadOnly\",\n \"isDisabled\",\n \"isInvalid\",\n ])\n\n return (\n <AnimatePresence initial={false}>\n {isIndeterminate || isChecked ? (\n <ui.div\n __css={{\n position: \"absolute\",\n top: \"50%\",\n left: \"50%\",\n transform: \"translate(-50%, -50%)\",\n }}\n >\n <ui.div\n as={motion.div}\n variants={{\n unchecked: { scale: 0.5 },\n checked: { scale: 1 },\n }}\n initial=\"unchecked\"\n animate=\"checked\"\n exit=\"unchecked\"\n style={\n {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n } as CSSProperties\n }\n >\n {isIndeterminate ? (\n <IndeterminateIcon {...iconProps} />\n ) : (\n <CheckIcon {...iconProps} />\n )}\n </ui.div>\n </ui.div>\n ) : null}\n </AnimatePresence>\n )\n}\n\nconst CheckIcon: FC<HTMLUIProps<\"svg\"> & SVGMotionProps<SVGSVGElement>> = (\n props,\n) => {\n return (\n <ui.svg\n as={motion.svg}\n width=\"1.2em\"\n viewBox=\"0 0 12 10\"\n variants={{\n unchecked: {\n opacity: 0,\n strokeDashoffset: 16,\n },\n checked: {\n opacity: 1,\n strokeDashoffset: 0,\n transition: { duration: 0.2 },\n },\n }}\n style={{\n fill: \"none\",\n strokeWidth: 2,\n stroke: \"currentColor\",\n strokeDasharray: 16,\n }}\n {...props}\n >\n <polyline points=\"1.5 6 4.5 9 10.5 1\" />\n </ui.svg>\n )\n}\n\nconst IndeterminateIcon: FC<\n HTMLUIProps<\"svg\"> & SVGMotionProps<SVGSVGElement>\n> = (props) => {\n return (\n <ui.svg\n as={motion.svg}\n width=\"1.2em\"\n viewBox=\"0 0 24 24\"\n variants={{\n unchecked: {\n scaleX: 0.65,\n opacity: 0,\n },\n checked: {\n scaleX: 1,\n opacity: 1,\n transition: {\n scaleX: { duration: 0 },\n opacity: { duration: 0.02 },\n },\n },\n }}\n style={{ stroke: \"currentColor\", strokeWidth: 4 }}\n {...props}\n >\n <line x1=\"21\" x2=\"3\" y1=\"12\" y2=\"12\" />\n </ui.svg>\n )\n}\n","import type { ComponentArgs, ThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport type { FlexProps } from \"@yamada-ui/layouts\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport type { PropGetter, DOMAttributes } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n omitObject,\n useCallbackRef,\n getValidChildren,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent, ForwardedRef, ReactElement, Ref } from \"react\"\nimport { forwardRef, useCallback } from \"react\"\nimport type { CheckboxProps } from \"./checkbox\"\nimport { Checkbox } from \"./checkbox\"\n\nexport type CheckboxItem<Y extends string | number = string> =\n CheckboxProps<Y> & {\n label?: string\n }\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport type UseCheckboxGroupProps<Y extends string | number = string> = {\n /**\n * The value of the checkbox group.\n */\n value?: Y[]\n /**\n * The initial value of the checkbox group.\n */\n defaultValue?: Y[]\n /**\n * The callback fired when any children checkbox is checked or unchecked.\n */\n onChange?: (value: Y[]) => void\n /**\n * If `true`, input elements will receive `checked` attribute instead of `isChecked`.\n *\n * This assumes, you're using native radio inputs.\n *\n * @default false\n */\n isNative?: boolean\n}\n\nexport const useCheckboxGroup = <Y extends string | number = string>({\n isNative,\n ...props\n}: UseCheckboxGroupProps<Y>) => {\n props.onChange = useCallbackRef(props.onChange)\n\n const [value, setValue] = useControllableState({\n value: props.value,\n defaultValue: props.defaultValue || [],\n onChange: props.onChange,\n })\n\n const onChange = useCallback(\n (evOrValue: ChangeEvent<HTMLInputElement> | Y) => {\n const isChecked = isEvent(evOrValue)\n ? evOrValue.target.checked\n : !value.includes(evOrValue)\n\n const selectedValue = (\n isEvent(evOrValue) ? evOrValue.target.value : evOrValue\n ) as Y\n\n const nextValue = isChecked\n ? [...value, selectedValue]\n : value.filter((v) => String(v) !== String(selectedValue))\n\n setValue(nextValue)\n },\n [value, setValue],\n )\n\n const getCheckboxProps: PropGetter<\n DOMAttributes<HTMLInputElement> & { isChecked?: boolean },\n Omit<DOMAttributes<HTMLInputElement>, \"onChange\"> & {\n onChange: (ev: ChangeEvent<HTMLInputElement> | Y) => void\n }\n > = useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref,\n [isNative ? \"checked\" : \"isChecked\"]: value.some(\n (val) => String(props.value) === String(val),\n ),\n onChange,\n }),\n [onChange, isNative, value],\n )\n\n return { value, setValue, onChange, getCheckboxProps }\n}\n\nexport type UseCheckboxGroupReturn<Y extends string | number = string> =\n ReturnType<typeof useCheckboxGroup<Y>>\n\nexport type CheckboxGroupProps<Y extends string | number = string> =\n ThemeProps<\"Checkbox\"> &\n Omit<FlexProps, \"onChange\"> &\n UseCheckboxGroupProps<Y> &\n FormControlOptions & {\n /**\n * If provided, generate checkboxes based on items.\n *\n * @default '[]'\n */\n items?: CheckboxItem<Y>[]\n }\n\ntype CheckboxContext = ThemeProps<\"Checkbox\"> &\n FormControlOptions & {\n value: (string | number)[]\n onChange: (\n evOrValue: ChangeEvent<HTMLInputElement> | string | number,\n ) => void\n }\n\nconst [CheckboxGroupProvider, useCheckboxGroupContext] = createContext<\n CheckboxContext | undefined\n>({\n strict: false,\n name: \"CheckboxGroupContext\",\n})\n\nexport { useCheckboxGroupContext }\n\nexport const CheckboxGroup = forwardRef(\n <Y extends string | number = string>(\n {\n className,\n size,\n variant,\n colorScheme,\n children,\n items = [],\n direction = \"column\",\n gap,\n ...props\n }: CheckboxGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const { value, onChange } = useCheckboxGroup<Y>(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid } =\n useFormControl(props)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length) {\n computedChildren = items.map(({ label, value, ...props }, i) => (\n <Checkbox key={i} value={value} {...props}>\n {label}\n </Checkbox>\n ))\n }\n\n return (\n <CheckboxGroupProvider\n value={\n {\n size,\n variant,\n colorScheme,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n value,\n onChange,\n } as CheckboxContext\n }\n >\n <Flex\n ref={ref}\n className={cx(\"ui-checkbox-group\", className)}\n role=\"group\"\n direction={direction}\n gap={gap ?? (direction === \"row\" ? \"1rem\" : undefined)}\n {...omitObject(props, [\n \"value\",\n \"defaultValue\",\n \"onChange\",\n \"isInvalid\",\n \"isDisabled\",\n \"isRequired\",\n \"isReadOnly\",\n ])}\n >\n {children ?? computedChildren}\n </Flex>\n </CheckboxGroupProvider>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: CheckboxGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nCheckboxGroup.displayName = \"CheckboxGroup\"\n"],"mappings":"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","names":["useFormControl","cx","omitObject","useCallbackRef","useCallback","forwardRef","props","value","props","jsx","useCallbackRef","useCallback","props","_a","forwardRef","useFormControl","omitObject","cx"]}
|