Skip to content

Commit eee7410

Browse files
committed
tests
1 parent be39514 commit eee7410

File tree

7 files changed

+433
-46
lines changed

7 files changed

+433
-46
lines changed

src/components/ui/ContextMenu/fragments/ContextMenuTrigger.tsx

Lines changed: 12 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,6 @@ export type ContextMenuTriggerProps = {
99
} & MenuPrimitiveProps.Trigger;
1010

1111
const ContextMenuTrigger = ({ children, className, ...props }:ContextMenuTriggerProps) => {
12-
1312
const context = React.useContext(ContextMenuContext);
1413
if (!context) {
1514
console.log('ContextMenuTrigger should be used in the ContextMenuRoot');
@@ -19,21 +18,21 @@ const ContextMenuTrigger = ({ children, className, ...props }:ContextMenuTrigger
1918
const contextTriggerRef = React.useRef<HTMLSpanElement>(null);
2019

2120
const handleContextMenu = (e: React.MouseEvent) => {
22-
e.preventDefault();
23-
if (!contextTriggerRef.current) return;
24-
const rect = contextTriggerRef.current.getBoundingClientRect();
25-
const x = e.clientX - rect.left;
26-
const y = rect.bottom - e.clientY;
27-
28-
setCoords({ x, y });
29-
setIsOpen(true);
30-
};
21+
e.preventDefault();
22+
if (!contextTriggerRef.current) return;
23+
const rect = contextTriggerRef.current.getBoundingClientRect();
24+
const x = e.clientX - rect.left;
25+
const y = rect.bottom - e.clientY;
26+
27+
setCoords({ x, y });
28+
setIsOpen(true);
29+
};
3130

3231
return (
3332
<MenuPrimitive.Trigger className={clsx(`${rootClass}-trigger`, className)} asChild={true} {...props}>
34-
<span ref={contextTriggerRef} onContextMenu={handleContextMenu} onClick={(e) => {e.preventDefault();}}>
35-
{children}
36-
</span>
33+
<span ref={contextTriggerRef} onContextMenu={handleContextMenu} onClick={(e) => { e.preventDefault(); }}>
34+
{children}
35+
</span>
3736
</MenuPrimitive.Trigger>
3837
);
3938
};

src/components/ui/ContextMenu/stories/ContextMenu.stories.tsx

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ export default {
1010
component: ContextMenu
1111
};
1212

13-
const ChevronRight =() => <svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.1584 3.13508C6.35985 2.94621 6.67627 2.95642 6.86514 3.15788L10.6151 7.15788C10.7954 7.3502 10.7954 7.64949 10.6151 7.84182L6.86514 11.8418C6.67627 12.0433 6.35985 12.0535 6.1584 11.8646C5.95694 11.6757 5.94673 11.3593 6.1356 11.1579L9.565 7.49985L6.1356 3.84182C5.94673 3.64036 5.95694 3.32394 6.1584 3.13508Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
13+
const ChevronRight = () => <svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.1584 3.13508C6.35985 2.94621 6.67627 2.95642 6.86514 3.15788L10.6151 7.15788C10.7954 7.3502 10.7954 7.64949 10.6151 7.84182L6.86514 11.8418C6.67627 12.0433 6.35985 12.0535 6.1584 11.8646C5.95694 11.6757 5.94673 11.3593 6.1356 11.1579L9.565 7.49985L6.1356 3.84182C5.94673 3.64036 5.95694 3.32394 6.1584 3.13508Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>;
1414

1515
export const Basic: Story = {
1616
render: () => (
@@ -19,29 +19,29 @@ export const Basic: Story = {
1919
<ContextMenu.Trigger >Right click here</ContextMenu.Trigger>
2020
<ContextMenu.Portal>
2121
<ContextMenu.Content >
22-
<ContextMenu.Item label="Profile">Profile</ContextMenu.Item>
23-
<ContextMenu.Item label="Settings">Settings</ContextMenu.Item>
24-
<ContextMenu.Item label="Notifications">Notifications</ContextMenu.Item>
22+
<ContextMenu.Item label="Profile">Profile</ContextMenu.Item>
23+
<ContextMenu.Item label="Settings">Settings</ContextMenu.Item>
24+
<ContextMenu.Item label="Notifications">Notifications</ContextMenu.Item>
2525
<ContextMenu.Sub >
2626
<ContextMenu.SubTrigger >More Options <ChevronRight /></ContextMenu.SubTrigger>
2727
<ContextMenu.Content >
28-
<ContextMenu.Item label="Help Center">Help Center</ContextMenu.Item>
29-
<ContextMenu.Item label="Feedback">Feedback</ContextMenu.Item>
28+
<ContextMenu.Item label="Help Center">Help Center</ContextMenu.Item>
29+
<ContextMenu.Item label="Feedback">Feedback</ContextMenu.Item>
3030
<ContextMenu.Item label="About">About</ContextMenu.Item>
3131
<ContextMenu.Sub >
3232
<ContextMenu.SubTrigger >Legal <ChevronRight /></ContextMenu.SubTrigger>
3333
<ContextMenu.Content >
34-
<ContextMenu.Item label="Terms of Service">Terms of Service</ContextMenu.Item>
35-
<ContextMenu.Item label="Privacy Policy">Privacy Policy</ContextMenu.Item>
36-
<ContextMenu.Item label="Licenses">Licenses</ContextMenu.Item>
34+
<ContextMenu.Item label="Terms of Service">Terms of Service</ContextMenu.Item>
35+
<ContextMenu.Item label="Privacy Policy">Privacy Policy</ContextMenu.Item>
36+
<ContextMenu.Item label="Licenses">Licenses</ContextMenu.Item>
3737
</ContextMenu.Content>
3838
</ContextMenu.Sub>
39-
<ContextMenu.Item label="Contact">Contact</ContextMenu.Item>
40-
<ContextMenu.Item label="Support">Support</ContextMenu.Item>
39+
<ContextMenu.Item label="Contact">Contact</ContextMenu.Item>
40+
<ContextMenu.Item label="Support">Support</ContextMenu.Item>
4141
</ContextMenu.Content>
4242
</ContextMenu.Sub>
43-
<ContextMenu.Item label="Logout">Logout</ContextMenu.Item>
44-
<ContextMenu.Item label="Switch Account">Switch Account</ContextMenu.Item>
43+
<ContextMenu.Item label="Logout">Logout</ContextMenu.Item>
44+
<ContextMenu.Item label="Switch Account">Switch Account</ContextMenu.Item>
4545
</ContextMenu.Content>
4646
</ContextMenu.Portal>
4747
</ContextMenu.Root>

src/components/ui/DropdownMenu/stories/DropdownMenu.stories.tsx

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -10,39 +10,39 @@ export default {
1010
component: DropdownMenu
1111
};
1212

13-
const ChevronRight =() => <svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.1584 3.13508C6.35985 2.94621 6.67627 2.95642 6.86514 3.15788L10.6151 7.15788C10.7954 7.3502 10.7954 7.64949 10.6151 7.84182L6.86514 11.8418C6.67627 12.0433 6.35985 12.0535 6.1584 11.8646C5.95694 11.6757 5.94673 11.3593 6.1356 11.1579L9.565 7.49985L6.1356 3.84182C5.94673 3.64036 5.95694 3.32394 6.1584 3.13508Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
13+
const ChevronRight = () => <svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.1584 3.13508C6.35985 2.94621 6.67627 2.95642 6.86514 3.15788L10.6151 7.15788C10.7954 7.3502 10.7954 7.64949 10.6151 7.84182L6.86514 11.8418C6.67627 12.0433 6.35985 12.0535 6.1584 11.8646C5.95694 11.6757 5.94673 11.3593 6.1356 11.1579L9.565 7.49985L6.1356 3.84182C5.94673 3.64036 5.95694 3.32394 6.1584 3.13508Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>;
1414

15-
const Hamburger = () => <svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.5 3C1.22386 3 1 3.22386 1 3.5C1 3.77614 1.22386 4 1.5 4H13.5C13.7761 4 14 3.77614 14 3.5C14 3.22386 13.7761 3 13.5 3H1.5ZM1 7.5C1 7.22386 1.22386 7 1.5 7H13.5C13.7761 7 14 7.22386 14 7.5C14 7.77614 13.7761 8 13.5 8H1.5C1.22386 8 1 7.77614 1 7.5ZM1 11.5C1 11.2239 1.22386 11 1.5 11H13.5C13.7761 11 14 11.2239 14 11.5C14 11.7761 13.7761 12 13.5 12H1.5C1.22386 12 1 11.7761 1 11.5Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
15+
const Hamburger = () => <svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.5 3C1.22386 3 1 3.22386 1 3.5C1 3.77614 1.22386 4 1.5 4H13.5C13.7761 4 14 3.77614 14 3.5C14 3.22386 13.7761 3 13.5 3H1.5ZM1 7.5C1 7.22386 1.22386 7 1.5 7H13.5C13.7761 7 14 7.22386 14 7.5C14 7.77614 13.7761 8 13.5 8H1.5C1.22386 8 1 7.77614 1 7.5ZM1 11.5C1 11.2239 1.22386 11 1.5 11H13.5C13.7761 11 14 11.2239 14 11.5C14 11.7761 13.7761 12 13.5 12H1.5C1.22386 12 1 11.7761 1 11.5Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>;
1616
export const Basic: Story = {
1717
render: () => (
1818
<SandboxEditor>
1919
<DropdownMenu.Root customRootClass="" >
2020
<DropdownMenu.Trigger ><Hamburger /></DropdownMenu.Trigger>
2121
<DropdownMenu.Portal>
2222
<DropdownMenu.Content >
23-
<DropdownMenu.Item label="Profile">Profile</DropdownMenu.Item>
24-
<DropdownMenu.Item label="Settings">Settings</DropdownMenu.Item>
25-
<DropdownMenu.Item label="Notifications">Notifications</DropdownMenu.Item>
23+
<DropdownMenu.Item label="Profile">Profile</DropdownMenu.Item>
24+
<DropdownMenu.Item label="Settings">Settings</DropdownMenu.Item>
25+
<DropdownMenu.Item label="Notifications">Notifications</DropdownMenu.Item>
2626
<DropdownMenu.Sub >
2727
<DropdownMenu.SubTrigger >More Options <ChevronRight /></DropdownMenu.SubTrigger>
2828
<DropdownMenu.Content >
29-
<DropdownMenu.Item label="Help Center">Help Center</DropdownMenu.Item>
30-
<DropdownMenu.Item label="Feedback">Feedback</DropdownMenu.Item>
29+
<DropdownMenu.Item label="Help Center">Help Center</DropdownMenu.Item>
30+
<DropdownMenu.Item label="Feedback">Feedback</DropdownMenu.Item>
3131
<DropdownMenu.Item label="About">About</DropdownMenu.Item>
3232
<DropdownMenu.Sub >
3333
<DropdownMenu.SubTrigger >Legal <ChevronRight /></DropdownMenu.SubTrigger>
3434
<DropdownMenu.Content >
35-
<DropdownMenu.Item label="Terms of Service">Terms of Service</DropdownMenu.Item>
36-
<DropdownMenu.Item label="Privacy Policy">Privacy Policy</DropdownMenu.Item>
37-
<DropdownMenu.Item label="Licenses">Licenses</DropdownMenu.Item>
35+
<DropdownMenu.Item label="Terms of Service">Terms of Service</DropdownMenu.Item>
36+
<DropdownMenu.Item label="Privacy Policy">Privacy Policy</DropdownMenu.Item>
37+
<DropdownMenu.Item label="Licenses">Licenses</DropdownMenu.Item>
3838
</DropdownMenu.Content>
3939
</DropdownMenu.Sub>
40-
<DropdownMenu.Item label="Contact">Contact</DropdownMenu.Item>
41-
<DropdownMenu.Item label="Support">Support</DropdownMenu.Item>
40+
<DropdownMenu.Item label="Contact">Contact</DropdownMenu.Item>
41+
<DropdownMenu.Item label="Support">Support</DropdownMenu.Item>
4242
</DropdownMenu.Content>
4343
</DropdownMenu.Sub>
44-
<DropdownMenu.Item label="Logout">Logout</DropdownMenu.Item>
45-
<DropdownMenu.Item label="Switch Account">Switch Account</DropdownMenu.Item>
44+
<DropdownMenu.Item label="Logout">Logout</DropdownMenu.Item>
45+
<DropdownMenu.Item label="Switch Account">Switch Account</DropdownMenu.Item>
4646
</DropdownMenu.Content>
4747
</DropdownMenu.Portal>
4848
</DropdownMenu.Root>

src/core/primitives/Menu/contexts/MenuPrimitiveRootContext.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,10 @@ export interface MenuPrimitiveRootPrimitiveContextProps {
66
isOpen: boolean;
77
setIsOpen: React.Dispatch<React.SetStateAction<boolean>>;
88
refs: {
9-
reference: React.MutableRefObject<Element | null>;
9+
reference: React.MutableRefObject<any>;
1010
floating: React.MutableRefObject<HTMLElement | null>;
1111
domReference: React.MutableRefObject<Element | null>;
12-
setReference(node: Element | null): void;
12+
setReference(node: any): void;
1313
setFloating(node: HTMLElement | null): void;
1414
setPositionReference(node: Element): void;
1515
};

src/core/primitives/Menu/fragments/MenuPrimitivePortal.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ function MenuPrimitivePortal({ children }: { children: React.ReactNode }) {
88
if (!context) return null;
99
const { isOpen } = context;
1010
const [rootElementFound, setRootElementFound] = useState(false);
11-
const rootElement = document.querySelector('#rad-ui-theme-container') || document.body as HTMLElement | null;
11+
const rootElement = (document.querySelector('#rad-ui-theme-container') || document.body) as HTMLElement | null;
1212

1313
useEffect(() => {
1414
if (rootElement) {

src/core/primitives/Menu/fragments/MenuPrimitiveRoot.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ export type MenuPrimitiveRootProps = {
1313
mainAxisOffset?: number
1414
}
1515

16-
export const MenuComponentRoot = ({ children, className, open, onOpenChange, defaultOpen = false, crossAxisOffset = 0 , mainAxisOffset = 0, ...props }: MenuPrimitiveRootProps) => {
16+
export const MenuComponentRoot = ({ children, className, open, onOpenChange, defaultOpen = false, crossAxisOffset = 0, mainAxisOffset = 0, ...props }: MenuPrimitiveRootProps) => {
1717
const [isOpen, setIsOpen] = useControllableState(
1818
open,
1919
defaultOpen,
@@ -42,8 +42,8 @@ export const MenuComponentRoot = ({ children, className, open, onOpenChange, def
4242
}),
4343
Floater.offset({
4444
mainAxis: mainAxisOffset,
45-
crossAxis: crossAxisOffset
46-
}),
45+
crossAxis: crossAxisOffset
46+
})
4747
],
4848
whileElementsMounted: Floater.autoUpdate
4949
});

0 commit comments

Comments
 (0)