@primer/primitives 11.4.0-rc.daff2d10 → 11.4.0-rc.e472be0d

package/dist/docs/functional/themes/dark-colorblind-high-contrast.json

@@ -38295,6 +38295,10 @@
         "collection": "mode",
         "group": "component (internal)",
         "scopes": ["borderColor", "effectColor"]
+      },
+      "org.primer.llm": {
+        "usage": ["focus-ring", "keyboard-navigation", "accessibility-indicator"],
+        "rules": "Use for focus outlines on interactive elements like buttons, links, and form controls. MUST be visible for keyboard navigation accessibility. Do NOT use for decorative borders or non-interactive elements."
       }
     },
     "filePath": "src/tokens/functional/color/focus.json5",
@@ -38302,11 +38306,16 @@
     "original": {
       "$value": "{borderColor.accent.emphasis}",
       "$type": "color",
+      "$description": "Outline color for focus states on interactive elements",
       "$extensions": {
         "org.primer.figma": {
           "collection": "mode",
           "group": "component (internal)",
           "scopes": ["borderColor", "effectColor"]
+        },
+        "org.primer.llm": {
+          "usage": ["focus-ring", "keyboard-navigation", "accessibility-indicator"],
+          "rules": "Use for focus outlines on interactive elements like buttons, links, and form controls. MUST be visible for keyboard navigation accessibility. Do NOT use for decorative borders or non-interactive elements."
         }
       },
       "key": "{focus.outlineColor}"
@@ -38315,7 +38324,8 @@
     "attributes": {},
     "path": ["focus", "outlineColor"],
     "value": "#409eff",
-    "type": "color"
+    "type": "color",
+    "description": "Outline color for focus states on interactive elements"
   },
   "header-bgColor": {
     "key": "{header.bgColor}",
@@ -47376,6 +47386,10 @@
           "isSource": true,
           "$type": "color"
         }
+      },
+      "org.primer.llm": {
+        "usage": ["text-selection", "highlighted-text", "selected-content"],
+        "rules": "Use for native text selection (::selection) and programmatic text highlighting. Do NOT use for general emphasis or background colors on containers."
       }
     },
     "alpha": 0.7,
@@ -47384,6 +47398,7 @@
     "original": {
       "$value": "{bgColor.accent.emphasis}",
       "$type": "color",
+      "$description": "Background color for text selection highlights",
       "$extensions": {
         "org.primer.figma": {
           "collection": "mode",
@@ -47398,6 +47413,10 @@
             "isSource": true,
             "$type": "color"
           }
+        },
+        "org.primer.llm": {
+          "usage": ["text-selection", "highlighted-text", "selected-content"],
+          "rules": "Use for native text selection (::selection) and programmatic text highlighting. Do NOT use for general emphasis or background colors on containers."
         }
       },
       "alpha": 0.7,
@@ -47407,7 +47426,8 @@
     "attributes": {},
     "path": ["selection", "bgColor"],
     "value": "#194fb1b3",
-    "type": "color"
+    "type": "color",
+    "description": "Background color for text selection highlights"
   },
   "shadow-floating-large": {
     "key": "{shadow.floating.large}",

package/dist/docs/functional/themes/dark-colorblind.json

@@ -38295,6 +38295,10 @@
         "collection": "mode",
         "group": "component (internal)",
         "scopes": ["borderColor", "effectColor"]
+      },
+      "org.primer.llm": {
+        "usage": ["focus-ring", "keyboard-navigation", "accessibility-indicator"],
+        "rules": "Use for focus outlines on interactive elements like buttons, links, and form controls. MUST be visible for keyboard navigation accessibility. Do NOT use for decorative borders or non-interactive elements."
       }
     },
     "filePath": "src/tokens/functional/color/focus.json5",
