@wordpress/components
Version:
UI components for WordPress.
59 lines (56 loc) • 1.57 kB
JavaScript
/**
* External dependencies
*/
import * as Ariakit from '@ariakit/react';
/**
* WordPress dependencies
*/
import { forwardRef, useContext } from '@wordpress/element';
import { Icon, check } from '@wordpress/icons';
/**
* Internal dependencies
*/
import { Context } from './context';
import * as Styled from './styles';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
export const CheckboxItem = forwardRef(function CheckboxItem({
suffix,
children,
disabled = false,
hideOnClick = false,
...props
}, ref) {
const menuContext = useContext(Context);
if (!menuContext?.store) {
throw new Error('Menu.CheckboxItem can only be rendered inside a Menu component');
}
return /*#__PURE__*/_jsxs(Styled.CheckboxItem, {
ref: ref,
...props,
accessibleWhenDisabled: true,
disabled: disabled,
hideOnClick: hideOnClick,
store: menuContext.store,
children: [/*#__PURE__*/_jsx(Ariakit.MenuItemCheck, {
store: menuContext.store,
render: /*#__PURE__*/_jsx(Styled.ItemPrefixWrapper, {})
// Override some ariakit inline styles
,
style: {
width: 'auto',
height: 'auto'
},
children: /*#__PURE__*/_jsx(Icon, {
icon: check,
size: 24
})
}), /*#__PURE__*/_jsxs(Styled.ItemContentWrapper, {
children: [/*#__PURE__*/_jsx(Styled.ItemChildrenWrapper, {
children: children
}), suffix && /*#__PURE__*/_jsx(Styled.ItemSuffixWrapper, {
children: suffix
})]
})]
});
});
//# sourceMappingURL=checkbox-item.js.map