@beehexa/design-rules 2611.3.2 → 2611.4.1

package/dist/docs/tokens/diagram.json

@@ -0,0 +1,48 @@
+{
+  "diagram": {
+    "$description": "Operational execution diagrams. Descriptive states are not business statuses; selection is an independent outer ring. See tools/mermaid.",
+    "canvas": { "$type": "color", "$value": "{color.surface.page}", "$description": "Opaque drawing and image-export sheet; pair with node and edge text." },
+    "node-fill": { "$type": "color", "$value": "{color.surface}", "$description": "Default and indeterminate node fill." },
+    "node-border": { "$type": "color", "$value": "{color.border.bold}", "$description": "Meaningful default and indeterminate node boundary." },
+    "node-title": { "$type": "color", "$value": "{color.text}", "$description": "Node title on node-fill." },
+    "node-desc": { "$type": "color", "$value": "{color.text.subtle}", "$description": "Descriptive node and inspector text on neutral surfaces." },
+    "tile-bg": { "$type": "color", "$value": "{color.background.neutral}", "$description": "Step-category glyph plate; not a status." },
+    "tile-glyph": { "$type": "color", "$value": "{color.icon}", "$description": "Step-category glyph on tile-bg." },
+    "state-ran-ok": { "$type": "color", "$value": "{color.text.subtle}", "$description": "Solid boundary of a step that ran without a reported failure. Descriptive completion evidence, not success green or warning orange." },
+    "ran-ok-fill": { "$type": "color", "$value": "{color.surface}", "$description": "Ran step fill; retain text and completion marker as non-colour cues." },
+    "fail-stroke": { "$type": "color", "$value": "{color.border.danger}", "$description": "Failed node boundary; pair with fail-fill and a failure marker." },
+    "fail-fill": { "$type": "color", "$value": "{color.background.danger.subtle}", "$description": "Failed execution node fill." },
+    "fail-title": { "$type": "color", "$value": "{color.text.danger}", "$description": "Failure title on fail-fill." },
+    "fail-desc": { "$type": "color", "$value": "{color.text.danger}", "$description": "Failure description on fail-fill." },
+    "unreached-fill": { "$type": "color", "$value": "{color.surface.subtle}", "$description": "Never-reached node fill; not a disabled control." },
+    "unreached-stroke": { "$type": "color", "$value": "{color.border.bold}", "$description": "Solid never-reached boundary with an explicit state label." },
+    "unreached-title": { "$type": "color", "$value": "{color.text.subtle}", "$description": "Never-reached title on unreached-fill." },
+    "unreached-desc": { "$type": "color", "$value": "{color.text.subtle}", "$description": "Never-reached description on unreached-fill." },
+    "nottaken-stroke": { "$type": "color", "$value": "{color.text.subtle}", "$description": "Dashed not-taken boundary; dashes and label distinguish it from never reached." },
+    "nottaken-fill": { "$type": "color", "$value": "{color.surface}", "$description": "Not-taken branch fill." },
+    "nottaken-title": { "$type": "color", "$value": "{color.text}", "$description": "Not-taken title on nottaken-fill." },
+    "nottaken-desc": { "$type": "color", "$value": "{color.text.subtle}", "$description": "Not-taken description on nottaken-fill." },
+    "badge-bg": { "$type": "color", "$value": "{color.surface}", "$description": "Repeat-count plate; repetition alone is not a warning." },
+    "badge-text": { "$type": "color", "$value": "{color.text.subtle}", "$description": "Descriptive repeat count on badge-bg." },
+    "badge-border": { "$type": "color", "$value": "{color.border.bold}", "$description": "Repeat-count outline." },
+    "edge": { "$type": "color", "$value": "{color.border.bold}", "$description": "Meaningful neutral relation line and arrow." },
+    "edge-label-text": { "$type": "color", "$value": "{color.text.subtle}", "$description": "Relation label on edge-label-bg." },
+    "edge-label-bg": { "$type": "color", "$value": "{color.surface.page}", "$description": "Opaque relation label plate." },
+    "panel-bg": { "$type": "color", "$value": "{color.surface}", "$description": "Inspector evidence surface." },
+    "panel-border": { "$type": "color", "$value": "{color.border}", "$description": "Decorative inspector divider, not an interactive boundary." },
+    "code-bg": { "$type": "color", "$value": "{color.surface}", "$description": "Structured key/value evidence surface; full code blocks use color.code roles." },
+    "code-key": { "$type": "color", "$value": "{color.text.subtle}", "$description": "Evidence field label on code-bg; not a link." },
+    "code-value": { "$type": "color", "$value": "{color.text}", "$description": "Evidence field value on code-bg." },
+    "selection-ring": { "$type": "color", "$value": "{color.border.focus}", "$description": "Independent outer selection/hover ring on canvas; never replace run-state paint." },
+    "node-font": { "$type": "font", "$value": "{font.body.default}", "$description": "Default Mermaid node label; inherits Vietnamese line-height." },
+    "card-width": { "$type": "dimension", "$value": "15rem", "$description": "240px measurable execution-step label card width; preserve fixed layout topology." },
+    "tile-size": { "$type": "dimension", "$value": "2.75rem", "$description": "44px step-category glyph tile inside execution-card labels, not an interaction target." },
+    "glyph-size": { "$type": "dimension", "$value": "2rem", "$description": "32px category symbol ink size within tile-size; this is a glyph, not display text." },
+    "preview-height": { "$type": "dimension", "$value": "45rem", "$description": "720px embedded authoring preview budget shared by the diagram and adjacent step-detail panel; fullscreen fills its host instead." },
+    "minimum-height": { "$type": "dimension", "$value": "20rem", "$description": "320px minimum authoring-preview viewport budget. Read-only split diagrams instead shrink with their enclosing pane." },
+    "evidence-height": { "$type": "dimension", "$value": "13.75rem", "$description": "220px embedded structured-result viewer height; content scrolls within this budget." },
+    "evidence-minimum-height": { "$type": "dimension", "$value": "12rem", "$description": "192px minimum pane budget for multiple request bodies so one expanded part does not hide another." },
+    "padding": { "$type": "dimension", "$value": "{space.100}", "$description": "Internal Mermaid node padding." },
+    "export-padding": { "$type": "dimension", "$value": "{space.300}", "$description": "Breathing room around fitted and exported drawing bounds." }
+  }
+}

