@primer/primitives 8.2.4-rc.f820602a → 8.2.4
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/dist/css/functional/size/border.css +1 -0
- package/dist/css/functional/themes/dark-colorblind.css +6 -0
- package/dist/css/functional/themes/dark-dimmed.css +6 -0
- package/dist/css/functional/themes/dark-high-contrast.css +8 -2
- package/dist/css/functional/themes/dark-tritanopia.css +6 -0
- package/dist/css/functional/themes/dark.css +6 -0
- package/dist/css/functional/themes/light-colorblind.css +6 -0
- package/dist/css/functional/themes/light-high-contrast.css +8 -2
- package/dist/css/functional/themes/light-tritanopia.css +6 -0
- package/dist/css/functional/themes/light.css +6 -0
- package/dist/css/primitives.css +1 -0
- package/dist/docs/functional/size/border.json +31 -0
- package/dist/docs/functional/themes/dark-colorblind.json +87 -0
- package/dist/docs/functional/themes/dark-dimmed.json +87 -0
- package/dist/docs/functional/themes/dark-high-contrast.json +90 -3
- package/dist/docs/functional/themes/dark-tritanopia.json +87 -0
- package/dist/docs/functional/themes/dark.json +87 -0
- package/dist/docs/functional/themes/light-colorblind.json +87 -0
- package/dist/docs/functional/themes/light-high-contrast.json +90 -3
- package/dist/docs/functional/themes/light-tritanopia.json +87 -0
- package/dist/docs/functional/themes/light.json +87 -0
- package/dist/fallbacks/functional/size/border.json +1 -0
- package/dist/figma/dimension/dimension.json +14 -0
- package/dist/figma/themes/dark-colorblind.json +48 -0
- package/dist/figma/themes/dark-dimmed.json +48 -0
- package/dist/figma/themes/dark-high-contrast.json +64 -16
- package/dist/figma/themes/dark-tritanopia.json +48 -0
- package/dist/figma/themes/dark.json +48 -0
- package/dist/figma/themes/light-colorblind.json +48 -0
- package/dist/figma/themes/light-high-contrast.json +64 -16
- package/dist/figma/themes/light-tritanopia.json +48 -0
- package/dist/figma/themes/light.json +48 -0
- package/dist/internalCss/dark-colorblind.css +6 -0
- package/dist/internalCss/dark-dimmed.css +6 -0
- package/dist/internalCss/dark-high-contrast.css +8 -2
- package/dist/internalCss/dark-tritanopia.css +6 -0
- package/dist/internalCss/dark.css +6 -0
- package/dist/internalCss/light-colorblind.css +6 -0
- package/dist/internalCss/light-high-contrast.css +8 -2
- package/dist/internalCss/light-tritanopia.css +6 -0
- package/dist/internalCss/light.css +6 -0
- package/dist/styleLint/functional/size/border.json +31 -0
- package/dist/styleLint/functional/themes/dark-colorblind.json +87 -0
- package/dist/styleLint/functional/themes/dark-dimmed.json +87 -0
- package/dist/styleLint/functional/themes/dark-high-contrast.json +90 -3
- package/dist/styleLint/functional/themes/dark-tritanopia.json +87 -0
- package/dist/styleLint/functional/themes/dark.json +87 -0
- package/dist/styleLint/functional/themes/light-colorblind.json +87 -0
- package/dist/styleLint/functional/themes/light-high-contrast.json +90 -3
- package/dist/styleLint/functional/themes/light-tritanopia.json +87 -0
- package/dist/styleLint/functional/themes/light.json +87 -0
- package/package.json +11 -8
- package/src/tokens/functional/color/dark/overrides/dark.high-contrast.json5 +16 -0
- package/src/tokens/functional/color/dark/patterns-dark.json5 +26 -0
- package/src/tokens/functional/color/dark/primitives-dark.json5 +12 -0
- package/src/tokens/functional/color/light/overrides/light.high-contrast.json5 +6 -0
- package/src/tokens/functional/color/light/patterns-light.json5 +26 -0
- package/src/tokens/functional/color/light/primitives-light.json5 +12 -0
- package/src/tokens/functional/size/border.json +13 -0
|
@@ -12566,6 +12566,64 @@
|
|
|
12566
12566
|
"attributes": {},
|
|
12567
12567
|
"path": ["label", "coral", "fgColor", "active"]
|
|
12568
12568
|
},
|
|
12569
|
+
"tooltip-bgColor": {
|
|
12570
|
+
"value": "#6e7681",
|
|
12571
|
+
"$type": "color",
|
|
12572
|
+
"$extensions": {
|
|
12573
|
+
"org.primer.figma": {
|
|
12574
|
+
"collection": "mode",
|
|
12575
|
+
"mode": "dark",
|
|
12576
|
+
"group": "component",
|
|
12577
|
+
"scopes": ["bgColor"]
|
|
12578
|
+
}
|
|
12579
|
+
},
|
|
12580
|
+
"filePath": "src/tokens/functional/color/dark/patterns-dark.json5",
|
|
12581
|
+
"isSource": true,
|
|
12582
|
+
"original": {
|
|
12583
|
+
"value": "{bgColor.emphasis}",
|
|
12584
|
+
"$type": "color",
|
|
12585
|
+
"$extensions": {
|
|
12586
|
+
"org.primer.figma": {
|
|
12587
|
+
"collection": "mode",
|
|
12588
|
+
"mode": "dark",
|
|
12589
|
+
"group": "component",
|
|
12590
|
+
"scopes": ["bgColor"]
|
|
12591
|
+
}
|
|
12592
|
+
}
|
|
12593
|
+
},
|
|
12594
|
+
"name": "tooltip-bgColor",
|
|
12595
|
+
"attributes": {},
|
|
12596
|
+
"path": ["tooltip", "bgColor"]
|
|
12597
|
+
},
|
|
12598
|
+
"tooltip-fgColor": {
|
|
12599
|
+
"value": "#ffffff",
|
|
12600
|
+
"$type": "color",
|
|
12601
|
+
"$extensions": {
|
|
12602
|
+
"org.primer.figma": {
|
|
12603
|
+
"collection": "mode",
|
|
12604
|
+
"mode": "dark",
|
|
12605
|
+
"group": "component",
|
|
12606
|
+
"scopes": ["fgColor"]
|
|
12607
|
+
}
|
|
12608
|
+
},
|
|
12609
|
+
"filePath": "src/tokens/functional/color/dark/patterns-dark.json5",
|
|
12610
|
+
"isSource": true,
|
|
12611
|
+
"original": {
|
|
12612
|
+
"value": "{fgColor.onEmphasis}",
|
|
12613
|
+
"$type": "color",
|
|
12614
|
+
"$extensions": {
|
|
12615
|
+
"org.primer.figma": {
|
|
12616
|
+
"collection": "mode",
|
|
12617
|
+
"mode": "dark",
|
|
12618
|
+
"group": "component",
|
|
12619
|
+
"scopes": ["fgColor"]
|
|
12620
|
+
}
|
|
12621
|
+
}
|
|
12622
|
+
},
|
|
12623
|
+
"name": "tooltip-fgColor",
|
|
12624
|
+
"attributes": {},
|
|
12625
|
+
"path": ["tooltip", "fgColor"]
|
|
12626
|
+
},
|
|
12569
12627
|
"fgColor-default": {
|
|
12570
12628
|
"value": "#e6edf3",
|
|
12571
12629
|
"$type": "color",
|
|
@@ -12687,6 +12745,35 @@
|
|
|
12687
12745
|
"attributes": {},
|
|
12688
12746
|
"path": ["fgColor", "onEmphasis"]
|
|
12689
12747
|
},
|
|
12748
|
+
"fgColor-onInverse": {
|
|
12749
|
+
"value": "#010409",
|
|
12750
|
+
"$type": "color",
|
|
12751
|
+
"$extensions": {
|
|
12752
|
+
"org.primer.figma": {
|
|
12753
|
+
"collection": "mode",
|
|
12754
|
+
"mode": "dark",
|
|
12755
|
+
"group": "semantic",
|
|
12756
|
+
"scopes": ["fgColor"]
|
|
12757
|
+
}
|
|
12758
|
+
},
|
|
12759
|
+
"filePath": "src/tokens/functional/color/dark/primitives-dark.json5",
|
|
12760
|
+
"isSource": true,
|
|
12761
|
+
"original": {
|
|
12762
|
+
"value": "{base.color.black}",
|
|
12763
|
+
"$type": "color",
|
|
12764
|
+
"$extensions": {
|
|
12765
|
+
"org.primer.figma": {
|
|
12766
|
+
"collection": "mode",
|
|
12767
|
+
"mode": "dark",
|
|
12768
|
+
"group": "semantic",
|
|
12769
|
+
"scopes": ["fgColor"]
|
|
12770
|
+
}
|
|
12771
|
+
}
|
|
12772
|
+
},
|
|
12773
|
+
"name": "fgColor-onInverse",
|
|
12774
|
+
"attributes": {},
|
|
12775
|
+
"path": ["fgColor", "onInverse"]
|
|
12776
|
+
},
|
|
12690
12777
|
"fgColor-white": {
|
|
12691
12778
|
"value": "#ffffff",
|
|
12692
12779
|
"$type": "color",
|
|
@@ -12566,6 +12566,64 @@
|
|
|
12566
12566
|
"attributes": {},
|
|
12567
12567
|
"path": ["label", "coral", "fgColor", "active"]
|
|
12568
12568
|
},
|
|
12569
|
+
"tooltip-bgColor": {
|
|
12570
|
+
"value": "#6e7681",
|
|
12571
|
+
"$type": "color",
|
|
12572
|
+
"$extensions": {
|
|
12573
|
+
"org.primer.figma": {
|
|
12574
|
+
"collection": "mode",
|
|
12575
|
+
"mode": "dark",
|
|
12576
|
+
"group": "component",
|
|
12577
|
+
"scopes": ["bgColor"]
|
|
12578
|
+
}
|
|
12579
|
+
},
|
|
12580
|
+
"filePath": "src/tokens/functional/color/dark/patterns-dark.json5",
|
|
12581
|
+
"isSource": true,
|
|
12582
|
+
"original": {
|
|
12583
|
+
"value": "{bgColor.emphasis}",
|
|
12584
|
+
"$type": "color",
|
|
12585
|
+
"$extensions": {
|
|
12586
|
+
"org.primer.figma": {
|
|
12587
|
+
"collection": "mode",
|
|
12588
|
+
"mode": "dark",
|
|
12589
|
+
"group": "component",
|
|
12590
|
+
"scopes": ["bgColor"]
|
|
12591
|
+
}
|
|
12592
|
+
}
|
|
12593
|
+
},
|
|
12594
|
+
"name": "tooltip-bgColor",
|
|
12595
|
+
"attributes": {},
|
|
12596
|
+
"path": ["tooltip", "bgColor"]
|
|
12597
|
+
},
|
|
12598
|
+
"tooltip-fgColor": {
|
|
12599
|
+
"value": "#ffffff",
|
|
12600
|
+
"$type": "color",
|
|
12601
|
+
"$extensions": {
|
|
12602
|
+
"org.primer.figma": {
|
|
12603
|
+
"collection": "mode",
|
|
12604
|
+
"mode": "dark",
|
|
12605
|
+
"group": "component",
|
|
12606
|
+
"scopes": ["fgColor"]
|
|
12607
|
+
}
|
|
12608
|
+
},
|
|
12609
|
+
"filePath": "src/tokens/functional/color/dark/patterns-dark.json5",
|
|
12610
|
+
"isSource": true,
|
|
12611
|
+
"original": {
|
|
12612
|
+
"value": "{fgColor.onEmphasis}",
|
|
12613
|
+
"$type": "color",
|
|
12614
|
+
"$extensions": {
|
|
12615
|
+
"org.primer.figma": {
|
|
12616
|
+
"collection": "mode",
|
|
12617
|
+
"mode": "dark",
|
|
12618
|
+
"group": "component",
|
|
12619
|
+
"scopes": ["fgColor"]
|
|
12620
|
+
}
|
|
12621
|
+
}
|
|
12622
|
+
},
|
|
12623
|
+
"name": "tooltip-fgColor",
|
|
12624
|
+
"attributes": {},
|
|
12625
|
+
"path": ["tooltip", "fgColor"]
|
|
12626
|
+
},
|
|
12569
12627
|
"fgColor-default": {
|
|
12570
12628
|
"value": "#e6edf3",
|
|
12571
12629
|
"$type": "color",
|
|
@@ -12687,6 +12745,35 @@
|
|
|
12687
12745
|
"attributes": {},
|
|
12688
12746
|
"path": ["fgColor", "onEmphasis"]
|
|
12689
12747
|
},
|
|
12748
|
+
"fgColor-onInverse": {
|
|
12749
|
+
"value": "#010409",
|
|
12750
|
+
"$type": "color",
|
|
12751
|
+
"$extensions": {
|
|
12752
|
+
"org.primer.figma": {
|
|
12753
|
+
"collection": "mode",
|
|
12754
|
+
"mode": "dark",
|
|
12755
|
+
"group": "semantic",
|
|
12756
|
+
"scopes": ["fgColor"]
|
|
12757
|
+
}
|
|
12758
|
+
},
|
|
12759
|
+
"filePath": "src/tokens/functional/color/dark/primitives-dark.json5",
|
|
12760
|
+
"isSource": true,
|
|
12761
|
+
"original": {
|
|
12762
|
+
"value": "{base.color.black}",
|
|
12763
|
+
"$type": "color",
|
|
12764
|
+
"$extensions": {
|
|
12765
|
+
"org.primer.figma": {
|
|
12766
|
+
"collection": "mode",
|
|
12767
|
+
"mode": "dark",
|
|
12768
|
+
"group": "semantic",
|
|
12769
|
+
"scopes": ["fgColor"]
|
|
12770
|
+
}
|
|
12771
|
+
}
|
|
12772
|
+
},
|
|
12773
|
+
"name": "fgColor-onInverse",
|
|
12774
|
+
"attributes": {},
|
|
12775
|
+
"path": ["fgColor", "onInverse"]
|
|
12776
|
+
},
|
|
12690
12777
|
"fgColor-white": {
|
|
12691
12778
|
"value": "#ffffff",
|
|
12692
12779
|
"$type": "color",
|
|
@@ -12575,6 +12575,64 @@
|
|
|
12575
12575
|
"attributes": {},
|
|
12576
12576
|
"path": ["label", "coral", "fgColor", "active"]
|
|
12577
12577
|
},
|
|
12578
|
+
"tooltip-bgColor": {
|
|
12579
|
+
"value": "#24292f",
|
|
12580
|
+
"$type": "color",
|
|
12581
|
+
"$extensions": {
|
|
12582
|
+
"org.primer.figma": {
|
|
12583
|
+
"collection": "mode",
|
|
12584
|
+
"mode": "light",
|
|
12585
|
+
"group": "component",
|
|
12586
|
+
"scopes": ["bgColor"]
|
|
12587
|
+
}
|
|
12588
|
+
},
|
|
12589
|
+
"filePath": "src/tokens/functional/color/light/patterns-light.json5",
|
|
12590
|
+
"isSource": true,
|
|
12591
|
+
"original": {
|
|
12592
|
+
"value": "{bgColor.emphasis}",
|
|
12593
|
+
"$type": "color",
|
|
12594
|
+
"$extensions": {
|
|
12595
|
+
"org.primer.figma": {
|
|
12596
|
+
"collection": "mode",
|
|
12597
|
+
"mode": "light",
|
|
12598
|
+
"group": "component",
|
|
12599
|
+
"scopes": ["bgColor"]
|
|
12600
|
+
}
|
|
12601
|
+
}
|
|
12602
|
+
},
|
|
12603
|
+
"name": "tooltip-bgColor",
|
|
12604
|
+
"attributes": {},
|
|
12605
|
+
"path": ["tooltip", "bgColor"]
|
|
12606
|
+
},
|
|
12607
|
+
"tooltip-fgColor": {
|
|
12608
|
+
"value": "#ffffff",
|
|
12609
|
+
"$type": "color",
|
|
12610
|
+
"$extensions": {
|
|
12611
|
+
"org.primer.figma": {
|
|
12612
|
+
"collection": "mode",
|
|
12613
|
+
"mode": "light",
|
|
12614
|
+
"group": "component",
|
|
12615
|
+
"scopes": ["fgColor"]
|
|
12616
|
+
}
|
|
12617
|
+
},
|
|
12618
|
+
"filePath": "src/tokens/functional/color/light/patterns-light.json5",
|
|
12619
|
+
"isSource": true,
|
|
12620
|
+
"original": {
|
|
12621
|
+
"value": "{fgColor.onEmphasis}",
|
|
12622
|
+
"$type": "color",
|
|
12623
|
+
"$extensions": {
|
|
12624
|
+
"org.primer.figma": {
|
|
12625
|
+
"collection": "mode",
|
|
12626
|
+
"mode": "light",
|
|
12627
|
+
"group": "component",
|
|
12628
|
+
"scopes": ["fgColor"]
|
|
12629
|
+
}
|
|
12630
|
+
}
|
|
12631
|
+
},
|
|
12632
|
+
"name": "tooltip-fgColor",
|
|
12633
|
+
"attributes": {},
|
|
12634
|
+
"path": ["tooltip", "fgColor"]
|
|
12635
|
+
},
|
|
12578
12636
|
"fgColor-default": {
|
|
12579
12637
|
"value": "#1f2328",
|
|
12580
12638
|
"$type": "color",
|
|
@@ -12688,6 +12746,35 @@
|
|
|
12688
12746
|
"attributes": {},
|
|
12689
12747
|
"path": ["fgColor", "onEmphasis"]
|
|
12690
12748
|
},
|
|
12749
|
+
"fgColor-onInverse": {
|
|
12750
|
+
"value": "#ffffff",
|
|
12751
|
+
"$type": "color",
|
|
12752
|
+
"$extensions": {
|
|
12753
|
+
"org.primer.figma": {
|
|
12754
|
+
"collection": "mode",
|
|
12755
|
+
"mode": "light",
|
|
12756
|
+
"group": "semantic",
|
|
12757
|
+
"scopes": ["fgColor"]
|
|
12758
|
+
}
|
|
12759
|
+
},
|
|
12760
|
+
"filePath": "src/tokens/functional/color/light/primitives-light.json5",
|
|
12761
|
+
"isSource": true,
|
|
12762
|
+
"original": {
|
|
12763
|
+
"value": "{base.color.white}",
|
|
12764
|
+
"$type": "color",
|
|
12765
|
+
"$extensions": {
|
|
12766
|
+
"org.primer.figma": {
|
|
12767
|
+
"collection": "mode",
|
|
12768
|
+
"mode": "light",
|
|
12769
|
+
"group": "semantic",
|
|
12770
|
+
"scopes": ["fgColor"]
|
|
12771
|
+
}
|
|
12772
|
+
}
|
|
12773
|
+
},
|
|
12774
|
+
"name": "fgColor-onInverse",
|
|
12775
|
+
"attributes": {},
|
|
12776
|
+
"path": ["fgColor", "onInverse"]
|
|
12777
|
+
},
|
|
12691
12778
|
"fgColor-white": {
|
|
12692
12779
|
"value": "#ffffff",
|
|
12693
12780
|
"$type": "color",
|
|
@@ -6039,7 +6039,7 @@
|
|
|
6039
6039
|
"path": ["controlTrack", "fgColor", "disabled"]
|
|
6040
6040
|
},
|
|
6041
6041
|
"controlTrack-borderColor-rest": {
|
|
6042
|
-
"value": "#
|
|
6042
|
+
"value": "#66707b",
|
|
6043
6043
|
"$type": "color",
|
|
6044
6044
|
"$extensions": {
|
|
6045
6045
|
"org.primer.figma": {
|
|
@@ -6049,10 +6049,10 @@
|
|
|
6049
6049
|
"scopes": ["borderColor"]
|
|
6050
6050
|
}
|
|
6051
6051
|
},
|
|
6052
|
-
"filePath": "src/tokens/functional/color/light/
|
|
6052
|
+
"filePath": "src/tokens/functional/color/light/overrides/light.high-contrast.json5",
|
|
6053
6053
|
"isSource": true,
|
|
6054
6054
|
"original": {
|
|
6055
|
-
"value": "{
|
|
6055
|
+
"value": "{borderColor.emphasis}",
|
|
6056
6056
|
"$type": "color",
|
|
6057
6057
|
"$extensions": {
|
|
6058
6058
|
"org.primer.figma": {
|
|
@@ -12597,6 +12597,64 @@
|
|
|
12597
12597
|
"attributes": {},
|
|
12598
12598
|
"path": ["label", "coral", "fgColor", "active"]
|
|
12599
12599
|
},
|
|
12600
|
+
"tooltip-bgColor": {
|
|
12601
|
+
"value": "#0e1116",
|
|
12602
|
+
"$type": "color",
|
|
12603
|
+
"$extensions": {
|
|
12604
|
+
"org.primer.figma": {
|
|
12605
|
+
"collection": "mode",
|
|
12606
|
+
"mode": "light",
|
|
12607
|
+
"group": "component",
|
|
12608
|
+
"scopes": ["bgColor"]
|
|
12609
|
+
}
|
|
12610
|
+
},
|
|
12611
|
+
"filePath": "src/tokens/functional/color/light/patterns-light.json5",
|
|
12612
|
+
"isSource": true,
|
|
12613
|
+
"original": {
|
|
12614
|
+
"value": "{bgColor.emphasis}",
|
|
12615
|
+
"$type": "color",
|
|
12616
|
+
"$extensions": {
|
|
12617
|
+
"org.primer.figma": {
|
|
12618
|
+
"collection": "mode",
|
|
12619
|
+
"mode": "light",
|
|
12620
|
+
"group": "component",
|
|
12621
|
+
"scopes": ["bgColor"]
|
|
12622
|
+
}
|
|
12623
|
+
}
|
|
12624
|
+
},
|
|
12625
|
+
"name": "tooltip-bgColor",
|
|
12626
|
+
"attributes": {},
|
|
12627
|
+
"path": ["tooltip", "bgColor"]
|
|
12628
|
+
},
|
|
12629
|
+
"tooltip-fgColor": {
|
|
12630
|
+
"value": "#ffffff",
|
|
12631
|
+
"$type": "color",
|
|
12632
|
+
"$extensions": {
|
|
12633
|
+
"org.primer.figma": {
|
|
12634
|
+
"collection": "mode",
|
|
12635
|
+
"mode": "light",
|
|
12636
|
+
"group": "component",
|
|
12637
|
+
"scopes": ["fgColor"]
|
|
12638
|
+
}
|
|
12639
|
+
},
|
|
12640
|
+
"filePath": "src/tokens/functional/color/light/patterns-light.json5",
|
|
12641
|
+
"isSource": true,
|
|
12642
|
+
"original": {
|
|
12643
|
+
"value": "{fgColor.onEmphasis}",
|
|
12644
|
+
"$type": "color",
|
|
12645
|
+
"$extensions": {
|
|
12646
|
+
"org.primer.figma": {
|
|
12647
|
+
"collection": "mode",
|
|
12648
|
+
"mode": "light",
|
|
12649
|
+
"group": "component",
|
|
12650
|
+
"scopes": ["fgColor"]
|
|
12651
|
+
}
|
|
12652
|
+
}
|
|
12653
|
+
},
|
|
12654
|
+
"name": "tooltip-fgColor",
|
|
12655
|
+
"attributes": {},
|
|
12656
|
+
"path": ["tooltip", "fgColor"]
|
|
12657
|
+
},
|
|
12600
12658
|
"fgColor-default": {
|
|
12601
12659
|
"value": "#010409",
|
|
12602
12660
|
"$type": "color",
|
|
@@ -12704,6 +12762,35 @@
|
|
|
12704
12762
|
"attributes": {},
|
|
12705
12763
|
"path": ["fgColor", "onEmphasis"]
|
|
12706
12764
|
},
|
|
12765
|
+
"fgColor-onInverse": {
|
|
12766
|
+
"value": "#ffffff",
|
|
12767
|
+
"$type": "color",
|
|
12768
|
+
"$extensions": {
|
|
12769
|
+
"org.primer.figma": {
|
|
12770
|
+
"collection": "mode",
|
|
12771
|
+
"mode": "light",
|
|
12772
|
+
"group": "semantic",
|
|
12773
|
+
"scopes": ["fgColor"]
|
|
12774
|
+
}
|
|
12775
|
+
},
|
|
12776
|
+
"filePath": "src/tokens/functional/color/light/primitives-light.json5",
|
|
12777
|
+
"isSource": true,
|
|
12778
|
+
"original": {
|
|
12779
|
+
"value": "{base.color.white}",
|
|
12780
|
+
"$type": "color",
|
|
12781
|
+
"$extensions": {
|
|
12782
|
+
"org.primer.figma": {
|
|
12783
|
+
"collection": "mode",
|
|
12784
|
+
"mode": "light",
|
|
12785
|
+
"group": "semantic",
|
|
12786
|
+
"scopes": ["fgColor"]
|
|
12787
|
+
}
|
|
12788
|
+
}
|
|
12789
|
+
},
|
|
12790
|
+
"name": "fgColor-onInverse",
|
|
12791
|
+
"attributes": {},
|
|
12792
|
+
"path": ["fgColor", "onInverse"]
|
|
12793
|
+
},
|
|
12707
12794
|
"fgColor-white": {
|
|
12708
12795
|
"value": "#ffffff",
|
|
12709
12796
|
"$type": "color",
|
|
@@ -12571,6 +12571,64 @@
|
|
|
12571
12571
|
"attributes": {},
|
|
12572
12572
|
"path": ["label", "coral", "fgColor", "active"]
|
|
12573
12573
|
},
|
|
12574
|
+
"tooltip-bgColor": {
|
|
12575
|
+
"value": "#24292f",
|
|
12576
|
+
"$type": "color",
|
|
12577
|
+
"$extensions": {
|
|
12578
|
+
"org.primer.figma": {
|
|
12579
|
+
"collection": "mode",
|
|
12580
|
+
"mode": "light",
|
|
12581
|
+
"group": "component",
|
|
12582
|
+
"scopes": ["bgColor"]
|
|
12583
|
+
}
|
|
12584
|
+
},
|
|
12585
|
+
"filePath": "src/tokens/functional/color/light/patterns-light.json5",
|
|
12586
|
+
"isSource": true,
|
|
12587
|
+
"original": {
|
|
12588
|
+
"value": "{bgColor.emphasis}",
|
|
12589
|
+
"$type": "color",
|
|
12590
|
+
"$extensions": {
|
|
12591
|
+
"org.primer.figma": {
|
|
12592
|
+
"collection": "mode",
|
|
12593
|
+
"mode": "light",
|
|
12594
|
+
"group": "component",
|
|
12595
|
+
"scopes": ["bgColor"]
|
|
12596
|
+
}
|
|
12597
|
+
}
|
|
12598
|
+
},
|
|
12599
|
+
"name": "tooltip-bgColor",
|
|
12600
|
+
"attributes": {},
|
|
12601
|
+
"path": ["tooltip", "bgColor"]
|
|
12602
|
+
},
|
|
12603
|
+
"tooltip-fgColor": {
|
|
12604
|
+
"value": "#ffffff",
|
|
12605
|
+
"$type": "color",
|
|
12606
|
+
"$extensions": {
|
|
12607
|
+
"org.primer.figma": {
|
|
12608
|
+
"collection": "mode",
|
|
12609
|
+
"mode": "light",
|
|
12610
|
+
"group": "component",
|
|
12611
|
+
"scopes": ["fgColor"]
|
|
12612
|
+
}
|
|
12613
|
+
},
|
|
12614
|
+
"filePath": "src/tokens/functional/color/light/patterns-light.json5",
|
|
12615
|
+
"isSource": true,
|
|
12616
|
+
"original": {
|
|
12617
|
+
"value": "{fgColor.onEmphasis}",
|
|
12618
|
+
"$type": "color",
|
|
12619
|
+
"$extensions": {
|
|
12620
|
+
"org.primer.figma": {
|
|
12621
|
+
"collection": "mode",
|
|
12622
|
+
"mode": "light",
|
|
12623
|
+
"group": "component",
|
|
12624
|
+
"scopes": ["fgColor"]
|
|
12625
|
+
}
|
|
12626
|
+
}
|
|
12627
|
+
},
|
|
12628
|
+
"name": "tooltip-fgColor",
|
|
12629
|
+
"attributes": {},
|
|
12630
|
+
"path": ["tooltip", "fgColor"]
|
|
12631
|
+
},
|
|
12574
12632
|
"fgColor-default": {
|
|
12575
12633
|
"value": "#1f2328",
|
|
12576
12634
|
"$type": "color",
|
|
@@ -12684,6 +12742,35 @@
|
|
|
12684
12742
|
"attributes": {},
|
|
12685
12743
|
"path": ["fgColor", "onEmphasis"]
|
|
12686
12744
|
},
|
|
12745
|
+
"fgColor-onInverse": {
|
|
12746
|
+
"value": "#ffffff",
|
|
12747
|
+
"$type": "color",
|
|
12748
|
+
"$extensions": {
|
|
12749
|
+
"org.primer.figma": {
|
|
12750
|
+
"collection": "mode",
|
|
12751
|
+
"mode": "light",
|
|
12752
|
+
"group": "semantic",
|
|
12753
|
+
"scopes": ["fgColor"]
|
|
12754
|
+
}
|
|
12755
|
+
},
|
|
12756
|
+
"filePath": "src/tokens/functional/color/light/primitives-light.json5",
|
|
12757
|
+
"isSource": true,
|
|
12758
|
+
"original": {
|
|
12759
|
+
"value": "{base.color.white}",
|
|
12760
|
+
"$type": "color",
|
|
12761
|
+
"$extensions": {
|
|
12762
|
+
"org.primer.figma": {
|
|
12763
|
+
"collection": "mode",
|
|
12764
|
+
"mode": "light",
|
|
12765
|
+
"group": "semantic",
|
|
12766
|
+
"scopes": ["fgColor"]
|
|
12767
|
+
}
|
|
12768
|
+
}
|
|
12769
|
+
},
|
|
12770
|
+
"name": "fgColor-onInverse",
|
|
12771
|
+
"attributes": {},
|
|
12772
|
+
"path": ["fgColor", "onInverse"]
|
|
12773
|
+
},
|
|
12687
12774
|
"fgColor-white": {
|
|
12688
12775
|
"value": "#ffffff",
|
|
12689
12776
|
"$type": "color",
|
|
@@ -12571,6 +12571,64 @@
|
|
|
12571
12571
|
"attributes": {},
|
|
12572
12572
|
"path": ["label", "coral", "fgColor", "active"]
|
|
12573
12573
|
},
|
|
12574
|
+
"tooltip-bgColor": {
|
|
12575
|
+
"value": "#24292f",
|
|
12576
|
+
"$type": "color",
|
|
12577
|
+
"$extensions": {
|
|
12578
|
+
"org.primer.figma": {
|
|
12579
|
+
"collection": "mode",
|
|
12580
|
+
"mode": "light",
|
|
12581
|
+
"group": "component",
|
|
12582
|
+
"scopes": ["bgColor"]
|
|
12583
|
+
}
|
|
12584
|
+
},
|
|
12585
|
+
"filePath": "src/tokens/functional/color/light/patterns-light.json5",
|
|
12586
|
+
"isSource": true,
|
|
12587
|
+
"original": {
|
|
12588
|
+
"value": "{bgColor.emphasis}",
|
|
12589
|
+
"$type": "color",
|
|
12590
|
+
"$extensions": {
|
|
12591
|
+
"org.primer.figma": {
|
|
12592
|
+
"collection": "mode",
|
|
12593
|
+
"mode": "light",
|
|
12594
|
+
"group": "component",
|
|
12595
|
+
"scopes": ["bgColor"]
|
|
12596
|
+
}
|
|
12597
|
+
}
|
|
12598
|
+
},
|
|
12599
|
+
"name": "tooltip-bgColor",
|
|
12600
|
+
"attributes": {},
|
|
12601
|
+
"path": ["tooltip", "bgColor"]
|
|
12602
|
+
},
|
|
12603
|
+
"tooltip-fgColor": {
|
|
12604
|
+
"value": "#ffffff",
|
|
12605
|
+
"$type": "color",
|
|
12606
|
+
"$extensions": {
|
|
12607
|
+
"org.primer.figma": {
|
|
12608
|
+
"collection": "mode",
|
|
12609
|
+
"mode": "light",
|
|
12610
|
+
"group": "component",
|
|
12611
|
+
"scopes": ["fgColor"]
|
|
12612
|
+
}
|
|
12613
|
+
},
|
|
12614
|
+
"filePath": "src/tokens/functional/color/light/patterns-light.json5",
|
|
12615
|
+
"isSource": true,
|
|
12616
|
+
"original": {
|
|
12617
|
+
"value": "{fgColor.onEmphasis}",
|
|
12618
|
+
"$type": "color",
|
|
12619
|
+
"$extensions": {
|
|
12620
|
+
"org.primer.figma": {
|
|
12621
|
+
"collection": "mode",
|
|
12622
|
+
"mode": "light",
|
|
12623
|
+
"group": "component",
|
|
12624
|
+
"scopes": ["fgColor"]
|
|
12625
|
+
}
|
|
12626
|
+
}
|
|
12627
|
+
},
|
|
12628
|
+
"name": "tooltip-fgColor",
|
|
12629
|
+
"attributes": {},
|
|
12630
|
+
"path": ["tooltip", "fgColor"]
|
|
12631
|
+
},
|
|
12574
12632
|
"fgColor-default": {
|
|
12575
12633
|
"value": "#1f2328",
|
|
12576
12634
|
"$type": "color",
|
|
@@ -12684,6 +12742,35 @@
|
|
|
12684
12742
|
"attributes": {},
|
|
12685
12743
|
"path": ["fgColor", "onEmphasis"]
|
|
12686
12744
|
},
|
|
12745
|
+
"fgColor-onInverse": {
|
|
12746
|
+
"value": "#ffffff",
|
|
12747
|
+
"$type": "color",
|
|
12748
|
+
"$extensions": {
|
|
12749
|
+
"org.primer.figma": {
|
|
12750
|
+
"collection": "mode",
|
|
12751
|
+
"mode": "light",
|
|
12752
|
+
"group": "semantic",
|
|
12753
|
+
"scopes": ["fgColor"]
|
|
12754
|
+
}
|
|
12755
|
+
},
|
|
12756
|
+
"filePath": "src/tokens/functional/color/light/primitives-light.json5",
|
|
12757
|
+
"isSource": true,
|
|
12758
|
+
"original": {
|
|
12759
|
+
"value": "{base.color.white}",
|
|
12760
|
+
"$type": "color",
|
|
12761
|
+
"$extensions": {
|
|
12762
|
+
"org.primer.figma": {
|
|
12763
|
+
"collection": "mode",
|
|
12764
|
+
"mode": "light",
|
|
12765
|
+
"group": "semantic",
|
|
12766
|
+
"scopes": ["fgColor"]
|
|
12767
|
+
}
|
|
12768
|
+
}
|
|
12769
|
+
},
|
|
12770
|
+
"name": "fgColor-onInverse",
|
|
12771
|
+
"attributes": {},
|
|
12772
|
+
"path": ["fgColor", "onInverse"]
|
|
12773
|
+
},
|
|
12687
12774
|
"fgColor-white": {
|
|
12688
12775
|
"value": "#ffffff",
|
|
12689
12776
|
"$type": "color",
|
package/package.json
CHANGED
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@primer/primitives",
|
|
3
|
-
"version": "8.2.4
|
|
3
|
+
"version": "8.2.4",
|
|
4
4
|
"description": "Typography, spacing, and color primitives for Primer design system",
|
|
5
|
+
"engines": {
|
|
6
|
+
"node": ">=18.18.0 <18.19.0"
|
|
7
|
+
},
|
|
5
8
|
"files": [
|
|
6
9
|
"dist",
|
|
7
10
|
"src/**/*",
|
|
@@ -25,17 +28,17 @@
|
|
|
25
28
|
"scripts": {
|
|
26
29
|
"build": "npm run build:v8 && npm run build:fallbacks && npm run build:figma",
|
|
27
30
|
"build:next": "echo '\\033[31m 🛑 Use npm run build instead of npm run build:next\\033[0m'",
|
|
28
|
-
"build:v8": "
|
|
29
|
-
"build:fallbacks": "
|
|
30
|
-
"build:figma": "
|
|
31
|
-
"tokenJson:check": "
|
|
32
|
-
"contrast:check": "
|
|
31
|
+
"build:v8": "tsx ./scripts/buildTokens.ts",
|
|
32
|
+
"build:fallbacks": "tsx ./scripts/buildFallbacks.ts",
|
|
33
|
+
"build:figma": "tsx scripts/buildFigma.ts",
|
|
34
|
+
"tokenJson:check": "tsx scripts/diffThemes.ts && tsx scripts/diffTokenProps.ts",
|
|
35
|
+
"contrast:check": "tsx scripts/color-contrast.ts",
|
|
33
36
|
"format": "prettier --write '**/*.{js,jsx,ts,tsx,md,mdx,css}'",
|
|
34
37
|
"format:check": "prettier --check '**/*.{js,jsx,ts,tsx,md,mdx,css}'",
|
|
35
38
|
"install:storybook": "cd docs/storybook && npm ci --legacy-peer-deps --no-audit --no-fund",
|
|
36
39
|
"lint": "ESLINT_USE_FLAT_CONFIG=false eslint '**/*.{js,ts,tsx,md,mdx}' --config .eslintrc.cjs && npm run lint:tokens",
|
|
37
40
|
"lint:fix": "eslint '**/*.{js,ts,tsx,md,mdx}' --fix --max-warnings=0 --config .eslintrc.cjs",
|
|
38
|
-
"lint:tokens": "
|
|
41
|
+
"lint:tokens": "tsx ./scripts/validateTokenJson.ts",
|
|
39
42
|
"prebuild": "rm -rf dist",
|
|
40
43
|
"prepack": "npm run build",
|
|
41
44
|
"release": "changeset publish",
|
|
@@ -71,7 +74,7 @@
|
|
|
71
74
|
"markdown-table-ts": "^1.0.3",
|
|
72
75
|
"prettier": "3.3",
|
|
73
76
|
"style-dictionary": "^3.9.2",
|
|
74
|
-
"
|
|
77
|
+
"tsx": "^4.16.2",
|
|
75
78
|
"typescript": "5.5",
|
|
76
79
|
"vitest": "^2.0.1",
|
|
77
80
|
"zod": "3.23",
|