@@ -38302,11 +38306,16 @@
     "original": {
       "$value": "{borderColor.accent.emphasis}",
       "$type": "color",
+      "$description": "Outline color for focus states on interactive elements",
       "$extensions": {
         "org.primer.figma": {
           "collection": "mode",
           "group": "component (internal)",
           "scopes": ["borderColor", "effectColor"]
+        },
+        "org.primer.llm": {
+          "usage": ["focus-ring", "keyboard-navigation", "accessibility-indicator"],
+          "rules": "Use for focus outlines on interactive elements like buttons, links, and form controls. MUST be visible for keyboard navigation accessibility. Do NOT use for decorative borders or non-interactive elements."
         }
       },
       "key": "{focus.outlineColor}"
@@ -38315,7 +38324,8 @@
     "attributes": {},
     "path": ["focus", "outlineColor"],
     "value": "#1f6feb",
-    "type": "color"
+    "type": "color",
+    "description": "Outline color for focus states on interactive elements"
   },
   "header-bgColor": {
     "key": "{header.bgColor}",
@@ -47376,6 +47386,10 @@
           "isSource": true,
           "$type": "color"
         }
+      },
+      "org.primer.llm": {
+        "usage": ["text-selection", "highlighted-text", "selected-content"],
+        "rules": "Use for native text selection (::selection) and programmatic text highlighting. Do NOT use for general emphasis or background colors on containers."
       }
     },
     "alpha": 0.7,
@@ -47384,6 +47398,7 @@
     "original": {
       "$value": "{bgColor.accent.emphasis}",
       "$type": "color",
+      "$description": "Background color for text selection highlights",
       "$extensions": {
         "org.primer.figma": {
           "collection": "mode",
@@ -47398,6 +47413,10 @@
             "isSource": true,
             "$type": "color"
           }
+        },
+        "org.primer.llm": {
+          "usage": ["text-selection", "highlighted-text", "selected-content"],
+          "rules": "Use for native text selection (::selection) and programmatic text highlighting. Do NOT use for general emphasis or background colors on containers."
         }
       },
       "alpha": 0.7,
@@ -47407,7 +47426,8 @@
     "attributes": {},
     "path": ["selection", "bgColor"],
     "value": "#1f6febb3",
-    "type": "color"
+    "type": "color",
+    "description": "Background color for text selection highlights"
   },
   "shadow-floating-large": {
     "key": "{shadow.floating.large}",

package/dist/docs/functional/themes/dark-dimmed-high-contrast.json

@@ -38285,6 +38285,10 @@
         "collection": "mode",
         "group": "component (internal)",
         "scopes": ["borderColor", "effectColor"]
+      },
+      "org.primer.llm": {
+        "usage": ["focus-ring", "keyboard-navigation", "accessibility-indicator"],
+        "rules": "Use for focus outlines on interactive elements like buttons, links, and form controls. MUST be visible for keyboard navigation accessibility. Do NOT use for decorative borders or non-interactive elements."
       }
     },
     "filePath": "src/tokens/functional/color/focus.json5",
@@ -38292,11 +38296,16 @@
     "original": {
       "$value": "{borderColor.accent.emphasis}",
       "$type": "color",
+      "$description": "Outline color for focus states on interactive elements",
       "$extensions": {
         "org.primer.figma": {
           "collection": "mode",
           "group": "component (internal)",
           "scopes": ["borderColor", "effectColor"]
+        },
+        "org.primer.llm": {
+          "usage": ["focus-ring", "keyboard-navigation", "accessibility-indicator"],
+          "rules": "Use for focus outlines on interactive elements like buttons, links, and form controls. MUST be visible for keyboard navigation accessibility. Do NOT use for decorative borders or non-interactive elements."
         }
       },
       "key": "{focus.outlineColor}"
@@ -38305,7 +38314,8 @@
     "attributes": {},
     "path": ["focus", "outlineColor"],
     "value": "#6cb6ff",
-    "type": "color"
+    "type": "color",
+    "description": "Outline color for focus states on interactive elements"
   },
   "header-bgColor": {
     "key": "{header.bgColor}",
@@ -47366,6 +47376,10 @@
           "isSource": true,
           "$type": "color"
         }
+      },
+      "org.primer.llm": {
+        "usage": ["text-selection", "highlighted-text", "selected-content"],
+        "rules": "Use for native text selection (::selection) and programmatic text highlighting. Do NOT use for general emphasis or background colors on containers."
       }
     },
     "alpha": 0.7,
