@workday/canvas-kit-react/dist/es6/collection/lib/useOverflowListItemMeasure.js

The parent module that contains all Workday Canvas Kit React components

import { createElemPropsHook, useLocalRef, useMountLayout } from '@workday/canvas-kit-react/common';
import { useOverflowListModel } from './useOverflowListModel';
const hiddenStyles = {
    position: 'absolute',
    left: -99999,
};
/**
 * This elemProps hook measures a list item and reports it to an `OverflowListModel`. This is used
 * in overflow detection.
 *
 * ```ts
 * const useMyItem = composeHooks(
 *   useOverflowListItemMeasure,
 *   useListRegisterItem,
 * )
 * ```
 */
export const useOverflowListItemMeasure = createElemPropsHook(useOverflowListModel)((model, ref, elemProps = {}) => {
    const { elementRef, localRef } = useLocalRef(ref);
    const name = elemProps['data-id'] || '';
    useMountLayout(() => {
        if (localRef.current) {
            const styles = getComputedStyle(localRef.current);
            model.events.addItemSize({
                id: name,
                width: localRef.current.offsetWidth +
                    parseFloat(styles.marginLeft) +
                    parseFloat(styles.marginRight),
                height: localRef.current.offsetHeight +
                    parseFloat(styles.marginTop) +
                    parseFloat(styles.marginBottom),
            });
        }
        return () => {
            model.events.removeItemSize({ id: name });
        };
    });
    const hidden = model.state.hiddenIds.includes(name);
    return {
        ref: elementRef,
        'aria-hidden': hidden || undefined,
        style: hidden ? hiddenStyles : {},
        inert: hidden ? '' : undefined,
    };
});