@primer/primitives 10.2.0 → 10.3.0-rc.37645a3a
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/build/formats/cssCustomMedia.js +2 -2
- package/dist/build/formats/jsonOneDimensional.js +2 -1
- package/dist/build/platforms/css.js +5 -2
- package/dist/build/platforms/figma.js +2 -2
- package/dist/build/preprocessors/themeOverrides.js +7 -4
- package/dist/build/schemas/collections.d.ts +1 -1
- package/dist/build/schemas/colorToken.d.ts +471 -65
- package/dist/build/schemas/colorToken.js +18 -15
- package/dist/build/schemas/shadowToken.js +2 -2
- package/dist/build/transformers/colorAlphaToCss.d.ts +1 -1
- package/dist/build/transformers/figmaAttributes.js +2 -1
- package/dist/build/types/styleDictionaryConfigGenerator.d.ts +1 -1
- package/dist/build/utilities/asArray.d.ts +1 -0
- package/dist/build/utilities/asArray.js +1 -0
- package/dist/css/functional/size/border.css +5 -5
- package/dist/css/functional/size/size.css +15 -15
- package/dist/css/functional/size/viewport.css +2 -2
- package/dist/css/functional/themes/dark-colorblind.css +408 -408
- package/dist/css/functional/themes/dark-dimmed.css +390 -390
- package/dist/css/functional/themes/dark-high-contrast.css +412 -412
- package/dist/css/functional/themes/dark-tritanopia.css +406 -406
- package/dist/css/functional/themes/dark.css +416 -416
- package/dist/css/functional/themes/light-colorblind.css +444 -444
- package/dist/css/functional/themes/light-high-contrast.css +438 -438
- package/dist/css/functional/themes/light-tritanopia.css +432 -432
- package/dist/css/functional/themes/light.css +444 -444
- package/dist/css/primitives.css +20 -20
- package/dist/docs/base/motion/motion.json +88 -73
- package/dist/docs/base/size/size.json +94 -75
- package/dist/docs/base/typography/typography.json +14 -10
- package/dist/docs/functional/motion/motion.json +19 -15
- package/dist/docs/functional/size/border.json +139 -125
- package/dist/docs/functional/size/breakpoints.json +31 -25
- package/dist/docs/functional/size/size-coarse.json +13 -10
- package/dist/docs/functional/size/size-fine.json +9 -6
- package/dist/docs/functional/size/size.json +499 -433
- package/dist/docs/functional/size/viewport.json +32 -26
- package/dist/docs/functional/themes/dark-colorblind.json +7175 -6545
- package/dist/docs/functional/themes/dark-dimmed.json +7181 -6473
- package/dist/docs/functional/themes/dark-high-contrast.json +7445 -6789
- package/dist/docs/functional/themes/dark-tritanopia.json +7164 -6498
- package/dist/docs/functional/themes/dark.json +7202 -6494
- package/dist/docs/functional/themes/light-colorblind.json +7096 -6466
- package/dist/docs/functional/themes/light-high-contrast.json +7326 -6660
- package/dist/docs/functional/themes/light-tritanopia.json +7109 -6479
- package/dist/docs/functional/themes/light.json +7159 -6451
- package/dist/docs/functional/typography/typography.json +518 -472
- package/dist/figma/figma.json +3 -3
- package/dist/figma/shadows/dark-colorblind.json +115 -115
- package/dist/figma/shadows/light-colorblind.json +105 -105
- package/dist/figma/themes/dark-colorblind.json +5553 -5553
- package/dist/figma/themes/dark-dimmed.json +5162 -5162
- package/dist/figma/themes/dark-high-contrast.json +4196 -4196
- package/dist/figma/themes/dark-tritanopia.json +5211 -5211
- package/dist/figma/themes/dark.json +5537 -5537
- package/dist/figma/themes/light-colorblind.json +5501 -5501
- package/dist/figma/themes/light-high-contrast.json +4176 -4176
- package/dist/figma/themes/light-tritanopia.json +5077 -5077
- package/dist/figma/themes/light.json +1950 -1950
- package/dist/internalCss/dark-colorblind.css +1148 -1148
- package/dist/internalCss/dark-dimmed.css +1138 -1138
- package/dist/internalCss/dark-high-contrast.css +1154 -1154
- package/dist/internalCss/dark-tritanopia.css +1148 -1148
- package/dist/internalCss/dark.css +1150 -1150
- package/dist/internalCss/light-colorblind.css +1152 -1152
- package/dist/internalCss/light-high-contrast.css +1166 -1166
- package/dist/internalCss/light-tritanopia.css +1156 -1156
- package/dist/internalCss/light.css +1158 -1158
- package/dist/styleLint/base/motion/motion.json +97 -82
- package/dist/styleLint/base/size/size.json +102 -83
- package/dist/styleLint/base/typography/typography.json +16 -12
- package/dist/styleLint/functional/motion/motion.json +22 -18
- package/dist/styleLint/functional/size/border.json +140 -126
- package/dist/styleLint/functional/size/breakpoints.json +32 -26
- package/dist/styleLint/functional/size/size-coarse.json +14 -11
- package/dist/styleLint/functional/size/size-fine.json +10 -7
- package/dist/styleLint/functional/size/size.json +486 -420
- package/dist/styleLint/functional/size/viewport.json +36 -30
- package/dist/styleLint/functional/themes/dark-colorblind.json +6927 -6297
- package/dist/styleLint/functional/themes/dark-dimmed.json +7372 -6664
- package/dist/styleLint/functional/themes/dark-high-contrast.json +7472 -6816
- package/dist/styleLint/functional/themes/dark-tritanopia.json +7051 -6385
- package/dist/styleLint/functional/themes/dark.json +7180 -6472
- package/dist/styleLint/functional/themes/light-colorblind.json +7042 -6412
- package/dist/styleLint/functional/themes/light-high-contrast.json +7418 -6752
- package/dist/styleLint/functional/themes/light-tritanopia.json +6926 -6296
- package/dist/styleLint/functional/themes/light.json +7093 -6385
- package/dist/styleLint/functional/typography/typography.json +520 -474
- package/package.json +2 -2
- package/src/tokens/component/diffBlob.json5 +293 -0
- package/src/tokens/component/highlight.json5 +23 -0
- package/src/tokens/functional/color/dark/app-dark.json5 +0 -302
- package/src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5 +5 -5
- package/src/tokens/functional/color/light/app-light.json5 +1 -274
- package/src/tokens/functional/color/light/overrides/light.protanopia-deuteranopia.json5 +5 -5
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { asArray } from '../utilities/asArray.js';
|
|
1
2
|
const figmaScopes = {
|
|
2
3
|
all: ['ALL_SCOPES'],
|
|
3
4
|
radius: ['CORNER_RADIUS'],
|
|
@@ -45,7 +46,7 @@ export const figmaAttributes = {
|
|
|
45
46
|
var _a, _b;
|
|
46
47
|
const { modeOverride, collection, scopes, group, codeSyntax } = ((_a = token.$extensions) === null || _a === void 0 ? void 0 : _a['org.primer.figma']) || {};
|
|
47
48
|
return {
|
|
48
|
-
mode: ((_b = platform.options) === null || _b === void 0 ? void 0 : _b.theme) || modeOverride || 'default',
|
|
49
|
+
mode: asArray((_b = platform.options) === null || _b === void 0 ? void 0 : _b.theme)[0] || modeOverride || 'default',
|
|
49
50
|
collection,
|
|
50
51
|
group: group || collection,
|
|
51
52
|
scopes: getScopes(scopes),
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const asArray: (item: unknown) => any[];
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export const asArray = (item) => (Array.isArray(item) ? item : [item]).filter(Boolean);
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
:root {
|
|
2
|
-
--borderRadius-default: 0.375rem;
|
|
3
2
|
--borderRadius-full: 624.9375rem; /* Use this border radius for pill shaped elements */
|
|
4
3
|
--borderRadius-large: 0.75rem;
|
|
5
4
|
--borderRadius-medium: 0.375rem;
|
|
6
5
|
--borderRadius-small: 0.1875rem;
|
|
7
|
-
--borderWidth-default: 0.0625rem;
|
|
8
6
|
--borderWidth-thick: 0.125rem;
|
|
9
7
|
--borderWidth-thicker: 0.25rem;
|
|
10
8
|
--borderWidth-thin: 0.0625rem;
|
|
11
|
-
--boxShadow-thick: inset 0 0 0 0.125rem;
|
|
12
|
-
--boxShadow-thicker: inset 0 0 0 0.25rem;
|
|
13
|
-
--boxShadow-thin: inset 0 0 0 0.0625rem; /* Thin shadow for borders */
|
|
14
9
|
--outline-focus-offset: -0.125rem;
|
|
15
10
|
--outline-focus-width: 0.125rem;
|
|
11
|
+
--borderRadius-default: var(--borderRadius-medium);
|
|
12
|
+
--borderWidth-default: var(--borderWidth-thin);
|
|
13
|
+
--boxShadow-thick: inset 0 0 0 var(--borderWidth-thick);
|
|
14
|
+
--boxShadow-thicker: inset 0 0 0 var(--borderWidth-thicker);
|
|
15
|
+
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin); /* Thin shadow for borders */
|
|
16
16
|
}
|
|
@@ -1,13 +1,26 @@
|
|
|
1
1
|
:root {
|
|
2
|
+
--control-large-paddingBlock: 0.625rem;
|
|
3
|
+
--control-medium-paddingBlock: 0.375rem;
|
|
4
|
+
--control-xlarge-paddingBlock: 0.875rem;
|
|
5
|
+
--control-xsmall-paddingBlock: 0.125rem;
|
|
6
|
+
--overlay-height-large: 27rem;
|
|
7
|
+
--overlay-height-medium: 20rem;
|
|
8
|
+
--overlay-height-small: 16rem;
|
|
9
|
+
--overlay-height-xlarge: 37.5rem;
|
|
10
|
+
--overlay-offset: 0.25rem;
|
|
11
|
+
--overlay-width-large: 40rem;
|
|
12
|
+
--overlay-width-medium: 30rem;
|
|
13
|
+
--overlay-width-small: 20rem;
|
|
14
|
+
--overlay-width-xlarge: 60rem;
|
|
15
|
+
--overlay-width-xsmall: 12rem;
|
|
16
|
+
--spinner-strokeWidth-default: 0.125rem;
|
|
2
17
|
--control-large-gap: 0.5rem;
|
|
3
18
|
--control-large-lineBoxHeight: 1.25rem;
|
|
4
|
-
--control-large-paddingBlock: 0.625rem;
|
|
5
19
|
--control-large-paddingInline-normal: 0.75rem;
|
|
6
20
|
--control-large-paddingInline-spacious: 1rem;
|
|
7
21
|
--control-large-size: 2.5rem;
|
|
8
22
|
--control-medium-gap: 0.5rem;
|
|
9
23
|
--control-medium-lineBoxHeight: 1.25rem;
|
|
10
|
-
--control-medium-paddingBlock: 0.375rem;
|
|
11
24
|
--control-medium-paddingInline-condensed: 0.5rem;
|
|
12
25
|
--control-medium-paddingInline-normal: 0.75rem;
|
|
13
26
|
--control-medium-paddingInline-spacious: 1rem;
|
|
@@ -22,13 +35,11 @@
|
|
|
22
35
|
--control-small-size: 1.75rem;
|
|
23
36
|
--control-xlarge-gap: 0.5rem;
|
|
24
37
|
--control-xlarge-lineBoxHeight: 1.25rem;
|
|
25
|
-
--control-xlarge-paddingBlock: 0.875rem;
|
|
26
38
|
--control-xlarge-paddingInline-normal: 0.75rem;
|
|
27
39
|
--control-xlarge-paddingInline-spacious: 1rem;
|
|
28
40
|
--control-xlarge-size: 3rem;
|
|
29
41
|
--control-xsmall-gap: 0.25rem;
|
|
30
42
|
--control-xsmall-lineBoxHeight: 1.25rem;
|
|
31
|
-
--control-xsmall-paddingBlock: 0.125rem;
|
|
32
43
|
--control-xsmall-paddingInline-condensed: 0.25rem;
|
|
33
44
|
--control-xsmall-paddingInline-normal: 0.5rem;
|
|
34
45
|
--control-xsmall-paddingInline-spacious: 0.75rem;
|
|
@@ -41,24 +52,13 @@
|
|
|
41
52
|
--controlStack-small-gap-condensed: 0.5rem;
|
|
42
53
|
--controlStack-small-gap-spacious: 1rem;
|
|
43
54
|
--overlay-borderRadius: 0.375rem;
|
|
44
|
-
--overlay-height-large: 27rem;
|
|
45
|
-
--overlay-height-medium: 20rem;
|
|
46
|
-
--overlay-height-small: 16rem;
|
|
47
|
-
--overlay-height-xlarge: 37.5rem;
|
|
48
|
-
--overlay-offset: 0.25rem;
|
|
49
55
|
--overlay-padding-condensed: 0.5rem;
|
|
50
56
|
--overlay-padding-normal: 1rem;
|
|
51
57
|
--overlay-paddingBlock-condensed: 0.25rem;
|
|
52
58
|
--overlay-paddingBlock-normal: 0.75rem;
|
|
53
|
-
--overlay-width-large: 40rem;
|
|
54
|
-
--overlay-width-medium: 30rem;
|
|
55
|
-
--overlay-width-small: 20rem;
|
|
56
|
-
--overlay-width-xlarge: 60rem;
|
|
57
|
-
--overlay-width-xsmall: 12rem;
|
|
58
59
|
--spinner-size-large: 4rem;
|
|
59
60
|
--spinner-size-medium: 2rem;
|
|
60
61
|
--spinner-size-small: 1rem;
|
|
61
|
-
--spinner-strokeWidth-default: 0.125rem;
|
|
62
62
|
--stack-gap-condensed: 0.5rem;
|
|
63
63
|
--stack-gap-normal: 1rem;
|
|
64
64
|
--stack-gap-spacious: 1.5rem;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
+
@custom-media --viewportRange-landscape (orientation: landscape);
|
|
1
2
|
@custom-media --viewportRange-narrow (max-width: calc(48rem - 0.02px));
|
|
2
3
|
@custom-media --viewportRange-narrowLandscape (max-width: calc(63.25rem - 0.02px) and (max-height: calc(34rem - 0.02px)) and (orientation: landscape));
|
|
4
|
+
@custom-media --viewportRange-portrait (orientation: portrait);
|
|
3
5
|
@custom-media --viewportRange-regular (min-width: 48rem);
|
|
4
6
|
@custom-media --viewportRange-wide (min-width: 87.5rem);
|
|
5
|
-
@custom-media --viewportRange-portrait (orientation: portrait);
|
|
6
|
-
@custom-media --viewportRange-landscape (orientation: landscape);
|