aboutsummaryrefslogtreecommitdiffstats
path: root/packages/excalidraw/components/LaserPointerButton.tsx
diff options
context:
space:
mode:
authorkj_sh6042026-03-15 16:19:35 -0400
committerkj_sh6042026-03-15 16:19:35 -0400
commit6ec259a0e71174651bae95d4628138bf6fd68742 (patch)
tree5e33c6a5ec091ecabfcb257fdc7b6a88ed8754ac /packages/excalidraw/components/LaserPointerButton.tsx
parent16c8578b15c727f22921f8a80a56ee4d4e7f2272 (diff)
refactor: packages/
Diffstat (limited to 'packages/excalidraw/components/LaserPointerButton.tsx')
-rw-r--r--packages/excalidraw/components/LaserPointerButton.tsx41
1 files changed, 41 insertions, 0 deletions
diff --git a/packages/excalidraw/components/LaserPointerButton.tsx b/packages/excalidraw/components/LaserPointerButton.tsx
new file mode 100644
index 0000000..35470f6
--- /dev/null
+++ b/packages/excalidraw/components/LaserPointerButton.tsx
@@ -0,0 +1,41 @@
+import "./ToolIcon.scss";
+
+import clsx from "clsx";
+import type { ToolButtonSize } from "./ToolButton";
+import { laserPointerToolIcon } from "./icons";
+
+type LaserPointerIconProps = {
+ title?: string;
+ name?: string;
+ checked: boolean;
+ onChange?(): void;
+ isMobile?: boolean;
+};
+
+const DEFAULT_SIZE: ToolButtonSize = "small";
+
+export const LaserPointerButton = (props: LaserPointerIconProps) => {
+ return (
+ <label
+ className={clsx(
+ "ToolIcon ToolIcon__LaserPointer",
+ `ToolIcon_size_${DEFAULT_SIZE}`,
+ {
+ "is-mobile": props.isMobile,
+ },
+ )}
+ title={`${props.title}`}
+ >
+ <input
+ className="ToolIcon_type_checkbox"
+ type="checkbox"
+ name={props.name}
+ onChange={props.onChange}
+ checked={props.checked}
+ aria-label={props.title}
+ data-testid="toolbar-LaserPointer"
+ />
+ <div className="ToolIcon__icon">{laserPointerToolIcon}</div>
+ </label>
+ );
+};