How to use @arch-ui/hooks - 2 common examples
To help you get started, we’ve selected a few @arch-ui/hooks examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
keystonejs / keystone / packages / app-admin-ui / client / pages / List / MoreDropdown.js View on Github 
export function MoreDropdown({ listKey, measureRef, isFullWidth, onFullWidthToggle }) {
let { width } = useMeasure(measureRef);
const onReset = useReset(listKey);
const TableIcon = isFullWidth ? FoldIcon : UnfoldIcon;
const tableToggleIsAvailable = width > CONTAINER_WIDTH + CONTAINER_GUTTER * 2;
const items = [
{
content: 'Reset filters, cols, etc.',
icon: ,
id: 'ks-list-dropdown-reset', // for cypress tests
onClick: onReset,
},
{
content: isFullWidth ? 'Collapse table' : 'Expand table',
icon: ,
isDisabled: !tableToggleIsAvailable,
onClick: onFullWidthToggle,const PopperRender = forwardRef(({ scheduleUpdate, editorState, style, children }, ref) => {
let { fragment } = editorState;
let shouldShowToolbar = fragment.text !== '';
let containerRef = useRef(null);
let snapshot = useMeasure(containerRef);
useLayoutEffect(() => {
if (shouldShowToolbar) {
scheduleUpdate();
}
}, [scheduleUpdate, editorState, snapshot, shouldShowToolbar]);
return createPortal(
<div> {
applyRef(ref, node);
applyRef(containerRef, node);
}}
style={style}
css={{</div>@arch-ui/hooks
Custom Hooks used in @arch-ui packages.
