Support per-type label-badge styling for vertices, not just edges - #2137
Open
giantamoeba wants to merge 1 commit into
Open
Support per-type label-badge styling for vertices, not just edges#2137giantamoeba wants to merge 1 commit into
giantamoeba wants to merge 1 commit into
Conversation
Edge types have always been able to style their own label badge (labelColor, labelBackgroundOpacity, labelBorderColor/Width/Style) via the per-type Cytoscape rule in useGraphStyles.ts. Vertex types could not: VertexVisualStyle carried none of these fields, the styling-file import schema had no vertex-side labelColor/etc, and the per-type node Cytoscape rule only ever emitted background/border/shape -- node label appearance was hardcoded to a single canvas-wide default with no way to override it per type. Folds LabelVisualStyle into VertexVisualStyle (mirroring how EdgeVisualStyle already does), adds the matching fields to the styling file's vertexEntrySchema, and extends createGraphStyles's per-type node rule to emit the same text-* Cytoscape properties the edge rule already does. appDefaultNodeLabelStyle (used by preview/legend UI) is now derived from appDefaultVertexStyle instead of duplicating it, since the label fields live there now.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
Closes #2135.
Edge types can already style their own label badge per type —
labelColor,labelBackgroundOpacity,labelBorderColor,labelBorderWidth, andlabelBorderStyleare all part ofEdgeVisualStyle, accepted by the styling file'sedgeEntrySchema, and read by the per-type Cytoscape rule inuseGraphStyles.ts(edge[type="..."]) to settext-background-color,text-background-opacity,text-border-*, etc.Vertex types have no equivalent.
VertexVisualStylecarried no label fields,vertexEntrySchemasilently dropped anylabelColor/etc a user added to a vertex entry in a styling file, and the per-type node rule (node[type="..."]) only ever emittedbackground-image/color/opacity,border-color/width/opacity/style,shape,width,height— never anytext-*property. Node label appearance was therefore stuck on a single hardcoded canvas-wide default (components/Graph/styles/defaultNodeStyle.ts), with no way to make one vertex type's label look different from another's, even though the exact same mechanism already worked for edges.This PR brings vertex label styling up to parity with edges:
core/StateProvider/graphStyles.ts: folds the existingLabelVisualStyletype intoVertexVisualStyle, the same wayEdgeVisualStylealready does (EdgeVisualStyle = LabelVisualStyle & {...}).appDefaultVertexStylenow carries the label defaults directly (previously split out into a separate, hand-syncedappDefaultNodeLabelStyleconstant used only by preview/legend UI, disconnected from the real canvas default).appDefaultNodeLabelStyleis kept as an export — used byVertexPreview.tsxand a test — but is now derived fromappDefaultVertexStyleinstead of duplicating its values by hand.core/styling/stylingParser.ts: adds the matching optional fields (labelColor,labelBackgroundOpacity,labelBorderColor,labelBorderStyle,labelBorderWidth) tovertexEntrySchema, matchingedgeEntrySchemaexactly, so a styling file can now set them per vertex type and have them round-trip on export.modules/GraphViewer/useGraphStyles.ts: the per-type node rule now emits the sametext-*Cytoscape properties the edge rule already does, computing label text color fromlabelColorthe same way (new Color(...).isDark() ? "#FFFFFF" : "#000000").Not changed: node shape, background, and border resolution are untouched; this only adds the previously-missing label-badge fields alongside them, following the existing per-type/app-default resolution pattern (
resolveVertexStyle) already used for everything else onVertexStyle.Validation
pnpm run check:types— passespnpm run check:lint— 0 warnings, 0 errorspnpm run check:format— passespnpm run test— full suite passes (one pre-existing, unrelated failure insafeSessionStorage.test.tsreproduces identically onmainwith no changes — avi.mocked(logger.warn)assertion that appears environment-dependent, not something this PR touches)useGraphStyles.test.tsx(should apply a vertex type's own label-badge style, not just the app default) asserts a vertex type'slabelColor/labelBackgroundOpacity/labelBorderColor/labelBorderWidth/labelBorderStyleproduce the correspondingtext-*Cytoscape properties and the correct computed text color, mirroring the existing edge-side test; the existing vertex-style test was updated for the now-present label fields in its expected output.Related Issues
Check List
pnpm checkspasses with no errors.pnpm testpasses with no failures.