aboutsummaryrefslogtreecommitdiffstats
path: root/packages/excalidraw/components/dropdownMenu/DropdownMenuItemContentRadio.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'packages/excalidraw/components/dropdownMenu/DropdownMenuItemContentRadio.tsx')
-rw-r--r--packages/excalidraw/components/dropdownMenu/DropdownMenuItemContentRadio.tsx51
1 files changed, 51 insertions, 0 deletions
diff --git a/packages/excalidraw/components/dropdownMenu/DropdownMenuItemContentRadio.tsx b/packages/excalidraw/components/dropdownMenu/DropdownMenuItemContentRadio.tsx
new file mode 100644
index 0000000..14bfe1a
--- /dev/null
+++ b/packages/excalidraw/components/dropdownMenu/DropdownMenuItemContentRadio.tsx
@@ -0,0 +1,51 @@
+import { useDevice } from "../App";
+import { RadioGroup } from "../RadioGroup";
+
+type Props<T> = {
+ value: T;
+ shortcut?: string;
+ choices: {
+ value: T;
+ label: React.ReactNode;
+ ariaLabel?: string;
+ }[];
+ onChange: (value: T) => void;
+ children: React.ReactNode;
+ name: string;
+};
+
+const DropdownMenuItemContentRadio = <T,>({
+ value,
+ shortcut,
+ onChange,
+ choices,
+ children,
+ name,
+}: Props<T>) => {
+ const device = useDevice();
+
+ return (
+ <>
+ <div className="dropdown-menu-item-base dropdown-menu-item-bare">
+ <label className="dropdown-menu-item__text" htmlFor={name}>
+ {children}
+ </label>
+ <RadioGroup
+ name={name}
+ value={value}
+ onChange={onChange}
+ choices={choices}
+ />
+ </div>
+ {shortcut && !device.editor.isMobile && (
+ <div className="dropdown-menu-item__shortcut dropdown-menu-item__shortcut--orphaned">
+ {shortcut}
+ </div>
+ )}
+ </>
+ );
+};
+
+DropdownMenuItemContentRadio.displayName = "DropdownMenuItemContentRadio";
+
+export default DropdownMenuItemContentRadio;