@@ -47374,6 +47388,7 @@
     "original": {
       "$value": "{bgColor.accent.emphasis}",
       "$type": "color",
+      "$description": "Background color for text selection highlights",
       "$extensions": {
         "org.primer.figma": {
           "collection": "mode",
@@ -47388,6 +47403,10 @@
             "isSource": true,
             "$type": "color"
           }
+        },
+        "org.primer.llm": {
+          "usage": ["text-selection", "highlighted-text", "selected-content"],
+          "rules": "Use for native text selection (::selection) and programmatic text highlighting. Do NOT use for general emphasis or background colors on containers."
         }
       },
       "alpha": 0.7,
@@ -47397,7 +47416,8 @@
     "attributes": {},
     "path": ["selection", "bgColor"],
     "value": "#1b4b91b3",
-    "type": "color"
+    "type": "color",
+    "description": "Background color for text selection highlights"
   },
   "shadow-floating-large": {
     "key": "{shadow.floating.large}",

package/dist/docs/functional/themes/dark-dimmed.json

@@ -38285,6 +38285,10 @@
         "collection": "mode",
         "group": "component (internal)",
         "scopes": ["borderColor", "effectColor"]
+      },
+      "org.primer.llm": {
+        "usage": ["focus-ring", "keyboard-navigation", "accessibility-indicator"],
+        "rules": "Use for focus outlines on interactive elements like buttons, links, and form controls. MUST be visible for keyboard navigation accessibility. Do NOT use for decorative borders or non-interactive elements."
       }
     },
     "filePath": "src/tokens/functional/color/focus.json5",
@@ -38292,11 +38296,16 @@
     "original": {
       "$value": "{borderColor.accent.emphasis}",
       "$type": "color",
+      "$description": "Outline color for focus states on interactive elements",
       "$extensions": {
         "org.primer.figma": {
           "collection": "mode",
           "group": "component (internal)",
           "scopes": ["borderColor", "effectColor"]
+        },
+        "org.primer.llm": {
+          "usage": ["focus-ring", "keyboard-navigation", "accessibility-indicator"],
+          "rules": "Use for focus outlines on interactive elements like buttons, links, and form controls. MUST be visible for keyboard navigation accessibility. Do NOT use for decorative borders or non-interactive elements."
         }
       },
       "key": "{focus.outlineColor}"
@@ -38305,7 +38314,8 @@
     "attributes": {},
     "path": ["focus", "outlineColor"],
     "value": "#316dca",
-    "type": "color"
+    "type": "color",
+    "description": "Outline color for focus states on interactive elements"
   },
   "header-bgColor": {
     "key": "{header.bgColor}",
@@ -47366,6 +47376,10 @@
           "isSource": true,
           "$type": "color"
         }
+      },
+      "org.primer.llm": {
+        "usage": ["text-selection", "highlighted-text", "selected-content"],
+        "rules": "Use for native text selection (::selection) and programmatic text highlighting. Do NOT use for general emphasis or background colors on containers."
       }
     },
     "alpha": 0.7,
@@ -47374,6 +47388,7 @@
     "original": {
       "$value": "{bgColor.accent.emphasis}",
       "$type": "color",
+      "$description": "Background color for text selection highlights",
       "$extensions": {
         "org.primer.figma": {
           "collection": "mode",
@@ -47388,6 +47403,10 @@
             "isSource": true,
             "$type": "color"
           }
+        },
+        "org.primer.llm": {
+          "usage": ["text-selection", "highlighted-text", "selected-content"],
+          "rules": "Use for native text selection (::selection) and programmatic text highlighting. Do NOT use for general emphasis or background colors on containers."
         }
       },
       "alpha": 0.7,
@@ -47397,7 +47416,8 @@
     "attributes": {},
     "path": ["selection", "bgColor"],
     "value": "#316dcab3",
