schema_version 0.0.3-beta+20251202 Towards all system wide snake_case schema

[softmarshmallow]

before	after	category	context
blendMode	blend_mode	blend	paint and layer blend mode
zIndex	z_index	positioning	layer depth/order
cornerRadius	corner_radius	geometry	uniform corner radius
cornerRadiusTopLeft	corner_radius_top_left	geometry	top-left corner radius
cornerRadiusTopRight	corner_radius_top_right	geometry	top-right corner radius
cornerRadiusBottomRight	corner_radius_bottom_right	geometry	bottom-right corner radius
cornerRadiusBottomLeft	corner_radius_bottom_left	geometry	bottom-left corner radius
cornerSmoothing	corner_smoothing	geometry	corner smoothing factor
vectorNetwork	vector_network	vector	vector network data structure
layoutWrap	layout_wrap	layout	flex wrap behavior
mainAxisAlignment	main_axis_alignment	layout	flex main axis alignment
crossAxisAlignment	cross_axis_alignment	layout	flex cross axis alignment
mainAxisGap	main_axis_gap	layout	gap in main axis direction
crossAxisGap	cross_axis_gap	layout	gap in cross axis direction
paddingTop	padding_top	layout	top padding
paddingRight	padding_right	layout	right padding
paddingBottom	padding_bottom	layout	bottom padding
paddingLeft	padding_left	layout	left padding
topLeftRadius	top_left_radius	geometry	top-left radius in object notation
topRightRadius	top_right_radius	geometry	top-right radius in object notation
bottomRightRadius	bottom_right_radius	geometry	bottom-right radius in object notation
bottomLeftRadius	bottom_left_radius	geometry	bottom-left radius in object notation
maxLines	max_lines	text	maximum number of text lines
textAlign	text_align	text	horizontal text alignment
textAlignVertical	text_align_vertical	text	vertical text alignment
textDecorationLine	text_decoration_line	text	text decoration line style
textDecorationStyle	text_decoration_style	text	text decoration style
textDecorationColor	text_decoration_color	text	text decoration color
textDecorationSkipInk	text_decoration_skip_ink	text	text decoration skip ink
textDecorationThickness	text_decoration_thickness	text	text decoration thickness
lineHeight	line_height	text	line height
letterSpacing	letter_spacing	text	letter spacing
wordSpacing	word_spacing	text	word spacing
fontSize	font_size	text	font size
fontFamily	font_family	text	font family name
fontWeight	font_weight	text	font weight
fontWidth	font_width	text	font width/stretch
fontStyleItalic	font_style_italic	text	italic style flag
fontKerning	font_kerning	text	font kerning flag
fontFeatures	font_features	text	OpenType font features
fontVariations	font_variations	text	font variation settings
fontOpticalSizing	font_optical_sizing	text	optical sizing mode
fontPostscriptName	font_postscript_name	text	PostScript font name
textTransform	text_transform	text	text transform mode
strokeWidth	stroke_width	stroke	stroke width
strokeWidthProfile	stroke_width_profile	stroke	variable width profile
strokeLeftWidth	stroke_left_width	stroke	left stroke width
strokeTopWidth	stroke_top_width	stroke	top stroke width
strokeRightWidth	stroke_right_width	stroke	right stroke width
strokeBottomWidth	stroke_bottom_width	stroke	bottom stroke width
strokeAlign	stroke_align	stroke	stroke alignment
strokeCap	stroke_cap	stroke	stroke cap style
strokeJoin	stroke_join	stroke	stroke join style
strokeMiterLimit	stroke_miter_limit	stroke	stroke miter limit
strokeDashArray	stroke_dash_array	stroke	stroke dash pattern
strokeDasharray	stroke_dash_array	stroke	stroke dash pattern (alias)
feShadows	fe_shadows	effects	shadow effects array
feBlur	fe_blur	effects	layer blur effect
feBackdropBlur	fe_backdrop_blur	effects	backdrop blur effect
feLiquidGlass	fe_liquid_glass	effects	liquid glass effect
feNoises	fe_noises	effects	noise effects array
lightIntensity	light_intensity	effects	glass light intensity
lightAngle	light_angle	effects	glass light angle
noiseSize	noise_size	effects	noise grain size
numOctaves	num_octaves	effects	noise octaves count
pointCount	point_count	geometry	polygon point count
innerRadius	inner_radius	geometry	inner radius for shapes
angleOffset	angle_offset	geometry	angle offset for ellipse/arc
borderWidth	border_width	border	CSS border width
borderColor	border_color	border	CSS border color
borderStyle	border_style	border	CSS border style
backgroundColor	background_color	scene	scene background color
quarterTurns	quarter_turns	paint	image rotation in quarter turns
maxLength	max_length	text	maximum text length
fillRule	fill_rule	vector	SVG path fill rule

---

Note

Migrate the entire canvas schema and codebase to snake_case, bump schema version, and update IO, renderers, editor UI, effects, and docs accordingly.

