UNPKG

@ariakit/react-core

Version:

Ariakit React core

166 lines (140 loc) 5.36 kB
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); var _HMZCNR7Fcjs = require('./HMZCNR7F.cjs'); var _IRJEBRAWcjs = require('./IRJEBRAW.cjs'); var _Q7F4IQRScjs = require('./Q7F4IQRS.cjs'); var _EMYYI4CZcjs = require('./EMYYI4CZ.cjs'); var _WBFXWJUHcjs = require('./WBFXWJUH.cjs'); var _MZ2HG624cjs = require('./MZ2HG624.cjs'); // src/checkbox/checkbox.tsx var _misc = require('@ariakit/core/utils/misc'); var _react = require('react'); var _jsxruntime = require('react/jsx-runtime'); var TagName = "input"; function setMixed(element, mixed) { if (mixed) { element.indeterminate = true; } else if (element.indeterminate) { element.indeterminate = false; } } function isNativeCheckbox(tagName, type) { return tagName === "input" && (!type || type === "checkbox"); } function getPrimitiveValue(value) { if (Array.isArray(value)) { return value.toString(); } return value; } var useCheckbox = _WBFXWJUHcjs.createHook.call(void 0, function useCheckbox2({ store, name, value: valueProp, checked: checkedProp, defaultChecked, ...props }) { const context = _Q7F4IQRScjs.useCheckboxContext.call(void 0, ); store = store || context; const [_checked, setChecked] = _react.useState.call(void 0, defaultChecked != null ? defaultChecked : false); const checked = _EMYYI4CZcjs.useStoreState.call(void 0, store, (state) => { if (checkedProp !== void 0) return checkedProp; if ((state == null ? void 0 : state.value) === void 0) return _checked; if (valueProp != null) { if (Array.isArray(state.value)) { const primitiveValue = getPrimitiveValue(valueProp); return state.value.includes(primitiveValue); } return state.value === valueProp; } if (Array.isArray(state.value)) return false; if (typeof state.value === "boolean") return state.value; return false; }); const ref = _react.useRef.call(void 0, null); const tagName = _MZ2HG624cjs.useTagName.call(void 0, ref, TagName); const nativeCheckbox = isNativeCheckbox(tagName, props.type); const mixed = checked ? checked === "mixed" : void 0; const isChecked = checked === "mixed" ? false : checked; const disabled = _misc.disabledFromProps.call(void 0, props); const [propertyUpdated, schedulePropertyUpdate] = _MZ2HG624cjs.useForceUpdate.call(void 0, ); _react.useEffect.call(void 0, () => { const element = ref.current; if (!element) return; setMixed(element, mixed); if (nativeCheckbox) return; element.checked = isChecked; if (name !== void 0) { element.name = name; } if (valueProp !== void 0) { element.value = `${valueProp}`; } }, [propertyUpdated, mixed, nativeCheckbox, isChecked, name, valueProp]); const onChangeProp = props.onChange; const onChange = _MZ2HG624cjs.useEvent.call(void 0, (event) => { if (disabled) { event.stopPropagation(); event.preventDefault(); return; } setMixed(event.currentTarget, mixed); if (!nativeCheckbox) { event.currentTarget.checked = !event.currentTarget.checked; schedulePropertyUpdate(); } onChangeProp == null ? void 0 : onChangeProp(event); if (event.defaultPrevented) return; const elementChecked = event.currentTarget.checked; setChecked(elementChecked); store == null ? void 0 : store.setValue((prevValue) => { if (valueProp == null) return elementChecked; const primitiveValue = getPrimitiveValue(valueProp); if (!Array.isArray(prevValue)) { return prevValue === primitiveValue ? false : primitiveValue; } if (elementChecked) { if (prevValue.includes(primitiveValue)) { return prevValue; } return [...prevValue, primitiveValue]; } return prevValue.filter((v) => v !== primitiveValue); }); }); const onClickProp = props.onClick; const onClick = _MZ2HG624cjs.useEvent.call(void 0, (event) => { onClickProp == null ? void 0 : onClickProp(event); if (event.defaultPrevented) return; if (nativeCheckbox) return; onChange(event); }); props = _MZ2HG624cjs.useWrapElement.call(void 0, props, (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _IRJEBRAWcjs.CheckboxCheckedContext.Provider, { value: isChecked, children: element }), [isChecked] ); props = { role: !nativeCheckbox ? "checkbox" : void 0, type: nativeCheckbox ? "checkbox" : void 0, "aria-checked": checked, ...props, ref: _MZ2HG624cjs.useMergeRefs.call(void 0, ref, props.ref), onChange, onClick }; props = _HMZCNR7Fcjs.useCommand.call(void 0, { clickOnEnter: !nativeCheckbox, ...props }); return _misc.removeUndefinedValues.call(void 0, { name: nativeCheckbox ? name : void 0, value: nativeCheckbox ? valueProp : void 0, checked: isChecked, ...props }); } ); var Checkbox = _WBFXWJUHcjs.forwardRef.call(void 0, function Checkbox2(props) { const htmlProps = useCheckbox(props); return _WBFXWJUHcjs.createElement.call(void 0, TagName, htmlProps); }); exports.useCheckbox = useCheckbox; exports.Checkbox = Checkbox;