-    "type": "color"
+    "type": "color",
+    "description": "Background color for text selection highlights"
   },
   "shadow-floating-large": {
     "key": "{shadow.floating.large}",

package/dist/docs/functional/themes/dark-high-contrast.json

@@ -38291,6 +38291,10 @@
         "collection": "mode",
         "group": "component (internal)",
         "scopes": ["borderColor", "effectColor"]
+      },
+      "org.primer.llm": {
+        "usage": ["focus-ring", "keyboard-navigation", "accessibility-indicator"],
+        "rules": "Use for focus outlines on interactive elements like buttons, links, and form controls. MUST be visible for keyboard navigation accessibility. Do NOT use for decorative borders or non-interactive elements."
       }
     },
     "filePath": "src/tokens/functional/color/focus.json5",
@@ -38298,11 +38302,16 @@
     "original": {
       "$value": "{borderColor.accent.emphasis}",
       "$type": "color",
+      "$description": "Outline color for focus states on interactive elements",
       "$extensions": {
         "org.primer.figma": {
           "collection": "mode",
           "group": "component (internal)",
           "scopes": ["borderColor", "effectColor"]
+        },
+        "org.primer.llm": {
+          "usage": ["focus-ring", "keyboard-navigation", "accessibility-indicator"],
+          "rules": "Use for focus outlines on interactive elements like buttons, links, and form controls. MUST be visible for keyboard navigation accessibility. Do NOT use for decorative borders or non-interactive elements."
         }
       },
       "key": "{focus.outlineColor}"
@@ -38311,7 +38320,8 @@
     "attributes": {},
     "path": ["focus", "outlineColor"],
     "value": "#409eff",
-    "type": "color"
+    "type": "color",
+    "description": "Outline color for focus states on interactive elements"
   },
   "header-bgColor": {
     "key": "{header.bgColor}",
@@ -47372,6 +47382,10 @@
           "isSource": true,
           "$type": "color"
         }
+      },
+      "org.primer.llm": {
+        "usage": ["text-selection", "highlighted-text", "selected-content"],
+        "rules": "Use for native text selection (::selection) and programmatic text highlighting. Do NOT use for general emphasis or background colors on containers."
       }
     },
     "alpha": 0.7,
@@ -47380,6 +47394,7 @@
     "original": {
       "$value": "{bgColor.accent.emphasis}",
       "$type": "color",
+      "$description": "Background color for text selection highlights",
       "$extensions": {
         "org.primer.figma": {
           "collection": "mode",
@@ -47394,6 +47409,10 @@
             "isSource": true,
             "$type": "color"
           }
+        },
+        "org.primer.llm": {
+          "usage": ["text-selection", "highlighted-text", "selected-content"],
+          "rules": "Use for native text selection (::selection) and programmatic text highlighting. Do NOT use for general emphasis or background colors on containers."
         }
       },
       "alpha": 0.7,
@@ -47403,7 +47422,8 @@
     "attributes": {},
     "path": ["selection", "bgColor"],
     "value": "#194fb1b3",
-    "type": "color"
+    "type": "color",
+    "description": "Background color for text selection highlights"
   },
   "shadow-floating-large": {
     "key": "{shadow.floating.large}",

package/dist/docs/functional/themes/dark-tritanopia-high-contrast.json

@@ -38291,6 +38291,10 @@
         "collection": "mode",
         "group": "component (internal)",
         "scopes": ["borderColor", "effectColor"]
+      },
+      "org.primer.llm": {
+        "usage": ["focus-ring", "keyboard-navigation", "accessibility-indicator"],
+        "rules": "Use for focus outlines on interactive elements like buttons, links, and form controls. MUST be visible for keyboard navigation accessibility. Do NOT use for decorative borders or non-interactive elements."
       }
     },
     "filePath": "src/tokens/functional/color/focus.json5",
