11498110408

Committed 24 Oct 2024 11:12AM UTC coverage: 88.988% (-1.0%) from 89.985%

Build # 11498110408

Build Type

Pull #1281

github

Committed by

web-flow

Commit Message

Merge 7db9f3fef into 815d29bf3

Pull Request Pull Request #1281: feat(Dropdown): refactor component based on Radix primitives

Run Details

1365 of 1745 branches covered (78.22%)

Branch coverage included in aggregate %.

95 of 125 new or added lines in 19 files covered. (76.0%)

1 existing line in 1 file now uncovered.

3330 of 3531 relevant lines covered (94.31%)

61.28 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

80.95

/src/components/Dropdown/DropdownContent/DropdownContent.tsx

import React, { useEffect } from 'react';
import { Content, DropdownMenuContentProps } from '@radix-ui/react-dropdown-menu';
import { bem } from '../../../utils/bem/bem';
import styles from '../Dropdown.scss';

interface Props extends DropdownMenuContentProps {
    /** Ref element used to make the width of the Content equal to the parent width */
    refElement?: React.RefObject<HTMLElement | null>;
}

const { block } = bem('DropdownContent', styles);

export const DropdownContent = React.forwardRef<HTMLElement, Props>(
    ({ refElement, ...rest }, ref) => {
        const [width, setWidth] = React.useState<number>();

        useEffect(() => {
            if (refElement?.current?.offsetWidth) {
                setWidth(refElement.current.offsetWidth);
            }
        }, [refElement, width]);

        return (
            <Content
                ref={ref}
                {...rest}
                {...block(rest)}
                align="start"
                sideOffset={6}
                style={{ minWidth: width }}
            />
        );
    }
);

1	import React, { useEffect } from 'react';	5✔
2	import { Content, DropdownMenuContentProps } from '@radix-ui/react-dropdown-menu';	5✔
3	import { bem } from '../../../utils/bem/bem';	5✔
4	import styles from '../Dropdown.scss';	5✔
5
6	interface Props extends DropdownMenuContentProps {
7	/** Ref element used to make the width of the Content equal to the parent width */
8	refElement?: React.RefObject<HTMLElement \| null>;
9	}
10
11	const { block } = bem('DropdownContent', styles);	5✔
12
13	export const DropdownContent = React.forwardRef<HTMLElement, Props>(	5✔
14	({ refElement, ...rest }, ref) => {	3✔
15	const [width, setWidth] = React.useState<number>();	3✔
16
17	useEffect(() => {	3✔
18	if (refElement?.current?.offsetWidth) {	3!
NEW 19	setWidth(refElement.current.offsetWidth);	×
20	}
21	}, [refElement, width]);
22
23	return (	3✔
24	<Content
25	ref={ref}
26	{...rest}
27	{...block(rest)}
28	align="start"
29	sideOffset={6}
30	style={{ minWidth: width }}
31	/>
32	);
33	}
34	);

textkernel / oneui / 11498110408

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous