@primer/primitives 11.4.0 → 11.4.1-rc.4e2d1de5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/DESIGN_TOKENS_GUIDE.md +185 -0
- package/DESIGN_TOKENS_SPEC.md +565 -0
- package/dist/build/formats/markdownLlmGuidelines.d.ts +7 -6
- package/dist/build/formats/markdownLlmGuidelines.js +1034 -60
- package/dist/build/schemas/borderToken.d.ts +16 -2
- package/dist/build/schemas/dimensionToken.d.ts +8 -1
- package/dist/build/schemas/dimensionValue.d.ts +24 -1
- package/dist/build/schemas/dimensionValue.js +20 -1
- package/dist/build/schemas/durationToken.d.ts +7 -1
- package/dist/build/schemas/durationValue.d.ts +11 -1
- package/dist/build/schemas/durationValue.js +13 -3
- package/dist/build/schemas/shadowToken.d.ts +672 -84
- package/dist/build/schemas/transitionToken.d.ts +14 -2
- package/dist/build/schemas/typographyToken.d.ts +32 -4
- package/dist/build/transformers/dimensionToPixelUnitless.d.ts +3 -2
- package/dist/build/transformers/dimensionToPixelUnitless.js +22 -26
- package/dist/build/transformers/dimensionToRem.d.ts +2 -1
- package/dist/build/transformers/dimensionToRem.js +21 -22
- package/dist/build/transformers/dimensionToRemPxArray.d.ts +2 -1
- package/dist/build/transformers/dimensionToRemPxArray.js +21 -22
- package/dist/build/transformers/durationToCss.d.ts +2 -1
- package/dist/build/transformers/durationToCss.js +18 -11
- package/dist/build/transformers/utilities/parseDimension.d.ts +12 -0
- package/dist/build/transformers/utilities/parseDimension.js +31 -0
- package/dist/build/types/dimensionTokenValue.d.ts +9 -0
- package/dist/css/functional/themes/dark-colorblind-high-contrast.css +18 -14
- package/dist/css/functional/themes/dark-colorblind.css +18 -14
- package/dist/css/functional/themes/dark-dimmed-high-contrast.css +18 -14
- package/dist/css/functional/themes/dark-dimmed.css +18 -14
- package/dist/css/functional/themes/dark-high-contrast.css +18 -14
- package/dist/css/functional/themes/dark-tritanopia-high-contrast.css +18 -14
- package/dist/css/functional/themes/dark-tritanopia.css +18 -14
- package/dist/css/functional/themes/dark.css +18 -14
- package/dist/css/functional/themes/light-colorblind-high-contrast.css +18 -14
- package/dist/css/functional/themes/light-colorblind.css +18 -14
- package/dist/css/functional/themes/light-high-contrast.css +18 -14
- package/dist/css/functional/themes/light-tritanopia-high-contrast.css +18 -14
- package/dist/css/functional/themes/light-tritanopia.css +18 -14
- package/dist/css/functional/themes/light.css +18 -14
- package/dist/css/primitives.css +4 -0
- package/dist/docs/base/motion/motion.json +96 -24
- package/dist/docs/base/size/size.json +76 -19
- package/dist/docs/base/typography/typography.json +24 -6
- package/dist/docs/functional/size/border.json +20 -5
- package/dist/docs/functional/size/breakpoints.json +24 -6
- package/dist/docs/functional/size/radius.json +16 -4
- package/dist/docs/functional/size/size.json +60 -15
- package/dist/docs/functional/themes/dark-colorblind-high-contrast.json +109 -7
- package/dist/docs/functional/themes/dark-colorblind.json +109 -7
- package/dist/docs/functional/themes/dark-dimmed-high-contrast.json +109 -7
- package/dist/docs/functional/themes/dark-dimmed.json +109 -7
- package/dist/docs/functional/themes/dark-high-contrast.json +109 -7
- package/dist/docs/functional/themes/dark-tritanopia-high-contrast.json +109 -7
- package/dist/docs/functional/themes/dark-tritanopia.json +109 -7
- package/dist/docs/functional/themes/dark.json +109 -7
- package/dist/docs/functional/themes/light-colorblind-high-contrast.json +115 -13
- package/dist/docs/functional/themes/light-colorblind.json +115 -13
- package/dist/docs/functional/themes/light-high-contrast.json +115 -13
- package/dist/docs/functional/themes/light-tritanopia-high-contrast.json +115 -13
- package/dist/docs/functional/themes/light-tritanopia.json +115 -13
- package/dist/docs/functional/themes/light.json +115 -13
- package/dist/docs/functional/typography/typography.json +8 -2
- package/dist/fallbacks/base/motion/motion.json +48 -12
- package/dist/figma/themes/light-colorblind.json +4 -4
- package/dist/figma/themes/light-high-contrast.json +4 -4
- package/dist/figma/themes/light-tritanopia.json +4 -4
- package/dist/figma/themes/light.json +4 -4
- package/dist/internalCss/dark-colorblind-high-contrast.css +14 -14
- package/dist/internalCss/dark-colorblind.css +14 -14
- package/dist/internalCss/dark-dimmed-high-contrast.css +14 -14
- package/dist/internalCss/dark-dimmed.css +14 -14
- package/dist/internalCss/dark-high-contrast.css +14 -14
- package/dist/internalCss/dark-tritanopia-high-contrast.css +14 -14
- package/dist/internalCss/dark-tritanopia.css +14 -14
- package/dist/internalCss/dark.css +14 -14
- package/dist/internalCss/light-colorblind-high-contrast.css +14 -14
- package/dist/internalCss/light-colorblind.css +14 -14
- package/dist/internalCss/light-high-contrast.css +14 -14
- package/dist/internalCss/light-tritanopia-high-contrast.css +14 -14
- package/dist/internalCss/light-tritanopia.css +14 -14
- package/dist/internalCss/light.css +14 -14
- package/dist/styleLint/base/motion/motion.json +96 -24
- package/dist/styleLint/base/size/size.json +76 -19
- package/dist/styleLint/base/typography/typography.json +30 -12
- package/dist/styleLint/functional/size/border.json +21 -6
- package/dist/styleLint/functional/size/breakpoints.json +24 -6
- package/dist/styleLint/functional/size/radius.json +17 -5
- package/dist/styleLint/functional/size/size-coarse.json +3 -3
- package/dist/styleLint/functional/size/size-fine.json +3 -3
- package/dist/styleLint/functional/size/size.json +111 -66
- package/dist/styleLint/functional/themes/dark-colorblind-high-contrast.json +129 -27
- package/dist/styleLint/functional/themes/dark-colorblind.json +129 -27
- package/dist/styleLint/functional/themes/dark-dimmed-high-contrast.json +129 -27
- package/dist/styleLint/functional/themes/dark-dimmed.json +129 -27
- package/dist/styleLint/functional/themes/dark-high-contrast.json +129 -27
- package/dist/styleLint/functional/themes/dark-tritanopia-high-contrast.json +129 -27
- package/dist/styleLint/functional/themes/dark-tritanopia.json +129 -27
- package/dist/styleLint/functional/themes/dark.json +129 -27
- package/dist/styleLint/functional/themes/light-colorblind-high-contrast.json +135 -33
- package/dist/styleLint/functional/themes/light-colorblind.json +135 -33
- package/dist/styleLint/functional/themes/light-high-contrast.json +135 -33
- package/dist/styleLint/functional/themes/light-tritanopia-high-contrast.json +135 -33
- package/dist/styleLint/functional/themes/light-tritanopia.json +135 -33
- package/dist/styleLint/functional/themes/light.json +135 -33
- package/dist/styleLint/functional/typography/typography.json +28 -22
- package/package.json +6 -5
- package/src/tokens/base/motion/timing.json5 +12 -12
- package/src/tokens/base/size/size.json5 +19 -19
- package/src/tokens/base/typography/typography.json5 +6 -6
- package/src/tokens/functional/color/bgColor.json5 +8 -0
- package/src/tokens/functional/color/display.json5 +7 -0
- package/src/tokens/functional/color/fgColor.json5 +8 -0
- package/src/tokens/functional/color/syntax.json5 +14 -0
- package/src/tokens/functional/shadow/shadow.json5 +39 -4
- package/src/tokens/functional/size/border.json5 +5 -5
- package/src/tokens/functional/size/breakpoints.json5 +6 -6
- package/src/tokens/functional/size/radius.json5 +4 -4
- package/src/tokens/functional/size/size.json5 +15 -15
- package/src/tokens/functional/typography/typography.json5 +8 -4
- package/dist/build/parsers/index.d.ts +0 -1
- package/dist/build/parsers/index.js +0 -1
- package/dist/build/parsers/w3cJsonParser.d.ts +0 -6
- package/dist/build/parsers/w3cJsonParser.js +0 -25
- package/dist/removed/testing.json5 +0 -4
- package/guidelines/color.llm.md +0 -16
- package/guidelines/guidelines.llm.md +0 -34
- package/guidelines/motion.llm.md +0 -41
- package/guidelines/spacing.llm.md +0 -20
- package/guidelines/typography.llm.md +0 -14
- package/src/tokens/removed/testing.json5 +0 -4
- package/token-guidelines.llm.md +0 -695
|
@@ -546,6 +546,10 @@
|
|
|
546
546
|
},
|
|
547
547
|
"org.primer.overrides": {
|
|
548
548
|
"dark": "#ffffff"
|
|
549
|
+
},
|
|
550
|
+
"org.primer.llm": {
|
|
551
|
+
"doNotUse": true,
|
|
552
|
+
"rules": "Avoid using raw black. Use semantic alternatives: bgColor.emphasis for dark backgrounds, bgColor.inverse for inverted contexts. Raw black/white ignore theme preferences and accessibility settings."
|
|
549
553
|
}
|
|
550
554
|
},
|
|
551
555
|
"filePath": "src/tokens/functional/color/bgColor.json5",
|
|
@@ -562,6 +566,10 @@
|
|
|
562
566
|
},
|
|
563
567
|
"org.primer.overrides": {
|
|
564
568
|
"dark": "{base.color.neutral.0}"
|
|
569
|
+
},
|
|
570
|
+
"org.primer.llm": {
|
|
571
|
+
"doNotUse": true,
|
|
572
|
+
"rules": "Avoid using raw black. Use semantic alternatives: bgColor.emphasis for dark backgrounds, bgColor.inverse for inverted contexts. Raw black/white ignore theme preferences and accessibility settings."
|
|
565
573
|
}
|
|
566
574
|
},
|
|
567
575
|
"key": "{bgColor.black}"
|
|
@@ -2438,6 +2446,10 @@
|
|
|
2438
2446
|
},
|
|
2439
2447
|
"org.primer.overrides": {
|
|
2440
2448
|
"dark": "#1f2328"
|
|
2449
|
+
},
|
|
2450
|
+
"org.primer.llm": {
|
|
2451
|
+
"doNotUse": true,
|
|
2452
|
+
"rules": "Avoid using raw white. Use semantic alternatives: bgColor.default for standard backgrounds, bgColor.inset for recessed areas, or bgColor.inverse for inverted contexts. Raw black/white ignore theme preferences and accessibility settings."
|
|
2441
2453
|
}
|
|
2442
2454
|
},
|
|
2443
2455
|
"filePath": "src/tokens/functional/color/bgColor.json5",
|
|
@@ -2454,6 +2466,10 @@
|
|
|
2454
2466
|
},
|
|
2455
2467
|
"org.primer.overrides": {
|
|
2456
2468
|
"dark": "{base.color.neutral.13}"
|
|
2469
|
+
},
|
|
2470
|
+
"org.primer.llm": {
|
|
2471
|
+
"doNotUse": true,
|
|
2472
|
+
"rules": "Avoid using raw white. Use semantic alternatives: bgColor.default for standard backgrounds, bgColor.inset for recessed areas, or bgColor.inverse for inverted contexts. Raw black/white ignore theme preferences and accessibility settings."
|
|
2457
2473
|
}
|
|
2458
2474
|
},
|
|
2459
2475
|
"key": "{bgColor.white}"
|
|
@@ -2464,7 +2480,7 @@
|
|
|
2464
2480
|
},
|
|
2465
2481
|
"border-accent-emphasis": {
|
|
2466
2482
|
"key": "{border.accent.emphasis}",
|
|
2467
|
-
"$value": "0.
|
|
2483
|
+
"$value": "0.0625rem,1px solid #0969da",
|
|
2468
2484
|
"$type": "border",
|
|
2469
2485
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2470
2486
|
"isSource": true,
|
|
@@ -2483,7 +2499,7 @@
|
|
|
2483
2499
|
},
|
|
2484
2500
|
"border-accent-muted": {
|
|
2485
2501
|
"key": "{border.accent.muted}",
|
|
2486
|
-
"$value": "0.
|
|
2502
|
+
"$value": "0.0625rem,1px solid #54aeff66",
|
|
2487
2503
|
"$type": "border",
|
|
2488
2504
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2489
2505
|
"isSource": true,
|
|
@@ -2502,7 +2518,7 @@
|
|
|
2502
2518
|
},
|
|
2503
2519
|
"border-attention-emphasis": {
|
|
2504
2520
|
"key": "{border.attention.emphasis}",
|
|
2505
|
-
"$value": "0.
|
|
2521
|
+
"$value": "0.0625rem,1px solid #9a6700",
|
|
2506
2522
|
"$type": "border",
|
|
2507
2523
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2508
2524
|
"isSource": true,
|
|
@@ -2521,7 +2537,7 @@
|
|
|
2521
2537
|
},
|
|
2522
2538
|
"border-attention-muted": {
|
|
2523
2539
|
"key": "{border.attention.muted}",
|
|
2524
|
-
"$value": "0.
|
|
2540
|
+
"$value": "0.0625rem,1px solid #d4a72c66",
|
|
2525
2541
|
"$type": "border",
|
|
2526
2542
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2527
2543
|
"isSource": true,
|
|
@@ -2540,7 +2556,7 @@
|
|
|
2540
2556
|
},
|
|
2541
2557
|
"border-closed-emphasis": {
|
|
2542
2558
|
"key": "{border.closed.emphasis}",
|
|
2543
|
-
"$value": "0.
|
|
2559
|
+
"$value": "0.0625rem,1px solid #cf222e",
|
|
2544
2560
|
"$type": "border",
|
|
2545
2561
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2546
2562
|
"isSource": true,
|
|
@@ -2555,7 +2571,7 @@
|
|
|
2555
2571
|
},
|
|
2556
2572
|
"border-closed-muted": {
|
|
2557
2573
|
"key": "{border.closed.muted}",
|
|
2558
|
-
"$value": "0.
|
|
2574
|
+
"$value": "0.0625rem,1px solid #ff818266",
|
|
2559
2575
|
"$type": "border",
|
|
2560
2576
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2561
2577
|
"isSource": true,
|
|
@@ -2570,7 +2586,7 @@
|
|
|
2570
2586
|
},
|
|
2571
2587
|
"border-danger-emphasis": {
|
|
2572
2588
|
"key": "{border.danger.emphasis}",
|
|
2573
|
-
"$value": "0.
|
|
2589
|
+
"$value": "0.0625rem,1px solid #cf222e",
|
|
2574
2590
|
"$type": "border",
|
|
2575
2591
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2576
2592
|
"isSource": true,
|
|
@@ -2589,7 +2605,7 @@
|
|
|
2589
2605
|
},
|
|
2590
2606
|
"border-danger-muted": {
|
|
2591
2607
|
"key": "{border.danger.muted}",
|
|
2592
|
-
"$value": "0.
|
|
2608
|
+
"$value": "0.0625rem,1px solid #ff818266",
|
|
2593
2609
|
"$type": "border",
|
|
2594
2610
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2595
2611
|
"isSource": true,
|
|
@@ -2608,7 +2624,7 @@
|
|
|
2608
2624
|
},
|
|
2609
2625
|
"border-default": {
|
|
2610
2626
|
"key": "{border.default}",
|
|
2611
|
-
"$value": "0.
|
|
2627
|
+
"$value": "0.0625rem,1px solid #d1d9e0",
|
|
2612
2628
|
"$type": "border",
|
|
2613
2629
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2614
2630
|
"isSource": true,
|
|
@@ -2627,7 +2643,7 @@
|
|
|
2627
2643
|
},
|
|
2628
2644
|
"border-disabled": {
|
|
2629
2645
|
"key": "{border.disabled}",
|
|
2630
|
-
"$value": "0.
|
|
2646
|
+
"$value": "0.0625rem,1px solid #818b981a",
|
|
2631
2647
|
"$type": "border",
|
|
2632
2648
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2633
2649
|
"isSource": true,
|
|
@@ -2646,7 +2662,7 @@
|
|
|
2646
2662
|
},
|
|
2647
2663
|
"border-done-emphasis": {
|
|
2648
2664
|
"key": "{border.done.emphasis}",
|
|
2649
|
-
"$value": "0.
|
|
2665
|
+
"$value": "0.0625rem,1px solid #8250df",
|
|
2650
2666
|
"$type": "border",
|
|
2651
2667
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2652
2668
|
"isSource": true,
|
|
@@ -2665,7 +2681,7 @@
|
|
|
2665
2681
|
},
|
|
2666
2682
|
"border-done-muted": {
|
|
2667
2683
|
"key": "{border.done.muted}",
|
|
2668
|
-
"$value": "0.
|
|
2684
|
+
"$value": "0.0625rem,1px solid #c297ff66",
|
|
2669
2685
|
"$type": "border",
|
|
2670
2686
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2671
2687
|
"isSource": true,
|
|
@@ -2684,7 +2700,7 @@
|
|
|
2684
2700
|
},
|
|
2685
2701
|
"border-emphasis": {
|
|
2686
2702
|
"key": "{border.emphasis}",
|
|
2687
|
-
"$value": "0.
|
|
2703
|
+
"$value": "0.0625rem,1px solid #818b98",
|
|
2688
2704
|
"$type": "border",
|
|
2689
2705
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2690
2706
|
"isSource": true,
|
|
@@ -2703,7 +2719,7 @@
|
|
|
2703
2719
|
},
|
|
2704
2720
|
"border-muted": {
|
|
2705
2721
|
"key": "{border.muted}",
|
|
2706
|
-
"$value": "0.
|
|
2722
|
+
"$value": "0.0625rem,1px solid #d1d9e0b3",
|
|
2707
2723
|
"$type": "border",
|
|
2708
2724
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2709
2725
|
"isSource": true,
|
|
@@ -2722,7 +2738,7 @@
|
|
|
2722
2738
|
},
|
|
2723
2739
|
"border-neutral-emphasis": {
|
|
2724
2740
|
"key": "{border.neutral.emphasis}",
|
|
2725
|
-
"$value": "0.
|
|
2741
|
+
"$value": "0.0625rem,1px solid #59636e",
|
|
2726
2742
|
"$type": "border",
|
|
2727
2743
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2728
2744
|
"isSource": true,
|
|
@@ -2741,7 +2757,7 @@
|
|
|
2741
2757
|
},
|
|
2742
2758
|
"border-neutral-muted": {
|
|
2743
2759
|
"key": "{border.neutral.muted}",
|
|
2744
|
-
"$value": "0.
|
|
2760
|
+
"$value": "0.0625rem,1px solid #d1d9e0b3",
|
|
2745
2761
|
"$type": "border",
|
|
2746
2762
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2747
2763
|
"isSource": true,
|
|
@@ -2760,7 +2776,7 @@
|
|
|
2760
2776
|
},
|
|
2761
2777
|
"border-open-emphasis": {
|
|
2762
2778
|
"key": "{border.open.emphasis}",
|
|
2763
|
-
"$value": "0.
|
|
2779
|
+
"$value": "0.0625rem,1px solid #0969da",
|
|
2764
2780
|
"$type": "border",
|
|
2765
2781
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2766
2782
|
"isSource": true,
|
|
@@ -2775,7 +2791,7 @@
|
|
|
2775
2791
|
},
|
|
2776
2792
|
"border-open-muted": {
|
|
2777
2793
|
"key": "{border.open.muted}",
|
|
2778
|
-
"$value": "0.
|
|
2794
|
+
"$value": "0.0625rem,1px solid #54aeff66",
|
|
2779
2795
|
"$type": "border",
|
|
2780
2796
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2781
2797
|
"isSource": true,
|
|
@@ -2790,7 +2806,7 @@
|
|
|
2790
2806
|
},
|
|
2791
2807
|
"border-severe-emphasis": {
|
|
2792
2808
|
"key": "{border.severe.emphasis}",
|
|
2793
|
-
"$value": "0.
|
|
2809
|
+
"$value": "0.0625rem,1px solid #cf222e",
|
|
2794
2810
|
"$type": "border",
|
|
2795
2811
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2796
2812
|
"isSource": true,
|
|
@@ -2809,7 +2825,7 @@
|
|
|
2809
2825
|
},
|
|
2810
2826
|
"border-severe-muted": {
|
|
2811
2827
|
"key": "{border.severe.muted}",
|
|
2812
|
-
"$value": "0.
|
|
2828
|
+
"$value": "0.0625rem,1px solid #ff818266",
|
|
2813
2829
|
"$type": "border",
|
|
2814
2830
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2815
2831
|
"isSource": true,
|
|
@@ -2828,7 +2844,7 @@
|
|
|
2828
2844
|
},
|
|
2829
2845
|
"border-sponsors-emphasis": {
|
|
2830
2846
|
"key": "{border.sponsors.emphasis}",
|
|
2831
|
-
"$value": "0.
|
|
2847
|
+
"$value": "0.0625rem,1px solid #bf3989",
|
|
2832
2848
|
"$type": "border",
|
|
2833
2849
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2834
2850
|
"isSource": true,
|
|
@@ -2847,7 +2863,7 @@
|
|
|
2847
2863
|
},
|
|
2848
2864
|
"border-sponsors-muted": {
|
|
2849
2865
|
"key": "{border.sponsors.muted}",
|
|
2850
|
-
"$value": "0.
|
|
2866
|
+
"$value": "0.0625rem,1px solid #ff80c866",
|
|
2851
2867
|
"$type": "border",
|
|
2852
2868
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2853
2869
|
"isSource": true,
|
|
@@ -2866,7 +2882,7 @@
|
|
|
2866
2882
|
},
|
|
2867
2883
|
"border-success-emphasis": {
|
|
2868
2884
|
"key": "{border.success.emphasis}",
|
|
2869
|
-
"$value": "0.
|
|
2885
|
+
"$value": "0.0625rem,1px solid #0969da",
|
|
2870
2886
|
"$type": "border",
|
|
2871
2887
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2872
2888
|
"isSource": true,
|
|
@@ -2885,7 +2901,7 @@
|
|
|
2885
2901
|
},
|
|
2886
2902
|
"border-success-muted": {
|
|
2887
2903
|
"key": "{border.success.muted}",
|
|
2888
|
-
"$value": "0.
|
|
2904
|
+
"$value": "0.0625rem,1px solid #54aeff66",
|
|
2889
2905
|
"$type": "border",
|
|
2890
2906
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2891
2907
|
"isSource": true,
|
|
@@ -2904,7 +2920,7 @@
|
|
|
2904
2920
|
},
|
|
2905
2921
|
"border-transparent": {
|
|
2906
2922
|
"key": "{border.transparent}",
|
|
2907
|
-
"$value": "0.
|
|
2923
|
+
"$value": "0.0625rem,1px solid #ffffff00",
|
|
2908
2924
|
"$type": "border",
|
|
2909
2925
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2910
2926
|
"isSource": true,
|
|
@@ -2923,7 +2939,7 @@
|
|
|
2923
2939
|
},
|
|
2924
2940
|
"border-upsell-emphasis": {
|
|
2925
2941
|
"key": "{border.upsell.emphasis}",
|
|
2926
|
-
"$value": "0.
|
|
2942
|
+
"$value": "0.0625rem,1px solid #8250df",
|
|
2927
2943
|
"$type": "border",
|
|
2928
2944
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2929
2945
|
"isSource": true,
|
|
@@ -2942,7 +2958,7 @@
|
|
|
2942
2958
|
},
|
|
2943
2959
|
"border-upsell-muted": {
|
|
2944
2960
|
"key": "{border.upsell.muted}",
|
|
2945
|
-
"$value": "0.
|
|
2961
|
+
"$value": "0.0625rem,1px solid #c297ff66",
|
|
2946
2962
|
"$type": "border",
|
|
2947
2963
|
"filePath": "src/tokens/functional/border/border.json5",
|
|
2948
2964
|
"isSource": true,
|
|
@@ -37220,6 +37236,10 @@
|
|
|
37220
37236
|
},
|
|
37221
37237
|
"org.primer.overrides": {
|
|
37222
37238
|
"dark": "#ffffff"
|
|
37239
|
+
},
|
|
37240
|
+
"org.primer.llm": {
|
|
37241
|
+
"doNotUse": true,
|
|
37242
|
+
"rules": "Avoid using raw black. Use semantic alternatives: fgColor.default for standard text, fgColor.muted for secondary text. Raw black/white ignore theme preferences and accessibility settings."
|
|
37223
37243
|
}
|
|
37224
37244
|
},
|
|
37225
37245
|
"filePath": "src/tokens/functional/color/fgColor.json5",
|
|
@@ -37236,6 +37256,10 @@
|
|
|
37236
37256
|
},
|
|
37237
37257
|
"org.primer.overrides": {
|
|
37238
37258
|
"dark": "{base.color.neutral.0}"
|
|
37259
|
+
},
|
|
37260
|
+
"org.primer.llm": {
|
|
37261
|
+
"doNotUse": true,
|
|
37262
|
+
"rules": "Avoid using raw black. Use semantic alternatives: fgColor.default for standard text, fgColor.muted for secondary text. Raw black/white ignore theme preferences and accessibility settings."
|
|
37239
37263
|
}
|
|
37240
37264
|
},
|
|
37241
37265
|
"key": "{fgColor.black}"
|
|
@@ -38209,6 +38233,10 @@
|
|
|
38209
38233
|
},
|
|
38210
38234
|
"org.primer.overrides": {
|
|
38211
38235
|
"dark": "#1f2328"
|
|
38236
|
+
},
|
|
38237
|
+
"org.primer.llm": {
|
|
38238
|
+
"doNotUse": true,
|
|
38239
|
+
"rules": "Avoid using raw white. Use semantic alternatives: fgColor.onEmphasis for text on dark backgrounds, fgColor.onInverse for inverted contexts. Raw black/white ignore theme preferences and accessibility settings."
|
|
38212
38240
|
}
|
|
38213
38241
|
},
|
|
38214
38242
|
"filePath": "src/tokens/functional/color/fgColor.json5",
|
|
@@ -38225,6 +38253,10 @@
|
|
|
38225
38253
|
},
|
|
38226
38254
|
"org.primer.overrides": {
|
|
38227
38255
|
"dark": "{base.color.neutral.13}"
|
|
38256
|
+
},
|
|
38257
|
+
"org.primer.llm": {
|
|
38258
|
+
"doNotUse": true,
|
|
38259
|
+
"rules": "Avoid using raw white. Use semantic alternatives: fgColor.onEmphasis for text on dark backgrounds, fgColor.onInverse for inverted contexts. Raw black/white ignore theme preferences and accessibility settings."
|
|
38228
38260
|
}
|
|
38229
38261
|
},
|
|
38230
38262
|
"key": "{fgColor.white}"
|
|
@@ -47507,6 +47539,7 @@
|
|
|
47507
47539
|
"key": "{shadow.floating.legacy}",
|
|
47508
47540
|
"$value": "0px 6px 12px -3px #25292e0a, 0px 6px 18px 0px #25292e1f",
|
|
47509
47541
|
"$type": "shadow",
|
|
47542
|
+
"$description": "Legacy floating shadow for backward compatibility",
|
|
47510
47543
|
"$extensions": {
|
|
47511
47544
|
"org.primer.figma": {},
|
|
47512
47545
|
"org.primer.overrides": {
|
|
@@ -47533,6 +47566,10 @@
|
|
|
47533
47566
|
"isSource": true,
|
|
47534
47567
|
"$type": "shadow"
|
|
47535
47568
|
}
|
|
47569
|
+
},
|
|
47570
|
+
"org.primer.llm": {
|
|
47571
|
+
"usage": ["legacy-component", "backward-compatibility"],
|
|
47572
|
+
"rules": "DEPRECATED: Use shadow-floating-small instead. Only use for maintaining backward compatibility with existing implementations."
|
|
47536
47573
|
}
|
|
47537
47574
|
},
|
|
47538
47575
|
"filePath": "src/tokens/functional/shadow/shadow.json5",
|
|
@@ -47557,6 +47594,7 @@
|
|
|
47557
47594
|
}
|
|
47558
47595
|
],
|
|
47559
47596
|
"$type": "shadow",
|
|
47597
|
+
"$description": "Legacy floating shadow for backward compatibility",
|
|
47560
47598
|
"$extensions": {
|
|
47561
47599
|
"org.primer.figma": {},
|
|
47562
47600
|
"org.primer.overrides": {
|
|
@@ -47583,6 +47621,10 @@
|
|
|
47583
47621
|
"isSource": true,
|
|
47584
47622
|
"$type": "shadow"
|
|
47585
47623
|
}
|
|
47624
|
+
},
|
|
47625
|
+
"org.primer.llm": {
|
|
47626
|
+
"usage": ["legacy-component", "backward-compatibility"],
|
|
47627
|
+
"rules": "DEPRECATED: Use shadow-floating-small instead. Only use for maintaining backward compatibility with existing implementations."
|
|
47586
47628
|
}
|
|
47587
47629
|
},
|
|
47588
47630
|
"key": "{shadow.floating.legacy}"
|
|
@@ -47595,6 +47637,7 @@
|
|
|
47595
47637
|
"key": "{shadow.floating.medium}",
|
|
47596
47638
|
"$value": "0px 0px 0px 1px #d1d9e0, 0px 8px 16px -4px #25292e14, 0px 4px 32px -4px #25292e14, 0px 24px 48px -12px #25292e14, 0px 48px 96px -24px #25292e14",
|
|
47597
47639
|
"$type": "shadow",
|
|
47640
|
+
"$description": "Medium floating shadow for popovers and action menus",
|
|
47598
47641
|
"$extensions": {
|
|
47599
47642
|
"org.primer.figma": {
|
|
47600
47643
|
"collection": "mode",
|
|
@@ -47648,6 +47691,10 @@
|
|
|
47648
47691
|
"isSource": true,
|
|
47649
47692
|
"$type": "shadow"
|
|
47650
47693
|
}
|
|
47694
|
+
},
|
|
47695
|
+
"org.primer.llm": {
|
|
47696
|
+
"usage": ["popover", "action-menu", "select-panel", "autocomplete"],
|
|
47697
|
+
"rules": "Use for medium-sized floating elements like popovers and action menus. More prominent than small but less than dialogs. Do NOT use for full modals."
|
|
47651
47698
|
}
|
|
47652
47699
|
},
|
|
47653
47700
|
"filePath": "src/tokens/functional/shadow/shadow.json5",
|
|
@@ -47696,6 +47743,7 @@
|
|
|
47696
47743
|
}
|
|
47697
47744
|
],
|
|
47698
47745
|
"$type": "shadow",
|
|
47746
|
+
"$description": "Medium floating shadow for popovers and action menus",
|
|
47699
47747
|
"$extensions": {
|
|
47700
47748
|
"org.primer.figma": {
|
|
47701
47749
|
"collection": "mode",
|
|
@@ -47749,6 +47797,10 @@
|
|
|
47749
47797
|
"isSource": true,
|
|
47750
47798
|
"$type": "shadow"
|
|
47751
47799
|
}
|
|
47800
|
+
},
|
|
47801
|
+
"org.primer.llm": {
|
|
47802
|
+
"usage": ["popover", "action-menu", "select-panel", "autocomplete"],
|
|
47803
|
+
"rules": "Use for medium-sized floating elements like popovers and action menus. More prominent than small but less than dialogs. Do NOT use for full modals."
|
|
47752
47804
|
}
|
|
47753
47805
|
},
|
|
47754
47806
|
"key": "{shadow.floating.medium}"
|
|
@@ -47889,6 +47941,7 @@
|
|
|
47889
47941
|
"key": "{shadow.floating.xlarge}",
|
|
47890
47942
|
"$value": "0px 0px 0px 1px #d1d9e0, 0px 56px 112px 0px #25292e52",
|
|
47891
47943
|
"$type": "shadow",
|
|
47944
|
+
"$description": "Extra large floating shadow for full-screen overlays and sheets",
|
|
47892
47945
|
"$extensions": {
|
|
47893
47946
|
"org.primer.figma": {
|
|
47894
47947
|
"collection": "mode",
|
|
@@ -47918,6 +47971,10 @@
|
|
|
47918
47971
|
"isSource": true,
|
|
47919
47972
|
"$type": "shadow"
|
|
47920
47973
|
}
|
|
47974
|
+
},
|
|
47975
|
+
"org.primer.llm": {
|
|
47976
|
+
"usage": ["full-screen-overlay", "side-sheet", "drawer", "large-modal"],
|
|
47977
|
+
"rules": "Use for full-screen or near-full-screen overlays like side sheets and drawers. Maximum elevation in the system. Do NOT use for small floating elements."
|
|
47921
47978
|
}
|
|
47922
47979
|
},
|
|
47923
47980
|
"filePath": "src/tokens/functional/shadow/shadow.json5",
|
|
@@ -47942,6 +47999,7 @@
|
|
|
47942
47999
|
}
|
|
47943
48000
|
],
|
|
47944
48001
|
"$type": "shadow",
|
|
48002
|
+
"$description": "Extra large floating shadow for full-screen overlays and sheets",
|
|
47945
48003
|
"$extensions": {
|
|
47946
48004
|
"org.primer.figma": {
|
|
47947
48005
|
"collection": "mode",
|
|
@@ -47971,6 +48029,10 @@
|
|
|
47971
48029
|
"isSource": true,
|
|
47972
48030
|
"$type": "shadow"
|
|
47973
48031
|
}
|
|
48032
|
+
},
|
|
48033
|
+
"org.primer.llm": {
|
|
48034
|
+
"usage": ["full-screen-overlay", "side-sheet", "drawer", "large-modal"],
|
|
48035
|
+
"rules": "Use for full-screen or near-full-screen overlays like side sheets and drawers. Maximum elevation in the system. Do NOT use for small floating elements."
|
|
47974
48036
|
}
|
|
47975
48037
|
},
|
|
47976
48038
|
"key": "{shadow.floating.xlarge}"
|
|
@@ -47983,6 +48045,7 @@
|
|
|
47983
48045
|
"key": "{shadow.inset}",
|
|
47984
48046
|
"$value": "inset 0px 1px 0px 0px #1f23280a",
|
|
47985
48047
|
"$type": "shadow",
|
|
48048
|
+
"$description": "Inset shadow for recessed elements",
|
|
47986
48049
|
"$extensions": {
|
|
47987
48050
|
"org.primer.figma": {
|
|
47988
48051
|
"collection": "mode",
|
|
@@ -48003,6 +48066,10 @@
|
|
|
48003
48066
|
"isSource": true,
|
|
48004
48067
|
"$type": "shadow"
|
|
48005
48068
|
}
|
|
48069
|
+
},
|
|
48070
|
+
"org.primer.llm": {
|
|
48071
|
+
"usage": ["input-field", "pressed-button", "recessed-area", "well"],
|
|
48072
|
+
"rules": "Use for elements that appear pressed or inset into the surface. Commonly used for input fields and wells. Do NOT use for floating elements."
|
|
48006
48073
|
}
|
|
48007
48074
|
},
|
|
48008
48075
|
"filePath": "src/tokens/functional/shadow/shadow.json5",
|
|
@@ -48018,6 +48085,7 @@
|
|
|
48018
48085
|
"inset": true
|
|
48019
48086
|
},
|
|
48020
48087
|
"$type": "shadow",
|
|
48088
|
+
"$description": "Inset shadow for recessed elements",
|
|
48021
48089
|
"$extensions": {
|
|
48022
48090
|
"org.primer.figma": {
|
|
48023
48091
|
"collection": "mode",
|
|
@@ -48038,6 +48106,10 @@
|
|
|
48038
48106
|
"isSource": true,
|
|
48039
48107
|
"$type": "shadow"
|
|
48040
48108
|
}
|
|
48109
|
+
},
|
|
48110
|
+
"org.primer.llm": {
|
|
48111
|
+
"usage": ["input-field", "pressed-button", "recessed-area", "well"],
|
|
48112
|
+
"rules": "Use for elements that appear pressed or inset into the surface. Commonly used for input fields and wells. Do NOT use for floating elements."
|
|
48041
48113
|
}
|
|
48042
48114
|
},
|
|
48043
48115
|
"key": "{shadow.inset}"
|
|
@@ -48050,6 +48122,7 @@
|
|
|
48050
48122
|
"key": "{shadow.resting.medium}",
|
|
48051
48123
|
"$value": "0px 1px 1px 0px #25292e1a, 0px 3px 6px 0px #25292e1f",
|
|
48052
48124
|
"$type": "shadow",
|
|
48125
|
+
"$description": "Medium resting shadow for cards and elevated surfaces",
|
|
48053
48126
|
"$extensions": {
|
|
48054
48127
|
"org.primer.figma": {
|
|
48055
48128
|
"collection": "mode",
|
|
@@ -48079,6 +48152,10 @@
|
|
|
48079
48152
|
"isSource": true,
|
|
48080
48153
|
"$type": "shadow"
|
|
48081
48154
|
}
|
|
48155
|
+
},
|
|
48156
|
+
"org.primer.llm": {
|
|
48157
|
+
"usage": ["card", "panel", "elevated-surface", "elevated-sidebar"],
|
|
48158
|
+
"rules": "Use for cards and content panels that sit above the page surface. Provides moderate elevation without appearing to float. Do NOT use for overlays or modals."
|
|
48082
48159
|
}
|
|
48083
48160
|
},
|
|
48084
48161
|
"filePath": "src/tokens/functional/shadow/shadow.json5",
|
|
@@ -48103,6 +48180,7 @@
|
|
|
48103
48180
|
}
|
|
48104
48181
|
],
|
|
48105
48182
|
"$type": "shadow",
|
|
48183
|
+
"$description": "Medium resting shadow for cards and elevated surfaces",
|
|
48106
48184
|
"$extensions": {
|
|
48107
48185
|
"org.primer.figma": {
|
|
48108
48186
|
"collection": "mode",
|
|
@@ -48132,6 +48210,10 @@
|
|
|
48132
48210
|
"isSource": true,
|
|
48133
48211
|
"$type": "shadow"
|
|
48134
48212
|
}
|
|
48213
|
+
},
|
|
48214
|
+
"org.primer.llm": {
|
|
48215
|
+
"usage": ["card", "panel", "elevated-surface", "elevated-sidebar"],
|
|
48216
|
+
"rules": "Use for cards and content panels that sit above the page surface. Provides moderate elevation without appearing to float. Do NOT use for overlays or modals."
|
|
48135
48217
|
}
|
|
48136
48218
|
},
|
|
48137
48219
|
"key": "{shadow.resting.medium}"
|
|
@@ -48142,8 +48224,9 @@
|
|
|
48142
48224
|
},
|
|
48143
48225
|
"shadow-resting-small": {
|
|
48144
48226
|
"key": "{shadow.resting.small}",
|
|
48145
|
-
"$value": "0px 1px 1px 0px #
|
|
48227
|
+
"$value": "0px 1px 1px 0px #1f23280a, 0px 1px 2px 0px #1f232808",
|
|
48146
48228
|
"$type": "shadow",
|
|
48229
|
+
"$description": "Small resting shadow for buttons and interactive elements",
|
|
48147
48230
|
"$extensions": {
|
|
48148
48231
|
"org.primer.figma": {
|
|
48149
48232
|
"collection": "mode",
|
|
@@ -48175,6 +48258,10 @@
|
|
|
48175
48258
|
"isSource": true,
|
|
48176
48259
|
"$type": "shadow"
|
|
48177
48260
|
}
|
|
48261
|
+
},
|
|
48262
|
+
"org.primer.llm": {
|
|
48263
|
+
"usage": ["button", "interactive-card", "clickable-element"],
|
|
48264
|
+
"rules": "Use for buttons and small interactive elements at rest. Provides subtle depth and clickable affordance. RECOMMENDED for default button shadows."
|
|
48178
48265
|
}
|
|
48179
48266
|
},
|
|
48180
48267
|
"filePath": "src/tokens/functional/shadow/shadow.json5",
|
|
@@ -48183,7 +48270,7 @@
|
|
|
48183
48270
|
"$value": [
|
|
48184
48271
|
{
|
|
48185
48272
|
"color": "{base.color.neutral.13}",
|
|
48186
|
-
"alpha": 0.
|
|
48273
|
+
"alpha": 0.04,
|
|
48187
48274
|
"offsetX": "0px",
|
|
48188
48275
|
"offsetY": "1px",
|
|
48189
48276
|
"blur": "1px",
|
|
@@ -48192,15 +48279,16 @@
|
|
|
48192
48279
|
},
|
|
48193
48280
|
{
|
|
48194
48281
|
"color": "{base.color.neutral.13}",
|
|
48195
|
-
"alpha": 0.
|
|
48282
|
+
"alpha": 0.03,
|
|
48196
48283
|
"offsetX": "0px",
|
|
48197
48284
|
"offsetY": "1px",
|
|
48198
|
-
"blur": "
|
|
48285
|
+
"blur": "2px",
|
|
48199
48286
|
"spread": "0px",
|
|
48200
48287
|
"inset": false
|
|
48201
48288
|
}
|
|
48202
48289
|
],
|
|
48203
48290
|
"$type": "shadow",
|
|
48291
|
+
"$description": "Small resting shadow for buttons and interactive elements",
|
|
48204
48292
|
"$extensions": {
|
|
48205
48293
|
"org.primer.figma": {
|
|
48206
48294
|
"collection": "mode",
|
|
@@ -48232,6 +48320,10 @@
|
|
|
48232
48320
|
"isSource": true,
|
|
48233
48321
|
"$type": "shadow"
|
|
48234
48322
|
}
|
|
48323
|
+
},
|
|
48324
|
+
"org.primer.llm": {
|
|
48325
|
+
"usage": ["button", "interactive-card", "clickable-element"],
|
|
48326
|
+
"rules": "Use for buttons and small interactive elements at rest. Provides subtle depth and clickable affordance. RECOMMENDED for default button shadows."
|
|
48235
48327
|
}
|
|
48236
48328
|
},
|
|
48237
48329
|
"key": "{shadow.resting.small}"
|
|
@@ -48242,8 +48334,9 @@
|
|
|
48242
48334
|
},
|
|
48243
48335
|
"shadow-resting-xsmall": {
|
|
48244
48336
|
"key": "{shadow.resting.xsmall}",
|
|
48245
|
-
"$value": "0px 1px 1px 0px #
|
|
48337
|
+
"$value": "0px 1px 1px 0px #1f23280d",
|
|
48246
48338
|
"$type": "shadow",
|
|
48339
|
+
"$description": "Extra small resting shadow for minimal elevation",
|
|
48247
48340
|
"$extensions": {
|
|
48248
48341
|
"org.primer.figma": {
|
|
48249
48342
|
"collection": "mode",
|
|
@@ -48264,6 +48357,10 @@
|
|
|
48264
48357
|
"isSource": true,
|
|
48265
48358
|
"$type": "shadow"
|
|
48266
48359
|
}
|
|
48360
|
+
},
|
|
48361
|
+
"org.primer.llm": {
|
|
48362
|
+
"usage": ["badge", "chip", "small-card", "subtle-elevation"],
|
|
48363
|
+
"rules": "Use for very subtle elevation on small elements. Provides minimal lift from surface. Do NOT use for interactive elements needing clear affordance."
|
|
48267
48364
|
}
|
|
48268
48365
|
},
|
|
48269
48366
|
"filePath": "src/tokens/functional/shadow/shadow.json5",
|
|
@@ -48271,7 +48368,7 @@
|
|
|
48271
48368
|
"original": {
|
|
48272
48369
|
"$value": {
|
|
48273
48370
|
"color": "{base.color.neutral.13}",
|
|
48274
|
-
"alpha": 0.
|
|
48371
|
+
"alpha": 0.05,
|
|
48275
48372
|
"offsetX": "0px",
|
|
48276
48373
|
"offsetY": "1px",
|
|
48277
48374
|
"blur": "1px",
|
|
@@ -48279,6 +48376,7 @@
|
|
|
48279
48376
|
"inset": false
|
|
48280
48377
|
},
|
|
48281
48378
|
"$type": "shadow",
|
|
48379
|
+
"$description": "Extra small resting shadow for minimal elevation",
|
|
48282
48380
|
"$extensions": {
|
|
48283
48381
|
"org.primer.figma": {
|
|
48284
48382
|
"collection": "mode",
|
|
@@ -48299,6 +48397,10 @@
|
|
|
48299
48397
|
"isSource": true,
|
|
48300
48398
|
"$type": "shadow"
|
|
48301
48399
|
}
|
|
48400
|
+
},
|
|
48401
|
+
"org.primer.llm": {
|
|
48402
|
+
"usage": ["badge", "chip", "small-card", "subtle-elevation"],
|
|
48403
|
+
"rules": "Use for very subtle elevation on small elements. Provides minimal lift from surface. Do NOT use for interactive elements needing clear affordance."
|
|
48302
48404
|
}
|
|
48303
48405
|
},
|
|
48304
48406
|
"key": "{shadow.resting.xsmall}"
|