• Schema & Versioning:
  • Global migration from mixed/camelCase to snake_case across all schema fields (e.g., blend_mode, z_index, corner_radius, vector_network, text, stroke, padding, layout, effects, border, scene, paint, SVG fill_rule).
  • Bump schema version to 0.0.3-beta+20251202 and package @grida/canvas-wasm to 0.0.86-canary.0.
• Runtime/IO & Renderers:
  • Update serde (aliases retained) and mapping utilities (SVG, Figma, archive/clipboard) to new field names.
  • Adjust react renderers and utilities to snake_case props (nodes, paints, paths).
• Editor & Controls:
  • Refactor reducers, actions, state, and UI controls (text, stroke, padding, corner radius, effects, gap) to snake_case.
  • Update effect fields (noise, liquid glass) and blending keys to blend_mode.
• Docs:
  • Add naming conventions doc formalizing snake_case as canonical.
• Artifacts:
  • Refresh WASM binary and demo data/assets to new schema.

^{Written by Cursor Bugbot for commit b33d60c. This will update automatically on new commits. Configure here.}

Summary by CodeRabbit

• Chores
  • Updated document schema version to 0.0.3-beta+20251202
  • Normalized property naming conventions across all document types and API surfaces for improved consistency and standardization

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Comments	Updated (UTC)
docs	Ready	Preview	Comment	Dec 2, 2025 10:52am
grida	Ready	Preview	Comment	Dec 2, 2025 10:52am

5 Skipped Deployments

Project	Deployment	Preview	Comments	Updated (UTC)
code	Ignored			Dec 2, 2025 10:52am
legacy	Ignored			Dec 2, 2025 10:52am
backgrounds	Skipped			Dec 2, 2025 10:52am
blog	Skipped			Dec 2, 2025 10:52am
viewer	Skipped			Dec 2, 2025 10:52am

[coderabbitai]

Note

Other AI code review bot(s) detected

CodeRabbit has detected other AI code review bot(s) in this pull request and will avoid duplicating their findings in the review comments. This may lead to a less comprehensive review.

Walkthrough

Large-scale schema migration from camelCase to snake_case across data models, React components, state reducers, CSS utilities, I/O converters, and example documents. Version bumped to 0.0.3-beta. No behavioral or control-flow changes; purely property naming convention updates.

Changes