@@ -38298,11 +38302,16 @@
     "original": {
       "$value": "{borderColor.accent.emphasis}",
       "$type": "color",
+      "$description": "Outline color for focus states on interactive elements",
       "$extensions": {
         "org.primer.figma": {
           "collection": "mode",
           "group": "component (internal)",
           "scopes": ["borderColor", "effectColor"]
+        },
+        "org.primer.llm": {
+          "usage": ["focus-ring", "keyboard-navigation", "accessibility-indicator"],
+          "rules": "Use for focus outlines on interactive elements like buttons, links, and form controls. MUST be visible for keyboard navigation accessibility. Do NOT use for decorative borders or non-interactive elements."
         }
       },
       "key": "{focus.outlineColor}"
@@ -38311,7 +38320,8 @@
     "attributes": {},
     "path": ["focus", "outlineColor"],
     "value": "#409eff",
-    "type": "color"
+    "type": "color",
+    "description": "Outline color for focus states on interactive elements"
   },
   "header-bgColor": {
     "key": "{header.bgColor}",
@@ -47372,6 +47382,10 @@
           "isSource": true,
           "$type": "color"
         }
+      },
+      "org.primer.llm": {
+        "usage": ["text-selection", "highlighted-text", "selected-content"],
+        "rules": "Use for native text selection (::selection) and programmatic text highlighting. Do NOT use for general emphasis or background colors on containers."
       }
     },
     "alpha": 0.7,
@@ -47380,6 +47394,7 @@
     "original": {
       "$value": "{bgColor.accent.emphasis}",
       "$type": "color",
+      "$description": "Background color for text selection highlights",
       "$extensions": {
         "org.primer.figma": {
           "collection": "mode",
@@ -47394,6 +47409,10 @@
             "isSource": true,
             "$type": "color"
           }
+        },
+        "org.primer.llm": {
+          "usage": ["text-selection", "highlighted-text", "selected-content"],
+          "rules": "Use for native text selection (::selection) and programmatic text highlighting. Do NOT use for general emphasis or background colors on containers."
         }
       },
       "alpha": 0.7,
@@ -47403,7 +47422,8 @@
     "attributes": {},
     "path": ["selection", "bgColor"],
     "value": "#194fb1b3",
-    "type": "color"
+    "type": "color",
+    "description": "Background color for text selection highlights"
   },
   "shadow-floating-large": {
     "key": "{shadow.floating.large}",

package/dist/docs/functional/themes/dark-tritanopia.json

@@ -38293,6 +38293,10 @@
         "collection": "mode",
         "group": "component (internal)",
         "scopes": ["borderColor", "effectColor"]
+      },
+      "org.primer.llm": {
+        "usage": ["focus-ring", "keyboard-navigation", "accessibility-indicator"],
+        "rules": "Use for focus outlines on interactive elements like buttons, links, and form controls. MUST be visible for keyboard navigation accessibility. Do NOT use for decorative borders or non-interactive elements."
       }
     },
     "filePath": "src/tokens/functional/color/focus.json5",
@@ -38300,11 +38304,16 @@
     "original": {
       "$value": "{borderColor.accent.emphasis}",
       "$type": "color",
+      "$description": "Outline color for focus states on interactive elements",
       "$extensions": {
         "org.primer.figma": {
           "collection": "mode",
           "group": "component (internal)",
           "scopes": ["borderColor", "effectColor"]
+        },
+        "org.primer.llm": {
+          "usage": ["focus-ring", "keyboard-navigation", "accessibility-indicator"],
+          "rules": "Use for focus outlines on interactive elements like buttons, links, and form controls. MUST be visible for keyboard navigation accessibility. Do NOT use for decorative borders or non-interactive elements."
         }
       },
       "key": "{focus.outlineColor}"
@@ -38313,7 +38322,8 @@
     "attributes": {},
     "path": ["focus", "outlineColor"],
     "value": "#1f6feb",
-    "type": "color"
+    "type": "color",
+    "description": "Outline color for focus states on interactive elements"
   },
   "header-bgColor": {
     "key": "{header.bgColor}",
@@ -47374,6 +47384,10 @@
           "isSource": true,
           "$type": "color"
         }
+      },
+      "org.primer.llm": {
+        "usage": ["text-selection", "highlighted-text", "selected-content"],
+        "rules": "Use for native text selection (::selection) and programmatic text highlighting. Do NOT use for general emphasis or background colors on containers."
       }
     },
     "alpha": 0.7,