package/dist/docs/tokens/editor.json

@@ -0,0 +1,129 @@
+{
+  "editor": {
+    "background": {
+      "$type": "color",
+      "$value": "{color.surface}",
+      "$description": "Editor code canvas; pair with editor.text and syntax roles."
+    },
+    "text": {
+      "$type": "color",
+      "$value": "{color.text}",
+      "$description": "Editor default code foreground."
+    },
+    "gutter": {
+      "$type": "color",
+      "$value": "{color.surface.subtle}",
+      "$description": "Line-number gutter surface."
+    },
+    "lineNumber": {
+      "$type": "color",
+      "$value": "{color.text.subtlest}",
+      "$description": "Line numbers on the gutter."
+    },
+    "selection": {
+      "$type": "color",
+      "$value": "{color.background.selected}",
+      "$description": "Selected code range, with native selection/caret cues."
+    },
+    "lineHighlight": {
+      "$type": "color",
+      "$value": "{color.surface.subtle}",
+      "$description": "Current editor line; caret and gutter provide additional cues."
+    },
+    "cursor": {
+      "$type": "color",
+      "$value": "{color.text}",
+      "$description": "Insertion caret."
+    },
+    "border": {
+      "$type": "color",
+      "$value": "{color.border}",
+      "$description": "Editor frame."
+    },
+    "syntax": {
+      "comment": {
+        "$type": "color",
+        "$value": "{color.text.subtlest}",
+        "$description": "Comments: neutral, readable, no dimming."
+      },
+      "string": {
+        "$type": "color",
+        "$value": "{color.text.success}",
+        "$description": "String literals, not success state indicators."
+      },
+      "number": {
+        "$type": "color",
+        "$value": "{color.text.warning}",
+        "$description": "Numeric literals, not warning state indicators."
+      },
+      "keyword": {
+        "$type": "color",
+        "$value": "{color.text.info}",
+        "$description": "Language keywords, not info state indicators."
+      },
+      "type": {
+        "$type": "color",
+        "$value": "{color.text}",
+        "$description": "Types and identifiers."
+      },
+      "delimiter": {
+        "$type": "color",
+        "$value": "{color.text.subtle}",
+        "$description": "Punctuation and delimiters."
+      }
+    },
+    "diff": {
+      "inserted": {
+        "background": {
+          "$type": "color",
+          "$value": "{color.background.success.subtle}",
+          "$description": "Inserted diff text and lines; show + gutter marker."
+        },
+        "text": {
+          "$type": "color",
+          "$value": "{color.text.success}",
+          "$description": "Inserted diff annotation; + or inserted label required."
+        }
+      },
+      "removed": {
+        "background": {
+          "$type": "color",
+          "$value": "{color.background.danger.subtle}",
+          "$description": "Removed diff text and lines; show − gutter marker."
+        },
+        "text": {
+          "$type": "color",
+          "$value": "{color.text.danger}",
+          "$description": "Removed diff annotation; − or removed label required."
+        }
+      }
+    },
+    "font": {
+      "family": {
+        "$type": "fontFamily",
+        "$value": "{font.family.mono}",
+        "$description": "Editor numeric API family from code.default."
+      },
+      "size": {
+        "$type": "dimension",
+        "$value": "{font.size.200}",
+        "$description": "Editor numeric API size from code.default: 14px nominal."
+      },
+      "lineHeight": {
+        "$type": "dimension",
+        "$value": "1.25rem",
+        "$description": "Editor numeric API line height: 20px nominal; Vietnamese 24px.",
+        "$extensions": {
+          "design.beehexa": {
+            "vi": "1.5rem"
+          }
+        }
+      },
+      "weight": {
+        "$type": "fontWeight",
+        "$value": "{font.weight.regular}",
+        "$description": "Editor code weight."
+      }
+    }
+  }
+}