Cohort / File(s)	Summary
Schema & Type Definitions packages/grida-canvas-schema/grida.ts, crates/grida-canvas/src/io/io_grida.rs	Updated public interface field names from camelCase to snake_case (e.g., backgroundColor → background_color, strokeWidth → stroke_width, fontFamily → font_family). Exposed additional public fields in JSONSceneNode and JSONUnknownNodeProperties (id, name, active, locked). Schema version updated to 0.0.3-beta+20251202.
Data Models & Canvas Graphics packages/grida-canvas-cg/lib.ts	Renamed public fields in Path, SolidPaint, gradient paints, ImagePaint, FeLiquidGlass, and FeNoise (e.g., fillRule → fill_rule, blendMode → blend_mode, quarterTurns → quarter_turns, lightIntensity → light_intensity).
React DOM Renderers editor/grida-canvas-react-renderer-dom/nodes/*.tsx (ellipse, line, polygon, polyline, rectangle, star, text, vector, svg-path)	Updated component prop signatures from camelCase to snake_case (e.g., strokeWidth → stroke_width, pointCount → point_count, cornerRadius* → corner_radius_*, fillRule → fill_rule, maxLines → max_lines).
State Management & Hooks editor/grida-canvas-react/provider.tsx, editor/grida-canvas-react/use-mixed-properties.ts, editor/grida-canvas-react/use-sub-vector-network-editor.ts, editor/grida-canvas-react/viewport/surface*.ts	Updated public hook APIs and internal state mappings to snake_case (e.g., cornerRadius → corner_radius, blendMode → blend_mode, mainAxisGap → main_axis_gap, letterSpacing → letter_spacing).
Reducers & Document State editor/grida-canvas/reducers/node.reducer.ts, editor/grida-canvas/reducers/document.reducer.ts, editor/grida-canvas/reducers/event-target*.ts, editor/grida-canvas/reducers/methods/*.ts	Replaced all node property keys from camelCase to snake_case in payload construction, apply logic, and state initialization (e.g., cornerRadius → corner_radius, zIndex → z_index, vectorNetwork → vector_network, mainAxisAlignment → main_axis_alignment).
Editor Actions & Query editor/grida-canvas/action.ts, editor/grida-canvas/editor.ts, editor/grida-canvas/editor.i.ts, editor/grida-canvas/query/index.ts	Updated public API signatures and dispatch payloads to use snake_case property keys (e.g., backgroundColor → background_color, gap: { mainAxisGap, crossAxisGap } → { main_axis_gap, cross_axis_gap }). Updated DEFAULT_TEXT_STYLE_INTER and DEFAULT_FE_* configs.
CSS Utilities editor/grida-canvas-utils/css.ts, editor/grida-canvas-utils/css.test.ts	Updated style property processing and React CSS output to use snake_case input/output keys (e.g., textAlign → text_align, borderStyle → border_style, cornerRadius → corner_radius, fontFamily → font_family).
UI Controls & Sidecontrol editor/scaffolds/sidecontrol/controls/*.tsx, editor/scaffolds/sidecontrol/sidecontrol-*.tsx	Updated property bindings and state mappings in all controls (gap, padding, border, corner-radius, strokes, arc, paint, fe, text) from camelCase to snake_case. Updated component value/onValueChange contracts.
I/O Converters packages/grida-canvas-io-figma/lib.ts, packages/grida-canvas-io-svg/lib.ts	Updated node factory outputs and conversion logic to emit snake_case properties (e.g., blendMode → blend_mode, zIndex → z_index, borderWidth → border_width, vectorNetwork → vector_network, fillRule → fill_rule).
Example Documents crates/grida-canvas-wasm/example/*.grida, editor/public/examples/canvas/*.grida	Updated all serialized .grida JSON files to use snake_case property keys and bumped version to 0.0.3-beta+20251202. Affected all node types (text, containers, images, vectors, shapes) and style properties.
Component Templates & Init editor/grida-canvas-hosted/playground/widgets/index.ts, editor/grida-canvas-hosted/distro.ts, editor/scaffolds/editor/init.ts, editor/theme/templates/formstart/*.tsx	Updated public widget definitions, document initialization, and template data shapes to use snake_case property names. Updated schema version checks to 0.0.3-beta+20251202.
Test Fixtures editor/grida-canvas/reducers/__tests__/*.test.ts, packages/grida-canvas-io/__tests__/*.test.ts	Updated test data and fixtures to reflect new snake_case property names and version bump.
Miscellaneous Updates editor/grida-canvas-react/use-data-transfer.ts, editor/grida-canvas/utils/properties.ts, editor/grida-canvas/utils/cmd-tree.ts, editor/grida-canvas-react/renderer.tsx, editor/grida-canvas-react/viewport/ui/corner-radius-handle.tsx, editor/grida-canvas-hosted/playground/toolbar.tsx, editor/grida-canvas-hosted/ai/tools/canvas-use.ts, editor/scaffolds/editor/editor.tsx, editor/scaffolds/editor/sync/agent-startpage.sync.tsx	Updated property access patterns and payload construction across various utilities, data transfer logic, and sync operations to use snake_case keys.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~40 minutes

• Scope: Extensive (100+ files across all layers: schema, I/O, React components, reducers, utilities, tests, examples)
• Complexity per file: Low (straightforward property renames with no logic changes)
• Pattern homogeneity: High (same camelCase → snake_case migration applied consistently across codebase reduces per-file cognitive load)
• Breaking changes: Multiple (public API signatures, component props, payloads, serialized data structures)

Areas requiring extra attention:

• Consistency verification: Spot-check that camelCase → snake_case renames are complete and consistent across all layers (schema, I/O, reducers, components, utilities)
• Public API breakage: Verify that all consumer code referencing renamed properties has been updated (e.g., component props, hook return types, reducer payloads, action constructors)
• Serialization round-trip: Ensure deserialization handles both old (camelCase) and new (snake_case) formats if backward compatibility is required; confirm .grida example migrations are consistent
• Cross-layer alignment: Verify the entire pipeline is aligned (schema → I/O → reducer → component rendering) with consistent snake_case usage

Possibly related PRs

• Grida Canvas - Layout (prep) - Scene Graph #432: Overlaps at schema changes and crates/grida-canvas/src/io/io_grida.rs (scene-graph and ID handling refactor)
• Grida Canvas - Flex layout #437: Direct code-level connection through layout-related field renames (main_axis_gap, main_axis_alignment, layout_wrap, layout_child)
• Grida Canvas - Advanced Stroke Styles dasharray, join, cap and stroke rect width #444: Overlaps with stroke property renames (stroke_width, stroke_cap, stroke_join, stroke_dash_array, per-side stroke widths)

Suggested labels

canvas, canvas/io, breaking, refactor

Poem

🐰 The naming hops from camelCase to snake,
A schema-wide migration for migration's sake,
With stroke_width and corner_radius true,
A hundred files now dressed in snake's debut!
No logic bent, just naming reformed,
The codebase modernized, refined, and transformed. 🐇

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 60.87% which is insufficient. The required threshold is 80.00%.	You can run @coderabbitai generate docstrings to improve docstring coverage.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The PR title clearly summarizes the main change: a system-wide migration from camelCase to snake_case naming convention in the schema. The title is specific, concise, and directly represents the dominant change across the codebase.

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch chore/snake-case-schema

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[cursor]

This is the final PR Bugbot will review for you during this billing cycle

Your free Bugbot reviews will reset on January 5

Details

You are on the Bugbot Free tier. On this plan, Bugbot will review limited PRs each billing cycle.

To receive Bugbot reviews on all of your PRs, visit the Cursor dashboard to activate Pro and start your 14-day free trial.