diff options
| author | kj_sh604 | 2026-03-15 16:19:35 -0400 |
|---|---|---|
| committer | kj_sh604 | 2026-03-15 16:19:35 -0400 |
| commit | 6ec259a0e71174651bae95d4628138bf6fd68742 (patch) | |
| tree | 5e33c6a5ec091ecabfcb257fdc7b6a88ed8754ac /packages/excalidraw/components/ButtonIconCycle.tsx | |
| parent | 16c8578b15c727f22921f8a80a56ee4d4e7f2272 (diff) | |
refactor: packages/
Diffstat (limited to 'packages/excalidraw/components/ButtonIconCycle.tsx')
| -rw-r--r-- | packages/excalidraw/components/ButtonIconCycle.tsx | 29 |
1 files changed, 29 insertions, 0 deletions
diff --git a/packages/excalidraw/components/ButtonIconCycle.tsx b/packages/excalidraw/components/ButtonIconCycle.tsx new file mode 100644 index 0000000..b73a8ec --- /dev/null +++ b/packages/excalidraw/components/ButtonIconCycle.tsx @@ -0,0 +1,29 @@ +import type { JSX } from "react"; +import clsx from "clsx"; + +export const ButtonIconCycle = <T extends any>({ + options, + value, + onChange, + group, +}: { + options: { value: T; text: string; icon: JSX.Element }[]; + value: T | null; + onChange: (value: T) => void; + group: string; +}) => { + const current = options.find((op) => op.value === value); + + const cycle = () => { + const index = options.indexOf(current!); + const next = (index + 1) % options.length; + onChange(options[next].value); + }; + + return ( + <label key={group} className={clsx({ active: current!.value !== null })}> + <input type="button" name={group} onClick={cycle} /> + {current!.icon} + </label> + ); +}; |