package/dist/docs/tokens/elevation.json

@@ -4,7 +4,7 @@
       "raised": {
         "$type": "shadow",
         "$value": "0 1px 2px rgb(43 42 40 / 8%), 0 1px 3px rgb(43 42 40 / 6%)",
-        "$description": "Cards that sit on the page.",
+        "$description": "Cards, including cards that only show content, and a card being dragged. Stronger in dark mode.",
         "$extensions": {
           "design.beehexa": {
             "dark": "0 1px 2px rgb(0 0 0 / 40%), 0 1px 3px rgb(0 0 0 / 30%)"
@@ -13,14 +13,24 @@
       },
       "overlay": {
         "$type": "shadow",
-        "$value": "0 24px 80px rgb(43 42 40 / 14%)",
-        "$description": "Dropdowns, popovers and dialogs.",
+        "$value": "0 4px 12px rgb(43 42 40 / 15%)",
+        "$description": "Dropdowns, menus, popovers, select lists and toasts. Pair with color.surface.overlay.",
         "$extensions": {
           "design.beehexa": {
-            "dark": "0 24px 80px rgb(0 0 0 / 50%)"
+            "dark": "0 4px 12px rgb(0 0 0 / 50%)"
+          }
+        }
+      },
+      "modal": {
+        "$type": "shadow",
+        "$value": "0 8px 24px rgb(43 42 40 / 15%)",
+        "$description": "Dialogs, drawers and full sheets that sit on the scrim. Pair with color.surface.overlay.",
+        "$extensions": {
+          "design.beehexa": {
+            "dark": "0 8px 24px rgb(0 0 0 / 50%)"
           }
         }
       }
     }
   }
-}
+}