@@ -47382,6 +47396,7 @@
     "original": {
       "$value": "{bgColor.accent.emphasis}",
       "$type": "color",
+      "$description": "Background color for text selection highlights",
       "$extensions": {
         "org.primer.figma": {
           "collection": "mode",
@@ -47396,6 +47411,10 @@
             "isSource": true,
             "$type": "color"
           }
+        },
+        "org.primer.llm": {
+          "usage": ["text-selection", "highlighted-text", "selected-content"],
+          "rules": "Use for native text selection (::selection) and programmatic text highlighting. Do NOT use for general emphasis or background colors on containers."
         }
       },
       "alpha": 0.7,
@@ -47405,7 +47424,8 @@
     "attributes": {},
     "path": ["selection", "bgColor"],
     "value": "#1f6febb3",
-    "type": "color"
+    "type": "color",
+    "description": "Background color for text selection highlights"
   },
   "shadow-floating-large": {
     "key": "{shadow.floating.large}",

package/dist/docs/functional/themes/dark.json

@@ -38281,6 +38281,10 @@
         "collection": "mode",
         "group": "component (internal)",
         "scopes": ["borderColor", "effectColor"]
+      },
+      "org.primer.llm": {
+        "usage": ["focus-ring", "keyboard-navigation", "accessibility-indicator"],
+        "rules": "Use for focus outlines on interactive elements like buttons, links, and form controls. MUST be visible for keyboard navigation accessibility. Do NOT use for decorative borders or non-interactive elements."
       }
     },
     "filePath": "src/tokens/functional/color/focus.json5",
@@ -38288,11 +38292,16 @@
     "original": {
       "$value": "{borderColor.accent.emphasis}",
       "$type": "color",
+      "$description": "Outline color for focus states on interactive elements",
       "$extensions": {
         "org.primer.figma": {
           "collection": "mode",
           "group": "component (internal)",
           "scopes": ["borderColor", "effectColor"]
+        },
+        "org.primer.llm": {
+          "usage": ["focus-ring", "keyboard-navigation", "accessibility-indicator"],
+          "rules": "Use for focus outlines on interactive elements like buttons, links, and form controls. MUST be visible for keyboard navigation accessibility. Do NOT use for decorative borders or non-interactive elements."
         }
       },
       "key": "{focus.outlineColor}"
@@ -38301,7 +38310,8 @@
     "attributes": {},
     "path": ["focus", "outlineColor"],
     "value": "#1f6feb",
-    "type": "color"
+    "type": "color",
+    "description": "Outline color for focus states on interactive elements"
   },
   "header-bgColor": {
     "key": "{header.bgColor}",
@@ -47362,6 +47372,10 @@
           "isSource": true,
           "$type": "color"
         }
+      },
+      "org.primer.llm": {
+        "usage": ["text-selection", "highlighted-text", "selected-content"],
+        "rules": "Use for native text selection (::selection) and programmatic text highlighting. Do NOT use for general emphasis or background colors on containers."
       }
     },
     "alpha": 0.7,
@@ -47370,6 +47384,7 @@
     "original": {
       "$value": "{bgColor.accent.emphasis}",
       "$type": "color",
+      "$description": "Background color for text selection highlights",
       "$extensions": {
         "org.primer.figma": {
           "collection": "mode",
@@ -47384,6 +47399,10 @@
             "isSource": true,
             "$type": "color"
           }
+        },
+        "org.primer.llm": {
+          "usage": ["text-selection", "highlighted-text", "selected-content"],
+          "rules": "Use for native text selection (::selection) and programmatic text highlighting. Do NOT use for general emphasis or background colors on containers."
         }
       },
       "alpha": 0.7,
@@ -47393,7 +47412,8 @@
     "attributes": {},
     "path": ["selection", "bgColor"],
     "value": "#1f6febb3",
-    "type": "color"
+    "type": "color",
+    "description": "Background color for text selection highlights"
   },
   "shadow-floating-large": {
     "key": "{shadow.floating.large}",