In this article, we will review a function named toolbar_value_to_cursormode in Grida source code.
This function is called in another function setCursorMode
<ToolsGroup value={value} options={[ { value: "cursor", label: "Cursor", shortcut: "V" }, { value: "hand", label: "Hand tool", shortcut: "H" }, ]} onValueChange={(v) => { setCursorMode(toolbar_value_to_cursormode(v as ToolbarToolType)); }} /> setCursorMode is used in a component called PlaygroundToolbar.
toolbar_value_cursormode
This function is defined in forms/grida-react-canvas/toolbar/index.ts.
export function toolbar_value_to_cursormode(tt: ToolbarToolType): CursorMode { switch (tt) { case "cursor": return { type: "cursor" }; case "hand": return { type: "hand" }; case "container": case "ellipse": case "image": case "rectangle": case "text": return { type: "insert", node: tt }; case "line": case "pencil": return { type: "draw", tool: tt }; case "path": return { type: "path" }; default: return { type: "cursor" }; } } This is a simple function using switch-case, based on the value passed as an argument, an object containing type is returned.
For example, if you click on rectangle in the toolbar:
The below object is returned
{ type: "insert", node: tt }; About me:
Hey, my name is Ramu Narasinga. I study large open-source projects and create content about their codebase architecture and best practices, sharing it through articles, videos.
I am open to work on interesting projects. Send me an email at ramu.narasinga@gmail.com
My Github — https://github.com/ramu-narasinga
My website — https://ramunarasinga.com
My Youtube channel — https://www.youtube.com/@ramu-narasinga
Learning platform — https://thinkthroo.com
Codebase Architecture — https://app.thinkthroo.com/architecture
Best practices — https://app.thinkthroo.com/best-practices
Production-grade projects — https://app.thinkthroo.com/production-grade-projects
Top comments (0)