docs(graph-layers): replace deprecated graph style constants with strings

docs/modules/graph-layers/api-reference/styling/edge/edge-style-flow.md

@@ -19,7 +19,7 @@ while still rendering a static highlight.
 
 ```js
 {
-  type: EDGE_DECORATOR_TYPE.FLOW,
+  type: 'flow',
   color: '#22D3EE',
   width: 2,
   speed: edge => edge.capacity > 0 ? edge.load / edge.capacity : 0,
@@ -31,7 +31,7 @@ To create directional emphasis only while hovering:
 
 ```js
 {
-  type: EDGE_DECORATOR_TYPE.FLOW,
+  type: 'flow',
   color: '#FACC15',
   width: 3,
   speed: {

docs/modules/graph-layers/api-reference/styling/edge/edge-style-label.md

@@ -26,7 +26,7 @@ like the base edge style.
 
 ```js
 {
-  type: EDGE_DECORATOR_TYPE.LABEL,
+  type: 'edge-label',
   text: edge => `${edge.weight} ms`,
   color: {
     default: '#1F2937',
@@ -41,7 +41,7 @@ To keep labels readable while zooming, disable scaling at small sizes:
 
 ```js
 {
-  type: EDGE_DECORATOR_TYPE.LABEL,
+  type: 'edge-label',
   text: edge => edge.label,
   scaleWithZoom: {
     default: true,

docs/modules/graph-layers/api-reference/styling/edge/edge-style.md

@@ -25,7 +25,7 @@ const edgeStyle = {
 
     },
     {
-      type: EDGE_DECORATOR_TYPE.ARROW,
+      type: 'arrow',
       color: '#222',
       size: 8,
       offset: [4, 0]
@@ -70,13 +70,13 @@ values and their style attributes include:
 
 The following decorator types are available:
 
-* [`'label'`](./edge-style-label.md) - draws text that follows the edge. Supports `text`, `color`,
+* [`'edge-label'`](./edge-style-label.md) - draws text that follows the edge. Supports `text`, `color`,
   `fontSize`, `textAnchor`, `alignmentBaseline`, `scaleWithZoom`, `textMaxWidth`, `textWordBreak`
   and `textSizeMinPixels`..
 * [`'flow'`](./edge-style-flow.md) - animated flow segments to
   communicate direction or magnitude. Supports `color`, `width`, `speed` and
   `tailLength`.
-- `'arrow''`: renders arrowheads for directed edges. Supports `color`, `size` and
+* `'arrow'`: renders arrowheads for directed edges. Supports `color`, `size` and
   `offset`. The `offset` accessor accepts `[along, perpendicular]` distances in layer units, where
   `along` shifts the arrow away from the target node and `perpendicular` offsets it orthogonally
   from the edge.

docs/modules/graph-layers/api-reference/styling/node/node-style-circle.md

@@ -23,7 +23,7 @@ are optional—when omitted the color is treated as fully opaque.
 
 ```js
 {
-  type: NODE_TYPE.CIRCLE,
+  type: 'circle',
   radius: node => 4 + node.outgoingEdges.length,
   fill: {
     default: '#CBD5F5',
@@ -39,12 +39,12 @@ accessors:
 
 ```js
 {
-  type: NODE_TYPE.CIRCLE,
+  type: 'circle',
   radius: 10,
   fill: '#22C55E',
   strokeWidth: {
     default: 0,
-    selected: node => (node.state === NODE_STATE.SELECTED ? 4 : 0)
+    selected: node => (node.state === 'selected' ? 4 : 0)
   },
   stroke: '#052E16'
 }

docs/modules/graph-layers/api-reference/styling/node/node-style-label.md

@@ -25,7 +25,7 @@ support the following keys:
 
 ```js
 {
-  type: NODE_TYPE.LABEL,
+  type: 'label',
   text: node => node.label,
   color: '#E2E8F0',
   fontSize: 16,
@@ -38,7 +38,7 @@ Using selectors you can provide contextual hints:
 
 ```js
 {
-  type: NODE_TYPE.LABEL,
+  type: 'label',
   text: node => node.label,
   color: {
     default: '#64748B',

docs/modules/graph-layers/api-reference/styling/node/node-style-marker.md

@@ -35,7 +35,7 @@ Supported marker names include:
 
 ```js
 {
-  type: NODE_TYPE.MARKER,
+  type: 'marker',
   marker: node => (node.isOffline ? 'triangle-down-filled' : 'circle-filled'),
   size: 18,
   fill: {
@@ -50,7 +50,7 @@ Use selectors to show different icons for interaction states:
 
 ```js
 {
-  type: NODE_TYPE.MARKER,
+  type: 'marker',
   marker: {
     default: 'circle',
     selected: 'star-filled'

docs/modules/graph-layers/api-reference/styling/node/node-style-path-rounded-rectangle.md

@@ -14,13 +14,13 @@ Path rounded rectangles accept the rectangle properties plus:
 | `cornerRadius` | `number \| function` | `0.1` | Corner rounding factor. As with the shader version, `0` is sharp and `1` is fully rounded. |
 
 The width, height, fill, stroke, and strokeWidth options behave identically to
-[`NODE_TYPE.RECTANGLE`](./node-style-rectangle.md).
+the [`'rectangle'` node style](./node-style-rectangle.md).
 
 ## Examples
 
 ```js
 {
-  type: NODE_TYPE.PATH_ROUNDED_RECTANGLE,
+  type: 'path-rounded-rectangle',
   width: node => 120 + node.children.length * 8,
   height: 48,
   cornerRadius: 0.35,
@@ -35,7 +35,7 @@ an interaction:
 
 ```js
 {
-  type: NODE_TYPE.PATH_ROUNDED_RECTANGLE,
+  type: 'path-rounded-rectangle',
   width: 96,
   height: 40,
   cornerRadius: {

docs/modules/graph-layers/api-reference/styling/node/node-style-rectangle.md

@@ -20,7 +20,7 @@ support:
 
 ```js
 {
-  type: NODE_TYPE.RECTANGLE,
+  type: 'rectangle',
   width: 120,
   height: 60,
   fill: '#1F2937',
@@ -34,7 +34,7 @@ node:
 
 ```js
 {
-  type: NODE_TYPE.RECTANGLE,
+  type: 'rectangle',
   width: node => 100 + node.metadata.padding * 2,
   height: 48,
   fill: {

docs/modules/graph-layers/api-reference/styling/node/node-style-rounded-rectangle.md

@@ -21,7 +21,7 @@ polygon resolution.
 
 ```js
 {
-  type: NODE_TYPE.ROUNDED_RECTANGLE,
+  type: 'rounded-rectangle',
   width: 140,
   height: 56,
   cornerRadius: 0.5,
@@ -38,7 +38,7 @@ You can also adjust the radius dynamically to highlight specific groups:
 
 ```js
 {
-  type: NODE_TYPE.ROUNDED_RECTANGLE,
+  type: 'rounded-rectangle',
   width: 110,
   height: 44,
   cornerRadius: node => (node.cluster === 'core' ? 0.35 : 0.15),

docs/modules/graph-layers/api-reference/styling/node/node-style.md

@@ -32,7 +32,7 @@ The following keys are understood by every node style:
 
 | Property | Type | Default | Description |
 | --- | --- | --- | --- |
-| `type` | `NODE_TYPE` constant | - | Selects the visual primitive (circle, rectangle, label, etc.). |
+| `type` | `string` literal | - | Selects the visual primitive (`'circle'`, `'rectangle'`, `'label'`, etc.). |
 | `data` | `function(node) -> any` | `node => node` | Replaces the data object passed to Deck.gl. Useful when a sublayer needs derived data. |
 | `visible` | `boolean` | `true` | Toggles the sublayer on and off without removing it from the style list. |
 | `opacity` | `number \| function` | `1` | Multiplies the alpha channel produced by the primitive. Accepts 0-1. |
@@ -44,7 +44,7 @@ any function; if you use accessors, GraphGL automatically configures Deck.gl’s
 
 ```js
 {
-  type: NODE_TYPE.CIRCLE,
+  type: 'circle',
   radius: node => Math.max(4, node.getPropertyValue('weight')),
   fill: {
     default: '#9CA3AF',
@@ -70,7 +70,7 @@ state. For example, to brighten a node while dragging:
 
 ```js
 {
-  type: NODE_TYPE.CIRCLE,
+  type: 'circle',
   radius: 8,
   fill: '#2563EB',
   ':dragging': {
@@ -103,7 +103,7 @@ rectangle background with a label on top.
 ```js
 const nodeStyle = [
   {
-    type: NODE_TYPE.ROUNDED_RECTANGLE,
+    type: 'rounded-rectangle',
     width: 120,
     height: 48,
     cornerRadius: 0.4,
@@ -112,10 +112,10 @@ const nodeStyle = [
       hover: '#1E293B'
     },
     stroke: '#38BDF8',
-    strokeWidth: node => (node.state === NODE_STATE.SELECTED ? 4 : 1)
+    strokeWidth: node => (node.state === 'selected' ? 4 : 1)
   },
   {
-    type: NODE_TYPE.LABEL,
+    type: 'label',
     text: node => node.label,
     color: '#F8FAFC',
     fontSize: 18