@ariakit/react-core
Version:
Ariakit React core
139 lines (137 loc) • 3.92 kB
JavaScript
"use client";
import {
useMenuItem
} from "../__chunks/K6RNI2CX.js";
import {
useMenuScopedContext
} from "../__chunks/SPU3NB66.js";
import "../__chunks/TGNQMQ45.js";
import "../__chunks/2WDBOH5E.js";
import "../__chunks/RIJYZEV5.js";
import "../__chunks/FIT2LC3L.js";
import "../__chunks/5VQZOHHZ.js";
import "../__chunks/DTXGDDAC.js";
import "../__chunks/MWF5B7KS.js";
import "../__chunks/63N3TCQX.js";
import "../__chunks/FFSBKSAM.js";
import "../__chunks/72IB6YNO.js";
import {
useCheckboxStore
} from "../__chunks/KJ2ELZJV.js";
import {
useCheckbox
} from "../__chunks/7LQR24VD.js";
import "../__chunks/WJ7PHYH7.js";
import "../__chunks/US3TW2XI.js";
import "../__chunks/SWN3JYXT.js";
import "../__chunks/EYKMH5G5.js";
import "../__chunks/XEN5OWJF.js";
import "../__chunks/Q3KUZPD7.js";
import "../__chunks/45YOMIF3.js";
import {
createElement,
createHook,
forwardRef,
memo
} from "../__chunks/ILRXHV7V.js";
import {
useInitialValue
} from "../__chunks/K2XTQB3X.js";
import "../__chunks/YXGXYGQX.js";
// src/menu/menu-item-checkbox.tsx
import { invariant, shallowEqual } from "@ariakit/core/utils/misc";
import { useEffect } from "react";
var TagName = "div";
function getPrimitiveValue(value) {
if (Array.isArray(value)) {
return value.toString();
}
return value;
}
function getValue(storeValue, value, checked) {
if (value === void 0) {
if (Array.isArray(storeValue)) return storeValue;
return !!checked;
}
const primitiveValue = getPrimitiveValue(value);
if (!Array.isArray(storeValue)) {
if (checked) {
return primitiveValue;
}
return storeValue === primitiveValue ? false : storeValue;
}
if (checked) {
if (storeValue.includes(primitiveValue)) {
return storeValue;
}
return [...storeValue, primitiveValue];
}
return storeValue.filter((v) => v !== primitiveValue);
}
var useMenuItemCheckbox = createHook(
function useMenuItemCheckbox2({
store,
name,
value,
checked,
defaultChecked: defaultCheckedProp,
hideOnClick = false,
...props
}) {
const context = useMenuScopedContext();
store = store || context;
invariant(
store,
process.env.NODE_ENV !== "production" && "MenuItemCheckbox must be wrapped in a MenuList or Menu component"
);
const defaultChecked = useInitialValue(defaultCheckedProp);
useEffect(() => {
store == null ? void 0 : store.setValue(name, (prevValue = []) => {
if (!defaultChecked) return prevValue;
return getValue(prevValue, value, true);
});
}, [store, name, value, defaultChecked]);
useEffect(() => {
if (checked === void 0) return;
store == null ? void 0 : store.setValue(name, (prevValue) => {
return getValue(prevValue, value, checked);
});
}, [store, name, value, checked]);
const checkboxStore = useCheckboxStore({
value: store.useState((state) => state.values[name]),
setValue(internalValue) {
store == null ? void 0 : store.setValue(name, () => {
if (checked === void 0) return internalValue;
const nextValue = getValue(internalValue, value, checked);
if (!Array.isArray(nextValue)) return nextValue;
if (!Array.isArray(internalValue)) return nextValue;
if (shallowEqual(internalValue, nextValue)) return internalValue;
return nextValue;
});
}
});
props = {
role: "menuitemcheckbox",
...props
};
props = useCheckbox({
store: checkboxStore,
name,
value,
checked,
...props
});
props = useMenuItem({ store, hideOnClick, ...props });
return props;
}
);
var MenuItemCheckbox = memo(
forwardRef(function MenuItemCheckbox2(props) {
const htmlProps = useMenuItemCheckbox(props);
return createElement(TagName, htmlProps);
})
);
export {
MenuItemCheckbox,
useMenuItemCheckbox
};