@primer/primitives 10.0.0-rc.7806f5e4 → 10.0.0-rc.b65e0a9f
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.
|
@@ -1,43 +1,23 @@
|
|
|
1
1
|
:root {
|
|
2
|
-
--text-codeInline-shorthand: var(--text-codeInline-weight) var(--text-codeInline-size) var(--fontStack-monospace); /* Inline code blocks using em units to inherit size from its parent. */
|
|
3
|
-
--text-codeInline-weight: var(--base-text-weight-normal);
|
|
4
2
|
--text-codeInline-size: 0.9285em;
|
|
5
|
-
--text-codeBlock-shorthand: var(--text-codeBlock-weight) var(--text-codeBlock-size) / var(--text-codeBlock-lineHeight) var(--fontStack-monospace); /* Default style for rendering code blocks. */
|
|
6
|
-
--text-codeBlock-weight: var(--base-text-weight-normal);
|
|
7
3
|
--text-codeBlock-lineHeight: 1.5385;
|
|
8
4
|
--text-codeBlock-size: 0.8125rem;
|
|
9
|
-
--text-caption-shorthand: var(--text-caption-weight) var(--text-caption-size) / var(--text-caption-lineHeight) var(--fontStack-sansSerif); /* Compact small font with a smaller line height of 16px. Use it for single-line scenarios, as the small sizing doesn’t pass accessibility requirements. */
|
|
10
|
-
--text-caption-weight: var(--base-text-weight-normal);
|
|
11
5
|
--text-caption-lineHeight: 1.3333;
|
|
12
6
|
--text-caption-size: 0.75rem;
|
|
13
|
-
--text-body-shorthand-small: var(--text-body-weight) var(--text-body-size-small) / var(--text-body-lineHeight-small) var(--fontStack-sansSerif); /* Small body text for discrete UI applications, such as helper, footnote text. Should be used sparingly across pages. Line-height matches Body (medium) at 20px. */
|
|
14
|
-
--text-body-shorthand-medium: var(--text-body-weight) var(--text-body-size-medium) / var(--text-body-lineHeight-medium) var(--fontStack-sansSerif); /* Default UI font. Most commonly used for body text. */
|
|
15
|
-
--text-body-shorthand-large: var(--text-body-weight) var(--text-body-size-large) / var(--text-body-lineHeight-large) var(--fontStack-sansSerif); /* User-generated content, markdown rendering. */
|
|
16
|
-
--text-body-weight: var(--base-text-weight-normal);
|
|
17
7
|
--text-body-lineHeight-small: 1.6666;
|
|
18
8
|
--text-body-lineHeight-medium: 1.4285;
|
|
19
9
|
--text-body-lineHeight-large: 1.5;
|
|
20
10
|
--text-body-size-small: 0.75rem;
|
|
21
11
|
--text-body-size-medium: 0.875rem;
|
|
22
12
|
--text-body-size-large: 1rem;
|
|
23
|
-
--text-subtitle-shorthand: var(--text-subtitle-weight) var(--text-subtitle-size) / var(--text-subtitle-lineHeight) var(--fontStack-sansSerifDisplay); /* Page sections/sub headings, or less important object names in page titles (automated action titles, for example). Same line-height as title (medium). */
|
|
24
|
-
--text-subtitle-weight: var(--base-text-weight-normal);
|
|
25
13
|
--text-subtitle-lineHeight: 1.6;
|
|
26
14
|
--text-subtitle-size: 1.25rem;
|
|
27
|
-
--text-title-shorthand-small: var(--text-title-weight-small) var(--text-title-size-small) / var(--text-title-lineHeight-small) var(--fontStack-sansSerif); /* Uses the same size as body (large) with a heavier weight of semibold (600). */
|
|
28
|
-
--text-title-shorthand-medium: var(--text-title-weight-medium) var(--text-title-size-medium) / var(--text-title-lineHeight-medium) var(--fontStack-sansSerifDisplay); /* Default page title. The 32px-equivalent line-height matches with button and other medium control heights. Great for page header composition. */
|
|
29
|
-
--text-title-shorthand-large: var(--text-title-weight-large) var(--text-title-size-large) / var(--text-title-lineHeight-large) var(--fontStack-sansSerifDisplay); /* Page headings for user-created objects, such as issues or pull requests. Utilize title (medium) styles on narrow viewports. */
|
|
30
|
-
--text-title-weight-small: var(--base-text-weight-semibold);
|
|
31
|
-
--text-title-weight-medium: var(--base-text-weight-semibold);
|
|
32
|
-
--text-title-weight-large: var(--base-text-weight-semibold);
|
|
33
15
|
--text-title-lineHeight-small: 1.5;
|
|
34
16
|
--text-title-lineHeight-medium: 1.6;
|
|
35
17
|
--text-title-lineHeight-large: 1.5;
|
|
36
18
|
--text-title-size-small: 1rem;
|
|
37
19
|
--text-title-size-medium: 1.25rem;
|
|
38
20
|
--text-title-size-large: 2rem;
|
|
39
|
-
--text-display-shorthand: var(--text-display-weight) var(--text-display-size) / var(--text-display-lineHeight) var(--fontStack-sansSerifDisplay); /* Hero-style text for brand to product transition pages. Utilize Title (large) styles on narrow viewports. */
|
|
40
|
-
--text-display-weight: var(--base-text-weight-medium);
|
|
41
21
|
--text-display-lineHeight: 1.4;
|
|
42
22
|
--text-display-size: 2.5rem;
|
|
43
23
|
--text-display-lineBoxHeight: 1.4;
|
|
@@ -45,4 +25,24 @@
|
|
|
45
25
|
--fontStack-sansSerifDisplay: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
|
|
46
26
|
--fontStack-sansSerif: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
|
|
47
27
|
--fontStack-system: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
|
|
28
|
+
--text-codeInline-weight: var(--base-text-weight-normal);
|
|
29
|
+
--text-codeBlock-weight: var(--base-text-weight-normal);
|
|
30
|
+
--text-caption-weight: var(--base-text-weight-normal);
|
|
31
|
+
--text-body-weight: var(--base-text-weight-normal);
|
|
32
|
+
--text-subtitle-weight: var(--base-text-weight-normal);
|
|
33
|
+
--text-title-weight-small: var(--base-text-weight-semibold);
|
|
34
|
+
--text-title-weight-medium: var(--base-text-weight-semibold);
|
|
35
|
+
--text-title-weight-large: var(--base-text-weight-semibold);
|
|
36
|
+
--text-display-weight: var(--base-text-weight-medium);
|
|
37
|
+
--text-codeInline-shorthand: var(--text-codeInline-weight) var(--text-codeInline-size) var(--fontStack-monospace); /* Inline code blocks using em units to inherit size from its parent. */
|
|
38
|
+
--text-codeBlock-shorthand: var(--text-codeBlock-weight) var(--text-codeBlock-size) / var(--text-codeBlock-lineHeight) var(--fontStack-monospace); /* Default style for rendering code blocks. */
|
|
39
|
+
--text-caption-shorthand: var(--text-caption-weight) var(--text-caption-size) / var(--text-caption-lineHeight) var(--fontStack-sansSerif); /* Compact small font with a smaller line height of 16px. Use it for single-line scenarios, as the small sizing doesn’t pass accessibility requirements. */
|
|
40
|
+
--text-body-shorthand-small: var(--text-body-weight) var(--text-body-size-small) / var(--text-body-lineHeight-small) var(--fontStack-sansSerif); /* Small body text for discrete UI applications, such as helper, footnote text. Should be used sparingly across pages. Line-height matches Body (medium) at 20px. */
|
|
41
|
+
--text-body-shorthand-medium: var(--text-body-weight) var(--text-body-size-medium) / var(--text-body-lineHeight-medium) var(--fontStack-sansSerif); /* Default UI font. Most commonly used for body text. */
|
|
42
|
+
--text-body-shorthand-large: var(--text-body-weight) var(--text-body-size-large) / var(--text-body-lineHeight-large) var(--fontStack-sansSerif); /* User-generated content, markdown rendering. */
|
|
43
|
+
--text-subtitle-shorthand: var(--text-subtitle-weight) var(--text-subtitle-size) / var(--text-subtitle-lineHeight) var(--fontStack-sansSerifDisplay); /* Page sections/sub headings, or less important object names in page titles (automated action titles, for example). Same line-height as title (medium). */
|
|
44
|
+
--text-title-shorthand-small: var(--text-title-weight-small) var(--text-title-size-small) / var(--text-title-lineHeight-small) var(--fontStack-sansSerif); /* Uses the same size as body (large) with a heavier weight of semibold (600). */
|
|
45
|
+
--text-title-shorthand-medium: var(--text-title-weight-medium) var(--text-title-size-medium) / var(--text-title-lineHeight-medium) var(--fontStack-sansSerifDisplay); /* Default page title. The 32px-equivalent line-height matches with button and other medium control heights. Great for page header composition. */
|
|
46
|
+
--text-title-shorthand-large: var(--text-title-weight-large) var(--text-title-size-large) / var(--text-title-lineHeight-large) var(--fontStack-sansSerifDisplay); /* Page headings for user-created objects, such as issues or pull requests. Utilize title (medium) styles on narrow viewports. */
|
|
47
|
+
--text-display-shorthand: var(--text-display-weight) var(--text-display-size) / var(--text-display-lineHeight) var(--fontStack-sansSerifDisplay); /* Hero-style text for brand to product transition pages. Utilize Title (large) styles on narrow viewports. */
|
|
48
48
|
}
|
package/dist/css/primitives.css
CHANGED
|
@@ -136,45 +136,25 @@
|
|
|
136
136
|
--overlay-offset: 0.25rem;
|
|
137
137
|
}
|
|
138
138
|
:root {
|
|
139
|
-
--text-codeInline-shorthand: var(--text-codeInline-weight) var(--text-codeInline-size) var(--fontStack-monospace); /* Inline code blocks using em units to inherit size from its parent. */
|
|
140
|
-
--text-codeInline-weight: var(--base-text-weight-normal);
|
|
141
139
|
--text-codeInline-size: 0.9285em;
|
|
142
|
-
--text-codeBlock-shorthand: var(--text-codeBlock-weight) var(--text-codeBlock-size) / var(--text-codeBlock-lineHeight) var(--fontStack-monospace); /* Default style for rendering code blocks. */
|
|
143
|
-
--text-codeBlock-weight: var(--base-text-weight-normal);
|
|
144
140
|
--text-codeBlock-lineHeight: 1.5385;
|
|
145
141
|
--text-codeBlock-size: 0.8125rem;
|
|
146
|
-
--text-caption-shorthand: var(--text-caption-weight) var(--text-caption-size) / var(--text-caption-lineHeight) var(--fontStack-sansSerif); /* Compact small font with a smaller line height of 16px. Use it for single-line scenarios, as the small sizing doesn’t pass accessibility requirements. */
|
|
147
|
-
--text-caption-weight: var(--base-text-weight-normal);
|
|
148
142
|
--text-caption-lineHeight: 1.3333;
|
|
149
143
|
--text-caption-size: 0.75rem;
|
|
150
|
-
--text-body-shorthand-small: var(--text-body-weight) var(--text-body-size-small) / var(--text-body-lineHeight-small) var(--fontStack-sansSerif); /* Small body text for discrete UI applications, such as helper, footnote text. Should be used sparingly across pages. Line-height matches Body (medium) at 20px. */
|
|
151
|
-
--text-body-shorthand-medium: var(--text-body-weight) var(--text-body-size-medium) / var(--text-body-lineHeight-medium) var(--fontStack-sansSerif); /* Default UI font. Most commonly used for body text. */
|
|
152
|
-
--text-body-shorthand-large: var(--text-body-weight) var(--text-body-size-large) / var(--text-body-lineHeight-large) var(--fontStack-sansSerif); /* User-generated content, markdown rendering. */
|
|
153
|
-
--text-body-weight: var(--base-text-weight-normal);
|
|
154
144
|
--text-body-lineHeight-small: 1.6666;
|
|
155
145
|
--text-body-lineHeight-medium: 1.4285;
|
|
156
146
|
--text-body-lineHeight-large: 1.5;
|
|
157
147
|
--text-body-size-small: 0.75rem;
|
|
158
148
|
--text-body-size-medium: 0.875rem;
|
|
159
149
|
--text-body-size-large: 1rem;
|
|
160
|
-
--text-subtitle-shorthand: var(--text-subtitle-weight) var(--text-subtitle-size) / var(--text-subtitle-lineHeight) var(--fontStack-sansSerifDisplay); /* Page sections/sub headings, or less important object names in page titles (automated action titles, for example). Same line-height as title (medium). */
|
|
161
|
-
--text-subtitle-weight: var(--base-text-weight-normal);
|
|
162
150
|
--text-subtitle-lineHeight: 1.6;
|
|
163
151
|
--text-subtitle-size: 1.25rem;
|
|
164
|
-
--text-title-shorthand-small: var(--text-title-weight-small) var(--text-title-size-small) / var(--text-title-lineHeight-small) var(--fontStack-sansSerif); /* Uses the same size as body (large) with a heavier weight of semibold (600). */
|
|
165
|
-
--text-title-shorthand-medium: var(--text-title-weight-medium) var(--text-title-size-medium) / var(--text-title-lineHeight-medium) var(--fontStack-sansSerifDisplay); /* Default page title. The 32px-equivalent line-height matches with button and other medium control heights. Great for page header composition. */
|
|
166
|
-
--text-title-shorthand-large: var(--text-title-weight-large) var(--text-title-size-large) / var(--text-title-lineHeight-large) var(--fontStack-sansSerifDisplay); /* Page headings for user-created objects, such as issues or pull requests. Utilize title (medium) styles on narrow viewports. */
|
|
167
|
-
--text-title-weight-small: var(--base-text-weight-semibold);
|
|
168
|
-
--text-title-weight-medium: var(--base-text-weight-semibold);
|
|
169
|
-
--text-title-weight-large: var(--base-text-weight-semibold);
|
|
170
152
|
--text-title-lineHeight-small: 1.5;
|
|
171
153
|
--text-title-lineHeight-medium: 1.6;
|
|
172
154
|
--text-title-lineHeight-large: 1.5;
|
|
173
155
|
--text-title-size-small: 1rem;
|
|
174
156
|
--text-title-size-medium: 1.25rem;
|
|
175
157
|
--text-title-size-large: 2rem;
|
|
176
|
-
--text-display-shorthand: var(--text-display-weight) var(--text-display-size) / var(--text-display-lineHeight) var(--fontStack-sansSerifDisplay); /* Hero-style text for brand to product transition pages. Utilize Title (large) styles on narrow viewports. */
|
|
177
|
-
--text-display-weight: var(--base-text-weight-medium);
|
|
178
158
|
--text-display-lineHeight: 1.4;
|
|
179
159
|
--text-display-size: 2.5rem;
|
|
180
160
|
--text-display-lineBoxHeight: 1.4;
|
|
@@ -182,4 +162,24 @@
|
|
|
182
162
|
--fontStack-sansSerifDisplay: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
|
|
183
163
|
--fontStack-sansSerif: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
|
|
184
164
|
--fontStack-system: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
|
|
165
|
+
--text-codeInline-weight: var(--base-text-weight-normal);
|
|
166
|
+
--text-codeBlock-weight: var(--base-text-weight-normal);
|
|
167
|
+
--text-caption-weight: var(--base-text-weight-normal);
|
|
168
|
+
--text-body-weight: var(--base-text-weight-normal);
|
|
169
|
+
--text-subtitle-weight: var(--base-text-weight-normal);
|
|
170
|
+
--text-title-weight-small: var(--base-text-weight-semibold);
|
|
171
|
+
--text-title-weight-medium: var(--base-text-weight-semibold);
|
|
172
|
+
--text-title-weight-large: var(--base-text-weight-semibold);
|
|
173
|
+
--text-display-weight: var(--base-text-weight-medium);
|
|
174
|
+
--text-codeInline-shorthand: var(--text-codeInline-weight) var(--text-codeInline-size) var(--fontStack-monospace); /* Inline code blocks using em units to inherit size from its parent. */
|
|
175
|
+
--text-codeBlock-shorthand: var(--text-codeBlock-weight) var(--text-codeBlock-size) / var(--text-codeBlock-lineHeight) var(--fontStack-monospace); /* Default style for rendering code blocks. */
|
|
176
|
+
--text-caption-shorthand: var(--text-caption-weight) var(--text-caption-size) / var(--text-caption-lineHeight) var(--fontStack-sansSerif); /* Compact small font with a smaller line height of 16px. Use it for single-line scenarios, as the small sizing doesn’t pass accessibility requirements. */
|
|
177
|
+
--text-body-shorthand-small: var(--text-body-weight) var(--text-body-size-small) / var(--text-body-lineHeight-small) var(--fontStack-sansSerif); /* Small body text for discrete UI applications, such as helper, footnote text. Should be used sparingly across pages. Line-height matches Body (medium) at 20px. */
|
|
178
|
+
--text-body-shorthand-medium: var(--text-body-weight) var(--text-body-size-medium) / var(--text-body-lineHeight-medium) var(--fontStack-sansSerif); /* Default UI font. Most commonly used for body text. */
|
|
179
|
+
--text-body-shorthand-large: var(--text-body-weight) var(--text-body-size-large) / var(--text-body-lineHeight-large) var(--fontStack-sansSerif); /* User-generated content, markdown rendering. */
|
|
180
|
+
--text-subtitle-shorthand: var(--text-subtitle-weight) var(--text-subtitle-size) / var(--text-subtitle-lineHeight) var(--fontStack-sansSerifDisplay); /* Page sections/sub headings, or less important object names in page titles (automated action titles, for example). Same line-height as title (medium). */
|
|
181
|
+
--text-title-shorthand-small: var(--text-title-weight-small) var(--text-title-size-small) / var(--text-title-lineHeight-small) var(--fontStack-sansSerif); /* Uses the same size as body (large) with a heavier weight of semibold (600). */
|
|
182
|
+
--text-title-shorthand-medium: var(--text-title-weight-medium) var(--text-title-size-medium) / var(--text-title-lineHeight-medium) var(--fontStack-sansSerifDisplay); /* Default page title. The 32px-equivalent line-height matches with button and other medium control heights. Great for page header composition. */
|
|
183
|
+
--text-title-shorthand-large: var(--text-title-weight-large) var(--text-title-size-large) / var(--text-title-lineHeight-large) var(--fontStack-sansSerifDisplay); /* Page headings for user-created objects, such as issues or pull requests. Utilize title (medium) styles on narrow viewports. */
|
|
184
|
+
--text-display-shorthand: var(--text-display-weight) var(--text-display-size) / var(--text-display-lineHeight) var(--fontStack-sansSerifDisplay); /* Hero-style text for brand to product transition pages. Utilize Title (large) styles on narrow viewports. */
|
|
185
185
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@primer/primitives",
|
|
3
|
-
"version": "10.0.0-rc.
|
|
3
|
+
"version": "10.0.0-rc.b65e0a9f",
|
|
4
4
|
"description": "Typography, spacing, and color primitives for Primer design system",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"files": [
|
|
@@ -46,9 +46,6 @@
|
|
|
46
46
|
"test:integration": "vitest run -r integration"
|
|
47
47
|
},
|
|
48
48
|
"prettier": "@github/prettier-config",
|
|
49
|
-
"dependencies": {
|
|
50
|
-
"@prettier/sync": "^0.5.2"
|
|
51
|
-
},
|
|
52
49
|
"devDependencies": {
|
|
53
50
|
"@actions/github": "^6.0.0",
|
|
54
51
|
"@changesets/changelog-github": "^0.5.0",
|
|
@@ -76,16 +73,13 @@
|
|
|
76
73
|
"json5": "^2.2.1",
|
|
77
74
|
"markdown-table-ts": "^1.0.3",
|
|
78
75
|
"prettier": "^3.3.3",
|
|
79
|
-
"style-dictionary": "^4.
|
|
76
|
+
"style-dictionary": "^4.1.3",
|
|
80
77
|
"tsx": "^4.19.0",
|
|
81
78
|
"typescript": "5.5",
|
|
82
79
|
"vitest": "^2.0.3",
|
|
83
80
|
"zod": "3.23",
|
|
84
81
|
"zod-validation-error": "3.3"
|
|
85
82
|
},
|
|
86
|
-
"peerDependencies": {
|
|
87
|
-
"style-dictionary": "^4.0.1"
|
|
88
|
-
},
|
|
89
83
|
"optionalDependencies": {
|
|
90
84
|
"@rollup/rollup-linux-x64-gnu": "^4.22.0"
|
|
91
85
|
}
|